:root{--cobalt:#5f82ff;--cyan:#7de5d1;--ink:#050b12;--panel:#09131e;--line:#263848;--text:#dce8ef;--muted:#89a0ae}
.single-feed-card,.area-search-card{width:min(1180px,calc(100vw - 40px));max-height:calc(100vh - 40px);overflow:auto;background:linear-gradient(135deg,#07111b 0%,#0b1724 60%,#101c2a 100%);border:1px solid #38516a;box-shadow:0 36px 100px #000b;color:var(--text)}
.single-feed-card>header,.area-search-card>header{height:58px;display:grid;grid-template-columns:1fr auto 42px;align-items:center;padding:0 18px;border-bottom:1px solid var(--line);font:700 11px "IBM Plex Mono",monospace;letter-spacing:.14em}.single-feed-card>header b,.area-search-card>header b{color:var(--cyan);font-size:9px}.single-feed-card>header button,.area-search-card>header button{border:0;background:transparent;color:var(--muted);font-size:26px;cursor:pointer}
.single-feed-stage{position:relative;aspect-ratio:16/8.5;background:#010407;overflow:hidden}.single-feed-stage video{width:100%;height:100%;display:block;object-fit:contain;background:#010407;filter:contrast(1.07) saturate(.8)}.single-feed-stage video.feed-night,.single-feed-stage video.feed-thermal{filter:grayscale(1) contrast(1.42) brightness(.76)}
.single-hud{position:absolute;left:16px;right:16px;top:14px;display:flex;justify-content:space-between;color:#eff9fb;font:700 9px "IBM Plex Mono",monospace;letter-spacing:.12em;text-shadow:0 2px 4px #000}.single-hud span:first-child{color:#f17474}.single-crosshair{position:absolute;left:50%;top:50%;width:44px;height:44px;transform:translate(-50%,-50%);border:1px solid #d8eef399;border-radius:50%}.single-crosshair:before,.single-crosshair:after{content:"";position:absolute;background:#d8eef399}.single-crosshair:before{height:1px;width:72px;left:-15px;top:21px}.single-crosshair:after{width:1px;height:72px;left:21px;top:-15px}
.detection{position:absolute;width:12%;height:24%;min-width:78px;min-height:70px;border:2px solid #7de5d1;color:#cffff5;filter:drop-shadow(0 0 8px #4ce7c755);animation:detectPulse 1.8s ease-in-out infinite}.detection:before,.detection:after{content:"";position:absolute;width:10px;height:10px;border-color:#fff}.detection:before{left:-2px;top:-2px;border-left:2px solid;border-top:2px solid}.detection:after{right:-2px;bottom:-2px;border-right:2px solid;border-bottom:2px solid}.detection b,.detection span{position:absolute;left:-2px;background:#06111ddd;padding:4px 6px;font:700 8px "IBM Plex Mono",monospace;white-space:nowrap}.detection b{top:-23px;color:#fff}.detection span{bottom:-24px}.detection--person{left:43%;top:25%}.detection--vehicle{right:15%;bottom:18%;width:19%;height:18%;border-color:#f0bd65;color:#ffe2aa;animation-delay:.45s}.detections-hidden .detection{display:none}@keyframes detectPulse{50%{opacity:.68}}
.single-feed-footer{min-height:72px;padding:12px 16px;display:flex;align-items:center;gap:10px;border-top:1px solid var(--line)}.single-feed-footer>div{margin-right:auto}.single-feed-footer span,.single-feed-footer b{display:block;font:700 9px "IBM Plex Mono",monospace;letter-spacing:.1em}.single-feed-footer b{margin-top:5px;color:var(--cyan)}.single-feed-footer button,.search-actions button{padding:12px 14px;border:1px solid #365069;background:#0b1723;color:#cfe0e8;font:700 9px "IBM Plex Mono",monospace;letter-spacing:.08em;cursor:pointer}.single-feed-footer button:hover,.search-actions button:hover{border-color:var(--cobalt);color:#fff}
.area-search-layout{display:grid;grid-template-columns:1.25fr .75fr;min-height:540px}.search-graphic{padding:40px;border-right:1px solid var(--line);display:flex;flex-direction:column;justify-content:center}.search-sector{position:relative;height:340px;clip-path:polygon(8% 0,100% 9%,94% 92%,4% 100%,0 22%);background:linear-gradient(135deg,#0d1c2a,#071019);border:1px solid #37576c;overflow:hidden}.search-sector:before{content:"";position:absolute;inset:0;background-image:linear-gradient(#31506655 1px,transparent 1px),linear-gradient(90deg,#31506655 1px,transparent 1px);background-size:48px 48px}.search-sector i{position:absolute;left:9%;right:8%;height:2px;background:linear-gradient(90deg,var(--cobalt),var(--cyan));box-shadow:0 0 10px #5f82ff88}.search-sector i:nth-child(1){top:18%}.search-sector i:nth-child(2){top:34%;transform:rotate(2deg)}.search-sector i:nth-child(3){top:50%;transform:rotate(-2deg)}.search-sector i:nth-child(4){top:66%;transform:rotate(2deg)}.search-sector i:nth-child(5){top:82%}.search-sector span{position:absolute;right:28px;bottom:24px;font:700 10px "IBM Plex Mono",monospace;letter-spacing:.14em}.search-graphic p{max-width:620px;color:var(--muted);font-size:13px;line-height:1.7}.search-config{padding:34px;display:grid;gap:14px;align-content:center}.search-metric{padding:18px;border:1px solid var(--line);background:#081521}.search-metric span,.search-config label span{display:block;margin-bottom:9px;color:var(--muted);font:700 9px "IBM Plex Mono",monospace;letter-spacing:.12em}.search-metric b{font-size:28px}.search-config select{width:100%;padding:13px;border:1px solid #33495c;background:#07111b;color:#e4eef3;font:600 11px "IBM Plex Mono",monospace}.search-actions{display:grid;grid-template-columns:1fr 1.25fr;gap:8px;margin-top:10px}.search-actions button:last-child{background:#264dc6;border-color:#5f82ff;color:#fff}
.feed-grid .feed-thermal video,.sensor-feed video.feed-thermal{filter:grayscale(1) contrast(1.48) brightness(.72)!important}.feed-grid .feed-night video,.sensor-feed video.feed-night{filter:grayscale(1) contrast(1.35) brightness(.66)!important}.map-toolbar button b{white-space:nowrap}.map-toolbar button#tool-zone{min-width:78px}
.feed-grid .feed-cctv video,.sensor-feed video.feed-cctv,.single-feed-stage video.feed-cctv{filter:grayscale(.55) contrast(1.18) brightness(.82);object-fit:cover}.feed-grid .feed-cctv:after{content:"FIXED CCTV · OBJECT DETECTION";position:absolute;right:8px;top:8px;color:#dce8ef;font:700 5px "IBM Plex Mono",monospace;letter-spacing:.08em}.symbol.cctv{color:#8ee7d2}.asset-marker.cctv span{border-color:#7de5d1;color:#7de5d1}.asset-marker.cctv:after{color:#b9d9d1}
@media(max-width:820px){.single-feed-card,.area-search-card{width:100vw;max-height:100dvh;border-left:0;border-right:0}.single-feed-card>header,.area-search-card>header{grid-template-columns:1fr 42px;height:auto;min-height:52px}.single-feed-card>header b,.area-search-card>header b{display:none}.single-feed-stage{aspect-ratio:4/3}.single-feed-footer{display:grid;grid-template-columns:1fr 1fr}.single-feed-footer>div{grid-column:1/-1}.single-feed-footer button{padding:10px 6px}.area-search-layout{grid-template-columns:1fr}.search-graphic{padding:18px;border-right:0;border-bottom:1px solid var(--line)}.search-sector{height:240px}.search-config{padding:18px}.search-metric b{font-size:22px}.detection{width:20%;height:22%}.detection--vehicle{width:30%}.map-toolbar button#tool-zone{min-width:64px}.map-toolbar button b{font-size:6px}}
@media(prefers-reduced-motion:reduce){.detection{animation:none}}