@import"https://fonts.googleapis.com/css2?family=Orbitron:wght@400;500;700;900&family=Rajdhani:wght@300;400;500;600;700&display=swap";*,*:before,*:after{margin:0;padding:0;box-sizing:border-box}html,body{width:100%;min-height:100vh;overflow:hidden;background:linear-gradient(135deg,#0c0118,#14002a,#1a0033,#14002a,#0c0118);background-size:200% 200%;animation:bgShift 20s ease infinite;font-family:Rajdhani,sans-serif;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;touch-action:none}@keyframes bgShift{0%{background-position:0% 50%}50%{background-position:100% 50%}to{background-position:0% 50%}}#bg-container,#game-container,#ui-layer{position:fixed;top:0;left:0;width:100%;height:100%;overflow:hidden}#bg-canvas{z-index:0}#game-canvas{z-index:1}#ui-layer{z-index:2;pointer-events:none}.screen{position:absolute;top:0;left:0;width:100%;height:100%;display:flex;flex-direction:column;align-items:center;justify-content:center;pointer-events:none;opacity:0;visibility:hidden;transition:opacity .5s ease,visibility .5s ease}.screen.active{opacity:1;visibility:visible;pointer-events:auto}.screen.active .btn,.screen.show .btn,.overlay .btn,.screen.show{pointer-events:auto}.hidden{display:none!important}#main-menu{background:radial-gradient(circle at center,rgba(15,5,28,.6) 0%,transparent 70%)}.menu-content{position:relative;display:flex;flex-direction:column;align-items:center;gap:1.5rem;max-width:90vw}.title-wrapper{text-align:center;animation:titleSlideDown 1s cubic-bezier(.16,1,.3,1) forwards;opacity:0}@keyframes titleSlideDown{0%{transform:translateY(-60px);opacity:0}to{transform:translateY(0);opacity:1}}.game-title{font-family:Orbitron,sans-serif;font-size:clamp(3rem,8vw,6rem);font-weight:900;letter-spacing:.2em;background:linear-gradient(45deg,#f0f,#0ff,#f0f);background-size:200% auto;-webkit-background-clip:text;background-clip:text;color:transparent;text-shadow:0 0 20px rgba(255,0,255,.5),0 0 40px rgba(0,255,255,.5),0 0 60px rgba(255,0,255,.3);animation:titleGlow 2s ease-in-out infinite,bgPan 3s linear infinite;padding:.5rem 1rem}@keyframes titleGlow{0%,to{text-shadow:0 0 15px rgba(255,0,255,.4),0 0 30px rgba(0,255,255,.4),0 0 45px rgba(255,0,255,.25),0 0 60px rgba(0,255,255,.2)}50%{text-shadow:0 0 20px rgba(255,0,255,.6),0 0 40px rgba(0,255,255,.6),0 0 65px rgba(255,0,255,.4),0 0 80px rgba(0,255,255,.3)}}@keyframes bgPan{0%{background-position:0%}to{background-position:200%}}.subtitle{font-size:1.2rem;letter-spacing:.3em;color:#ffffffb3;text-shadow:0 0 10px rgba(255,255,255,.3);font-weight:300;animation:subtitleFade 1s ease .3s forwards;opacity:0}@keyframes subtitleFade{to{opacity:1}}.btn{display:inline-flex;align-items:center;justify-content:center;gap:.5rem;font-family:Orbitron,sans-serif;font-size:1rem;font-weight:600;letter-spacing:.1em;padding:.75rem 2rem;border-radius:.75rem;border:2px solid rgba(255,255,255,.2);background:#ffffff0d;color:#fff;cursor:pointer;transition:all .3s cubic-bezier(.16,1,.3,1);backdrop-filter:blur(10px);-webkit-backdrop-filter:blur(10px);position:relative;overflow:hidden}.btn:before{content:"";position:absolute;top:0;left:0;width:100%;height:100%;border-radius:.6rem;background:linear-gradient(135deg,#f0f3,#0ff3);opacity:0;transition:opacity .3s ease;pointer-events:none}.btn:hover:before{opacity:1}.btn:active{transform:scale(.96)}.btn-primary{border-color:#ff00ff80;color:#f0f;box-shadow:0 0 20px #ff00ff4d}.btn-primary:hover{border-color:#f0f;color:#fff;box-shadow:0 0 30px #ff00ff80,0 0 50px #0ff6,inset 0 0 20px #f0f3;transform:translateY(-2px)}.btn-secondary{border-color:#0ff6;color:#0ff;box-shadow:0 0 15px #0ff3}.btn-secondary:hover{border-color:#0ff;color:#fff;box-shadow:0 0 25px #0ff6;transform:translateY(-2px)}.btn-lg{font-size:1.25rem;padding:1rem 2.5rem}.btn-glow{animation:pulseGlow 2s ease-in-out infinite}@keyframes pulseGlow{0%,to{box-shadow:0 0 20px #f0f6}50%{box-shadow:0 0 35px #f0f9,0 0 50px #00ffff80}}.btn-icon{width:50px;height:50px;border-radius:16px;padding:0;font-size:1.25rem;border-color:#ffffff26;color:#fff9}.btn-icon:hover{border-color:#ffffff80;color:#fff;box-shadow:0 0 20px #ffffff4d}.btn-pause{width:56px;height:56px;border-radius:18px;font-size:1.4rem;border-color:#fff3;color:#fff;padding:0;box-shadow:0 0 15px #ffffff26}.btn-pause:hover{border-color:#ffffff80;box-shadow:0 0 25px #fff6;transform:scale(1.05)}.stat-card{display:flex;flex-direction:column;align-items:center;gap:.3rem;padding:.7rem 1.5rem;border-radius:12px;background:#0f051c80;border:1px solid rgba(255,0,255,.15);backdrop-filter:blur(10px);-webkit-backdrop-filter:blur(10px);box-shadow:0 0 15px #0000004d}.stat-label{font-size:.7rem;text-transform:uppercase;letter-spacing:.15em;color:#ffffff80}.stat-value{font-family:Orbitron,sans-serif;font-size:1.5rem;font-weight:700;color:#0ff;text-shadow:0 0 10px rgba(0,255,255,.5)}.instructions{text-align:center;font-size:.8rem;color:#ffffff80;line-height:1.6;display:flex;flex-direction:column;gap:.3rem}.controls-info{display:flex;gap:1rem;flex-wrap:wrap;justify-content:center}.controls-group{display:flex;flex-direction:column;align-items:center;gap:.2rem;background:#0f051c66;border:1px solid rgba(255,0,255,.1);border-radius:10px;padding:.6rem 1rem;min-width:110px}.ctrl-key{font-family:Orbitron,sans-serif;font-size:.8rem;font-weight:500;color:#f0f;text-shadow:0 0 5px rgba(255,0,255,.6)}.ctrl-label{font-size:.7rem;color:#fff6}#hud{position:absolute;top:0;left:0;width:100%;height:100%;display:flex;flex-direction:column;justify-content:space-between;padding:1rem 1.5rem;pointer-events:none}.hud-top{display:flex;justify-content:space-between;align-items:center;flex-wrap:wrap;gap:.75rem;margin-bottom:auto}.hud-bottom{display:flex;justify-content:flex-end;margin-top:auto}.hud-stat{display:flex;flex-direction:column;align-items:center;min-width:90px}.hud-label{font-size:.7rem;text-transform:uppercase;letter-spacing:.15em;color:#fff6}.hud-value{font-family:Orbitron,sans-serif;font-size:1.2rem;font-weight:700;color:#0ff}.score-pop{animation:scorePop .35s ease-out}@keyframes scorePop{0%{transform:scale(1);color:#0ff}45%{transform:scale(1.3);color:#fff;text-shadow:0 0 18px rgba(0,255,255,.95)}to{transform:scale(1);color:#0ff}}.combo-stat .hud-label{color:#f0f}.combo-value{color:#f0f;text-shadow:0 0 10px rgba(255,0,255,.6);animation:comboPulse .5s ease}@keyframes comboPulse{0%{transform:scale(1)}50%{transform:scale(1.4)}to{transform:scale(1)}}.overlay{position:absolute;top:0;left:0;width:100%;height:100%;display:flex;align-items:center;justify-content:center;background:#000000b3;backdrop-filter:blur(5px);-webkit-backdrop-filter:blur(5px)}.overlay-content{display:flex;flex-direction:column;align-items:center;gap:1.5rem}.overlay-title{font-family:Orbitron,sans-serif;font-size:clamp(2rem,5vw,3rem);font-weight:800;color:#f0f;text-shadow:0 0 20px rgba(255,0,255,.4);letter-spacing:.2em;animation:pulseGlow 2s ease-in-out infinite}.overlay-stats{display:flex;gap:2rem}.overlay-stat{display:flex;flex-direction:column;align-items:center;gap:.3rem}.overlay-stat span:first-child{font-size:.9rem;color:#fff9}.overlay-stat span:last-child{font-family:Orbitron,sans-serif;font-size:1.5rem;font-weight:700;color:#0ff}.overlay-actions{display:flex;gap:1rem}#game-over{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(15,5,28,.7) 0%,transparent 70%);opacity:0;visibility:hidden;transition:opacity .6s ease,visibility .6s ease;padding:2rem;isolation:isolate;overflow:hidden}#game-over.show{opacity:1;visibility:visible}.game-over-effects,.game-over-effects:before,.game-over-effects:after{position:absolute;top:0;right:0;bottom:0;left:0;pointer-events:none}.game-over-effects{overflow:hidden;z-index:-1;background:radial-gradient(ellipse at 50% 45%,rgba(255,0,255,.08),transparent 38%),linear-gradient(115deg,transparent 0 47%,rgba(0,255,255,.04) 48%,transparent 49% 100%)}.game-over-effects:before{content:"";opacity:.2;background:repeating-linear-gradient(0deg,transparent 0,transparent 5px,rgba(0,255,255,.12) 6px,transparent 7px);animation:gameOverScan 8s linear infinite}.game-over-effects:after{content:"";top:-30%;right:-30%;bottom:-30%;left:-30%;background:conic-gradient(from 0deg,transparent 0deg,rgba(255,0,255,.1) 35deg,transparent 75deg,rgba(0,255,255,.08) 170deg,transparent 215deg);animation:gameOverSweep 14s linear infinite}@keyframes gameOverScan{0%{transform:translateY(-15%)}to{transform:translateY(15%)}}@keyframes gameOverSweep{to{transform:rotate(360deg)}}.game-over-ring{position:absolute;top:50%;left:50%;border:1px solid rgba(0,255,255,.2);border-radius:50%;transform:translate(-50%,-50%);box-shadow:0 0 18px #00ffff1f,inset 0 0 18px #ff00ff14;animation:gameOverOrbit 12s linear infinite}.ring-one{width:min(52vw,620px);height:min(52vw,620px)}.ring-two{width:min(72vw,860px);height:min(72vw,860px);border-color:#ff00ff24;border-style:dashed;animation-duration:18s;animation-direction:reverse}.ring-three{width:min(94vw,1120px);height:min(94vw,1120px);border-color:#ffffff14;border-style:dotted;animation-duration:26s}@keyframes gameOverOrbit{0%{transform:translate(-50%,-50%) rotate(0)}to{transform:translate(-50%,-50%) rotate(360deg)}}.game-over-particle{position:absolute;width:5px;height:5px;border-radius:50%;background:#0ff;box-shadow:0 0 8px #0ff,0 0 20px #00ffffb3;animation:gameOverFloat 5s ease-in-out infinite}.particle-one{left:16%;top:30%;animation-delay:-1s}.particle-two{left:78%;top:25%;background:#f0f;box-shadow:0 0 8px #f0f,0 0 20px #ff00ffb3;animation-delay:-3s}.particle-three{left:22%;top:76%;animation-delay:-4s}.particle-four{left:84%;top:70%;background:#ff0;box-shadow:0 0 8px #ff0,0 0 20px #ffff00b3;animation-delay:-2s}@keyframes gameOverFloat{0%,to{opacity:.25;transform:translate(0) scale(.7)}50%{opacity:1;transform:translate(12px,-24px) scale(1.35)}}.game-over-shard{position:absolute;width:2px;height:70px;background:linear-gradient(transparent,#00ffff,transparent);opacity:.45;transform:rotate(35deg);animation:gameOverShard 4s ease-in-out infinite}.shard-one{left:11%;top:18%;animation-delay:-2s}.shard-two{right:12%;top:56%;height:100px;background:linear-gradient(transparent,#ff00ff,transparent);transform:rotate(-42deg);animation-delay:-1s}.shard-three{left:72%;bottom:8%;height:55px;animation-delay:-3s}@keyframes gameOverShard{0%,to{opacity:0;transform:translateY(18px) rotate(35deg)}45%,65%{opacity:.65;transform:translateY(-18px) rotate(35deg)}}.game-over-content{position:relative;z-index:1;display:flex;flex-direction:column;align-items:center;gap:1.5rem;max-width:600px;width:100%;animation:gameOverContentIn .8s cubic-bezier(.16,1,.3,1) both}@keyframes gameOverContentIn{0%{opacity:0;transform:translateY(18px) scale(.97)}to{opacity:1;transform:translateY(0) scale(1)}}.game-over-title{font-family:Orbitron,sans-serif;font-size:clamp(1.8rem,8vw,4rem);font-weight:900;color:#f0f;text-shadow:0 0 30px rgba(255,0,255,.4),0 0 50px rgba(0,255,255,.4),0 0 70px rgba(255,0,255,.3);letter-spacing:clamp(.12em,1.8vw,.3em);max-width:100%;white-space:nowrap;animation:gameOverGlow 2s ease-in-out infinite}@keyframes gameOverGlow{0%,to{text-shadow:0 0 20px rgba(255,0,255,.3)}50%{text-shadow:0 0 35px rgba(255,0,255,.6),0 0 50px rgba(0,255,255,.6),0 0 70px rgba(255,0,255,.4)}}.high-score-badge{font-family:Orbitron,sans-serif;font-size:1.2rem;font-weight:700;color:#ff0;text-shadow:0 0 15px rgba(255,255,0,.6),0 0 25px rgba(255,255,0,.5);letter-spacing:.2em;animation:highScorePulse 1s ease-in-out infinite}@keyframes highScorePulse{0%,to{transform:scale(1);opacity:1}50%{transform:scale(1.1);opacity:1}}.stats-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:1rem;width:100%}#game-over .stat-card{min-width:0;padding-left:.6rem;padding-right:.6rem}.game-over-actions{display:flex;gap:1rem;margin-top:.5rem}@media (prefers-reduced-motion: reduce){.game-over-effects:before,.game-over-effects:after,.game-over-ring,.game-over-particle,.game-over-shard,.game-over-content{animation:none}}.score-change{position:absolute;font-family:Orbitron,sans-serif;font-size:1.2rem;font-weight:700;color:#0ff;text-shadow:0 0 8px rgba(0,255,255,.7);pointer-events:none;animation:floatUp .8s ease-out forwards;-webkit-user-select:none;user-select:none;white-space:nowrap;z-index:10}@keyframes floatUp{0%{transform:translateY(0) scale(1);opacity:1}to{transform:translateY(-80px) scale(.8);opacity:0}}@keyframes gameShake{0%,to{transform:translate(0)}20%{transform:translate(-5px,3px)}40%{transform:translate(4px,-4px)}60%{transform:translate(-3px,2px)}80%{transform:translate(2px,-2px)}}.game-shake #game-container,.game-shake #ui-layer{animation:gameShake .42s ease-out}@media (max-width: 768px){.game-title{font-size:2.8rem}.subtitle{font-size:1rem}#hud{padding:.8rem}.hud-top{gap:.5rem}.hud-stat{min-width:70px}.hud-value{font-size:1rem}.hud-label{font-size:.6rem}.btn{font-size:.9rem;padding:.6rem 1.5rem}.btn-lg{font-size:1rem;padding:.8rem 2rem}.instructions{font-size:.7rem}.controls-group{min-width:85px;padding:.4rem .7rem}.ctrl-key{font-size:.7rem}.ctrl-label{font-size:.6rem}.stats-grid{gap:.6rem}#game-over .stat-card{padding-left:.35rem;padding-right:.35rem}#game-over .stat-label{font-size:.58rem;letter-spacing:.08em}#game-over .stat-value{font-size:1.1rem}.overlay-actions{flex-direction:column}}@media (max-width: 480px){.game-title{font-size:2rem;letter-spacing:.1em}.subtitle{font-size:.8rem}.menu-content{gap:1rem}.stat-card{padding:.5rem 1rem}.stat-value{font-size:1.2rem}.stats-grid{gap:.35rem}#game-over .stat-card{padding:.5rem .2rem}#game-over .stat-label{font-size:.46rem;letter-spacing:.04em}#game-over .stat-value{font-size:.82rem}.hud-top{justify-content:center}.hud-stat{min-width:62px}.hud-stat:last-child{display:none}}