:root{--primary-color: #00f3ff;--primary-glow: rgba(0, 243, 255, .5);--secondary-color: #ff00ff;--secondary-glow: rgba(255, 0, 255, .5);--success-color: #00ff9d;--danger-color: #ff2a6d;--warning-color: #ffcc00;--bg-color: #050510;--surface-color: rgba(10, 15, 30, .75);--surface-border: rgba(255, 255, 255, .1);--text-main: #ffffff;--text-muted: rgba(255, 255, 255, .6);--font-main: "Inter", system-ui, -apple-system, sans-serif;--font-mono: "JetBrains Mono", monospace;--glass-blur: blur(12px);--border-radius: 12px;--transition-speed: .2s}body{margin:0;padding:0;overflow:hidden;background-color:var(--bg-color);color:var(--text-main);font-family:var(--font-main);-webkit-font-smoothing:antialiased}#app{position:relative;width:100vw;height:100vh;background:radial-gradient(circle at center,#1a1a2e,#000)}canvas{display:block;width:100%;height:100%}#ui,#hud{position:absolute;top:0;left:0;width:100%;height:100%;pointer-events:none}body:not(.in-game) #hud{display:none}#score{position:absolute;top:30px;left:50%;transform:translate(-50%);font-size:32px;font-weight:800;color:var(--text-main);text-shadow:0 0 10px var(--primary-glow);letter-spacing:2px;z-index:10;animation:pulse 2s infinite ease-in-out}#healthBar{position:absolute;bottom:30px;left:30px;width:300px;height:24px;background:#0009;border:1px solid var(--surface-border);border-radius:4px;overflow:hidden;box-shadow:0 0 15px #00000080;transform:skew(-15deg)}#healthFill{width:100%;height:100%;background:linear-gradient(90deg,#ff2a6d,#ff5c8d);box-shadow:0 0 10px var(--danger-color);transition:width .2s cubic-bezier(.4,0,.2,1)}#healthText{position:absolute;top:50%;left:50%;transform:translate(-50%,-50%) skew(15deg);font-size:12px;font-weight:700;color:#fff;text-shadow:1px 1px 2px black;letter-spacing:1px}#xpBar{position:absolute;bottom:30px;right:30px;width:300px;height:12px;background:#0009;border:1px solid var(--surface-border);border-radius:2px;overflow:hidden;transform:skew(-15deg)}#xpFill{width:0%;height:100%;background:linear-gradient(90deg,#00ff9d,#00f3ff);box-shadow:0 0 10px var(--success-color);transition:width .2s}#levelText{position:absolute;bottom:50px;right:30px;font-size:24px;font-weight:800;color:var(--success-color);text-shadow:0 0 10px rgba(0,255,157,.5);font-style:italic;letter-spacing:1px}.modal-container{position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);text-align:center;pointer-events:auto;background:var(--surface-color);padding:3rem;border-radius:var(--border-radius);backdrop-filter:var(--glass-blur);border:1px solid var(--surface-border);box-shadow:0 0 40px #0009,inset 0 0 20px #ffffff0d;z-index:100;min-width:400px;animation:modalFadeIn .4s cubic-bezier(.175,.885,.32,1.275)}#startScreen,#gameOverScreen,#characterSelection,#inGameMenu{position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);text-align:center;pointer-events:auto;background:var(--surface-color);padding:2.5rem;border-radius:var(--border-radius);backdrop-filter:var(--glass-blur);border:1px solid rgba(255,255,255,.1);box-shadow:0 20px 50px #00000080,0 0 0 1px #ffffff0d;z-index:100;min-width:320px;animation:fadeIn .3s ease-out}#inGameMenu{width:80%;max-width:900px;height:80%;display:flex;flex-direction:column}h1{margin:0 0 1.5rem;font-size:3rem;font-weight:900;text-transform:uppercase;letter-spacing:4px;background:linear-gradient(135deg,#fff 0%,var(--primary-color) 100%);-webkit-background-clip:text;-webkit-text-fill-color:transparent;filter:drop-shadow(0 0 10px var(--primary-glow))}h2{color:var(--text-main);font-weight:300;margin-bottom:2rem}h3{color:var(--primary-color);text-transform:uppercase;letter-spacing:2px;border-bottom:2px solid rgba(255,255,255,.1);padding-bottom:.5rem;margin-top:0}button{border:none;border-radius:8px;padding:12px 24px;font-size:16px;font-weight:700;font-family:var(--font-main);text-transform:uppercase;letter-spacing:1px;cursor:pointer;transition:all .2s ease;position:relative;overflow:hidden;background:#ffffff0d;color:var(--primary-color);border:1px solid var(--primary-color);box-shadow:0 0 10px #00f3ff1a;margin:5px}button:hover:not(:disabled){background:var(--primary-color);color:#000;box-shadow:0 0 20px var(--primary-glow);transform:translateY(-2px)}button:active:not(:disabled){transform:translateY(0)}button:disabled{opacity:.5;cursor:not-allowed;border-color:#555;color:#888}#startBtn,#startGameBtn{background:var(--primary-color);color:#000;font-size:1.2rem;padding:16px 48px}#startBtn:hover,#startGameBtn:hover{background:#fff;box-shadow:0 0 30px var(--primary-glow)}#exitBtn{border-color:var(--danger-color);color:var(--danger-color)}#exitBtn:hover{background:var(--danger-color);color:#fff;box-shadow:0 0 20px #ff2a6d80}#shopBtn{border-color:var(--warning-color)!important;color:var(--warning-color)!important;background:transparent!important}#shopBtn:hover{background:var(--warning-color)!important;color:#000!important;box-shadow:0 0 20px #ffcc0080!important}input[type=text]{background:#0000004d;border:1px solid rgba(255,255,255,.2);border-radius:8px;padding:12px 16px;color:#fff;font-family:var(--font-main);font-size:16px;width:100%;box-sizing:border-box;margin-bottom:20px;transition:all .2s}input[type=text]:focus{outline:none;border-color:var(--primary-color);box-shadow:0 0 10px #00f3ff33;background:#00000080}#characterList{display:flex;gap:20px;justify-content:center;flex-wrap:wrap;margin-bottom:30px}.character-card{background:#ffffff08;border:1px solid rgba(255,255,255,.1);border-radius:12px;padding:20px;width:160px;cursor:pointer;transition:all .3s cubic-bezier(.4,0,.2,1);position:relative;overflow:hidden}.character-card:before{content:"";position:absolute;top:0;left:0;width:100%;height:100%;background:linear-gradient(45deg,transparent,rgba(255,255,255,.05),transparent);transform:translate(-100%);transition:.5s}.character-card:hover{transform:translateY(-5px);border-color:var(--primary-color);box-shadow:0 10px 30px #00000080}.character-card:hover:before{transform:translate(100%)}.character-card.selected{border-color:var(--primary-color);background:#00f3ff1a;box-shadow:0 0 20px #00f3ff4d}.character-card h3{color:#fff;margin-bottom:10px;font-size:1.2rem;border:none}.character-card p{color:var(--text-muted);font-size:.9rem;line-height:1.4}.menu-content{display:flex;flex:1;gap:2rem;overflow:hidden;margin-bottom:2rem;text-align:left}.stats-section,.skills-section{flex:1;background:#0000004d;border-radius:8px;padding:1.5rem;overflow-y:auto;border:1px solid rgba(255,255,255,.05)}::-webkit-scrollbar{width:8px}::-webkit-scrollbar-track{background:#0003}::-webkit-scrollbar-thumb{background:#fff3;border-radius:4px}::-webkit-scrollbar-thumb:hover{background:#ffffff4d}ul{list-style:none;padding:0;margin:0}li{padding:12px 0;border-bottom:1px solid rgba(255,255,255,.05);display:flex;justify-content:space-between;align-items:center;color:var(--text-muted)}li span:last-child{color:#fff;font-weight:600}.skill-item{display:flex;align-items:center;gap:15px}.skill-icon{width:40px;height:40px;background:#ffffff1a;border-radius:8px;display:flex;align-items:center;justify-content:center;font-size:20px;color:var(--primary-color)}.skill-info{flex:1}.skill-name{display:block;color:#fff;font-weight:600;margin-bottom:4px}.skill-level{font-size:.8rem;color:var(--primary-color)}@keyframes fadeIn{0%{opacity:0;transform:translate(-50%,-45%)}to{opacity:1;transform:translate(-50%,-50%)}}@keyframes pulse{0%,to{transform:translate(-50%) scale(1)}50%{transform:translate(-50%) scale(1.05)}}.tooltip{position:absolute;background:#0a0f1ef2;color:#fff;padding:10px 16px;border-radius:8px;font-size:14px;pointer-events:none;z-index:1000;white-space:nowrap;border:1px solid var(--primary-color);box-shadow:0 0 15px #00f3ff33;opacity:0;transition:opacity .2s}.tooltip.show{opacity:1}#roomControls{display:flex;gap:15px;justify-content:center;margin-top:20px}#roomInfo{background:#0006;padding:15px;border-radius:8px;border:1px solid rgba(255,255,255,.1);margin-top:20px}