*{box-sizing:border-box}html,body{margin:0;min-height:100%;font-family:Inter,Segoe UI,Arial,sans-serif;color:#edf3f8;background:#0a1019}button,input{font:inherit}button{cursor:pointer}a{color:inherit;text-decoration:none}.layout{min-height:100vh;display:grid;grid-template-columns:255px minmax(0,1fr)}.sidebar{position:relative;background:#111b28;border-right:1px solid #253444;padding:28px 18px}.brand{display:flex;align-items:center;gap:10px;padding:0 13px 40px;font-size:17px;font-weight:750;letter-spacing:.2px}.brand-mark,.login-symbol{color:#f49b42;font-size:29px}.side-label,.eyebrow{font-size:11px;letter-spacing:1.6px;color:#879aac;font-weight:800}.side-label{padding:0 13px 15px}.nav-link{display:block;padding:13px 14px;margin-bottom:5px;border-radius:9px;color:#aab9c7;font-weight:600}.nav-link:hover,.nav-link.selected{background:#1d3040;color:#fff}.nav-link.selected{box-shadow:inset 3px 0 #f49b42}.side-bottom{position:absolute;bottom:23px;left:24px;right:24px;border-top:1px solid #293747;padding-top:20px}.identity{display:flex;align-items:center;gap:10px}.identity strong,.identity small{display:block}.identity small{color:#8092a3;font-size:12px;margin-top:3px}.avatar{background:#e1853a;color:#111b28;border-radius:50%;height:36px;width:36px;display:grid;place-items:center;font-weight:800}.sign-out{background:transparent;border:0;color:#aab9c7;padding:13px 0}.main{padding:48px clamp(22px,5vw,72px)}.page-head{display:flex;justify-content:space-between;align-items:center;gap:20px;margin-bottom:34px}.page-head h1{font-size:34px;margin:8px 0}.page-head p,.panel p,.footnote{color:#98aaba}.pill{border:1px solid #3a674d;border-radius:30px;padding:9px 14px;color:#8bd5a9;font-size:13px;white-space:nowrap}.camera-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:22px}.camera-card,.panel{background:#121d29;border:1px solid #293b4c;border-radius:13px;overflow:hidden}.camera-top,.camera-bottom{display:flex;justify-content:space-between;align-items:center;gap:10px;padding:15px 18px}.camera-number{font-weight:800;letter-spacing:1px;font-size:12px}.offline,.online{font-size:12px;color:#d1ae73}.offline i,.online i{display:inline-block;width:7px;height:7px;background:#d1ae73;border-radius:50%;margin-right:5px}.online{color:#8bd5a9}.online i{background:#8bd5a9}.video-placeholder{aspect-ratio:16/9;background:radial-gradient(circle at center,#203043 0,#0b121b 67%);display:flex;flex-direction:column;align-items:center;justify-content:center;text-align:center;padding:30px;color:#9badbc}.camera-icon{font-size:38px;color:#526c81;margin-bottom:8px}.video-placeholder strong{color:#dce5ed;font-size:18px;margin-bottom:8px}.video-placeholder span{font-size:13px;max-width:265px;line-height:1.5}.player-wrap,.focus-player-wrap{position:relative;background:#03070b;aspect-ratio:16/9;display:grid;place-items:center}.preview-video,.focus-player-wrap video{height:100%;width:100%;object-fit:contain}.stream-state,.focus-player-wrap span{position:absolute;max-width:80%;text-align:center;padding:10px 14px;background:#111b28db;border-radius:8px;color:#d9e3eb;font-size:13px}.stream-state[hidden],.focus-player-wrap span[hidden],.focus[hidden]{display:none}.watch-button{background:transparent;border:0;color:#f6aa65;font-size:12px;font-weight:800;padding:0}.watch-button:hover{text-decoration:underline}.focus{margin-bottom:25px;background:#121d29;border:1px solid #36516a;border-radius:13px;padding:20px}.focus-head{display:flex;justify-content:space-between;align-items:center;margin-bottom:13px}.focus-head h2{margin:4px 0}.focus p{color:#9aacba;font-size:13px;margin-bottom:0}.camera-bottom{border-top:1px solid #243343;font-size:12px;color:#8a9cad}.footnote{font-size:13px;margin-top:23px}.panel{padding:24px;margin-bottom:22px}.panel h2{margin:0 0 5px;font-size:19px}.create-form{display:flex;align-items:end;gap:12px;margin-top:23px}.create-form label{flex:1;max-width:360px}.login-wrap{min-height:100vh;display:grid;place-items:center;padding:20px}.login-card{width:min(420px,100%);background:#131e2b;border:1px solid #2c3b4c;border-radius:15px;padding:38px;box-shadow:0 20px 80px #0005}.login-symbol{margin-bottom:20px}.login-card h1{margin:8px 0;font-size:32px}.login-card p{color:#98aaba;line-height:1.5;margin:0 0 26px}label{display:block;color:#cbd6df;font-size:13px;font-weight:650}input{display:block;width:100%;margin-top:8px;background:#0e1721;border:1px solid #3c4b5a;border-radius:8px;padding:12px;color:#fff;outline:none}input:focus{border-color:#ed994e;box-shadow:0 0 0 3px #ed994e22}.login-card label{margin-top:17px}.primary{background:#f49b42;color:#1d1b18;border:0;border-radius:8px;padding:12px 18px;font-weight:800}.login-card .primary{width:100%;margin-top:26px}.alert,.credentials{padding:15px 18px;border-radius:9px;margin:17px 0;background:#382924;color:#f6c8a8;border:1px solid #694436}.credentials{background:#173529;border-color:#286344;color:#bce9cb;line-height:1.9}.credentials code{color:white;font-size:14px;user-select:all}.credentials small{display:block;color:#9ed3af}.table-wrap{overflow:auto}table{width:100%;border-collapse:collapse;margin-top:18px;text-align:left}th,td{padding:15px;border-bottom:1px solid #293847}th{color:#8ea1b2;text-transform:uppercase;font-size:11px;letter-spacing:1px}td small{display:block;color:#8395a5;margin-top:5px}.status{display:inline-block;padding:6px 10px;border-radius:20px;font-size:12px}.enabled{background:#173f30;color:#8ee2b2}.disabled{background:#46302a;color:#f0ac9c}.small-button{background:#25384b;border:1px solid #40546a;color:#e5edf4;border-radius:7px;padding:8px 11px}.small-button:hover{background:#304b65}.empty{color:#8799a9;text-align:center}@media(max-width:800px){.layout{grid-template-columns:1fr}.sidebar{padding:14px;display:flex;align-items:center;gap:8px;flex-wrap:wrap}.brand{padding:0 10px 0 0}.side-label{display:none}.nav-link{margin:0;padding:9px}.side-bottom{position:static;border:0;padding:0;margin-left:auto;display:flex;align-items:center;gap:10px}.identity small,.sign-out{display:none}.main{padding:25px}.camera-grid{grid-template-columns:1fr}.page-head{align-items:start}.page-head h1{font-size:28px}}@media(max-width:500px){.sidebar{display:block}.brand{padding:0 0 12px}.side-bottom{margin-top:10px}.identity{display:none}.sign-out{display:block;padding:8px}.create-form{display:block}.create-form .primary{margin-top:12px}}
.setup-banner{display:flex;align-items:center;justify-content:space-between;gap:18px;padding:23px 26px;margin-bottom:25px;border:1px solid #9b673b;border-radius:13px;background:linear-gradient(110deg,#3c261d,#1b2732 70%)}
.configured{font-size:12px;color:#9db2c4}.configured i{display:inline-block;width:7px;height:7px;background:#9db2c4;border-radius:50%;margin-right:5px}
.setup-banner strong,.setup-banner span{display:block}.setup-banner strong{font-size:19px;margin-bottom:5px}.setup-banner span{color:#c5b7aa;font-size:13px}.setup-banner .primary{white-space:nowrap}
.info-strip{display:grid;grid-template-columns:repeat(2,1fr);gap:15px;margin-bottom:24px}.info-strip>div{background:#182633;border:1px solid #2b4051;border-radius:10px;padding:17px 20px}.info-strip strong,.info-strip span{display:block}.info-strip strong{font-size:13px;margin-bottom:6px}.info-strip span{color:#9aabba;font-size:13px;line-height:1.4}
.camera-setup-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:18px}.camera-setup{margin:0}.camera-setup-head{display:flex;justify-content:space-between;align-items:center;gap:10px;margin-bottom:19px}.camera-setup-head h2{margin:4px 0 0}.form-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:17px}.full-field{grid-column:1/-1}.form-actions{display:flex;align-items:center;justify-content:space-between;gap:14px;margin-top:20px}.form-actions p{font-size:12px;line-height:1.4;margin:0}.form-actions .primary{white-space:nowrap}
@media(max-width:1100px){.camera-setup-grid{grid-template-columns:1fr}}@media(max-width:650px){.setup-banner,.form-actions{display:block}.setup-banner .primary,.form-actions .primary{display:inline-block;margin-top:15px}.info-strip,.form-grid{grid-template-columns:1fr}.full-field{grid-column:auto}}
.recording-row{display:flex;align-items:center;justify-content:space-between;gap:16px;margin-top:24px;padding-top:20px;border-top:1px solid #314456}
.recording-row strong,.recording-row span{display:block}.recording-row strong{font-size:14px;color:#e8f0f6}.recording-row span{font-size:12px;color:#9aabba;margin-top:5px}.recording-row form{flex-shrink:0}
.stop-button{background:#843a35;border:1px solid #ad5a50;color:white;border-radius:8px;padding:12px 18px;font-weight:800}
@media(max-width:650px){.recording-row{align-items:flex-start;flex-direction:column}}
.remove-camera-link{display:inline-block;margin-top:19px;color:#e89a90;font-size:13px;text-decoration:underline}
.remove-camera-link:hover{color:#ffc2b9}
.remove-actions{display:flex;align-items:center;gap:12px;margin-top:20px}
/* NEXQRA workspace: the supplied logos are displayed unchanged. */
:root{color-scheme:light;--ink:#152940;--muted:#7b8ca3;--blue:#1263e6;--line:#e1e7f0;--navy:#0c172a}
body{background:#f4f7fb;color:var(--ink);font-family:Inter,"Segoe UI",Arial,sans-serif;font-size:14px}
[hidden]{display:none!important}button,a,input{-webkit-tap-highlight-color:transparent}button:focus-visible,a:focus-visible{outline:3px solid #73aaff;outline-offset:3px}
.icon{width:20px;height:20px;flex-shrink:0;vertical-align:middle}.sr-only{position:absolute;width:1px;height:1px;margin:-1px;padding:0;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}
.layout{grid-template-columns:244px minmax(0,1fr)}.sidebar{position:sticky;top:0;height:100vh;display:flex;flex-direction:column;padding:31px 17px 20px;background:var(--navy);color:#9baac0;border-right:1px solid #1d2b42}
.brand{display:flex;flex-direction:column;align-items:center;gap:14px;padding:0 0 35px}.brand-logo{position:relative;display:block;width:186px;height:58px;overflow:hidden;background:white;border-radius:9px;flex-shrink:0}
.brand-logo img{position:absolute;display:block;width:185%;height:auto;max-width:none;left:50%;top:50%;transform:translate(-48%,-46.2%)}
.brand-caption{font-size:9px;letter-spacing:2.15px;color:#8294ae;font-weight:700}.side-label{font-size:10px;letter-spacing:1.8px;padding:0 16px 14px;color:#61738e}
.nav-link{display:flex;align-items:center;gap:12px;padding:14px 15px;margin-bottom:7px;font-weight:550;font-size:13px;color:#9baac0}.nav-link:hover{background:#15243b;color:white}.nav-link.selected{color:white;background:#183557;box-shadow:inset 3px 0 #4b9bff}.nav-link.selected .icon{color:#80b9ff}
.sidebar-note{margin:auto 12px 24px;padding-top:36px;display:flex;gap:10px;align-items:flex-start;line-height:1.5}.sidebar-note>.icon{color:#c5a454;width:17px}.sidebar-note strong{font-size:11px;color:#c6d0dd;font-weight:500}.sidebar-note span{display:block;font-size:10px;color:#6d809b;margin-top:5px}
.side-bottom{position:static;border-top:1px solid #233047;padding:19px 12px 0}.identity strong{color:#e9eef6;font-size:13px}.identity small{font-size:11px;color:#7588a4;margin-top:4px}.avatar{background:#1b3658;color:#95c1ff;border:1px solid #355073;width:38px;height:38px;border-radius:12px}.sign-out{display:flex;align-items:center;gap:10px;padding:17px 0 0;font-size:12px}.sign-out .icon{width:16px;height:16px}.sign-out:hover{color:white}
.workspace{min-width:0;display:flex;flex-direction:column}.topbar{height:76px;background:white;border-bottom:1px solid var(--line);display:flex;align-items:center;justify-content:space-between;padding:0 clamp(20px,3.5vw,54px);gap:12px}
.breadcrumb{font-size:12px;color:#8a97a9}.breadcrumb>span{margin:0 13px;color:#c6cfdb}.breadcrumb strong{color:#485a72;font-weight:550}.role-badge{display:flex;align-items:center;gap:7px;font-size:11px;color:#687b92;padding:7px 11px;border:1px solid #e4eaf3;border-radius:20px}.role-badge .icon{width:14px;height:14px;color:#3a7ad1}
.main{width:100%;max-width:1680px;padding:38px clamp(20px,3.5vw,54px);margin:0 auto;flex:1}.workspace-footer{display:flex;justify-content:space-between;gap:16px;color:#94a0b1;font-size:10px;border-top:1px solid var(--line);padding:20px clamp(20px,3.5vw,54px)}
.eyebrow{display:flex;align-items:center;gap:7px;font-size:10px;letter-spacing:1.8px;color:#7c8ba2}.accent-line{width:20px;height:2px;background:#dba83e}.page-head{margin-bottom:28px}.page-head h1{font-size:34px;letter-spacing:-1.2px;margin:10px 0 9px;font-weight:750}.heading-dot{color:var(--blue)}.page-head p,.panel p{color:var(--muted);font-size:13px;line-height:1.6;margin:0}.head-actions{display:flex;align-items:center;gap:10px}
.primary,.small-button,.stop-button{display:inline-flex;align-items:center;justify-content:center;gap:8px;border-radius:8px;padding:11px 16px;font-size:12px;font-weight:650;white-space:nowrap}.primary{background:var(--blue);color:white;border:1px solid var(--blue);box-shadow:0 3px 7px #1263e61a}.primary:hover{background:#0a53c7}.small-button{background:white;color:#465b74;border:1px solid #d8e1ec}.small-button:hover{background:#edf3fc;border-color:#b9cce6}.small-button .icon,.primary .icon{width:16px;height:16px}.head-actions>a{background:var(--blue);border-color:var(--blue);color:white}
.stats-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:18px;margin-bottom:34px}.stat-card{background:white;border:1px solid var(--line);border-radius:12px;padding:21px 22px;display:flex;align-items:flex-start;gap:16px;box-shadow:0 3px 9px #1d335104}.stat-icon{display:grid;place-items:center;border-radius:11px;width:43px;height:43px;background:#edf4ff;color:#3276d9;flex-shrink:0}.stat-icon.green{background:#eaf8f1;color:#20a274}.stat-icon.amber{background:#fff6e6;color:#bd8a29}.stat-card>div>span{display:block;color:#78869b;font-size:11px;font-weight:550}.stat-card strong{display:block;font-size:29px;letter-spacing:-.5px;line-height:1.1;margin:7px 0}.stat-card small{color:#94a0b1;font-size:10px}
.camera-toolbar{display:flex;justify-content:space-between;align-items:center;gap:15px;margin-bottom:18px}.camera-toolbar h2{font-size:16px;margin:0;display:flex;align-items:center;gap:9px;letter-spacing:-.3px}.camera-toolbar h2>span{font-size:10px;background:#e7eef9;border-radius:5px;padding:4px 7px;color:#607898}.camera-toolbar p{font-size:11px;color:#8b98aa;margin:6px 0 0}.camera-tools{display:flex;align-items:center;gap:12px}.camera-search{position:relative;display:flex;align-items:center}.camera-search>.icon{position:absolute;left:12px;width:16px;height:16px;color:#95a4b6}.camera-search input{width:208px;margin:0;padding:10px 12px 10px 36px;font-size:11px;background:white}.view-switch{display:flex;padding:3px;gap:2px;border:1px solid #dfe6ef;border-radius:8px;background:white}.view-switch button{display:grid;place-items:center;width:32px;height:31px;border:0;border-radius:5px;background:transparent;color:#8190a4;font-size:19px}.view-switch .icon{width:16px;height:16px}.view-switch button[aria-pressed="true"]{color:#1263e6;background:#e9f1ff}
.camera-grid{gap:22px}.camera-grid[data-layout="1"]{grid-template-columns:1fr}.camera-grid[data-layout="3"]{grid-template-columns:repeat(3,minmax(0,1fr))}.camera-grid:has(>.camera-card:only-child){grid-template-columns:1fr;max-width:1100px}.camera-card{min-width:0;background:white;border:1px solid #dae3ef;border-radius:12px;box-shadow:0 3px 14px #243d5e05}.camera-card:hover{border-color:#b5cae6}.camera-top,.camera-bottom{padding:15px 18px}.camera-number{display:flex;align-items:center;gap:11px;min-width:0;letter-spacing:0}.camera-number strong{font-size:12px;font-weight:650;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.camera-id{font-size:9px;font-weight:700;color:#6d86a5;background:#f0f4fa;padding:5px 6px;border-radius:4px;white-space:nowrap}.configured,.offline,.online{display:inline-flex;align-items:center;gap:6px;white-space:nowrap;font-size:10px;font-weight:550;color:#8a9cb2}.configured i,.offline i,.online i{margin:0;display:block;width:6px;height:6px;background:currentColor}.online{color:#168d63;background:#ecf8f1;padding:5px 8px;border-radius:5px}.offline{color:#b58235}
.player-wrap,.focus-player-wrap{background:#09111e}.stream-state,.focus-player-wrap>span{font-size:12px;line-height:1.5;background:#152439e8;border:1px solid #31465f;color:#c7d5e8;padding:12px 17px;pointer-events:none}.camera-bottom{font-size:10px;border-top:1px solid #edf1f6;color:#94a0b1}.camera-bottom>span{display:flex;align-items:center;gap:7px}.camera-bottom>span .icon{width:13px;height:13px}.watch-button{display:flex;align-items:center;gap:7px;color:var(--blue);padding:3px 0;font-size:11px;font-weight:650}.watch-button .icon{width:14px;height:14px}.watch-button:hover{color:#084aaf}.footnote{display:flex;align-items:flex-start;gap:7px;color:#8d9bae;font-size:10px;line-height:1.7;margin:22px 0 0}.footnote .icon{width:14px;height:14px;margin-top:1px}.search-empty{text-align:center;padding:36px;color:#7c8ca2;background:white;border:1px dashed #c8d6e8;border-radius:10px}
.focus{margin-bottom:28px;padding:18px;background:white;border:1px solid #a8c7f0;box-shadow:0 5px 20px #1263e60b}.focus-head{gap:12px;margin-bottom:16px}.focus-head h2{font-size:20px;margin:6px 0 0}.focus-player-wrap{border-radius:8px;overflow:hidden;max-height:70vh}.focus p{display:flex;gap:7px;align-items:center;font-size:11px;color:#8191a6}.focus p .icon{width:15px;height:15px}
.panel{background:white;border-color:var(--line);padding:25px}.panel h2{font-size:18px;letter-spacing:-.3px}label{font-size:12px;font-weight:600;color:#465972}input{background:#fbfcfe;border-color:#d9e2ee;color:var(--ink);border-radius:7px;padding:12px 13px}input::placeholder{color:#9ba7b8;font-weight:400}input:focus{border-color:#5792e9;box-shadow:0 0 0 3px #1263e610}.alert,.credentials{border-color:#edcfbc;background:#fff3eb;color:#99572e;font-size:12px;line-height:1.7}.credentials{background:#edf9f2;border-color:#b9dfc9;color:#27704b}.credentials code{color:#16442d}.credentials small{color:#53836b}th,td{padding:16px 13px;border-color:#e6ecf4;font-size:12px}th{font-size:10px;background:#f8fafd;color:#8a99ad}td small{color:#94a0b1;font-size:10px}.enabled{background:#e8f7ef;color:#27865e}.disabled{background:#fff0ec;color:#b6654b}.empty{color:#95a1b2;padding:30px}.setup-banner{padding:28px;background:white;border:1px dashed #bdd0ed}.setup-banner span{color:#8594a8}.info-strip>div{padding:19px;background:#eaf0f8;border-color:#dce5f1}.info-strip strong{font-size:12px}.info-strip span{font-size:11px;color:#7b8ca3;line-height:1.6;overflow-wrap:anywhere}.camera-setup-grid{gap:20px}.recording-row{border-color:var(--line)}.recording-row strong{font-size:12px;color:var(--ink)}.recording-row span{font-size:10px;color:#8b99ac;line-height:1.5}.stop-button{background:#b4493e;border:1px solid #a83c32;color:white}.remove-camera-link{color:#b26761;font-size:11px}
.login-scene{min-height:100vh;display:grid;grid-template-columns:1fr 1fr}.login-story{position:relative;overflow:hidden;display:flex;flex-direction:column;padding:35px 42px 25px;background:radial-gradient(ellipse at 25% 75%,#103466 0,transparent 60%),#0c172a;color:white}.login-story:before{content:"";position:absolute;inset:0;background-image:linear-gradient(#ffffff03 1px,transparent 1px),linear-gradient(90deg,#ffffff03 1px,transparent 1px);background-size:48px 48px;pointer-events:none}.story-top,.story-content,.story-footer{position:relative}.story-top{display:flex;justify-content:space-between;align-items:center;gap:20px}.story-top .brand-logo{width:170px;height:54px;background:transparent}.product-label{font-size:9px;letter-spacing:1.8px;color:#788eac;border:1px solid #2c3d57;border-radius:5px;padding:8px 10px}.story-content{margin:auto 0;padding:50px 0 35px}.story-kicker{display:flex;align-items:center;gap:8px;font-size:10px;letter-spacing:2.4px;font-weight:600;color:#b9c9df}.live-dot{background:#4fd4ad;width:6px;height:6px;border-radius:50%;box-shadow:0 0 0 4px #4fd4ad12}.story-content h1{font-size:clamp(34px,3.4vw,58px);font-weight:650;line-height:1.12;letter-spacing:-2px;margin:23px 0 18px}.story-content>p{max-width:350px;color:#8ea4c1;font-size:13px;line-height:1.8}.corporate-logo{position:relative;overflow:hidden;width:min(100%,390px);height:255px;margin:22px auto 24px}.corporate-logo img{position:absolute;width:140%;height:auto;left:50%;top:50%;transform:translate(-54.5%,-44.6%);max-width:none}.story-features{display:flex;gap:22px;flex-wrap:wrap;color:#afc1db;font-size:10px}.story-features>span{display:flex;align-items:center;gap:7px}.story-features .icon{width:15px;height:15px;color:#d5b45f}.story-footer{display:flex;justify-content:space-between;font-size:9px;color:#5f7592;gap:12px;padding-top:22px;border-top:1px solid #ffffff0c}
.login-form-side{background:white;display:flex;flex-direction:column;align-items:center;justify-content:center;padding:65px 35px 35px;position:relative}.login-form-side .login-card{width:min(380px,100%);background:none;border:0;border-radius:0;padding:0;box-shadow:none}.login-badge{display:inline-flex;align-items:center;gap:8px;color:#7e8fa7;font-size:9px;letter-spacing:1.4px;font-weight:700}.login-badge .icon{width:17px;height:17px;color:#3074d6}.login-card h2{font-size:34px;letter-spacing:-1.2px;margin:19px 0 9px;font-weight:700}.login-card>p{font-size:13px;color:#8b98ac;margin:0 0 35px}.login-card label{margin-top:22px;font-size:12px}.login-card input{background:#fbfcfe;padding:14px;font-size:12px}.login-card .primary{margin-top:28px;width:100%;padding:14px 18px;justify-content:space-between;font-size:12px}.login-help{font-size:11px;color:#9aa7b8;text-align:center;border-top:1px solid #edf0f5;margin-top:30px;padding-top:23px}.login-copyright{position:absolute;bottom:24px;color:#a6b0bd;font-size:10px}.login-wrap .login-card{background:white;border-color:var(--line)}.login-symbol{color:var(--blue)}
@media(max-width:1180px){.layout{grid-template-columns:215px minmax(0,1fr)}.sidebar{padding-left:12px;padding-right:12px}.brand-logo{width:175px;height:55px}.main{padding:30px 25px}.topbar{padding:0 25px}.stat-card{padding:18px 15px;gap:11px}.stat-icon{width:36px;height:36px}.stat-card small{font-size:9px}.camera-top,.camera-bottom{padding:13px}.camera-number{gap:7px}.camera-grid[data-layout="3"]{grid-template-columns:repeat(2,minmax(0,1fr))}.login-story{padding:30px}.product-label{display:none}.corporate-logo{height:220px}.story-features{gap:13px}}
@media(max-width:850px){.layout{display:block}.sidebar{position:relative;top:auto;height:auto;padding:16px 20px;display:grid;grid-template-columns:1fr auto;gap:14px}.brand{align-items:flex-start;padding:0}.brand-logo{width:145px;height:45px}.brand-caption,.side-label,.sidebar-note{display:none}.sidebar nav{grid-column:1/-1;grid-row:2;display:flex;gap:5px;overflow-x:auto}.nav-link{flex-shrink:0;padding:10px 12px;font-size:11px;margin:0}.nav-link .icon{width:16px;height:16px}.nav-link.selected{box-shadow:none}.side-bottom{grid-column:2;grid-row:1;display:flex;align-items:center;gap:15px;padding:0;border:0;margin:0}.sign-out{display:flex;padding:0;font-size:10px}.identity{display:flex;gap:8px}.identity small{display:block;font-size:10px}.avatar{width:32px;height:32px;border-radius:9px}.identity strong{font-size:11px}.topbar{height:58px}.page-head h1{font-size:30px}.stats-grid{gap:10px}.stat-card{padding:17px 13px;gap:10px}.stat-icon{display:none}.camera-tools{gap:8px}.camera-search input{width:180px}.camera-grid{gap:16px;grid-template-columns:repeat(2,minmax(0,1fr))}.login-scene{grid-template-columns:44% 56%}.story-content h1{font-size:38px;letter-spacing:-1.4px}.corporate-logo{height:160px}.story-features{display:grid;gap:12px}.story-footer span{display:none}.login-story{padding:25px}.story-top .brand-logo{width:145px}.login-form-side{padding-left:30px;padding-right:30px}}
@media(max-width:620px){.sidebar{padding:14px}.topbar{padding:0 18px}.role-badge{font-size:9px;padding:6px 8px}.role-badge .icon{display:none}.breadcrumb{font-size:10px}.breadcrumb>span{margin:0 7px}.main{padding:25px 16px}.page-head{align-items:flex-start;gap:12px;flex-wrap:wrap;margin-bottom:23px}.page-head h1{font-size:29px}.page-head p{font-size:11px}.head-actions{width:100%;justify-content:flex-end}.eyebrow{font-size:9px}.stats-grid{gap:8px;margin-bottom:25px}.stat-card{padding:14px 11px}.stat-card>div>span{font-size:9px}.stat-card strong{font-size:25px}.stat-card small{display:none}.camera-toolbar{align-items:flex-start;flex-direction:column;gap:14px}.camera-tools{width:100%;justify-content:space-between}.camera-search{flex:1;max-width:290px}.camera-search input{width:100%}.camera-grid,.camera-grid[data-layout="3"]{grid-template-columns:1fr}.camera-number strong{font-size:12px}.camera-top,.camera-bottom{padding:14px}.workspace-footer{padding:18px 16px;font-size:9px}.workspace-footer>span:last-child{display:none}.focus{padding:12px}.focus-head h2{font-size:17px}.focus .eyebrow{font-size:8px;letter-spacing:1px}.focus p{font-size:10px;align-items:flex-start;line-height:1.6}.focus-head .small-button{font-size:10px;padding:8px}.footnote{font-size:9px}.panel{padding:20px}.login-scene{display:block;background:white}.login-story{padding:24px 25px 29px}.story-top .brand-logo{width:160px;height:48px}.product-label{display:block;font-size:8px;letter-spacing:1px;padding:7px}.story-content{padding:28px 0 0}.story-kicker{font-size:9px}.story-content h1{font-size:32px;margin:16px 0 12px;letter-spacing:-1px}.story-content>p{font-size:11px;max-width:310px;margin-bottom:0}.corporate-logo,.story-features,.story-footer{display:none}.login-form-side{padding:35px 25px 70px;min-height:510px}.login-card h2{font-size:28px;margin-top:13px}.login-card>p{margin-bottom:24px}.login-card label{margin-top:18px}.login-copyright{bottom:19px}.side-bottom .identity>span:last-child{display:none}.brand{gap:0}}
.corporate-logo{height:auto;aspect-ratio:1.4}
/* Classic edition: ivory canvas, ink surfaces, restrained brass details. */
:root{--ink:#1d2a39;--muted:#7d817f;--blue:#263d53;--line:#e4e0d7;--navy:#111e2d;--brass:#b99759;--ivory:#f7f5ef}
body{background:var(--ivory);color:var(--ink)}
.sidebar{background:linear-gradient(160deg,#17283b,#0d1825);border-right:1px solid #273748;padding-top:30px}
.brand-logo{background:#f5f2e9;border:1px solid #ded4bd;border-radius:5px}
.brand-caption{color:#b2a180;font-size:8px;letter-spacing:2.4px}
.side-label{color:#728398;font-size:9px;letter-spacing:2px}
.nav-link{border-radius:5px;font-size:12px;color:#9aabba;padding-top:15px;padding-bottom:15px}
.nav-link.selected{background:#ffffff09;box-shadow:inset 2px 0 var(--brass);color:#f0eadf}
.nav-link.selected .icon{color:#d3b67e}.nav-link:hover{background:#ffffff07}
.sidebar-note strong{color:#c8c1b1}.sidebar-note>.icon{color:var(--brass)}.side-bottom{border-color:#ffffff0d}
.avatar{background:#2b3640;border-color:#5a5140;color:#d6bb86;border-radius:8px}
.topbar{height:72px;background:#fbfaf7;border-color:#e8e3d9}
.role-badge{border-color:#e3dccb;border-radius:4px;background:#f5f2e9;color:#8d7c5b;font-size:10px}
.role-badge .icon{color:#a6884d}
.main{padding-top:36px}.page-head{padding-bottom:25px;border-bottom:1px solid #e2dbce;margin-bottom:25px}
.page-head h1{font-family:Georgia,"Times New Roman",serif;font-weight:400;font-size:39px;letter-spacing:-1.4px}
.page-head p{color:#8a8c86;font-size:12px}.heading-dot{color:var(--brass)}.eyebrow{color:#9c8b6e;font-size:9px;letter-spacing:2.1px}
.accent-line{background:var(--brass);width:24px}.primary,.head-actions>a{background:#1c3045;border-color:#1c3045;color:#f8f4e9;box-shadow:0 5px 12px #13253813;border-radius:5px}
.primary:hover,.head-actions>a:hover{background:#2b435c;border-color:#2b435c}.small-button{border-color:#ded8ca;background:#fbfaf7;color:#62685f;border-radius:5px;font-size:11px}.small-button:hover{background:#f1ede3;border-color:#c7bda8}
.stats-grid{gap:16px;margin-bottom:29px}.stat-card{position:relative;border-color:#e5dfd2;border-radius:7px;background:#fffefa;box-shadow:0 3px 7px #443c2903;padding:22px 24px}
.stat-card:before{content:"";position:absolute;width:29px;height:2px;top:-1px;left:24px;background:var(--brass)}
.stat-card strong{font-family:Georgia,"Times New Roman",serif;font-size:35px;font-weight:400;color:#273646;margin-top:8px}
.stat-card>div>span{font-size:10px;letter-spacing:.2px;color:#8a8c83}.stat-card small{font-size:10px;color:#a1a395}
.stat-icon{background:#f4f0e6;color:#aa8a4f;border-radius:7px;border:1px solid #e9e1d0}
.stat-icon.green{background:#f0f5ef;color:#65846e;border-color:#e0e9dd}.stat-icon.amber{background:#faf4e8;color:#af8a47;border-color:#ece2cf}
.camera-toolbar h2{font-family:Georgia,"Times New Roman",serif;font-weight:400;font-size:21px;letter-spacing:-.3px}
.camera-toolbar h2>span{font-family:"Segoe UI",Arial,sans-serif;background:#eee9dd;color:#9c8a65;border:1px solid #e4dccb;border-radius:3px}
.camera-toolbar p{color:#919287}.camera-search input{background:#fffefa;border-color:#e1dacb;border-radius:5px;color:#626f75}
.view-switch{border-color:#e0d9ca;border-radius:5px;background:#fffefa}.view-switch button{border-radius:3px;color:#a3a293}
.view-switch button[aria-pressed="true"]{background:#f1ebdc;color:#917749}
.camera-card{border-color:#dfd8ca;border-radius:7px;box-shadow:0 7px 20px #453a1f05}
.camera-card:hover{border-color:#baa77f;box-shadow:0 8px 23px #453a1f0b}
.camera-top{background:#fffefa;padding-top:16px;padding-bottom:16px}.camera-id{background:#f1ede3;color:#9d8a64;border:1px solid #e7dfce;border-radius:3px;font-size:8px;letter-spacing:.6px}
.camera-number strong{color:#34404c;font-size:12px;font-weight:600}.camera-bottom{background:#fffefa;border-color:#ece7dc}
.watch-button{color:#8c713e;font-size:10px;letter-spacing:.1px}.watch-button:hover{color:#4c3c20}
.player-wrap,.focus-player-wrap{background:radial-gradient(ellipse at 50% 15%,#1c2d41,#0b1421 75%)}
.stream-state,.focus-player-wrap>span{background:#1b2a3be8;border-color:#45505a;color:#b7bdc3;font-size:11px;border-radius:5px}
.online{background:#edf3ec;color:#56856a;border-radius:3px}.offline{color:#b08b48}
.panel{border-color:#e4ddcf;background:#fffefa;border-radius:7px}.panel h2{font-family:Georgia,"Times New Roman",serif;font-weight:400;font-size:23px}
input{border-color:#ded8cd;background:#fcfbf7;color:#283c4e;border-radius:5px}input:focus{border-color:#b29765;box-shadow:0 0 0 3px #b9975910}
th{background:#f6f3ec;color:#a09278;font-size:9px}th,td{border-color:#e9e3d7}.info-strip>div{background:#f0ede4;border-color:#e2dac8}
.info-strip span{color:#8d8a7b}.setup-banner{background:#fffefa;border-color:#cebd9b}.footnote{color:#a29e91}.workspace-footer{border-color:#e3ddcf;color:#a7a08f;font-size:9px}
.focus{border-color:#c8b78d;background:#fffefa;border-radius:7px;box-shadow:0 8px 25px #493a2007}
.focus-head h2{font-family:Georgia,"Times New Roman",serif;font-size:25px;font-weight:400}
.login-scene{min-height:100svh;padding:24px;background:radial-gradient(ellipse at 30% 0,#faf7f0,#eae5da);grid-template-columns:minmax(0,1.08fr) minmax(0,1fr)}
.login-story{border-radius:12px 0 0 12px;padding:30px 40px 22px;background:radial-gradient(ellipse at 40% 65%,#1d3652 0,transparent 60%),linear-gradient(145deg,#172b41,#101e2e 65%,#0b1521);border:1px solid #344353;box-shadow:0 25px 60px #17223116;min-width:0}
.login-story:before{background-image:none;border:1px solid #c6a76c25;inset:13px;border-radius:4px}
.login-story:after{content:"";position:absolute;right:28px;top:95px;bottom:60px;width:1px;background:linear-gradient(transparent,#bfa16a35,transparent);pointer-events:none}
.story-top .brand-logo{width:166px;height:51px;background:#fbf8ef;border-color:#ffffff70;border-radius:4px}
.product-label{font-size:8px;letter-spacing:1.8px;border-color:#b397632f;color:#c4ad7d;border-radius:3px;padding:8px 10px}
.story-content{padding:27px 0 23px}.story-kicker{font-size:8px;letter-spacing:2.3px;color:#a89879;font-weight:500}
.live-dot{width:5px;height:5px;background:#c0a16a;box-shadow:0 0 0 4px #d0b27b0b}
.story-content h1{font-family:Georgia,"Times New Roman",serif;font-weight:400;font-size:clamp(39px,3.4vw,57px);line-height:1.08;letter-spacing:-1.8px;margin:22px 0 16px;color:#f8f3e7}
.story-content h1 em{color:#d0b17c;font-weight:400}.story-content>p{font-size:12px;line-height:1.9;color:#92a0af;font-weight:400}
.logo-showcase{position:relative;width:min(100%,360px);margin:8px auto 16px;isolation:isolate}
.logo-showcase:before{content:"";position:absolute;inset:0;background:radial-gradient(ellipse,#5486ad16,transparent 69%);z-index:-1}
.showcase-orbit{position:absolute;border:1px solid #c5a86e18;width:205px;height:205px;border-radius:50%;left:50%;top:50%;transform:translate(-50%,-50%);z-index:-1}
.showcase-orbit:before,.showcase-orbit:after{content:"";position:absolute;inset:-22px;border:1px solid #c5a86e09;border-radius:50%}
.showcase-orbit:after{inset:20px;border-style:dashed;border-color:#c5a86e12}
.corporate-logo{width:min(100%,310px);height:auto;aspect-ratio:1.4;margin:8px auto 12px}
.story-features{border-top:1px solid #c5a86e16;border-bottom:1px solid #c5a86e16;padding:16px 0;justify-content:space-between;gap:10px;color:#a9adb1;font-size:9px}
.story-features .icon{width:14px;height:14px;color:#bca16a}.story-footer{border:0;color:#6d7e91;padding-top:12px;font-size:8px;letter-spacing:.3px}
.story-footer .story-company{display:inline;color:#b3a587}.story-footer>span:last-child{font-style:italic}
.login-form-side{border:1px solid #e3dccd;border-left:0;border-radius:0 12px 12px 0;background:linear-gradient(120deg,#fffefa,#f9f7f1);box-shadow:20px 25px 60px #17223108;padding:60px 40px 55px;min-width:0}
.login-form-side:before{content:"";position:absolute;inset:13px;border:1px solid #e5dfd330;pointer-events:none;border-radius:4px}
.login-form-side .login-card{position:relative;width:min(365px,100%)}
.login-badge{font-size:8px;letter-spacing:2px;color:#a49170;font-weight:600}.login-badge .icon{width:16px;height:16px;color:#b49a68}
.classic-rule{display:block;width:35px;height:1px;background:#bea16c;margin-top:24px}
.login-card h2{font-family:Georgia,"Times New Roman",serif;font-size:44px;letter-spacing:-1.7px;font-weight:400;color:#253547;line-height:1.15;margin:17px 0 12px}
.login-card h2>span{color:#b39a68}.login-card>p{font-size:12px;color:#96988f;margin-bottom:32px}
.login-card label{font-size:11px;letter-spacing:.25px;color:#64695f;font-weight:500;margin-top:23px}
.login-card input{font-size:12px;padding:15px 16px;background:#fffefa;border-color:#ded8ca;border-radius:5px;margin-top:9px;box-shadow:0 2px 4px #352a1302}
.login-card input::placeholder{color:#b1b1a5}.login-card input:focus{border-color:#b49a68;box-shadow:0 0 0 3px #b49a6810}
.login-card .primary{margin-top:28px;padding:8px 9px 8px 18px;background:linear-gradient(110deg,#21364e,#182b40);border:1px solid #2c4054;font-size:11px;border-radius:5px;letter-spacing:.15px;box-shadow:0 7px 16px #192e4718;min-height:49px}
.login-card .primary:hover{background:linear-gradient(110deg,#2c4762,#213b55);box-shadow:0 7px 20px #192e4726}
.button-arrow{display:grid;place-items:center;width:32px;height:32px;border:1px solid #bfa16b4d;border-radius:3px;color:#d9bc82}.button-arrow .icon{width:16px;height:16px}
.login-help{display:flex;align-items:flex-start;justify-content:center;gap:9px;border-color:#e7e1d6;margin-top:27px;padding-top:23px;font-size:10px;color:#aaa79c;line-height:1.7}
.login-help>.icon{width:14px;height:14px;margin-top:2px;color:#b39c75}.login-help strong{display:block;font-weight:500;color:#7d8077}
.login-copyright{left:20px;right:20px;bottom:25px;display:flex;justify-content:center;gap:8px;font-size:8px;letter-spacing:.1px;color:#b1ac9e}.copyright-separator{color:#b89d70}
@media(min-width:1550px){.login-scene{padding:32px}.login-story{padding:38px 54px 28px}.story-top .brand-logo{width:185px;height:57px}.story-content{padding:30px 0}.story-content h1{font-size:62px}.corporate-logo{width:350px}.logo-showcase{width:390px}.login-card h2{font-size:49px}.login-form-side .login-card{width:390px}.login-form-side{padding:70px 45px}.story-kicker{font-size:9px}.story-content>p{font-size:13px}.story-features{padding:20px 0;font-size:10px}.login-card input{padding:17px}.login-copyright{bottom:30px}}
@media(max-width:1100px){.login-scene{padding:18px;grid-template-columns:minmax(0,1fr) minmax(0,1fr)}.login-story{padding:28px}.story-top .brand-logo{width:145px;height:46px}.story-content h1{font-size:42px}.corporate-logo{width:260px}.login-form-side{padding:48px 33px}.login-card h2{font-size:38px}.story-content>p{font-size:11px}.story-kicker{font-size:7px;letter-spacing:1.8px}.story-features{font-size:8px;gap:7px}.story-features .icon{width:12px}.story-footer{font-size:7px}}
@media(max-width:850px){.page-head h1{font-size:34px}.stat-card{padding:18px 16px}.stat-card strong{font-size:31px}.login-scene{grid-template-columns:minmax(0,1fr) minmax(0,1fr)}.story-features{display:flex;flex-wrap:wrap;justify-content:flex-start;gap:13px}.story-footer>.story-company{display:block}.story-content h1{font-size:38px}.logo-showcase{margin-top:17px}.corporate-logo{width:230px}.showcase-orbit{width:155px;height:155px}.story-content{padding-top:26px;padding-bottom:18px}.login-card h2{font-size:35px}.login-form-side{padding-left:25px;padding-right:25px}.login-badge{font-size:7px;letter-spacing:1.6px}.login-story:after{right:19px}.login-copyright{font-size:7px}}
@media(max-width:620px){.login-scene{display:block;padding:12px;min-height:100svh}.login-story{border-radius:9px 9px 0 0;padding:24px 26px 22px}.login-story:before{inset:8px}.login-story:after{display:none}.story-top .brand-logo{width:141px;height:44px}.product-label{display:block;font-size:6px;letter-spacing:1px;padding:7px}.story-content{padding:24px 0 0;margin:0}.story-kicker{font-size:6px;letter-spacing:1.6px}.story-content h1{font-size:36px;line-height:1.06;margin:16px 0 12px;letter-spacing:-1px}.story-content>p{font-size:10px;line-height:1.8;max-width:none;margin:0}.logo-showcase,.story-features,.story-footer{display:none}.login-form-side{border-left:1px solid #e3dccd;border-top:0;border-radius:0 0 9px 9px;padding:32px 25px 58px;min-height:520px}.login-form-side .login-card{width:100%;max-width:390px}.login-badge{font-size:7px}.classic-rule{margin-top:19px;width:27px}.login-card h2{font-size:35px;margin-top:15px}.login-card>p{font-size:11px;margin-bottom:23px}.login-card label{font-size:10px;margin-top:19px}.login-card input{padding:14px;font-size:12px}.login-card .primary{margin-top:24px}.login-help{font-size:9px;margin-top:23px;padding-top:18px}.login-copyright{font-size:7px;bottom:19px;gap:6px}.stats-grid{gap:8px}.stat-card{padding:15px 12px}.stat-card:before{left:13px;width:21px}.stat-card strong{font-size:29px}.page-head h1{font-size:32px}.page-head{padding-bottom:20px}.camera-toolbar h2{font-size:20px}.sidebar .brand-logo{border-radius:4px}}
.login-card input:-webkit-autofill{-webkit-box-shadow:0 0 0 1000px #fbf9f2 inset;-webkit-text-fill-color:#283c4e;caret-color:#283c4e}
.login-card label{font-size:12px}.login-badge{font-size:9px}.login-help{font-size:11px}.login-copyright{font-size:9px}.story-kicker{font-size:9px}.story-features{font-size:10px}.story-footer{font-size:9px}
@media(max-width:620px){.login-card label{font-size:11px}.login-badge{font-size:8px}.login-help{font-size:10px}.login-copyright{font-size:8px}.story-kicker{font-size:7px}}
@media(prefers-reduced-motion:reduce){*,*:before,*:after{scroll-behavior:auto!important;transition:none!important}}