:root{color-scheme:dark;--bg:#10191e;--panel:#162329;--line:#2b3b41;--muted:#82969a;--paper:#e5e6dc;--teal:#53c4b4;--amber:#edbd72;--red:#f17366}*{box-sizing:border-box}body{margin:0;background:radial-gradient(ellipse at 48% -15%,#253840 0,#10191e 55%);color:var(--paper);font:14px/1.45 ui-sans-serif,system-ui,-apple-system,"Segoe UI",sans-serif;letter-spacing:.01em}.shell{max-width:1360px;padding:0 34px 28px;margin:auto}.topbar{height:66px;border-bottom:1px solid #29383d;display:flex;justify-content:space-between;align-items:center}.wordmark{display:flex;gap:11px;align-items:center;text-decoration:none;color:var(--paper);font-size:13px;font-weight:800;letter-spacing:.17em}.wordmark small{display:block;color:var(--muted);font-size:9px;font-weight:600;letter-spacing:.13em;margin-top:3px}.mark{width:34px;height:34px;border:1px solid #41636a;display:grid;place-items:center;color:#75cbbb;font-size:11px;letter-spacing:.05em}.live{font-size:10px;letter-spacing:.13em;color:#92a7a9;display:flex;gap:9px;align-items:center}.live i,.pulse{width:7px;height:7px;border-radius:50%;background:#58c5a9;box-shadow:0 0 10px #58c5a9;display:inline-block}.live b{color:#d6e0dc;font-size:9px;border-left:1px solid #405055;padding-left:13px;margin-left:5px}main{max-width:1190px;margin:auto}.intro{padding:29px 2px 22px;display:flex;justify-content:space-between;align-items:flex-end;gap:28px}.eyebrow{font-size:9px;letter-spacing:.18em;color:#8caaa6;font-weight:700;margin:0 0 7px}.eyebrow span{color:#597076;margin:0 4px}h1{font-size:31px;line-height:1.1;letter-spacing:-.04em;margin:0;font-weight:600}.lede{font-size:12px;color:#9babaa;max-width:600px;margin:8px 0 0;line-height:1.6}.weather{display:flex;gap:12px;align-items:center;border:1px solid #2d4146;background:#152329;padding:11px 15px;min-width:286px}.weather-icon{font-size:20px;color:#7ec2cc;opacity:.85}.weather small,.weather strong,.weather span{display:block}.weather small{font-size:8px;letter-spacing:.15em;color:#829b9c}.weather strong{font-size:10px;letter-spacing:.08em;margin:3px 0}.weather span{font-size:9px;color:#97a9a8}.dashboard{display:grid;grid-template-columns:minmax(0,1.76fr) minmax(310px,.94fr);border:1px solid #34454a;background:#141f24;box-shadow:0 22px 80px #0003}.scene-wrap{min-width:0;border-right:1px solid #34454a}.scene-head{height:39px;display:flex;align-items:center;justify-content:space-between;padding:0 14px;border-bottom:1px solid #34454a;font-size:9px;letter-spacing:.15em;color:#9aaca9}.scene-head .pulse{margin-right:8px;width:6px;height:6px}.scene-head b{font-size:11px;color:#e2c693;margin-left:7px;font-variant-numeric:tabular-nums}.canvas-box{position:relative;background:#162b31;overflow:hidden}.canvas-box canvas{width:100%;height:auto;display:block;aspect-ratio:800 / 500}.legend{height:36px;display:flex;gap:16px;align-items:center;padding:0 13px;white-space:nowrap;font-size:8px;letter-spacing:.08em;color:#94a5a1}.legend span{display:flex;align-items:center;gap:6px}.swatch{width:9px;height:9px;display:inline-block}.swatch.rain{background:#88a99a}.swatch.water{background:#3c91a2}.swatch.pump{background:#ecb76e;border-radius:2px}.swatch.gate{background:#c5d0c5;width:12px;height:2px}.panel{padding:16px 17px 12px;background:#152126}.panel-title{display:flex;justify-content:space-between;align-items:center}.panel-title small,.reading>span,.plant-head{font-size:8px;color:#83999a;letter-spacing:.16em;font-weight:700}.panel-title h2{font-size:17px;letter-spacing:-.02em;margin:1px 0 0;font-weight:570}.status-tag{font-size:8px;letter-spacing:.12em;color:#a5ada0;border:1px solid #45504a;padding:4px 7px}.status-tag.live-tag{border-color:#2e7468;color:#72d2b5}.status-tag.alert-tag{border-color:#89584a;color:#f09c7e}.readings{display:grid;grid-template-columns:1.2fr .86fr .98fr;gap:0;margin-top:14px;padding:11px 0 12px;border-block:1px solid #2b3b40}.reading{padding:0 9px;border-right:1px solid #2c3b40;min-width:0}.reading:first-child{padding-left:0}.reading:last-child{border:0;padding-right:0}.reading strong{display:block;margin:4px 0 2px;font-size:20px;font-weight:560;letter-spacing:-.03em;font-variant-numeric:tabular-nums;white-space:nowrap}.reading strong small{font-size:10px;color:#9fadaa;font-weight:500}.meter{height:3px;background:#304147;overflow:hidden}.meter i{display:block;width:0;height:100%;background:var(--teal);transition:width .25s,background .2s}.meter i.warn{background:var(--amber)}.meter i.danger{background:var(--red)}.range,.subread{display:block;color:#829494;font-size:7px;letter-spacing:.07em;margin-top:6px;white-space:nowrap}.range b{color:#bac5b9;font-weight:550}.range span{margin:0 3px;color:#4f6868}.plant-list,.gates{margin-top:13px}.plant-head{display:flex;justify-content:space-between;margin-bottom:5px;padding:0 3px}.plant{appearance:none;width:100%;display:flex;align-items:center;gap:9px;padding:8px 8px;background:#1b292e;border:1px solid #2a3b40;color:var(--paper);text-align:left;margin:4px 0;cursor:pointer;font:inherit;min-height:47px;transition:background .18s,border-color .18s}.plant:hover,.gate-row:hover{background:#243439;border-color:#4f7574}.plant.active{border-color:#477c70;background:#1d332f}.plant.trip{border-color:#82524a}.plant-icon{width:24px;height:24px;display:grid;place-items:center;font-weight:750;font-size:10px}.plant-icon.electric{background:#6b865c33;color:#b7d388;border:1px solid #6e8657}.plant-icon.diesel{background:#986c3933;color:#e9b879;border:1px solid #936839}.plant-name{flex:1;min-width:0}.plant-name b,.plant-name small,.gate-name b,.gate-name small{display:block}.plant-name b,.gate-name b{font-size:9px;letter-spacing:.08em}.plant-name small,.gate-name small{font-size:7px;color:#8ba09e;letter-spacing:.08em;margin-top:2px}.plant-out{color:#778b89;font-size:8px;min-width:37px;text-align:right}.plant.active .plant-out{color:#75ceb4}.switch{width:22px;height:12px;background:#435154;border-radius:8px;position:relative;margin-left:3px}.switch:after{content:"";width:8px;height:8px;position:absolute;left:2px;top:2px;border-radius:50%;background:#99a39e;transition:left .15s,background .15s}.plant.active .switch{background:#3e806f}.plant.active .switch:after{left:12px;background:#c0f0d7}.plant.trip .switch{background:#783e38}.supply{margin-top:8px;display:grid;grid-template-columns:1fr auto;gap:5px 9px;color:#8fa09c;font-size:8px;letter-spacing:.08em}.supply>span:first-child b{color:#e9c78a;margin-left:5px}.supply .meter{grid-column:1/-1}.supply .grid-state{grid-column:1/-1;font-size:7px;color:#7fa997;margin-top:1px}.supply .grid-state.grid-trip{color:#f08d79}.gate-row{appearance:none;width:100%;display:flex;align-items:center;gap:9px;padding:7px 7px;background:transparent;border:1px solid #2b3a3e;color:var(--paper);text-align:left;margin:4px 0;cursor:pointer;font:inherit;min-height:41px;transition:background .18s,border-color .18s}.gate-id{width:21px;height:21px;display:grid;place-items:center;border:1px solid #556a68;color:#b5c0b4;font-size:9px;font-weight:700}.gate-name{flex:1}.gate-position{font-size:8px;color:#8fa19b;min-width:40px;text-align:right}.gate-row.open .gate-position{color:#83d1b1}.gate-row.danger-gate{border-color:#88594a}.gate-chevron{font-size:19px;color:#778c89;line-height:1}.gate-tip{margin:5px 2px 0;color:#8d9d99;font-size:8px;line-height:1.45}.bottom-controls{border-top:1px solid #2b3b40;margin-top:12px;padding-top:9px;display:flex;justify-content:space-between;align-items:center}.quiet{border:0;background:transparent;color:#acb8b1;padding:5px 3px;font-size:8px;letter-spacing:.1em;cursor:pointer}.quiet:disabled{opacity:.35;cursor:default}kbd{border:1px solid #405154;padding:1px 4px;color:#d0d5c8;font:7px ui-monospace,monospace;margin-left:4px}.bottom-controls label{font-size:8px;letter-spacing:.1em;color:#899b97;display:flex;align-items:center;gap:5px}.bottom-controls select{background:#1b292e;color:#dbe0d2;border:1px solid #43534f;padding:3px 4px;font-size:9px}.sound{color:#83beb0}footer{display:flex;justify-content:space-between;gap:20px;color:#839494;font-size:8px;letter-spacing:.04em;padding:12px 2px}footer b{font-size:8px;color:#bdc8bd;letter-spacing:.1em;margin-right:5px}footer span:last-child{white-space:nowrap}.overlay{position:absolute;inset:0;display:grid;place-items:center;background:linear-gradient(90deg,#0c1717d9,#0c1717a8 47%,#0c171769),linear-gradient(0deg,#0714199c,transparent 72%);transition:opacity .25s}.overlay.hidden{opacity:0;pointer-events:none;visibility:hidden}.dispatch-card{max-width:370px;padding:18px 22px;border-left:2px solid #77b6a7;background:#102024dd;box-shadow:0 15px 55px #09121377}.dispatch-card h2{font-size:27px;line-height:1.07;letter-spacing:-.04em;margin:9px 0}.dispatch-card>p:not(.eyebrow){color:#c0cac1;font-size:11px;line-height:1.65;margin:10px 0 15px}.dispatch-card>p b{color:#f0c184}.primary{border:0;background:#78bdaa;color:#0d211f;padding:10px 13px;font-weight:800;letter-spacing:.12em;font-size:9px;cursor:pointer;width:100%;text-align:left;display:flex;justify-content:space-between}.primary:hover{background:#a0d9c7}.primary span{font-size:15px;line-height:10px}.dispatch-card>small{display:block;text-align:center;color:#8ba19b;font-size:7px;letter-spacing:.13em;margin-top:10px}.toast{position:absolute;left:50%;top:12px;transform:translate(-50%,-6px);opacity:0;pointer-events:none;background:#101c20ed;border:1px solid #687b6d;color:#ebd4a8;padding:7px 11px;font-size:9px;letter-spacing:.06em;white-space:nowrap;transition:opacity .18s,transform .18s}.toast.show{opacity:1;transform:translate(-50%,0)}button:focus-visible,select:focus-visible,a:focus-visible{outline:2px solid #89d9c2;outline-offset:2px}@media(max-width:850px){.shell{padding:0 15px 22px}.dashboard{grid-template-columns:1fr}.scene-wrap{border-right:0;border-bottom:1px solid #34454a}.canvas-box canvas{aspect-ratio:800 / 500}.panel{padding:14px}.intro{padding-top:22px}.weather{min-width:245px}.panel{display:grid;grid-template-columns:1fr 1fr;column-gap:15px}.panel-title,.readings,.bottom-controls{grid-column:1/-1}.readings{grid-template-columns:1.2fr 1fr 1fr}.plant-list,.gates{margin-top:12px}.gates{padding-left:9px;border-left:1px solid #2d3d40}.bottom-controls{margin-top:10px}}@media(max-width:580px){.shell{padding:0 9px 16px}.topbar{height:56px}.live{font-size:8px}.live b{font-size:8px;padding-left:7px}.intro{align-items:flex-start;flex-direction:column;gap:13px;padding:20px 2px 15px}.weather{min-width:0;width:100%;padding:7px 11px}.lede{font-size:11px}.panel{display:block;padding:12px}.readings{grid-template-columns:1.1fr 1fr 1fr}.reading{padding:0 5px}.reading strong{font-size:17px}.range,.subread{font-size:6px;letter-spacing:0}.gates{padding:0;border:0}.legend{gap:9px;justify-content:space-around;font-size:6px;padding:0 4px}.scene-head{font-size:8px;padding:0 8px}.canvas-box canvas{aspect-ratio:800 / 530}.dispatch-card{margin:10px;padding:15px 17px;max-width:330px}.dispatch-card h2{font-size:24px}.dispatch-card>p:not(.eyebrow){font-size:10px;margin:6px 0 10px}footer{font-size:7px;flex-direction:column;gap:5px}footer span:last-child{white-space:normal}}
