:root{--bg: #0c111c;--panel: rgba(16, 22, 36, .92);--panel-edge: #2a3550;--gold: #ffce54;--hp: #46d369;--mana: #4aa3ff;--xp: #b06bff;--good: #5cd6a0;--bad: #ff5d5d;--text: #e6ecf5;--muted: #8a97b2;font-family:system-ui,Segoe UI,Roboto,sans-serif}*{box-sizing:border-box}html,body{margin:0;height:100%;overflow:hidden;background:var(--bg);color:var(--text);-webkit-user-select:none;user-select:none;-webkit-font-smoothing:antialiased}#app{position:fixed;inset:0}#game{position:absolute;inset:0;width:100%;height:100%;display:block;cursor:crosshair}#ui-root{position:absolute;inset:0;pointer-events:none;z-index:10}#ui-root>*{pointer-events:auto}.btn{pointer-events:auto;cursor:pointer;border:1px solid var(--panel-edge);background:linear-gradient(180deg,#1c2740,#131a2c);color:var(--text);border-radius:8px;padding:8px 14px;font-size:13px;font-weight:600;transition:filter .12s,transform .05s}.btn:hover{filter:brightness(1.2)}.btn:active{transform:translateY(1px)}.btn:disabled{opacity:.4;cursor:default;filter:none}.btn.small{padding:3px 9px;font-size:12px}.btn.big{padding:12px 28px;font-size:16px;margin-top:18px}.panel{background:var(--panel);border:1px solid var(--panel-edge);border-radius:12px;box-shadow:0 8px 30px #00000073;backdrop-filter:blur(6px)}.cooldown-overlay{position:absolute;inset:0;display:flex;align-items:center;justify-content:center;font-weight:800;font-size:15px;color:#fff;text-shadow:0 1px 2px #000;pointer-events:none;border-radius:inherit;background:transparent}.overlay{position:absolute;inset:0;display:flex;flex-direction:column;align-items:center;justify-content:center;background:radial-gradient(1200px 700px at 50% 30%,#131d33,#070b13 70%);z-index:20}.select-head{text-align:center;margin-bottom:18px}.select-head h1{margin:0;font-size:40px;letter-spacing:3px;background:linear-gradient(90deg,#ffce54,#ff7a7a,#9b8cff);-webkit-background-clip:text;background-clip:text;color:transparent}.select-head p{color:var(--muted);margin:8px 0 0}.hero-grid{display:grid;grid-template-columns:repeat(3,minmax(260px,320px));gap:14px;max-width:1040px}.hero-card{display:flex;gap:12px;padding:14px;border-radius:12px;background:var(--panel);border:1px solid var(--panel-edge);cursor:pointer;transition:transform .1s,border-color .1s,box-shadow .1s}.hero-card:hover{transform:translateY(-3px);border-color:#4a6098;box-shadow:0 10px 28px #00000080}.hero-emblem{flex:0 0 46px;height:46px;border-radius:10px;display:flex;align-items:center;justify-content:center;font-weight:800;font-size:22px;color:#10131c}.hero-card-title{font-weight:700;font-size:16px}.hero-card-sub{color:var(--muted);font-size:12px;margin:2px 0 6px}.hero-card-blurb{font-size:12.5px;color:#c6d0e0;line-height:1.35}.hero-card-abils{display:flex;flex-wrap:wrap;gap:5px;margin-top:8px}.pill{font-size:10.5px;background:#1a2236;border:1px solid var(--panel-edge);border-radius:6px;padding:2px 6px;color:#b9c4d8}.topbar{position:absolute;top:10px;left:50%;transform:translate(-50%);display:flex;align-items:center;gap:12px;background:var(--panel);border:1px solid var(--panel-edge);border-radius:12px;padding:8px 12px;box-shadow:0 8px 30px #00000073}.wave-block{min-width:280px;text-align:center}.wave-name{font-weight:700;font-size:15px}.wave-name.boss{color:var(--bad);text-shadow:0 0 12px rgba(255,93,93,.5)}.wave-sub{font-size:12px;color:var(--muted)}.call-btn{white-space:nowrap}.versus{position:absolute;top:10px;right:12px;width:250px;padding:10px 12px;display:flex;flex-direction:column;gap:7px;background:var(--panel);border:1px solid var(--panel-edge);border-radius:12px;box-shadow:0 8px 30px #00000073}.gold{display:flex;align-items:center;gap:6px;font-weight:800;font-size:18px;color:var(--gold)}.gold-icon{font-size:15px}.lives-row{display:flex;align-items:center;gap:8px;font-size:11px}.lives-label{width:64px;font-weight:700;letter-spacing:.5px}.lives-label.you{color:#6fd0ff}.lives-label.rival{color:#ff8a8a}.lives-track{flex:1;height:12px;background:#0c1322;border-radius:6px;overflow:hidden;border:1px solid #223}.lives-fill{height:100%;width:100%;border-radius:6px;transition:width .25s}.lives-fill.you{background:linear-gradient(90deg,#2f80ff,#6fd0ff)}.lives-fill.rival{background:linear-gradient(90deg,#b03030,#ff7a7a)}.lives-num{width:30px;text-align:right;font-weight:700}.hero-panel{position:absolute;bottom:8px;left:50%;transform:translate(-50%);display:flex;gap:14px;align-items:flex-end;padding:12px 14px;background:var(--panel);border:1px solid var(--panel-edge);border-radius:14px;box-shadow:0 8px 30px #00000080}.hero-stats{width:220px}.hero-name{font-weight:700;font-size:14px;margin-bottom:6px}.stat-bar{position:relative;height:18px;background:#0c1322;border-radius:6px;overflow:hidden;margin-bottom:5px;border:1px solid #1d2740}.stat-bar.small{height:12px}.stat-fill{height:100%;width:100%;transition:width .12s}.stat-fill.hp{background:linear-gradient(90deg,#2f9e4d,#46d369)}.stat-fill.mana{background:linear-gradient(90deg,#2f6bd0,#4aa3ff)}.stat-text{position:absolute;inset:0;display:flex;align-items:center;justify-content:center;font-size:11px;font-weight:700;text-shadow:0 1px 2px #000}.xp-bar{height:5px;background:#0c1322;border-radius:3px;overflow:hidden;margin-top:2px}.xp-fill{height:100%;background:linear-gradient(90deg,#7d4bd0,#b06bff);transition:width .2s}.skill-note{font-size:11px;color:var(--gold);margin-top:5px;height:14px;opacity:0;transition:opacity .2s}.skill-note.show{opacity:1;animation:pulse 1.2s infinite}@keyframes pulse{50%{opacity:.45}}.hero-actions{display:flex;flex-direction:column;gap:8px}.ability-row,.inv-row{display:flex;gap:7px}.ability{position:relative;width:64px;height:64px;border-radius:10px;background:linear-gradient(160deg,#243150,#161d30);border:1px solid #34406a;cursor:pointer;overflow:hidden;display:flex;flex-direction:column;align-items:center;justify-content:center;transition:border-color .1s,transform .05s}.ability:hover{border-color:#6f86c0}.ability:active{transform:translateY(1px)}.ability.locked{filter:grayscale(.8) brightness(.7)}.ability.nomana{box-shadow:inset 0 0 0 2px #4aa3ff80}.ab-key{position:absolute;top:3px;left:5px;font-size:11px;font-weight:800;color:#cdd8ee}.ab-name{font-size:10px;text-align:center;line-height:1.05;padding:0 3px;margin-top:8px;color:#e6ecf5}.ab-cost{font-size:9.5px;color:#7fb6ff;margin-top:2px}.ab-lvl{position:absolute;bottom:3px;left:0;right:0;text-align:center;font-size:8px;color:#ffce54;letter-spacing:1px}.ab-plus{position:absolute;top:2px;right:3px;width:16px;height:16px;border-radius:5px;background:var(--gold);color:#1a1300;font-weight:900;font-size:13px;line-height:16px;text-align:center;display:none;cursor:pointer}.ab-plus.show{display:block;animation:pulse 1.2s infinite}.item-slot{position:relative;width:48px;height:48px;border-radius:9px;border:1px solid #34406a;background:#11182a;cursor:pointer;overflow:hidden;transition:border-color .1s}.item-slot:hover{border-color:#6f86c0}.item-slot.empty{background:repeating-linear-gradient(45deg,#11182a,#11182a 6px,#0d1422 6px 12px)}.slot-key{position:absolute;top:2px;left:4px;font-size:10px;color:#8a97b2;z-index:2;text-shadow:0 1px 2px #000}.spellbringer{position:absolute;bottom:8px;left:10px;width:168px;padding:10px;background:var(--panel);border:1px solid var(--panel-edge);border-radius:12px;box-shadow:0 8px 30px #00000073}.sb-title{font-weight:800;font-size:12px;letter-spacing:1px;color:#cdb6ff}.sb-sub{font-size:10px;color:var(--muted);margin:6px 0 4px;text-transform:uppercase;letter-spacing:.5px}.sb-sub.disrupt{color:#ff9a8a}.sb-group{display:flex;flex-wrap:wrap;gap:6px}.sb-cell{position:relative;width:48px;height:44px;border-radius:8px;border:1px solid #3a3160;background:linear-gradient(160deg,#2a2350,#171430);cursor:pointer;overflow:hidden;display:flex;flex-direction:column;align-items:center;justify-content:center}.sb-group.disrupt .sb-cell{border-color:#5a2f38;background:linear-gradient(160deg,#41212a,#251217)}.sb-cell:hover{filter:brightness(1.25)}.sb-icon{font-size:16px}.sb-name{font-size:8px;text-align:center;color:#d6c8ff;line-height:1}.shop{position:absolute;top:92px;right:12px;bottom:120px;width:320px;display:flex;flex-direction:column;background:var(--panel);border:1px solid var(--panel-edge);border-radius:12px;box-shadow:0 8px 30px #00000080;transition:transform .2s,opacity .2s}.shop.collapsed{transform:translate(360px);opacity:0;pointer-events:none}.shop-head{display:flex;align-items:center;justify-content:space-between;padding:10px 12px;font-weight:800;letter-spacing:1px;border-bottom:1px solid var(--panel-edge)}.shop-list{overflow-y:auto;padding:8px;display:flex;flex-direction:column;gap:6px}.shop-row{display:flex;align-items:center;gap:9px;padding:7px 8px;border-radius:8px;background:#131b2e;border:1px solid #222d49;cursor:pointer;transition:background .1s}.shop-row:hover{background:#1a2540}.shop-row.disabled{opacity:.45}.shop-swatch{flex:0 0 14px;width:14px;height:30px;border-radius:4px}.shop-info{flex:1;min-width:0}.shop-name{font-size:12.5px;font-weight:700;display:flex;align-items:center;gap:5px}.tag{font-size:8px;font-weight:800;padding:1px 4px;border-radius:4px;background:#3a2f5a;color:#d6c8ff;letter-spacing:.5px}.shop-desc{font-size:10.5px;color:var(--muted);line-height:1.25}.shop-recipe{font-size:9.5px;color:#7fa6d8;margin-top:2px}.shop-price{font-weight:800;color:var(--gold);font-size:13px;white-space:nowrap}.toasts{position:absolute;top:70px;left:50%;transform:translate(-50%);display:flex;flex-direction:column;gap:6px;align-items:center;pointer-events:none}.toast{padding:7px 14px;border-radius:8px;font-size:13px;font-weight:600;background:var(--panel);border:1px solid var(--panel-edge);box-shadow:0 6px 18px #0006;transition:opacity .5s,transform .5s}.toast.info{border-left:3px solid #4aa3ff}.toast.good{border-left:3px solid var(--good)}.toast.warn{border-left:3px solid var(--gold)}.toast.bad{border-left:3px solid var(--bad)}.toast.fade{opacity:0;transform:translateY(-8px)}.help{position:absolute;top:12px;left:12px;font-size:11px;color:var(--muted);max-width:230px;line-height:1.5;pointer-events:none}.end-screen{background:#060a12d1}.end-card{text-align:center;padding:30px 50px;border-radius:16px;background:var(--panel);border:1px solid var(--panel-edge);box-shadow:0 16px 60px #0009}.end-card h1{font-size:46px;margin:0 0 6px;letter-spacing:4px}.end-screen.win h1{color:var(--good);text-shadow:0 0 24px rgba(92,214,160,.4)}.end-screen.lose h1{color:var(--bad);text-shadow:0 0 24px rgba(255,93,93,.4)}.end-reason{color:var(--muted);margin:0 0 18px}.end-stats{display:grid;grid-template-columns:repeat(5,1fr);gap:14px}.end-stat{display:flex;flex-direction:column}.end-stat-v{font-size:22px;font-weight:800;color:var(--text)}.end-stat-l{font-size:11px;color:var(--muted);margin-top:2px}