:root{--ink: #1c1a2b;--paper: #fffaf0;--gold: #ffd84a;--hp: #5ee07a;--hp-foe: #ff5a6a;--ally: #4aa8ff;--panel: rgba(24, 22, 44, .86);--line: rgba(255, 255, 255, .14);font-family:Fredoka,system-ui,sans-serif}*{box-sizing:border-box}html,body{margin:0;height:100%;overflow:hidden;background:#0f0e1a;color:#fff;-webkit-user-select:none;user-select:none}#game canvas{display:block}#labels,#ui{position:fixed;top:0;right:0;bottom:0;left:0;pointer-events:none}.ui-on,.ui-on *{pointer-events:auto}.hidden{display:none!important}button{font:600 18px Fredoka,sans-serif;color:var(--ink);background:linear-gradient(#ffe57a,#ffc93a);border:3px solid var(--ink);border-radius:14px;padding:12px 22px;cursor:pointer;box-shadow:0 4px 0 var(--ink);transition:transform .08s,box-shadow .08s}button:hover{transform:translateY(-1px);box-shadow:0 5px 0 var(--ink)}button:active{transform:translateY(3px);box-shadow:0 1px 0 var(--ink)}button.ghost{background:var(--paper)}button:disabled{cursor:default}.screen{position:absolute;top:0;right:0;bottom:0;left:0}.loading{display:grid;place-content:center;justify-items:center;background:#9fd4ff;color:var(--ink);font-size:20px}.spinner{width:54px;height:54px;border-radius:50%;border:6px solid var(--ink);border-right-color:var(--gold);animation:spin .8s linear infinite}@keyframes spin{to{transform:rotate(360deg)}}.title-wrap{position:absolute;top:0;right:0;bottom:0;left:0;display:flex;flex-direction:column;align-items:center;justify-content:space-between;padding:6vh 16px 3vh}.logo{text-align:center;filter:drop-shadow(0 6px 0 var(--ink))}.logo-top{font-size:clamp(54px,9vw,110px);font-weight:700;line-height:.9;color:var(--gold);-webkit-text-stroke:4px var(--ink);paint-order:stroke fill}.logo-sub{font-size:clamp(22px,3vw,34px);font-weight:600;color:#fff;-webkit-text-stroke:2px var(--ink);paint-order:stroke fill;letter-spacing:.06em}.menu{display:flex;flex-direction:column;gap:12px;width:min(340px,100%);margin-top:auto;margin-bottom:4vh}.foot{font-size:13px;color:var(--ink);opacity:.7}.map-panel,.stage-panel{position:absolute;top:16px;right:16px;bottom:16px;width:min(440px,calc(100% - 32px));background:var(--panel);border:3px solid var(--ink);border-radius:20px;padding:22px;overflow-y:auto;-webkit-backdrop-filter:blur(6px);backdrop-filter:blur(6px);box-shadow:0 10px #00000040}.map-panel h1,.stage-panel h1{margin:10px 0 4px;font-size:28px;line-height:1.1}.back{padding:6px 14px;font-size:15px;background:var(--paper)}.chapter-stars{color:var(--gold);font-weight:600;margin-bottom:18px}.path{display:flex;flex-direction:column;align-items:stretch}.node{display:flex;align-items:center;gap:14px;text-align:left;background:var(--paper);padding:12px 14px}.node.done{background:linear-gradient(#e9ffe0,#c9f2b8)}.node.locked{background:#8a8799;color:#444;box-shadow:0 4px 0 var(--ink);transform:none}.n-id{width:52px;height:52px;border-radius:50%;background:var(--ink);color:var(--gold);display:grid;place-items:center;font-weight:700;flex:none}.n-info{flex:1}.n-name{font-size:18px}.n-mode{font-size:13px;font-weight:500;opacity:.7}.n-stars{font-size:20px;letter-spacing:1px;color:#b8b2a0}.n-stars .on,.r-stars .on{color:#ffb300;text-shadow:0 2px 0 var(--ink)}.link{width:6px;height:22px;margin:2px auto;background:repeating-linear-gradient(var(--paper) 0 5px,transparent 5px 9px)}.soon{margin-top:22px;text-align:center;opacity:.55}.st-id{margin-top:14px;color:var(--gold);font-weight:600}.st-desc{line-height:1.45;opacity:.9}.goals{display:grid;gap:4px;padding:10px 14px;background:#ffffff12;border-radius:12px;font-size:15px;color:#ffe9a6}.stage-panel h3{margin:20px 0 10px}.picks{display:grid;gap:10px}.pick{display:flex;gap:12px;align-items:center;text-align:left;background:var(--paper);padding:8px 12px}.pick.sel{background:linear-gradient(#ffe57a,#ffc93a);outline:3px solid #fff;outline-offset:2px}.pick img{width:72px;height:72px;border-radius:50%;background:radial-gradient(#fff,#cfe7ff);border:3px solid var(--ink);flex:none}.p-name{font-size:20px}.p-role{font-size:13px;font-weight:500;opacity:.75}.p-skills{margin-top:4px;font-size:18px;letter-spacing:4px}.play{width:100%;margin-top:20px;font-size:22px;padding:14px}.dialog{position:absolute;left:50%;bottom:4vh;transform:translate(-50%);width:min(860px,calc(100% - 32px));display:flex;gap:16px;align-items:flex-start;padding:16px 20px;cursor:pointer;background:linear-gradient(#1e285af0,#14183cf0);border:3px solid #fff;border-radius:16px;box-shadow:0 0 0 3px var(--ink),0 10px #0000004d}.d-portrait{width:112px;height:112px;border-radius:14px;border:3px solid #fff;background:radial-gradient(#fff,#b9d8ff);flex:none}.d-body{flex:1;min-height:112px}.d-name{color:var(--gold);font-size:20px;font-weight:600;margin-bottom:6px}.d-text{font-size:21px;line-height:1.4}.d-next{position:absolute;right:18px;bottom:8px;animation:bob .8s ease-in-out infinite;color:var(--gold)}@keyframes bob{50%{transform:translateY(4px)}}.skip{position:absolute;right:16px;top:16px;padding:6px 14px;font-size:15px;background:var(--paper)}@media (max-width: 600px){.d-portrait{width:72px;height:72px}.d-text{font-size:17px}.d-body{min-height:72px}}.hud{position:absolute;top:0;right:0;bottom:0;left:0}.hud-top{position:absolute;top:12px;left:50%;transform:translate(-50%);display:flex;gap:10px;align-items:center}.objective,.timer{background:var(--panel);border:2px solid var(--ink);padding:6px 14px;border-radius:12px;font-weight:500}.timer{font-variant-numeric:tabular-nums;color:var(--gold)}.side-panel{position:absolute;top:12px;right:12px;width:300px;display:grid;gap:6px}.minimap{width:300px;height:64px;border:3px solid var(--ink);border-radius:10px;display:block}.structs{display:grid;grid-template-columns:1fr 1fr;gap:4px 8px;background:var(--panel);border:2px solid var(--ink);border-radius:10px;padding:6px 8px;font-size:12px;font-weight:600}.st .bar{height:14px;margin-top:2px}.st .bar b{position:absolute;top:0;right:0;bottom:0;left:0;display:grid;place-items:center;font-size:11px;text-shadow:0 1px 2px #000}.st.t0 .bar i{background:linear-gradient(#8fd0ff,#3a8ee0)}.st.t1 .bar i{background:linear-gradient(#ff9aa6,#e0405a)}.st.dead{opacity:.5}.score{font-weight:700;font-size:20px;text-shadow:0 1px 3px #000}.score .s0{color:#8fd0ff}.score .s1{color:#ff9aa6}.buffs{position:absolute;left:-6px;top:-14px;display:flex;gap:3px}.buffs span{position:relative;width:28px;height:28px;border-radius:8px;background:var(--paper);border:2px solid var(--ink);display:grid;place-items:center;font-size:16px}.buffs i{position:absolute;right:-4px;bottom:-6px;font-style:normal;font-size:10px;font-weight:700;background:var(--ink);color:#fff;border-radius:6px;padding:0 3px}.tag{font-size:11px;color:#e9f3ff;text-shadow:0 1px 2px #000;margin-top:-2px;margin-bottom:1px}.bossbar{position:absolute;top:58px;left:50%;transform:translate(-50%);width:min(560px,80vw);text-align:center}.bb-name{font-weight:700;font-size:20px;-webkit-text-stroke:1px var(--ink);paint-order:stroke fill;color:#e9d2ff}.bossbar .bar{height:16px}.bossbar .bar i{background:linear-gradient(#c58aff,#8a3ae0)}.banner{position:absolute;top:30%;left:0;right:0;text-align:center;opacity:0;transform:scale(.9);transition:opacity .25s,transform .25s}.banner.show{opacity:1;transform:scale(1)}.b-title{font-size:clamp(32px,5vw,58px);font-weight:700;color:var(--gold);-webkit-text-stroke:3px var(--ink);paint-order:stroke fill;filter:drop-shadow(0 4px 0 var(--ink))}.b-sub{font-size:20px;font-weight:500;-webkit-text-stroke:1px var(--ink);paint-order:stroke fill}.hint{position:absolute;top:64px;left:50%;transform:translate(-50%);max-width:min(620px,90vw);background:var(--paper);color:var(--ink);border:3px solid var(--ink);border-radius:14px;padding:10px 18px;font-size:18px;text-align:center;box-shadow:0 4px 0 var(--ink);animation:pop .25s ease-out}@keyframes pop{0%{transform:translate(-50%) scale(.85);opacity:0}}.hud-bottom{position:absolute;left:50%;bottom:34px;transform:translate(-50%);display:flex;gap:14px;align-items:flex-end;background:var(--panel);border:3px solid var(--ink);border-radius:18px;padding:10px 14px}.champ-card{position:relative}.portrait{width:96px;height:96px;border-radius:14px;border:3px solid #fff;background:radial-gradient(#fff,#b9d8ff);display:block}.lvl{position:absolute;right:-8px;bottom:-8px;width:34px;height:34px;border-radius:50%;background:var(--gold);color:var(--ink);border:3px solid var(--ink);display:grid;place-items:center;font-weight:700}.champ-main{width:340px}.champ-name{font-weight:600;margin-bottom:4px}.bar{position:relative;height:18px;background:#00000080;border:2px solid var(--ink);border-radius:8px;overflow:hidden}.bar i{position:absolute;inset:0 auto 0 0;background:linear-gradient(#8bf59f,#3fc85e);transition:width .12s}.bar em{position:absolute;inset:0 0 0 auto;background:#dcf0ffd9}.bar span{position:absolute;top:0;right:0;bottom:0;left:0;display:grid;place-items:center;font-size:12px;font-weight:600;text-shadow:0 1px 2px #000}.bar.xp{height:8px;margin-top:4px}.bar.xp i{background:linear-gradient(#ffe57a,#ffb300)}.skills{display:flex;gap:8px;margin-top:10px}.skill{position:relative;width:62px;height:62px;border-radius:12px;border:3px solid var(--ink);background:linear-gradient(#fffaf0,#e7dcc4);overflow:hidden;display:grid;place-items:center}.skill .ico{font-size:30px}.skill b{position:absolute;left:4px;top:1px;font-size:13px;color:var(--ink)}.cdmask{position:absolute;left:0;right:0;bottom:0;background:#141228b8}.cdtxt{position:absolute;top:0;right:0;bottom:0;left:0;display:grid;place-items:center;font-size:22px;font-weight:700;text-shadow:0 2px 2px #000}.lock{display:none;position:absolute;top:0;right:0;bottom:0;left:0;background:#141228cc;place-items:center;font-size:12px;font-weight:600}.skill.locked .lock{display:grid}.skill.deny{animation:shake .25s}@keyframes shake{25%{transform:translate(-4px)}75%{transform:translate(4px)}}.tip{display:none;position:fixed;bottom:190px;left:50%;transform:translate(-50%);width:260px;background:var(--paper);color:var(--ink);border:3px solid var(--ink);border-radius:12px;padding:10px;font-size:14px;z-index:5}.skill:hover .tip{display:block}.tip .rk{color:#d08a00;letter-spacing:2px}.tip small{opacity:.75}.skill-slot{position:relative;display:flex;flex-direction:column;align-items:center}.pips{display:flex;gap:3px;margin-top:4px}.pips i{width:10px;height:5px;border-radius:3px;background:#00000073;border:1px solid var(--ink)}.pips i.on{background:var(--gold)}.lvlup{display:none;position:absolute;top:-26px;left:50%;transform:translate(-50%);width:30px;height:22px;padding:0;border-radius:8px;border:2px solid var(--ink);background:linear-gradient(#bff6ff,#4fc3ff);color:var(--ink);font-weight:800;font-size:18px;line-height:1;cursor:pointer;animation:bob .9s ease-in-out infinite}.skill-slot.can .lvlup{display:block}@keyframes bob{50%{transform:translate(-50%) translateY(-3px)}}.skill.locked .lock{font-size:22px;color:#bfeaff}.stats{display:grid;grid-template-columns:1fr 1fr;gap:3px 10px;align-self:center;font-size:12px;min-width:128px}.stat{display:flex;justify-content:space-between;gap:6px;background:#00000047;border-radius:6px;padding:2px 6px}.stat span{opacity:.8;font-weight:600}.stat b{font-variant-numeric:tabular-nums}.help{position:absolute;bottom:8px;left:0;right:350px;text-align:center;font-size:13px;opacity:.85;text-shadow:0 1px 3px #000}.pause{position:absolute;top:0;right:0;bottom:0;left:0;background:#0a08198c;display:grid;place-items:center}.pause-box{display:grid;gap:12px;background:var(--panel);border:3px solid var(--ink);border-radius:18px;padding:24px 34px;text-align:center}.pause-box h2{margin:0 0 6px}.lbl{position:absolute;left:0;top:0;text-align:center;white-space:nowrap;will-change:transform}.ln{font-size:13px;font-weight:600;text-shadow:0 1px 2px #000,0 0 3px #000;margin-bottom:2px}.ln b{display:inline-grid;place-items:center;width:18px;height:18px;border-radius:50%;background:var(--ink);color:var(--gold);font-size:11px}.lb{position:relative;width:44px;height:6px;margin:0 auto;background:#0009;border:1px solid #000;border-radius:3px;overflow:hidden}.lb i{position:absolute;inset:0 auto 0 0;background:var(--hp)}.lb em{position:absolute;inset:0 0 0 auto;background:#dcf0ffe6}.k-champ .lb,.k-boss .lb{width:84px;height:10px;border-width:2px}.k-tower .lb,.k-crystal .lb{width:130px;height:16px;border-width:2px}.lb span{position:absolute;top:0;right:0;bottom:0;left:0;display:grid;place-items:center;font-size:11px;font-weight:700;text-shadow:0 1px 2px #000}.k-boss .lb{width:120px}.lbl.ally .lb i{background:var(--ally)}.lbl.foe .lb i{background:var(--hp-foe)}.lbl.immune .lb i{background:#8a8799}.lbl.immune .ln:after{content:" 🛡"}.float{position:absolute;left:0;top:0;font-weight:700;font-size:18px;-webkit-text-stroke:2px var(--ink);paint-order:stroke fill;will-change:transform}.float.big{font-size:24px}.result{position:absolute;top:0;right:0;bottom:0;left:0;display:grid;place-items:center;background:#0a081973}.r-box{width:min(420px,calc(100% - 32px));text-align:center;background:var(--panel);border:3px solid var(--ink);border-radius:22px;padding:26px;animation:pop2 .3s ease-out}@keyframes pop2{0%{transform:scale(.8);opacity:0}}.r-box h1{margin:0;font-size:46px;color:var(--gold);-webkit-text-stroke:2px var(--ink);paint-order:stroke fill}.r-box.lose h1{color:#ff8a9a}.r-stars{font-size:52px;letter-spacing:6px;color:#5a5670}.r-goals{list-style:none;padding:0;margin:8px 0 18px;display:grid;gap:4px;color:#8a8799}.r-goals .on{color:#ffe9a6}.r-btns{display:grid;gap:10px;margin-top:10px}@media (max-width: 760px){.champ-main{width:230px}.skill{width:48px;height:48px}.skill .ico{font-size:22px}.stats{display:none}.portrait{width:64px;height:64px}.side-panel,.minimap{width:200px}.minimap{height:44px}.help{display:none}}.login{background:var(--panel);border:3px solid var(--ink);border-radius:18px;padding:18px}.login label{font-weight:600}.login input,.join input{font:inherit;font-size:18px;padding:10px 12px;border-radius:12px;border:3px solid var(--ink);background:var(--paper);color:var(--ink);min-width:0}.login small{opacity:.75;line-height:1.35}.hello{text-align:center;color:var(--ink);background:var(--paper);border:3px solid var(--ink);border-radius:12px;padding:6px 10px}.hello a{color:#3a6fd8}.chapters{display:flex;gap:8px;margin-top:12px}.chapters button{width:42px;height:42px;padding:0;background:var(--paper)}.chapters button.sel{background:var(--gold)}.chapters button:disabled{background:#8a8799;box-shadow:none;transform:none}.pvp-actions{display:grid;gap:12px;margin-top:16px}.join{display:grid;grid-template-columns:1fr auto;gap:8px}.join input{text-transform:uppercase;letter-spacing:.2em}.err{color:#ffb0b0;font-weight:600}.lobby .code{font-size:46px;letter-spacing:.25em;color:var(--gold)}.slots{display:grid;grid-template-columns:1fr 1fr;gap:10px;margin:8px 0 14px}.slot{display:flex;align-items:center;gap:10px;text-align:left;padding:8px 10px}.slot img{width:52px;height:52px;border-radius:10px;background:radial-gradient(#fff,#b9d8ff);flex:none}.slot div{display:grid;min-width:0}.slot small{font-size:11px;opacity:.7}.slot b{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.slot span{font-size:13px}.slot.t0{background:linear-gradient(#e6f3ff,#b9dcff)}.slot.t1{background:linear-gradient(#f6e8ff,#dcc2ff)}.slot.me{outline:3px solid var(--gold);outline-offset:2px}.slot:disabled{cursor:default;transform:none}.picks.small{display:grid;grid-template-columns:repeat(4,1fr);gap:8px}.picks.small .pick{display:grid;justify-items:center;padding:6px}.picks.small .pick img{width:54px;height:54px}@media (max-width: 760px){.slots{grid-template-columns:1fr}.picks.small{grid-template-columns:repeat(2,1fr)}}.netinfo{font-size:13px;font-weight:600;text-shadow:0 1px 3px #000;opacity:.9}.touch{position:absolute;top:0;right:0;bottom:0;left:0;pointer-events:none;touch-action:none;user-select:none;-webkit-user-select:none}.touch>*,.touch .t-btn,.touch .t-up{pointer-events:auto;touch-action:none}.t-btn{position:absolute;display:grid;place-items:center;padding:0;border-radius:50%;border:3px solid var(--ink);background:radial-gradient(circle at 35% 30%,#fffaf0,#d9cfb8);overflow:hidden;box-shadow:0 4px 0 var(--ink);-webkit-tap-highlight-color:transparent}.t-btn:active{transform:translateY(2px);box-shadow:0 2px 0 var(--ink)}.t-atk{right:22px;bottom:22px;width:96px;height:96px;font-size:40px;background:radial-gradient(circle at 35% 30%,#fff1b8,#ffb300)}.t-skill{position:absolute;width:64px;height:64px}.t-skill .t-btn{top:0;right:0;bottom:0;left:0;width:100%;height:100%;font-size:28px}.t-Q{right:154px;bottom:18px}.t-W{right:128px;bottom:114px}.t-E{right:58px;bottom:154px}.t-R{right:14px;bottom:238px;width:72px;height:72px}.t-R .t-btn{background:radial-gradient(circle at 35% 30%,#f3e2ff,#b57cff)}.t-skill .cd{position:absolute;left:0;right:0;bottom:0;background:#141228b8}.t-skill .cdt{position:absolute;top:0;right:0;bottom:0;left:0;display:grid;place-items:center;font-size:20px;color:#fff;text-shadow:0 2px 2px #000}.t-skill.locked .t-btn{filter:grayscale(1) brightness(.6)}.t-up{display:none;position:absolute;left:50%;top:-24px;transform:translate(-50%);width:32px;height:26px;padding:0;border-radius:9px;font-size:18px;font-weight:800;background:linear-gradient(#bff6ff,#4fc3ff);animation:bob .9s ease-in-out infinite}.t-skill.can .t-up{display:block}.t-pips{position:absolute;left:50%;bottom:-8px;transform:translate(-50%);display:flex;gap:2px}.t-pips i{width:8px;height:4px;border-radius:2px;background:#0000008c}.t-pips i.on{background:var(--gold)}.t-base{left:50%;bottom:10px;transform:translate(-50%);width:58px;height:58px;font-size:22px;line-height:1}.t-base small{font-size:10px;font-weight:700}.t-menu{position:absolute;top:8px;right:196px;width:40px;height:40px;padding:0;border-radius:12px;font-size:18px}.t-cancel{display:none;position:absolute;top:64px;left:50%;transform:translate(-50%);width:56px;height:56px;border-radius:50%;border:3px solid #fff;background:#c8283c8c;color:#fff;font-size:28px;place-items:center}.touch.aiming .t-cancel{display:grid}.t-cancel.hot{background:#ff3c50f2;transform:translate(-50%) scale(1.15)}.t-stick{position:absolute;left:110px;top:calc(100% - 110px);width:120px;height:120px;margin:-60px 0 0 -60px;border-radius:50%;background:#ffffff24;border:3px solid rgba(255,255,255,.45);pointer-events:none}.t-stick.on{background:#ffffff38}.t-knob{position:absolute;left:50%;top:50%;width:54px;height:54px;margin:-27px 0 0 -27px;border-radius:50%;background:#ffffffd9;border:3px solid var(--ink)}.hud.mobile .hud-bottom{left:8px;top:8px;bottom:auto;transform:none;padding:6px 8px;gap:8px;border-radius:14px}.hud.mobile .skills,.hud.mobile .stats,.hud.mobile .help,.hud.mobile .structs,.hud.mobile .champ-name{display:none}.hud.mobile .champ-main{width:150px}.hud.mobile .portrait{width:44px;height:44px;border-width:2px;border-radius:10px}.hud.mobile .lvl{width:24px;height:24px;right:-6px;bottom:-6px;font-size:12px;border-width:2px}.hud.mobile .bar.hp{height:14px}.hud.mobile .side-panel{width:180px;top:8px;right:8px}.hud.mobile .minimap{width:180px;height:auto}.hud.mobile .hud-top{top:6px}.hud.mobile .hint{top:auto;bottom:120px;max-width:46vw;font-size:14px}.hud.mobile .buffs{top:auto;bottom:-16px;left:50px}.rotate{display:none}@media (pointer: coarse) and (orientation: portrait){.rotate{display:grid;position:fixed;top:0;right:0;bottom:0;left:0;z-index:50;place-content:center;text-align:center;gap:12px;background:#1c1a2b;color:#fff;font-size:20px;padding:24px}.rotate b{font-size:54px}}.minimap-box{position:absolute;z-index:3;padding:4px;background:#11101c;border:3px solid var(--ink);border-radius:10px;box-shadow:0 0 0 2px #c9a64a inset,0 6px 18px #00000073;line-height:0}.minimap-box canvas{display:block;border-radius:6px;cursor:crosshair;touch-action:none}.minimap-box.bottom{right:12px;bottom:12px}.minimap-box.top{right:8px;top:8px}.hud.mobile .side-panel{display:none}.hud.mobile .t-menu{right:auto;left:50%;transform:translate(-50%);top:auto;bottom:74px}.hud.mobile .objective{display:none}.reward,.unlock{display:flex;align-items:center;gap:10px;background:#0000004d;border:2px dashed #8a8799;border-radius:14px;padding:6px 10px;margin-bottom:14px}.reward img,.unlock img{width:52px;height:52px;border-radius:10px;background:radial-gradient(#fff,#b9d8ff)}.reward:not(.got) img{filter:brightness(0) opacity(.6)}.reward div,.unlock div{display:grid}.reward small,.unlock small{opacity:.75}.reward.got,.unlock{border:2px solid var(--gold)}.unlock{margin:6px auto 12px;width:fit-content;animation:pop .4s ease-out}.unlock b{color:var(--gold);font-size:20px}