:root{--bg-primary: #0a0a0f;--bg-secondary: #12121a;--bg-panel: rgba(20, 20, 35, .95);--bg-panel-hover: rgba(30, 30, 50, .98);--neon-cyan: #00f5ff;--neon-magenta: #ff00ff;--neon-yellow: #ffff00;--neon-green: #00ff88;--neon-orange: #ff6600;--neon-purple: #8b5cf6;--perfect-color: #00f5ff;--good-color: #00ff88;--miss-color: #ff3366;--dodge-color: #ffff00;--hp-full: #00ff88;--hp-mid: #ffff00;--hp-low: #ff3366;--text-primary: #ffffff;--text-secondary: rgba(255, 255, 255, .6);--border-glow: rgba(0, 245, 255, .3);--transition-fast: .1s;--transition-normal: .2s;--transition-slow: .4s;--transition-bounce: cubic-bezier(.34, 1.56, .64, 1);--transition-smooth: cubic-bezier(.4, 0, .2, 1);--transition-snap: cubic-bezier(.68, -.6, .32, 1.6)}*,*:before,*:after{margin:0;padding:0;box-sizing:border-box}html,body{width:100%;height:100%;overflow:hidden;background-color:var(--bg-primary);font-family:Segoe UI,Arial,sans-serif;color:var(--text-primary);touch-action:manipulation;-webkit-touch-callout:none;-webkit-user-select:none;user-select:none;-webkit-tap-highlight-color:transparent}#game-container{position:relative;width:100%;height:100%;max-width:500px;margin:0 auto;background:linear-gradient(180deg,var(--bg-primary) 0%,var(--bg-secondary) 100%)}#game-canvas{position:absolute;top:0;left:0;width:100%;height:100%;z-index:1}#combat-ui{position:absolute;top:0;left:0;width:100%;height:100%;z-index:10;pointer-events:none}#combat-ui>*{pointer-events:auto}#player-stats{position:absolute;bottom:180px;left:15px;background:var(--bg-panel);padding:12px 15px;border-radius:10px;border:1px solid var(--border-glow);min-width:140px}.stat-name{font-size:.9rem;font-weight:700;letter-spacing:2px;margin-bottom:8px;color:var(--neon-cyan)}.hp-bar-container{display:flex;align-items:center;gap:8px;margin-bottom:8px}.hp-bar{flex:1;height:14px;background:#0009;border-radius:7px;overflow:hidden;border:1px solid rgba(255,255,255,.2);position:relative;box-shadow:inset 0 2px 4px #00000080}.hp-bar:after{content:"";position:absolute;top:1px;left:2px;right:2px;height:4px;background:linear-gradient(180deg,rgba(255,255,255,.2) 0%,transparent 100%);border-radius:4px;pointer-events:none}.hp-fill{height:100%;background:linear-gradient(180deg,#44ffaa 0%,var(--hp-full) 50%,#00cc66 100%);transition:width .4s var(--transition-smooth);border-radius:6px;position:relative;box-shadow:0 0 10px #00ff8880,inset 0 1px #ffffff4d}.hp-fill:after{content:"";position:absolute;top:0;left:0;right:0;height:50%;background:linear-gradient(180deg,rgba(255,255,255,.3) 0%,transparent 100%);border-radius:6px 6px 0 0}.hp-fill.critical{background:linear-gradient(180deg,#ff6666 0%,var(--hp-low) 50%,#cc0033 100%);animation:criticalPulse .4s ease-in-out infinite;box-shadow:0 0 15px #ff3366b3,inset 0 1px #ffffff4d}@keyframes criticalPulse{0%,to{opacity:1;box-shadow:0 0 15px #ff3366b3,inset 0 1px #ffffff4d}50%{opacity:.7;box-shadow:0 0 25px #ff3366e6,inset 0 1px #ffffff4d}}.hp-fill.enemy{background:linear-gradient(180deg,#a78bfa 0%,var(--neon-purple) 50%,#6d28d9 100%);box-shadow:0 0 10px #8b5cf680,inset 0 1px #ffffff4d}.hp-text{font-size:.75rem;font-weight:600;min-width:55px;text-align:right}.ap-container{display:flex;gap:8px;margin-top:8px}.ap-orb{width:22px;height:22px;border-radius:50%;background:#0009;border:2px solid rgba(0,245,255,.4);transition:all .3s var(--transition-bounce);position:relative}.ap-orb:before{content:"";position:absolute;top:50%;left:50%;width:60%;height:60%;background:transparent;border-radius:50%;transform:translate(-50%,-50%);transition:all .3s var(--transition-bounce)}.ap-orb.filled{background:radial-gradient(circle at 30% 30%,#88ffff,var(--neon-cyan));border-color:var(--neon-cyan);box-shadow:0 0 12px var(--neon-cyan),0 0 24px #00f5ff66,inset 0 -2px 4px #0000004d,inset 0 2px 4px #ffffff4d;animation:apOrbGlow 1.5s ease-in-out infinite}.ap-orb.filled:before{background:#fff6;width:40%;height:40%;top:25%;left:25%;transform:none}.ap-orb.just-gained{animation:apOrbGain .5s var(--transition-snap)}@keyframes apOrbGlow{0%,to{box-shadow:0 0 12px var(--neon-cyan),0 0 24px #00f5ff66}50%{box-shadow:0 0 18px var(--neon-cyan),0 0 36px #00f5ff99}}@keyframes apOrbGain{0%{transform:scale(.5);opacity:0}50%{transform:scale(1.4)}70%{transform:scale(.9)}to{transform:scale(1);opacity:1}}#enemy-stats{position:absolute;top:15px;right:15px;background:var(--bg-panel);padding:12px 15px;border-radius:10px;border:1px solid rgba(139,92,246,.3);min-width:140px}#enemy-stats .stat-name{color:var(--neon-purple)}#turn-indicator{position:absolute;top:50%;left:50%;transform:translate(-50%,-150%);text-align:center;pointer-events:none;z-index:60}#turn-indicator.hidden{animation:turnFadeOut .3s ease-out forwards}#turn-indicator:not(.hidden){animation:turnFadeIn .4s var(--transition-bounce) forwards}@keyframes turnFadeIn{0%{opacity:0;transform:translate(-50%,-150%) scale(.7);filter:blur(10px)}60%{transform:translate(-50%,-150%) scale(1.1)}to{opacity:1;transform:translate(-50%,-150%) scale(1);filter:blur(0)}}@keyframes turnFadeOut{0%{opacity:1;transform:translate(-50%,-150%) scale(1)}to{opacity:0;transform:translate(-50%,-150%) scale(.8)}}#turn-text{font-size:1.6rem;font-weight:800;letter-spacing:5px;color:var(--neon-cyan);text-shadow:0 0 20px var(--neon-cyan),0 0 40px rgba(0,245,255,.4);animation:turnPulse 1.2s ease-in-out infinite;position:relative}#turn-text:before{content:"";position:absolute;top:50%;left:50%;width:200%;height:200%;background:radial-gradient(circle,rgba(0,245,255,.15) 0%,transparent 70%);transform:translate(-50%,-50%);animation:turnGlow 1.2s ease-in-out infinite;z-index:-1}#turn-text.enemy-turn{color:var(--miss-color);text-shadow:0 0 20px var(--miss-color),0 0 40px rgba(255,51,102,.4);animation:turnPulseEnemy .8s ease-in-out infinite}#turn-text.enemy-turn:before{background:radial-gradient(circle,rgba(255,51,102,.15) 0%,transparent 70%);animation:turnGlow .8s ease-in-out infinite}@keyframes turnPulse{0%,to{opacity:1;transform:scale(1)}50%{opacity:.85;transform:scale(1.06)}}@keyframes turnPulseEnemy{0%,to{opacity:1;transform:scale(1)}50%{opacity:.9;transform:scale(1.08)}}@keyframes turnGlow{0%,to{opacity:.5;transform:translate(-50%,-50%) scale(1)}50%{opacity:1;transform:translate(-50%,-50%) scale(1.1)}}#action-menu{position:absolute;bottom:20px;left:50%;transform:translate(-50%);width:calc(100% - 30px);max-width:400px;opacity:0;animation:slideUpFadeIn .4s var(--transition-bounce) forwards}#action-menu.hidden{animation:slideDownFadeOut .3s var(--transition-smooth) forwards}@keyframes slideUpFadeIn{0%{opacity:0;transform:translate(-50%) translateY(30px)}to{opacity:1;transform:translate(-50%) translateY(0)}}@keyframes slideDownFadeOut{0%{opacity:1;transform:translate(-50%) translateY(0)}to{opacity:0;transform:translate(-50%) translateY(20px)}}.action-buttons{display:flex;flex-direction:column;gap:10px}.action-btn{display:flex;justify-content:space-between;align-items:center;padding:16px 22px;background:var(--bg-panel);border:2px solid var(--neon-cyan);border-radius:12px;color:var(--text-primary);font-size:1rem;font-weight:600;cursor:pointer;transition:all .2s var(--transition-smooth);position:relative;overflow:hidden;box-shadow:0 4px 15px #0000004d,inset 0 1px #ffffff1a}.action-btn:before{content:"";position:absolute;top:0;left:-100%;width:100%;height:100%;background:linear-gradient(90deg,transparent,rgba(0,245,255,.2),transparent);transition:left .5s ease}.action-btn:hover:before,.action-btn:focus:before{left:100%}.action-btn:after{content:"";position:absolute;top:50%;left:50%;width:0;height:0;background:#00f5ff4d;border-radius:50%;transform:translate(-50%,-50%);transition:width .4s ease,height .4s ease}.action-btn:active:after{width:300px;height:300px}.action-btn:hover,.action-btn:focus{background:var(--bg-panel-hover);border-color:var(--neon-cyan);box-shadow:0 6px 25px #00f5ff40,0 0 30px #00f5ff26,inset 0 1px #ffffff26;transform:translateY(-2px)}.action-btn:active{transform:scale(.97) translateY(0);background:#00f5ff40;box-shadow:0 2px 10px #00f5ff4d,inset 0 2px 4px #0003}.action-btn:disabled{opacity:.35;border-color:#ffffff26;cursor:not-allowed;transform:none;box-shadow:none}.action-btn:disabled:before,.action-btn:disabled:after{display:none}.skill-name{letter-spacing:1px;position:relative;z-index:1}.skill-cost{font-size:.85rem;color:var(--neon-cyan);position:relative;z-index:1;padding:4px 10px;background:#00f5ff1a;border-radius:20px;transition:all .2s ease}.action-btn:hover .skill-cost{background:#00f5ff33;box-shadow:0 0 10px #00f5ff4d}#defense-zone{position:absolute;top:0;left:0;width:100%;height:100%;display:flex;z-index:50}.defense-half{flex:1;display:flex;align-items:center;justify-content:center;cursor:pointer;transition:background .1s ease}.parry-zone{background:#00f5ff1a;border-right:2px solid rgba(0,245,255,.3)}.dodge-zone{background:#ffff001a;border-left:2px solid rgba(255,255,0,.3)}.parry-zone:active,.parry-zone.flash{background:#00f5ff66}.dodge-zone:active,.dodge-zone.flash{background:#ff06}.zone-content{display:flex;flex-direction:column;align-items:center;gap:10px;pointer-events:none}.zone-icon{font-size:4rem}.zone-label{font-size:1.5rem;font-weight:800;letter-spacing:4px}.parry-zone .zone-label{color:var(--neon-cyan);text-shadow:0 0 20px var(--neon-cyan)}.dodge-zone .zone-label{color:var(--dodge-color);text-shadow:0 0 20px var(--dodge-color)}.zone-hint{font-size:.85rem;color:var(--text-secondary);letter-spacing:1px}.defense-fullscreen{width:100%;height:100%;display:flex;align-items:center;justify-content:center;cursor:pointer;background:radial-gradient(circle at center,rgba(0,200,255,.15) 0%,rgba(0,200,255,.05) 50%,transparent 100%);border:3px solid rgba(0,200,255,.3);transition:all .15s ease;position:relative;overflow:hidden}.defense-fullscreen:before{content:"";position:absolute;top:50%;left:50%;width:0;height:0;background:radial-gradient(circle,rgba(0,245,255,.6) 0%,transparent 70%);border-radius:50%;transform:translate(-50%,-50%);transition:width .3s ease-out,height .3s ease-out;pointer-events:none}.defense-fullscreen:active:before,.defense-fullscreen.flash:before{width:150vw;height:150vw}.defense-fullscreen:active,.defense-fullscreen.flash{background:radial-gradient(circle at center,rgba(0,245,255,.4) 0%,rgba(0,200,255,.2) 50%,transparent 100%);border-color:#00f5ffcc}.defense-fullscreen .zone-label{color:var(--neon-cyan);text-shadow:0 0 20px var(--neon-cyan),0 0 40px rgba(0,245,255,.5);animation:defendPulse .6s ease-in-out infinite}@keyframes defendPulse{0%,to{transform:scale(1);text-shadow:0 0 20px var(--neon-cyan),0 0 40px rgba(0,245,255,.5)}50%{transform:scale(1.05);text-shadow:0 0 30px var(--neon-cyan),0 0 60px rgba(0,245,255,.7)}}.zone-icon{font-size:4rem;animation:iconBounce .8s ease-in-out infinite}@keyframes iconBounce{0%,to{transform:translateY(0) scale(1)}50%{transform:translateY(-8px) scale(1.1)}}.zone-hint{font-size:.9rem;color:var(--text-secondary);letter-spacing:1px;animation:hintPulse 1.5s ease-in-out infinite}@keyframes hintPulse{0%,to{opacity:.6}50%{opacity:1}}#qte-zone{position:absolute;top:0;left:0;width:100%;height:100%;display:flex;align-items:center;justify-content:center;background:radial-gradient(circle at center,rgba(0,255,136,.15) 0%,rgba(0,255,136,.05) 50%,transparent 100%);cursor:pointer;z-index:50;transition:all .15s ease;position:relative;overflow:hidden}#qte-zone:before{content:"";position:absolute;top:50%;left:50%;width:0;height:0;background:radial-gradient(circle,rgba(0,255,136,.6) 0%,transparent 70%);border-radius:50%;transform:translate(-50%,-50%);transition:width .3s ease-out,height .3s ease-out;pointer-events:none}#qte-zone:active:before,#qte-zone.flash:before{width:150vw;height:150vw}#qte-zone:active,#qte-zone.flash{background:radial-gradient(circle at center,rgba(0,255,136,.4) 0%,rgba(0,255,136,.2) 50%,transparent 100%)}.qte-content{display:flex;flex-direction:column;align-items:center;gap:25px;pointer-events:none;animation:qteContentIn .3s var(--transition-bounce)}@keyframes qteContentIn{0%{opacity:0;transform:scale(.8) translateY(20px)}to{opacity:1;transform:scale(1) translateY(0)}}#qte-canvas{background:#0009;border-radius:15px;border:3px solid var(--neon-green);box-shadow:0 0 20px #00ff884d,0 0 40px #00ff8826,inset 0 0 30px #00ff881a}.qte-instruction{font-size:2rem;font-weight:900;letter-spacing:6px;color:var(--neon-green);text-shadow:0 0 20px var(--neon-green),0 0 40px rgba(0,255,136,.5);animation:qteGlow .4s ease-in-out infinite}@keyframes qteGlow{0%,to{opacity:1;transform:scale(1)}50%{opacity:.8;transform:scale(1.05)}}#defense-result{position:absolute;top:45%;left:50%;transform:translate(-50%,-50%);font-size:2.5rem;font-weight:900;letter-spacing:6px;text-align:center;pointer-events:none;z-index:100}.defense-popup{animation:popupJuicy .7s var(--transition-snap) forwards}.defense-popup.perfect{color:var(--perfect-color);text-shadow:0 0 20px var(--perfect-color),0 0 40px var(--perfect-color),0 0 60px rgba(0,245,255,.5),0 0 80px rgba(0,245,255,.3);animation:popupPerfect .8s var(--transition-snap) forwards}.defense-popup.good{color:var(--good-color);text-shadow:0 0 20px var(--good-color),0 0 40px var(--good-color),0 0 60px rgba(0,255,136,.4)}.defense-popup.dodge{color:var(--dodge-color);text-shadow:0 0 20px var(--dodge-color),0 0 40px var(--dodge-color),0 0 60px rgba(255,255,0,.4)}.defense-popup.miss{color:var(--miss-color);text-shadow:0 0 20px var(--miss-color),0 0 40px var(--miss-color);animation:popupMiss .6s ease-out forwards}@keyframes popupJuicy{0%{opacity:0;transform:translate(-50%,-50%) scale(.3) rotate(-5deg);filter:blur(10px)}30%{opacity:1;transform:translate(-50%,-50%) scale(1.3) rotate(2deg);filter:blur(0)}50%{transform:translate(-50%,-50%) scale(.95) rotate(-1deg)}70%{transform:translate(-50%,-55%) scale(1.05) rotate(0)}to{opacity:0;transform:translate(-50%,-80%) scale(1);filter:blur(2px)}}@keyframes popupPerfect{0%{opacity:0;transform:translate(-50%,-50%) scale(.2) rotate(-10deg);filter:blur(15px) brightness(3)}20%{opacity:1;transform:translate(-50%,-50%) scale(1.5) rotate(3deg);filter:blur(0) brightness(1.5)}40%{transform:translate(-50%,-50%) scale(.9) rotate(-2deg);filter:brightness(1)}60%{transform:translate(-50%,-55%) scale(1.1) rotate(1deg)}80%{transform:translate(-50%,-65%) scale(1);opacity:1}to{opacity:0;transform:translate(-50%,-100%) scale(.9);filter:blur(3px)}}@keyframes popupMiss{0%{opacity:0;transform:translate(-50%,-50%) scale(.5)}20%{opacity:1;transform:translate(-50%,-50%) scale(1.1)}30%,50%,70%{transform:translate(-45%,-50%) scale(1)}40%,60%{transform:translate(-55%,-50%) scale(1)}to{opacity:0;transform:translate(-50%,-60%) scale(.9)}}#result-display{position:absolute;top:0;left:0;width:100%;height:100%;display:flex;flex-direction:column;justify-content:center;align-items:center;gap:40px;background:#0000;z-index:100;animation:resultBgFade .8s ease-out forwards}@keyframes resultBgFade{0%{background:#0000}to{background:#000000d9}}#result-display.hidden{animation:resultBgFadeOut .3s ease-out forwards}@keyframes resultBgFadeOut{0%{background:#000000d9;opacity:1}to{background:#0000;opacity:0}}.result-text{font-size:3.5rem;font-weight:900;letter-spacing:10px;opacity:0;animation:resultTextIn .8s .3s var(--transition-bounce) forwards}@keyframes resultTextIn{0%{opacity:0;transform:scale(.3) translateY(50px);filter:blur(20px)}60%{transform:scale(1.1) translateY(-10px);filter:blur(0)}to{opacity:1;transform:scale(1) translateY(0)}}.result-text.victory{color:var(--neon-cyan);text-shadow:0 0 30px var(--neon-cyan),0 0 60px var(--neon-cyan),0 0 90px rgba(0,245,255,.5);animation:resultTextIn .8s .3s var(--transition-bounce) forwards,victoryShine 2s 1.1s ease-in-out infinite}.result-text.defeat{color:var(--miss-color);text-shadow:0 0 30px var(--miss-color),0 0 60px rgba(255,51,102,.5)}@keyframes victoryShine{0%,to{transform:scale(1);filter:brightness(1)}50%{transform:scale(1.03);filter:brightness(1.2)}}.result-btn{padding:18px 50px;font-size:1.2rem;font-weight:700;letter-spacing:3px;background:var(--bg-panel);border:2px solid var(--neon-cyan);border-radius:40px;color:var(--text-primary);cursor:pointer;transition:all .2s var(--transition-smooth);box-shadow:0 0 20px #00f5ff4d,0 0 40px #00f5ff26;opacity:0;animation:resultBtnIn .5s .8s ease-out forwards;position:relative;overflow:hidden}@keyframes resultBtnIn{0%{opacity:0;transform:translateY(30px)}to{opacity:1;transform:translateY(0)}}.result-btn:before{content:"";position:absolute;top:-50%;left:-50%;width:200%;height:200%;background:linear-gradient(45deg,transparent 40%,rgba(255,255,255,.1) 50%,transparent 60%);animation:btnShine 3s ease-in-out infinite}@keyframes btnShine{0%,to{transform:translate(-100%)}50%{transform:translate(100%)}}.result-btn:hover{transform:translateY(-3px);box-shadow:0 0 30px #00f5ff80,0 0 60px #00f5ff40;background:#00f5ff26}.result-btn:active{transform:scale(.96) translateY(0);background:#00f5ff40}#start-screen{position:absolute;top:0;left:0;width:100%;height:100%;display:flex;flex-direction:column;justify-content:center;align-items:center;background:radial-gradient(ellipse at center,var(--bg-secondary) 0%,var(--bg-primary) 100%);z-index:200;transition:opacity var(--transition-slow),visibility var(--transition-slow)}#start-screen.hidden{opacity:0;visibility:hidden;pointer-events:none}#start-screen h1{font-size:2rem;font-weight:800;letter-spacing:6px;margin-bottom:.5rem;background:linear-gradient(90deg,var(--neon-cyan),var(--neon-magenta));-webkit-background-clip:text;-webkit-text-fill-color:transparent;background-clip:text;animation:titleGlow 2s ease-in-out infinite;text-align:center}@keyframes titleGlow{0%,to{filter:brightness(1)}50%{filter:brightness(1.3)}}#start-screen .subtitle{font-size:.85rem;color:var(--text-secondary);letter-spacing:3px;margin-bottom:3rem}#start-button{padding:1rem 2.5rem;font-size:1.1rem;font-weight:600;letter-spacing:3px;color:var(--bg-primary);background:linear-gradient(90deg,var(--neon-cyan),var(--neon-green));border:none;border-radius:50px;cursor:pointer;transition:transform var(--transition-fast),box-shadow var(--transition-fast);box-shadow:0 0 20px #00f5ff66,0 0 40px #00f5ff33}#start-button:active{transform:scale(.95)}#start-screen .hint{margin-top:2rem;font-size:.75rem;color:var(--text-secondary);opacity:.6;text-align:center;padding:0 20px}.hidden{display:none!important}#level-select{position:absolute;top:0;left:0;width:100%;height:100%;display:flex;align-items:center;justify-content:center;background:#000000e6;z-index:150;animation:fadeIn .3s ease-out}@keyframes fadeIn{0%{opacity:0}to{opacity:1}}.level-select-panel{width:calc(100% - 30px);max-width:400px;max-height:calc(100% - 40px);background:var(--bg-panel);border-radius:16px;border:2px solid var(--border-glow);padding:20px;display:flex;flex-direction:column;gap:15px;overflow:hidden;animation:slideUp .4s var(--transition-bounce)}@keyframes slideUp{0%{opacity:0;transform:translateY(30px)}to{opacity:1;transform:translateY(0)}}.level-header{display:flex;justify-content:space-between;align-items:center;padding-bottom:10px;border-bottom:1px solid rgba(255,255,255,.1)}.level-header h2{font-size:1.2rem;font-weight:700;letter-spacing:2px;color:var(--neon-cyan);text-shadow:0 0 10px rgba(0,245,255,.5)}.player-status{display:flex;gap:15px}.status-hp,.status-gold{display:flex;align-items:center;gap:5px;font-size:.9rem;font-weight:600}.status-icon{font-size:1rem}.level-list{display:flex;flex-direction:column;gap:10px;overflow-y:auto;max-height:350px;padding-right:5px}.level-list::-webkit-scrollbar{width:6px}.level-list::-webkit-scrollbar-track{background:#0000004d;border-radius:3px}.level-list::-webkit-scrollbar-thumb{background:var(--neon-cyan);border-radius:3px}.level-btn{display:flex;justify-content:space-between;align-items:center;padding:15px;background:#0006;border:2px solid rgba(0,245,255,.3);border-radius:12px;cursor:pointer;transition:all .2s var(--transition-smooth)}.level-btn:hover:not(.locked){background:#00f5ff1a;border-color:var(--neon-cyan);transform:translate(5px);box-shadow:0 0 20px #00f5ff33}.level-btn:active:not(.locked){transform:scale(.98)}.level-btn.locked{opacity:.4;cursor:not-allowed;border-color:#ffffff1a}.level-info{display:flex;flex-direction:column;gap:4px;text-align:left}.level-name{font-size:1rem;font-weight:700;color:var(--text-primary)}.level-desc{font-size:.8rem;color:var(--text-secondary)}.level-reward{display:flex;flex-direction:column;align-items:flex-end;gap:4px}.level-enemy{font-size:.85rem;color:var(--neon-purple)}.level-gold{font-size:.9rem;color:gold;font-weight:600}.level-actions{padding-top:10px;border-top:1px solid rgba(255,255,255,.1)}.level-shop-btn{width:100%;padding:12px;font-size:1rem;font-weight:600;background:#ffd7001a;border:2px solid rgba(255,215,0,.4);border-radius:10px;color:gold;cursor:pointer;transition:all .2s ease}.level-shop-btn:hover{background:#ffd70033;border-color:gold;box-shadow:0 0 15px #ffd7004d}#shop-screen{position:absolute;top:0;left:0;width:100%;height:100%;display:flex;align-items:center;justify-content:center;background:#000000e6;z-index:160;animation:fadeIn .3s ease-out}.shop-panel{width:calc(100% - 30px);max-width:400px;max-height:calc(100% - 40px);background:var(--bg-panel);border-radius:16px;border:2px solid rgba(255,215,0,.3);padding:20px;display:flex;flex-direction:column;gap:15px;overflow:hidden;animation:slideUp .4s var(--transition-bounce)}.shop-header{display:flex;justify-content:space-between;align-items:center;padding-bottom:10px;border-bottom:1px solid rgba(255,255,255,.1)}.shop-header h2{font-size:1.3rem;font-weight:700;letter-spacing:2px;color:gold;text-shadow:0 0 10px rgba(255,215,0,.5)}.shop-gold{display:flex;align-items:center;gap:8px;font-size:1.1rem;font-weight:700;color:gold}.gold-icon{font-size:1.2rem}.shop-player-hp{display:flex;align-items:center;gap:10px;padding:10px;background:#0000004d;border-radius:8px}.hp-label{font-weight:600;color:var(--text-secondary)}.hp-bar-mini{flex:1;height:12px;background:#00000080;border-radius:6px;overflow:hidden}.hp-fill-mini{height:100%;background:linear-gradient(90deg,var(--hp-full),#66ffaa);border-radius:6px;transition:width .3s ease}.hp-fill-mini.critical{background:linear-gradient(90deg,var(--hp-low),#ff6666);animation:criticalPulse .5s ease-in-out infinite}.hp-text-mini{font-size:.85rem;font-weight:600;min-width:60px;text-align:right}.shop-sections{display:flex;flex-direction:column;gap:15px;overflow-y:auto;max-height:300px}.shop-section h3{font-size:.9rem;font-weight:600;letter-spacing:1px;color:var(--text-secondary);margin-bottom:8px}.shop-items{display:flex;flex-direction:column;gap:8px}.shop-item{display:flex;align-items:center;gap:12px;padding:12px;background:#0000004d;border:1px solid rgba(255,255,255,.1);border-radius:10px;transition:all .2s ease}.shop-item:hover:not(.disabled){background:#ffd7000d;border-color:#ffd7004d}.shop-item.disabled{opacity:.4}.item-icon{font-size:1.8rem;width:40px;text-align:center}.item-info{flex:1;display:flex;flex-direction:column;gap:2px}.item-name{font-size:.95rem;font-weight:600;color:var(--text-primary)}.item-desc{font-size:.75rem;color:var(--text-secondary)}.item-actions{display:flex;flex-direction:column;align-items:flex-end;gap:6px}.item-cost{font-size:.85rem;color:gold;font-weight:600}.item-quantity{font-size:.85rem;color:var(--neon-cyan);font-weight:600}.buy-btn,.use-btn{padding:6px 14px;font-size:.8rem;font-weight:600;border-radius:6px;cursor:pointer;transition:all .2s ease}.buy-btn{background:#ffd70033;border:1px solid #ffd700;color:gold}.buy-btn:hover:not(:disabled){background:#ffd7004d;box-shadow:0 0 10px #ffd7004d}.buy-btn:disabled{opacity:.3;cursor:not-allowed}.use-btn{background:#0f83;border:1px solid var(--neon-green);color:var(--neon-green)}.use-btn:hover:not(:disabled){background:#00ff884d;box-shadow:0 0 10px #00ff884d}.use-btn:disabled{opacity:.3;cursor:not-allowed}.empty-inventory{text-align:center;padding:20px;color:var(--text-secondary);font-style:italic}.shop-close-btn{width:100%;padding:14px;font-size:1rem;font-weight:700;letter-spacing:2px;background:linear-gradient(90deg,var(--neon-cyan),var(--neon-green));border:none;border-radius:10px;color:var(--bg-primary);cursor:pointer;transition:all .2s ease}.shop-close-btn:hover{transform:translateY(-2px);box-shadow:0 5px 20px #00f5ff66}.shop-close-btn:active{transform:scale(.98)}#victory-screen{position:absolute;top:0;left:0;width:100%;height:100%;display:flex;align-items:center;justify-content:center;background:#000000e6;z-index:150;animation:fadeIn .5s ease-out}.victory-panel{width:calc(100% - 30px);max-width:360px;background:var(--bg-panel);border-radius:16px;border:2px solid var(--neon-cyan);padding:30px 25px;text-align:center;animation:victoryPanelIn .6s var(--transition-bounce);box-shadow:0 0 40px #00f5ff4d}@keyframes victoryPanelIn{0%{opacity:0;transform:scale(.5) rotate(-5deg)}60%{transform:scale(1.05) rotate(1deg)}to{opacity:1;transform:scale(1) rotate(0)}}.victory-title{font-size:2.5rem;font-weight:900;letter-spacing:6px;color:var(--neon-cyan);text-shadow:0 0 20px var(--neon-cyan),0 0 40px rgba(0,245,255,.5);margin-bottom:25px;animation:victoryTitlePulse 1.5s ease-in-out infinite}@keyframes victoryTitlePulse{0%,to{transform:scale(1)}50%{transform:scale(1.03)}}.victory-rewards{display:flex;flex-direction:column;gap:12px;margin-bottom:25px}.reward-item{display:flex;justify-content:space-between;align-items:center;padding:12px 15px;background:#0000004d;border-radius:10px}.reward-label{font-size:.9rem;color:var(--text-secondary)}.reward-value{font-size:1.1rem;font-weight:700;color:gold}.victory-buttons{display:flex;gap:10px}.victory-btn{flex:1;padding:14px;font-size:.95rem;font-weight:700;border-radius:10px;cursor:pointer;transition:all .2s ease}.victory-btn.shop{background:#ffd7001a;border:2px solid rgba(255,215,0,.4);color:gold}.victory-btn.shop:hover{background:#ffd70033;border-color:gold}.victory-btn.continue{background:linear-gradient(90deg,var(--neon-cyan),var(--neon-green));border:none;color:var(--bg-primary)}.victory-btn.continue:hover{transform:translateY(-2px);box-shadow:0 5px 20px #00f5ff66}#defeat-screen{position:absolute;top:0;left:0;width:100%;height:100%;display:flex;align-items:center;justify-content:center;background:#000000e6;z-index:150;animation:fadeIn .5s ease-out}.defeat-panel{width:calc(100% - 30px);max-width:360px;background:var(--bg-panel);border-radius:16px;border:2px solid var(--miss-color);padding:30px 25px;text-align:center;animation:defeatPanelIn .5s ease-out;box-shadow:0 0 40px #ff33664d}@keyframes defeatPanelIn{0%{opacity:0;transform:translateY(-20px)}to{opacity:1;transform:translateY(0)}}.defeat-title{font-size:2.2rem;font-weight:900;letter-spacing:4px;color:var(--miss-color);text-shadow:0 0 20px rgba(255,51,102,.5);margin-bottom:15px}.defeat-message{font-size:.95rem;color:var(--text-secondary);margin-bottom:25px;line-height:1.5}.defeat-buttons{display:flex;gap:10px}.defeat-btn{flex:1;padding:14px;font-size:.95rem;font-weight:700;border-radius:10px;cursor:pointer;transition:all .2s ease}.defeat-btn.retry{background:linear-gradient(90deg,var(--neon-cyan),var(--neon-green));border:none;color:var(--bg-primary)}.defeat-btn.retry:hover{transform:translateY(-2px);box-shadow:0 5px 20px #00f5ff66}.defeat-btn.reset{background:#ffffff1a;border:2px solid rgba(255,255,255,.3);color:var(--text-primary)}.defeat-btn.reset:hover{background:#ffffff26;border-color:#ffffff80}#gameover-screen{position:absolute;top:0;left:0;width:100%;height:100%;display:flex;align-items:center;justify-content:center;background:#000000f2;z-index:150;animation:fadeIn .5s ease-out}.gameover-panel{width:calc(100% - 30px);max-width:360px;background:var(--bg-panel);border-radius:16px;border:2px solid var(--miss-color);padding:30px 25px;text-align:center;animation:gameoverPanelIn .6s ease-out}@keyframes gameoverPanelIn{0%{opacity:0;transform:scale(.9)}to{opacity:1;transform:scale(1)}}.gameover-title{font-size:2.5rem;font-weight:900;letter-spacing:6px;color:var(--miss-color);text-shadow:0 0 20px var(--miss-color),0 0 40px rgba(255,51,102,.4);margin-bottom:10px}.gameover-message{font-size:.9rem;color:var(--text-secondary);margin-bottom:25px}.gameover-stats{display:flex;flex-direction:column;gap:10px;margin-bottom:25px}.stat-item{display:flex;justify-content:space-between;align-items:center;padding:12px 15px;background:#0000004d;border-radius:10px}.stat-label{font-size:.9rem;color:var(--text-secondary)}.stat-value{font-size:1.1rem;font-weight:700;color:var(--neon-cyan)}.gameover-btn{width:100%;padding:16px;font-size:1rem;font-weight:700;letter-spacing:2px;background:linear-gradient(90deg,var(--neon-cyan),var(--neon-green));border:none;border-radius:10px;color:var(--bg-primary);cursor:pointer;transition:all .2s ease}.gameover-btn:hover{transform:translateY(-2px);box-shadow:0 5px 20px #00f5ff66}.gameover-btn:active{transform:scale(.98)}@media (min-width: 768px){#start-screen h1{font-size:3rem}.defense-btn{width:120px;height:120px}.btn-icon{font-size:2.2rem}.result-text{font-size:4rem}.level-select-panel,.shop-panel,.victory-panel,.defeat-panel,.gameover-panel{max-width:450px}.victory-title,.gameover-title{font-size:3rem}}.passive-income{display:flex;align-items:center;gap:6px;background:#8b5cf626;border:1px solid rgba(139,92,246,.4);border-radius:20px;padding:4px 12px;font-size:.85rem;color:#a78bfa;margin-top:6px;animation:idlePulse 2s ease-in-out infinite}.passive-income-icon{font-size:1rem}@keyframes idlePulse{0%,to{opacity:1}50%{opacity:.65}}.auto-badge{display:inline-flex;align-items:center;gap:3px;font-size:.65rem;font-weight:700;letter-spacing:.05em;background:#8b5cf640;color:#c4b5fd;border:1px solid rgba(139,92,246,.5);border-radius:8px;padding:1px 6px;vertical-align:middle;margin-left:6px}.level-btn.auto-farmed{border-color:#8b5cf680!important;box-shadow:0 0 10px #8b5cf626!important}.level-btn.auto-farmed:after{content:"";position:absolute;inset:0;border-radius:inherit;background:linear-gradient(135deg,rgba(139,92,246,.05),transparent);pointer-events:none}.idle-section{border-top:1px solid rgba(139,92,246,.3);padding-top:12px}.idle-section h3{color:#a78bfa}.idle-section-desc{font-size:.75rem;color:var(--text-secondary);margin-bottom:8px;font-style:italic}.idle-upgrade-item{display:flex;align-items:flex-start;gap:10px;background:#8b5cf614;border:1px solid rgba(139,92,246,.25);border-radius:10px;padding:10px;margin-bottom:8px;transition:border-color .2s,background .2s}.idle-upgrade-item .item-info{flex:1}.idle-upgrade-item .item-flavor{display:block;font-size:.7rem;color:var(--text-secondary);font-style:italic;margin-top:2px}.idle-upgrade-item strong{color:#a78bfa}.idle-upgrade-item.owned{background:#8b5cf62e;border-color:#8b5cf680}.idle-upgrade-item.locked{opacity:.45;filter:grayscale(.6)}.idle-upgrade-item.cant-afford{opacity:.65}.idle-badge-owned{display:inline-block;font-size:.75rem;font-weight:700;color:#a78bfa;background:#8b5cf633;border:1px solid rgba(139,92,246,.5);border-radius:6px;padding:3px 8px;white-space:nowrap}.idle-badge-locked{display:inline-block;font-size:.75rem;color:var(--text-secondary);white-space:nowrap}#offline-popup{position:absolute;inset:0;display:flex;align-items:center;justify-content:center;background:#000000bf;backdrop-filter:blur(8px);z-index:200;animation:fadeIn .3s ease}#offline-popup.hidden{display:none}.offline-popup-panel{background:var(--bg-panel);border:1px solid rgba(139,92,246,.5);border-radius:16px;padding:28px 32px;text-align:center;max-width:320px;width:90%;box-shadow:0 0 40px #8b5cf64d,0 20px 60px #0009;animation:popIn .4s var(--transition-bounce) forwards}@keyframes popIn{0%{transform:scale(.7);opacity:0}to{transform:scale(1);opacity:1}}.offline-popup-icon{font-size:3rem;margin-bottom:8px;animation:spin 2s linear infinite}@keyframes spin{0%{transform:rotate(0)}to{transform:rotate(360deg)}}.offline-popup-title{font-size:1.2rem;font-weight:700;color:#c4b5fd;margin-bottom:6px}.offline-popup-time{font-size:.85rem;color:var(--text-secondary);margin-bottom:16px}.offline-popup-reward{display:flex;align-items:center;justify-content:center;gap:8px;margin-bottom:8px}.offline-gold-amount{font-size:2.2rem;font-weight:900;color:#fbbf24;text-shadow:0 0 20px rgba(251,191,36,.5)}.offline-gold-icon{font-size:1.8rem}.offline-popup-sub{font-size:.8rem;color:var(--text-secondary);margin-bottom:20px}.offline-ok-btn{background:linear-gradient(135deg,#7c3aed,#8b5cf6);color:#fff;border:none;border-radius:10px;padding:10px 32px;font-size:1rem;font-weight:700;cursor:pointer;transition:transform .15s var(--transition-bounce),box-shadow .15s;box-shadow:0 4px 15px #8b5cf666}.offline-ok-btn:hover{transform:scale(1.05);box-shadow:0 6px 20px #8b5cf699}.offline-ok-btn:active{transform:scale(.97)}
