:root{--lightningcss-light: ;--lightningcss-dark:initial;color-scheme:dark;--bg:#07111f;--bg-soft:#0d1a2d;--panel:#0e1a2be0;--panel-strong:#10233b;--border:#97b2d62e;--text:#edf3fb;--muted:#9fb3c8;--accent:#64d2ff;--accent-strong:#3fb5f2;--warn:#ffbc58;--danger:#ff6f7d}*{box-sizing:border-box}html,body,#root{min-height:100%;color:var(--text);background:radial-gradient(circle at 0 0,#64d2ff33,#0000 35%),radial-gradient(circle at 100% 0,#ffbc581f,#0000 28%),linear-gradient(#07111f 0%,#050b14 100%);margin:0;font-family:Inter,ui-sans-serif,system-ui,-apple-system,BlinkMacSystemFont,Segoe UI,sans-serif}body{padding:28px}button,input{font:inherit}button{border:1px solid var(--border);color:var(--text);cursor:pointer;background:#ffffff0a;border-radius:12px;padding:10px 14px}button.primary{background:linear-gradient(135deg, var(--accent), var(--accent-strong));color:#06111e;font-weight:700}button.secondary{color:var(--text);background:#64d2ff14;border-color:#64d2ff40;font-weight:600}button.secondary.active{background:#64d2ff2e;border-color:#64d2ffbf}button.danger{color:#ffd7d7;background:#ff50501a;border-color:#ff6e6e73;font-weight:700}button:disabled{opacity:.65;cursor:progress}.shell{max-width:1360px;margin:0 auto}.hero{grid-template-columns:minmax(0,1.7fr) minmax(320px,.9fr);align-items:stretch;gap:24px;margin-bottom:24px;display:grid}.app-tabs{flex-wrap:wrap;gap:8px;margin-top:18px;display:flex}.app-tabs button{min-height:42px;color:var(--muted);background:#ffffff09;border-radius:999px;padding:9px 14px}.app-tabs button.active{color:var(--text);background:#64d2ff29;border-color:#64d2ffb3;font-weight:700}.shell:not([data-view=settings]) .hero{grid-template-columns:1fr}.shell:not([data-view=settings]) .hero-panel,.shell:not([data-view=settings]) .flow-strip,.shell[data-view=settings] .page-upload,.shell[data-view=settings] .page-live,.shell[data-view=settings] .page-stats,.shell[data-view=settings] .page-grid,.shell[data-view=settings] .page-events,.shell[data-view=live] .page-upload,.shell[data-view=live] .page-stats,.shell[data-view=live] .page-grid,.shell[data-view=live] .page-events,.shell[data-view=upload] .page-live,.shell[data-view=upload] .page-stats,.shell[data-view=upload] .page-grid,.shell[data-view=upload] .page-events,.shell[data-view=stats] .page-upload,.shell[data-view=stats] .page-live,.shell[data-view=stats] .page-events,.shell[data-view=zones] .page-upload,.shell[data-view=zones] .page-live,.shell[data-view=zones] .page-stats,.shell[data-view=zones] .page-events,.shell[data-view=events] .page-upload,.shell[data-view=events] .page-live,.shell[data-view=events] .page-stats,.shell[data-view=events] .page-grid{display:none}.shell[data-view=stats] .page-grid,.shell[data-view=zones] .page-grid{grid-template-columns:1fr}.shell[data-view=stats] .page-grid>.panel:nth-child(n+2),.shell[data-view=zones] .page-grid>.panel:first-child{display:none}.eyebrow{color:var(--accent);text-transform:uppercase;letter-spacing:.14em;margin-bottom:10px;font-size:12px}h1{margin:0;font-size:clamp(34px,4vw,58px);line-height:1.02}.lede{max-width:64ch;color:var(--muted);font-size:16px;line-height:1.7}.flow-strip{grid-template-columns:repeat(5,minmax(0,1fr));gap:10px;margin-top:18px;display:grid}.flow-step{background:#ffffff09;border:1px solid #ffffff0f;border-radius:18px;padding:12px}.flow-step span{min-width:28px;min-height:28px;color:var(--accent);background:#64d2ff1f;border-radius:999px;justify-content:center;align-items:center;font-size:12px;font-weight:700;display:inline-flex}.flow-step strong{margin-top:10px;font-size:14px;display:block}.flow-step p{color:var(--muted);margin:6px 0 0;font-size:12px;line-height:1.5}.hero-panel,.panel,.card{border:1px solid var(--border);-webkit-backdrop-filter:blur(16px);backdrop-filter:blur(16px);background:linear-gradient(#10233beb,#0a121fe0);box-shadow:0 20px 60px #00000038}.hero-panel{border-radius:24px;gap:14px;padding:18px;display:grid}.hero-panel label{color:var(--muted);gap:8px;font-size:13px;display:grid}.toggle-row{align-items:center;gap:10px;display:flex!important}.hero-panel input{border:1px solid var(--border);color:var(--text);background:#ffffff0d;border-radius:12px;padding:12px 14px}.hero-actions{flex-wrap:wrap;gap:10px;display:flex}.status,.error{border-radius:12px;padding:12px 14px}.status{color:var(--accent);background:#64d2ff1a}.status-compact{width:fit-content;display:inline-flex}.error{color:#ffbac2;background:#ff6f7d1f;margin-bottom:16px}.cards{grid-template-columns:repeat(8,minmax(0,1fr));gap:14px;margin-bottom:24px;display:grid}.card{border-radius:20px;flex-direction:column;justify-content:space-between;min-height:118px;padding:18px;display:flex}.card span{color:var(--muted);font-size:13px}.card strong{font-size:clamp(24px,2.4vw,40px)}.grid{grid-template-columns:1.1fr .9fr;gap:18px;margin-bottom:18px;display:grid}.panel{border-radius:24px;padding:18px}.upload-panel{margin-bottom:18px}.upload-grid{grid-template-columns:minmax(280px,.9fr) minmax(0,1.1fr);gap:16px;display:grid}.upload-card,.upload-preview{background:#ffffff09;border:1px solid #ffffff0d;border-radius:18px;padding:16px}.upload-card{align-content:start;gap:14px;display:grid}.file-picker{color:var(--muted);gap:8px;font-size:13px;display:grid}.file-picker input{border:1px solid var(--border);width:100%;color:var(--text);background:#ffffff0a;border-radius:12px;padding:11px 12px}.upload-actions{flex-wrap:wrap;gap:10px;display:flex}.upload-note{color:var(--muted);font-size:13px;line-height:1.6}.upload-preview{gap:14px;display:grid}.preview-empty{min-height:180px}.photo-preview{object-fit:contain;background:#0000002e;border:1px solid #ffffff0f;border-radius:16px;width:100%;max-height:340px}.upload-result{gap:10px;display:grid}.detected-list{flex-wrap:wrap;gap:8px;display:flex}.detected-pill{color:var(--accent);background:#64d2ff1f;border-radius:999px;padding:6px 10px;font-size:12px}.upload-path{color:var(--muted);word-break:break-all;font-size:12px}.live-panel{margin-bottom:18px}.live-toolbar{flex-wrap:wrap;justify-content:space-between;align-items:end;gap:14px;margin-bottom:16px;display:flex}.live-toolbar label{color:var(--muted);gap:8px;font-size:13px;display:grid}.live-toolbar select{border:1px solid var(--border);min-width:220px;color:var(--text);background:#ffffff0d;border-radius:12px;padding:12px 14px}select,select option{background:var(--panel-strong);color:var(--text)}.live-actions,.camera-actions,.event-actions{flex-wrap:wrap;gap:8px;display:flex}.event-mode-toggle{flex-wrap:wrap;align-items:center;gap:8px;margin-bottom:12px;display:flex}.event-filter-bar{grid-template-columns:repeat(6,minmax(150px,1fr)) auto;align-items:end;gap:10px;margin-bottom:14px;display:grid}.event-filter-bar label{min-width:0;color:var(--muted);gap:6px;font-size:12px;display:grid}.event-filter-bar select,.event-filter-bar input{border:1px solid var(--border);width:100%;min-width:0;color:var(--text);background:#ffffff0d;border-radius:12px;padding:10px 12px}.tuning-grid{grid-template-columns:repeat(3,minmax(0,1fr)) auto;align-items:end;gap:12px;margin-bottom:16px;display:grid}.tuning-grid label{color:var(--muted);gap:8px;font-size:13px;display:grid}.tuning-grid input{border:1px solid var(--border);color:var(--text);background:#ffffff0d;border-radius:12px;padding:12px 14px}.tuning-actions{flex-wrap:wrap;gap:8px;display:flex}.live-grid{grid-template-columns:minmax(0,1.25fr) minmax(260px,.75fr);gap:16px;display:grid}.live-preview,.live-state{background:#ffffff09;border:1px solid #ffffff0d;border-radius:18px;padding:16px}.live-state{gap:10px;display:grid}.panel-head{justify-content:space-between;align-items:center;gap:16px;margin-bottom:16px;display:flex}.panel h2{margin:0;font-size:20px}.muted{color:var(--muted)}.stats-list,.zone-list,.event-list,.alert-list{gap:10px;display:grid}.event-layout{grid-template-columns:minmax(340px,.9fr) minmax(420px,1.1fr);align-items:start;gap:16px;display:grid}.stat-row,.zone-item,.event-row,.alert-row{background:#ffffff09;border:1px solid #ffffff0d;border-radius:16px;padding:14px}.event-row.selected{border-color:#64d2ff80;box-shadow:inset 0 0 0 1px #64d2ff33}.stat-row{justify-content:space-between;align-items:center;display:flex}.zone-item{grid-template-columns:180px minmax(0,1fr) auto;align-items:center;gap:16px;display:grid}.zone-item.selected{border-color:#64d2ff73;box-shadow:inset 0 0 0 1px #64d2ff33}.zone-preview{background:radial-gradient(circle at 0 0,#64d2ff1f,#0000 48%),#ffffff08;border:1px solid #ffffff0f;border-radius:16px;place-items:center;width:180px;height:100px;display:grid;overflow:hidden}.zone-preview svg{width:100%;height:100%}.zone-preview rect{fill:#06111e73;stroke:#64d2ff73;stroke-width:1.2px}.zone-preview polygon{fill:#64d2ff38;stroke:#64d2fff2;stroke-width:2.2px;stroke-linejoin:round}.zone-preview-empty{color:var(--muted);font-size:12px}.zone-details{min-width:0}.zone-actions{justify-items:end;gap:8px;display:grid}.zone-editor{background:#ffffff08;border:1px solid #ffffff0f;border-radius:18px;gap:14px;margin-top:16px;padding:16px;display:grid}.zone-editor h3{margin:0;font-size:16px}.zone-editor-grid{grid-template-columns:repeat(3,minmax(0,1fr));gap:12px;display:grid}.zone-editor-grid label,.zone-point-row label{color:var(--muted);gap:8px;font-size:13px;display:grid}.zone-editor-grid input,.zone-editor-grid select,.zone-point-row input{border:1px solid var(--border);color:var(--text);background:#ffffff0d;border-radius:12px;padding:10px 12px}.zone-toggle{align-self:end}.zone-editor-actions{flex-wrap:wrap;gap:8px;display:flex}.camera-editor{background:#ffffff08;border:1px solid #ffffff0f;border-radius:18px;gap:14px;margin-bottom:16px;padding:16px;display:grid}.camera-editor-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:12px;display:grid}.camera-editor-grid label{color:var(--muted);gap:8px;font-size:13px;display:grid}.camera-editor-grid .wide-field{grid-column:1/-1}.camera-editor-grid input{border:1px solid var(--border);color:var(--text);background:#ffffff0d;border-radius:12px;min-width:0;padding:10px 12px}.camera-editor-actions{flex-wrap:wrap;align-items:center;gap:8px;display:flex}.zone-editor-visual{gap:8px;display:grid}.zone-editor-svg{-webkit-user-select:none;user-select:none;touch-action:none;background:linear-gradient(#0a121fe6,#080e19f2);border:1px solid #ffffff0f;border-radius:18px;width:100%;max-width:100%;height:260px}.zone-editor-svg rect:first-of-type{fill:#06111e80}.zone-editor-svg polygon{fill:#64d2ff29;stroke:#64d2fff5;stroke-width:2.4px;stroke-linejoin:round}.zone-editor-svg line{stroke:#64d2ffb8;stroke-width:1.8px}.zone-editor-svg text{fill:var(--text);paint-order:stroke;stroke:#06111ed9;stroke-width:3px;font-size:12px;font-weight:700}.handle{fill:#0f1b2deb;stroke:#64d2fff5;stroke-width:2.5px;cursor:grab}.handle.active{fill:#64d2fff2;stroke:#fffffff2;cursor:grabbing}.zone-point-list{gap:10px;display:grid}.zone-point-row{background:#ffffff08;border:1px solid #ffffff0d;border-radius:14px;grid-template-columns:100px 1fr 1fr auto;align-items:end;gap:10px;padding:12px;display:grid}.zone-item p,.event-row p,.alert-row p{color:var(--muted);margin:6px 0 0}.merge-note{color:var(--warn);margin-top:8px;font-size:13px}.event-main,.event-meta{flex-wrap:wrap;align-items:center;gap:10px;display:flex}.event-main strong{font-size:16px}.roi-list{flex-wrap:wrap;gap:8px;display:flex}.preset-column{gap:10px;display:grid}.preset-buttons{grid-template-columns:repeat(3,minmax(0,1fr));gap:8px;display:grid}.preset-buttons button{text-align:left;gap:4px;padding:12px 14px;display:grid}.preset-buttons button strong{font-size:14px}.preset-buttons button span{color:var(--muted);font-size:12px}.motion-history{gap:10px;margin-top:8px;display:grid}.motion-history-item{background:#ffffff08;border:1px solid #ffffff0d;border-radius:14px;gap:6px;padding:12px;display:grid}.motion-history-head{color:var(--muted);justify-content:space-between;align-items:center;gap:10px;font-size:12px;display:flex}.motion-history-item p{color:var(--muted);margin:0;font-size:12px;line-height:1.5}.event-meta{color:var(--muted);margin-top:10px;font-size:13px}.event-detail{background:#ffffff06;border:1px solid #ffffff0f;border-radius:16px;gap:14px;min-width:0;padding:14px;display:grid}.event-detail-head,.event-timeline-head,.evidence-frame-head{justify-content:space-between;align-items:center;gap:12px;display:flex}.event-detail-head h3,.event-timeline-head h3{margin:4px 0 0;font-size:18px}.event-detail-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:10px;display:grid}.event-detail-grid>div{background:#ffffff08;border-radius:12px;gap:4px;min-width:0;padding:10px;display:grid}.event-detail-grid strong,.evidence-frame-head span{overflow-wrap:anywhere}.event-detail-note,.evidence-frame p{color:var(--muted);margin:0;line-height:1.5}.event-detail-image,.evidence-frame img{object-fit:contain;background:#0000002e;border:1px solid #ffffff0f;border-radius:14px;width:100%}.event-detail-image{max-height:360px}.event-evidence-list{gap:12px;max-height:720px;padding-right:4px;display:grid;overflow:auto}.evidence-frame{background:#ffffff08;border:1px solid #ffffff0d;border-radius:14px;gap:10px;padding:12px;display:grid}.evidence-frame img{max-height:260px}.badge{text-transform:uppercase;border-radius:999px;padding:6px 10px;font-size:12px}.badge.on{color:var(--accent);background:#64d2ff1a}.badge.off{color:var(--warn);background:#ffbc581a}.empty{color:var(--muted);padding:16px 0}@media (width<=1180px){.cards{grid-template-columns:repeat(4,minmax(0,1fr))}.grid,.hero,.upload-grid,.live-grid,.event-layout{grid-template-columns:1fr}.event-filter-bar,.flow-strip{grid-template-columns:repeat(2,minmax(0,1fr))}}@media (width<=720px){body{padding:16px}.cards{grid-template-columns:repeat(2,minmax(0,1fr))}.flow-strip{grid-template-columns:1fr}.panel-head{flex-direction:column;align-items:flex-start}.zone-item{grid-template-columns:1fr;align-items:start}.zone-preview{width:100%}.zone-editor-grid,.zone-point-row,.event-detail-grid,.event-filter-bar{grid-template-columns:1fr}.zone-actions{justify-items:start}}