@import url('');
:root{color-scheme:dark;--bg:#091316;--panel:#111d20;--line:#25383b;--line2:#304344;--muted:#8c9da0;--text:#e1e8df;--accent:#e5b86c;--teal:#81c5b8;--red:#bd7064;--font-ui:Inter,ui-sans-serif,system-ui,-apple-system,BlinkMacSystemFont,'Segoe UI',sans-serif;--font-mono:ui-monospace,SFMono-Regular,Consolas,monospace}
*{box-sizing:border-box}html,body{padding:0;margin:0;background:var(--bg);color:var(--text);font:14px/1.55 var(--font-ui);min-width:320px}button,input{font:inherit}button{cursor:pointer}button:focus-visible,input:focus-visible,a:focus-visible{outline:2px solid var(--accent);outline-offset:3px}#app{min-height:100vh;background:radial-gradient(ellipse at 49% -15%,#183136 0%,#091316 55%)}
.masthead{height:85px;border-bottom:1px solid #283a3d;display:flex;align-items:center;justify-content:space-between;gap:22px;padding:0 clamp(20px,2.3vw,46px);background:#101d20cc}.brand{display:flex;align-items:center;gap:13px}.brandmark{width:43px;height:43px;border:1px solid #ab8660;border-radius:50%;display:grid;place-items:center;color:var(--accent);font-size:31px;background:#382d254d}.brand-wheel{line-height:1}.brand-heading{font:800 21px/1.2 var(--font-ui);letter-spacing:.08em;color:#fff}.brand-heading span{font-weight:400;color:var(--accent)}.brand-caption{font:10px/1.8 var(--font-mono);letter-spacing:.20em;color:#a0b2ad}.mast-meta{font:11px var(--font-mono);letter-spacing:.12em;color:#91aba4;display:flex;align-items:center;gap:11px}.micro-dot,.live-dot{width:7px;height:7px;background:var(--teal);border-radius:50%;box-shadow:0 0 13px #77c9af72}.meta-divider{width:1px;height:16px;background:#465b57}.ghost{background:transparent;color:#c4d4cc;border:1px solid #435454;border-radius:5px}.ghost:hover{background:#223235}.small{padding:10px 15px;font-size:12px}
.workspace{display:grid;grid-template-columns:minmax(260px,295px) minmax(450px,1fr) minmax(255px,292px);gap:18px;max-width:1940px;padding:18px clamp(15px,1.65vw,32px) 24px;margin:auto}.panel{border:1px solid var(--line);background:linear-gradient(160deg,#152326 0%,#101b1f 58%,#0d191c 100%);border-radius:7px;padding:23px 20px}.panel-eyebrow,.eyebrow{display:block;font:10px var(--font-mono);letter-spacing:.16em;color:#b99865}.panel h2{margin:6px 0 8px;font-size:21px;font-weight:650;letter-spacing:-.025em}.panel-intro{font-size:12.7px;color:#9bb0ac;margin:0 0 20px}.dual-actions{display:grid;grid-template-columns:1.4fr 1fr;gap:8px}.action{border-radius:4px;padding:11px 5px;font-weight:650;font-size:12px;white-space:nowrap}.primary{background:linear-gradient(135deg,#dfbb79,#c9924e);border:1px solid #d2a15f;color:#172123;font-weight:760}.primary:hover{filter:brightness(1.08)}.control-cluster{padding-top:25px}.label-line{display:flex;justify-content:space-between;align-items:center;font-size:12px;color:#d3dfd6;margin-bottom:11px}.label-line output{font-family:var(--font-mono);color:var(--accent);font-size:11px}.control-note{font-size:11px;color:#829896;margin:4px 0 20px}input[type=range]{width:100%;height:4px;display:block;accent-color:#d9b578;cursor:pointer}.section-rule{height:1px;background:#2c3c3e;margin:23px 0 18px}.subheading{font:10px var(--font-mono);letter-spacing:.12em;color:#b3c3be;margin-bottom:11px;display:flex;justify-content:space-between}.soft-mini{color:#67817e}.machine-toggle{position:relative;display:flex;align-items:center;gap:9px;background:#172629;border:1px solid #2b4041;padding:12px 10px;margin-bottom:8px;border-radius:4px;cursor:pointer}.machine-toggle:hover{border-color:#627775}.machine-toggle input{position:absolute;opacity:0;width:1px;height:1px}.swatch{height:27px;width:3px;background:#76c5b9;border-radius:2px}.swatch-b{background:#959ab8}.machine-text{flex:1;min-width:0}.machine-text strong{display:block;font:600 11px var(--font-mono);letter-spacing:.1em}.machine-text small{display:block;font-size:10px;color:#879f9a;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.toggle{width:30px;height:17px;background:#485352;border-radius:14px;position:relative;transition:background .2s}.toggle:after{content:'';display:block;position:absolute;top:3px;left:3px;width:11px;height:11px;background:white;border-radius:50%;transition:transform .2s}.machine-toggle input:checked+.toggle{background:#71b2a3}.machine-toggle input:checked+.toggle:after{transform:translateX(13px)}.machine-toggle input:focus-visible+.toggle{outline:2px solid var(--accent);outline-offset:3px}.caveat{margin:9px 0 0;font-size:10px}.scenario-grid{display:grid;grid-template-columns:1fr 1fr;gap:7px}.scenario{border:1px solid #324346;background:#172629;color:#9db3af;border-radius:4px;padding:9px 6px;font-size:11px}.scenario.selected{border-color:#c59c60;color:#e7c88e;background:#3c352957}.scenario:hover{border-color:var(--teal)}.emergency{display:block;width:100%;margin-top:22px;background:#412724;border:1px solid #945b54;color:#edb2a5;border-radius:4px;padding:12px 5px;font:700 11px var(--font-mono);letter-spacing:.07em}.emergency:hover{background:#67312d}.emergency.latched{background:#93634b;color:#fff1d1;border-color:#d6a16a}.footnote{font:9px var(--font-mono);letter-spacing:.05em;color:#66807e;margin-top:18px;text-align:center}
.stage{min-width:0}.stage-toolbar{display:flex;justify-content:space-between;align-items:center;gap:12px;padding:3px 2px 12px}.stage-label{font:10px var(--font-mono);letter-spacing:.15em;color:#b18f62}.stage-toolbar h1{font-size:clamp(19px,1.9vw,27px);font-weight:510;letter-spacing:-.02em;line-height:1.15;margin:6px 0 0}.live-pill{border:1px solid #415351;border-radius:30px;background:#1b2727;display:flex;gap:7px;align-items:center;padding:6px 10px;font:10px var(--font-mono);letter-spacing:.07em;color:#a3b5ac;white-space:nowrap}.live-pill:not(.active) .live-dot{background:#909c99;box-shadow:none}.live-pill.stopped .live-dot{background:#f0a07b;box-shadow:0 0 6px #be574c}.viewport-wrap{position:relative;overflow:hidden;height:clamp(420px,55vh,710px);border:1px solid #33484a;background:radial-gradient(circle at 50% 30%,#304446 0%,#0f1d22 75%);border-radius:6px}#viewport{width:100%;height:100%;display:block;touch-action:none;cursor:grab}#viewport:active{cursor:grabbing}.canvas-grain{pointer-events:none;position:absolute;inset:0;background:linear-gradient(to bottom,rgba(226,188,124,.07),transparent 29%,transparent 80%,rgba(1,10,13,.26));mix-blend-mode:screen}.view-chip,.era-chip,.zoom-hint{position:absolute;pointer-events:none;background:#09171bbb;border:1px solid #66817d57;border-radius:3px;padding:6px 10px;font:10px var(--font-mono);letter-spacing:.09em;color:#c5d4c9}.view-chip{top:18px;left:17px}.era-chip{top:18px;right:17px;color:#efc381}.era-chip span{color:#75a39d}.zoom-hint{right:17px;bottom:17px;color:#9db2ac}.crosshair{color:#d5b377;font-size:15px;vertical-align:-1px}.error-overlay{position:absolute;inset:0;background:#0b1419ef;display:flex;flex-direction:column;justify-content:center;align-items:center;gap:10px;padding:26px;text-align:center}.error-overlay[hidden]{display:none}.error-overlay strong{font-size:21px;color:#efc381}.error-overlay p{max-width:430px}.error-overlay span{color:#8da5a0}.camera-bar{display:flex;gap:5px;align-items:center;padding:10px 5px 16px;flex-wrap:wrap}.camera-title{font:10px var(--font-mono);color:#8caaa1;letter-spacing:.1em;margin-right:6px}.camera-choice{border:1px solid transparent;border-radius:3px;background:none;padding:7px 9px;font-size:11px;color:#9db0ab}.camera-choice.active,.camera-choice:hover{color:#e9c589;background:#302e29;border-color:#675a45}.camera-spacer{flex:1}.chart-panel{border:1px solid var(--line);background:#121f22;border-radius:5px;padding:16px 18px 11px}.chart-head{display:flex;align-items:center;justify-content:space-between;gap:10px}.chart-head h3{font-size:16px;letter-spacing:-.02em;font-weight:550;margin:2px 0 5px}.unit{font:10px var(--font-mono);color:#92a7a1}.chart-legend{display:flex;gap:11px;font-size:10px;color:#9db5ae}.chart-legend span{white-space:nowrap}.key{display:inline-block;width:13px;height:3px;vertical-align:3px;margin-right:5px;background:#e2c188}.key-a{background:#75c7bd}.key-b{background:#8a93b4}#speedChart{width:100%;height:150px;display:block}.chart-caption{font:9px var(--font-mono);color:#78908b;letter-spacing:.03em;margin:0}
.telemetry .panel-eyebrow{margin-bottom:4px}.reading{background:#19292c;border:1px solid #304648;border-radius:4px;padding:13px}.reading span{display:block;font:10px var(--font-mono);letter-spacing:.1em;color:#98b1a8}.reading div:not(.meter){display:flex;align-items:baseline;gap:9px;margin-top:6px}.reading strong{font:550 32px/1.15 var(--font-mono);letter-spacing:-.05em;color:#f0d4a4;font-variant-numeric:tabular-nums}.reading em{font:10px var(--font-mono);color:#94aaa3}.hero-reading{margin-bottom:9px;padding:16px}.hero-reading strong{font-size:46px}.meter{height:4px;background:#344444;margin-top:13px;overflow:hidden;border-radius:5px}.meter>span{display:block;width:0;height:100%;background:linear-gradient(90deg,#6bb6a7,#d8bd78);transition:width .2s}.readings-grid{display:grid;grid-template-columns:1fr 1fr;gap:8px}.readings-grid .reading{padding:12px 9px}.readings-grid strong{font-size:25px}.metric-line,.condition{display:flex;justify-content:space-between;align-items:baseline;gap:7px;padding:8px 0;border-bottom:1px solid #2a3b3d}.metric-line span,.condition span{color:#9badaa;font-size:11px}.metric-line strong{font:600 14px var(--font-mono);color:#edf2e7;white-space:nowrap}.metric-line small{font:10px var(--font-mono);color:#7f9690}.condition strong{font:10px var(--font-mono);color:#b7c7bb;letter-spacing:.04em;text-align:right}.condition .status-good{color:#8cd5b4}.condition .status-warn{color:#e9b17b}.condition .status-muted{color:#8aa39d}.warning-card{display:flex;align-items:flex-start;gap:10px;border:1px solid #4a5342;background:#293129;margin-top:17px;border-radius:4px;padding:11px}.warning-card.alert{border-color:#755a38;background:#3d3027}.warning-icon{font-size:17px;color:#e5c082}.warning-card strong{font-size:12px;color:#ecd7a6}.warning-card p{font-size:11px;color:#b5bfae;line-height:1.5;margin:2px 0 0}.heritage-note{margin-top:18px;border-top:1px solid var(--line);padding-top:18px}.heritage-note p{font-size:11.5px;color:#95a9a2;line-height:1.65}.heritage-note a{font-size:11px;color:#e1bb7d;text-decoration:none}.heritage-note a:hover{text-decoration:underline}.footer{display:flex;justify-content:space-between;gap:20px;flex-wrap:wrap;border-top:1px solid #24363a;padding:15px 30px 20px;color:#677c78;font:9px var(--font-mono);letter-spacing:.09em}
dialog{max-width:min(720px,calc(100vw - 35px));background:#152327;color:#d8e7df;border:1px solid #71847a;border-radius:7px;box-shadow:0 28px 100px #000a;padding:34px;line-height:1.65}dialog::backdrop{background:#061114d9;backdrop-filter:blur(5px)}dialog h2{font-size:32px;font-weight:550;margin:7px 0}dialog p{font-size:13px;color:#a9c0b6}.dialog-close{position:absolute;top:12px;right:14px;color:#d7e2dc;border:0;background:transparent;font-size:18px}.guide-columns{display:grid;grid-template-columns:1.1fr 1fr;gap:26px}.guide-columns h3{font-size:15px;color:#e7bf7f}.guide-columns ol,.guide-columns ul{padding-left:22px;font-size:12px;color:#b0c5bd}.guide-columns li{margin:6px 0}.guide-disclaimer{border-left:2px solid #aa7e4d;padding:13px;background:#332d28;font-size:11px;color:#d0bd9e;margin:19px 0}.guide-ok{display:block;margin-left:auto;padding:10px 20px;border-radius:4px}
@media (max-width:1260px){.workspace{grid-template-columns:260px minmax(420px,1fr)}.telemetry{grid-column:1/-1;display:grid;grid-template-columns:repeat(4,minmax(0,1fr));column-gap:16px;align-content:start}.telemetry>.panel-eyebrow,.telemetry>h2{grid-column:1/-1}.telemetry .hero-reading{grid-column:1}.telemetry .readings-grid{grid-column:2;align-self:start}.telemetry>.section-rule{display:none}.telemetry>.subheading{grid-column:3/-1}.telemetry>.metric-line{grid-column:3/-1}.telemetry>.condition{grid-column:1/3}.telemetry>.warning-card{grid-column:3/-1;grid-row:11/15}.telemetry>.heritage-note{grid-column:1/-1}.viewport-wrap{height:530px}}@media (max-width:830px){.masthead{height:auto;min-height:75px;padding:13px 16px}.mast-meta{display:none}.workspace{grid-template-columns:1fr;padding:12px;gap:12px}.controls{order:2}.stage{order:1}.telemetry{order:3}.viewport-wrap{height:440px}.stage-toolbar h1{font-size:20px}.controls .control-cluster{display:grid;grid-template-columns:1fr;max-width:500px}.telemetry{display:block}.telemetry>.section-rule{display:block}.footer{padding:16px}}@media (max-width:480px){.brand-heading{font-size:16px}.brand-caption{font-size:8px}.brandmark{width:35px;height:35px;font-size:24px}.small{font-size:0;padding:10px}.small:first-letter{font-size:15px}.viewport-wrap{height:350px}.stage-toolbar h1{font-size:17px}.chart-head{display:block}.chart-legend{margin:8px 0}.zoom-hint{display:none}.era-chip{top:auto;bottom:14px}.guide-columns{grid-template-columns:1fr}.camera-choice{padding:6px 7px}.footer{gap:7px}}
@media (prefers-reduced-motion:reduce){*,*:before,*:after{transition:none!important;scroll-behavior:auto!important}}
