:root{--bg: #0a0a0a;--bg-card: #1e293b;--bg-card-hover: #334155;--text: #f1f5f9;--text-muted: #94a3b8;--text-dim: #64748b;--border: #334155;--primary: #6366f1;--primary-light: #818cf8;--primary-dark: #4f46e5;--danger: #ef4444;--success: #22c55e;--gold: #f59e0b;--radius: 12px}*{box-sizing:border-box;margin:0;padding:0}html,body,#root{width:100%;height:100%;overflow:hidden;background:var(--bg);color:var(--text);font-family:Courier New,Courier,monospace;-webkit-font-smoothing:antialiased;touch-action:none;user-select:none;-webkit-user-select:none}.game-app{width:100%;height:100%;position:relative;overflow:hidden}.game-canvas{position:absolute;top:0;right:0;bottom:0;left:0;width:100%;height:100%;display:block}.menu-screen{position:absolute;top:0;right:0;bottom:0;left:0;display:flex;flex-direction:column;align-items:center;justify-content:center;background:linear-gradient(180deg,#0a0a1a,#0f0f2a,#1a0a2a);overflow:hidden}.menu-bg{position:absolute;top:0;right:0;bottom:0;left:0;background:radial-gradient(circle at 20% 80%,rgba(99,102,241,.1) 0%,transparent 50%),radial-gradient(circle at 80% 20%,rgba(168,85,247,.08) 0%,transparent 50%),radial-gradient(circle at 50% 50%,rgba(239,68,68,.05) 0%,transparent 40%)}.menu-content{position:relative;z-index:2;text-align:center;padding:20px;max-width:400px;width:100%}.menu-logo{margin-bottom:24px}.logo-icon{font-size:64px;display:block;margin-bottom:12px;filter:drop-shadow(0 0 20px rgba(99,102,241,.5));animation:float 3s ease-in-out infinite}@keyframes float{0%,to{transform:translateY(0)}50%{transform:translateY(-10px)}}.game-title{font-size:42px;font-weight:900;letter-spacing:6px;line-height:1.1;background:linear-gradient(135deg,#818cf8,#c084fc,#f472b6);-webkit-background-clip:text;-webkit-text-fill-color:transparent;background-clip:text;text-shadow:none}.game-subtitle{color:var(--text-muted);font-size:13px;margin-top:8px;letter-spacing:2px;text-transform:uppercase}.menu-features{display:flex;flex-wrap:wrap;justify-content:center;gap:8px;margin-bottom:32px}.feature-tag{background:#6366f126;border:1px solid rgba(99,102,241,.3);color:var(--primary-light);padding:6px 14px;border-radius:20px;font-size:11px;font-weight:700;letter-spacing:1px;text-transform:uppercase}.menu-btn{display:flex;align-items:center;justify-content:center;gap:10px;width:100%;padding:16px 24px;border:none;border-radius:var(--radius);font-family:inherit;font-size:16px;font-weight:800;letter-spacing:2px;text-transform:uppercase;cursor:pointer;transition:all .2s;margin-bottom:10px}.menu-btn.primary{background:linear-gradient(135deg,var(--primary),#7c3aed);color:#fff;box-shadow:0 4px 24px #6366f14d}.menu-btn.primary:active{transform:scale(.97)}.menu-btn.secondary{background:var(--bg-card);color:var(--text-muted);border:1px solid var(--border)}.menu-btn.secondary:active{background:var(--bg-card-hover)}.btn-icon{font-size:20px}.menu-controls{margin-top:20px;color:var(--text-dim);font-size:11px;line-height:1.8}.menu-controls strong{color:var(--text-muted)}.hero-select-screen{position:absolute;top:0;right:0;bottom:0;left:0;background:var(--bg);overflow-y:auto;padding:20px;display:flex;flex-direction:column}.back-link{background:none;border:none;color:var(--primary-light);font-family:inherit;font-size:14px;cursor:pointer;padding:4px 0;margin-bottom:8px}.select-title{font-size:22px;font-weight:900;letter-spacing:3px;margin-bottom:16px;text-align:center;color:var(--text)}.hero-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(90px,1fr));gap:8px;margin-bottom:20px}.hero-card{background:var(--bg-card);border:2px solid var(--border);border-radius:var(--radius);padding:10px 6px;display:flex;flex-direction:column;align-items:center;gap:4px;cursor:pointer;transition:all .2s}.hero-card:active{transform:scale(.95)}.hero-card.selected{border-color:var(--primary);background:#6366f11a;box-shadow:0 0 12px #6366f14d}.hero-icon{width:40px;height:40px;border-radius:50%;display:flex;align-items:center;justify-content:center;font-size:18px}.hero-icon.large{width:56px;height:56px;font-size:24px}.hero-name{font-size:11px;font-weight:800;color:var(--text);text-align:center}.hero-title-text{font-size:9px;color:var(--text-dim);text-align:center}.hero-detail{background:var(--bg-card);border:1px solid var(--border);border-radius:var(--radius);padding:16px;flex-shrink:0}.hero-detail-header{display:flex;align-items:center;gap:12px;margin-bottom:12px}.hero-detail-header h3{font-size:18px;font-weight:800}.hero-stats{display:flex;gap:16px;margin-bottom:8px}.stat{display:flex;flex-direction:column;gap:2px}.stat-label{font-size:10px;color:var(--text-dim);text-transform:uppercase;letter-spacing:1px}.stat-val{font-size:16px;font-weight:800;color:var(--gold)}.ability-desc{font-size:12px;color:var(--text-muted);margin-bottom:16px;padding:8px;background:#0000004d;border-radius:6px}.hud{position:absolute;top:0;right:0;bottom:0;left:0;pointer-events:none;z-index:10}.hud-top{display:flex;justify-content:space-between;align-items:flex-start;padding:10px 12px}.hud-left{flex:1}.hud-hp,.hud-xp{position:relative;margin-bottom:4px}.hp-bar-bg,.xp-bar-bg{width:120px;height:12px;background:#0009;border:1px solid var(--border);border-radius:6px;overflow:hidden}.hp-bar-fill{height:100%;background:linear-gradient(90deg,#ef4444,#f87171);border-radius:6px;transition:width .2s}.xp-bar-bg{height:8px;width:100px}.xp-bar-fill{height:100%;background:linear-gradient(90deg,#6366f1,#a78bfa);border-radius:6px;transition:width .2s}.hp-text,.xp-text{position:absolute;top:50%;left:8px;transform:translateY(-50%);font-size:8px;font-weight:800;color:#fff;text-shadow:0 1px 2px rgba(0,0,0,.8)}.hud-center{display:flex;flex-direction:column;align-items:center;gap:4px}.floor-badge{background:#0009;border:1px solid var(--border);padding:4px 12px;border-radius:20px;font-size:11px;font-weight:800;color:var(--text);letter-spacing:1px}.combo-badge{background:linear-gradient(135deg,var(--gold),#f97316);color:#000;padding:2px 10px;border-radius:12px;font-size:10px;font-weight:900;animation:combo-pulse .3s ease}@keyframes combo-pulse{0%{transform:scale(1.3)}to{transform:scale(1)}}.hud-right{display:flex;flex-direction:column;align-items:flex-end;gap:2px}.score-display{font-size:18px;font-weight:900;color:var(--text);text-shadow:0 1px 4px rgba(0,0,0,.8)}.gold-display{font-size:12px;font-weight:700;color:var(--gold)}.hud-bottom{position:absolute;bottom:10px;left:12px;right:12px;display:flex;justify-content:center;align-items:flex-end;gap:12px;pointer-events:none}.weapon-display{display:flex;align-items:center;gap:6px;background:#0009;padding:6px 10px;border-radius:8px;border:1px solid var(--border)}.weapon-dot{width:8px;height:8px;border-radius:50%}.weapon-name{font-size:11px;font-weight:800}.weapon-dmg{font-size:9px;color:var(--text-dim)}.ability-display{position:relative;display:flex;flex-direction:column;align-items:center;gap:2px}.ability-icon{width:44px;height:44px;border-radius:50%;display:flex;align-items:center;justify-content:center;font-size:20px;border:2px solid var(--primary);background:#0009}.ability-icon.cooldown{border-color:var(--text-dim);opacity:.5}.ability-icon.ready{border-color:var(--primary-light);box-shadow:0 0 12px #6366f166;animation:ability-pulse 1.5s ease-in-out infinite}@keyframes ability-pulse{0%,to{box-shadow:0 0 8px #6366f14d}50%{box-shadow:0 0 20px #6366f199}}.ability-cd{font-size:10px;color:var(--text-dim);font-weight:800}.enemy-count{font-size:11px;color:var(--text-muted);background:#0009;padding:6px 10px;border-radius:8px;border:1px solid var(--border);font-weight:700}.ability-btn{position:absolute;bottom:150px;right:50px;width:52px;height:52px;border-radius:50%;border:3px solid var(--primary);background:#000000b3;font-size:22px;display:flex;align-items:center;justify-content:center;cursor:pointer;z-index:20;box-shadow:0 0 16px #6366f166;pointer-events:auto}.ability-btn:active{transform:scale(.9);background:#6366f14d}.touch-controls{position:absolute;top:0;right:0;bottom:0;left:0;pointer-events:none;z-index:5}.joystick-base{position:absolute;bottom:30px;display:flex;flex-direction:column;align-items:center;gap:6px}.joystick-base.left{left:40px}.joystick-base.right{right:40px}.joystick-ring{width:100px;height:100px;border-radius:50%;border:2px solid rgba(99,102,241,.25);background:#6366f10f;display:flex;align-items:center;justify-content:center;position:relative}.joystick-ring:before{content:"";position:absolute;width:40px;height:40px;border-radius:50%;border:2px solid rgba(99,102,241,.2);background:#6366f114}.joystick-ring.aim{border-color:#ef444440;background:#ef44440f}.joystick-ring.aim:before{border-color:#ef444433;background:#ef444414}.joystick-arrow{font-size:24px;color:#6366f159;margin-top:-4px}.joystick-crosshair{font-size:28px;font-weight:300;color:#ef444466;line-height:1}.joystick-label{font-size:9px;color:#fff3;letter-spacing:2px;font-weight:800;text-transform:uppercase}@media(min-width:768px){.touch-controls{display:none}}.gameover-screen{position:absolute;top:0;right:0;bottom:0;left:0;background:#000000d9;display:flex;align-items:center;justify-content:center;z-index:30;-webkit-backdrop-filter:blur(4px);backdrop-filter:blur(4px)}.gameover-content{text-align:center;padding:32px 24px;max-width:360px;width:100%}.gameover-title{font-size:48px;font-weight:900;letter-spacing:8px;color:var(--danger);margin-bottom:8px;text-shadow:0 0 40px rgba(239,68,68,.5)}.gameover-subtitle{color:var(--text-muted);font-size:14px;margin-bottom:24px}.gameover-stats{display:flex;flex-direction:column;gap:8px;margin-bottom:24px}.go-stat{display:flex;justify-content:space-between;padding:10px 16px;background:var(--bg-card);border:1px solid var(--border);border-radius:8px}.go-label{font-size:12px;color:var(--text-muted);font-weight:700}.go-value{font-size:14px;font-weight:900;color:var(--gold)}@media(min-width:768px){.game-title{font-size:56px}.logo-icon{font-size:80px}.hero-grid{grid-template-columns:repeat(5,1fr)}}@media(max-width:400px){.hero-grid{grid-template-columns:repeat(3,1fr)}.game-title{font-size:32px}.hp-bar-bg{width:100px}}::-webkit-scrollbar{width:4px}::-webkit-scrollbar-track{background:transparent}::-webkit-scrollbar-thumb{background:var(--border);border-radius:4px}