:root{color-scheme:dark;--bg:#0b1620;--panel:#0e1c27;--panel2:#142632;--line:#29404c;--faded:#8296a1;--text:#e8f0f1;--sub:#a5b3bc;--gold:#e9b65e;--teal:#55d0cc;--red:#ed795e;font-family:Inter,ui-sans-serif,system-ui,-apple-system,"Segoe UI",sans-serif;font-synthesis:none}
*{box-sizing:border-box}body{margin:0;background:radial-gradient(ellipse at 48% -25%,#1b3440,transparent 62%),var(--bg);color:var(--text);min-height:100vh}button,input{font:inherit}button{cursor:pointer}button:disabled{cursor:not-allowed;opacity:.36}button:focus-visible,input:focus-visible,summary:focus-visible{outline:2px solid var(--gold);outline-offset:3px}h1,h2,h3,p{margin:0}.shell{max-width:1800px;margin:auto;padding:0 28px}.masthead{height:64px;display:flex;align-items:center;justify-content:space-between;border-bottom:1px solid var(--line);gap:24px}.brand{font-size:10px;font-weight:850;letter-spacing:2.0px;display:flex;align-items:center;gap:13px;white-space:nowrap}.brandmark{width:31px;height:31px;background:var(--gold);display:grid;place-items:center;color:#112430;font-size:22px;font-weight:900;font-family:Georgia,serif}.brand i{font-style:normal;color:var(--gold);padding:0 5px}.mast-right{display:flex;align-items:center;gap:30px;font-size:10px;color:var(--faded);letter-spacing:1.6px;font-weight:700}.region{color:#bec9cc;display:flex;align-items:center;gap:8px}.region-dot{width:6px;height:6px;background:#edcd94;border-radius:50%}.introduction{display:flex;align-items:flex-end;justify-content:space-between;padding:31px 0 32px;gap:14px}.eyebrow{font-size:9px;letter-spacing:2.1px;font-weight:800;color:var(--gold)}.introduction h1{font-size:clamp(38px,5vw,67px);font-weight:840;line-height:1.06;letter-spacing:-2.2px;margin:9px 0 11px}.introduction h1 span{color:var(--gold);font-weight:500;letter-spacing:-1px}.introduction p{font-size:13px;color:#aebdc4;line-height:1.55}.intro-divider{color:var(--gold);padding:0 5px}.edition{text-align:right;display:flex;flex-direction:column;align-items:end;gap:4px;color:var(--sub);font-size:10px;letter-spacing:1px;white-space:nowrap}.edition span{font-family:Georgia,serif;font-size:25px;font-style:italic;color:var(--gold);padding-bottom:7px}.edition b{font-size:9px;letter-spacing:2px;color:#e2e9e9}.edition small{font-size:10px;color:var(--faded);letter-spacing:.3px}.dashboard{display:grid;grid-template-columns:minmax(250px,288px) minmax(390px,1fr) minmax(260px,288px);gap:14px;align-items:stretch}.panel,.viewport-panel{min-width:0;border:1px solid var(--line);background:linear-gradient(145deg,#12222d,#0b1923 84%);}.panel{padding:19px 18px}.panel-head{display:flex;align-items:center;gap:10px;margin-bottom:20px}.section-index{font-family:Georgia,serif;font-size:17px;color:var(--gold)}.panel-head h2{font-size:12px;letter-spacing:.3px;white-space:nowrap}.accent-line{height:1px;background:var(--line);flex:1}.mini-label{font-size:9px;letter-spacing:1.6px;font-weight:800;color:var(--sub)}.status-card{border:1px solid #29515a;background:linear-gradient(115deg,#142e39,#10232d);padding:15px 14px;margin-bottom:25px}.status-card .mini-label{display:flex;align-items:center;justify-content:space-between}.status-led,.live-label span{width:7px;height:7px;border-radius:50%;display:inline-block;background:var(--teal);box-shadow:0 0 12px #37d6c66c}.status-led.warning{background:var(--red);box-shadow:0 0 12px #ed795e8a}.status-value{font-size:18px;color:#e6fbf6;letter-spacing:.6px;font-weight:850;margin:9px 0 4px}.status-caption{font-size:10px;color:var(--sub);line-height:1.6}.control-group{margin-bottom:23px}.group-title{display:flex;justify-content:space-between;align-items:center;gap:10px;font-size:10px;font-weight:800;letter-spacing:1.15px;color:#d2dde0;margin:0 0 14px}.group-title label{font-size:10px}.group-title span:last-child{font-size:9px;color:var(--faded);font-weight:550;letter-spacing:.9px}.group-title strong{font-size:12px;color:var(--gold);white-space:nowrap;letter-spacing:0}.landing-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:7px}.landing{text-align:left;border:1px solid #334856;background:#122632;color:var(--text);padding:10px 11px;display:grid;grid-template-columns:1fr 1fr;align-items:center;min-height:73px;transition:background .15s,border-color .15s}.landing strong{font-size:10px;color:var(--faded);font-weight:600}.landing span{font-size:14px;white-space:nowrap;color:#e4eeed;text-align:right;font-weight:700}.landing small{grid-column:1 / -1;font-size:9px;letter-spacing:1px;color:#90a2ad;margin-top:5px}.landing.active{border-color:var(--gold);background:#42392b}.landing.active strong,.landing.active small{color:#efce94}.landing:disabled{opacity:.43}input[type=range]{width:100%;margin:0;accent-color:var(--gold);height:5px;cursor:pointer}.range-ends,.depth-ticks{display:flex;justify-content:space-between;font-size:9px;color:#8197a4;letter-spacing:.5px;margin-top:9px}.balance-note{font-size:10px;color:var(--teal);padding-top:12px;min-height:30px}.action-area{display:grid;gap:8px}.button{width:100%;height:45px;border:1px solid var(--line);color:var(--text);background:var(--panel2);display:flex;align-items:center;justify-content:center;gap:14px;font-size:11px;font-weight:900;letter-spacing:1.2px}.button-icon{font-size:13px;min-width:18px;text-align:center}.button.primary{background:var(--gold);border-color:#f8c777;color:#15202a}.button.primary:hover:not(:disabled){background:#f2c97d}.button.secondary{border-color:#405765}.button.secondary:hover:not(:disabled){background:#25404d}.button.danger{background:#321f24;border-color:#9b5050;color:#ffb3a2}.button.danger:hover:not(:disabled){background:#49262a}.hidden{display:none!important}.divider-line{height:1px;background:var(--line);margin:20px 0}.display-options{margin-bottom:14px}.check-row{display:flex;align-items:center;gap:12px;font-size:11px;color:#b9c8d0;margin:10px 0}.check-row input{accent-color:var(--teal)}.text-button{width:100%;display:flex;align-items:center;justify-content:center;gap:9px;padding:12px;border:1px solid var(--line);background:transparent;color:var(--gold);font-size:11px;letter-spacing:1.1px;font-weight:800}.text-button:hover{background:#23313b}.viewport-panel{display:flex;flex-direction:column;overflow:hidden}.viewport-meta{display:flex;justify-content:space-between;align-items:center;padding:15px 20px 13px;gap:10px;border-bottom:1px solid var(--line)}.viewport-meta h2{font-size:15px;letter-spacing:-.2px;margin-top:5px}.live-label{font-size:9px;letter-spacing:1.2px;color:var(--teal);white-space:nowrap}.live-label span{width:5px;height:5px;vertical-align:middle;margin-right:6px}.viewport{position:relative;flex:1;min-height:650px;overflow:hidden;background:radial-gradient(ellipse at 55% 27%,#214354,#091925 70%);touch-action:none;cursor:grab}.viewport:active{cursor:grabbing}#stage{display:block;width:100%;height:100%;position:absolute;inset:0}.viewport-top,.viewport-bottom{position:absolute;left:18px;right:18px;pointer-events:none;display:flex;justify-content:space-between;align-items:center;gap:12px;font-size:9px;letter-spacing:1.35px;font-weight:750;color:#abc6c8}.viewport-top{top:18px}.viewport-top span:first-child{color:var(--gold)}.viewport-bottom{bottom:20px;align-items:flex-end}.legend{display:flex;gap:12px;flex-wrap:wrap}.legend div{display:flex;align-items:center;gap:5px;white-space:nowrap;font-size:9px}.legend-swatch{display:inline-block;width:7px;height:7px}.legend-swatch.cage{background:var(--gold)}.legend-swatch.counter{background:var(--teal)}.legend-swatch.shaft{background:#6b828a}.camera-toolbar{display:flex;gap:3px;pointer-events:auto}.camera-toolbar button{background:#152932d9;color:#cbdfe0;border:1px solid #41606c;padding:8px 8px;font-size:9px;letter-spacing:1px;font-weight:700}.camera-toolbar button:hover{background:#2c515d}.viewport-hint{padding:12px 16px;background:#10212b;border-top:1px solid var(--line);font-size:9px;letter-spacing:1.0px;color:#91a6ad}.viewport-hint>span:first-child{color:var(--gold);margin-right:5px}.sep{color:#526c77;padding:0 6px}.right-hint{float:right;color:#d1b37b}.marker-layer{position:absolute;inset:0;pointer-events:none}.marker{position:absolute;transform:translate(-100%,-50%);white-space:nowrap;color:#c4d5d5;font-size:9px;font-weight:850;letter-spacing:.7px;background:#102029d9;border-left:2px solid var(--gold);padding:5px 8px}.error-banner{position:absolute;inset:18% 8%;background:#33232c;display:grid;place-items:center;text-align:center;line-height:1.6;color:#ffb3aa;padding:22px;border:1px solid var(--red);cursor:auto}.telemetry-big{background:#142834;padding:17px 16px 14px;border:1px solid #2b454f}.large-value{font-variant-numeric:tabular-nums;font-size:47px;line-height:1.2;font-weight:750;letter-spacing:-1.9px;color:var(--gold);margin:5px 0 8px}.large-value em{font-size:17px;color:#b1c6c7;font-weight:500;font-style:normal;margin-left:6px}.depth-track{height:5px;background:#27414e;position:relative}.depth-track span{position:absolute;inset:0 auto 0 0;background:var(--gold);width:0%}.metric-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:0;margin-top:13px;border-top:1px solid var(--line);border-left:1px solid var(--line)}.metric{min-height:84px;border-right:1px solid var(--line);border-bottom:1px solid var(--line);padding:13px 10px 12px}.metric>span,.chart-heading span,.energy-stats span,.log-head span{font-size:9px;letter-spacing:1.0px;color:var(--faded);font-weight:800}.metric strong{font-variant-numeric:tabular-nums;display:flex;align-items:baseline;gap:5px;font-size:20px;font-weight:650;margin-top:9px}.metric small{font-size:10px;color:var(--sub);font-weight:500}.chart-heading{display:flex;justify-content:space-between;margin:22px 0 8px;align-items:center}.chart-heading small{display:block;font-size:9px;color:#697e89;margin-top:4px}.chart-legend{font-size:9px;color:#b1ccc9}.chart-legend i{display:inline-block;width:10px;height:3px;background:var(--teal);margin-right:4px;vertical-align:middle}#speed-chart{display:block;width:100%;height:125px;background:#0c1c27;border:1px solid var(--line)}.energy-stats{display:grid;gap:11px;border-top:1px solid var(--line);border-bottom:1px solid var(--line);padding:16px 0;margin:16px 0}.energy-stats div{display:flex;justify-content:space-between;align-items:center;gap:8px}.energy-stats strong{color:#cddfdc;font-size:11px;font-variant-numeric:tabular-nums;white-space:nowrap}.log-head{display:flex;justify-content:space-between}.log-head span:last-child{color:var(--gold)}.event-log{list-style:none;margin:9px 0 14px;padding:0;max-height:148px;overflow:auto}.event-log li{display:grid;grid-template-columns:44px 1fr;gap:8px;font-size:10px;color:#a9bac0;border-bottom:1px solid #253742;padding:8px 0;line-height:1.5}.event-log li time{color:var(--gold);font-variant-numeric:tabular-nums}.telemetry .text-button{font-size:10px}.bottom-info{display:grid;grid-template-columns:1.5fr 1fr;gap:50px;border-top:1px solid var(--line);margin:21px 0 0;padding:25px 0 31px}.info-number{font-size:9px;color:var(--gold);letter-spacing:1.5px;font-weight:850}.bottom-info h2{font-size:21px;letter-spacing:-.4px;margin:10px 0}.bottom-info p{max-width:790px;font-size:12px;line-height:1.85;color:#9eafb9}.bottom-warning{border-left:2px solid #526b77;padding-left:19px}.bottom-warning>span{font-size:9px;color:var(--gold);letter-spacing:1.5px;font-weight:850}.bottom-warning details{font-size:11px;color:var(--gold);margin-top:15px}.bottom-warning summary{cursor:pointer;font-weight:750;letter-spacing:.7px}.bottom-warning details p{margin-top:10px}.shell>footer{display:flex;justify-content:space-between;gap:15px;border-top:1px solid var(--line);padding:18px 0 26px;color:#607c86;font-size:9px;letter-spacing:1.5px;font-weight:800}.shell>footer b{color:var(--gold)}
@media(max-width:1320px){.shell{padding:0 18px}.dashboard{grid-template-columns:265px minmax(360px,1fr)}.telemetry{grid-column:1/-1;display:grid;grid-template-columns:repeat(2,minmax(0,1fr));column-gap:22px;align-content:start}.telemetry .panel-head,.telemetry .telemetry-big,.telemetry .metric-grid,.telemetry .chart-heading,.telemetry #speed-chart,.telemetry .energy-stats,.telemetry .log-head,.telemetry .event-log,.telemetry .text-button{min-width:0}.telemetry .panel-head{grid-column:1/-1}.telemetry .telemetry-big{grid-column:1;grid-row:2}.telemetry .metric-grid{grid-column:1;grid-row:3}.telemetry .chart-heading{grid-column:2;grid-row:2;align-self:end}.telemetry #speed-chart{grid-column:2;grid-row:3;align-self:center;height:150px}.telemetry .energy-stats{grid-column:1;grid-row:4}.telemetry .log-head{grid-column:2;grid-row:4;align-self:start;margin-top:16px}.telemetry .event-log{grid-column:2;grid-row:4;margin-top:39px;max-height:125px}.telemetry .text-button{grid-column:1/-1;grid-row:5}.viewport{min-height:660px}}
@media(max-width:740px){.shell{padding:0 12px}.masthead{height:56px}.mast-right .version,.edition{display:none}.mast-right{font-size:8px;letter-spacing:.8px}.brand{font-size:9px;letter-spacing:1.1px}.introduction{padding:25px 2px 22px}.introduction h1{font-size:45px}.introduction p{font-size:12px}.dashboard{grid-template-columns:1fr;gap:11px}.viewport-panel{order:-1}.viewport{min-height:500px;height:520px}.viewport-meta{padding:13px 12px}.viewport-meta h2{font-size:12px}.live-label{font-size:7px}.viewport-hint{font-size:8px;line-height:1.6}.right-hint{display:none}.viewport-bottom{left:10px;right:10px;bottom:12px}.viewport-top{left:10px;right:10px;font-size:7px}.legend{gap:8px}.legend div{font-size:7px}.camera-toolbar button{font-size:8px;padding:8px 5px}.panel{padding:17px}.telemetry{display:block}.telemetry .event-log{margin-top:9px}.bottom-info{grid-template-columns:1fr;gap:22px}.shell>footer{line-height:1.7;font-size:8px}}
@media(max-width:380px){.viewport{min-height:440px;height:440px}.legend div:last-child{display:none}.brand{font-size:8px}.region{font-size:7px}.introduction h1{font-size:38px}}