:root{color-scheme:dark;--bg:#08151e;--panel:#10212d;--line:#29404d;--text:#ecf1e9;--muted:#8ea9b2;--gold:#e3b46b;--teal:#7cc9d0;--red:#f18b79;--body:system-ui,-apple-system,BlinkMacSystemFont,'Segoe UI',Arial,sans-serif}
*{box-sizing:border-box}html,body{min-height:100%;margin:0}body{background:radial-gradient(ellipse at 25% -24%,#183b45 0,transparent 55%),var(--bg);font-family:var(--body);color:var(--text);font-size:14px}button,select,input{font:inherit}button{cursor:pointer}button:focus-visible,select:focus-visible,input:focus-visible,#viewport:focus-visible{outline:2px solid var(--gold);outline-offset:3px}.masthead{height:98px;display:flex;align-items:center;justify-content:space-between;padding:20px 35px;border-bottom:1px solid #213844}.brand{display:flex;align-items:center;gap:17px}.brand-mark{border:1px solid #47646b;border-radius:3px;height:50px;width:50px;display:flex;align-items:center;justify-content:center;color:var(--gold);font-family:Georgia,serif;font-size:28px;letter-spacing:-3px;font-weight:bold}.brand-mark span{color:#e5f0ea;font-size:17px;align-self:flex-end;margin:0 0 11px 1px}.eyebrow{font-size:10px;letter-spacing:2.1px;color:var(--gold);font-weight:800}.brand h1{font-family:Georgia,'Times New Roman',serif;letter-spacing:1px;font-size:30px;line-height:1.08;margin:3px 0 2px;font-weight:400}.brand h1 b{font-size:20px;color:var(--gold);font-weight:400}.subtitle{color:var(--muted);font-size:11px;letter-spacing:.35px}.header-right{display:flex;align-items:center;gap:12px}.signal{border:1px solid #28665f;background:#103b3b;color:#8ed9bc;font-size:10px;font-weight:800;letter-spacing:1.4px;padding:10px 12px;border-radius:3px;white-space:nowrap}.signal.warn{color:#ffd494;border-color:#75552e;background:#47331d}.signal.danger{color:#ffa293;border-color:#874442;background:#452023}.ghost{color:var(--gold);border:1px solid var(--line);background:transparent;border-radius:3px;padding:9px 12px;font-weight:800;min-width:37px}.ghost:hover,.camera:hover,.secondary:hover,.scenario:hover{border-color:var(--gold);color:#fff}.shell{display:grid;grid-template-columns:minmax(400px,1fr) 365px;gap:18px;max-width:1800px;margin:auto;padding:19px 23px 15px;min-height:calc(100vh - 146px)}.view-area{position:relative;border:1px solid #334b55;border-radius:6px;min-height:710px;overflow:hidden;background:linear-gradient(#234453,#0c2936);isolation:isolate}.view-area:before{content:'';position:absolute;inset:0;pointer-events:none;z-index:1;background:radial-gradient(ellipse at center,transparent 50%,#04101858 100%)}#viewport{width:100%;height:100%;min-height:710px;display:block;touch-action:none;cursor:grab}#viewport:active{cursor:grabbing}.view-top,.view-bottom{position:absolute;left:0;right:0;display:flex;justify-content:space-between;align-items:center;z-index:2;pointer-events:none}.view-top{top:0;padding:22px 24px;background:linear-gradient(#061b28c9,transparent);gap:12px}.view-bottom{bottom:0;padding:26px 20px 20px;background:linear-gradient(transparent,#071825e8)}.view-tag,.view-hint{font-size:10px;letter-spacing:1.4px;color:#a3bbc4;font-weight:600}.view-tag b{font-weight:700;color:#deede9;margin-left:12px}.view-hint{color:#88a5b0}.camera-bar{display:flex;gap:5px;flex-wrap:wrap;pointer-events:auto}.camera{padding:10px 13px;border:1px solid #4a6870;background:#0b2635ca;color:#b1c6cc;border-radius:3px;font-size:11px;white-space:nowrap}.camera.active{background:#e2b46c;color:#12252e;border-color:var(--gold);font-weight:800}.compass{font-size:11px;border:1px solid #86a6ab77;color:#e5e3c9;border-radius:50%;width:37px;height:37px;display:flex;align-items:center;justify-content:center;flex-direction:column}.compass span{color:var(--gold);line-height:8px;font-size:14px}.loading{position:absolute;z-index:4;inset:0;display:grid;place-items:center;font-size:11px;letter-spacing:2px;color:#c7e7dd;background:#0c1f2e}.loading.hidden{display:none}.right-column{display:flex;flex-direction:column;gap:16px;min-width:0}.panel{border:1px solid var(--line);border-radius:5px;background:linear-gradient(155deg,#132836,#10212c);padding:21px 20px}.panel-head{display:flex;justify-content:space-between;align-items:baseline;border-bottom:1px solid var(--line);padding-bottom:14px;margin-bottom:17px;gap:8px}.panel-head h2{font-family:Georgia,serif;font-size:18px;white-space:nowrap;margin:0;font-weight:400;color:#e4efec}.metrics{display:grid;grid-template-columns:1fr 1fr;gap:11px}.metric{background:#091b26b8;border:1px solid #26414f;padding:14px 12px;border-radius:3px;min-width:0}.metric span{color:#91aab5;font-size:9px;letter-spacing:1.1px;font-weight:700}.metric strong{display:block;color:#f2f2e7;font-size:23px;font-weight:500;letter-spacing:-.8px;white-space:nowrap;margin-top:10px;font-variant-numeric:tabular-nums}.metric strong small{color:var(--gold);font-size:11px;font-weight:500;letter-spacing:0}.chart-head{display:flex;justify-content:space-between;gap:8px;font-size:9px;letter-spacing:1.25px;color:#a1b6bd;font-weight:700;margin-top:22px;margin-bottom:10px}.chart-head #clock{color:var(--gold)}.chart{width:100%;height:100px;display:block;background:#0b1d28;border:1px solid #2b414e;border-radius:3px}.chart-key{display:flex;gap:13px;margin-top:11px;font-size:10px;color:#9bb5bd}.chart-key span{display:inline-flex;align-items:center;gap:5px}.key{width:8px;height:8px;border-radius:50%;display:inline-block}.key.polder{background:#81c8cd}.key.collector{background:#d3ae69}.key.river{background:#8f9bc4}.control-row{display:flex;justify-content:space-between;gap:14px;align-items:center;margin:13px 0 6px;font-size:10px;letter-spacing:1.35px;font-weight:800;color:#aebfc6}.control-row output{color:#e2bc7a;letter-spacing:0;font-size:12px;font-variant-numeric:tabular-nums}input[type=range]{appearance:none;width:100%;height:4px;background:#385263;border-radius:10px;margin:10px 0 13px;accent-color:var(--gold)}input[type=range]::-webkit-slider-thumb{appearance:none;height:14px;width:14px;border-radius:50%;border:3px solid #0c202b;background:var(--gold);box-shadow:0 0 0 2px var(--gold)}input[type=range]::-moz-range-thumb{height:10px;width:10px;border-radius:50%;background:var(--gold);border:2px solid #0c202b}input[type=range]:disabled{opacity:.32}.toggles{display:flex;flex-direction:column;gap:9px;border-top:1px solid var(--line);border-bottom:1px solid var(--line);padding:14px 0;margin:2px 0 16px}.check{display:flex;align-items:center;gap:10px;font-size:12px;color:#c2d0d3}.check input{accent-color:#e0b56b;width:15px;height:15px}.scenario-head{font-size:10px;letter-spacing:1.3px;color:#acc1c9;margin-bottom:10px;font-weight:800}.scenarios{display:grid;grid-template-columns:1fr 1fr;gap:6px}.scenario{border:1px solid #385365;background:#0e2432;color:#b6c9cc;border-radius:3px;padding:10px 7px;font-size:11px}.scenario.active{border-color:var(--gold);color:var(--gold);background:#403b2a}.transport{display:flex;align-items:center;gap:8px;margin-top:19px;padding-top:16px;border-top:1px solid var(--line)}.primary,.secondary{border-radius:3px;font-size:12px;padding:11px 14px;font-weight:800}.primary{border:1px solid var(--gold);background:var(--gold);color:#0b2130}.primary:hover{background:#f2c98d}.secondary{border:1px solid #405968;background:#0b2230;color:#d8e2e0}.speed-label{font-size:9px;color:#9aafb4;letter-spacing:1.2px;margin-left:auto}.transport select{background:#0c2330;border:1px solid #375360;color:#f0e8d4;border-radius:3px;font-size:11px;padding:9px 5px;max-width:70px}.footer-actions{display:flex;justify-content:space-between;align-items:center;gap:8px;padding-top:15px}.inline-button{border:0;background:transparent;padding:4px 0;font-size:11px;color:var(--gold);font-weight:700}.inline-button:hover{text-decoration:underline}.small-note{color:#79949f;font-size:9px;letter-spacing:.15px;text-align:right}.site-footer{display:flex;align-items:center;justify-content:space-between;gap:10px;max-width:1800px;margin:auto;padding:5px 25px 17px;color:#79949e;font-size:9px;letter-spacing:.9px}.site-footer .dot{display:inline-block;background:#8fdac6;width:6px;height:6px;border-radius:100%;margin-right:10px}.site-footer>div{display:flex;align-items:center}dialog{max-width:min(92vw,565px);background:#112936;border:1px solid #5a717a;border-radius:6px;color:#e8f0e9;padding:0;box-shadow:0 28px 100px #000b}dialog::backdrop{background:#05121be9;backdrop-filter:blur(6px)}.dialog-inner{padding:27px 31px}.dialog-top{display:flex;justify-content:space-between;align-items:center}.dialog-top button{border:none;background:transparent;color:#eec88d;font-size:24px}.dialog-inner h2{font-family:Georgia,serif;font-size:27px;font-weight:400;margin:18px 0}.dialog-inner p{color:#b1c6cc;line-height:1.65;font-size:13px}.help-kbd{display:grid;grid-template-columns:1fr 1fr;gap:12px;margin:22px 0}.help-kbd>div{display:flex;gap:12px;align-items:center;font-size:12px;color:#b3c8cc}.help-kbd kbd{background:#1c3a48;border:1px solid #4d6875;border-radius:4px;padding:7px 10px;color:#fff;min-width:57px;text-align:center}.dialog-inner>.primary{width:100%}
@media(max-width:1150px){.shell{grid-template-columns:minmax(360px,1fr) 330px;padding:12px;gap:12px}.view-area,#viewport{min-height:730px}.panel{padding:17px 14px}.transport{gap:5px}.primary,.secondary{padding:10px}.speed-label{display:none}}@media(max-width:830px){.masthead{height:auto;padding:14px 15px;gap:12px;flex-wrap:wrap}.brand h1{font-size:25px}.brand-mark{width:44px;height:44px}.shell{display:flex;flex-direction:column;padding:9px 9px 15px}.view-area,#viewport{min-height:420px;height:58vh;max-height:650px}.view-top{padding:15px}.view-hint{display:none}.view-bottom{padding:20px 12px 12px}.right-column{display:grid;grid-template-columns:1fr 1fr}.site-footer{padding:5px 12px 15px;font-size:8px}.metric strong{font-size:21px}}@media(max-width:610px){.masthead{padding:12px}.header-right{gap:6px}.brand{gap:9px}.brand h1{font-size:22px}.brand h1 b{font-size:16px}.brand-mark{width:39px;height:39px;font-size:23px}.brand-mark span{font-size:13px;margin-bottom:8px}.eyebrow{font-size:8px;letter-spacing:1.6px}.subtitle{font-size:9px}.signal{padding:8px;font-size:8px;letter-spacing:.5px}.ghost{min-width:28px;padding:6px}.right-column{display:flex}.view-area,#viewport{min-height:370px;height:49vh}.view-tag{font-size:9px}.view-tag b{margin-left:5px}.camera{padding:8px 9px;font-size:10px}.site-footer>span{display:none}.help-kbd{grid-template-columns:1fr}.dialog-inner{padding:20px}}
@media(prefers-reduced-motion:reduce){*{scroll-behavior:auto!important;transition:none!important}}
