*{margin:0;padding:0;box-sizing:border-box}:root{--bg: #09090b;--bg-2: #0d0d10;--panel: #101013;--panel-2: #16161a;--panel-3: #1d1d23;--line: rgba(255, 255, 255, .07);--line-strong: rgba(255, 255, 255, .13);--text: #f2f4f7;--muted: #9aa1ad;--muted-2: #5d636e;--accent: #53e1f9;--accent-dim: #2ab8d0;--accent-soft: rgba(83, 225, 249, .1);--danger: #ff5c6c;--danger-soft: rgba(255, 92, 108, .1);--warn: #f5b04d;--warn-soft: rgba(245, 176, 77, .1);--ok: #4ade80;--live: #ff6482;--live-soft: rgba(255, 100, 130, .1);--pin: #9bc8ff;--pin-soft: rgba(155, 200, 255, .1);--font: "Inter", "Segoe UI", system-ui, Roboto, sans-serif;--mono: "JetBrains Mono", ui-monospace, "Cascadia Code", "SF Mono", Consolas, monospace}html,body,#app{height:100%}body{background:var(--bg);color:var(--text);font-family:var(--font);font-size:13.5px;line-height:1.45;-webkit-font-smoothing:antialiased;font-feature-settings:"tnum" 0}::selection{background:#53e1f938}*{scrollbar-width:thin;scrollbar-color:#26262d transparent}*::-webkit-scrollbar{width:6px;height:6px}*::-webkit-scrollbar-thumb{background:#26262d;border-radius:3px}*::-webkit-scrollbar-track{background:transparent}button{background:transparent;color:var(--muted);border:1px solid var(--line);border-radius:8px;padding:6px 13px;cursor:pointer;font-size:12.5px;font-weight:500;font-family:var(--font);transition:border-color .13s,background .13s,color .13s;white-space:nowrap}button:hover{color:var(--text);border-color:var(--line-strong);background:#ffffff08}button:active{background:#ffffff0f}button.primary{background:#fafafa;color:#0a0a0c;border-color:transparent;font-weight:650}button.primary:hover{background:#fff;color:#000;border-color:transparent}button.active{color:var(--accent);border-color:#53e1f959;background:var(--accent-soft)}button:disabled{opacity:.4;cursor:default}button.icon-btn{padding:6px 10px;line-height:1;display:inline-flex;align-items:center;justify-content:center;gap:6px}button.ghost{background:transparent;border-color:transparent;color:var(--muted-2)}button.ghost:hover{color:var(--text);background:#ffffff0a;border-color:transparent}.seg{display:inline-flex;background:#ffffff09;border:1px solid var(--line);border-radius:8px;padding:2px;gap:1px}.seg button{border:none;background:transparent;color:var(--muted-2);border-radius:6px;padding:4px 11px;font-size:12px}.seg button:hover{color:var(--text);background:#ffffff0d}.seg button.active{background:var(--panel-3);color:var(--text);font-weight:600}input,select{background:#ffffff08;border:1px solid var(--line);color:var(--text);border-radius:8px;padding:8px 12px;font-size:13.5px;font-family:var(--font);outline:none;transition:border-color .13s,background .13s}input:focus,select:focus{border-color:#53e1f973;background:#ffffff0b}input::placeholder{color:var(--muted-2)}.switch{display:inline-flex;align-items:center;gap:8px;cursor:pointer;color:var(--muted);font-size:12.5px;user-select:none}.switch:hover{color:var(--text)}.switch input{appearance:none;width:32px;height:18px;border-radius:9px;background:var(--panel-3);border:1px solid var(--line);position:relative;cursor:pointer;transition:background .15s,border-color .15s;padding:0;flex:none}.switch input:after{content:"";position:absolute;top:2px;left:2px;width:12px;height:12px;border-radius:50%;background:var(--muted);transition:transform .15s,background .15s}.switch input:checked{background:var(--accent-dim);border-color:var(--accent-dim)}.switch input:checked:after{transform:translate(14px);background:#04181d}.badge{font-size:10px;font-weight:650;padding:2.5px 8px;border-radius:20px;border:1px solid var(--line);background:transparent;color:var(--muted);display:inline-flex;align-items:center;gap:5px;letter-spacing:.06em;text-transform:uppercase}.badge .dot{width:5px;height:5px;border-radius:50%;background:currentColor}.badge.live{border-color:#ff648266;color:var(--live)}.badge.live .dot{animation:pulse 1.4s ease-in-out infinite}.badge.alert{border-color:#f5b04d66;color:var(--warn)}.badge.pin{border-color:#9bc8ff66;color:var(--pin)}.badge.manual{border-color:#7aa2ff66;color:#7aa2ff}.badge.fight{border-color:#f5b04d66;color:var(--warn)}@keyframes pulse{0%,to{opacity:1}50%{opacity:.4}}.mc-avatar{position:relative;display:inline-block;flex:none;border-radius:6px;overflow:hidden;background:var(--panel-3)}.mc-avatar-layer{position:absolute;inset:0;image-rendering:pixelated;background-repeat:no-repeat}.mc-avatar-fallback{display:inline-flex;align-items:center;justify-content:center;color:var(--muted);font-weight:700}.avatar-stack{display:inline-flex;align-items:center;flex:none}.avatar-stack .mc-avatar+.mc-avatar{margin-left:-8px;outline:2px solid var(--bg)}.spacer{flex:1}.muted{color:var(--muted)}.mono{font-family:var(--mono)}.logo{font-size:16px;font-weight:750;letter-spacing:-.02em}.logo span{color:var(--accent)}.logo-sub{color:var(--muted-2);font-size:10px;font-weight:650;text-transform:uppercase;letter-spacing:.18em;margin-left:12px}.spinner{width:20px;height:20px;border-radius:50%;border:2px solid var(--panel-3);border-top-color:var(--accent);animation:spin .8s linear infinite;flex:none}@keyframes spin{to{transform:rotate(360deg)}}.empty-state{color:var(--muted-2);font-size:12.5px;padding:16px 4px;text-align:center}.login-screen{height:100%;display:flex;align-items:center;justify-content:center}.login-card{background:var(--panel);border:1px solid var(--line);border-radius:16px;padding:40px 36px;width:360px;display:flex;flex-direction:column;gap:14px}.login-card .logo{font-size:22px}.login-card .login-tagline{color:var(--muted-2);font-size:12.5px;margin:-8px 0 12px}.login-card label{color:var(--muted);font-size:11px;font-weight:600;text-transform:uppercase;letter-spacing:.08em;margin-bottom:-8px}.login-error{color:var(--danger);font-size:12.5px;min-height:17px}.dash{height:100%;display:flex;flex-direction:column}.dash-header{display:flex;align-items:center;gap:14px;padding:14px 26px;border-bottom:1px solid var(--line)}.user-chip{display:flex;align-items:center;gap:8px;color:var(--muted);font-size:12.5px;padding:4px}.user-chip .user-dot{width:24px;height:24px;border-radius:50%;background:var(--panel-3);color:var(--text);display:inline-flex;align-items:center;justify-content:center;font-size:11px;font-weight:700}.dash-body{flex:1;display:grid;grid-template-columns:300px 1fr;gap:0;overflow:hidden;min-height:0}.side{display:flex;flex-direction:column;gap:0;overflow-y:auto;min-height:0;border-right:1px solid var(--line)}.card{padding:20px 22px}.side .card+.card{border-top:1px solid var(--line)}.card h2{font-size:10.5px;color:var(--muted-2);text-transform:uppercase;letter-spacing:.14em;font-weight:650;margin-bottom:14px;display:flex;align-items:center;gap:8px}.card h2 .count{color:var(--muted);font-family:var(--mono);font-size:10.5px;letter-spacing:0}.player-row,.capture-row{display:flex;align-items:center;gap:9px;padding:7px 8px;margin:0 -8px;border-radius:8px;transition:background .12s}.player-row:hover,.capture-row:hover{background:#ffffff08}.player-row .name,.capture-row .name{flex:1;min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;font-weight:550;font-size:13px}.player-row .srv{color:var(--muted-2);font-size:10px;font-weight:650;font-family:var(--mono);text-transform:uppercase;letter-spacing:.06em}.player-row button,.capture-row button{padding:4px 10px;font-size:11.5px}.sessions{display:flex;flex-direction:column;overflow:hidden;min-height:0;padding:20px 26px}.sessions-tools{display:flex;gap:10px;margin-bottom:16px;align-items:center;flex-wrap:wrap}.sessions-tools .search-wrap{flex:1;min-width:200px;position:relative}.sessions-tools .search-wrap input{width:100%;padding-left:34px}.sessions-tools .search-wrap .search-ico{position:absolute;left:12px;top:50%;transform:translateY(-50%);color:var(--muted-2);pointer-events:none;font-size:13px}.sessions-list{overflow-y:auto;flex:1;display:flex;flex-direction:column;gap:6px;padding-right:2px}.session-card{display:flex;align-items:center;gap:14px;background:transparent;border:1px solid var(--line);border-radius:12px;padding:12px 16px;cursor:pointer;transition:background .13s,border-color .13s;position:relative}.session-card:hover{background:#ffffff06;border-color:var(--line-strong)}.session-card.has-alert{box-shadow:inset 2px 0 0 var(--warn)}.session-card .names{font-weight:600;font-size:13.5px;display:flex;align-items:center;gap:8px;flex-wrap:wrap}.session-card .names .vs{color:var(--muted-2);font-size:10px;font-weight:700;letter-spacing:.08em}.session-card .meta{color:var(--muted-2);font-size:12px;margin-top:4px;display:flex;gap:6px;align-items:center;flex-wrap:wrap}.session-card .meta .sep{opacity:.5}.session-card .badges{display:flex;align-items:center;gap:6px}.pin-btn{background:transparent;border:none;color:var(--muted-2);font-size:16px;padding:4px 6px;border-radius:7px;line-height:1}.pin-btn:hover{color:var(--pin);background:var(--pin-soft);border:none}.pin-btn.pinned{color:var(--pin)}.del-btn{background:transparent;border:none;color:var(--muted-2);font-size:14px;padding:4px 6px;border-radius:7px;line-height:1}.del-btn:hover{color:var(--danger);background:var(--danger-soft);border:none}.keep-btn{color:var(--accent);border-color:#53e1f94d;white-space:nowrap}.keep-btn:hover{color:var(--accent)}.keep-btn:disabled{opacity:.8;cursor:default}#v-hitmap{display:block;border-radius:10px;background:#0a0a0d;border:1px solid var(--line)}.hitmap-stats{font-size:11px;color:var(--muted);margin-top:8px;line-height:1.7}.mouse-verdict{font-size:11px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;max-width:44%;cursor:help}.mouse-verdict.v-ok{color:var(--ok)}.mouse-verdict.v-warn{color:var(--warn)}.mouse-verdict.v-alert{color:var(--danger)}.mouse-verdict.v-none{color:var(--muted-2)}.viewer-screen{height:100%;display:flex;flex-direction:column}.viewer-top{display:flex;gap:12px;align-items:center;padding:9px 16px;background:var(--bg);border-bottom:1px solid var(--line)}.viewer-title{display:flex;align-items:center;gap:10px;min-width:0}.viewer-title strong{font-size:14px;font-weight:650;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.viewer-main{flex:1;display:flex;overflow:hidden;min-height:0}.viewer-3d{flex:1;position:relative;background:#0a0a0d;min-width:0}.viewer-3d canvas.hud{position:absolute;inset:0;width:100%;height:100%;pointer-events:none}.viewer-side{width:296px;background:var(--bg);border-left:1px solid var(--line);padding:18px 16px;overflow-y:auto;display:flex;flex-direction:column;gap:20px;flex:none}.side-title{font-size:10.5px;color:var(--muted-2);text-transform:uppercase;letter-spacing:.14em;margin-bottom:10px;font-weight:650}.side-hint{color:var(--muted-2);font-size:11px;margin-top:-6px;margin-bottom:8px}.pov-card{display:flex;align-items:center;gap:10px;padding:9px 10px;margin:0 -10px 4px;border-radius:10px;cursor:pointer;border:1px solid transparent;transition:background .12s,border-color .12s}.pov-card:hover{background:#ffffff08}.pov-card.active{border-color:#53e1f94d;background:var(--accent-soft)}.pov-card.dead{opacity:.4}.pov-card .pov-main{flex:1;min-width:0}.pov-card .pov-name{font-weight:600;font-size:13px;display:flex;align-items:center;gap:6px;overflow:hidden}.pov-card .pov-name .pov-tag{font-size:9px;font-weight:800;color:var(--accent);border:1px solid rgba(83,225,249,.4);border-radius:4px;padding:1px 4px;letter-spacing:.08em}.hp-bar{height:4px;border-radius:2px;background:var(--panel-3);margin-top:7px;overflow:hidden;position:relative}.hp-fill{height:100%;border-radius:2px;background:var(--ok);transition:width .18s,background .18s}.hp-fill.mid{background:var(--warn)}.hp-fill.low{background:var(--danger)}.hp-abs{position:absolute;top:0;right:0;height:100%;background:#e8d44d;opacity:.85}.pov-side{text-align:right;flex:none;display:flex;flex-direction:column;gap:4px;align-items:flex-end}.pov-cps{font-family:var(--mono);font-size:11px;color:var(--muted)}.pov-cps.metric-strong{color:var(--warn);font-weight:600}.pov-flags{display:flex;gap:4px;min-height:14px}.flag-chip{font-size:8.5px;font-weight:800;letter-spacing:.1em;border-radius:4px;padding:1.5px 5px;border:1px solid rgba(83,225,249,.35);color:var(--accent)}.flag-chip.sprint{border-color:#f5b04d59;color:var(--warn)}.attack-row{display:flex;align-items:center;gap:7px;font-family:var(--mono);font-size:11px;color:var(--muted);padding:5px 8px;margin:0 -8px;border-radius:7px;cursor:pointer;transition:background .12s,color .12s}.attack-row:hover{background:#ffffff08;color:var(--text)}.attack-row .t{color:var(--muted-2);flex:none}.attack-row .who{flex:1;min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.attack-row .reach{flex:none;font-weight:600}.attack-row .reach.warn{color:var(--warn)}.attack-row .reach.bad{color:var(--danger);font-weight:700}.metric-strong{color:var(--warn)}.hotkeys{border-top:1px solid var(--line);padding-top:14px;margin-top:auto}.hotkeys .hk-row{display:flex;justify-content:space-between;gap:8px;color:var(--muted-2);font-size:11px;padding:2.5px 0}.hotkeys kbd{font-family:var(--mono);font-size:10px;color:var(--muted);background:#ffffff0a;border:1px solid var(--line);border-radius:4px;padding:1px 6px}.viewer-bottom{background:var(--bg);border-top:1px solid var(--line);padding:10px 16px 12px;display:flex;flex-direction:column;gap:8px}.timeline-wrap{position:relative;height:28px}.timeline-markers{position:absolute;inset:0 0 12px;pointer-events:none}.timeline-markers .mark{position:absolute;top:2px;width:3px;height:8px;border-radius:2px;pointer-events:auto;cursor:pointer;transform:translate(-1px)}.timeline-markers .mark:hover{transform:translate(-1px) scaleX(1.8)}.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;appearance:none;height:14px;background:transparent;padding:0;border:none;cursor:pointer}input[type=range].timeline::-webkit-slider-runnable-track{height:3px;border-radius:2px;background:var(--panel-3)}input[type=range].timeline::-webkit-slider-thumb{appearance:none;width:12px;height:12px;border-radius:50%;background:#fafafa;margin-top:-4.5px;transition:transform .1s}input[type=range].timeline::-webkit-slider-thumb:hover{transform:scale(1.25)}input[type=range].timeline::-moz-range-track{height:3px;border-radius:2px;background:var(--panel-3)}input[type=range].timeline::-moz-range-thumb{width:12px;height:12px;border:none;border-radius:50%;background:#fafafa}input[type=range].timeline:disabled{opacity:.4;cursor:default}.controls-row{display:flex;align-items:center;gap:8px;flex-wrap:wrap}.controls-row .time{font-family:var(--mono);color:var(--muted);font-size:12px}.play-btn{width:40px;font-size:14px;padding:7px 0;text-align:center}.metric-chips{display:flex;gap:6px;align-items:center;flex-wrap:wrap}.metric-chip{font-family:var(--mono);font-size:11px;color:var(--muted);border:1px solid var(--line);border-radius:7px;padding:3.5px 9px;white-space:nowrap}.metric-chip.hot{color:var(--warn);border-color:#f5b04d59}.metric-chip.sneak{color:var(--accent);border-color:#53e1f959}.legend{display:flex;gap:10px;align-items:center;color:var(--muted-2);font-size:10.5px}.legend .lg{display:inline-flex;align-items:center;gap:4px}.legend .lg i{width:7px;height:7px;border-radius:2px;display:inline-block}.live-badge{color:var(--live);font-weight:800;letter-spacing:.12em;font-size:11px;display:inline-flex;align-items:center;gap:6px}.live-badge:before{content:"";width:6px;height:6px;border-radius:50%;background:var(--live);animation:pulse 1.4s ease-in-out infinite}.fly-hint{position:absolute;bottom:14px;left:50%;transform:translate(-50%);background:#09090bd1;border:1px solid var(--line);backdrop-filter:blur(6px);color:var(--muted);font-size:12px;padding:6px 13px;border-radius:8px;pointer-events:none;z-index:4;white-space:nowrap}.mouse-panel{background:var(--bg);border-top:1px solid var(--line);padding:9px 16px 10px}.mouse-head{display:flex;align-items:center;gap:14px;margin-bottom:8px;flex-wrap:wrap}.mouse-pov{color:var(--accent);font-size:11px;font-weight:600;font-family:var(--mono)}.mouse-stats{color:var(--muted-2);font-size:11px}.mouse-panel canvas{display:block;width:100%;height:132px;border-radius:10px;background:#0a0a0d;border:1px solid var(--line);cursor:crosshair}.seg.seg-mini button{padding:3px 9px;font-size:11px}.loading-overlay{position:absolute;inset:0;display:flex;align-items:center;justify-content:center;gap:12px;background:#09090bd1;backdrop-filter:blur(4px);z-index:5;font-size:14px;color:var(--muted)}@media(max-width:1080px){.dash-body{grid-template-columns:1fr;overflow-y:auto}.side{overflow-y:visible;border-right:none;border-bottom:1px solid var(--line)}.sessions{min-height:420px}.viewer-side{width:250px}}