:root{color-scheme:light;font-family:Inter,ui-sans-serif,system-ui,-apple-system,BlinkMacSystemFont,Segoe UI,sans-serif;background:#eef2f3;color:#172124}*{box-sizing:border-box}body{margin:0}button,a{font:inherit}button{cursor:pointer}main{min-height:100vh;padding:24px}.loading{display:grid;place-items:center;color:#506267}.login-page{display:grid;place-items:center;background:linear-gradient(135deg,#eef2f3f0,#e0eae8f0),repeating-linear-gradient(90deg,#d8e3e5 0 1px,transparent 1px 24px)}.login-panel{width:min(520px,100%);padding:24px;border:1px solid #d6e0e2;border-radius:8px;background:#fff}.login-panel .brand-mark,.login-panel h1{margin-bottom:18px}.login-form,.onboarding-form{display:grid;gap:12px}.onboarding-form h3{grid-column:1 / -1;margin:0;font-size:18px}.login-form label,.onboarding-form label{display:grid;gap:6px;color:#52666b;font-size:13px;font-weight:800}.login-form input,.onboarding-form input,.onboarding-form select{width:100%;min-height:42px;padding:0 11px;border:1px solid #c9d6d9;border-radius:7px;background:#fff;color:#172124;font:inherit}.form-error,.form-note{padding:10px 12px;border-radius:7px;font-size:14px}.form-error{color:#a12b2b;background:#ffe1de}.form-note{color:#1d6b55;background:#e3f3eb}.error-panel{width:min(680px,100%);padding:24px;border:1px solid #d6e0e2;border-radius:8px;background:#fff}.error-panel strong,.error-panel span{display:block}.error-panel strong{color:#172124;font-size:28px}.error-panel span{margin-top:8px}.topbar,.brand-lockup,.view-tabs,.icon-link,.hero-band,.panel-head,.camera-row,.price-row,.site-status,.site-meta,.financial-strip{display:flex;align-items:center}.topbar{justify-content:space-between;gap:14px;margin-bottom:18px}.brand-lockup{gap:11px;min-width:260px}.brand-lockup strong,.brand-lockup span{display:block}.brand-lockup span{max-width:520px;color:#52666b;font-size:13px}.brand-mark,.event-icon,.step-dot{display:grid;place-items:center;flex:0 0 auto}.brand-mark{width:40px;height:40px;border-radius:8px;background:#14282e;color:#fff}.view-tabs{min-height:42px;padding:4px;border:1px solid #c9d6d9;border-radius:8px;background:#fff}.view-tabs button{min-height:32px;padding:0 12px;border:0;border-radius:6px;background:transparent;color:#52666b;text-transform:capitalize}.view-tabs button.active{background:#14282e;color:#fff}.icon-link,.primary-action{gap:8px;min-height:42px;padding:0 13px;border:1px solid #b9cace;border-radius:7px;color:#173f49;text-decoration:none;background:#fff}button.icon-link{cursor:pointer}button.icon-link span{max-width:130px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.primary-action{border:0;background:#1d6b55;color:#fff;font-weight:800}.hero-band{justify-content:space-between;gap:18px;margin-bottom:16px;padding:20px;border:1px solid #d6e0e2;border-radius:8px;background:#fff}.eyebrow{margin:0 0 6px;color:#66777b;font-size:12px;font-weight:800;text-transform:uppercase}h1,h2,p{margin:0;letter-spacing:0}h1{font-size:36px;line-height:1.05}h2{font-size:24px;line-height:1.15}.muted{color:#66777b;font-size:13px}.metrics-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:12px;margin-bottom:16px}.metric{display:flex;align-items:flex-start;gap:12px;min-height:104px;padding:17px;border:1px solid #d6e0e2;border-radius:8px;background:#fff}.metric svg{margin-top:2px;color:#315f68}.metric span,.metric small,.camera-row small,.event-row small,.step span{display:block;color:#66777b;font-size:12px}.metric strong{display:block;margin-top:5px;font-size:25px}.metric-green strong,.metric-green svg{color:#1d6b55}.metric-blue strong,.metric-blue svg{color:#2467b0}.metric-ink strong,.metric-ink svg{color:#14282e}.workspace{display:grid;grid-template-columns:292px 1fr;gap:16px}.customer-list,.site-panel,.wide-panel{border:1px solid #d6e0e2;border-radius:8px;background:#fff}.customer-list{padding:14px;align-self:start}.section-title{margin:4px 4px 12px;color:#66777b;font-size:12px;font-weight:800;text-transform:uppercase}.customer{display:flex;width:100%;min-height:70px;align-items:center;justify-content:space-between;gap:12px;padding:12px;border-radius:7px;text-align:left;background:transparent}.customer>button:first-child{display:flex;flex:1;align-items:center;justify-content:space-between;gap:12px;min-height:46px;border:0;background:transparent;text-align:left}.customer strong,.customer small{display:block}.customer em{min-width:34px;padding:5px 8px;border-radius:999px;background:#edf3f4;color:#52666b;font-style:normal;font-weight:800;text-align:center}.customer.active{background:#e7f0f2}.mini-action,.text-action{border:0;border-radius:6px;background:#edf3f4;color:#52666b;font-size:12px;font-weight:800}.mini-action{min-height:30px;padding:0 8px}.text-action{width:calc(100% - 24px);min-height:34px;margin:0 12px 12px}.mini-action:hover,.text-action:hover{background:#ffe1de;color:#a12b2b}.site-panel,.wide-panel{padding:18px}.wide-panel{min-height:460px}.compact{margin-bottom:14px}.panel-head{justify-content:space-between;gap:20px;margin-bottom:16px}.site-status{gap:8px;color:#1d6b55;font-weight:800}.financial-strip,.site-meta{flex-wrap:wrap;gap:10px;margin-bottom:14px}.financial-strip span,.financial-strip strong,.site-meta span{display:inline-flex;align-items:center;gap:7px;min-height:34px;padding:0 10px;border-radius:7px;background:#f1f5f6;color:#394f54}.financial-strip strong{background:#e3f3eb;color:#1d6b55}.camera-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:14px}.camera-tile{overflow:hidden;border:1px solid #d6e0e2;border-radius:8px;background:#fff}.video-surface{position:relative;display:grid;aspect-ratio:16 / 9;place-items:center;overflow:hidden;background:linear-gradient(135deg,#14282ef0,#1c5d4bd6),repeating-linear-gradient(90deg,#244c52 0 1px,#19383d 1px 12px);color:#ddf5ee}.video-attention{background:linear-gradient(135deg,#473318f0,#905b1fc7),repeating-linear-gradient(90deg,#5c3f23 0 1px,#3b2d1f 1px 12px)}.video-offline{background:linear-gradient(135deg,#252a2df5,#595f62c7),repeating-linear-gradient(90deg,#41494c 0 1px,#2b3235 1px 12px)}.video-surface svg,.video-surface span{position:relative;z-index:2}.video-surface span{margin-top:52px;font-size:13px;font-weight:800}.scanline{position:absolute;inset:0;background:linear-gradient(180deg,transparent,rgba(255,255,255,.08),transparent);animation:scan 4s linear infinite}@keyframes scan{0%{transform:translateY(-100%)}to{transform:translateY(100%)}}.camera-row,.price-row{justify-content:space-between;gap:12px;padding:12px 12px 0}.status{border-radius:999px;padding:4px 8px;font-size:12px;font-weight:800;text-transform:capitalize;white-space:nowrap}.status-online{color:#1d6b55;background:#e3f3eb}.status-attention{color:#9b5b00;background:#fff1d3}.status-offline,.status-critical{color:#a12b2b;background:#ffe1de}.health-bar{height:6px;margin:12px 12px 0;overflow:hidden;border-radius:999px;background:#e7eeee}.health-bar span{display:block;height:100%;border-radius:inherit;background:#1d6b55}.camera-specs{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:8px;padding:12px;color:#66777b;font-size:13px}.camera-specs span{min-height:30px;padding:7px 8px;border-radius:6px;background:#f3f6f7}.price-row{padding-bottom:12px;color:#66777b;font-size:13px}.price-row strong{color:#172124;font-size:15px}.event-list,.steps,.plan-grid,.archive-list{display:grid;gap:12px}.event-row,.step,.plan,.archive-row,.empty-state{display:grid;gap:12px;border:1px solid #d6e0e2;border-radius:8px;background:#fbfcfc}.archive-row{grid-template-columns:1fr auto;align-items:center;padding:14px}.archive-row span,.archive-row small{display:block;color:#52666b;font-size:13px}.empty-state{padding:18px;color:#52666b}.event-row{grid-template-columns:42px 1fr auto;align-items:center;min-height:84px;padding:14px}.event-icon,.step-dot{width:36px;height:36px;border-radius:8px;background:#edf3f4;color:#315f68}.event-warning .event-icon{color:#9b5b00;background:#fff1d3}.event-critical .event-icon{color:#a12b2b;background:#ffe1de}.event-row span,.step p,.plan span{display:block;color:#52666b;font-size:14px}.event-row time{color:#66777b;font-size:13px;white-space:nowrap}.provisioning-panel{display:grid;grid-template-columns:280px 1fr;gap:24px}.onboarding-panel{display:grid;grid-template-columns:340px 1fr;gap:24px}.sync-button{margin-top:16px}.onboarding-stack{display:grid;gap:14px}.onboarding-form{grid-template-columns:repeat(2,minmax(0,1fr));padding:14px;border:1px solid #d6e0e2;border-radius:8px;background:#fbfcfc}.onboarding-form label:nth-child(5),.onboarding-form .form-note,.onboarding-form button{grid-column:1 / -1}.config-output{display:grid;gap:10px;padding:14px;border:1px solid #b9cace;border-radius:8px;background:#14282e;color:#fff}.config-output pre{overflow:auto;margin:0;padding:12px;border-radius:7px;background:#0d1a1e;color:#d7f4ed;font-size:12px}.step{grid-template-columns:42px 1fr;padding:14px}.step-active{border-color:#95b8bd;background:#f1f7f8}.step-done .step-dot{color:#1d6b55;background:#e3f3eb}.plan-grid{grid-template-columns:repeat(3,minmax(0,1fr))}.plan{padding:18px}.plan svg{color:#315f68}.plan strong{font-size:22px}.plan em{color:#1d6b55;font-style:normal;font-weight:900}@media (max-width: 1080px){.topbar{align-items:stretch;flex-direction:column}.metrics-grid,.camera-grid,.plan-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.workspace,.provisioning-panel,.onboarding-panel,.onboarding-form{grid-template-columns:1fr}}@media (max-width: 680px){main{padding:16px}h1{font-size:30px}.hero-band,.panel-head,.event-row{align-items:stretch;grid-template-columns:1fr;flex-direction:column}.view-tabs{overflow-x:auto}.metrics-grid,.camera-grid,.plan-grid{grid-template-columns:1fr}}