@import "https://fonts.googleapis.com/css2?family=Inter:wght@400;500;600;700&display=swap";*{box-sizing:border-box}html,body,#root{min-height:100%;margin:0;font-family:Inter,Arial,sans-serif}body{color:#e4f1ff;background:#031426}button,input{font-family:inherit}button{cursor:pointer}:root{--bg:#031426;--panel:#07213a;--panel-dark:#04192c;--border:#123c60;--cyan:#16b9c9;--cyan-light:#1ed6e6;--red:#ef4b5f;--orange:#ff9f43;--purple:#9c6cff;--green:#19d39b;--text:#e4f1ff;--muted:#7892ad}.app{background:radial-gradient(circle at 80% 0%, #10648c1f, transparent 30%), var(--bg);min-height:100vh}.sidebar{z-index:10;background:#04192c;border-right:1px solid #0c304d;flex-direction:column;width:240px;padding:18px 12px;display:flex;position:fixed;top:0;bottom:0;left:0}.brand{align-items:center;gap:10px;padding:7px 8px 20px;display:flex}.brand-icon{border:1px solid var(--cyan);width:34px;height:34px;color:var(--cyan);background:#16b9c914;border-radius:7px;place-items:center;display:grid}.brand strong{letter-spacing:1px;font-size:12px;display:block}.brand span{color:#68839b;letter-spacing:1px;margin-top:3px;font-size:8px;display:block}.nav-title{color:#4e6c87;letter-spacing:1.5px;padding:14px 10px 7px;font-size:9px;font-weight:700}nav{gap:3px;display:grid}.nav-link{color:#7892ad;border-left:2px solid #0000;border-radius:5px;align-items:center;gap:10px;padding:10px;font-size:11px;text-decoration:none;display:flex}.nav-link:hover{color:#fff;background:#07233b}.nav-link.active{border-left-color:var(--cyan);color:#fff;background:#07375b}.nav-link em{background:var(--red);border-radius:10px;margin-left:auto;padding:2px 6px;font-size:8px;font-style:normal}.model-status{border-top:1px solid #0c304d;margin-top:18px;padding-top:12px}.status-heading{color:#58718a;letter-spacing:1.2px;margin-bottom:8px;font-size:8px}.model-row{color:#7892ad;justify-content:space-between;padding:5px 0;font-size:8px;display:flex}.model-row b{color:var(--green);font-weight:500}.sidebar-bottom{border-top:1px solid #0c304d;margin-top:auto;padding-top:12px}.operator{align-items:center;gap:8px;margin-bottom:10px;display:flex}.operator strong{font-size:9px;display:block}.operator span{color:#68839b;font-size:8px}.avatar{color:#8eb8d7;background:#0b3150;border:1px solid #18547a;border-radius:50%;place-items:center;width:30px;height:30px;display:grid}.avatar.large{width:46px;height:46px}.logout{border:1px solid var(--border);color:#7994ad;background:0 0;border-radius:5px;justify-content:center;align-items:center;gap:7px;width:100%;padding:8px;font-size:9px;display:flex}.main{min-height:100vh;margin-left:240px}.topbar{z-index:5;background:#031426e6;border-bottom:1px solid #0c304d;justify-content:space-between;align-items:center;height:56px;padding:0 22px;display:flex;position:sticky;top:0}.breadcrumb{color:#53728e;letter-spacing:1px;align-items:center;gap:9px;font-size:9px;display:flex}.breadcrumb strong{color:#fff}.top-right{align-items:center;gap:15px;display:flex}.operational{color:var(--green);border:1px solid #19d39b33;border-radius:4px;padding:6px 9px;font-size:8px}.operational i{background:var(--green);border-radius:50%;width:6px;height:6px;margin-right:5px;display:inline-block}.utc{color:#5c7993;font-family:monospace;font-size:8px}.user-top{color:#aac1d4;align-items:center;gap:6px;font-size:9px;display:flex}.content{max-width:1600px;margin:auto;padding:24px}.page-header{margin-bottom:18px}.eyebrow{color:#4c8eaa;letter-spacing:1.6px;font-size:8px;font-weight:700}.page-header h2{margin:5px 0;font-size:22px}.page-header p{color:var(--muted);margin:0;font-size:10px}.stats-grid{grid-template-columns:repeat(6,1fr);gap:10px;margin-bottom:12px;display:grid}.stat-card{border:1px solid var(--border);background:linear-gradient(135deg,#082640,#061d34);border-radius:6px;gap:10px;padding:13px;display:flex}.stat-card.danger{border-color:#75323e}.stat-icon{width:31px;height:31px;color:var(--cyan);background:#0a3554;border-radius:5px;place-items:center;display:grid}.stat-card>div:last-child span{color:#5c7892;font-size:7px;font-weight:700;display:block}.stat-card strong{margin:5px 0 2px;font-family:monospace;font-size:18px;display:block}.stat-card small{color:#66839d;font-size:7px}.dashboard-grid{grid-template-columns:1.55fr .85fr;gap:12px;margin-bottom:12px;display:grid}.panel{border:1px solid var(--border);background:linear-gradient(145deg,#07233d,#061d34);border-radius:6px;overflow:hidden}.panel-header{border-bottom:1px solid #0d3150;align-items:center;height:42px;padding:0 13px;display:flex}.panel-header h3{color:#8faac1;letter-spacing:1px;margin:0;font-size:9px}.table-container{overflow-x:auto}table{border-collapse:collapse;width:100%;font-size:9px}th{text-align:left;color:#52718c;letter-spacing:1px;border-bottom:1px solid #0d3150;padding:10px 12px;font-size:7px}td{color:#b8cadb;border-bottom:1px solid #123c6080;padding:9px 12px}.mono{color:#6e90aa;font-family:monospace}.level{border-radius:3px;padding:3px 6px;font-size:7px;font-weight:700}.level.critical{color:#ff6878;background:#ef4b5f1f}.level.high{color:#ffb55d;background:#ff9f431a}.level.medium{color:#b18bff;background:#9c6cff1a}.level.low{color:#5fd4ca;background:#16b9c914}.threat{align-items:center;gap:18px;padding:18px;display:flex}.threat-circle{background:conic-gradient(#16b9c9 0 45%, #9c6cff 45% 80%, #ff9f43 80% 95%, #ef4b5f 95%);text-align:center;border-radius:50%;place-items:center;width:100px;height:100px;display:grid}.threat-circle strong{font-family:monospace;font-size:17px}.threat-circle span{color:#7892ad;font-size:6px;display:block}.threat small{color:#58748d;font-size:7px}.threat h3{color:#ffc24f;margin:4px 0;font-size:13px}.threat p{color:#7792aa;font-size:8px}.legend{padding:10px 15px}.legend div{color:#7893aa;justify-content:space-between;padding:5px;font-size:8px;display:flex}.legend span{color:var(--cyan);margin-right:7px}.camera-grid{grid-template-columns:repeat(2,1fr);gap:9px;padding:12px;display:grid}.camera-card{border:1px solid var(--border);background:#061d34;border-radius:5px;overflow:hidden}.camera-preview{color:#547c97;background:linear-gradient(145deg,#071b2d,#0a2940);flex-direction:column;justify-content:center;align-items:center;height:110px;display:flex}.camera-preview span{margin-top:5px;font-family:monospace;font-size:8px}.camera-info{justify-content:space-between;align-items:center;padding:9px;display:flex}.camera-info strong{font-size:9px}.live{color:var(--green);font-size:7px}.camera-card small{color:#607e97;padding:0 9px 9px;font-size:7px;display:block}.system-info{padding:7px 14px}.info-row{color:#7390a9;border-bottom:1px solid #0d3150;justify-content:space-between;padding:10px 0;font-size:8px;display:flex}.info-row b{color:#c0d3e1}.info-row b.good{color:var(--green)}.monitor-layout{grid-template-columns:1fr 300px;gap:12px;display:grid}.video-grid{grid-template-columns:repeat(2,1fr);gap:10px;display:grid}.camera-feed{border:1px solid var(--border);background:#03111f;border-radius:5px;height:285px;position:relative;overflow:hidden}.fake-video{background:#061a2a;position:absolute;inset:0;overflow:hidden}.sky{background:linear-gradient(#061a2a,#0b2737);position:absolute;inset:0 0 50%}.ground{background:linear-gradient(160deg,#0c2731,#081820);height:55%;position:absolute;bottom:0;left:0;right:0}.fence{background:repeating-linear-gradient(90deg,#0000 0 26px,#6f9da140 27px 28px),repeating-linear-gradient(0deg,#0000 0 12px,#6f9da126 13px 14px);position:absolute;inset:35% 0 20%}.person-box{border:1px solid var(--green);width:32px;height:70px;position:absolute;bottom:25%;left:35%}.person-box span{white-space:nowrap;color:#39d6ad;background:#082d29;padding:3px;font-family:monospace;font-size:7px;position:absolute;top:-18px;left:-1px}.person-box.critical{border-color:var(--red);left:65%}.person-box.critical span{color:#ff7380;background:#3a1820}.virtual-boundary{background:var(--green);height:1px;box-shadow:0 0 5px var(--green);position:absolute;bottom:24%;left:4%;right:4%}.virtual-boundary.red{background:var(--red);box-shadow:0 0 5px var(--red)}.demo-video{color:#82b4cd14;letter-spacing:3px;place-items:center;font-family:monospace;font-size:18px;display:grid;position:absolute;inset:0}.feed-title{justify-content:space-between;font-size:8px;display:flex;position:absolute;top:9px;left:10px;right:10px}.feed-title span{color:var(--green)}.feed-time{color:#90a9bc;font-family:monospace;font-size:8px;position:absolute;top:28px;left:10px}.feed-alert{color:#5fd4ca;background:#072c2c;border:1px solid #17675f;padding:4px 6px;font-size:7px;position:absolute;top:45px;right:10px}.feed-alert.critical{color:#ff6978;background:#33151c;border-color:#7c2937}.feed-footer{color:#5e849f;gap:10px;font-size:7px;display:flex;position:absolute;bottom:7px;left:9px;right:9px}.alert-sidebar{align-content:start;display:grid}.alert-card{border:1px solid var(--border);background:#061d34;border-left:3px solid #607890;border-radius:4px;margin:10px;padding:10px}.alert-card.critical{border-left-color:var(--red)}.alert-card.high{border-left-color:var(--orange)}.alert-card.medium{border-left-color:var(--purple)}.alert-top{justify-content:space-between;align-items:center;display:flex}.alert-card h3{margin:8px 0 4px;font-size:10px}.alert-card p{color:#7893aa;font-size:8px;line-height:1.5}.alert-meta{color:#5d7b94;justify-content:space-between;margin-top:9px;font-size:7px;display:flex}.alert-buttons{gap:7px;margin-top:12px;display:flex}.primary-btn,.secondary-btn,.icon-btn{border-radius:5px;justify-content:center;align-items:center;gap:7px;padding:9px 12px;font-size:9px;display:inline-flex}.primary-btn{color:#fff;background:#087c91;border:1px solid #12a8bb}.primary-btn:hover{background:#0b92a7}.primary-btn.small{padding:6px 9px}.primary-btn.full{width:100%;padding:11px}.secondary-btn{border:1px solid var(--border);color:#90aec4;background:0 0}.icon-btn{border:1px solid var(--border);color:#7191a8;background:0 0}.filters{align-items:center;gap:7px;margin-bottom:12px;display:flex}.filter{color:#708da6;border:1px solid var(--border);background:#061d34;border-radius:4px;padding:7px 10px;font-size:8px}.filter.active{color:#fff;background:#0a496a}.search{border:1px solid var(--border);background:#061b2f;border-radius:4px;align-items:center;gap:7px;margin-left:auto;padding:7px 9px;display:flex}.search input,.event-search input{color:#fff;background:0 0;border:none;outline:none;font-size:9px}.alert-grid{grid-template-columns:repeat(3,1fr);gap:12px;display:grid}.alert-grid .alert-card{margin:0;padding:14px}.monitor-bottom{grid-template-columns:1.5fr .8fr .8fr;gap:12px;margin-top:12px;display:grid}.chart{height:220px;padding:10px}.object-list{padding:8px 14px}.object-list div{color:#7993aa;border-bottom:1px solid #0d3150;align-items:center;gap:8px;padding:12px 0;font-size:9px;display:flex}.object-list svg{width:15px;color:var(--cyan)}.object-list b{color:#fff;margin-left:auto;font-family:monospace}.management-grid{grid-template-columns:repeat(2,1fr);gap:12px;display:grid}.management-card{border:1px solid var(--border);background:#07213a;border-radius:6px;overflow:hidden}.management-preview{color:#547c97;background:linear-gradient(145deg,#071b2d,#0b2b42);flex-direction:column;justify-content:center;align-items:center;gap:8px;height:180px;display:flex}.management-preview span{font-family:monospace;font-size:9px}.management-body{justify-content:space-between;padding:13px;display:flex}.management-body small{color:#4c8eaa;font-size:7px}.management-body h3{margin:4px 0;font-size:13px}.management-body p{color:#6f8ba4;margin:0;font-size:8px}.tags{gap:6px;padding:0 13px 13px;display:flex}.tags span{color:#7190a8;border:1px solid var(--border);border-radius:3px;padding:4px 6px;font-size:7px}.analytics-grid{grid-template-columns:1.3fr .7fr;gap:12px;display:grid}.analytics-grid .panel:first-child{grid-column:1/-1}.reports{gap:10px;display:grid}.report-card{border:1px solid var(--border);background:#07213a;border-radius:6px;align-items:center;gap:14px;padding:16px;display:flex}.report-icon{width:40px;height:40px;color:var(--cyan);background:#0a3554;border-radius:6px;place-items:center;display:grid}.report-card h3{margin:0 0 5px;font-size:12px}.report-card p{color:#718da5;margin:0;font-size:9px}.report-card button{margin-left:auto}.settings-grid{grid-template-columns:1fr 1fr;gap:12px;display:grid}.profile{align-items:center;gap:12px;padding:15px;display:flex}.profile h3{margin:0;font-size:12px}.profile p{color:#718da5;margin:4px 0;font-size:8px}.toggle-row{color:#91a9bd;border-bottom:1px solid #0d3150;justify-content:space-between;align-items:center;padding:13px 14px;font-size:9px;display:flex}.toggle{background:#102b42;border:1px solid #31516b;border-radius:12px;width:32px;height:17px;padding:2px}.toggle i{background:#58768e;border-radius:50%;width:11px;height:11px;display:block}.toggle.on{background:#096276;border-color:#13a9bc}.toggle.on i{background:#fff;transform:translate(13px)}.connection{align-items:center;gap:12px;padding:16px;display:flex}.connection svg{color:var(--green)}.connection strong,.connection span{display:block}.connection strong{font-size:9px}.connection span{color:#68859e;margin-top:3px;font-size:8px}.connection b{color:var(--green);margin-left:auto;font-size:8px}.auth-page{background:radial-gradient(circle at 30% 20%,#125f862e,#0000 30%),#031426;place-items:center;min-height:100vh;display:grid}.auth-card{background:#05192cf5;border:1px solid #16476c;border-radius:10px;width:410px;max-width:calc(100% - 32px);padding:28px;box-shadow:0 30px 100px #0006}.auth-logo{width:46px;height:46px;color:var(--cyan);border:1px solid var(--cyan);border-radius:8px;place-items:center;margin-bottom:14px;display:grid}.auth-card h1{margin:7px 0;font-size:24px}.auth-card>p{color:var(--muted);font-size:10px;line-height:1.5}.auth-form{gap:13px;margin-top:20px;display:grid}.auth-form label{color:#9ab1c5;gap:5px;font-size:9px;display:grid}.auth-form input{color:#fff;background:#041a2d;border:1px solid #174364;border-radius:5px;outline:none;width:100%;padding:10px}.demo-message{color:#6e8aa2;background:#071d32;border:1px solid #24445d;border-radius:5px;margin-top:15px;padding:9px;font-size:8px;line-height:1.5}.demo-message strong{color:#9dc1d7}.mobile-menu{color:#fff;background:0 0;border:none;display:none}.mobile-overlay{display:none}@media (width<=1200px){.stats-grid{grid-template-columns:repeat(3,1fr)}}@media (width<=900px){.sidebar{transition:all .2s;transform:translate(-100%)}.sidebar.open{transform:translate(0)}.main{margin-left:0}.mobile-menu{display:block}.mobile-overlay{z-index:9;background:#0000008c;display:block;position:fixed;inset:0}.monitor-layout,.monitor-bottom,.dashboard-grid,.management-grid,.alert-grid,.settings-grid,.analytics-grid{grid-template-columns:1fr}}@media (width<=600px){.content{padding:15px}.stats-grid{grid-template-columns:repeat(2,1fr)}.video-grid,.camera-grid{grid-template-columns:1fr}.top-right .utc{display:none}}