*{margin:0;padding:0;box-sizing:border-box}:root{--bg: #0f1216;--panel: #171c23;--panel2: #1e2530;--border: #2a3340;--text: #dbe4ee;--muted: #8494a7;--accent: #09add3;--danger: #e35b5b;--ok: #58c364}html,body,#app{height:100%}body{background:var(--bg);color:var(--text);font-family:Segoe UI,Roboto,sans-serif;font-size:14px}button{background:var(--panel2);color:var(--text);border:1px solid var(--border);border-radius:6px;padding:7px 14px;cursor:pointer;font-size:13px}button:hover{border-color:var(--accent)}button.primary{background:var(--accent);color:#06222b;border:none;font-weight:600}button.active{background:var(--accent);color:#06222b;border:none}button:disabled{opacity:.5;cursor:default}input,select{background:var(--panel2);border:1px solid var(--border);color:var(--text);border-radius:6px;padding:8px 10px;font-size:14px;outline:none}input:focus{border-color:var(--accent)}.login-screen{height:100%;display:flex;align-items:center;justify-content:center}.login-card{background:var(--panel);border:1px solid var(--border);border-radius:12px;padding:34px;width:340px;display:flex;flex-direction:column;gap:12px}.login-card h1{font-size:20px;margin-bottom:8px}.login-card h1 span{color:var(--accent)}.login-error{color:var(--danger);font-size:13px;min-height:17px}.dash{height:100%;display:flex;flex-direction:column}.dash-header{display:flex;align-items:center;gap:16px;padding:12px 20px;background:var(--panel);border-bottom:1px solid var(--border)}.dash-header h1{font-size:17px;flex:0 0 auto}.dash-header h1 span{color:var(--accent)}.dash-header .spacer{flex:1}.dash-header .muted{color:var(--muted);font-size:13px}.dash-body{flex:1;display:grid;grid-template-columns:300px 1fr;gap:14px;padding:14px 20px;overflow:hidden}.side{display:flex;flex-direction:column;gap:14px;overflow-y:auto}.card{background:var(--panel);border:1px solid var(--border);border-radius:10px;padding:14px}.card h2{font-size:13px;color:var(--muted);text-transform:uppercase;letter-spacing:.06em;margin-bottom:10px}.player-row,.capture-row{display:flex;align-items:center;gap:8px;padding:6px 8px;border-radius:6px}.player-row:hover{background:var(--panel2)}.player-row .name{flex:1}.player-row .srv{color:var(--muted);font-size:12px}.badge{font-size:11px;padding:2px 7px;border-radius:10px;background:var(--panel2);color:var(--muted)}.badge.live{background:#35202a;color:#ff7898}.badge.alert{background:#3a2a17;color:#ffb45e}.badge.pin{background:#17303a;color:#64c9e8}.sessions{display:flex;flex-direction:column;overflow:hidden}.sessions-tools{display:flex;gap:10px;margin-bottom:12px}.sessions-tools input{flex:1}.sessions-list{overflow-y:auto;flex:1;display:flex;flex-direction:column;gap:8px}.session-card{display:flex;align-items:center;gap:12px;background:var(--panel);border:1px solid var(--border);border-radius:10px;padding:12px 14px;cursor:pointer}.session-card:hover{border-color:var(--accent)}.session-card .names{font-weight:600}.session-card .meta{color:var(--muted);font-size:12px;margin-top:3px}.session-card .spacer{flex:1}.viewer-screen{height:100%;display:flex;flex-direction:column}.viewer-top{display:flex;gap:10px;align-items:center;padding:8px 14px;background:var(--panel);border-bottom:1px solid var(--border)}.viewer-main{flex:1;display:flex;overflow:hidden}.viewer-3d{flex:1;position:relative}.viewer-3d canvas.hud{position:absolute;inset:0;width:100%;height:100%;pointer-events:none}.viewer-side{width:280px;background:var(--panel);border-left:1px solid var(--border);padding:12px;overflow-y:auto;display:flex;flex-direction:column;gap:12px}.pov-row{display:flex;align-items:center;gap:8px;padding:7px 9px;border-radius:6px;cursor:pointer;border:1px solid transparent}.pov-row:hover{background:var(--panel2)}.pov-row.active{border-color:var(--accent)}.pov-row .metrics{margin-left:auto;text-align:right;font-size:12px;color:var(--muted)}.metric-strong{color:#ffd479}.viewer-bottom{background:var(--panel);border-top:1px solid var(--border);padding:10px 14px;display:flex;flex-direction:column;gap:8px}.timeline-wrap{position:relative;height:26px}.timeline-markers{position:absolute;inset:0;pointer-events:none}.timeline-markers .mark{position:absolute;top:0;width:2px;height:8px}.mark.damage{background:#e3a15b}.mark.death{background:#e35b5b;height:12px}.mark.totem{background:#e8d44d;height:12px}.mark.alert{background:#ff5bd2;height:14px}input[type=range].timeline{width:100%;position:absolute;bottom:0;accent-color:var(--accent)}.controls-row{display:flex;align-items:center;gap:8px}.controls-row .time{font-family:monospace;color:var(--muted);min-width:130px}.live-badge{color:#ff7898;font-weight:700;letter-spacing:.08em}.loading-overlay{position:absolute;inset:0;display:flex;align-items:center;justify-content:center;background:#0a0d11bf;z-index:5;font-size:15px;color:var(--muted)}