:root{font-family:Inter,ui-sans-serif,system-ui,sans-serif;color:#e9efef;background:#0d1316;font-size:14px;font-synthesis:none}*{box-sizing:border-box}body{margin:0}button,input,select{font:inherit}button,a,input,select{outline-offset:4px}button,a{touch-action:manipulation}button{cursor:pointer;color:inherit;border:1px solid #34444b;background:#1a272d;border-radius:9px;padding:10px 14px}button:hover{background:#273b42}button.primary{background:#c0e8ab;border-color:#c0e8ab;color:#15251c;font-weight:650}button:disabled{opacity:.45;cursor:not-allowed}a{color:#c0e8ab;text-decoration:none}small,.muted{color:#9aaeb6}h1{font-size:30px;letter-spacing:-1px;margin:8px 0}h2{font-size:19px;margin:0 0 15px}h3{font-size:15px}p{line-height:1.7}.shell{display:grid;grid-template-columns:220px 1fr;min-height:100vh}.side{border-right:1px solid #243137;padding:30px 20px;display:flex;flex-direction:column;gap:30px;background:#111b20}.brand{font-size:23px;font-weight:650;letter-spacing:-1px}.brand span{color:#c0e8ab}.eyebrow{font-size:10px;letter-spacing:2px;text-transform:uppercase;color:#9caeb4}.side nav{display:grid;gap:7px}.side nav button{text-align:left;border:0;background:transparent;padding:13px}.side nav button.active{background:#26372f;color:#c4eeb1}.site{border:1px solid #34444b;padding:12px;border-radius:10px}.site b{display:block}.side .bottom{margin-top:auto;font-size:12px;line-height:1.8}.main{padding:28px 36px;min-width:0}.top,.heading,.tools,.row{display:flex;align-items:center;justify-content:space-between;gap:12px}.top{border-bottom:1px solid #253239;padding-bottom:22px;margin-bottom:26px}.heading{margin:24px 0}.pill{display:inline-flex;align-items:center;gap:7px;padding:7px 10px;background:#24312d;border:1px solid #3d5541;border-radius:30px;font-size:11px;color:#c1e7b1}.pill.off{background:#292823;border-color:#514934;color:#d9c48d}.banner{padding:12px 16px;border:1px solid #4d4832;background:#29271e;color:#e0cfa2;border-radius:9px;font-size:12px;line-height:1.5}.tools{flex-wrap:wrap;margin-bottom:18px;justify-content:flex-start}.tools label{display:flex;gap:8px;align-items:center}.wall{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:14px}.wall.focus .tile:first-child{grid-row:span 2;min-height:450px}.wall.focus{grid-template-columns:2fr 1fr}.wall.three{grid-template-columns:repeat(3,minmax(0,1fr))}.tile{position:relative;min-height:240px;background:radial-gradient(ellipse at 30% 0,#1f3037,#111c22 65%);border:1px solid #2c3c44;border-radius:12px;overflow:hidden;cursor:pointer}.tile video{width:100%;height:100%;position:absolute;object-fit:contain}.tile .empty{position:absolute;inset:0;display:grid;place-content:center;text-align:center;gap:10px;color:#8199a5;padding:45px 20px}.cameraIcon{font-size:30px;opacity:.55}.tile header{position:absolute;z-index:1;inset:0 0 auto;display:flex;justify-content:space-between;align-items:center;padding:14px;background:linear-gradient(#0a141bba,transparent);font-size:12px}.tile footer{position:absolute;inset:auto 0 0;padding:13px;display:flex;justify-content:space-between;font-size:10px;color:#8fa5af;background:linear-gradient(transparent,#0b151dcc)}.tile .expand{border:0;background:transparent;padding:4px}.tile:focus-visible{outline:2px solid #c0e8ab;outline-offset:3px}.tile.selected{position:fixed;inset:0;z-index:20;border-radius:0;background:#05090c;min-height:100vh}.tile.selected header{padding:22px}.tile.selected .empty{font-size:18px}.wall.cinema{position:fixed;inset:0;z-index:15;background:#05090c;padding:8px;align-content:stretch}.wall.cinema .tile{border-radius:0}.cinema-close{position:fixed;bottom:18px;left:50%;transform:translateX(-50%);z-index:16;box-shadow:0 4px 30px #000}.panel{background:#152127;border:1px solid #2a3940;border-radius:12px;padding:24px;margin-bottom:18px}.cards{display:grid;grid-template-columns:repeat(3,1fr);gap:16px;margin-top:20px}.metric{font-size:24px;display:block;margin:8px 0}.grid2{display:grid;grid-template-columns:1fr 1fr;gap:18px}.blank{padding:60px 20px;text-align:center;color:#93a9b3;border:1px dashed #34474f;border-radius:12px}.blank h2{color:#d4e2e7}.list{display:grid;gap:10px}.list button{text-align:left;display:flex;justify-content:space-between;gap:15px}.form{display:grid;gap:16px}.form label{display:grid;gap:7px;color:#afc0c7;font-size:12px}input,select{background:#0e191f;border:1px solid #3b4d56;border-radius:7px;padding:11px;color:#eff5f7;min-width:0}input[type=checkbox]{accent-color:#b6df9f;width:18px;height:18px}.form label.check{display:flex;align-items:center}dialog{max-width:640px;width:calc(100% - 32px);max-height:90vh;overflow:auto;border:1px solid #41545d;border-radius:14px;background:#142128;color:inherit;padding:28px}dialog::backdrop{background:#000b;backdrop-filter:blur(5px)}dialog video{width:100%;max-height:55vh;background:#000}pre{white-space:pre-wrap;word-break:break-word;font-size:12px;color:#b6c9cf}#notice{position:fixed;bottom:24px;right:24px;max-width:440px;background:#c0e8ab;color:#15251c;padding:15px 20px;border-radius:10px;z-index:100;display:none}.login{max-width:430px;margin:15vh auto;padding:28px}.login .brand{margin-bottom:28px}.player{width:100%;max-height:60vh;background:#070b0d}.steps{padding-left:20px;line-height:1.9}.warning{color:#e0cfa2}.hidden{display:none!important}.timeline{width:100%;margin:18px 0}.map{height:240px;display:grid;place-content:center;text-align:center;background:repeating-linear-gradient(0deg,transparent,transparent 23px,#26383e 24px),repeating-linear-gradient(90deg,transparent,transparent 23px,#26383e 24px);border-radius:10px;color:#aac2cb}.room{border:2px solid #7c939d;padding:32px 50px;background:#17262b}code{background:#0d171b;padding:3px 5px;border-radius:4px}.footnote{margin-top:18px;font-size:12px;line-height:1.8;color:#91a7b2}@media(min-width:1400px){.tile{min-height:310px}}@media(max-width:900px){.shell{grid-template-columns:170px 1fr}.side{padding:24px 12px}.main{padding:22px}.wall.three{grid-template-columns:repeat(2,1fr)}.grid2{grid-template-columns:1fr}.cards{grid-template-columns:1fr}.wall.focus .tile:first-child{min-height:320px}}@media(max-width:600px){.shell{display:block}.side{padding:16px;border-right:0;border-bottom:1px solid #293b42;gap:16px}.side nav{display:flex;overflow:auto;gap:4px}.side nav button{white-space:nowrap;padding:10px}.side .site,.side .bottom,.side .eyebrow{display:none}.main{padding:18px 14px}.top{padding-bottom:15px;margin-bottom:15px}.top>small{display:none}.heading{align-items:flex-start;flex-wrap:wrap}h1{font-size:25px}.wall,.wall.three,.wall.focus{grid-template-columns:1fr}.wall.focus .tile:first-child{min-height:240px;grid-row:auto}.tile{min-height:225px}.wall.cinema{grid-template-columns:1fr;gap:3px;padding:3px}.wall.cinema .tile{min-height:0}.panel{padding:18px}.tools label{width:100%}.tools select{flex:1}.login{margin:8vh 16px}}

/* Explicit page sizes keep all cameras reachable in every layout. */
.wall.pair{grid-template-columns:repeat(2,minmax(0,1fr))}
.wall.nine{grid-template-columns:repeat(3,minmax(0,1fr))}
.wall-pages{margin-top:16px}.wall-pages span{color:#9aaeb6;font-size:12px}
.wall.cinema{grid-auto-rows:1fr}.wall.cinema .tile{min-height:0}
.wall.cinema.focus .tile:first-child{min-height:0}
@media(max-width:600px){.wall.pair,.wall.nine{grid-template-columns:1fr}.wall-pages button{flex:1}.wall-pages span{width:100%;text-align:center;order:3}.wall.cinema.nine{grid-template-columns:repeat(3,minmax(0,1fr))}.wall.cinema.pair{grid-template-columns:repeat(2,minmax(0,1fr))}.wall.cinema .empty{padding:40px 6px;font-size:10px}.wall.cinema .empty small,.wall.cinema footer,.wall.cinema .pill{display:none}.wall.cinema header{padding:8px}.wall.cinema .cameraIcon{font-size:18px}}
/* Keep the chosen layout on phones; fullscreen still uses the whole viewport. */
@media(max-width:600px){
 .wall,.wall.pair{grid-template-columns:repeat(2,minmax(0,1fr));gap:6px}
 .wall.three,.wall.nine{grid-template-columns:repeat(3,minmax(0,1fr))}
 .wall.focus{grid-template-columns:2fr 1fr}
 .wall .tile{min-height:130px}.wall.focus .tile:first-child{grid-row:span 2;min-height:266px}
 .wall.nine .tile,.wall.three .tile{min-height:110px}
 .tile header{padding:7px;font-size:10px;gap:4px}.tile header>span:first-child{min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
 .tile .pill{font-size:8px;padding:4px}.wall.nine .pill,.wall.three .pill{display:none}
 .tile .empty{padding:30px 6px;font-size:10px;gap:5px}.tile .empty small,.tile footer{display:none}.cameraIcon{font-size:20px}
 .wall .tile.selected{min-height:100vh}.tile.selected header{font-size:14px}.tile.selected .empty{font-size:16px}.tile.selected .empty small{display:block}.tile.selected footer{display:flex}
 .wall.cinema .tile,.wall.cinema.focus .tile:first-child{min-height:0}
 #notice{left:14px;right:14px;max-width:none}
}
