:root{--bg: #0b0b0d;--panel: #141417;--panel-2: #1c1c21;--line: #2a2a31;--text: #f5f4f0;--muted: #9a98a3;--gold: #ffb84d;--gold-dim: #b8860b;--ok: #37d67a;--bad: #ff5c5c;--warn: #ffb84d;--radius: 12px;--shadow: 0 8px 28px rgba(0, 0, 0, .45)}*{box-sizing:border-box}html,body{margin:0;background:var(--bg);color:var(--text);font-family:Inter,system-ui,-apple-system,Segoe UI,sans-serif;font-size:15px}a{color:var(--gold);text-decoration:none}button{font:inherit;cursor:pointer}.btn{background:var(--panel-2);color:var(--text);border:1px solid var(--line);padding:9px 16px;border-radius:9px;transition:all .15s}.btn:hover{border-color:var(--gold)}.btn.gold{background:var(--gold);color:#1a1206;border-color:var(--gold);font-weight:600}.btn.gold:hover{filter:brightness(1.08)}.btn.danger{border-color:#5c1f1f;color:var(--bad)}.btn.small{padding:5px 10px;font-size:13px;border-radius:7px}.btn:disabled{opacity:.45;cursor:not-allowed}.input,select.input{width:100%;background:var(--panel-2);border:1px solid var(--line);color:var(--text);padding:10px 12px;border-radius:9px;outline:none}.input:focus{border-color:var(--gold)}label.field{display:block;margin:10px 0;font-size:13px;color:var(--muted)}label.field .input{margin-top:5px}.card{background:var(--panel);border:1px solid var(--line);border-radius:var(--radius);padding:18px}.grid{display:grid;gap:16px}.grid.cards{grid-template-columns:repeat(auto-fill,minmax(260px,1fr))}.grid.two{grid-template-columns:repeat(auto-fit,minmax(320px,1fr))}.badge{display:inline-block;padding:3px 9px;border-radius:999px;font-size:12px;font-weight:600}.badge.online{background:#37d67a24;color:var(--ok)}.badge.offline{background:#ff5c5c24;color:var(--bad)}.badge.pending{background:#ffb84d29;color:var(--warn)}.badge.revoked{background:#9a98a333;color:var(--muted)}.topbar{display:flex;align-items:center;gap:18px;padding:14px 24px;border-bottom:1px solid var(--line);background:var(--panel);position:sticky;top:0;z-index:20}.topbar .brand{font-weight:800;letter-spacing:.4px}.topbar .brand .gold{color:var(--gold)}.topbar nav{display:flex;gap:4px;flex:1}.topbar nav a{color:var(--muted);padding:7px 13px;border-radius:8px;font-weight:500}.topbar nav a.active{color:var(--text);background:var(--panel-2)}.topbar .user{color:var(--muted);font-size:13px}.page{max-width:1180px;margin:0 auto;padding:24px}.page h1{font-size:22px;margin:4px 0 16px}.page h2{font-size:17px;margin:20px 0 10px}.muted{color:var(--muted);font-size:13px}.toasts{position:fixed;top:70px;right:18px;z-index:99;display:flex;flex-direction:column;gap:8px}.toast{background:var(--panel-2);border:1px solid var(--line);border-left:3px solid var(--gold);padding:11px 16px;border-radius:9px;box-shadow:var(--shadow);max-width:340px}.toast.err{border-left-color:var(--bad)}.toast.ok{border-left-color:var(--ok)}.spin{display:inline-block;width:14px;height:14px;border:2px solid var(--line);border-top-color:var(--gold);border-radius:50%;animation:rot .7s linear infinite}@keyframes rot{to{transform:rotate(360deg)}}table.tbl{width:100%;border-collapse:collapse;font-size:13.5px}table.tbl th,table.tbl td{text-align:left;padding:8px 10px;border-bottom:1px solid var(--line)}table.tbl th{color:var(--muted);font-weight:600;font-size:12px;text-transform:uppercase;letter-spacing:.4px}.stat{display:flex;flex-direction:column;gap:4px}.stat .num{font-size:26px;font-weight:800}.stat .lbl{color:var(--muted);font-size:12.5px;text-transform:uppercase;letter-spacing:.5px}.thumb{width:100%;aspect-ratio:16/9;object-fit:cover;border-radius:9px;background:#000;border:1px solid var(--line)}.live-box{position:relative;background:#000;border-radius:var(--radius);border:1px solid var(--line);overflow:hidden}.live-box video,.live-box img{width:100%;display:block}.live-badge{position:absolute;top:10px;left:10px}.ptz-pad{display:grid;grid-template-columns:repeat(3,64px);gap:8px;justify-content:center}.ptz-pad button{height:64px;border-radius:12px;font-size:20px;background:var(--panel-2);border:1px solid var(--line);color:var(--text);-webkit-user-select:none;user-select:none}.ptz-pad button:active{background:var(--gold);color:#1a1206}.row{display:flex;gap:10px;align-items:center;flex-wrap:wrap}.mt{margin-top:14px}.mb{margin-bottom:14px}code{background:var(--panel-2);padding:2px 6px;border-radius:5px;font-size:12.5px;word-break:break-all}.token-box{background:var(--panel-2);border:1px dashed var(--gold);border-radius:9px;padding:12px;font-family:ui-monospace,monospace;font-size:13px;word-break:break-all}.danger-zone{border:1px solid #5c1f1f;border-radius:var(--radius);padding:14px}