:root{font-family:Inter,ui-sans-serif,system-ui,sans-serif;color:#172735;background:#eef3f6;font-synthesis:none;--navy-950: #07131e;--navy-900: #0c1d2b;--navy-800: #193247;--red-600: #b82333;--red-700: #951c29;--line: #d5e0e7;--muted: #647989;--surface: #ffffff;--surface-soft: #f6f9fb;--shadow: 0 14px 40px rgba(14, 37, 54, .08)}*{box-sizing:border-box}body{margin:0;min-width:320px;background:radial-gradient(circle at 90% -10%,rgba(84,139,175,.13),transparent 34rem),#eef3f6}#root>main{min-height:100vh;display:grid;grid-template-columns:minmax(240px,.55fr) minmax(320px,1fr);align-items:center;gap:clamp(28px,8vw,120px);padding:clamp(24px,7vw,100px)}#root>main>section{max-width:540px;padding:clamp(24px,4vw,42px);border:1px solid var(--line);border-radius:18px;background:#ffffffeb;box-shadow:var(--shadow)}#root>main .connect{display:grid;grid-template-columns:1fr;gap:11px}#root>main .connect input,#root>main .connect button{width:100%;max-width:none;min-height:44px}button,input,select,textarea{font:inherit}button{cursor:pointer}button:disabled{cursor:not-allowed;opacity:.58}button:focus-visible,input:focus-visible,select:focus-visible,textarea:focus-visible{outline:3px solid rgba(37,119,170,.25);outline-offset:2px}.layout{display:grid;grid-template-columns:260px minmax(0,1fr);min-height:100vh}aside{display:flex;flex-direction:column;color:#dce7ef;background:linear-gradient(180deg,rgba(34,59,78,.2),transparent 18rem),var(--navy-950);padding:24px 16px;border-right:1px solid #203548;position:sticky;top:0;height:100vh;overflow-y:auto}.brand{display:grid;padding:4px 12px 28px}.brand span,.eyebrow{font-size:11px;font-weight:850;letter-spacing:.16em;color:#d83847}.brand strong{font-size:20px;margin-top:4px}nav{display:grid;gap:5px}nav button{color:#9fb1c0;text-align:left;border:0;border-radius:9px;background:transparent;padding:11px 12px;cursor:pointer;transition:color .12s ease,background .12s ease,transform .12s ease}nav button:hover{color:#fff;background:#172a3a;transform:translate(2px)}nav button.active{color:#fff;background:linear-gradient(90deg,#243e53,#1a3042);box-shadow:inset 3px 0 var(--red-600)}.session{margin-top:auto;padding:16px 12px;border-top:1px solid #263a4c}.session small{color:#8ca0b1}main{width:100%;max-width:1680px;padding:30px clamp(22px,3vw,48px) 60px;margin:0 auto}header,.toolbar,.card-head{display:flex;align-items:center;justify-content:space-between}h1{margin:4px 0 24px;font-size:clamp(27px,3vw,36px);letter-spacing:-.035em}h2{margin:0 0 5px;letter-spacing:-.02em}h3{margin:0}p{color:var(--muted);line-height:1.55}.health{display:flex;align-items:center;gap:9px;padding:7px;border:1px solid var(--line);border-radius:12px;background:#ffffffe0;color:#27623d;font-size:13px;box-shadow:0 6px 20px #172d3e0f}.health i{display:inline-block;width:7px;height:7px;border-radius:50%;background:#2d9b58;margin-right:7px}.health button,.secondary-action{border:1px solid var(--line);border-radius:8px;padding:8px 11px;color:#2b465a;background:var(--surface);font-weight:700}.health button:hover,.secondary-action:hover{background:#edf3f7}.connect{display:flex;gap:7px}.connect input{max-width:170px}.connect button{color:#fff;background:#243d52;border:0;border-radius:7px;padding:8px 12px;cursor:pointer}.toolbar,.card{background:#fffffff0;border:1px solid var(--line);border-radius:16px;padding:clamp(18px,2vw,24px);margin-bottom:20px;box-shadow:var(--shadow)}.toolbar form{display:flex;gap:8px}.user-form{display:grid;grid-template-columns:repeat(3,minmax(160px,1fr));gap:10px;margin:18px 0;padding:16px;background:#f6f8fa;border-radius:9px}.nvr-form{display:grid;grid-template-columns:repeat(3,minmax(170px,1fr));gap:10px;margin:18px 0}.nvr-form button{color:#fff;background:#b92131;border:0;border-radius:7px;font-weight:700}.nvr-form button:disabled{background:#8796a1;cursor:not-allowed}.onboarding-guidance{margin:2px 0 20px;padding:14px 16px;border:1px solid #c9dce8;border-left:4px solid #397aa2;border-radius:9px;background:#f0f7fb}.onboarding-guidance p{margin:5px 0}.onboarding-guidance small{color:#577184}.user-form select{border:1px solid #bccbd5;border-radius:7px;padding:9px 11px;background:#fff}.user-form label{display:flex;align-items:center;gap:7px}.user-form button{color:#fff;background:#b92131;border:0;border-radius:7px;font-weight:700;cursor:pointer}input{border:1px solid #bccbd5;border-radius:7px;padding:9px 11px}.toolbar select,.nvr-form select,.nvr-form input,.user-form input,.user-form select{min-height:42px;border:1px solid #b9c9d4;border-radius:8px;background:#fff;padding:9px 11px}.toolbar button{color:#fff;background:#b92131;border:0;border-radius:7px;padding:9px 13px;font-weight:700;cursor:pointer}.rows{display:grid;margin-top:16px}.row{display:grid;grid-template-columns:1.2fr 1fr 1fr;border-top:1px solid #e5ebef;padding:13px 8px}.row span:nth-child(2),.row span:nth-child(3){color:#607382}.notice{padding:11px 14px;border-radius:8px;margin-bottom:14px}.notice.error{color:#8c1e29;background:#f9dfe2}.notice.success{color:#22603b;background:#dcf2e5}.status{color:#237244;background:#dff4e7;border-radius:99px;padding:5px 10px}.status.attention{color:#8a5620;background:#fff0d8}.queue-card{margin:12px 0;padding:16px;border:1px solid var(--line);border-radius:12px;background:var(--surface)}.queue-card>div:last-child{display:flex;flex-wrap:wrap;gap:8px;margin-top:12px}.queue-card button,.site-overview button,.detail-panel button{border:0;border-radius:8px;padding:9px 12px;color:#fff;background:var(--navy-800);font-weight:750}.queue-card button:hover,.site-overview button:hover,.detail-panel button:hover{background:#254962}.site-directory{display:grid;grid-template-columns:repeat(auto-fit,minmax(280px,1fr));gap:16px;margin-bottom:22px}.site-card{display:grid;gap:14px;padding:20px;border:1px solid var(--line);border-radius:16px;background:#fffffff0;box-shadow:0 8px 26px #0e25360f;transition:transform .14s ease,border-color .14s ease,box-shadow .14s ease}.site-card:hover,.site-card.selected{transform:translateY(-2px);border-color:#8eacbf;box-shadow:var(--shadow)}.site-card.selected{box-shadow:inset 0 3px var(--red-600),var(--shadow)}.site-card p{margin:0}.site-card .secondary-action{width:100%;color:#29465a;background:#edf3f7}.site-overview{padding:clamp(20px,3vw,30px);border:1px solid #c9d7e0;border-radius:18px;background:linear-gradient(145deg,#fff,#f7fafc);box-shadow:var(--shadow)}.site-overview-head{display:flex;align-items:flex-start;justify-content:space-between;gap:20px}.site-overview-head h2{margin-top:4px;font-size:28px}.site-overview-head p{margin:5px 0 0}.site-overview-head>button{background:var(--red-600)}.site-actions{display:flex;align-items:center;justify-content:flex-end;gap:10px;flex-wrap:wrap}.site-edit-form{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:14px;padding:16px;margin:18px 0;border:1px solid #d8e3e9;border-radius:12px;background:var(--surface-soft)}.site-edit-form label{display:grid;gap:6px;color:var(--muted);font-size:12px;font-weight:700}.site-edit-form input{width:100%}.site-edit-form .site-actions{grid-column:1 / -1}.site-metrics{display:grid;grid-template-columns:repeat(5,minmax(110px,1fr));gap:10px;margin:22px 0}.site-metrics span{display:grid;gap:3px;padding:14px;border:1px solid #dbe4ea;border-radius:10px;color:#617787;background:var(--surface-soft);font-size:12px}.site-metrics strong{color:#183348;font-size:24px}.site-metrics.compact{grid-template-columns:repeat(3,1fr);margin:0}.site-metrics.compact span{padding:9px}.site-metrics.compact strong{font-size:17px}.site-detail-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:14px}.detail-panel{min-width:0;padding:18px;border:1px solid #d8e3e9;border-radius:12px;background:#fff}.detail-panel.span-two{grid-column:1 / -1}.detail-panel .card-head>span{color:var(--muted);font-size:12px}.detail-row{display:grid;grid-template-columns:minmax(150px,.8fr) minmax(220px,1.5fr) auto;align-items:center;gap:14px;padding:13px 0;border-top:1px solid #e5ecef}.detail-row>div,.detail-stack{display:grid;gap:4px;min-width:0}.detail-row span,.detail-row small,.detail-stack small{overflow-wrap:anywhere;color:var(--muted)}.detail-stack{position:relative;padding:13px 0;border-top:1px solid #e5ecef}.detail-stack .status{position:absolute;top:10px;right:0}dl{display:grid;grid-template-columns:repeat(2,minmax(250px,1fr));gap:14px;margin:18px 0 0}dl div{padding:12px;background:#f6f8fa;border-radius:8px}dt{color:#718290;font-size:12px;text-transform:uppercase}dd{margin:5px 0 0;font-weight:650}.warning{padding:12px;border-left:3px solid #dc9a26;background:#fff7e8;color:#765416}.admin-live-view{margin:16px 0 22px;padding:14px;border:1px solid #bccbd5;border-radius:9px;background:#07111b;color:#fff}.admin-live-view video{display:block;width:100%;max-height:620px;margin-top:12px;background:#000}.talk-button{margin-top:10px;background:#9d2430;color:#fff;font-weight:700}.incident-admin-list,.camera-actions{display:grid;gap:10px}.trigger-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(140px,1fr));gap:8px;margin-top:12px;border:1px solid #d7e0e6;border-radius:7px}.trigger-grid legend{padding:0 6px;font-weight:700}.incident-admin-list .item{display:grid;gap:8px}.camera-actions{grid-template-columns:repeat(auto-fit,minmax(180px,max-content))}.check{display:block;padding:13px 0;border-top:1px solid #e1e8ed}.check input{margin-right:10px}@media(max-width:800px){.layout{grid-template-columns:1fr}aside{min-height:auto;position:static;height:auto}nav{grid-template-columns:repeat(2,1fr)}.session{display:none}main{padding:22px}.toolbar{align-items:start;gap:16px;flex-direction:column}.user-form{grid-template-columns:1fr}header{align-items:flex-start;gap:14px;flex-direction:column}.connect{flex-wrap:wrap}dl{grid-template-columns:1fr}.row{grid-template-columns:1fr;gap:5px}.site-overview-head,.detail-row,.site-edit-form{align-items:stretch;grid-template-columns:1fr}.site-edit-form .site-actions{grid-column:auto}.site-overview-head{display:grid}.site-metrics,.site-detail-grid{grid-template-columns:1fr 1fr}.detail-panel.span-two{grid-column:auto}}@media(max-width:520px){#root>main{grid-template-columns:1fr;padding:20px}nav,.site-metrics,.site-metrics.compact,.site-detail-grid{grid-template-columns:1fr}main{padding:18px 14px 40px}.health{flex-wrap:wrap}}