:root{--surface-1: #1a1a19;--surface-2: #202020;--plane: #0d0d0d;--text-1: #ffffff;--text-2: #c3c2b7;--muted: #898781;--grid: #2c2c2a;--axis: #383835;--border: rgba(255,255,255,.1);--s1: #3987e5;--s2: #d95926;--s3: #199e70;--s4: #c98500;--s5: #d55181;--s6: #008300;--s7: #9085e9;--s8: #e66767;--good: #0ca30c;--warning: #fab219;--serious: #ec835a;--critical: #d03b3b;--radius: 12px;--gap: 16px;font-family:system-ui,-apple-system,Segoe UI,sans-serif}*{box-sizing:border-box}html,body,#root{height:100%;margin:0}body{background:var(--plane);color:var(--text-1)}a{color:inherit;text-decoration:none}h1,h2,h3{font-weight:650;margin:0}button{font-family:inherit}.app{display:grid;grid-template-columns:232px 1fr;min-height:100vh}.sidebar{background:var(--surface-1);border-right:1px solid var(--border);padding:20px 14px;display:flex;flex-direction:column;gap:4px;position:sticky;top:0;height:100vh}.brand{display:flex;align-items:center;gap:10px;padding:4px 10px 20px}.brand .logo{width:30px;height:30px;border-radius:8px;background:linear-gradient(135deg,var(--s1),var(--s3));display:grid;place-items:center;font-weight:800;color:#fff;font-size:15px}.brand b{font-size:16px;letter-spacing:.2px}.brand small{display:block;color:var(--muted);font-size:11px;font-weight:500}.nav-item{display:flex;align-items:center;gap:11px;padding:10px 12px;border-radius:9px;color:var(--text-2);font-size:14px;font-weight:500;cursor:pointer;border:1px solid transparent}.nav-item:hover{background:var(--surface-2);color:var(--text-1)}.nav-item.active{background:#3987e524;color:#fff;border-color:#3987e559}.nav-ico{width:18px;text-align:center;opacity:.9}.main{padding:24px 30px;overflow-x:hidden}.page-head{display:flex;align-items:flex-start;justify-content:space-between;margin-bottom:22px;gap:16px}.page-head h1{font-size:22px}.page-head p{color:var(--muted);font-size:13px;margin:5px 0 0;max-width:640px}.card{background:var(--surface-1);border:1px solid var(--border);border-radius:var(--radius);padding:18px}.card h3{font-size:14px;color:var(--text-2);font-weight:600;margin-bottom:14px}.grid{display:grid;gap:var(--gap)}.cols-4{grid-template-columns:repeat(4,1fr)}.cols-3{grid-template-columns:repeat(3,1fr)}.cols-2{grid-template-columns:repeat(2,1fr)}@media (max-width: 1100px){.cols-4{grid-template-columns:repeat(2,1fr)}.cols-3,.cols-2{grid-template-columns:1fr}}.stat{display:flex;flex-direction:column;gap:6px}.stat .label{color:var(--muted);font-size:12px;font-weight:600;text-transform:uppercase;letter-spacing:.4px}.stat .value{font-size:30px;font-weight:700;line-height:1}.stat .sub{color:var(--text-2);font-size:12px}.stat .accent{width:34px;height:3px;border-radius:3px;margin-top:2px}.badge{display:inline-flex;align-items:center;gap:6px;padding:3px 9px;border-radius:999px;font-size:11.5px;font-weight:650;letter-spacing:.2px}.badge.good{background:#0ca30c29;color:#4fd24f}.badge.warning{background:#fab21929;color:#fab219}.badge.serious{background:#ec835a29;color:#ec835a}.badge.critical{background:#d03b3b2e;color:#ff6b6b}.badge.info{background:#3987e529;color:#6fb0ff}.badge.muted{background:#ffffff12;color:var(--text-2)}.dot{width:7px;height:7px;border-radius:50%;display:inline-block}table{width:100%;border-collapse:collapse;font-size:13px}th{text-align:left;color:var(--muted);font-weight:600;font-size:11.5px;text-transform:uppercase;letter-spacing:.4px;padding:9px 12px;border-bottom:1px solid var(--border)}td{padding:10px 12px;border-bottom:1px solid var(--grid);color:var(--text-2);vertical-align:middle}td.strong{color:var(--text-1);font-weight:600}tr:hover td{background:#ffffff05}.mono{font-family:ui-monospace,SF Mono,Menlo,monospace;font-variant-numeric:tabular-nums}input,select,textarea{background:var(--surface-2);border:1px solid var(--border);color:var(--text-1);border-radius:8px;padding:9px 11px;font-size:13px;width:100%}input:focus,select:focus{outline:2px solid rgba(57,135,229,.5);outline-offset:-1px}label{font-size:12px;color:var(--muted);font-weight:600;display:block;margin-bottom:6px}.field{margin-bottom:12px}.btn{display:inline-flex;align-items:center;gap:8px;padding:9px 15px;border-radius:9px;border:1px solid var(--border);background:var(--surface-2);color:var(--text-1);font-size:13px;font-weight:600;cursor:pointer}.btn:hover{border-color:#ffffff40}.btn.primary{background:var(--s1);border-color:var(--s1);color:#fff}.btn.primary:hover{background:#4a93ec}.btn.danger{background:transparent;color:#ff6b6b;border-color:#d03b3b66}.btn:disabled{opacity:.5;cursor:not-allowed}.btn.sm{padding:6px 10px;font-size:12px}.row{display:flex;gap:10px;align-items:center;flex-wrap:wrap}.spacer{flex:1}.muted{color:var(--muted)}.empty{color:var(--muted);text-align:center;padding:40px;font-size:13px}.video-wrap{position:relative;background:#000;border-radius:10px;overflow:hidden;aspect-ratio:16/9}.video-wrap video{width:100%;height:100%;object-fit:contain;display:block}.overlay-line{position:absolute;left:8%;right:8%;height:2px;background:var(--s4);top:66%;box-shadow:0 0 8px var(--s4)}.overlay-tag{position:absolute;top:10px;left:10px}.event-flash{animation:flash 1.2s ease}@keyframes flash{0%{background:#3987e538}to{background:transparent}}.pill-toggle{display:inline-flex;background:var(--surface-2);border-radius:8px;padding:3px;gap:3px}.pill-toggle button{border:none;background:transparent;color:var(--text-2);padding:6px 12px;border-radius:6px;font-size:12.5px;font-weight:600;cursor:pointer}.pill-toggle button.on{background:var(--s1);color:#fff}.progress{height:6px;background:var(--surface-2);border-radius:4px;overflow:hidden}.progress>div{height:100%;background:var(--s1);transition:width .3s}.channel-chip{display:inline-flex;align-items:center;gap:6px;padding:5px 10px;border:1px solid var(--border);border-radius:8px;font-size:12px}