:root{color-scheme:dark;--cream:#f1eddf;--muted:#9aaeb1;--gold:#d8b77b;--line:rgba(207,226,218,.16);font-family:Inter,ui-sans-serif,system-ui,-apple-system,BlinkMacSystemFont,'Segoe UI',sans-serif;font-synthesis:none}
*{box-sizing:border-box}body{margin:0;background:#0b1920;color:var(--cream)}button,input,select{font:inherit}button{cursor:pointer}button:focus-visible,input:focus-visible,select:focus-visible{outline:2px solid var(--gold);outline-offset:3px}
.app{position:relative;min-height:100vh;height:100dvh;overflow:hidden;background:radial-gradient(ellipse at 53% 63%,#b5c5b6 0%,#819f9b 38%,#446b7a 75%,#24465f 100%)}.sky{position:absolute;inset:0;pointer-events:none;background:linear-gradient(180deg,#3c6982 0%,#7e9da4 39%,#ced4c1 66%,#a6baa2 92%)}#scene{display:block;position:absolute;inset:0;width:100%;height:100%;touch-action:none;cursor:grab}#scene.dragging{cursor:grabbing}.vignette{pointer-events:none;position:absolute;inset:0;background:linear-gradient(90deg,rgba(8,23,29,.49),transparent 32%,transparent 66%,rgba(9,23,28,.35)),linear-gradient(0deg,rgba(7,20,28,.63),transparent 19%,transparent 83%,rgba(7,19,27,.16))}
.masthead{position:absolute;z-index:3;top:24px;left:27px;right:27px;display:flex;align-items:flex-start;gap:15px}.brand-symbol{height:48px;width:48px;border:1px solid rgba(229,220,176,.65);display:grid;place-items:center;transform:rotate(45deg);margin:7px 9px 0 0;background:rgba(9,26,31,.26)}.brand-symbol span{font-family:Georgia,serif;font-weight:bold;font-size:28px;transform:rotate(-45deg);color:var(--gold)}.brand-copy h1{font-family:Georgia,serif;font-size:clamp(26px,2.45vw,37px);font-weight:400;letter-spacing:.035em;margin:3px 0 1px}.brand-copy .code{font-family:ui-monospace,SFMono-Regular,Consolas,monospace;font-size:19px;color:var(--gold);letter-spacing:0}.brand-copy p{font-size:10px;letter-spacing:.26em;margin:3px 0;color:#d4ded8}.eyebrow{font-size:9px;font-weight:700;letter-spacing:.19em;color:#d4e0d8}.dot{display:inline-block;width:4px;height:4px;background:var(--gold);border-radius:100%;vertical-align:middle;margin:0 7px}.top-right{margin-left:auto;display:flex;align-items:center;gap:19px;padding-top:9px}.on-air{display:flex;align-items:center;gap:8px;padding:9px 12px;border:1px solid rgba(221,239,218,.23);background:rgba(9,32,37,.52);font-size:9px;letter-spacing:.13em;font-weight:750}.on-air i{width:7px;height:7px;border-radius:50%;background:#a5c7aa;box-shadow:0 0 11px #a5c7aa}.icon-btn{background:rgba(10,29,33,.55);color:var(--cream);height:36px;width:36px;border:1px solid rgba(221,239,218,.28);border-radius:50%;font-size:16px}
.panel{position:absolute;z-index:2;top:130px;bottom:102px;width:300px;max-height:calc(100vh - 230px);overflow-y:auto;scrollbar-width:thin;scrollbar-color:#6b8980 transparent;padding:22px;background:linear-gradient(160deg,rgba(8,30,34,.91),rgba(10,30,35,.83));box-shadow:0 12px 65px rgba(4,13,17,.28);border:1px solid rgba(208,224,208,.16);backdrop-filter:blur(19px)}.controls{left:25px}.telemetry{right:25px}.panel-kicker{display:flex;align-items:center;gap:9px;color:var(--gold);font-size:9px;font-weight:800;letter-spacing:.18em;white-space:nowrap}.small-line{height:1px;width:17px;background:var(--gold)}.serial{margin-left:auto;color:#9baeb0;letter-spacing:.09em;font-size:9px;font-family:ui-monospace,monospace}.controls h2{font-family:Georgia,serif;font-size:26px;line-height:1.2;font-weight:400;margin:20px 0 11px}.title-dot{color:var(--gold)}.intro{font-size:11px;color:#b0c0ba;line-height:1.7;margin-bottom:20px}.section-label,.water-title{color:var(--gold);font-size:9px;font-weight:800;letter-spacing:.15em;display:flex;justify-content:space-between;gap:9px;margin:20px 0 16px;padding-top:14px;border-top:1px solid var(--line)}.section-label span{color:#8a9c9b}.control{margin-bottom:14px}.labelrow{display:flex;align-items:center;justify-content:space-between;font-size:11px;letter-spacing:.015em;margin-bottom:10px}.labelrow label{color:#d1dcd6}.labelrow output{color:#ead09e;font-size:11px;font-family:ui-monospace,Consolas,monospace}.control input[type=range]{--range:50%;appearance:none;display:block;width:100%;height:3px;border-radius:2px;background:linear-gradient(90deg,var(--gold) 0%,var(--gold) var(--range),#526c69 var(--range),#526c69 100%);margin:7px 0;cursor:ew-resize}.control input[type=range]::-webkit-slider-thumb{appearance:none;height:13px;width:13px;border-radius:50%;border:3px solid #d4bc8b;background:#183a3c;box-shadow:0 0 0 3px rgba(219,190,133,.16)}.control input[type=range]::-moz-range-thumb{height:9px;width:9px;border-radius:50%;border:3px solid #d4bc8b;background:#183a3c}.extremes{display:flex;justify-content:space-between;color:#7f9996;font-size:8px;letter-spacing:.08em;margin-top:9px}.scenarios{display:grid;grid-template-columns:1fr 1fr;gap:7px}.scenario{min-height:30px;background:rgba(91,118,112,.1);border:1px solid rgba(204,220,207,.17);color:#baccc3;font-size:10px;text-align:center}.scenario:hover,.scenario.selected{background:rgba(218,183,119,.14);border-color:rgba(222,191,134,.8);color:#eed5a6}.runbar{display:flex;gap:8px;margin-top:22px}.primary,.outline{border:1px solid var(--gold);background:#d3b67e;color:#182e30;font-size:10px;font-weight:800;letter-spacing:.09em;height:39px}.primary{flex:1;display:flex;align-items:center;justify-content:center;gap:10px}.primary:hover{background:#f0d4a2}.outline{width:41px;flex-shrink:0;background:transparent;color:var(--gold);font-size:21px}.outline:hover{background:rgba(218,183,119,.12)}
.status-line{display:flex;justify-content:space-between;align-items:start;gap:10px;margin-top:21px;padding-bottom:18px;border-bottom:1px solid var(--line)}.status-word{border:1px solid #97baa6;background:rgba(86,144,114,.18);padding:8px 10px;font-size:10px;font-weight:900;letter-spacing:.1em;color:#c1e1c7}.status-word[data-status=ELEVATED]{border-color:#d5bd80;color:#efd49b}.status-word[data-status=CRITICAL]{border-color:#e48b79;color:#efab9d}.status-word[data-status='NO WIND']{border-color:#a4aeb0;color:#cad1d0}.status-caption{font-size:10px;line-height:1.45;color:#9cb2ac;text-align:right;max-width:124px}.metric-grid{display:grid;grid-template-columns:1fr 1fr;gap:8px;margin-top:17px}.metric{background:rgba(152,189,172,.065);border:1px solid var(--line);padding:11px 10px 12px}.metric-name,.water-key,.chart-head,.other-stats,.speed-line{font-size:9px;letter-spacing:.075em}.metric-name{color:#95aaa7}.metric-value{font-family:Georgia,serif;font-size:27px;margin-top:7px;white-space:nowrap}.metric-value small{font-family:ui-monospace,monospace;font-size:10px;color:var(--gold)}.water-title{margin-top:21px}.water-title .serial{font-size:8px}.water-level{margin:0 0 16px}.water-key{display:flex;justify-content:space-between;align-items:center;color:#c8d7cd;letter-spacing:.03em}.water-key strong{color:var(--cream);font-size:10px;font-family:ui-monospace,monospace;font-weight:500}.blue-dot,.teal-dot{display:inline-block;height:7px;width:7px;border-radius:50%;background:#80aac1;margin-right:6px}.teal-dot{background:#8ec6b6}.bar{position:relative;height:7px;background:rgba(169,196,192,.13);margin-top:11px;overflow:hidden}.barfill{height:100%;transition:width .2s}.lowbar{background:linear-gradient(90deg,#4b94ac,#a0c2cf)}.highbar{background:linear-gradient(90deg,#5e9a92,#a5cdb7)}.barline{position:absolute;left:75%;top:0;bottom:0;border-left:1px dashed rgba(252,237,193,.65)}.chart-head{display:flex;justify-content:space-between;color:var(--gold);padding:16px 0 8px;border-top:1px solid var(--line);font-weight:800;font-size:9px}.chart-head span:last-child{color:#94aaac;font-family:ui-monospace,monospace;font-weight:400}.telemetry svg{display:block;width:100%;height:92px;background:rgba(127,163,160,.035)}.gridline{stroke:rgba(180,217,199,.14);stroke-width:1;stroke-dasharray:2 5}.trend-high,.trend-low{fill:none;stroke-width:2}.trend-high{stroke:#87c8b0}.trend-low{stroke:#8bbacf}.chart-legend{display:flex;gap:20px;color:#9cb0ac;font-size:9px;letter-spacing:.1em;margin-top:8px}.other-stats{border-top:1px solid var(--line);margin-top:19px;padding-top:12px;color:#a5b7af}.other-stats>div{display:flex;justify-content:space-between;margin:10px 0}.other-stats strong{color:#eee9d5;font-family:ui-monospace,monospace;font-weight:500;font-size:11px}.speed-line{display:flex;justify-content:space-between;align-items:center;gap:8px;margin-top:18px;border-top:1px solid var(--line);padding-top:16px;color:var(--gold);font-weight:700}.speed-line select{background:#172c31;color:#e1d9bd;border:1px solid #506965;padding:5px;font-size:10px}
.annotation{position:absolute;top:0;left:0;pointer-events:none;z-index:1;color:#e9edda;font-size:9px;font-weight:750;letter-spacing:.13em;white-space:nowrap;text-shadow:0 2px 8px #112b2a;transition:opacity .15s}.annotation::before{content:'';display:block;width:1px;height:22px;background:rgba(236,222,161,.69);margin-bottom:4px}.annotation::after{content:'';height:5px;width:5px;border-radius:100%;border:1px solid var(--gold);position:absolute;top:-4px;left:-2px}.footer-left{position:absolute;left:27px;bottom:25px;color:#e1e9db;font-weight:700;font-size:10px;letter-spacing:.14em;line-height:1.8;z-index:2;text-shadow:0 2px 8px #264c4a}.footer-left small{color:#bbccc4;font-size:8px;letter-spacing:.095em;font-weight:500}.crosshair{font-size:17px;color:var(--gold);vertical-align:middle;margin-right:8px}.footer-left b{color:var(--gold);padding:0 5px}.cam-controls{position:absolute;bottom:27px;left:50%;transform:translateX(-50%);display:flex;align-items:center;gap:4px;background:rgba(9,29,35,.84);border:1px solid rgba(232,239,218,.22);padding:6px 7px;z-index:2;backdrop-filter:blur(12px)}.cam-title{font-size:9px;color:#9bb5af;margin:0 11px 0 7px;letter-spacing:.1em}.cam-controls button{border:0;background:transparent;color:#a6b9b4;padding:9px 10px;font-size:10px;font-weight:800;white-space:nowrap}.cam-controls button span{font-size:8px;font-weight:550;margin-left:4px}.cam-controls button.active,.cam-controls button:hover{background:rgba(215,189,138,.17);color:#e9d5ad}.gesture-hint{position:absolute;right:27px;bottom:25px;font-size:8px;letter-spacing:.13em;color:#cbd7cb;text-shadow:0 2px 8px #192d2c;z-index:1}.gesture-hint b{color:var(--gold);padding:0 5px}
.load,.error{position:absolute;z-index:10;inset:0;display:flex;flex-direction:column;align-items:center;justify-content:center;background:#122e36;color:var(--gold);font-size:12px;letter-spacing:.18em}.load.hidden{display:none}.spinner{height:33px;width:33px;border-radius:50%;border:2px solid rgba(215,183,123,.22);border-top-color:var(--gold);animation:spin .9s linear infinite}@keyframes spin{to{transform:rotate(360deg)}}.error[hidden]{display:none}.error{padding:35px;text-align:center}.error p{max-width:500px;line-height:1.8;color:#c3d4c7;letter-spacing:0}.error h2{color:var(--gold);font-size:20px}dialog{border:1px solid rgba(214,192,151,.55);padding:28px 32px;background:linear-gradient(140deg,#0e2b30,#142b32);color:var(--cream);width:min(92vw,530px);box-shadow:0 20px 80px #08161c;max-height:87vh;overflow:auto}dialog::backdrop{background:rgba(3,13,18,.75);backdrop-filter:blur(6px)}.dialog-head{display:flex;justify-content:space-between}dialog .eyebrow{color:var(--gold)}.dialog-head button{border:0;color:var(--cream);background:transparent;font-size:17px}dialog h2{font-size:35px;font-family:Georgia,serif;font-weight:400;margin:21px 0}dialog h3{color:var(--gold);text-transform:uppercase;letter-spacing:.12em;font-size:10px;margin:23px 0 7px}dialog p{color:#bed2ca;font-size:13px;line-height:1.78}.dialog-tip{padding:15px;border:1px solid var(--line);color:#d2cba9;font-size:10px;line-height:1.8;margin:20px 0}.dialog-close{width:100%;display:block;margin-top:15px}
@media(max-height:730px) and (min-width:901px){.panel{top:105px;bottom:75px;max-height:calc(100vh - 175px)}.masthead{top:12px}.brand-symbol{height:40px;width:40px}.brand-copy h1{font-size:27px}.footer-left,.gesture-hint{bottom:12px}.cam-controls{bottom:13px}}
@media(max-width:1120px){.panel{width:265px;padding:17px}.masthead{left:15px;right:15px}.controls{left:12px}.telemetry{right:12px}.footer-left{left:15px}.gesture-hint{display:none}.annotation{display:none}.cam-controls{bottom:20px}.cam-controls button span{display:none}}
@media(max-width:900px){.app{min-height:850px;height:100dvh}.masthead{top:13px}.brand-symbol{width:33px;height:33px;margin:4px 3px 0 0}.brand-symbol span{font-size:20px}.brand-copy h1{font-size:24px}.brand-copy .code{font-size:13px}.brand-copy p{font-size:8px;letter-spacing:.08em}.eyebrow{font-size:8px}.on-air{font-size:0;height:28px;padding:9px}.top-right{gap:6px;padding:0}.icon-btn{width:29px;height:29px}.panel{top:auto;bottom:78px;max-height:36vh;width:calc(50% - 14px);padding:14px;overflow:auto}.controls{left:9px}.telemetry{right:9px}.controls h2{font-size:22px;margin:8px 0}.intro{display:none}.section-label{margin:12px 0}.metric-value{font-size:20px}.annotation{display:none}.footer-left{bottom:9px;font-size:8px}.footer-left small{display:none}.cam-controls{bottom:13px}.cam-title{display:none}.cam-controls button{padding:7px 8px}.cam-controls button span{display:none}.gesture-hint{display:none}}
@media(max-width:560px){.app{min-height:690px}.panel{width:calc(50% - 8px);bottom:66px;max-height:43vh;padding:10px}.controls{left:5px}.telemetry{right:5px}.panel-kicker{letter-spacing:.02em;font-size:8px}.panel-kicker .serial{display:none}.controls h2{font-size:18px}.section-label{letter-spacing:.04em;font-size:8px}.control{margin-bottom:10px}.labelrow{font-size:9px}.labelrow output{font-size:9px}.scenario{font-size:9px}.primary{font-size:8px}.metric-grid{gap:4px}.metric{padding:7px 5px}.metric-name{font-size:7px}.metric-value{font-size:17px}.metric-value small{font-size:7px}.status-line{margin-top:7px}.status-word{font-size:8px;padding:5px}.status-caption{font-size:8px}.water-key{font-size:8px}.chart-legend,.other-stats,.water-title .serial{display:none}.speed-line{margin-top:12px;flex-wrap:wrap}.footer-left{letter-spacing:0}.cam-controls{left:auto;right:5px;transform:none;bottom:7px}.brand-copy p{max-width:210px}.top-right{margin-left:auto}.on-air{display:none}}
