:root{color-scheme:dark;--bg:#0b151e;--panel:#12232f;--line:#2b4456;--ink:#edf3f7;--muted:#9eb6c8;--accent:#f1bd7c;--teal:#76ddce;--stage:#0b1925;--field:#70c1d2;--dial:#e9f0ed;--dial-ink:#213845;font-family:Inter,'Segoe UI',sans-serif}
:root[data-theme=light]{color-scheme:light;--bg:#edf3f6;--panel:#fff;--line:#cad9e2;--ink:#193442;--muted:#536e7d;--accent:#955313;--teal:#087d73;--stage:#e4eef3;--field:#31808c;--dial:#f5f5ea;--dial-ink:#213845}
*{box-sizing:border-box}[hidden]{display:none!important}body{margin:0;padding:20px max(20px,env(safe-area-inset-right)) max(84px,env(safe-area-inset-bottom)) max(20px,env(safe-area-inset-left));background:var(--bg);color:var(--ink)}button,input,a{font:inherit;touch-action:manipulation}button{min-height:44px;padding:10px 13px;color:var(--ink);background:var(--panel);border:1px solid var(--line);border-radius:9px;cursor:pointer}button:hover{border-color:var(--accent)}button:disabled{opacity:.4;cursor:default}button:focus-visible,input:focus-visible,a:focus-visible,canvas:focus-visible{outline:3px solid var(--teal);outline-offset:3px}button[aria-pressed=true]{border-color:var(--teal)}a{color:var(--teal);text-decoration:none}header{max-width:1760px;margin:0 auto 20px;display:flex;gap:16px;align-items:center}.back{font-size:13px;min-height:44px;display:flex;align-items:center}.heading{flex:1}.eyebrow{font-size:10px;letter-spacing:.15em;color:var(--accent)}h1{font-size:24px;letter-spacing:.01em;margin:5px 0 0}header button{font-size:12px}h2{font-size:15px;margin:0 0 20px;font-weight:600}
.lab{display:grid;grid-template-columns:230px minmax(0,1fr) 270px;gap:16px;max-width:1760px;margin:auto;align-items:start}.panel{border:1px solid var(--line);border-radius:15px;background:var(--panel);min-width:0}.controls{padding:20px}.range-label{display:flex;align-items:center;justify-content:space-between;gap:5px;font-size:12px}.range-label>span{display:flex;align-items:center;gap:4px}.range-label output{color:var(--accent);font-variant-numeric:tabular-nums}.range-label input[type=number]{width:61px;border:1px solid var(--line);background:var(--bg);color:var(--ink);border-radius:7px;min-height:38px;padding:5px}input[type=range]{width:100%;min-height:36px;margin:7px 0 10px;accent-color:var(--accent);cursor:pointer}.limits{display:flex;justify-content:space-between;font-size:10px;color:var(--muted);margin-top:-6px}.movement{display:grid;grid-template-columns:1fr 1fr;gap:8px;margin:16px 0 8px}.movement button{font-size:13px}.wide{width:100%;font-size:12px}.separator{height:1px;background:var(--line);margin:20px 0}.check{display:flex;align-items:center;gap:8px;font-size:12px;min-height:36px;cursor:pointer}.check input{width:17px;height:17px;accent-color:var(--teal)}.reset{margin-top:18px;color:var(--accent)}
.stage-panel{overflow:hidden}.stage-top{padding:15px 17px;display:flex;justify-content:space-between;align-items:center;gap:12px;border-bottom:1px solid var(--line);font-size:11px}.live{color:var(--teal)}.live:before{content:'';display:inline-block;width:6px;height:6px;background:currentColor;border-radius:50%;margin-right:8px}.circuit{color:var(--muted);border:1px solid var(--line);border-radius:20px;padding:5px 9px}.stage{position:relative;background:radial-gradient(ellipse at 45% 30%,color-mix(in srgb,var(--field) 10%,var(--stage)),var(--stage) 70%)}#scene{width:100%;height:clamp(470px,68vh,790px);display:block;touch-action:none;cursor:grab}#scene.dragging{cursor:grabbing}#view-message{position:absolute;left:16px;right:16px;top:14px;font-size:12px;color:var(--accent);pointer-events:none}#view-message:empty{display:none}.stage-bottom{display:flex;justify-content:space-between;align-items:center;gap:8px;padding:11px 14px;border-top:1px solid var(--line);color:var(--muted);font-size:10px}.stage-bottom>div{display:flex;gap:6px}.stage-bottom button{font-size:11px;white-space:nowrap}
.instrument-column{display:grid;gap:14px}.instrument{padding:18px}.instrument-heading{display:flex;justify-content:space-between;align-items:center;gap:8px}.instrument-heading h2{margin:0}.instrument-heading span{font-size:10px;color:var(--muted)}#dial{display:block;width:100%;margin:20px 0 8px}.dial-case{fill:var(--dial);stroke:#516671;stroke-width:3}.dial-arc,.dial-ticks path{fill:none;stroke:var(--dial-ink);stroke-width:2}.dial-numbers text{fill:var(--dial-ink);font:13px 'Segoe UI',sans-serif;text-anchor:middle}.dial-numbers .unit{font-size:18px;font-weight:bold}#dial-needle path{stroke:#c84736;stroke-width:3;stroke-linecap:round}#dial-needle circle{fill:#34414b}.terminal.red{fill:#c94c40}.terminal.black{fill:#303e46}.current-value{display:flex;align-items:baseline;justify-content:center;gap:7px;font-variant-numeric:tabular-nums}.current-value output{font-size:35px;font-weight:600;color:var(--teal)}.current-value>span{font-size:13px;color:var(--muted)}.direction{min-height:30px;text-align:center;font-size:11px;line-height:1.5;color:var(--muted);margin:10px 0 14px}.accent{background:color-mix(in srgb,var(--accent) 12%,var(--panel));border-color:var(--accent);color:var(--accent)}#overload{color:#ee9279;text-align:center;font-size:12px}#meter-storage{display:flex;gap:12px;align-items:center;margin-top:14px;font-size:11px;color:var(--muted);border:1px dashed var(--line);padding:12px;border-radius:9px}.storage-icon{display:grid;place-items:center;width:35px;height:30px;border:2px solid var(--muted);border-radius:5px;font-size:20px}.instrument.stowed #dial{opacity:.2}.instrument.stowed .current-value output{color:var(--muted)}.readings{padding:16px}.readings>div{display:flex;gap:8px;justify-content:space-between;font-size:11px;padding:10px 0}.readings>div+div{border-top:1px solid var(--line)}.readings span{color:var(--muted)}.readings output{font-variant-numeric:tabular-nums}footer{display:flex;gap:18px;justify-content:center;margin:20px auto 0;max-width:1760px;font-size:11px;color:var(--muted)}
@media(max-width:1180px){.lab{grid-template-columns:205px minmax(0,1fr)}.instrument-column{grid-column:1/-1;grid-template-columns:minmax(0,1fr) minmax(0,1fr)}.instrument{display:grid;grid-template-columns:180px 1fr;gap:4px 20px;align-items:center}.instrument-heading{grid-column:1/-1}#dial{grid-row:2/6;margin:8px 0}#meter-storage{grid-column:1/-1}.direction{margin:0;min-height:0}.current-value output{font-size:32px}.readings{align-self:start}#scene{height:590px}}
@media(max-width:700px){body{padding:12px 10px max(90px,env(safe-area-inset-bottom))}header{gap:9px;flex-wrap:wrap;margin-bottom:14px}h1{font-size:20px}.eyebrow{font-size:9px}header button{font-size:10px;padding:8px}.lab{display:flex;flex-direction:column;gap:12px}.stage-panel{order:0;width:100%}.instrument-column{order:1;width:100%;display:block}.readings{margin-top:12px;display:flex;flex-wrap:wrap;gap:14px;padding:9px 13px}.readings>div{flex:1;min-width:130px;gap:8px}.readings>div+div{border:0}.controls{order:2;width:100%;display:grid;grid-template-columns:1fr 1fr;gap:0 18px;padding:16px}.controls h2,.controls .range-label,.controls>input,.controls>.limits,.controls>.separator{grid-column:1/-1}.movement{margin:6px 0}.controls>#reverse{align-self:center}.controls .separator{margin:12px 0}.controls .reset{margin:8px 0}.check{font-size:11px}.controls>label[for=speed],.controls>label[for=strength]{margin-top:6px}#scene{height:510px}.stage-top{font-size:10px;padding:11px}.stage-bottom{flex-wrap:wrap;padding:10px;font-size:10px}.stage-bottom>div{margin-left:auto}.instrument{padding:15px;grid-template-columns:160px 1fr;gap:4px 12px}.current-value output{font-size:27px}footer{flex-wrap:wrap;gap:8px;font-size:10px;text-align:center}}
@media(prefers-reduced-motion:reduce){*{scroll-behavior:auto}}
