:root{--bg: #0b0b16;--panel: #171728;--text: #f4f1ea;--muted: #a9a6b8;--gold: #ffd34d;--red: #d4141d;font-family:system-ui,-apple-system,Segoe UI,sans-serif;color:var(--text);background:var(--bg)}*{box-sizing:border-box}html,body,#root{margin:0;height:100%}body{background:radial-gradient(circle at 50% 0%,#1d1840 0%,var(--bg) 60%);overflow:hidden}button{font:inherit;color:inherit;cursor:pointer}.screen{height:100%;overflow-y:auto;padding:24px clamp(16px,5vw,64px);display:flex;flex-direction:column;align-items:center;gap:16px}.title{margin:8px 0 0;font-size:clamp(22px,4vw,36px);letter-spacing:.02em}.title.small{font-size:20px;margin-top:12px}.muted{color:var(--muted)}.col{display:flex;flex-direction:column;gap:10px;min-width:min(320px,90vw)}.row-btns{display:flex;gap:12px;flex-wrap:wrap;justify-content:center}.btn{background:var(--panel);border:2px solid #3a3a5c;border-radius:12px;padding:12px 20px;font-weight:700;transition:transform .08s,border-color .12s}.btn:hover:not(:disabled){border-color:var(--gold);transform:translateY(-1px)}.btn:disabled{opacity:.45;cursor:not-allowed}.btn.primary{background:linear-gradient(180deg,#ffd34d,#e8a512);color:#1a1200;border-color:#fff3b0}.btn.big{font-size:20px;padding:14px 30px}.btn.back{align-self:flex-start}.btn em{font-style:normal;color:var(--gold);margin-left:8px}.menu{justify-content:center;text-align:center}.logo h1{margin:6px 0;font-size:clamp(40px,9vw,92px);line-height:.95;color:var(--gold);text-shadow:4px 4px 0 #b3121b,8px 8px 0 #0b0b16;letter-spacing:.02em}.logo small{color:var(--muted);text-transform:uppercase;letter-spacing:.2em}.logo span{color:#ff8a8a;font-weight:700;letter-spacing:.3em;text-transform:uppercase}.disclaimer{max-width:560px;font-size:12px;color:var(--muted)}.char-cards{display:flex;gap:18px;flex-wrap:wrap;justify-content:center}.char-card{width:min(300px,92vw);border:3px solid transparent;border-radius:18px;padding:16px;text-align:center;display:flex;flex-direction:column;align-items:center;gap:4px;box-shadow:0 10px 30px #0008;transition:transform .15s,border-color .15s}.char-card:hover{transform:translateY(-4px)}.char-card.sel{border-color:var(--gold);transform:translateY(-6px) scale(1.02);box-shadow:0 0 0 4px #ffd34d44,0 14px 40px #000a}.char-card h3{margin:4px 0 0;font-size:28px}.char-card .sub{font-weight:700;opacity:.9}.char-card .party{align-self:flex-end;background:#000a;padding:3px 10px;border-radius:999px;font-weight:800}.char-card p{font-size:13px;opacity:.9;margin:6px 0}.char-card ul{list-style:none;padding:0;margin:0;text-align:left;font-size:13px;width:100%}.char-card li{padding:2px 0}.portrait{animation:bob 1.4s ease-in-out infinite;filter:drop-shadow(0 6px 6px #0008)}@keyframes bob{50%{transform:translateY(-6px) rotate(1.5deg)}}.arena-cards{display:flex;gap:12px;flex-wrap:wrap;justify-content:center}.arena-card{width:min(260px,92vw);background:var(--panel);border:3px solid #3a3a5c;border-radius:14px;padding:12px;text-align:left;display:flex;flex-direction:column;gap:4px}.arena-card span{font-size:12px;color:var(--muted)}.arena-card.sel{background:#26264a}.list{width:min(720px,100%);display:flex;flex-direction:column;gap:8px}.list h3{margin:8px 0 0}.row{display:flex;align-items:center;gap:12px;background:var(--panel);border-radius:12px;padding:10px 14px}.row.locked{opacity:.55}.row .icon{font-size:26px}.row .grow,.row input[type=range]{flex:1}.two-col{display:flex;gap:24px;flex-wrap:wrap;justify-content:center;width:100%}.two-col .list{flex:1 1 340px}.result h1{margin:0;text-align:center;font-size:clamp(28px,6vw,56px)}.result.win h1{color:var(--gold)}.result.lose h1{color:#ff6b6b}.stats{display:flex;gap:12px;flex-wrap:wrap;justify-content:center}.stats div{background:var(--panel);border-radius:12px;padding:12px 18px;min-width:100px;text-align:center}.stats b{display:block;font-size:26px}.stats span{font-size:12px;color:var(--muted)}.game-root{position:relative;width:100%;height:100%;overflow:hidden}.game-canvas{position:absolute;top:0;right:0;bottom:0;left:0;touch-action:none}.game-canvas canvas{display:block}.hud{position:absolute;top:0;right:0;bottom:0;left:0;pointer-events:none}.hud button{pointer-events:auto}.hud-top{display:flex;gap:12px;align-items:flex-start;padding:10px 14px}.bars{flex:1;max-width:420px;display:flex;flex-direction:column;gap:4px}.bar{position:relative;height:20px;background:#000a;border:2px solid #000;border-radius:8px;overflow:hidden}.bar i{position:absolute;inset:0 auto 0 0;transition:width .1s linear}.bar span{position:relative;z-index:1;font-size:12px;font-weight:800;text-shadow:0 1px 2px #000;padding-left:8px;line-height:16px}.bar.hp i{background:linear-gradient(180deg,#ff5a63,#b3121b)}.bar.xp{height:16px}.bar.xp i{background:linear-gradient(180deg,#4dd8ff,#1693c4)}.bar.boss{height:16px}.bar.boss i{background:linear-gradient(180deg,#b36bff,#6a1fc4)}.clock{flex:0 0 auto;margin:0 auto;font-size:30px;font-weight:900;text-shadow:0 2px 4px #000;font-variant-numeric:tabular-nums}.right{display:flex;gap:10px;align-items:center}.kills{font-weight:800;text-shadow:0 2px 4px #000}.pause-btn{background:#000a;border:2px solid #fff6;border-radius:10px;width:40px;height:40px;font-weight:900}.boss-bar{position:absolute;top:56px;left:50%;transform:translate(-50%);width:min(520px,80vw);text-align:center;text-shadow:0 2px 4px #000}.banner{position:absolute;top:28%;left:0;right:0;text-align:center;font-size:clamp(26px,5vw,54px);font-weight:900;color:var(--gold);text-shadow:0 4px 0 #b3121b,0 0 20px #000;animation:pop .35s ease-out}@keyframes pop{0%{transform:scale(.6);opacity:0}}.loadout{position:absolute;left:12px;bottom:12px;display:flex;gap:6px;flex-wrap:wrap;max-width:60vw;align-items:center}.slot{position:relative;width:42px;height:42px;background:#000b;border:2px solid #fff4;border-radius:10px;display:grid;place-items:center;font-size:22px}.slot.passive{border-color:#4dd8ff66}.slot small{position:absolute;right:3px;bottom:0;font-size:11px;font-weight:900}.sep{width:8px}.special-btn{position:absolute;right:14px;bottom:14px;width:110px;height:110px;border-radius:50%;background:#000b;border:3px solid #fff5;overflow:hidden;display:flex;flex-direction:column;align-items:center;justify-content:center;text-align:center;padding:8px}.special-btn .fill{position:absolute;left:0;right:0;bottom:0;background:#ffd34d44}.special-btn b,.special-btn small{position:relative}.special-btn b{font-size:12px;line-height:1.1}.special-btn small{font-size:10px;color:var(--muted)}.special-btn.ready{border-color:var(--gold);box-shadow:0 0 18px #ffd34d88;animation:pulse 1s infinite}@keyframes pulse{50%{transform:scale(1.06)}}.overlay{position:absolute;top:0;right:0;bottom:0;left:0;background:#000b;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:22px;pointer-events:auto;padding:16px;overflow-y:auto}.overlay h2{margin:0;font-size:clamp(24px,4vw,40px);color:var(--gold);text-align:center}.cards{display:flex;gap:16px;flex-wrap:wrap;justify-content:center}.ucard{position:relative;width:min(240px,85vw);min-height:290px;background:var(--panel);border:4px solid #777;border-radius:16px;padding:18px 14px;display:flex;flex-direction:column;align-items:center;gap:8px;text-align:center;transition:transform .12s}.ucard:hover{transform:translateY(-6px) scale(1.03)}.ucard .icon{font-size:56px}.ucard p{margin:0;font-size:13px;color:var(--muted)}.ucard em{font-style:normal;font-size:12px;color:var(--gold);margin-top:auto}.ucard .key{position:absolute;top:8px;left:10px;font-weight:900;opacity:.7}.ucard .rar{font-size:11px;font-weight:900;text-transform:uppercase;letter-spacing:.1em}.r-comum{border-color:#8a8a96}.r-incomum{border-color:#3fbf5f}.r-incomum .rar{color:#3fbf5f}.r-rara{border-color:#3d8bff}.r-rara .rar{color:#3d8bff}.r-epica{border-color:#a24bff}.r-epica .rar{color:#a24bff}.r-lendaria{border-color:#ffd34d;box-shadow:0 0 22px #ffd34d88}.r-lendaria .rar{color:#ffd34d}@media(max-width:640px){.clock{font-size:22px}.special-btn{width:92px;height:92px}.ucard{min-height:0;flex-direction:row;text-align:left;width:94vw}.ucard .icon{font-size:36px}.cards{gap:8px}}