:root{--bg:#0f1115;--panel:#171a21;--line:#262a33;--text:#e8e9ec;--muted:#8b909c;--accent:#ff5a3c;--lightningcss-light: ;--lightningcss-dark:initial;color-scheme:dark;font-family:ui-sans-serif,system-ui,-apple-system,Segoe UI,sans-serif}*{box-sizing:border-box}body{background:var(--bg);color:var(--text);margin:0}a{color:var(--text)}.top{z-index:5;-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);border-bottom:1px solid var(--line);background:#0f1115e0;flex-wrap:wrap;justify-content:space-between;align-items:center;gap:12px 24px;padding:14px clamp(16px,4vw,40px);display:flex;position:sticky;top:0}.brand{align-items:center;gap:10px;display:flex}.brand h1{letter-spacing:-.02em;margin:0;font-size:22px;font-weight:700}.brand h1 span{color:var(--accent)}.dot{background:var(--accent);width:10px;height:10px;box-shadow:0 0 0 0 var(--accent);border-radius:50%;animation:2s infinite pulse}@keyframes pulse{70%{box-shadow:0 0 0 8px #0000}to{box-shadow:0 0 #0000}}.controls{flex-wrap:wrap;align-items:center;gap:10px;display:flex}.controls input[type=search],.controls select{background:var(--panel);color:var(--text);border:1px solid var(--line);font:inherit;border-radius:8px;padding:8px 12px;font-size:14px}.controls input[type=search]{width:min(280px,70vw)}.toggle{color:var(--muted);cursor:pointer;align-items:center;gap:6px;font-size:14px;display:flex}.status{color:var(--muted);margin:18px clamp(16px,4vw,40px) 0;font-size:14px}.grid{grid-template-columns:repeat(auto-fill,minmax(280px,1fr));gap:16px;padding:16px clamp(16px,4vw,40px) 32px;display:grid}.card{background:var(--panel);border:1px solid var(--line);cursor:pointer;border-radius:12px;transition:transform .15s,border-color .15s;overflow:hidden}.card:hover,.card:focus-visible{border-color:#3a3f4b;outline:none;transform:translateY(-2px)}.thumb{aspect-ratio:4/3;background:#0b0d10;position:relative}.thumb img{object-fit:cover;width:100%;height:100%;display:block}.card.offline .thumb img{visibility:hidden}.card.offline .thumb:after{content:"Camera offline";color:var(--muted);place-items:center;font-size:13px;display:grid;position:absolute;inset:0}.badge{letter-spacing:.04em;color:#cfd2d8;background:#0009;border-radius:999px;padding:3px 8px;font-size:11px;font-weight:600;position:absolute;top:10px;left:10px}.badge.live{background:var(--accent);color:#fff}.info{padding:10px 14px 14px}.info h3{margin:0 0 4px;font-size:15px;font-weight:600}.info p{color:var(--muted);margin:0;font-size:13px}dialog{border:1px solid var(--line);background:var(--panel);width:min(1000px,94vw);color:var(--text);border-radius:14px;padding:0}dialog::backdrop{background:#000000bf}.viewer-head,.viewer-foot{justify-content:space-between;align-items:center;gap:12px;padding:12px 16px;display:flex}.viewer-head h2{margin:0;font-size:18px}.viewer-head p,.viewer-foot{color:var(--muted);margin:2px 0 0;font-size:13px}#vClose{color:var(--text);cursor:pointer;background:0 0;border:0;font-size:20px}.viewer-body{aspect-ratio:16/9;background:#000;display:grid}.viewer-body>*{object-fit:contain;grid-area:1/1;width:100%;height:100%}#vVideo{display:none}dialog.has-video #vVideo{display:block}dialog.has-video #vImg{display:none}.foot{color:var(--muted);text-align:center;padding:0 16px 28px;font-size:12px}@media (width<=600px){.grid{grid-template-columns:1fr}.viewer-body{aspect-ratio:4/3}}