body.play-page{background:#05060a;overflow:hidden}.play-root{position:fixed;inset:0;overflow:hidden}#play-canvas{cursor:crosshair;width:100%;height:100%;display:block;position:absolute;inset:0}.play-root.rpg #play-canvas{cursor:default}.hud{pointer-events:none;z-index:5;font-family:var(--font-body), system-ui, sans-serif;-webkit-user-select:none;user-select:none;position:absolute;inset:0}.play-overlay{z-index:20;-webkit-backdrop-filter:blur(7px);backdrop-filter:blur(7px);background:radial-gradient(120% 90% at 50% 0,#0a0e1ab8,#040509f0);place-items:center;padding:24px;display:grid;position:absolute;inset:0}.play-overlay.dim{-webkit-backdrop-filter:blur(4px);backdrop-filter:blur(4px);background:#0405098c}.play-overlay.pick{-webkit-backdrop-filter:none;backdrop-filter:none;background:linear-gradient(#04060c14 30%,#04060c80)}.play-card{color:#e9ecf4;text-align:left;background:linear-gradient(#131728f5,#090b14f7);border:1px solid #c9a22752;border-radius:18px;width:min(560px,100%);padding:30px 32px 26px;box-shadow:0 30px 90px #0009,inset 0 1px #ffffff0f}.play-card.wide{width:min(720px,100%)}.play-card.glass{-webkit-backdrop-filter:blur(18px)saturate(1.2);background:linear-gradient(#0e1222a8,#070912bd);border-color:#c9a22766;animation:.45s cubic-bezier(.21,.8,.32,1) both playCardIn;box-shadow:0 30px 90px #0000008c,inset 0 0 0 1px #ffffff0a,inset 0 0 46px #c9a22714}@keyframes playCardIn{0%{opacity:0;transform:translateY(16px)scale(.98)}to{opacity:1;transform:none}}.play-cine{z-index:18;pointer-events:none;position:absolute;inset:0}.play-cine:before,.play-cine:after{content:"";background:#04050a;height:0;transition:height .7s cubic-bezier(.4,0,.2,1);position:absolute;left:0;right:0}.play-cine:before{top:0}.play-cine:after{bottom:0}.play-cine.on:before,.play-cine.on:after{height:10vh}.play-kicker{letter-spacing:.18em;text-transform:uppercase;color:#c9a227;font-size:11px;font-weight:800;display:inline-block}.play-card h1{font-family:var(--font-display), system-ui, sans-serif;letter-spacing:-.01em;margin:8px 0 10px;font-size:30px;font-weight:800;line-height:1.15}.play-note{color:#e9ecf49e;font-size:13.5px;line-height:1.6}.play-error{color:#ff8a8a;margin-top:12px;font-size:13px;font-weight:600}.play-keys{color:#e9ecf46b;letter-spacing:.01em;border-top:1px solid #ffffff17;margin-top:16px;padding-top:14px;font-size:11.5px;line-height:1.7}.play-bar{background:#ffffff1a;border-radius:999px;height:6px;margin:18px 0 10px;overflow:hidden}.play-bar-fill{background:linear-gradient(90deg,#c9a227,#ffe08a);border-radius:999px;height:100%;transition:width .18s}.mode-grid,.class-grid{gap:12px;margin-top:18px;display:grid}.mode-grid{grid-template-columns:1fr 1fr}.class-grid{grid-template-columns:repeat(3,1fr)}.mode-card,.class-card{text-align:left;cursor:pointer;color:inherit;font:inherit;background:#ffffff0a;border:1px solid #ffffff1f;border-radius:13px;flex-direction:column;gap:7px;padding:16px 17px;transition:border-color .15s,background .15s,transform .15s,box-shadow .15s;display:flex;position:relative}.mode-card:hover,.class-card:hover{border-color:#c9a2278c;transform:translateY(-1px)}.mode-card.on,.class-card.on{background:#c9a22721;border-color:#c9a227;box-shadow:0 0 0 1px #c9a22759,0 6px 24px #c9a2271f}.mode-card.on:after,.class-card.on:after{content:"";background:#f0d68a;border-radius:50%;width:7px;height:7px;position:absolute;top:11px;right:11px;box-shadow:0 0 8px #f0d68ae6}.mode-card b,.class-card b{letter-spacing:.01em;font-size:15px;font-weight:700}.class-card b{font-size:13.5px}.mode-card span,.class-card span{color:#e9ecf48c;font-size:12px;line-height:1.55}.mode-head{align-items:center;gap:9px;display:flex}.mode-head em{letter-spacing:.12em;text-transform:uppercase;color:#e9ecf473;font-size:10.5px;font-style:normal;font-weight:700}.mode-ico{color:#e9ecf4bf;background:#ffffff0f;border:1px solid #ffffff1a;border-radius:10px;place-items:center;width:36px;height:36px;transition:color .15s,background .15s,border-color .15s;display:grid}.mode-card.on .mode-ico{color:#f0d68a;background:#c9a22729;border-color:#c9a22780}.play-actions{flex-wrap:wrap;gap:10px;margin-top:20px;display:flex}.play-btn{font:inherit;cursor:pointer;color:#e9ecf4;background:#ffffff0d;border:1px solid #ffffff29;border-radius:11px;justify-content:center;align-items:center;padding:11px 22px;font-size:13.5px;font-weight:700;text-decoration:none;transition:background .15s,border-color .15s;display:inline-flex}.play-btn:hover{background:#ffffff1c;border-color:#ffffff4d}.play-btn.primary{color:#17130a;background:#c9a227;border-color:#c9a227}.play-btn.primary:hover{background:#e2b93a;border-color:#e2b93a}.play-btn.primary.big{letter-spacing:.02em;padding:13px 34px;font-size:14.5px;box-shadow:0 6px 24px #c9a22747}.play-btn.ghost{color:#e9ecf49e;background:0 0;border-color:#0000}.play-btn.ghost:hover{color:#e9ecf4;background:#ffffff12}.play-btn:disabled{opacity:.4;cursor:not-allowed}.hud-vignette{background:radial-gradient(105% 80%,#0000 42%,#960a0a8c 100%);transition:opacity .2s;position:absolute;inset:0}.hud-hurt{background:#be1e1e47;transition:opacity .2s;position:absolute;inset:0}.hud-hurt.astral{background:#7828be4d}.hud-feed{flex-direction:column;align-items:flex-end;gap:5px;max-width:280px;display:flex;position:absolute;top:86px;right:20px}.hud-feed-row{letter-spacing:.04em;color:#ffffffd1;background:#06080e99;border-left:2px solid #c9a227;border-radius:6px;padding:4px 10px;font-size:11.5px;font-weight:600}.hud.fps{color:#eef2f7;text-shadow:0 1px 3px #000000d9}.hud-cross{width:0;height:0;transition:opacity .12s;position:absolute;top:50%;left:50%}.hud-cross i{background:#f2f6fb;transition:transform 60ms linear;position:absolute;box-shadow:0 0 2px #000000e6}.hud-cross .t,.hud-cross .b{width:2px;height:8px;left:-1px}.hud-cross .l,.hud-cross .r{width:8px;height:2px;top:-1px}.hud-cross .t{transform:translateY(calc(-1 * var(--gap) - 8px))}.hud-cross .b{transform:translateY(var(--gap))}.hud-cross .l{transform:translateX(calc(-1 * var(--gap) - 8px))}.hud-cross .r{transform:translateX(var(--gap))}.hud-cross .dot{opacity:.8;border-radius:50%;width:2px;height:2px;top:-1px;left:-1px}.hud-cross .hit{filter:drop-shadow(0 0 2px #000000e6);background:linear-gradient(45deg,#0000 45%,#fff 45% 55%,#0000 55%),linear-gradient(-45deg,#0000 45%,#fff 45% 55%,#0000 55%);width:18px;height:18px;position:absolute;top:-9px;left:-9px}.hud-cross .hit.head{filter:drop-shadow(0 0 3px #ff5252);background-blend-mode:normal}.hud-dmg-dir{width:0;height:0;transition:opacity .25s linear;position:absolute;top:50%;left:50%}.hud-dmg-dir span{clip-path:polygon(0 100%,50% 0,100% 100%);background:radial-gradient(60% 100% at 50% 100%,#ff3c3ce6,#ff3c3c00 70%);width:68px;height:14px;position:absolute;top:-128px;left:-34px}.hud-top{align-items:center;gap:26px;display:flex;position:absolute;top:18px;left:50%;transform:translate(-50%)}.hud-wave,.hud-score{flex-direction:column;align-items:center;line-height:1.2;display:flex}.hud-wave b{letter-spacing:.16em;font-size:15px;font-weight:800}.hud-wave span,.hud-score span{letter-spacing:.14em;color:#eef2f78c;text-transform:uppercase;font-size:10.5px;font-weight:600}.hud-score b{color:#ffd97a;letter-spacing:.04em;font-size:19px;font-weight:800}.hud-corner-r{flex-direction:column;align-items:flex-end;gap:3px;display:flex;position:absolute;top:18px;right:20px}.hud-stat{letter-spacing:.1em;color:#ffffffe6;background:#06080e6b;border-radius:5px;padding:2px 7px;font-size:11px;font-weight:700}.hud-bottom-l{position:absolute;bottom:26px;left:26px}.hud-hp{align-items:center;gap:12px;display:flex}.hud-hp-bar{background:#0000008c;border:1px solid #ffffff38;border-radius:2px;width:218px;height:9px;overflow:hidden}.hud-hp-fill{background:linear-gradient(90deg,#58d68a,#9be8b4);height:100%;transition:width .15s}.hud-hp-fill.low{background:linear-gradient(90deg,#e2484c,#ff8a6a);animation:1s ease-in-out infinite hudPulse}@keyframes hudPulse{50%{opacity:.55}}.hud-hp-num{letter-spacing:.02em;font-size:24px;font-weight:800}.hud-hp-num small{opacity:.5;font-size:12px;font-weight:600}.hud-kills{letter-spacing:.16em;color:#eef2f780;margin-top:6px;font-size:11px;font-weight:700}.hud-bottom-r{text-align:right;position:absolute;bottom:26px;right:26px}.hud-weapon{letter-spacing:.18em;color:#eef2f799;text-transform:uppercase;font-size:11.5px;font-weight:700}.hud-ammo{justify-content:flex-end;align-items:baseline;gap:8px;margin-top:2px;display:flex}.hud-ammo b{letter-spacing:-.02em;font-size:40px;font-weight:800;line-height:1}.hud-ammo b.lowammo{color:#ffd97a}.hud-ammo b.empty{color:#ff6a6a;animation:.7s ease-in-out infinite hudPulse}.hud-ammo span{color:#eef2f780;font-size:15px;font-weight:700}.hud-reload{background:#ffffff2e;border-radius:999px;width:120px;height:5px;margin:8px 0 0 auto;overflow:hidden}.hud-reload div{background:#ffd97a;height:100%}.hud-slots{justify-content:flex-end;gap:5px;margin-top:8px;display:flex}.hud-slots span{color:#eef2f773;background:#0006;border:1px solid #ffffff29;border-radius:5px;place-items:center;width:20px;height:20px;font-size:11px;font-weight:700;display:grid}.hud-slots span.on{color:#17130a;background:#ffd97a;border-color:#ffd97a}.hud.rpg{--gold:#c9a227;--gold-hi:#f0d68a;--ink:#0a0c1a;color:#e6e2f2;text-shadow:0 1px 3px #000c}.rpg-starfield{opacity:.5;background:radial-gradient(1.4px 1.4px at 12% 18%,#ffffffb3,#0000),radial-gradient(1.2px 1.2px at 78% 12%,#ffffff8c,#0000),radial-gradient(1.6px 1.6px at 33% 82%,#ffffff80,#0000),radial-gradient(1.2px 1.2px at 88% 74%,#ffffff73,#0000);position:absolute;inset:0;-webkit-mask-image:radial-gradient(120% 90%,#0000 52%,#000 100%);mask-image:radial-gradient(120% 90%,#0000 52%,#000 100%)}.rune-panel{background:linear-gradient(#101226db,#080914e6);border:1px solid #c9a2276b;border-radius:4px;padding:11px 18px;position:relative;box-shadow:inset 0 0 22px #503ca029,0 6px 22px #00000073}.rune-corner{border:1.5px solid var(--gold-hi);opacity:.85;width:9px;height:9px;position:absolute}.rune-corner.tl{border-bottom:0;border-right:0;top:-1px;left:-1px}.rune-corner.tr{border-bottom:0;border-left:0;top:-1px;right:-1px}.rune-corner.bl{border-top:0;border-right:0;bottom:-1px;left:-1px}.rune-corner.br{border-top:0;border-left:0;bottom:-1px;right:-1px}.rpg-top-l{position:absolute;top:18px;left:20px}.rpg-top-c{position:absolute;top:18px;left:50%;transform:translate(-50%)}.rpg-top-r{text-align:right;position:absolute;top:18px;right:20px}.rpg-lvl{align-items:baseline;gap:9px;display:flex}.rpg-lvl b{color:var(--gold-hi);letter-spacing:.02em;font-size:22px;font-weight:800}.rpg-lvl span{letter-spacing:.16em;text-transform:uppercase;color:#e6e2f299;font-size:11px;font-weight:700}.rpg-xp{background:#ffffff1f;border-radius:999px;width:168px;height:4px;margin-top:7px;overflow:hidden}.rpg-xp div{background:linear-gradient(90deg, var(--gold), var(--gold-hi));height:100%;transition:width .25s}.rpg-wave b{letter-spacing:.16em;font-size:14px;font-weight:800}.rpg-wave span{letter-spacing:.1em;color:#e6e2f28c;margin-left:9px;font-size:11px;font-weight:600}.rpg-score{letter-spacing:.1em;color:var(--gold);margin-top:4px;font-size:11px;font-weight:600}.rune-panel.target{text-align:center;min-width:260px}.rune-panel.target.boss{border-color:var(--gold-hi);min-width:400px;box-shadow:inset 0 0 30px #c9a22738,0 6px 26px #0000008c}.target-name{letter-spacing:.18em;text-transform:uppercase;color:var(--gold-hi);font-size:12.5px;font-weight:700}.target-bar{background:#00000080;border:1px solid #c9a22759;border-radius:999px;height:6px;margin-top:7px;overflow:hidden}.target-bar div{background:linear-gradient(90deg,#8a2b3f,#e0546a);height:100%;transition:width .15s}.rpg-feed{top:96px}.rpg-bottom{align-items:flex-end;gap:26px;display:flex;position:absolute;bottom:22px;left:50%;transform:translate(-50%)}.orb{width:104px;height:104px;position:relative}.orb-ring{width:100%;height:100%;position:absolute;inset:0;overflow:visible}.orb-ring-track{fill:none;stroke:#c9a22738;stroke-width:2px}.orb-ring-arc{fill:none;stroke:var(--gold-hi);stroke-width:2.6px;stroke-linecap:round;transition:stroke-dasharray .2s}.orb-ring .tick{stroke:#c9a22780;stroke-width:1.2px}.orb-ring .tick.major{stroke:var(--gold-hi);stroke-width:2px}.orb-well{background:radial-gradient(70% 70% at 35% 28%,#ffffff17,#05060eeb);border:1px solid #c9a22766;border-radius:50%;position:absolute;inset:18px;overflow:hidden}.orb-fill{transition:height .2s;position:absolute;bottom:0;left:0;right:0}.orb.life .orb-fill{background:linear-gradient(#e05a6a,#7d1830);box-shadow:0 0 18px #e05a6a8c}.orb.astra .orb-fill{background:linear-gradient(#7fb8ff,#2a3ea0);box-shadow:0 0 18px #7fb8ff80}.orb-gloss{background:radial-gradient(60% 46% at 34% 24%,#ffffff3d,#0000 70%);position:absolute;inset:0}.orb-num{letter-spacing:.01em;place-items:center;font-size:21px;font-weight:800;display:grid;position:absolute;inset:0}.orb-label{text-align:center;letter-spacing:.2em;color:var(--gold);font-size:9.5px;font-weight:800;position:absolute;bottom:-15px;left:0;right:0}.hotbar{background:linear-gradient(#101226e6,#080914f0);border:1px solid #c9a2276b;border-radius:4px;gap:8px;padding:11px 14px;display:flex;position:relative;box-shadow:inset 0 0 26px #503ca02e,0 8px 26px #00000080}.hotbar .slot{cursor:default;width:74px;height:74px;font:inherit;color:inherit;opacity:.5;background:linear-gradient(#282248b3,#0e0e1ecc);border:1px solid #c9a2274d;border-radius:3px;flex-direction:column;justify-content:center;align-items:center;gap:3px;transition:opacity .15s,border-color .15s,box-shadow .15s;display:flex;position:relative;overflow:hidden}.hotbar .slot.ready{opacity:1;border-color:var(--gold);box-shadow:inset 0 0 14px #c9a22738}.slot-roman{font-family:var(--font-display), serif;color:var(--gold-hi);font-size:17px;font-weight:800;line-height:1}.slot-name{letter-spacing:.07em;text-transform:uppercase;text-align:center;color:#e6e2f2b8;padding:0 3px;font-size:8.5px;font-weight:700}.slot-cost{color:#7fb8ff;font-size:9px;font-weight:700}.slot-cd{background:#060710b8;transition:height .1s linear;position:absolute;bottom:0;left:0;right:0}.slot-cd-num{color:var(--gold-hi);place-items:center;font-size:15px;font-weight:800;display:grid;position:absolute;inset:0}.slot-key{color:#e6e2f266;font-size:9px;font-weight:800;position:absolute;top:2px;right:4px}@media (max-width:760px){.mode-grid,.class-grid{grid-template-columns:1fr}.rpg-bottom{gap:12px}.orb{width:76px;height:76px}.orb-num{font-size:16px}.hotbar .slot{width:58px;height:58px}.hud-hp-bar{width:150px}}