:root{color-scheme:dark;--bg: #071116;--panel: rgba(11, 29, 37, .86);--panel-strong: rgba(16, 45, 55, .96);--line: rgba(142, 214, 222, .2);--text: #ecfbff;--muted: #8db7c0;--cyan: #35e8ff;--blue: #2e8dff;--green: #38f2a3;--yellow: #ffd166;--red: #ff5c7a;--orange: #ff9f43;--shadow: 0 22px 70px rgba(0, 0, 0, .38);font-family:Inter,ui-sans-serif,system-ui,-apple-system,BlinkMacSystemFont,Segoe UI,sans-serif}*{box-sizing:border-box}body{margin:0;min-width:1180px;background:radial-gradient(circle at 18% 14%,rgba(46,141,255,.2),transparent 31%),radial-gradient(circle at 88% 9%,rgba(53,232,255,.13),transparent 32%),linear-gradient(135deg,#071116,#0a1b20 42%,#061014);color:var(--text)}button,select{font:inherit}button{color:inherit}.app-shell{min-height:100vh;padding:18px}.topbar{display:grid;grid-template-columns:1fr auto 1fr;align-items:center;gap:18px;height:76px;padding:10px 18px;border:1px solid var(--line);background:#061319c2;box-shadow:var(--shadow);-webkit-backdrop-filter:blur(18px);backdrop-filter:blur(18px)}.brand{display:flex;align-items:center;gap:14px;min-width:0}.brand-mark{display:grid;place-items:center;width:48px;height:48px;color:var(--cyan);border:1px solid rgba(53,232,255,.34);background:linear-gradient(145deg,#35e8ff29,#2e8dff14);box-shadow:inset 0 0 20px #35e8ff1f}.brand h1{margin:0;font-size:22px;line-height:1.05;letter-spacing:0}.brand p{margin:5px 0 0;color:var(--muted);font-size:12px}.top-nav{display:flex;gap:6px;padding:5px;border:1px solid var(--line);background:#071217b8}.top-nav button,.icon-btn,.primary-btn{border:0;cursor:pointer}.top-nav button{min-width:82px;padding:10px 14px;color:var(--muted);background:transparent;font-size:13px;transition:color .18s ease,background .18s ease,transform .18s ease}.top-nav button:hover,.icon-btn:hover,.primary-btn:hover,.station-row:hover,.command:hover,.video-thumbs button:hover,.map-actions button:hover{transform:translateY(-1px)}.top-nav button.active{color:#071116;background:linear-gradient(135deg,var(--cyan),#7fffd4);font-weight:800}.top-actions{display:flex;justify-content:flex-end;align-items:center;gap:9px}.icon-btn,.primary-btn{display:inline-flex;align-items:center;justify-content:center;height:39px;border:1px solid var(--line);background:#091e26db}.module-banner{display:flex;align-items:center;justify-content:space-between;gap:18px;margin-top:14px;padding:10px 16px;border:1px solid rgba(53,232,255,.22);background:linear-gradient(90deg,#35e8ff1c,#ffd1660f,#38f2a30d)}.module-banner span,.module-banner p{color:var(--muted);font-size:12px}.module-banner strong{display:block;margin-top:3px;font-size:15px}.module-banner p{margin:0;max-width:560px;text-align:right}.icon-btn{width:39px;color:var(--muted)}.primary-btn{gap:8px;padding:0 14px;color:#061015;background:var(--cyan);font-size:13px;font-weight:800}.dashboard-grid,.module-page{display:grid;grid-template-columns:330px minmax(520px,1fr) 360px;gap:16px;margin-top:16px}.module-page{grid-template-columns:320px minmax(620px,1fr) 340px;align-items:start}.module-page>*{min-width:0}.module-sidebar{display:grid;gap:14px}.left-rail,.right-rail{display:grid;gap:14px;align-content:start}.panel,.map-shell,.command-strip{border:1px solid var(--line);background:var(--panel);box-shadow:var(--shadow);-webkit-backdrop-filter:blur(18px);backdrop-filter:blur(18px)}.panel{padding:14px}.panel-title{display:flex;align-items:center;gap:8px;margin-bottom:12px;color:var(--cyan)}.panel-title h2{margin:0;color:var(--text);font-size:13px;font-weight:800;text-transform:uppercase;letter-spacing:0}.hero-metric{padding:14px;border:1px solid rgba(53,232,255,.22);background:linear-gradient(135deg,#35e8ff1c,#38f2a30f)}.hero-metric span,.metric span,.sensor span,.command span,.forecast-row span{display:block;color:var(--muted);font-size:11px;line-height:1.35}.hero-metric strong{display:block;margin-top:4px;color:var(--yellow);font-size:31px;line-height:1}.hero-metric small{display:block;margin-top:8px;color:#bce7ed;font-size:12px;line-height:1.35}.metric-grid,.node-summary,.forecast-row,.sensor-strip{display:grid;grid-template-columns:1fr 1fr;gap:10px;margin-top:10px}.metric{padding:12px;min-height:72px;border:1px solid rgba(255,255,255,.08);background:#061116b3}.metric strong{display:block;margin-top:8px;font-size:22px;line-height:1}.metric.ok strong{color:var(--green)}.metric.info strong{color:var(--cyan)}.metric.warn strong{color:var(--yellow)}.metric.alert strong{color:var(--red)}.station-list{display:grid;gap:8px}.station-row{display:grid;grid-template-columns:14px 1fr auto;align-items:center;gap:9px;width:100%;padding:11px 9px;text-align:left;border:1px solid rgba(255,255,255,.07);background:#050f148f;cursor:pointer;transition:border-color .18s ease,background .18s ease,transform .18s ease}.station-row.selected{border-color:#35e8ff85;background:#35e8ff17}.station-row strong{display:block;font-size:12px;line-height:1.25}.station-row small{display:block;margin-top:4px;color:var(--muted);font-size:10px}.station-row em{color:#dffaff;font-style:normal;font-size:12px;font-weight:800}.risk-dot{width:10px;height:10px;border-radius:999px;background:var(--green);box-shadow:0 0 16px currentColor}.risk-dot.watch{background:var(--yellow)}.risk-dot.warning{background:var(--orange)}.risk-dot.critical{background:var(--red)}.sparkline{height:138px;padding:10px 0 0}.sparkline svg{width:100%;height:100px}.sparkline polyline{fill:none;stroke:var(--cyan);stroke-width:4;filter:drop-shadow(0 0 8px rgba(53,232,255,.55))}.sparkline path{fill:#35e8ff1f;stroke:none}.spark-labels{display:flex;justify-content:space-between;color:var(--muted);font-size:10px}.forecast-row{margin-top:4px}.forecast-row div{padding:10px;background:#ffffff0a}.forecast-row strong{display:block;margin-top:5px;font-size:16px}.center-stage{display:grid;gap:14px;align-content:start}.map-shell{min-height:680px;overflow:hidden}.map-shell.expanded{position:fixed;inset:18px;z-index:50;min-height:auto}.map-shell.expanded .map-canvas{min-height:calc(100vh - 122px)}.map-toolbar{display:flex;align-items:center;justify-content:space-between;gap:16px;padding:16px 18px;border-bottom:1px solid var(--line);background:#08191fc7}.map-actions{display:flex;gap:6px;margin-left:auto}.map-actions button{display:grid;place-items:center;width:34px;height:34px;color:var(--cyan);border:1px solid rgba(53,232,255,.24);background:#061116db;cursor:pointer;transition:border-color .18s ease,background .18s ease,transform .18s ease}.map-toolbar h2{margin:0;font-size:18px}.map-toolbar p{margin:5px 0 0;color:var(--muted);font-size:12px}.layer-select{position:relative;display:flex;align-items:center;gap:8px;min-width:190px;padding:9px 10px;border:1px solid rgba(53,232,255,.28);background:#061116db;color:var(--cyan)}.layer-select select{flex:1;appearance:none;color:var(--text);border:0;outline:0;background:transparent;font-size:12px;font-weight:700}.map-canvas{position:relative;min-height:620px;overflow:hidden;cursor:grab;background:linear-gradient(rgba(53,232,255,.04) 1px,transparent 1px),linear-gradient(90deg,rgba(53,232,255,.04) 1px,transparent 1px),radial-gradient(circle at 48% 43%,rgba(46,141,255,.22),transparent 38%),linear-gradient(145deg,#0b1d26,#071317 72%);background-size:42px 42px,42px 42px,auto,auto}.map-canvas.dragging{cursor:grabbing}.map-transform{position:absolute;inset:0;width:100%;height:100%;transform-origin:center;transition:transform .18s ease}.map-canvas.dragging .map-transform{transition:none}.digital-map{width:100%;height:100%}.district{fill:#10363e8f;stroke:#86e4eb47;stroke-width:2}.risk-zone{fill:#ff5c7a14;stroke:#ff5c7a59;stroke-width:2;opacity:0;transition:opacity .22s ease}.flood-risk .risk-zone,.incidents .risk-zone{opacity:1}.drainage-zones .district{fill:#38f2a31a}.infrastructure .roads path{stroke:#ffd166bd;stroke-width:4}.meteorology .rain-field span{animation-duration:.85s;background:linear-gradient(180deg,transparent,rgba(255,209,102,.85))}.incidents .pulse{fill:#ff5c7a24;stroke:#ff5c7a6b}.d2{fill:#1789ff14}.grid-line{fill:none;stroke:#ffffff14;stroke-dasharray:8 12}.river-main,.river-branch{fill:none;stroke:url(#river);stroke-linecap:round;filter:url(#softGlow)}.river-main{stroke-width:16}.river-branch{stroke-width:8;opacity:.78}.roads path{fill:none;stroke:#ffd16659;stroke-width:3;stroke-dasharray:5 9}.drain-node{fill:#b6f7ff;opacity:.75}.station-pin{cursor:pointer;outline:none}.station-pin:hover .pin-core,.station-pin:focus .pin-core{filter:drop-shadow(0 0 18px rgba(53,232,255,.95))}.station-pin text{fill:#dffaff;font-size:19px;font-weight:900}.pulse{fill:#35e8ff1a;stroke:#35e8ff4d;transform-origin:center;animation:pulse 2.6s ease-out infinite}.pin-core{stroke:#fff;stroke-width:2;fill:var(--green)}.pin-core.watch{fill:var(--yellow)}.pin-core.warning{fill:var(--orange)}.pin-core.critical{fill:var(--red)}.station-pin.is-selected .pin-core{r:18;filter:drop-shadow(0 0 15px rgba(53,232,255,.9))}.rain-field{position:absolute;inset:0;pointer-events:none;overflow:hidden}.layer-legend{position:absolute;right:18px;top:18px;width:250px;padding:12px;border:1px solid rgba(53,232,255,.24);background:#040e12c7;pointer-events:none}.layer-legend strong,.layer-legend span{display:block}.layer-legend strong{color:var(--cyan);font-size:13px}.layer-legend span{margin-top:6px;color:#bce7ed;font-size:11px;line-height:1.35}.rain-field span{position:absolute;top:-30px;width:2px;height:28px;background:linear-gradient(180deg,transparent,rgba(166,244,255,.7));animation:rain 1.45s linear infinite}.selected-card{position:absolute;left:22px;bottom:22px;width:min(520px,calc(100% - 44px));padding:16px;border:1px solid rgba(53,232,255,.3);background:#051218e6;box-shadow:0 18px 60px #00000059}.selected-head{display:flex;align-items:center;gap:8px;color:var(--cyan);font-size:12px;font-weight:800}.selected-head strong{margin-left:auto;color:var(--red)}.selected-card h3{margin:10px 0 6px;font-size:19px}.selected-card p{margin:0;color:#bce7ed;font-size:13px;line-height:1.45}.sensor-strip{grid-template-columns:repeat(3,1fr)}.sensor{padding:11px;border:1px solid rgba(255,255,255,.09);background:#ffffff0a}.sensor svg{color:var(--cyan)}.sensor strong{display:block;margin-top:6px;font-size:16px}.command-strip{display:grid;grid-template-columns:repeat(4,1fr);gap:1px;overflow:hidden;background:var(--line)}.command{min-height:88px;padding:16px;color:inherit;text-align:left;border:0;background:#07141af0;cursor:pointer;transition:background .18s ease,transform .18s ease}.command:hover{background:#12343ffa}.command svg{color:var(--cyan)}.command strong{display:block;margin-top:9px;font-size:15px}.video-wall{display:grid;gap:10px}.main-video{position:relative;overflow:hidden;height:214px;border:1px solid rgba(53,232,255,.22);background:#08151a}.video-scene{position:absolute;inset:0;background:linear-gradient(120deg,rgba(255,255,255,.08),transparent 24%),linear-gradient(180deg,#142932,#091820 52%,#0c2e37)}.understandable-video .video-scene.culvert{background:linear-gradient(120deg,rgba(255,209,102,.12),transparent 24%),linear-gradient(180deg,#1a2a30,#0b1b20 52%,#123841)}.understandable-video .video-scene.roadside{background:linear-gradient(120deg,rgba(56,242,163,.11),transparent 24%),linear-gradient(180deg,#162f2a,#091820 52%,#0e3335)}.waterline{position:absolute;left:0;right:0;bottom:0;background:repeating-linear-gradient(0deg,rgba(255,255,255,.08) 0 2px,transparent 2px 8px),linear-gradient(180deg,#35e8ff8c,#0f5f8ae6);transition:height .26s ease}.video-bridge,.bridge{position:absolute;left:0;right:0;top:48%;height:12px;background:#e6f2f470}.video-bridge{left:10%;right:10%;top:34%;height:16px;background:#b8d4d8;box-shadow:0 18px #b8d4d857}.video-bridge:before,.video-bridge:after{content:"";position:absolute;top:13px;width:10px;height:80px;background:#b8d4d8d1}.video-bridge:before{left:18%}.video-bridge:after{right:18%}.video-road{position:absolute;left:-10%;right:-10%;bottom:9%;height:28px;background:#222c30d1;transform:rotate(-3deg)}.threshold-line{position:absolute;left:0;right:0;bottom:48%;border-top:2px dashed var(--red);z-index:3}.threshold-line span{position:absolute;right:10px;top:-22px;padding:3px 6px;color:#fff;background:#ff5c7ad9;font-size:10px;font-weight:800}.detected-box{position:absolute;left:23%;bottom:34%;width:48%;height:28%;border:2px solid var(--yellow);box-shadow:0 0 16px #ffd1666b;z-index:4;animation:detectPulse 1.8s ease-in-out infinite}.detected-box span{position:absolute;left:-2px;top:-24px;padding:4px 7px;color:#061015;background:var(--yellow);font-size:10px;font-weight:900;white-space:nowrap}.gauge-post{position:absolute;right:18px;top:28px;bottom:38px;width:12px;border:1px solid rgba(236,251,255,.5);background:#050f14b8;z-index:4}.gauge-post:before,.gauge-post:after{position:absolute;left:-39px;color:#dffaff;font-size:9px;font-weight:800}.gauge-post:before{content:"4.5m";top:30%}.gauge-post:after{content:"0m";bottom:0}.gauge-post i{position:absolute;left:2px;right:2px;bottom:2px;background:linear-gradient(180deg,var(--red),var(--yellow),var(--cyan))}.scanline{position:absolute;left:0;right:0;top:0;height:3px;background:#35e8ffd6;animation:scan 2.8s linear infinite}.video-scene.paused .scanline{animation-play-state:paused;opacity:.35}.video-scene.paused .waterline{filter:grayscale(.35)}.video-wall.compact .main-video{height:282px}.play-btn{position:absolute;left:13px;top:13px;display:grid;place-items:center;width:40px;height:40px;border:1px solid rgba(255,255,255,.22);border-radius:50%;background:#0006;color:var(--text);cursor:pointer}.video-meta{position:absolute;left:12px;right:12px;bottom:12px;padding:10px;background:#040c10b8}.video-meta strong,.video-meta span{display:block}.video-meta strong{font-size:13px}.video-meta span{margin-top:4px;color:var(--muted);font-size:11px}.video-thumbs{display:grid;grid-template-columns:repeat(3,1fr);gap:8px}.video-thumbs button{display:flex;align-items:center;justify-content:center;gap:6px;height:46px;color:#bce7ed;border:1px solid rgba(255,255,255,.08);background:#ffffff0a;font-size:11px;cursor:pointer;transition:border-color .18s ease,background .18s ease,transform .18s ease}.video-thumbs button.active{color:#061015;border-color:#35e8ffb3;background:var(--cyan);font-weight:800}.archive-list,.sop-list,.control-stack,.export-list,.evidence-checklist,.insight-stack,.decision-list{display:grid;gap:9px}.archive-card,.filter-grid button,.sop-step,.control-stack button,.export-list button,.playback-timeline button,.analytics-table button{border:1px solid rgba(255,255,255,.08);background:#050f1499;color:inherit;cursor:pointer;transition:border-color .18s ease,background .18s ease,transform .18s ease}.archive-card:hover,.filter-grid button:hover,.sop-step:hover,.control-stack button:hover,.export-list button:hover,.playback-timeline button:hover,.analytics-table button:hover,.multi-chart button:hover,.heatmap button:hover{transform:translateY(-1px);border-color:#35e8ff75}.archive-card{display:grid;gap:5px;padding:12px;text-align:left}.archive-card.active,.filter-grid button.active,.sop-step.active,.playback-timeline button.active{border-color:#35e8ffa6;background:#35e8ff1c}.filter-grid.tall button.active{color:#061015;background:var(--cyan);border-color:var(--cyan);font-weight:900}.filter-grid.tall button:focus:not(.active){outline:1px solid rgba(141,183,192,.18);border-color:#ffffff14}.archive-card strong,.archive-card span,.archive-card em{display:block}.archive-card strong{font-size:13px}.archive-card span,.archive-card em{color:var(--muted);font-size:11px;font-style:normal}.filter-grid{display:grid;grid-template-columns:1fr 1fr;gap:8px}.filter-grid.tall{grid-template-columns:1fr}.filter-grid button{min-height:42px;padding:8px;font-size:11px}.playback-stage,.command-centre,.analytics-stage{display:grid;gap:14px;min-width:0;overflow:hidden}.stage-header{display:flex;justify-content:space-between;align-items:center;gap:16px;padding:16px 18px;border:1px solid var(--line);background:var(--panel);box-shadow:var(--shadow);min-width:0;width:100%;max-width:100%;overflow:hidden}.stage-header>div{min-width:0}.stage-header .primary-btn{flex:0 0 auto;white-space:nowrap;padding-left:10px;padding-right:10px}.command-centre>.stage-header,.command-centre>.command-workflow{width:calc(100vw - 728px);max-width:100%}.stage-header h2,.trend-card h3,.heat-card h3{margin:0}.stage-header p{margin:5px 0 0;color:var(--muted);font-size:12px}.playback-grid{display:grid;grid-template-columns:minmax(360px,1fr) minmax(260px,310px);gap:14px;min-width:0}.playback-workbench{display:grid;gap:12px}.process-rail{display:grid;grid-template-columns:repeat(5,minmax(104px,1fr));gap:8px}.process-rail button{position:relative;min-height:58px;padding:10px 10px 10px 12px;text-align:left;color:inherit;border:1px solid rgba(255,255,255,.08);background:#050f14ad;cursor:pointer;overflow:hidden}.process-rail button:before{content:"";position:absolute;left:0;top:0;bottom:0;width:3px;background:#8db7c080}.process-rail button.complete:before{background:var(--green)}.process-rail button.active{border-color:#35e8ff9e;background:#35e8ff1c}.process-rail button.active:before{background:var(--cyan)}.process-rail span,.process-rail strong{display:block}.process-rail span{color:var(--cyan);font-size:11px;font-weight:900}.process-rail strong{margin-top:6px;font-size:12px}.workbench-grid{display:grid;grid-template-columns:minmax(360px,1fr) minmax(300px,.88fr);gap:12px}.gis-replay-panel,.cctv-replay-panel,.replay-business-flow{border:1px solid var(--line);background:var(--panel);box-shadow:var(--shadow)}.gis-replay-panel,.cctv-replay-panel{padding:12px}.panel-kicker{display:flex;align-items:center;gap:8px;margin-bottom:10px;color:var(--cyan);font-size:12px;font-weight:900;text-transform:uppercase}.panel-kicker em{margin-left:auto;color:var(--yellow);font-style:normal;text-transform:none}.mini-gis-map{position:relative;height:284px;overflow:hidden;border:1px solid rgba(53,232,255,.18);background:linear-gradient(rgba(53,232,255,.04) 1px,transparent 1px),linear-gradient(90deg,rgba(53,232,255,.04) 1px,transparent 1px),radial-gradient(circle at 52% 45%,rgba(46,141,255,.2),transparent 40%),#07151b;background-size:36px 36px,36px 36px,auto,auto}.gis-river,.gis-flood-wave{position:absolute;left:8%;top:49%;height:18px;border-radius:999px;transform:rotate(-7deg)}.gis-river{width:84%;background:#35e8ff2e}.gis-flood-wave{background:linear-gradient(90deg,var(--cyan),var(--blue));box-shadow:0 0 26px #35e8ff8f;transition:width .26s ease}.rain-cell{position:absolute;border:1px solid rgba(255,209,102,.26);background:repeating-linear-gradient(115deg,rgba(255,209,102,.16) 0 5px,transparent 5px 12px);animation:rainCell 2.8s linear infinite}.rain-a{left:13%;top:12%;width:32%;height:36%}.rain-b{right:10%;top:22%;width:28%;height:33%;animation-delay:-1.1s}.gis-site{position:absolute;z-index:3;padding:6px 8px;color:#dffaff;border:1px solid rgba(53,232,255,.38);background:#050f14db;font-size:11px;font-weight:900;cursor:pointer}.gis-site.active{color:#061015;background:var(--cyan)}.playhead{position:absolute;top:0;bottom:0;width:2px;background:var(--yellow);box-shadow:0 0 16px #ffd166b3;transition:left .26s ease}.playhead span{position:absolute;top:12px;left:8px;padding:5px 7px;color:#061015;background:var(--yellow);font-size:11px;font-weight:900}.sensor-replay-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:8px;margin-top:10px}.sensor-replay-grid div{padding:10px;background:#ffffff0a}.sensor-replay-grid span,.sensor-replay-grid strong{display:block}.sensor-replay-grid span{color:var(--muted);font-size:11px}.sensor-replay-grid strong{margin-top:5px;font-size:16px}.mini-bar{height:6px;margin-top:8px;background:#ffffff17}.mini-bar i{display:block;height:100%;background:linear-gradient(90deg,var(--green),var(--yellow),var(--red))}.realistic-cctv{position:relative;height:296px;overflow:hidden;border:1px solid rgba(53,232,255,.24);background:#0d2028}.cctv-sky{position:absolute;inset:0 0 44%;background:linear-gradient(120deg,rgba(255,255,255,.12),transparent 22%),linear-gradient(180deg,#243842,#12252d)}.cctv-road{position:absolute;left:-8%;right:-8%;bottom:10%;height:38px;background:#263136;transform:rotate(-3deg);box-shadow:0 -12px #ffffff21}.cctv-bridge{position:absolute;left:10%;right:9%;top:35%;height:18px;background:#bfdbde;box-shadow:0 24px #bfdbde54;z-index:3}.cctv-bridge:before,.cctv-bridge:after{content:"";position:absolute;top:18px;width:13px;height:112px;background:#bfdbded1}.cctv-bridge:before{left:24%}.cctv-bridge:after{right:18%}.cctv-water{position:absolute;left:0;right:0;bottom:0;background:repeating-linear-gradient(0deg,rgba(255,255,255,.09) 0 2px,transparent 2px 10px),linear-gradient(180deg,#35e8ffb8,#0c6184f0);transition:height .26s ease}.cctv-rain{position:absolute;inset:0;background:repeating-linear-gradient(100deg,transparent 0 15px,rgba(195,244,255,.22) 15px 17px);animation:cctvRain .85s linear infinite;pointer-events:none}.step-0 .cctv-rain{opacity:.42;animation-duration:1.3s}.step-1 .cctv-rain,.step-2 .cctv-rain{opacity:.72;animation-duration:.95s}.step-3 .cctv-rain{opacity:.92;animation-duration:.68s}.step-4 .cctv-rain{opacity:.34;animation-duration:1.5s}.is-paused .cctv-rain{animation-play-state:paused;opacity:.35}.cctv-threshold{position:absolute;left:0;right:0;bottom:48%;z-index:5;border-top:2px dashed var(--red)}.cctv-threshold span{position:absolute;right:8px;top:-25px;padding:5px 7px;color:#fff;background:var(--red);font-size:10px;font-weight:900}.cctv-detection{position:absolute;left:27%;top:34%;width:44%;height:36%;z-index:6;border:2px solid var(--yellow);box-shadow:0 0 18px #ffd16680;animation:detectPulse 1.8s ease-in-out infinite}.step-0 .cctv-detection,.step-1 .cctv-detection{opacity:.35;border-style:dashed}.step-3 .cctv-detection{border-color:var(--red);box-shadow:0 0 22px #ff5c7aa6}.clip-1 .cctv-detection{left:21%;top:49%;width:52%;height:20%}.clip-2 .cctv-detection{left:59%;top:41%;width:24%;height:32%}.cctv-traffic i,.cctv-debris i,.cctv-response-truck{position:absolute;z-index:6}.cctv-traffic i{bottom:14%;width:26px;height:12px;border-radius:2px;background:#ffd166d9;box-shadow:0 0 12px #ffd1664d}.cctv-traffic i:nth-child(1){left:16%;animation:trafficMove 8s linear infinite}.cctv-traffic i:nth-child(2){left:44%;background:#ecfbffcc;animation:trafficMove 10s linear infinite reverse}.cctv-traffic i:nth-child(3){display:none;right:18%;background:#ff5c7ae6}.step-2 .cctv-traffic i:nth-child(3),.step-3 .cctv-traffic i:nth-child(3){display:block}.step-3 .cctv-traffic i{animation-play-state:paused}.cctv-debris i{display:none;width:9px;height:5px;background:#5d4128f2;transform:rotate(16deg)}.cctv-debris i:nth-child(1){left:61%;bottom:38%}.cctv-debris i:nth-child(2){left:65%;bottom:35%}.cctv-debris i:nth-child(3){left:69%;bottom:39%}.cctv-debris i:nth-child(4){left:72%;bottom:36%}.clip-2 .cctv-debris i,.step-3 .cctv-debris i,.step-4 .cctv-debris i{display:block}.cctv-response-truck{display:none;right:16%;bottom:13%;padding:5px 8px;color:#061015;background:var(--cyan);font-size:10px;font-weight:900}.step-4 .cctv-response-truck{display:block}.cctv-detection span{position:absolute;left:-2px;top:-28px;padding:5px 7px;color:#061015;background:var(--yellow);font-size:10px;font-weight:900;white-space:nowrap}.cctv-osd{position:absolute;left:12px;right:12px;bottom:12px;z-index:7;padding:10px;background:#040c10b8}.cctv-osd strong,.cctv-osd span,.cctv-confidence span,.cctv-confidence strong{display:block}.cctv-osd span,.cctv-confidence span{color:var(--muted);font-size:11px}.cctv-confidence{position:absolute;right:12px;top:12px;z-index:8;padding:9px 10px;text-align:right;border:1px solid rgba(53,232,255,.28);background:#040c10b3}.cctv-confidence strong{margin-top:3px;color:var(--green);font-size:20px}.clip-strip{display:grid;grid-template-columns:repeat(3,1fr);gap:8px;margin-top:10px}.clip-strip button{display:grid;grid-template-columns:14px 1fr;gap:4px 7px;align-items:center;min-height:58px;padding:7px;color:inherit;text-align:left;border:1px solid rgba(255,255,255,.08);background:#ffffff0a;cursor:pointer}.clip-strip button span{min-width:0;font-size:12px;line-height:1.12;overflow-wrap:anywhere}.clip-strip button.active{color:#061015;background:var(--cyan);font-weight:900}.clip-strip em{grid-column:2;color:inherit;opacity:.78;font-size:9px;font-style:normal}.replay-business-flow{display:flex;justify-content:space-between;gap:14px;padding:14px 16px}.replay-business-flow strong,.replay-business-flow p{margin:0}.replay-business-flow p{margin-top:5px;color:#bce7ed;font-size:12px}.flow-evidence{display:flex;align-items:center;gap:8px;flex-wrap:wrap;justify-content:flex-end;min-width:260px}.flow-evidence span{padding:6px 8px;color:#061015;background:var(--yellow);font-size:11px;font-weight:900}.alert-funnel,.drainage-network-map,.quality-panel,.sla-board,.response-map{min-height:300px;padding:16px;border:1px solid var(--line);background:linear-gradient(rgba(53,232,255,.04) 1px,transparent 1px),linear-gradient(90deg,rgba(53,232,255,.04) 1px,transparent 1px),#07141af0;background-size:38px 38px,38px 38px,auto;box-shadow:var(--shadow)}.alert-funnel h3,.drainage-network-map h3,.quality-panel h3,.sla-board h3,.response-map h3{margin:0 0 14px}.alert-funnel{display:grid;align-content:start;gap:10px}.alert-funnel button,.quality-panel button,.sla-board button,.maintenance-list button{border:1px solid rgba(255,255,255,.08);background:#ffffff0a;color:inherit;cursor:pointer}.alert-funnel button{display:grid;grid-template-columns:1fr 48px;gap:8px;align-items:center;padding:10px;text-align:left}.alert-funnel .bar{grid-column:1 / -1}.multi-chart.labelled button{position:relative}.multi-chart.labelled button span{position:absolute;left:50%;bottom:-24px;transform:translate(-50%) rotate(-35deg);color:var(--muted);font-size:9px;white-space:nowrap}.compact-table button{grid-template-columns:62px 130px 150px 1fr 40px}.drainage-network-map{position:relative}.network-lines{position:relative;height:240px}.network-node{position:absolute;z-index:3;display:grid;place-items:center;width:90px;height:62px;color:#061015;border:0;background:var(--cyan);font-weight:900;cursor:pointer}.network-node span{color:var(--red)}.n-0{left:9%;top:40%}.n-1{left:39%;top:18%}.n-2{right:13%;top:42%}.n-3{left:39%;bottom:5%}.link{position:absolute;height:4px;background:repeating-linear-gradient(90deg,var(--yellow) 0 14px,transparent 14px 24px);transform-origin:left center}.l1{left:22%;top:48%;width:32%;transform:rotate(-26deg)}.l2{left:51%;top:31%;width:34%;transform:rotate(24deg)}.l3{left:51%;top:58%;width:31%;transform:rotate(-24deg)}.sensor-reliability-layout,.response-performance-layout{display:grid;grid-template-columns:minmax(360px,1fr) minmax(260px,300px);gap:14px}.device-health-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:10px}.device-health-grid button{display:grid;gap:7px;min-height:138px;padding:12px;color:inherit;text-align:left;border:1px solid rgba(56,242,163,.22);background:#38f2a30f;cursor:pointer}.device-health-grid button.degraded{border-color:#ff5c7a52;background:#ff5c7a14}.device-health-grid span,.device-health-grid em{color:var(--muted);font-size:11px;font-style:normal}.radial-score{display:grid;place-items:center;width:54px;height:54px;border-radius:50%;background:radial-gradient(circle at center,#071116 56%,transparent 57%),conic-gradient(var(--cyan) var(--score),rgba(255,255,255,.1) 0);font-size:12px;font-weight:900}.quality-panel{display:grid;align-content:start;gap:8px}.quality-panel button,.sla-board button{display:grid;grid-template-columns:1fr 52px;align-items:center;min-height:34px;padding:7px 9px;text-align:left}.quality-panel button{background:linear-gradient(90deg,#35e8ff33,#35e8ff08)}.maintenance-list{display:grid;gap:8px}.maintenance-list button{display:flex;align-items:center;gap:8px;min-height:42px;padding:9px 10px;text-align:left}.sla-board{display:grid;gap:10px;align-content:start}.sla-board button{grid-template-columns:1fr 58px}.sla-board .bar{grid-column:1 / -1}.response-map{position:relative;overflow:hidden}.coverage-zone{position:absolute;display:grid;place-items:center;width:118px;height:82px;border:1px solid rgba(53,232,255,.4);background:#35e8ff1f;color:#dffaff;text-align:center;font-size:12px;font-weight:900;box-shadow:0 0 36px #35e8ff29}.z1{left:18%;top:28%}.z2{right:18%;top:38%;border-color:#ffd16680;background:#ffd1661f}.z3{left:36%;bottom:12%;border-color:#38f2a380;background:#38f2a31f}.playback-grid>*{min-width:0}.replay-map,.command-map,.trend-card,.heat-card{position:relative;min-height:360px;overflow:hidden;border:1px solid var(--line);background:linear-gradient(rgba(53,232,255,.04) 1px,transparent 1px),linear-gradient(90deg,rgba(53,232,255,.04) 1px,transparent 1px),radial-gradient(circle at 55% 45%,rgba(46,141,255,.18),transparent 38%),#07141af0;background-size:38px 38px,38px 38px,auto,auto;box-shadow:var(--shadow)}.replay-river,.replay-surge{position:absolute;left:8%;top:47%;height:20px;border-radius:999px;transform:rotate(-7deg)}.replay-river{width:84%;background:#35e8ff38}.replay-surge{background:linear-gradient(90deg,var(--cyan),var(--blue));box-shadow:0 0 26px #35e8ff9e;transition:width .26s ease}.replay-marker{position:absolute;padding:7px 9px;border:1px solid rgba(255,209,102,.38);background:#ffd16621;color:#ffe7a3;font-size:11px;cursor:pointer}.replay-marker.active{color:#061015;background:var(--yellow)}.replay-caption{position:absolute;left:18px;right:18px;bottom:18px;padding:14px;border:1px solid rgba(53,232,255,.26);background:#040e12d1}.replay-caption strong,.replay-caption span{display:block}.replay-caption span{margin-top:6px;color:#bce7ed;font-size:12px}.playback-timeline{display:grid;grid-template-columns:repeat(5,minmax(110px,1fr));gap:8px;overflow:hidden}.playback-timeline button{min-height:76px;padding:10px;text-align:left;min-width:0}.playback-timeline span,.playback-timeline strong{display:block}.playback-timeline span{color:var(--cyan);font-size:12px;font-weight:900}.playback-timeline strong{margin-top:6px;font-size:12px}.evidence-checklist div{display:flex;align-items:center;gap:8px;padding:9px;color:#c6edf2;background:#ffffff0a;font-size:12px}.evidence-checklist svg{color:var(--green)}.export-list button,.control-stack button{display:flex;align-items:center;gap:8px;min-height:42px;padding:9px 10px;text-align:left;font-size:12px}.command-status strong{color:var(--red)}.sop-step{display:grid;grid-template-columns:30px 1fr;gap:9px;align-items:center;padding:10px;text-align:left}.sop-step>span{display:grid;place-items:center;width:28px;height:28px;color:#061015;background:var(--cyan);font-weight:900}.sop-step strong,.sop-step small{display:block}.sop-step small{margin-top:3px;color:var(--muted)}.command-map{min-height:470px}.command-workflow{display:grid;gap:12px}.command-flow-rail{display:grid;grid-template-columns:repeat(5,minmax(112px,1fr));gap:8px}.command-flow-rail button{display:grid;grid-template-columns:28px 1fr;align-items:center;gap:8px;min-height:58px;padding:9px;color:inherit;text-align:left;border:1px solid rgba(255,255,255,.08);background:#050f14a3;cursor:pointer}.command-flow-rail button span{display:grid;place-items:center;width:28px;height:28px;color:#061015;background:#8db7c0b3;font-weight:900}.command-flow-rail button.complete span{background:var(--green)}.command-flow-rail button.active{border-color:#35e8ffad;background:#35e8ff1f}.command-flow-rail button.active span{background:var(--cyan)}.command-flow-rail strong{font-size:12px;line-height:1.2}.enhanced-map{min-height:500px;background:linear-gradient(rgba(53,232,255,.045) 1px,transparent 1px),linear-gradient(90deg,rgba(53,232,255,.045) 1px,transparent 1px),radial-gradient(circle at 56% 48%,rgba(46,141,255,.24),transparent 33%),radial-gradient(circle at 38% 35%,rgba(255,92,122,.13),transparent 26%),#07141af5;background-size:38px 38px,38px 38px,auto,auto,auto}.command-route-svg{position:absolute;inset:0;width:100%;height:100%}.map-river{fill:none;stroke:var(--cyan);stroke-width:14;stroke-linecap:round;opacity:.82;filter:drop-shadow(0 0 14px rgba(53,232,255,.45))}.map-road{fill:none;stroke:#ffd16647;stroke-width:4;stroke-dasharray:10 10}.dispatch-route{fill:none;stroke-width:5;stroke-linecap:round;stroke-dasharray:16 13;animation:routeMarch 1.4s linear infinite}.dispatch-route.primary{stroke:var(--yellow)}.dispatch-route.pump-route{stroke:var(--green)}.closure-route{fill:none;stroke:var(--red);stroke-width:8;stroke-dasharray:5 11;opacity:.75}.map-node{position:absolute;z-index:4;display:grid;grid-template-columns:20px 1fr;gap:4px 8px;min-width:150px;padding:10px;color:#dffaff;text-align:left;border:1px solid rgba(53,232,255,.28);background:#050f14db;cursor:pointer;box-shadow:0 14px 30px #0000003d}.map-node svg{grid-row:1 / span 2;color:var(--cyan)}.map-node strong,.map-node span{display:block}.map-node strong{font-size:13px}.map-node span{color:var(--muted);font-size:11px}.map-node.active{color:#061015;border-color:var(--cyan);background:var(--cyan);transform:translateY(-2px)}.map-node.active svg,.map-node.active span{color:#061015}.incident-node{left:34%;top:36%;border-color:#ff5c7a85;background:#ff5c7a21}.video-node{left:48%;top:20%}.team-node.alpha{left:16%;top:25%}.team-node.bravo{right:14%;top:40%}.pump-node{left:42%;bottom:16%}.public-node{right:13%;bottom:20%}.road-closure{position:absolute;left:23%;bottom:31%;z-index:3;padding:9px 11px;border:1px solid rgba(255,92,122,.45);background:#ff5c7a21}.road-closure span,.road-closure strong{display:block}.road-closure span{color:var(--red);font-size:10px;font-weight:900;text-transform:uppercase}.road-closure strong{margin-top:4px;font-size:12px}.map-layer-tags{position:absolute;left:16px;bottom:16px;display:flex;gap:7px;flex-wrap:wrap}.map-layer-tags span{padding:6px 8px;border:1px solid rgba(53,232,255,.26);background:#040c109e;color:#bce7ed;font-size:11px}.stage-0 .dispatch-route,.stage-0 .road-closure,.stage-0 .pump-node,.stage-0 .public-node{opacity:.38}.stage-1 .video-node,.stage-2 .team-node,.stage-3 .pump-node,.stage-4 .public-node{box-shadow:0 0 28px #35e8ff80}.command-action-panel{display:grid;grid-template-columns:minmax(300px,1fr) 1.5fr;gap:12px;padding:14px;border:1px solid var(--line);background:var(--panel);box-shadow:var(--shadow)}.command-action-panel span,.command-action-panel p{color:var(--muted)}.command-action-panel>div>span{display:block;font-size:11px;text-transform:uppercase}.command-action-panel>div>strong{display:block;margin-top:5px;font-size:18px}.command-action-panel p{margin:8px 0 0;font-size:12px;line-height:1.45}.action-kpis{display:grid;grid-template-columns:repeat(4,minmax(110px,1fr));gap:8px}@keyframes routeMarch{to{stroke-dashoffset:-29}}.route-line{position:absolute;left:18%;top:58%;width:62%;height:4px;background:repeating-linear-gradient(90deg,var(--yellow) 0 16px,transparent 16px 28px);transform:rotate(-18deg)}.team-pin{position:absolute;display:flex;align-items:center;gap:7px;padding:9px 11px;color:#061015;border:0;background:var(--cyan);font-weight:900;cursor:pointer}.pin-0{left:17%;top:28%}.pin-1{right:16%;top:45%}.pin-2{left:42%;bottom:19%}.command-incident{position:absolute;left:33%;top:34%;display:grid;gap:6px;width:260px;padding:15px;border:1px solid rgba(255,92,122,.48);background:#ff5c7a1f}.command-incident svg{color:var(--red)}.command-incident span,.team-card span,.decision-list p,.insight-stack p{color:#bce7ed;font-size:12px;line-height:1.45}.team-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:10px}.team-card{display:grid;gap:10px;padding:14px;border:1px solid var(--line);background:var(--panel)}.team-card strong,.team-card span,.team-card em{display:block}.team-card em{color:var(--yellow);font-style:normal;font-weight:900}.decision-list p,.insight-stack p{margin:0;padding:10px;background:#ffffff0a}.analytics-grid{display:grid;grid-template-columns:minmax(360px,1fr) minmax(260px,300px);gap:14px;min-width:0}.analytics-grid>*{min-width:0}.trend-card,.heat-card{min-height:300px;padding:16px}.multi-chart{display:flex;align-items:end;gap:10px;height:220px;margin-top:22px;padding:0 8px;border-bottom:1px solid rgba(255,255,255,.14)}.multi-chart button{flex:1;min-height:34px;border:0;background:linear-gradient(180deg,var(--cyan),var(--blue));cursor:pointer;box-shadow:0 0 18px #35e8ff38}.heatmap{display:grid;grid-template-columns:repeat(6,1fr);gap:7px;margin-top:20px}.heatmap button{aspect-ratio:1;border:1px solid rgba(255,255,255,.08);cursor:pointer}.heatmap .normal{background:#38f2a385}.heatmap .watch{background:#ffd166ad}.heatmap .alert{background:#ff5c7ac7}.analytics-table{display:grid;gap:8px}.analytics-table button{display:grid;grid-template-columns:62px 100px 150px 1fr 40px;align-items:center;gap:10px;min-height:42px;padding:8px 10px;text-align:left}.analytics-table span{color:var(--muted)}.analytics-table em{color:#c6edf2;font-style:normal}.analytics-table b{color:var(--yellow);text-align:right}.node-table{display:grid;gap:8px;margin-top:12px}.node-row{display:grid;grid-template-columns:44px 78px 1fr 42px;align-items:center;gap:8px;font-size:11px}.node-row span{color:var(--muted)}.node-row strong{overflow:hidden;white-space:nowrap;text-overflow:ellipsis}.node-row em{color:#dffaff;font-style:normal;font-weight:800;text-align:right}.bar{height:8px;overflow:hidden;background:#ffffff14}.bar i{display:block;height:100%;background:linear-gradient(90deg,var(--green),var(--yellow),var(--red))}.alert-feed{display:grid;gap:11px}.alert-item{display:grid;grid-template-columns:42px 1fr;gap:10px}.priority{display:grid;place-items:center;width:38px;height:38px;color:#061015;background:var(--yellow);font-size:12px;font-weight:900}.priority.p1{background:var(--red);color:#fff}.priority.p2{background:var(--orange)}.alert-item strong,.alert-item span,.alert-item p{display:block}.alert-item strong{font-size:12px}.alert-item span{margin-top:3px;color:var(--muted);font-size:10px}.alert-item p{margin:5px 0 0;color:#c6edf2;font-size:11px;line-height:1.35}@keyframes pulse{0%{opacity:.8;transform:scale(.65)}to{opacity:0;transform:scale(1.75)}}@keyframes rain{to{transform:translateY(690px)}}@keyframes scan{to{transform:translateY(214px)}}@keyframes detectPulse{0%,to{opacity:.78}50%{opacity:1}}@keyframes cctvRain{to{transform:translateY(34px)}}@keyframes rainCell{to{background-position:36px 36px}}@keyframes trafficMove{0%{transform:translate(-18px)}to{transform:translate(78px)}}@media(max-width:1300px){body{min-width:1000px}.dashboard-grid{grid-template-columns:300px minmax(470px,1fr) 330px}.brand h1{font-size:18px}}