:root{--bg:#0b0d10;--bg-1:#0f1216;--bg-2:#14181d;--panel:#181c22;--panel-2:#1d2229;--hover:#232932;--line:#262c35;--line-2:#2f3641;--ink:#e8ebf0;--ink-2:#b9c0cb;--ink-3:#7c8593;--ink-4:#525a66;--accent:#7ee0c8;--accent-2:#36a98e;--accent-glow:#7ee0c82e;--tank:#4a8fd8;--healer:#6ad99a;--melee:#e09a52;--ranged:#c478e8;--kill:#6ad99a;--wipe:#e57373;--warn:#f5b461;--info:#8ab8e8;--raid:#c478e8;--mythic:#f5b461;--rated:#8ab8e8;--llm:#b69cf2;--rule:#7ee0c8;--diverge:#f5b461;--mono:"JetBrains Mono", "IBM Plex Mono", ui-monospace, monospace;--sans:"Inter", system-ui, -apple-system, sans-serif;--r-1:4px;--r-2:6px;--r-3:10px;--rail-w:268px;--insp-w:320px;--topbar-h:48px;--modebar-h:44px}*{box-sizing:border-box}html,body,#root{background:var(--bg);height:100%;color:var(--ink);font-family:var(--sans);font-feature-settings:"cv11", "ss01";-webkit-font-smoothing:antialiased;margin:0;padding:0;font-size:13px;line-height:1.45;overflow:hidden}button{color:inherit;font-family:inherit}::-webkit-scrollbar{width:10px;height:10px}::-webkit-scrollbar-track{background:0 0}::-webkit-scrollbar-thumb{background:var(--line);border:2px solid var(--bg-1);border-radius:6px}::-webkit-scrollbar-thumb:hover{background:var(--line-2)}.mono{font-family:var(--mono)}.tabular{font-variant-numeric:tabular-nums}.cap{text-transform:uppercase;letter-spacing:.06em;font-weight:600}.cap-sm{text-transform:uppercase;letter-spacing:.08em;color:var(--ink-3);font-size:10px;font-weight:600}.app{grid-template-rows:var(--topbar-h) 1fr;height:100vh;display:grid}.shell{grid-template-columns:var(--rail-w) 1fr;height:100%;min-height:0;display:grid}.workspace{grid-template-rows:var(--modebar-h) 1fr;background:var(--bg-1);min-width:0;min-height:0;display:grid}.topbar{background:var(--bg);border-bottom:1px solid var(--line);z-index:10;align-items:center;gap:16px;padding:0 14px 0 18px;display:flex;position:relative}.brand{font-family:var(--mono);letter-spacing:.04em;align-items:center;gap:8px;font-size:13px;font-weight:700;display:flex}.brand .dot{background:var(--accent);width:7px;height:7px;box-shadow:0 0 8px var(--accent-glow);border-radius:50%}.brand small{color:var(--ink-3);letter-spacing:.08em;font-weight:500}.topbar-spacer{flex:1}.topbar-btn{border:1px solid var(--line);color:var(--ink-2);border-radius:var(--r-2);cursor:pointer;font-size:12px;font-family:var(--mono);background:0 0;align-items:center;gap:6px;padding:5px 10px;display:inline-flex}.topbar-btn:hover{background:var(--hover);color:var(--ink);border-color:var(--line-2)}.topbar-btn.live{border-color:var(--accent-2);color:var(--accent)}.topbar-btn .badge{background:var(--accent);color:#0a0d10;border-radius:3px;padding:1px 5px;font-size:10px;font-weight:700}.modebar{background:var(--bg);border-bottom:1px solid var(--line);align-items:stretch;padding:0 14px;display:flex}.mode-tab{color:var(--ink-3);letter-spacing:.04em;text-transform:uppercase;cursor:pointer;background:0 0;border:none;border-bottom:2px solid #0000;align-items:center;gap:8px;padding:0 18px;font-size:12px;font-weight:600;display:flex;position:relative}.mode-tab:hover{color:var(--ink-2)}.mode-tab.active{color:var(--ink);border-bottom-color:var(--accent)}.mode-tab .count{background:var(--panel-2);color:var(--ink-3);letter-spacing:0;border-radius:8px;padding:1px 6px;font-size:10px;font-weight:600}.mode-tab.active .count{background:var(--accent);color:#0a0d10}.modebar-right{align-items:center;gap:8px;margin-left:auto;padding:6px 0;display:flex}.sel-chip{background:var(--panel);border:1px solid var(--line);border-radius:var(--r-2);align-items:center;gap:0;height:30px;font-size:12px;display:flex;overflow:hidden}.sel-chip .seg{border-right:1px solid var(--line);height:100%;font-family:var(--mono);cursor:pointer;align-items:center;gap:6px;padding:0 10px;display:flex}.sel-chip .seg:last-child{border-right:none}.sel-chip .seg:hover{background:var(--hover)}.sel-chip .seg .lbl{color:var(--ink-3);text-transform:uppercase;letter-spacing:.06em;font-size:10px}.sel-chip .seg .val{color:var(--ink)}.sel-chip .seg .sub,.sel-chip .seg svg{color:var(--ink-3)}.rail{background:var(--bg);border-right:1px solid var(--line);flex-direction:column;min-height:0;display:flex}.rail-head{border-bottom:1px solid var(--line);flex-direction:column;gap:8px;padding:12px 14px 8px;display:flex}.rail-search{background:var(--panel);border:1px solid var(--line);border-radius:var(--r-2);align-items:center;gap:8px;padding:6px 10px;font-size:12px;display:flex}.rail-search input{color:var(--ink);background:0 0;border:none;outline:none;flex:1;font-family:inherit;font-size:12px}.rail-search input::placeholder{color:var(--ink-4)}.rail-filters{gap:4px;display:flex}.rail-filter{text-transform:uppercase;letter-spacing:.06em;background:var(--panel);border:1px solid var(--line);color:var(--ink-3);border-radius:var(--r-1);cursor:pointer;flex:1;padding:4px 6px;font-size:10px;font-weight:600}.rail-filter:hover{color:var(--ink-2)}.rail-filter.on{background:var(--bg-2);color:var(--ink);border-color:var(--accent-2)}.rail-list{flex:1;padding:4px 0 12px;overflow:auto}.rail-section{text-transform:uppercase;letter-spacing:.08em;color:var(--ink-3);align-items:center;gap:8px;padding:12px 14px 4px;font-size:10px;font-weight:600;display:flex}.rail-section .badge{background:var(--panel-2);color:var(--ink-3);letter-spacing:0;border-radius:8px;padding:1px 6px;font-size:9px;font-weight:600}.rail-section .tag{border-radius:2px;width:6px;height:6px;display:inline-block}.rail-section .tag.raid{background:var(--raid)}.rail-section .tag.mythic{background:var(--mythic)}.rail-section .tag.rated{background:var(--rated)}.rail-session{cursor:pointer;color:var(--ink-3);align-items:baseline;gap:8px;padding:8px 14px 6px;font-size:11px;display:flex}.rail-session:hover{background:var(--bg-1)}.rail-session .date{font-family:var(--mono)}.rail-session .when{color:var(--ink-4)}.rail-encounter{border-radius:var(--r-1);cursor:pointer;grid-template-columns:6px 1fr auto;align-items:center;gap:8px;margin:1px 6px;padding:6px 8px 6px 12px;font-size:12px;display:grid;position:relative}.rail-encounter:hover,.rail-encounter.active{background:var(--bg-2)}.rail-encounter.active:before{content:"";background:var(--accent);border-radius:0 2px 2px 0;width:2px;position:absolute;top:4px;bottom:4px;left:0}.rail-encounter .marker{border-radius:50%;width:6px;height:6px}.rail-encounter .marker.raid{background:var(--raid)}.rail-encounter .marker.mythic{background:var(--mythic)}.rail-encounter .marker.rated{background:var(--rated)}.rail-encounter .name{color:var(--ink);font-weight:500}.rail-encounter .meta{color:var(--ink-3);font-family:var(--mono);font-size:11px}.rail-encounter .progress{grid-column:2/4;align-items:stretch;gap:1px;height:3px;margin-top:4px;display:flex}.rail-encounter .pull-bit{background:var(--line);border-radius:1px;flex:1;min-width:2px}.rail-encounter .pull-bit.kill{background:var(--kill)}.rail-encounter .pull-bit.wipe{background:var(--wipe);opacity:.55}.rail-encounter .pull-bit.wipe.close{opacity:.95}.rail-encounter .pull-bit.active{background:var(--accent);box-shadow:0 0 0 1px var(--accent)}.content{min-width:0;min-height:0;padding:0;overflow:auto}.panel{background:var(--panel);border:1px solid var(--line);border-radius:var(--r-3)}.panel-head{border-bottom:1px solid var(--line);align-items:center;gap:10px;padding:10px 12px;display:flex}.panel-head h3{letter-spacing:.08em;text-transform:uppercase;color:var(--ink-2);margin:0;font-size:11px;font-weight:600}.panel-head .info{color:var(--ink-3);cursor:help;font-size:11px}.panel-head .spacer{flex:1}.panel-body{padding:12px}.btn{background:var(--panel);border:1px solid var(--line);color:var(--ink);border-radius:var(--r-2);cursor:pointer;padding:5px 10px;font-family:inherit;font-size:12px}.btn:hover{background:var(--hover);border-color:var(--line-2)}.btn.primary{background:var(--accent-2);border-color:var(--accent-2);color:#0a0d10;font-weight:600}.btn.primary:hover{background:var(--accent)}.btn.ghost{color:var(--ink-3);background:0 0;border-color:#0000}.btn.ghost:hover{color:var(--ink);background:var(--hover)}.btn-icon{justify-content:center;align-items:center;width:28px;height:28px;padding:0;display:inline-flex}.segmented{background:var(--panel);border:1px solid var(--line);border-radius:var(--r-2);gap:1px;padding:2px;display:inline-flex}.segmented button{color:var(--ink-3);letter-spacing:.04em;text-transform:uppercase;cursor:pointer;background:0 0;border:none;border-radius:4px;padding:4px 10px;font-family:inherit;font-size:11px;font-weight:600}.segmented button:hover{color:var(--ink)}.segmented button.on{background:var(--bg-2);color:var(--ink)}.chip{background:var(--bg-2);border:1px solid var(--line);color:var(--ink-2);font-size:11px;font-family:var(--mono);border-radius:12px;align-items:center;gap:5px;padding:2px 8px;display:inline-flex}.chip .dot{background:var(--ink-3);border-radius:50%;width:6px;height:6px}.chip.live .dot{background:var(--accent);box-shadow:0 0 6px var(--accent-glow)}.chip.kill{color:var(--kill);border-color:#6ad99a4d}.chip.wipe{color:var(--wipe);border-color:#e573734d}.chip.llm{color:var(--llm);border-color:#b69cf24d}.chip.rule{color:var(--rule);border-color:#7ee0c84d}.page{min-height:100%;padding:16px 18px 20px}.inspector{width:var(--insp-w);background:var(--bg);border-left:1px solid var(--line);flex-direction:column;min-height:0;display:flex}.inspector-tabs{border-bottom:1px solid var(--line);display:flex}.inspector-tab{color:var(--ink-3);text-transform:uppercase;letter-spacing:.08em;cursor:pointer;background:0 0;border:none;border-bottom:2px solid #0000;flex:1;padding:10px 6px;font-size:10px;font-weight:600}.inspector-tab.on{color:var(--ink);border-bottom-color:var(--accent)}.inspector-body{flex:1;padding:12px 14px;overflow:auto}.tt{position:relative}.tt:after{content:attr(data-tt);color:var(--ink);white-space:nowrap;pointer-events:none;opacity:0;border:1px solid var(--line);font-size:11px;font-family:var(--mono);background:#000;border-radius:4px;padding:4px 8px;transition:opacity .12s;position:absolute;bottom:calc(100% + 6px);left:50%;transform:translate(-50%)}.tt:hover:after{opacity:1}.sev-rail{border-radius:2px;align-self:stretch;width:3px}.sev-rail.crit{background:var(--wipe)}.sev-rail.warn{background:var(--warn)}.sev-rail.info{background:var(--info)}.sev-rail.ok{background:var(--kill)}.sev-rail.flat{background:var(--line)}.muted{color:var(--ink-3)}.dim{color:var(--ink-4)}.flex{display:flex}.row{align-items:center;display:flex}.col{flex-direction:column;display:flex}.gap-4{gap:4px}.gap-6{gap:6px}.gap-8{gap:8px}.gap-10{gap:10px}.gap-12{gap:12px}.gap-16{gap:16px}.fill{flex:1}@keyframes fadeIn{0%{opacity:0;transform:translateY(2px)}to{opacity:1;transform:none}}.fade-in{animation:.18s fadeIn}@keyframes pulse-dot{0%,to{opacity:.4}50%{opacity:1}}.pulse{animation:1.6s ease-in-out infinite pulse-dot}@keyframes lab-blink{0%,50%{opacity:1}50.01%,to{opacity:0}}.drawer-bg{z-index:50;background:#0006;animation:.15s fadeIn;position:fixed;inset:0}.drawer{background:var(--bg);border-left:1px solid var(--line);z-index:51;flex-direction:column;width:460px;animation:.2s drawIn;display:flex;position:fixed;top:0;bottom:0;right:0}@keyframes drawIn{0%{opacity:0;transform:translate(20px)}to{opacity:1;transform:none}}.drawer-head{border-bottom:1px solid var(--line);align-items:center;gap:10px;padding:14px 16px;display:flex}.drawer-head h2{text-transform:uppercase;letter-spacing:.06em;margin:0;font-size:13px;font-weight:700}.drawer-body{flex:1;padding:14px 16px;overflow:auto}.drawer-section{border-top:1px solid var(--line);padding:14px 0}.drawer-section:first-child{border-top:none;padding-top:0}.drawer-section h3{text-transform:uppercase;letter-spacing:.08em;color:var(--ink-3);margin:0 0 8px;font-size:10px;font-weight:600}