:root{font-family:Inter,ui-sans-serif,system-ui,-apple-system,"Segoe UI",Arial,sans-serif;color:#e8f1ee;background:#06141b;font-size:12px;--line:#254552;--muted:#7e9ba8;--accent:#78dbdc;--amber:#efb56e}*{box-sizing:border-box}html,body,#app{margin:0;width:100%;height:100%;overflow:hidden}button,select,input{font:inherit}button{cursor:pointer;transition:background .2s,border .2s}button:focus-visible,select:focus-visible,input:focus-visible{outline:2px solid var(--accent);outline-offset:2px}button:hover{filter:brightness(1.25)}.topbar{height:73px;display:flex;align-items:center;justify-content:space-between;gap:20px;border-bottom:1px solid #294452;padding:0 22px;background:#091c25;position:relative;z-index:20}.brand{display:flex;align-items:center;gap:13px}.brand .glyph{height:43px;width:43px;display:grid;place-items:center;background:linear-gradient(140deg,#a6e5dd,#1b7c8b);border-radius:10px;font-size:25px;color:#092731;font-weight:900;position:relative}.glyph span{font-size:15px;position:absolute;top:2px;right:3px;color:#d6fff7}.brand strong{display:block;font-size:16px;letter-spacing:.14em;font-weight:750;white-space:nowrap}.brand b{color:#61919d}.brand small{display:block;font-size:9px;color:#75a6b4;letter-spacing:.18em;margin-top:5px}.headStats,.topActions{display:flex;gap:22px;align-items:center;white-space:nowrap}.headStats span{font-size:14px;font-weight:650}.headStats small{font-size:9px;color:#8ca5ae;letter-spacing:.15em}.headStats span:first-child{font-size:10px;letter-spacing:.12em;color:#9ac6cc}.dot,.pulse{display:inline-block;width:7px;height:7px;background:#66e2ba;border-radius:50%;box-shadow:0 0 12px #66e2ba;margin-right:8px}.headerButton{background:#12313d;color:#d7efed;border:1px solid #2c4e5b;border-radius:6px;padding:10px 14px;text-transform:uppercase;font-size:10px;letter-spacing:.1em}.headerButton.accent{color:#0f2c35;background:#a6dcd5;border-color:#a6dcd5;font-weight:800}.workarea{display:grid;grid-template-columns:342px minmax(350px,1fr) 282px;height:calc(100% - 73px)}aside{overflow:auto;scrollbar-width:thin;scrollbar-color:#365764 transparent}.sidebar{background:#0b212a;border-right:1px solid var(--line)}.sideIntro{padding:23px 22px 18px;border-bottom:1px solid var(--line)}.eyebrow{display:block;color:#7ad8d4;font-size:9px;letter-spacing:.2em;font-weight:750}.sideIntro h1{font-size:21px;margin:10px 0 7px;letter-spacing:-.03em}.sideIntro p,.telemSection p{color:#92a8ae;font-size:11px;line-height:1.6;margin:0}.section{padding:17px 20px;border-bottom:1px solid var(--line)}.sectionTitle{display:flex;align-items:center;gap:9px;letter-spacing:.12em;font-weight:750;font-size:10px;margin-bottom:16px}.sectionTitle b{display:grid;place-items:center;color:#67c2c5;border:1px solid #2f6570;width:24px;height:24px;border-radius:4px}.sectionTitle .right{font-size:8px;color:#f0bb80;margin-left:auto}.fieldlabel,.mutedLabel{display:block;font-size:9px;letter-spacing:.15em;color:#86a0aa;margin-bottom:8px}.sidebar select{width:100%;background:#142e39;color:#f1f4ee;border:1px solid #31525d;border-radius:5px;padding:11px 9px;margin-bottom:13px}.lockFigure{border:1px solid #31535e;background:linear-gradient(130deg,#173440,#0b222d);padding:13px 13px 10px;border-radius:6px}.headDisplay,.gaugeFoot{display:flex;justify-content:space-between;color:#9db4bb;font-size:9px;gap:7px}.headDisplay span{line-height:1.5}.headDisplay b{display:block;color:#d9efee;font-size:15px;font-variant-numeric:tabular-nums}.headDisplay span:last-child,.gaugeFoot span:last-child{text-align:right}.lockGauge{height:95px;position:relative;overflow:hidden;margin:11px 0;border:1px solid #4d707a;border-bottom:6px solid #7d8990;background:repeating-linear-gradient(90deg,#19313c 0,#19313c 19px,#243f4b 20px,#243f4b 21px);border-radius:2px}.lockGauge:before,.lockGauge:after{position:absolute;content:'';height:100%;width:9px;background:#a0a8a9;top:0;z-index:2}.lockGauge:before{left:0}.lockGauge:after{right:0}.gaugeWater{position:absolute;bottom:0;left:0;right:0;height:28%;background:linear-gradient(0deg,#12637f,#2787a1);transition:height .25s}.gaugeWater:before{content:'';position:absolute;top:0;height:3px;left:0;right:0;background:#9edfe0}.gateLine{position:absolute;z-index:2;left:17px;bottom:8px;font-size:9px;letter-spacing:.15em;color:#d2eeef}.gaugeHeight{position:absolute;right:18px;top:14px;text-align:right;z-index:2}.gaugeHeight strong{display:block;font-size:20px}.gaugeHeight small{display:block;font-size:8px;color:#c1d4d7}.gaugeFoot{padding-top:1px}.gaugeFoot strong{display:block;color:#e4f4f1;margin-top:4px;font-size:12px}.buttonGrid{display:grid;grid-template-columns:1fr 1fr;gap:7px;margin:12px 0}.buttonGrid button{background:#193643;color:#c9e1e4;border:1px solid #375765;border-radius:4px;min-height:35px;padding:8px 5px;font-size:10px}.buttonGrid button.activeButton{color:#f7c994;border-color:#876449;background:#413629}.detailRow{display:flex;justify-content:space-between;gap:10px;border-bottom:1px solid #1f3b46;padding:10px 0;font-size:9px;color:#8da7b0;letter-spacing:.06em}.detailRow strong{color:#e5edeb;font-size:10px;font-weight:650;text-align:right}.interlock{padding:10px;border-left:2px solid #478d83;color:#99c5c5;font-size:10px;background:#13333b;margin-top:10px;line-height:1.55}.interlock.warning{border-color:#df9861;color:#f0b378;background:#3c2f2b}.rangeLabel{display:flex;justify-content:space-between;color:#b4c8cc;font-size:10px;margin:18px 0 5px}.rangeLabel:first-of-type{margin-top:4px}.rangeLabel span{color:#8fe6df;font-weight:700}input[type=range]{width:100%;accent-color:#8ecfca;height:6px;cursor:pointer}.sideEnd{padding:25px 22px;color:#638594;font-size:10px;line-height:1.5}.viewport{position:relative;overflow:hidden;background:#638f9b}#sceneCanvas{width:100%;height:100%;display:block;touch-action:none;cursor:grab}#sceneCanvas:active{cursor:grabbing}.viewportOverlay{pointer-events:none;position:absolute;inset:0;box-shadow:inset 0 0 100px #0a223366,inset 0 -90px 130px #08202877}.sceneTop{position:absolute;left:21px;right:21px;top:19px;display:flex;gap:16px;justify-content:space-between;align-items:flex-start;pointer-events:none}.sceneTag{background:#081f2ad9;padding:11px 14px;display:flex;align-items:center;gap:8px;letter-spacing:.09em;font-size:10px;border:1px solid #52737a80;border-radius:5px;max-width:100%}.sceneTag small{color:#9daeb1;margin-left:10px;font-size:8px}.cameraPills{pointer-events:auto;display:flex;flex-wrap:wrap;justify-content:flex-end;gap:4px;max-width:335px}.cameraPills button{background:#09232cce;color:#d8e9e7;border:1px solid #4c76817a;border-radius:4px;padding:8px 10px;font-size:9px}.mapFrame{position:absolute;top:92px;right:22px;width:242px;background:#061d27e9;border:1px solid #49707e;box-shadow:0 14px 30px #00171c88;border-radius:6px;padding:12px 13px}.mapHead{display:flex;justify-content:space-between;letter-spacing:.16em;font-size:9px;font-weight:700}.mapCounter{color:#f2c38d}#navMap{width:100%;margin:8px 0 0;overflow:visible}#navMap .mapWater{stroke:#184c62;fill:none;stroke-width:17;stroke-linecap:round}#navMap .mapMiddle{stroke:#4ea6bb;fill:none;stroke-width:3;stroke-linecap:round}.mapMarker{fill:#d0ac7f;cursor:pointer;stroke:#234651;stroke-width:1.4}.mapMarker:hover{fill:#fff}.mapLegend{display:flex;gap:12px;color:#8cabb0;font-size:7px;letter-spacing:.05em}.viewCorner{position:absolute;bottom:143px;right:24px;display:flex;flex-direction:column;gap:6px}.viewCorner button{height:31px;width:31px;background:#0b2732dd;color:#eef5f3;border:1px solid #578491;border-radius:4px;font-size:16px}.cameraHint{position:absolute;bottom:132px;left:21px;color:#d9eeec;font-size:9px;letter-spacing:.06em;background:#0b2938b0;padding:7px 12px;border-radius:4px}.metrics{position:absolute;bottom:38px;left:17px;right:17px;display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:8px}.metric{position:relative;min-width:0;background:#091f2be8;border:1px solid #42616cbd;border-radius:5px;padding:12px}.metric span{display:block;color:#9bb3be;font-size:8px;letter-spacing:.11em;white-space:nowrap}.metric strong{display:block;margin-top:7px;font-size:18px;letter-spacing:-.02em;font-weight:650;white-space:nowrap;font-variant-numeric:tabular-nums}.metric strong small{font-size:10px;color:#9fb7c0;font-weight:450}.miniSpark{position:absolute;color:#477e89;font-size:11px;right:8px;bottom:11px;font-style:normal;opacity:.7}.footHud{position:absolute;bottom:0;left:0;right:0;height:29px;background:#081d27e8;border-top:1px solid #45636b;display:flex;justify-content:space-between;padding:8px 17px;color:#91b2b7;font-size:8px;letter-spacing:.12em}.telemetry{background:#0b2029;border-left:1px solid #294752}.telemHead{padding:24px 18px 19px;border-bottom:1px solid var(--line)}.telemHead strong{display:block;font-size:20px;letter-spacing:-.03em;margin-top:7px}.telemSection{padding:19px 17px;border-bottom:1px solid #24424b}.statusValue{font-size:20px;font-weight:750;letter-spacing:.08em;color:#edbf83;margin:9px 0 6px}.telemSection .detailRow:first-of-type{margin-top:8px}#chartCanvas{width:100%;height:140px;display:block;margin-top:4px}.chartCaption{display:flex;justify-content:space-between;font-size:9px;color:#8aa4ac}.chartCaption .cyan{color:#79ddd7}.eventLog{height:235px;overflow:hidden}#eventLog{font-size:10px;line-height:1.7;color:#aac3ca;max-height:198px;overflow:auto}#eventLog>div{padding:7px 0;border-bottom:1px solid #1c3840}#eventLog em{font-style:normal;color:#e4b781;margin-right:7px}.telemFooter{padding:18px;color:#8ea6b0;font-size:9px}.pulse{animation:blink 1.3s infinite}@keyframes blink{50%{opacity:.3}}#errorBox{position:fixed;inset:10% 15%;z-index:50;background:#311b22;color:#ffd1c0;border:2px solid #d66666;padding:30px;font:16px/1.5 monospace;overflow:auto;white-space:pre-wrap}#errorBox[hidden]{display:none}@media(max-width:1380px){.workarea{grid-template-columns:305px minmax(320px,1fr) 235px}.sidebar .section{padding:15px}.telemetry .telemSection{padding:14px}.metric{padding:9px}.metric strong{font-size:15px}.metric span{font-size:7px}.headStats{gap:11px}.sceneTag small{display:none}}@media(max-width:1050px){.workarea{grid-template-columns:290px minmax(320px,1fr)}.telemetry{display:none}.headStats{display:none}.mapFrame{width:205px}.cameraPills{display:none}.metrics{grid-template-columns:repeat(3,1fr);bottom:35px}.metric:nth-child(n+4){display:none}}@media(max-width:690px){.topbar{height:60px;padding:0 10px}.brand strong{font-size:12px}.brand small{font-size:7px}.brand .glyph{width:33px;height:33px}.topActions{gap:5px}.headerButton{padding:7px;font-size:8px}.workarea{height:calc(100% - 60px);grid-template-columns:1fr}.sidebar{height:215px;overflow:auto;z-index:3}.sideIntro{padding:10px 14px}.sideIntro h1{font-size:15px;margin:4px 0}.sideIntro p{display:none}.section{padding:10px 12px}.sidebar .section:nth-of-type(n+2){display:none}.lockFigure,.detailRow,.interlock{display:none}.buttonGrid{margin:4px 0}.buttonGrid button{min-height:30px}.viewport{height:calc(100vh - 275px)}.mapFrame{display:none}.sceneTop{top:10px;left:8px}.metrics{left:6px;right:6px;gap:3px}.metric{padding:7px}.metric strong{font-size:13px}.metric span{font-size:6px}.cameraHint{bottom:111px;font-size:8px}.viewCorner{bottom:117px}}
