#root{min-height:100vh}.app-shell{max-width:1380px;margin:0 auto;padding:1.2rem;display:flex;flex-direction:column;gap:1rem}.app-header{display:flex;justify-content:space-between;align-items:center;gap:.9rem}.app-header h1{font-size:clamp(1.2rem,2.2vw,2rem)}.app-header p{color:#9caac3;margin-top:.35rem}.top-nav{display:flex;gap:.55rem;border:1px solid rgba(123,143,173,.28);border-radius:.72rem;padding:.45rem;background:#0c1827d1}.top-nav button{border:1px solid rgba(122,147,183,.32);border-radius:.55rem;padding:.4rem .8rem;background:#111e31db;color:#d8e4f9;cursor:pointer}.top-nav button.active{border-color:#54b1ffe6;background:linear-gradient(180deg,#264f74,#1f3a57)}.status-badge{display:inline-flex;align-items:center;gap:.45rem;border-radius:999px;padding:.32rem .8rem;font-weight:600;font-size:.9rem;text-transform:uppercase;letter-spacing:.04em;border:1px solid transparent}.status-dot{width:.55rem;height:.55rem;border-radius:999px;background:currentColor}.status-running{color:#2dd4bf;border-color:#2dd4bf59;background:#2dd4bf24}.status-idle{color:#fbbf24;border-color:#fbbf2459;background:#fbbf2424}.status-stopped{color:#93c5fd;border-color:#93c5fd59;background:#93c5fd24}.status-fault{color:#f87171;border-color:#f8717159;background:#f8717124}.stats-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:.8rem}.machine-overview-grid{display:grid;grid-template-columns:repeat(1,minmax(0,1fr));gap:.65rem}.machine-overview{text-align:left;border:1px solid rgba(130,149,183,.25);border-radius:.65rem;background:#0d192ccc;color:#e8edf5;padding:.65rem;cursor:pointer}.machine-overview:hover{border-color:#7ed3f773}.machine-overview.selected{border-color:#60a5fabf;box-shadow:0 0 0 1px #60a5fa33 inset}.machine-overview-header{display:flex;justify-content:space-between;align-items:center;gap:.4rem}.machine-overview-header h3{font-size:1rem}.machine-state-pill{border-radius:999px;padding:.12rem .5rem;text-transform:uppercase;font-size:.75rem;border:1px solid transparent}.machine-overview-metrics{margin-top:.5rem;display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:.35rem;color:#b7c6de;font-size:.85rem}.state-running{color:#2dd4bf;border-color:#2dd4bf59;background:#2dd4bf1f}.state-idle{color:#fbbf24;border-color:#fbbf2459;background:#fbbf241f}.state-stopped{color:#93c5fd;border-color:#93c5fd59;background:#93c5fd1f}.state-fault{color:#f87171;border-color:#f8717159;background:#f871711f}.dashboard-grid,.config-page-grid{display:grid;gap:.8rem}.left-column,.right-column{display:flex;flex-direction:column;gap:.8rem}.panel{border:1px solid rgba(130,149,183,.25);border-radius:.8rem;background:linear-gradient(180deg,#162136f2,#0e1627f2);padding:.75rem}.selected-info h2{font-size:1rem}.selected-meta{margin-top:.45rem;display:flex;flex-wrap:wrap;gap:.7rem;color:#bfd0ea}.order-context-panel h2{font-size:1rem}.order-context-grid{margin-top:.45rem;display:grid;gap:.6rem}.order-context-block{border:1px solid rgba(130,149,183,.25);border-radius:.65rem;padding:.6rem;background:#0814228c}.order-context-block h3{font-size:.86rem;color:#9ec5f8;text-transform:uppercase;letter-spacing:.04em}.order-kv-grid{margin-top:.45rem;display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:.45rem .7rem}.order-kv-grid p{display:flex;flex-direction:column;gap:.16rem}.order-kv-grid span{color:#8ea8cc;font-size:.78rem}.order-kv-grid strong{color:#e5eefc;font-size:.95rem}.order-empty{margin-top:.45rem;color:#a7bad8}.stat-card{display:flex;flex-direction:column;gap:.2rem}.stat-label{color:#98a9c7;font-size:.83rem;text-transform:uppercase;letter-spacing:.04em}.stat-value{font-size:1.02rem;font-weight:600}.machine-panel{min-height:280px}.machine-header{display:flex;align-items:center;justify-content:space-between}.status-light{width:1rem;height:1rem;border-radius:999px;box-shadow:0 0 8px currentColor}.light-running{color:#22c55e;background:#22c55e}.light-idle{color:#f59e0b;background:#f59e0b}.light-stopped{color:#94a3b8;background:#94a3b8}.light-fault{color:#ef4444;background:#ef4444}.real-machine-panel{overflow:hidden}.machine-scene{position:relative;margin-top:.8rem;min-height:350px;border:1px solid rgba(121,146,182,.3);border-radius:.8rem;background:linear-gradient(160deg,#0a1826f2,#0f1e2fe6 45%,#0c1b27e6),repeating-linear-gradient(45deg,#7a96af0d 0px 12px,#101e2f0a 12px 24px);overflow:hidden}.pipe-svg{position:absolute;inset:0;width:100%;height:100%}.pipe-base{fill:none;stroke:#6a7f96;stroke-width:12px;stroke-linecap:round;stroke-linejoin:round}.pipe-flow{fill:none;stroke:#37c6ff;stroke-width:5px;stroke-linecap:round;stroke-linejoin:round;opacity:.2;stroke-dasharray:8 14}.pipe-flow.active{opacity:.95}.press-rig{position:absolute;left:15%;bottom:16%;width:43%;height:72%}.press-column{position:absolute;width:16%;top:8%;bottom:22%;border-radius:.45rem;background:linear-gradient(180deg,#8297ab,#516273 65%,#324353);box-shadow:inset 0 0 0 1px #0e19247a}.press-column.left{left:8%}.press-column.right{right:8%}.press-crosshead{position:absolute;left:5%;right:5%;top:2%;height:13%;border-radius:.4rem;background:linear-gradient(180deg,#8698ae,#4a5d70)}.press-ram-head{position:absolute;left:40%;width:20%;top:11%;height:13%;border-radius:.3rem;background:linear-gradient(180deg,#e4ebf4,#9ca8b6);box-shadow:0 0 0 1px #0e18244d}.press-ram{position:absolute;left:47%;top:23%;width:6%;height:37%;border-radius:.2rem;background:linear-gradient(180deg,#e8f0fb,#a5b2c4)}.press-bed{position:absolute;left:4%;right:4%;bottom:14%;height:14%;border-radius:.4rem;background:linear-gradient(180deg,#667b92,#3c4f66)}.press-die{position:absolute;left:36%;right:36%;bottom:22%;height:10%;border-radius:.3rem;background:linear-gradient(180deg,#98afc6,#5e748d)}.hydraulic-skid{position:absolute;left:66%;top:20%;width:17%;border:1px solid rgba(136,164,194,.4);border-radius:.65rem;padding:.5rem;background:#0d1c2bdb;cursor:pointer}.hydraulic-skid:focus-visible,.conveyor-shell:focus-visible{outline:2px solid #56c3ff;outline-offset:2px}.motor-shell{height:56px;border:1px solid rgba(136,164,194,.4);border-radius:.5rem;display:grid;place-items:center;background:linear-gradient(180deg,#3e566f80,#1d2b3bb3)}.pump-rotor{width:34px;height:34px;border-radius:999px;border:3px solid #cddbf0;border-top-color:#2ac6ff}.skid-label{margin-top:.45rem;font-size:.78rem;color:#c7d8f4;text-align:center}.conveyor-shell{position:absolute;left:9%;bottom:8%;width:30%;border:1px solid rgba(136,164,194,.4);border-radius:.7rem;padding:.45rem;background:#0e1c2be0;cursor:pointer}.belt-track{height:18px;border-radius:.35rem;background:repeating-linear-gradient(90deg,#a1b2c4e6 0px 26px,#485969f2 26px 48px),linear-gradient(180deg,#596f88cc,#2d3e4ef5)}.scene-e-stop{position:absolute;right:4%;top:8%;border:1px solid rgba(246,121,121,.66);background:linear-gradient(180deg,#872123,#5f1719);color:#ffecec;border-radius:999px;font-weight:700;letter-spacing:.05em;padding:.45rem .95rem;cursor:pointer}.param-card{position:absolute;border:1px solid rgba(136,164,194,.36);border-radius:.55rem;background:#091625e0;min-width:132px;padding:.44rem .55rem}.param-card h4{font-size:.72rem;letter-spacing:.05em;text-transform:uppercase;color:#93abc7}.param-card p{margin-top:.18rem;color:#dbe8fb;font-size:.88rem}.param-temp{left:9%;top:8%}.param-pressure{left:45%;top:7%}.param-cycle{left:64%;bottom:9%}.param-quality{right:4%;bottom:9%}.machine-controls{margin-top:.75rem;display:flex;gap:.45rem}.control-btn{border-radius:.48rem;border:1px solid rgba(116,143,178,.46);color:#f4f8ff;padding:.35rem .75rem;cursor:pointer}.control-btn.run{background:linear-gradient(180deg,#1f8055,#14573a);border-color:#41da8e7a}.control-btn.idle{background:linear-gradient(180deg,#8a6522,#614815);border-color:#f5bb5b94}.control-btn.stop{background:linear-gradient(180deg,#8e2b2f,#611d20);border-color:#f686868c}.machine-caption,.machine-events{margin-top:.7rem;color:#c8d6ea}.gauges-grid{display:grid;gap:.75rem}.gauge-panel h3{font-size:.98rem}.gauge-dial{margin:.45rem auto;width:180px;height:100px;position:relative}.gauge-arc{position:absolute;inset:0;border:10px solid rgba(80,94,124,.85);border-bottom:none;border-radius:180px 180px 0 0}.gauge-needle{width:3px;height:76px;background:#f8f9ff;position:absolute;left:50%;bottom:0;transform-origin:50% calc(100% - 8px);border-radius:4px}.gauge-hub{width:14px;height:14px;border-radius:999px;background:#f8f9ff;position:absolute;left:50%;margin-left:-7px;bottom:0}.gauge-value{text-align:center;font-size:1.15rem;font-weight:600}.gauge-value span{color:#9fafd0;font-size:.85rem}.gauge-zones{position:relative;margin:.45rem 0 .3rem;height:10px;border-radius:999px;overflow:hidden;background:#23344ccc}.zone{position:absolute;top:0;height:100%}.zone.safe{background:#40cc92bf}.zone.tolerance{background:#ef6f6f94}.zone-marker{position:absolute;top:-3px;margin-left:-4px;width:8px;height:16px;border-radius:999px;background:#f8fbff;box-shadow:0 0 10px #f6faffb3}.gauge-status{margin-bottom:.25rem;font-size:.78rem;color:#adc2df;text-transform:uppercase;letter-spacing:.04em}.gauge-scale{display:flex;justify-content:space-between;color:#92a2c0;font-size:.8rem}.gauge-safe{border-color:#38cc8e7a;box-shadow:inset 0 0 0 1px #38cc8e2e}.gauge-low-tolerance,.gauge-high-tolerance{border-color:#f784848f;box-shadow:inset 0 0 0 1px #f7848433}.chart-header{display:flex;justify-content:space-between;align-items:center}.chart-header span{color:#9eb2d0}.sparkline{margin-top:.6rem;width:100%;height:150px}.chart-panel{transition:border-color .2s ease,box-shadow .2s ease}.chart-safe{border-color:#40cc927a}.chart-low-tolerance,.chart-high-tolerance{border-color:#ef6f6f94}.chart-zone.safe{fill:#40cc9221}.chart-zone.tolerance{fill:#ef6f6f1a}.chart-grid-line{stroke:#8da4c640;stroke-width:1}.chart-grid-line.x{stroke-dasharray:4 4}.chart-axis-line{stroke:#adc0db80;stroke-width:1.2}.chart-tick-label{font-size:8px;fill:#9fb3d1}.chart-tick-label.time{font-size:7.3px}.chart-latest-dot{filter:drop-shadow(0 0 6px rgba(133,206,255,.55))}.chart-footer{margin-top:.3rem;color:#9fb4d3;font-size:.76rem}.operations-note{display:flex;flex-direction:column;gap:.45rem}.operations-note h2{font-size:.98rem}.operations-note p{color:#b9cadf}.config-panel{display:flex;flex-direction:column;gap:.6rem}.config-panel label{display:flex;flex-direction:column;gap:.4rem;color:#d7e3f7}.config-panel input[type=number],.config-panel select{border-radius:.4rem;border:1px solid rgba(132,149,178,.3);background:#0b1424cc;color:#eef4ff;padding:.38rem .45rem}.quick-state-row{display:flex;justify-content:space-between;align-items:center;gap:.8rem;color:#cbdaf0}.quick-state-buttons{display:flex;gap:.45rem}.event-grid{display:flex;flex-direction:column;gap:.5rem}.event-row{display:grid;grid-template-columns:1fr 90px 70px;align-items:center;gap:.4rem}.event-row label{flex-direction:row;align-items:center;gap:.45rem;text-transform:capitalize}.range-grid{display:flex;flex-direction:column;gap:.5rem}.wo-import-panel{border:1px solid rgba(130,149,183,.25);border-radius:.6rem;background:#09162599;padding:.55rem;display:flex;flex-direction:column;gap:.5rem}.wo-import-header{display:flex;align-items:baseline;justify-content:space-between;gap:.8rem;color:#d7e3f7}.wo-import-header span{font-weight:600}.wo-import-header small{color:#a3b6d3}.wo-import-actions{display:flex;flex-wrap:wrap;gap:.45rem}.range-row{display:grid;grid-template-columns:1fr 80px 80px;align-items:center;gap:.4rem}.range-row label{color:#d7e3f7}.event-row button,.primary-btn{border:1px solid rgba(126,145,177,.45);border-radius:.4rem;background:linear-gradient(180deg,#385279,#263953);color:#f8fbff;padding:.35rem .52rem;cursor:pointer}.secondary-btn{border:1px solid rgba(126,145,177,.45);border-radius:.4rem;background:linear-gradient(180deg,#344f72,#243651);color:#f8fbff;padding:.35rem .52rem;cursor:pointer;text-decoration:none;display:inline-flex;align-items:center;justify-content:center}.file-upload-btn input{display:none}.primary-btn{width:160px}.app-footer{color:#9cb0cf;font-size:.92rem}@media(max-width:760px){.machine-scene{min-height:430px}.press-rig{left:5%;width:63%;height:56%;bottom:30%}.hydraulic-skid{left:66%;top:34%;width:30%}.conveyor-shell{left:5%;width:40%;bottom:6%}.param-temp{left:4%;top:4%}.param-pressure{left:38%;top:4%}.param-cycle{left:50%;bottom:5%}.param-quality{right:3%;bottom:5%}.order-kv-grid{grid-template-columns:1fr}}@media(min-width:920px){.stats-grid{grid-template-columns:repeat(6,minmax(0,1fr))}.machine-overview-grid{grid-template-columns:repeat(3,minmax(0,1fr))}.dashboard-grid{grid-template-columns:1.26fr 1fr}.config-page-grid{grid-template-columns:.95fr 1.2fr}.gauges-grid{grid-template-columns:repeat(3,minmax(0,1fr))}.order-context-grid{grid-template-columns:1fr 1fr}}:root{font-family:Rajdhani,Trebuchet MS,Segoe UI,sans-serif;color:#e8edf5;background:#0f1724}*{box-sizing:border-box}body{margin:0;min-width:320px;background:radial-gradient(circle at 20% 10%,#1f2a44,transparent 35%),radial-gradient(circle at 80% 80%,#123448,transparent 40%),#0f1724}button,input{font:inherit}h1,h2,h3,p{margin:0}
