:root{--bg-base:#08090d;--bg-surface:#0f121a;--bg-card:#141824;--bg-card-hover:#1b2130;--bg-card-glass:#0f121ad9;--border-subtle:#ffffff12;--border-light:#ffffff26;--border-party:#e11d4866;--border-amber:#f59e0b59;--text-primary:#f8fafc;--text-secondary:#94a3b8;--text-muted:#64748b;--text-party:#fb7185;--accent-red:#e11d48;--accent-red-glow:#e11d4873;--accent-crimson:#be123c;--accent-amber:#f59e0b;--accent-amber-glow:#f59e0b59;--accent-emerald:#10b981;--accent-cyan:#38bdf8;--accent-teal:#00f0ff;--accent-teal-glow:#00f0ff59;--accent-party:#e11d48;--radius-sm:4px;--radius-md:8px;--radius-lg:12px;--font-display:"Space Grotesk", -apple-system, sans-serif;--font-mono:"JetBrains Mono", monospace;--font-sans:"Plus Jakarta Sans", system-ui, sans-serif;--shadow-card:0 8px 32px #0000008c}*{box-sizing:border-box;margin:0;padding:0}html,body{touch-action:manipulation;overscroll-behavior-y:none;-webkit-tap-highlight-color:transparent;-webkit-user-select:none;user-select:none}body{font-family:var(--font-sans);background-color:var(--bg-base);color:var(--text-primary);-webkit-font-smoothing:antialiased;background-image:radial-gradient(circle at 50% 0,#e11d4812 0%,#0000 60%),radial-gradient(circle at 90% 90%,#f59e0b0a 0%,#0000 50%),linear-gradient(#ffffff04 1px,#0000 1px),linear-gradient(90deg,#ffffff04 1px,#0000 1px);background-size:100% 100%,100% 100%,32px 32px,32px 32px;min-height:100dvh;line-height:1.5;overflow-x:hidden}h1,h2,h3,.font-display{font-family:var(--font-display);letter-spacing:-.02em}.mono{font-family:var(--font-mono)}::-webkit-scrollbar{width:6px;height:6px}::-webkit-scrollbar-track{background:var(--bg-base)}::-webkit-scrollbar-thumb{background:#1e2536;border-radius:2px}::-webkit-scrollbar-thumb:hover{background:var(--accent-red)}.glass-panel{background:var(--bg-card-glass);-webkit-backdrop-filter:blur(16px);border:1px solid var(--border-subtle);border-radius:var(--radius-lg);box-shadow:var(--shadow-card)}.brutalist-border{border:1px solid var(--border-party);box-shadow:0 0 20px #e11d4826}.telescreen-frame{border-radius:var(--radius-lg);background:#000;border:1px solid #ffffff1a;position:relative;overflow:hidden}.telescreen-frame:after{content:" ";z-index:10;pointer-events:none;opacity:.6;background:linear-gradient(#12101000 50%,#00000040 50%) 0 0/100% 4px;display:block;position:absolute;inset:0}@keyframes surveillancePulse{0%,to{opacity:1;transform:scale(1);box-shadow:0 0 #e11d48b3}50%{opacity:.85;transform:scale(1.1);box-shadow:0 0 0 6px #e11d4800}}.pulse-red{background-color:var(--accent-red);border-radius:50%;width:8px;height:8px;animation:1.8s ease-in-out infinite surveillancePulse;display:inline-block}.pulse-emerald{background-color:var(--accent-emerald);border-radius:50%;width:8px;height:8px;animation:2s ease-in-out infinite surveillancePulse;display:inline-block}button{font-family:var(--font-display);cursor:pointer;-webkit-user-select:none;user-select:none;transition:all .2s cubic-bezier(.4,0,.2,1)}.btn-primary{background:linear-gradient(135deg, var(--accent-crimson), var(--accent-red));color:#fff;text-transform:uppercase;letter-spacing:.04em;border-radius:var(--radius-md);box-shadow:0 2px 14px var(--accent-red-glow);border:1px solid #ffffff26;align-items:center;gap:8px;padding:8px 16px;font-size:.825rem;font-weight:700;display:inline-flex}.btn-primary:hover{opacity:.95;transform:translateY(-1px);box-shadow:0 4px 20px #e11d4899}.btn-amber{background:linear-gradient(135deg, #b45309, var(--accent-amber));color:#000;text-transform:uppercase;letter-spacing:.04em;border-radius:var(--radius-md);box-shadow:0 2px 14px var(--accent-amber-glow);border:1px solid #f59e0b66;align-items:center;gap:8px;padding:8px 16px;font-size:.825rem;font-weight:800;display:inline-flex}.btn-amber:hover{transform:translateY(-1px);box-shadow:0 4px 20px #f59e0b80}.btn-ghost{color:var(--text-secondary);border:1px solid var(--border-subtle);border-radius:var(--radius-md);letter-spacing:.02em;background:#ffffff0a;align-items:center;gap:6px;padding:8px 14px;font-size:.825rem;font-weight:600;display:inline-flex}.btn-ghost:hover{color:var(--text-primary);border-color:var(--border-light);background:#ffffff17}.btn-danger{color:var(--accent-red);border-radius:var(--radius-md);background:#e11d4826;border:1px solid #e11d4859;align-items:center;gap:6px;padding:8px 14px;font-size:.825rem;font-weight:600;display:inline-flex}.btn-danger:hover{background:#e11d484d}input,select,textarea{font-family:var(--font-mono);border:1px solid var(--border-subtle);color:var(--text-primary);border-radius:var(--radius-md);-webkit-user-select:text;user-select:text;background:#090c13;outline:none;padding:8px 12px;font-size:.85rem;transition:border-color .2s,box-shadow .2s}input:focus,select:focus,textarea:focus{border-color:var(--accent-red);box-shadow:0 0 0 3px #e11d4833}.ticker-wrapper{white-space:nowrap;-webkit-user-select:none;user-select:none;cursor:default;z-index:40;background:linear-gradient(90deg,#18090f 0%,#201017 50%,#18090f 100%);border-bottom:1px solid #e11d484d;display:flex;position:relative;overflow:hidden}.ticker-track{will-change:transform;gap:40px;padding:5px 0;animation:26s linear infinite tickerScroll;display:inline-flex}.ticker-wrapper:hover .ticker-track{animation-play-state:paused}.ticker-item{font-family:var(--font-display);letter-spacing:.14em;text-transform:uppercase;color:#fda4af;flex-shrink:0;align-items:center;gap:20px;font-size:.72rem;font-weight:700;display:inline-flex}@keyframes tickerScroll{0%{transform:translate(0)}to{transform:translate(-50%)}}.player-fullscreen{z-index:999999!important;width:100vw!important;height:100dvh!important;box-shadow:none!important;background:#000!important;border:none!important;border-radius:0!important;flex-direction:column!important;justify-content:center!important;margin:0!important;display:flex!important;position:fixed!important;inset:0!important}.player-fullscreen .telescreen-frame{aspect-ratio:auto!important;border:none!important;border-radius:0!important;width:100%!important;height:100%!important}.player-fullscreen video{object-fit:contain!important;width:100%!important;height:100%!important}.fullscreen-top-bar{padding:max(14px, env(safe-area-inset-top,0px)) max(16px, env(safe-area-inset-right,0px)) 18px max(16px, env(safe-area-inset-left,0px));z-index:60;background:linear-gradient(#000000e6 0%,#00000080 70%,#0000 100%);justify-content:space-between;align-items:center;gap:12px;transition:opacity .3s,transform .3s;display:flex;position:absolute;top:0;left:0;right:0}.fullscreen-bottom-bar{padding:18px max(16px, env(safe-area-inset-right,0px)) max(16px, env(safe-area-inset-bottom,0px)) max(16px, env(safe-area-inset-left,0px));z-index:60;background:linear-gradient(#0000 0%,#0009 30%,#000000f2 100%);flex-wrap:wrap;justify-content:center;align-items:center;gap:10px;transition:opacity .3s,transform .3s;display:flex;position:absolute;bottom:0;left:0;right:0}.fullscreen-controls-hidden{transform:translateY(-10px);opacity:0!important;pointer-events:none!important}.fullscreen-bottom-hidden{transform:translateY(10px);opacity:0!important;pointer-events:none!important}.fullscreen-btn{border:1px solid var(--border-party);color:#fff;font-size:.78rem;font-family:var(--font-display);cursor:pointer;-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px);background:#121620e0;border-radius:6px;align-items:center;gap:8px;min-height:44px;padding:10px 16px;font-weight:700;transition:all .15s;display:inline-flex}.fullscreen-btn:hover,.fullscreen-btn:active{border-color:var(--accent-red);background:#e11d4840;transform:scale(1.03)}.table-desktop-view{display:block}.cards-grid-view{grid-template-columns:repeat(auto-fill,minmax(330px,1fr));gap:14px;display:grid}.cards-mobile-view{display:contents}.entity-card,.mobile-entity-card{border:1px solid var(--border-subtle);-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);background:#0d1018e0;border-radius:8px;flex-direction:column;gap:10px;padding:14px;transition:border-color .2s,box-shadow .2s,transform .15s;display:flex;box-shadow:0 4px 16px #0006}.entity-card:hover,.mobile-entity-card:hover{border-color:#e11d4880;box-shadow:0 6px 24px #e11d482e}.entity-card:active,.mobile-entity-card:active{border-color:var(--accent-red);box-shadow:0 4px 20px #e11d4833}.preview-fullscreen-btn{opacity:0;pointer-events:none;transition:opacity .2s cubic-bezier(.16,1,.3,1),transform .2s cubic-bezier(.16,1,.3,1),background .15s,border-color .15s;transform:scale(.85);z-index:30!important;border:1px solid var(--border-party)!important;color:#fff!important;cursor:pointer!important;-webkit-backdrop-filter:blur(8px)!important;backdrop-filter:blur(8px)!important;background:#080a10e6!important;border-radius:6px!important;justify-content:center!important;align-items:center!important;width:36px!important;height:36px!important;margin:0!important;padding:0!important;display:flex!important;position:absolute!important;bottom:10px!important;right:10px!important;box-shadow:0 4px 14px #000000b3,0 0 10px #e11d4840!important}.telescreen-player-container:hover .preview-fullscreen-btn,.telescreen-player-container:focus-within .preview-fullscreen-btn,.preview-fullscreen-btn.is-active{opacity:1!important;pointer-events:auto!important;transform:scale(1)!important}@media (hover:none) and (pointer:coarse),(width<=868px){.preview-fullscreen-btn{opacity:.92!important;pointer-events:auto!important;transform:scale(1)!important}}.preview-fullscreen-btn:hover{background:var(--accent-red)!important;border-color:var(--accent-red)!important;box-shadow:0 0 16px #e11d4899!important}.cctv-grid-1x1{justify-content:center;width:100%;display:flex}.cctv-grid-1x1>*{width:100%;max-width:min(100%,1400px)}.cctv-grid-2x2{grid-template-columns:repeat(2,minmax(0,1fr));gap:16px;display:grid}.cctv-grid-3x3{grid-template-columns:repeat(3,minmax(0,1fr));gap:14px;display:grid}.cctv-grid-auto{grid-template-columns:repeat(auto-fill,minmax(min(100%,360px),1fr));gap:16px;display:grid}@media (width<=1024px){.cctv-grid-3x3{grid-template-columns:repeat(2,minmax(0,1fr))}}@media (width<=640px){.cctv-grid-2x2,.cctv-grid-3x3{grid-template-columns:1fr;gap:12px}}.navbar-container{box-sizing:border-box;width:100%;max-width:1600px;margin:0 auto;padding:0 20px}.responsive-container{padding:24px;padding-top:calc(16px + env(safe-area-inset-top,0px));box-sizing:border-box;width:100%;max-width:1600px;margin:0 auto}.responsive-grid-2{grid-template-columns:repeat(2,1fr);gap:14px;display:grid}.responsive-grid-3{grid-template-columns:repeat(3,1fr);gap:12px;display:grid}.responsive-tabs{-webkit-overflow-scrolling:touch;scrollbar-width:none;display:flex;overflow-x:auto}.responsive-tabs::-webkit-scrollbar{display:none}.table-responsive-wrapper{-webkit-overflow-scrolling:touch;width:100%;overflow-x:auto}.mobile-only{display:none!important}.desktop-only,.cam-info-extended{display:flex}.cam-watermark{display:block}@media (width<=868px){.responsive-container{padding:12px;padding-top:calc(8px + env(safe-area-inset-top,0px))}input,select,textarea{font-size:16px!important}.desktop-only{display:none!important}.mobile-only{display:flex!important}.table-desktop-view{display:none!important}.cards-mobile-view,.cards-grid-view{flex-direction:column!important;gap:12px!important;display:flex!important}.responsive-grid-2,.responsive-grid-3{grid-template-columns:1fr}.cam-info-extended,.cam-watermark{display:none!important}body{padding-bottom:calc(64px + env(safe-area-inset-bottom,0px))}}@media (width<=480px){h1{font-size:1.2rem!important}.btn-primary,.btn-amber,.btn-ghost,.btn-danger{padding:7px 12px;font-size:.75rem}.ticker-track{animation-duration:20s}}@keyframes alarm-pulse-border{0%{border-color:#e11d48;box-shadow:0 0 #e11d48b3,inset 0 0 15px #e11d4859}50%{border-color:#ff335f;box-shadow:0 0 24px 5px #e11d48d9,inset 0 0 28px #e11d488c}to{border-color:#e11d48;box-shadow:0 0 #e11d48b3,inset 0 0 15px #e11d4859}}.alarm-active{border-color:#e11d48!important;animation:1.2s infinite alarm-pulse-border!important}@keyframes slideInRight{0%{transform:translate(100%)}to{transform:translate(0)}}@keyframes countdownBar{0%{transform:scaleX(1)}to{transform:scaleX(0)}}.dashboard-metrics-grid{grid-template-columns:repeat(4,minmax(0,1fr));gap:14px;display:grid}.dashboard-metric-card{border-radius:8px;flex-direction:column;justify-content:space-between;padding:16px;transition:all .2s;display:flex}.dashboard-panel{border:1px solid var(--border-party);box-sizing:border-box;background:#0d1018d9;border-radius:8px;flex-direction:column;gap:14px;width:100%;padding:16px;display:flex}.dashboard-snapshots-grid{box-sizing:border-box;grid-template-columns:repeat(auto-fill,minmax(min(100%,250px),1fr));gap:14px;width:100%;display:grid}.dashboard-feeds-grid{box-sizing:border-box;grid-template-columns:repeat(auto-fill,minmax(min(100%,340px),1fr));gap:16px;width:100%;display:grid}.dashboard-infra-grid{box-sizing:border-box;grid-template-columns:repeat(4,minmax(0,1fr));gap:12px;width:100%;display:grid}.dashboard-infra-card{border:1px solid var(--border-subtle);box-sizing:border-box;background:#0d1018bf;border-radius:8px;flex-direction:column;justify-content:space-between;gap:8px;min-width:0;padding:12px 14px;transition:all .2s;display:flex;overflow:hidden}.dashboard-infra-card:hover{border-color:var(--accent-teal);background:#101622e6}.alerts-gallery-grid{grid-template-columns:repeat(auto-fill,minmax(min(100%,300px),1fr));gap:16px;display:grid}.alerts-filter-bar{border:1px solid var(--border-party);background:#0d1018d9;border-radius:8px;flex-wrap:wrap;justify-content:space-between;align-items:center;gap:12px;padding:12px 16px;display:flex}.alerts-filter-group{flex-wrap:wrap;flex:1;align-items:center;gap:10px;display:flex}@media (width<=1024px){.dashboard-metrics-grid,.dashboard-infra-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:12px}}@media (width<=868px){.dashboard-feeds-grid{grid-template-columns:1fr;gap:12px}}@media (width<=640px){.dashboard-panel{gap:12px;padding:12px}.dashboard-metrics-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:8px}.dashboard-metric-card{padding:12px}.dashboard-metric-card .metric-value{font-size:1.35rem!important}.dashboard-snapshots-grid,.dashboard-feeds-grid{grid-template-columns:1fr;gap:12px}.dashboard-infra-grid{grid-template-columns:1fr;gap:8px}.dashboard-infra-card{padding:10px 12px}.alerts-gallery-grid{grid-template-columns:1fr;gap:12px}.alerts-filter-bar{flex-direction:column;align-items:stretch;padding:10px}.alerts-filter-group{flex-direction:column;align-items:stretch;width:100%}.alerts-filter-group select,.alerts-filter-group input{width:100%!important}.alerts-filter-group .status-pill-group{width:100%;display:flex}.alerts-filter-group .status-pill-group button{text-align:center;flex:1}}@media (width<=400px){.dashboard-metrics-grid{grid-template-columns:1fr}}@media (width>=1800px){.responsive-container,.navbar-container{max-width:95vw;padding-left:32px;padding-right:32px}.dashboard-metrics-grid{grid-template-columns:repeat(4,minmax(0,1fr));gap:18px}.dashboard-feeds-grid{grid-template-columns:repeat(auto-fill,minmax(440px,1fr));gap:20px}.dashboard-snapshots-grid{grid-template-columns:repeat(auto-fill,minmax(280px,1fr));gap:16px}.dashboard-infra-grid{grid-template-columns:repeat(4,minmax(0,1fr));gap:16px}.cctv-grid-auto{grid-template-columns:repeat(auto-fill,minmax(440px,1fr));gap:20px}.cctv-grid-2x2{max-width:2200px;margin:0 auto}.alerts-gallery-grid{grid-template-columns:repeat(auto-fill,minmax(320px,1fr));gap:20px}}@media (width>=2560px){.responsive-container,.navbar-container{max-width:96vw;padding-left:44px;padding-right:44px}.dashboard-feeds-grid{grid-template-columns:repeat(4,minmax(0,1fr));gap:24px}.dashboard-snapshots-grid{grid-template-columns:repeat(6,minmax(0,1fr));gap:18px}.cctv-grid-auto{grid-template-columns:repeat(auto-fill,minmax(480px,1fr));gap:24px}.cctv-grid-2x2{max-width:2400px;margin:0 auto}.alerts-gallery-grid{grid-template-columns:repeat(auto-fill,minmax(380px,1fr));gap:24px}}
