:root{--bg:#12151f;--panel:#12151feb;--line:#ffffff1f;--text:#ece6da;--dim:#a59c8c;--gold:#f0c26a;--good:#6fdc7a;--bad:#ff6b5a;--warn:#ffd166;--lightningcss-light: ;--lightningcss-dark:initial;color-scheme:dark}*{box-sizing:border-box}html,body{background:var(--bg);height:100%;color:var(--text);-webkit-user-select:none;user-select:none;margin:0;font:14px/1.4 system-ui,Segoe UI,sans-serif;overflow:hidden}#view{position:fixed;inset:0}button{font:inherit;color:inherit;cursor:pointer}kbd{border:1px solid var(--line);text-align:center;background:#ffffff0f;border-bottom-width:2px;border-radius:4px;min-width:1.6em;margin:0 1px;padding:0 .35em;font:12px/1.6 ui-monospace,monospace;display:inline-block}.good{color:var(--good)}.bad{color:var(--bad)}.warn{color:var(--warn)}.overlay{z-index:20;background:#080a108c;justify-content:center;align-items:center;padding:16px;display:flex;position:fixed;inset:0;overflow:auto}.overlay[hidden]{display:none}.panel{background:var(--panel);border:1px solid var(--line);text-align:center;border-radius:12px;min-width:280px;padding:20px 24px;box-shadow:0 20px 60px #00000080}.panel.wide{width:min(860px,100%)}.panel.menu{text-align:left;width:min(980px,100%);margin:auto}.panel h1{letter-spacing:.04em;color:var(--gold);margin:0;font-size:34px}.panel h2{text-transform:uppercase;letter-spacing:.12em;color:var(--dim);margin:18px 0 8px;font-size:13px}.lede{color:var(--dim);margin:4px 0 0}.panel>button,.buttons button{color:#1b1206;background:linear-gradient(#e0a94a,#a8711f);border:1px solid #b8862f;border-radius:8px;margin:14px 6px 0 0;padding:10px 22px;font-weight:700;display:inline-block}.panel button.secondary{border-color:var(--line);color:var(--text);background:#ffffff0f;font-weight:500}#startBtn{padding:12px 44px;font-size:18px}.cards{grid-template-columns:repeat(auto-fit,minmax(240px,1fr));gap:10px;display:grid}.classCard{text-align:left;border:1px solid var(--line);border-left:4px solid var(--c);background:#ffffff08;border-radius:10px;padding:12px 14px}.classCard b{color:var(--c);font-size:17px;display:block}.classCard small{color:var(--dim)}.classCard p{margin:6px 0;font-size:13px}.classCard .icons{letter-spacing:2px;margin-top:4px;font-size:16px}.classCard.selected,.diff.selected{border-color:var(--gold);border-left-color:var(--c,var(--gold));box-shadow:0 0 0 1px var(--gold) inset;background:#f0c26a1f}.cards.small .classCard{padding:8px 12px}.diffs{grid-template-columns:repeat(auto-fit,minmax(170px,1fr));gap:8px;display:grid}.diff{text-align:left;border:1px solid var(--line);background:#ffffff08;border-radius:10px;padding:8px 12px}.diff b{display:inline-block}.diff em{float:right;color:var(--gold);font-size:12px;font-style:normal}.diff small{color:var(--dim);font-size:12px;display:block}.controls{color:var(--dim);margin-top:18px}.controls summary{cursor:pointer;color:var(--text)}.controls .cols{grid-template-columns:repeat(auto-fit,minmax(300px,1fr));gap:16px;display:grid}.controls li{margin:4px 0}.keys{columns:2;padding-left:16px;list-style:none}#hud[hidden]{display:none}#top{text-align:center;text-shadow:0 1px 3px #000;pointer-events:none;position:fixed;top:10px;left:50%;transform:translate(-50%)}#clock{font-weight:600}#fatigue{color:var(--warn);font-size:13px}#countdown{color:var(--gold);text-shadow:0 4px 20px #000;pointer-events:none;font-size:72px;font-weight:800;position:fixed;top:30%;left:50%;transform:translate(-50%,-50%)}.frame{border:1px solid var(--line);background:#0a0c12b8;border-radius:10px;width:300px;padding:8px 10px}.frame .name{margin-bottom:4px;font-weight:700}.bar{background:#ffffff14;border-radius:4px;height:20px;margin-top:3px;position:relative;overflow:hidden}.bar.res{height:12px}.bar .fill{background:linear-gradient(#5edb6a,#2f9a3c);transition:width .12s linear;position:absolute;inset:0 auto 0 0}.bar .absorb{background:repeating-linear-gradient(45deg,#c8e6ffd9 0 4px,#96c8ff8c 4px 8px);position:absolute;top:0;bottom:0}.bar .txt{text-align:center;text-shadow:0 1px 2px #000;font-size:12px;line-height:20px;display:block;position:relative}.bar.res .txt{font-size:10px;line-height:12px}.auras{flex-wrap:wrap;gap:4px;min-height:30px;margin-top:5px;display:flex}.aura{background:#ffffff0f;border:2px solid #6edc78cc;border-radius:6px;place-items:center;width:30px;height:30px;font-size:17px;display:grid;position:relative}.aura.harmful{border-color:#ff6e5ad9}.aura.cc{border-color:#ffd166;box-shadow:0 0 8px #ffd16699}.aura small{text-shadow:0 0 3px #000,0 0 3px #000;font-size:10px;font-weight:700;position:absolute;bottom:-3px;right:-2px}#targetBox{pointer-events:none;flex-direction:column;align-items:center;gap:4px;width:340px;display:flex;position:fixed;top:52px;left:50%;transform:translate(-50%)}#targetBox .frame{width:340px}#targetInfo{color:var(--dim);text-shadow:0 1px 2px #000;font-size:12px}.castbar{border:1px solid var(--line);visibility:hidden;background:#0009;border-radius:4px;width:260px;height:20px;position:relative;overflow:hidden}.castbar.on{visibility:visible}.castbar.big{width:340px;height:26px}.castbar .fill{background:linear-gradient(#ffd56a,#c88a1c);position:absolute;inset:0 auto 0 0}.castbar .fill[data-school=frost]{background:linear-gradient(#a9e4ff,#3a96d0)}.castbar .fill[data-school=arcane]{background:linear-gradient(#e0b8ff,#8a4ad0)}.castbar .fill[data-school=nature]{background:linear-gradient(#b4f59a,#4aa03a)}.castbar .fill[data-school=shadow]{background:linear-gradient(#c09ae8,#5a2f8a)}.castbar .txt{text-shadow:0 1px 2px #000;align-items:center;font-size:12px;font-weight:600;display:flex;position:absolute;top:0;bottom:0;left:8px}.castbar .time{text-shadow:0 1px 2px #000;align-items:center;font-size:11px;display:flex;position:absolute;top:0;bottom:0;right:6px}.castbar.big .txt{font-size:14px}.drs{justify-content:center;gap:4px;min-height:18px;display:flex}.dr{pointer-events:auto;background:#ffd16633;border:1px solid #ffd16680;border-radius:8px;padding:1px 6px;font-size:11px}.dr.l3{background:#ff6b5a40;border-color:#ff6b5a99}.dr small{opacity:.7}#bottom{flex-direction:column;align-items:center;gap:6px;display:flex;position:fixed;bottom:12px;left:50%;transform:translate(-50%)}#playerFrame{width:360px}#playerFrame .auras{min-height:0;margin:0 0 4px}#actionBar{border:1px solid var(--line);background:#0a0c12b8;border-radius:10px;gap:4px;padding:5px;display:flex}.ability{background:radial-gradient(circle at 30% 25%,#ffffff2e,#ffffff08);border:1px solid #fff3;border-radius:8px;width:50px;height:50px;padding:0;position:relative;overflow:hidden}.ability .icon{font-size:24px}.ability .key{text-shadow:0 0 3px #000;font-size:11px;font-weight:700;position:absolute;top:1px;left:4px}.ability .cd{background:conic-gradient(#000000b3 calc(var(--p,0) * 360deg), transparent 0);pointer-events:none;position:absolute;inset:0}.ability .cdText{text-shadow:0 0 4px #000,0 0 4px #000;pointer-events:none;place-items:center;font-size:16px;font-weight:800;display:grid;position:absolute;inset:0}.ability.oor{box-shadow:inset 0 0 0 50px #c81e1459}.ability.nores{box-shadow:inset 0 0 0 50px #1e3cc866}.ability.blocked{filter:grayscale()brightness(.55)}.ability.queued,.ability.active{border-color:var(--gold);box-shadow:0 0 10px #f0c26ab3}#errors{color:#ff5a4a;text-shadow:0 1px 3px #000;opacity:0;pointer-events:none;font-size:17px;font-weight:700;transition:opacity .3s;position:fixed;top:24%;left:50%;transform:translate(-50%)}#floaters{pointer-events:none;position:fixed;inset:0;overflow:hidden}.floater{text-shadow:0 2px 3px #000,0 0 2px #000;white-space:nowrap;font-size:22px;font-weight:800;position:absolute;top:0;left:0}.floater.small{font-size:16px}.floater small{color:#bfe2ff;font-size:13px}.floater.dealt{color:#fff3c4}.floater.taken{color:#ff6b5a}.floater.heal{color:#7dff8a}.floater.status{color:#fff;font-size:18px}#log{border:1px solid var(--line);color:#cfc6b6;-webkit-user-select:text;user-select:text;background:#0a0c128c;border-radius:8px;width:min(420px,50vw - 350px);height:120px;padding:6px 8px;font-size:12px;position:fixed;bottom:10px;left:10px;overflow-y:auto}#log.open{height:360px}#help{color:var(--dim);text-shadow:0 1px 2px #000;text-align:right;pointer-events:none;max-width:min(280px,50vw - 350px);font-size:12px;position:fixed;bottom:10px;right:10px}#tooltip{border:1px solid var(--line);z-index:30;pointer-events:none;background:#0a0c12f5;border-radius:8px;width:290px;padding:8px 10px;font-size:13px;position:fixed}#tooltip .meta{color:var(--dim);margin:2px 0 4px;font-size:12px}.school{text-transform:capitalize;color:var(--dim);font-size:11px}#endScreen h2{color:var(--gold);text-transform:none;letter-spacing:.04em;margin:0;font-size:34px}#endTitle.good{color:var(--good)}#endTitle.bad{color:var(--bad)}#endReason{color:var(--dim)}#endStats{text-align:left;grid-template-columns:1fr 1fr;gap:16px;margin-top:14px;display:grid}#endStats h3{margin:0 0 6px}#endStats h3 small{color:var(--dim);font-weight:400}#endStats .row{border-bottom:1px solid #ffffff0d;justify-content:space-between;padding:2px 0;font-size:13px;display:flex}#endStats .row.sub{color:var(--dim);padding-left:12px}#endSummary{text-align:left;white-space:pre-wrap;color:var(--dim);-webkit-user-select:text;user-select:text;background:#0000004d;border-radius:6px;max-height:110px;padding:8px;font-size:11px;overflow:auto}@media (width<=1140px){#help{display:none}#log{width:min(300px,50vw - 190px);height:96px;top:10px;bottom:auto}#log.open{height:300px}}@media (width<=700px){#endStats{grid-template-columns:1fr}#log,#help{display:none}}#keybinds{z-index:40}.panel.kb{text-align:left;width:min(640px,100%)}.panel.kb .hint{color:var(--dim);margin:4px 0 10px;font-size:13px}#kbTabs{flex-wrap:wrap;gap:6px;margin-bottom:10px;display:flex}.kbTab{border:1px solid var(--line);background:#ffffff0a;border-radius:8px;padding:6px 14px}.kbTab.selected{border-color:var(--gold);background:#f0c26a24}.kbHead,.kbRow{grid-template-columns:1fr 130px 130px;align-items:center;gap:6px;display:grid}.kbHead{text-transform:uppercase;letter-spacing:.1em;color:var(--dim);margin-bottom:4px;font-size:11px}.kbRows{max-height:min(52vh,460px);overflow-y:auto}.kbRow{border-bottom:1px solid #ffffff0d;padding:3px 0}.kbSlot{border:1px solid var(--line);background:#ffffff0f;border-radius:6px;padding:5px 8px;font:12px ui-monospace,monospace}.kbSlot.empty{color:var(--dim)}.kbSlot.capturing{border-color:var(--gold);color:var(--gold);animation:1s ease-in-out infinite kbPulse}@keyframes kbPulse{50%{background:#f0c26a2e}}#kbWarn{min-height:18px;margin-top:6px;font-size:13px}.panel>button#menuKeysBtn{font-size:15px}@media (width<=520px){.kbHead,.kbRow{grid-template-columns:1fr 96px 96px}}.nameplate{pointer-events:none;transform-origin:50% 100%;text-shadow:0 1px 2px #000;flex-direction:column;align-items:center;gap:2px;width:170px;display:flex;position:fixed;top:0;left:0}.nameplate.noLos{opacity:.55}.nameplate .npName{font-size:12px;font-weight:700}.nameplate .bar{background:#0000008c;border:1px solid #000000b3;width:100%;height:12px;margin:0}.nameplate .bar .fill{background:linear-gradient(#ff7a5a,#c0392b)}.nameplate .bar .txt{font-size:10px;line-height:11px}.nameplate .bar.res{height:5px}.nameplate .castbar{width:100%;height:14px}.nameplate .castbar .txt{font-size:10px;left:4px}.nameplate .castbar .time{font-size:9px}.npCc{gap:4px;min-height:0;display:flex}.npAura{background:#0a0c12cc;border:2px solid #ffffff4d;border-radius:6px;place-items:center;width:30px;height:30px;font-size:17px;display:grid;position:relative}.npAura b{text-shadow:0 0 3px #000,0 0 3px #000;font-size:11px;position:absolute;bottom:-2px;right:0}.npAura small{white-space:nowrap;color:#fff;font-size:9px;position:absolute;top:-13px;left:50%;transform:translate(-50%)}.npAura.cc{border-color:#ffd166;width:40px;height:40px;font-size:22px;box-shadow:0 0 10px #ffd166b3}.npAura.cc.root{width:32px;height:32px;box-shadow:none;border-color:#7fe07a;font-size:18px}.npAura.cc.silence{border-color:#ff6ad5}.npAura.immune{border-color:#bfefff;box-shadow:0 0 10px #bfefffb3}.npAura.slow{border-color:#7fd4ff;width:24px;height:24px;font-size:13px}.nameplate .drs{min-height:0}.nameplate .dr{padding:0 5px;font-size:10px}#actionBar{flex-direction:column;gap:4px}#actionBar .barRow{gap:4px;display:flex}.ability{cursor:pointer;place-items:center;display:grid}.ability.empty{cursor:default;background:#ffffff05;border-style:dashed;border-color:#ffffff1a}.ability.empty .key{opacity:.45}.ability.dropTarget,.barSlot.dropTarget{border-color:var(--gold)!important;box-shadow:0 0 10px #f0c26acc!important}@media (width<=760px){.ability{width:40px;height:40px}.ability .icon{font-size:19px}}.panel.kb{width:min(820px,100%)}.panel.kb h3{text-transform:uppercase;letter-spacing:.1em;color:var(--dim);margin:14px 0 6px;font-size:12px}.spellbook{grid-template-columns:repeat(auto-fill,minmax(150px,1fr));gap:6px;display:grid}.bookSpell{border:1px solid var(--line);cursor:grab;background:#ffffff0a;border-radius:8px;align-items:center;gap:8px;padding:5px 8px;font-size:13px;display:flex}.bookSpell .icon{font-size:20px}.bookSpell.missing{border-color:#ffd16699}.kbBars{flex-direction:column;gap:6px;padding-bottom:4px;display:flex;overflow-x:auto}.barRow{align-items:center;gap:4px;display:flex}.barName{width:44px;color:var(--dim);flex:none;font-size:11px}.barSlot{cursor:grab;background:radial-gradient(circle at 30% 25%,#ffffff29,#ffffff08);border:1px solid #ffffff38;border-radius:8px;flex:none;place-items:center;width:52px;height:52px;display:grid;position:relative}.barSlot .icon{font-size:24px}.barSlot .key{text-shadow:0 0 3px #000;font-size:11px;font-weight:700;position:absolute;top:1px;left:4px}.barSlot.empty{cursor:default;background:#ffffff05;border-style:dashed}.barSlot.hover{border-color:var(--gold);box-shadow:0 0 0 1px var(--gold) inset}#settings{z-index:40}.settingsPanel{text-align:left;width:min(480px,100%)}.settingsPanel h3{text-transform:uppercase;letter-spacing:.1em;color:var(--dim);margin:12px 0 6px;font-size:12px}.setRow{grid-template-columns:150px 1fr 40px;align-items:center;gap:10px;margin:8px 0;display:grid}.setRow input[type=range]{width:100%;accent-color:var(--gold)}.setRow output{text-align:right;font-variant-numeric:tabular-nums;color:var(--dim)}.settingsPanel .check{align-items:center;gap:8px;margin:10px 0 4px;display:flex}.settingsPanel .hint{color:var(--dim);font-size:12px}@media (width<=480px){.setRow{grid-template-columns:1fr 40px}.setRow label{grid-column:1/-1}}.nameplate.pet{width:120px}.nameplate.pet .npName{font-size:11px}.nameplate.pet .bar{height:9px}.nameplate.pet .bar .txt{font-size:8px;line-height:8px}.nameplate.selected .bar.hp{border-color:#fff;box-shadow:0 0 6px #fffc}.nameplate.selected .npName:before{content:"▸ "}#petFrame{width:200px;padding:4px 8px}#petFrame .name{margin-bottom:0;font-size:11px}#petFrame .bar{height:12px}#petFrame .bar .txt{font-size:10px;line-height:12px}#petFrame.dead .name:after{content:" — dead";color:var(--bad)}.buildStamp{color:var(--dim);opacity:.7;font:11px ui-monospace,monospace;position:absolute;top:12px;right:16px}.panel.menu{position:relative}#playerFrame .name:after{content:"";margin-left:8px;font-size:11px;font-weight:600}#playerFrame.inCombat .name:after{content:"⚔ in combat";color:var(--bad)}#crosshair{pointer-events:none;background:#fff;border-radius:50%;width:4px;height:4px;margin:-2px 0 0 -2px;display:none;position:fixed;top:50%;left:50%;box-shadow:0 0 0 1px #0009}body.locked #crosshair{display:block}#onlineBtn{margin-left:8px}.lobbyPanel{width:min(720px,100vw - 32px)}.inviteRow{gap:8px;margin:8px 0 14px;display:flex}.inviteRow input{min-width:0;color:inherit;font:inherit;background:#0006;border:1px solid #fff3;border-radius:6px;flex:1;padding:8px 10px}.lobbyPanel .setRow input{color:inherit;font:inherit;background:#0006;border:1px solid #fff3;border-radius:6px;padding:6px 8px}#lobbySeats{grid-template-columns:1fr 1fr;gap:8px;margin:12px 0;display:grid}.seat{background:#0004;border:1px solid #fff2;border-radius:8px;flex-direction:column;gap:2px;padding:10px 12px;display:flex}.seat.ready{border-color:#5fd17a}.seat.empty{color:#fff9;justify-content:center;font-style:italic}.seat em{opacity:.8;font-size:12px;font-style:normal}#netInfo{color:#fffa;pointer-events:none;font-size:11px;position:fixed;top:8px;left:50%;transform:translate(-50%)}.panel button.accent{color:#06121f;background:linear-gradient(#5aa9e6,#2f6fb0)}.panel button:disabled{opacity:.55;cursor:default}:root{--k-damage:#c2452f;--k-cc:#8a4fd0;--k-slow:#2f86c8;--k-interrupt:#e0841f;--k-defense:#c9a227;--k-heal:#3aa655;--k-move:#1fa59a;--k-utility:#6f7c8a}.gi{--k:var(--k-utility);vertical-align:middle;background:radial-gradient(circle at 32% 25%, #ffffff59, transparent 60%), radial-gradient(circle at 50% 120%, #0000008c, transparent 70%), var(--k);border-radius:22%;place-items:center;width:1.5em;height:1.5em;display:inline-grid;box-shadow:inset 0 0 0 1px #ffffff2e,inset 0 -3px 6px #00000059}.gi svg{fill:#fff;filter:drop-shadow(0 1px 1px #0009);width:78%;height:78%}.k-damage{--k:var(--k-damage)}.k-cc{--k:var(--k-cc)}.k-slow{--k:var(--k-slow)}.k-interrupt{--k:var(--k-interrupt)}.k-defense{--k:var(--k-defense)}.k-heal{--k:var(--k-heal)}.k-move{--k:var(--k-move)}.k-utility{--k:var(--k-utility)}.glyph{vertical-align:-.2em;width:1.15em;height:1.15em;display:inline-block}.glyph svg{fill:currentColor;width:100%;height:100%}.ability .icon,.barSlot .icon{font-size:24px;position:absolute;inset:0}.ability .icon .gi,.barSlot .icon .gi{border-radius:7px;width:100%;height:100%}.bookSpell .icon .gi{width:30px;height:30px}.ability .key,.barSlot .key{z-index:1}.cards .icons .gi{width:22px;height:22px;margin:1px}.aura .glyph,.npAura .glyph{color:#fff;filter:drop-shadow(0 1px 1px #000);width:20px;height:20px}.npAura.cc .glyph{width:26px;height:26px}.kindTag{color:#fff;background:var(--k);vertical-align:1px;border-radius:9px;padding:0 6px;font-size:11px;font-weight:600;display:inline-block}.castbar .txt .glyph{width:14px;height:14px}.maps{grid-template-columns:repeat(auto-fit,minmax(150px,1fr));gap:8px;display:grid}.mapCard{text-align:left;border:1px solid var(--line);background:#ffffff0a;border-radius:8px;flex-direction:column;gap:3px;padding:9px 11px;display:flex}.mapCard small{color:var(--dim);font-size:11px;line-height:1.35}.mapCard.selected{background:#e0a94a1f;border-color:#e0a94a}.credits{color:var(--dim);margin:10px 0 0;font-size:11px}.credits a{color:inherit}#fps{color:#cfe8c8;pointer-events:none;z-index:5;background:#00000073;border-radius:4px;padding:4px 6px;font:600 12px/1 ui-monospace,monospace;position:absolute;top:8px;right:10px}.settingsPanel .hint.warn{color:#ffb08a}#gpuName{color:#d8d2c4}
