@import"https://fonts.googleapis.com/css2?family=Orbitron:wght@400;500;600;700;800;900&family=Rajdhani:wght@300;400;500;600;700&family=JetBrains+Mono:wght@400;500;600;700&display=swap";:root{--font-display: "Orbitron", sans-serif;--font-body: "Rajdhani", sans-serif;--font-mono: "JetBrains Mono", monospace;--neon-cyan: #00ffff;--neon-magenta: #ff00ff;--neon-yellow: #ffc800;--neon-green: #00ff64;--neon-red: #ff3232;--bg-dark: #0a0a0f;--bg-darker: #050508;font-family:var(--font-body);line-height:1.5;font-weight:400;color-scheme:dark;color:#ffffffe6;background-color:var(--bg-dark);font-synthesis:none;text-rendering:optimizeLegibility;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale}*{margin:0;padding:0;box-sizing:border-box}html,body{width:100%;height:100%;overflow:hidden}body{background:var(--bg-dark);background-image:radial-gradient(ellipse at 50% 100%,rgba(255,0,255,.08) 0%,transparent 50%),radial-gradient(ellipse at 0% 50%,rgba(0,255,255,.05) 0%,transparent 40%),radial-gradient(ellipse at 100% 0%,rgba(255,200,0,.03) 0%,transparent 40%);background-attachment:fixed}#root{width:100%;height:100%}::-webkit-scrollbar{width:8px;height:8px}::-webkit-scrollbar-track{background:#0000004d}::-webkit-scrollbar-thumb{background:#00ffff4d;border-radius:4px}::-webkit-scrollbar-thumb:hover{background:#00ffff80}::selection{background:#f0f6;color:#fff}:focus-visible{outline:2px solid var(--neon-cyan);outline-offset:2px}button{font-family:inherit;cursor:pointer;border:none;background:none;color:inherit}button:disabled{cursor:not-allowed;opacity:.5}a{color:var(--neon-cyan);text-decoration:none}a:hover{text-decoration:underline}.glow-cyan{text-shadow:0 0 10px var(--neon-cyan),0 0 20px var(--neon-cyan)}.glow-magenta{text-shadow:0 0 10px var(--neon-magenta),0 0 20px var(--neon-magenta)}.glow-yellow{text-shadow:0 0 10px var(--neon-yellow),0 0 20px var(--neon-yellow)}.glow-green{text-shadow:0 0 10px var(--neon-green),0 0 20px var(--neon-green)}.glow-red{text-shadow:0 0 10px var(--neon-red),0 0 20px var(--neon-red)}@keyframes glow-pulse{0%,to{opacity:1;filter:brightness(1)}50%{opacity:.8;filter:brightness(1.2)}}@keyframes float{0%,to{transform:translateY(0)}50%{transform:translateY(-10px)}}@keyframes shimmer{0%{background-position:-200% center}to{background-position:200% center}}.platform-toggle{display:flex;position:relative;background:#0009;border:1px solid rgba(255,255,255,.15);border-radius:8px;padding:4px;overflow:hidden}.platform-btn{position:relative;display:flex;align-items:center;gap:8px;padding:10px 20px;background:transparent;border:none;color:#ffffff80;font-family:var(--font-display);font-size:.875rem;font-weight:600;letter-spacing:1px;cursor:pointer;transition:color .3s ease;z-index:2}.platform-btn:hover{color:#fffc}.platform-btn.active{color:#fff;text-shadow:0 0 10px rgba(255,255,255,.5)}.platform-icon{font-size:1.25rem}.platform-name{text-transform:uppercase}.toggle-slider{position:absolute;top:4px;left:4px;width:calc(50% - 4px);height:calc(100% - 8px);background:linear-gradient(135deg,#0ff3,#f0f3);border:1px solid rgba(0,255,255,.4);border-radius:6px;transition:transform .3s cubic-bezier(.4,0,.2,1);box-shadow:0 0 20px #00ffff4d,inset 0 0 15px #00ffff1a}.start-screen{position:fixed;inset:0;display:flex;align-items:center;justify-content:center;overflow:hidden}.bg-grid{position:absolute;inset:0;background-image:linear-gradient(rgba(0,255,255,.03) 1px,transparent 1px),linear-gradient(90deg,rgba(0,255,255,.03) 1px,transparent 1px);background-size:50px 50px;animation:gridMove 20s linear infinite}@keyframes gridMove{0%{transform:perspective(500px) rotateX(60deg) translateY(0)}to{transform:perspective(500px) rotateX(60deg) translateY(50px)}}.bg-gradient{position:absolute;inset:0;background:radial-gradient(ellipse at center bottom,rgba(255,0,255,.15) 0%,transparent 50%),radial-gradient(ellipse at 20% 80%,rgba(0,255,255,.1) 0%,transparent 40%),radial-gradient(ellipse at 80% 20%,rgba(255,200,0,.08) 0%,transparent 40%)}.bg-noise{position:absolute;inset:0;background-image:url("data:image/svg+xml,%3Csvg viewBox='0 0 200 200' xmlns='http://www.w3.org/2000/svg'%3E%3Cfilter id='noise'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.9' numOctaves='4' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%' height='100%' filter='url(%23noise)' opacity='0.04'/%3E%3C/svg%3E");pointer-events:none}.particles{position:absolute;inset:0;overflow:hidden;pointer-events:none}.particle{position:absolute;width:4px;height:4px;background:var(--neon-cyan);border-radius:50%;left:var(--x);bottom:-10px;opacity:.6;box-shadow:0 0 10px var(--neon-cyan);animation:particleFloat var(--duration) ease-in-out infinite;animation-delay:var(--delay)}@keyframes particleFloat{0%{transform:translateY(0) scale(1);opacity:0}10%{opacity:.6}90%{opacity:.6}to{transform:translateY(-100vh) scale(.5);opacity:0}}.start-content{position:relative;z-index:10;display:flex;flex-direction:column;align-items:center;gap:32px;padding:40px;max-width:700px;width:100%}.title-container{position:relative;text-align:center;margin-bottom:20px}.title-glow{position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);width:600px;height:200px;background:radial-gradient(ellipse at center,rgba(0,255,255,.2) 0%,transparent 70%);filter:blur(40px);pointer-events:none}.main-title{font-family:var(--font-display);font-size:clamp(3rem,10vw,5rem);font-weight:900;letter-spacing:8px;margin:0;line-height:1.1}.title-letter{display:inline-block;color:transparent;opacity:0;transform:translateY(30px) rotateX(-90deg);transition:all .4s cubic-bezier(.34,1.56,.64,1);transition-delay:var(--delay)}.title-letter.visible{opacity:1;transform:translateY(0) rotateX(0);color:#fff;text-shadow:0 0 20px rgba(255,255,255,.5),0 0 40px var(--neon-cyan),0 0 80px var(--neon-magenta)}.subtitle{margin-top:16px;display:flex;align-items:center;justify-content:center;gap:16px}.subtitle-text{font-family:var(--font-display);font-size:1rem;letter-spacing:6px;color:var(--neon-magenta);text-shadow:0 0 15px var(--neon-magenta)}.subtitle-line{flex:1;max-width:100px;height:1px;background:linear-gradient(90deg,var(--neon-magenta),transparent)}.platform-section{display:flex;flex-direction:column;align-items:center;gap:12px}.section-label{font-family:var(--font-display);font-size:.75rem;letter-spacing:3px;color:#ffffff80}.mode-section{display:flex;flex-direction:column;align-items:center;gap:12px}.mode-toggle{display:flex;gap:16px}.mode-btn{display:flex;flex-direction:column;align-items:center;gap:8px;padding:20px 24px;background:#ffffff08;border:1px solid rgba(255,255,255,.1);border-radius:12px;cursor:pointer;transition:all .3s ease;min-width:140px}.mode-btn:hover{background:#ffffff0f;border-color:#fff3}.mode-btn.active{background:#00ffff1a;border-color:var(--neon-cyan);box-shadow:0 0 20px #0ff3}.mode-icon{font-size:2rem}.mode-name{font-family:var(--font-display);font-size:1rem;font-weight:700;letter-spacing:2px;color:#fff}.mode-btn.active .mode-name{color:var(--neon-cyan);text-shadow:0 0 10px var(--neon-cyan)}.mode-btn.ultra{border-color:#ffc8004d}.mode-btn.ultra:hover{border-color:#ffc80080;background:#ffc8001a}.mode-btn.ultra.active{background:#ffc80026;border-color:var(--neon-yellow);box-shadow:0 0 25px #ffc80066}.mode-btn.ultra.active .mode-name{color:var(--neon-yellow);text-shadow:0 0 15px var(--neon-yellow)}.mode-btn.ultra .mode-icon{animation:ultraPulse 1s ease-in-out infinite}@keyframes ultraPulse{0%,to{transform:scale(1)}50%{transform:scale(1.2)}}.mode-desc{font-family:var(--font-body);font-size:.75rem;color:#ffffff80;text-align:center}.levels-preview{padding:20px 24px;background:#0006;border:1px solid rgba(0,255,255,.2);border-radius:12px;text-align:center}.levels-header{font-family:var(--font-display);font-size:.875rem;font-weight:700;letter-spacing:3px;color:var(--neon-cyan);text-shadow:0 0 10px var(--neon-cyan);margin-bottom:16px}.levels-list{display:flex;flex-wrap:wrap;justify-content:center;gap:8px;margin-bottom:12px}.level-preview-item{display:flex;align-items:center;gap:6px;padding:6px 12px;background:#ffffff08;border:1px solid rgba(255,255,255,.1);border-radius:20px}.level-num{display:flex;align-items:center;justify-content:center;width:20px;height:20px;background:linear-gradient(135deg,var(--neon-cyan),var(--neon-magenta));border-radius:50%;font-family:var(--font-mono);font-size:.625rem;font-weight:700;color:#fff}.level-name{font-family:var(--font-body);font-size:.75rem;color:#fffc}.levels-more{font-family:var(--font-body);font-size:.75rem;color:var(--neon-magenta);padding:6px 12px}.levels-hint{font-family:var(--font-body);font-size:.75rem;color:#ffffff80}.start-button{position:relative;padding:20px 60px;background:transparent;border:none;cursor:pointer;overflow:hidden}.button-bg{position:absolute;inset:0;background:linear-gradient(135deg,var(--neon-cyan) 0%,var(--neon-magenta) 100%);border-radius:8px;opacity:.9;transition:all .3s ease}.start-button:hover .button-bg{opacity:1;transform:scale(1.02);box-shadow:0 0 30px #00ffff80,0 0 60px #ff00ff4d}.start-button:active .button-bg{transform:scale(.98)}.button-text{position:relative;z-index:2;font-family:var(--font-display);font-size:1.5rem;font-weight:900;letter-spacing:4px;color:#fff;text-shadow:0 2px 4px rgba(0,0,0,.3)}.button-hint{position:absolute;bottom:-24px;left:50%;transform:translate(-50%);font-family:var(--font-body);font-size:.75rem;color:#fff6;white-space:nowrap}.high-score-display{display:flex;flex-direction:column;align-items:center;gap:4px;padding:16px 32px;background:#ffc8000d;border:1px solid rgba(255,200,0,.2);border-radius:8px}.hs-label{font-family:var(--font-display);font-size:.625rem;letter-spacing:3px;color:var(--neon-yellow);text-shadow:0 0 10px var(--neon-yellow)}.hs-value{font-family:var(--font-mono);font-size:1.75rem;font-weight:700;color:var(--neon-yellow);text-shadow:0 0 20px var(--neon-yellow)}.instructions{display:flex;gap:40px;margin-top:20px}.instruction{display:flex;flex-direction:column;align-items:center;gap:4px}.key-hint{font-family:var(--font-mono);font-size:.875rem;padding:6px 12px;background:#ffffff0d;border:1px solid rgba(255,255,255,.15);border-radius:4px;color:#fffc}.instruction-text{font-family:var(--font-body);font-size:.75rem;color:#fff6}@media(max-width:600px){.instructions{flex-direction:column;gap:16px}.main-title{letter-spacing:4px}.subtitle-text{font-size:.75rem;letter-spacing:4px}}.game-track{position:relative;width:100%;max-width:600px;height:450px;background:linear-gradient(180deg,#000000f2,#0a0a14fa,#14051ef2);border:2px solid var(--neon-cyan);border-radius:12px;overflow:hidden;box-shadow:0 0 30px #00ffff4d,inset 0 0 60px #000c;transition:transform .1s ease-out}.game-track.pulse-hit{animation:pulseHit .3s ease-out}.game-track.shake{animation:shake .3s ease-out}@keyframes pulseHit{0%{box-shadow:0 0 30px #00ffff4d,inset 0 0 60px #000c}50%{box-shadow:0 0 80px #0ffc,0 0 120px #f0f6,inset 0 0 60px #000c}to{box-shadow:0 0 30px #00ffff4d,inset 0 0 60px #000c}}@keyframes shake{0%,to{transform:translate(0)}20%{transform:translate(-8px)}40%{transform:translate(8px)}60%{transform:translate(-6px)}80%{transform:translate(6px)}}.deadline-bar{position:absolute;left:0;right:0;height:4px;z-index:15;transition:top .1s linear,background-color .3s ease,box-shadow .3s ease}.deadline-bar:before{content:"";position:absolute;inset:0;background:inherit;filter:blur(8px);opacity:.8}.deadline-bar.urgent{animation:deadlinePulse .2s ease-in-out infinite;height:6px}@keyframes deadlinePulse{0%,to{opacity:1;transform:scaleY(1)}50%{opacity:.7;transform:scaleY(1.5)}}.timer-overlay{position:absolute;top:12px;right:16px;font-family:var(--font-mono);font-size:1.5rem;font-weight:700;z-index:16;text-shadow:0 0 20px currentColor;transition:color .3s ease}.timer-overlay.urgent{animation:timerTextPulse .2s ease-in-out infinite}@keyframes timerTextPulse{0%,to{transform:scale(1)}50%{transform:scale(1.15)}}.game-track.success-flash{animation:successFlash .5s ease-out}@keyframes successFlash{0%{box-shadow:0 0 30px #00ffff4d,inset 0 0 60px #000c}30%{box-shadow:0 0 100px #00ff64,0 0 150px #00ff64cc,inset 0 0 100px #00ff644d}to{box-shadow:0 0 30px #00ffff4d,inset 0 0 60px #000c}}.scanlines{position:absolute;inset:0;background:repeating-linear-gradient(0deg,rgba(0,0,0,.15) 0px,rgba(0,0,0,.15) 1px,transparent 1px,transparent 3px);pointer-events:none;z-index:10}.track-lanes{position:absolute;inset:0;display:flex;justify-content:space-evenly;padding:0 40px}.lane{width:2px;height:100%;background:linear-gradient(180deg,transparent 0%,rgba(0,255,255,.1) 30%,rgba(0,255,255,.2) 70%,rgba(0,255,255,.4) 100%)}.target-zone{position:absolute;bottom:60px;left:0;right:0;height:8px;z-index:5}.target-glow{position:absolute;top:-20px;left:20px;right:20px;height:50px;background:radial-gradient(ellipse at center,rgba(255,0,255,.3) 0%,transparent 70%);filter:blur(10px)}.target-line{position:absolute;top:50%;left:20px;right:20px;height:4px;background:linear-gradient(90deg,transparent 0%,var(--neon-magenta) 10%,var(--neon-cyan) 50%,var(--neon-magenta) 90%,transparent 100%);box-shadow:0 0 20px var(--neon-magenta),0 0 40px var(--neon-cyan);border-radius:2px}.shortcut-card{position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);text-align:center;z-index:8;animation:fadeIn .3s ease-out}@keyframes fadeIn{0%{opacity:0;transform:translate(-50%,-45%)}to{opacity:1;transform:translate(-50%,-50%)}}.shortcut-level{font-family:var(--font-mono);font-size:.625rem;text-transform:uppercase;letter-spacing:2px;color:#fff6;margin-bottom:4px}.shortcut-category{font-family:var(--font-display);font-size:.75rem;text-transform:uppercase;letter-spacing:3px;color:var(--neon-magenta);margin-bottom:8px;text-shadow:0 0 10px var(--neon-magenta)}.shortcut-action{font-family:var(--font-display);font-size:1.5rem;font-weight:700;color:#fff;text-shadow:0 0 20px rgba(255,255,255,.5),0 0 40px rgba(0,255,255,.3);margin-bottom:20px;max-width:400px;line-height:1.3}.shortcut-prompt{font-family:var(--font-body);font-size:.875rem;color:#fff9;margin-bottom:12px;letter-spacing:1px}.shortcut-keys{font-family:var(--font-mono);font-size:2.5rem;font-weight:700;color:var(--neon-cyan);text-shadow:0 0 20px var(--neon-cyan),0 0 40px var(--neon-cyan),0 0 60px rgba(0,255,255,.5);padding:16px 32px;background:#00ffff0d;border:2px solid rgba(0,255,255,.3);border-radius:8px;display:inline-block;transition:all .2s ease}.shortcut-keys.correct{color:var(--neon-green);border-color:var(--neon-green);background:#00ff641a;text-shadow:0 0 20px var(--neon-green),0 0 40px var(--neon-green);animation:correctPulse .5s ease-out}.shortcut-keys.incorrect{color:var(--neon-red);border-color:var(--neon-red);background:#ff32321a;text-shadow:0 0 20px var(--neon-red),0 0 40px var(--neon-red)}.shortcut-keys.urgent{color:var(--neon-red);border-color:var(--neon-red);text-shadow:0 0 20px var(--neon-red),0 0 40px var(--neon-red);animation:urgentPulse .3s ease-in-out infinite}@keyframes urgentPulse{0%,to{transform:scale(1)}50%{transform:scale(1.05)}}@keyframes correctPulse{0%{transform:scale(1)}50%{transform:scale(1.1)}to{transform:scale(1)}}.shortcut-keys.challenge-mode{color:var(--neon-magenta);border-color:var(--neon-magenta);background:#ff00ff0d;text-shadow:0 0 20px var(--neon-magenta),0 0 40px rgba(255,0,255,.5);letter-spacing:8px;font-size:3rem}.shortcut-keys.challenge-mode.reveal{animation:revealKeys .4s ease-out}.shortcut-keys.ultra-mode{color:var(--neon-yellow);border-color:var(--neon-yellow);background:#ffc8001a;text-shadow:0 0 20px var(--neon-yellow),0 0 40px rgba(255,200,0,.5);letter-spacing:8px;font-size:3rem;animation:ultraKeysPulse .3s ease-in-out infinite}@keyframes ultraKeysPulse{0%,to{transform:scale(1)}50%{transform:scale(1.02)}}.shortcut-keys.ultra-mode.reveal{animation:revealKeys .4s ease-out}@keyframes revealKeys{0%{transform:scale(.8);opacity:0;filter:blur(10px)}to{transform:scale(1);opacity:1;filter:blur(0)}}.input-display{margin-top:20px;display:flex;flex-direction:column;align-items:center;gap:8px}.input-label{font-family:var(--font-body);font-size:.75rem;color:#ffffff80;text-transform:uppercase;letter-spacing:2px}.input-key{font-family:var(--font-mono);font-size:1.25rem;padding:8px 16px;background:#ffffff0d;border:1px solid rgba(255,255,255,.2);border-radius:4px;color:#fffc;transition:all .2s ease}.input-key.correct{color:var(--neon-green);border-color:var(--neon-green);background:#00ff641a}.input-key.incorrect{color:var(--neon-red);border-color:var(--neon-red);background:#ff32321a}.paused-overlay{position:absolute;inset:0;background:#000000d9;display:flex;flex-direction:column;align-items:center;justify-content:center;z-index:20}.paused-text{font-family:var(--font-display);font-size:3rem;font-weight:900;color:var(--neon-yellow);text-shadow:0 0 30px var(--neon-yellow),0 0 60px var(--neon-yellow);letter-spacing:8px;animation:pausePulse 1.5s ease-in-out infinite}@keyframes pausePulse{0%,to{opacity:1}50%{opacity:.6}}.paused-hint{font-family:var(--font-body);font-size:1rem;color:#fff9;margin-top:16px;letter-spacing:2px}.hit-effect{position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);z-index:15;pointer-events:none}.hit-burst{position:absolute;top:50%;left:50%;width:200px;height:200px;transform:translate(-50%,-50%);background:radial-gradient(circle,rgba(0,255,100,.6) 0%,rgba(0,255,255,.3) 30%,transparent 70%);animation:burstExpand .5s ease-out forwards}@keyframes burstExpand{0%{transform:translate(-50%,-50%) scale(0);opacity:1}to{transform:translate(-50%,-50%) scale(2);opacity:0}}.hit-text{position:relative;font-family:var(--font-display);font-size:2rem;font-weight:900;color:var(--neon-green);text-shadow:0 0 20px var(--neon-green),0 0 40px var(--neon-green),0 0 60px var(--neon-green);animation:hitTextPop .5s ease-out forwards;letter-spacing:4px}@keyframes hitTextPop{0%{transform:scale(0);opacity:1}50%{transform:scale(1.3)}to{transform:scale(1);opacity:0}}.hit-ring{position:absolute;top:50%;left:50%;width:100px;height:100px;border:3px solid var(--neon-green);border-radius:50%;transform:translate(-50%,-50%);animation:ringExpand .6s ease-out forwards;box-shadow:0 0 20px var(--neon-green),inset 0 0 20px var(--neon-green)}.hit-ring.ring-2{animation-delay:.1s;border-color:var(--neon-cyan);box-shadow:0 0 20px var(--neon-cyan),inset 0 0 20px var(--neon-cyan)}@keyframes ringExpand{0%{width:50px;height:50px;opacity:1}to{width:300px;height:300px;opacity:0}}.success-particles{position:absolute;top:50%;left:50%;width:0;height:0}.success-particles .particle{position:absolute;width:8px;height:8px;background:var(--neon-green);border-radius:50%;box-shadow:0 0 10px var(--neon-green),0 0 20px var(--neon-green);animation:particleExplode .6s ease-out forwards;animation-delay:var(--delay)}.success-particles .particle:nth-child(odd){background:var(--neon-cyan);box-shadow:0 0 10px var(--neon-cyan),0 0 20px var(--neon-cyan)}.success-particles .particle:nth-child(3n){background:var(--neon-yellow);box-shadow:0 0 10px var(--neon-yellow),0 0 20px var(--neon-yellow);width:6px;height:6px}@keyframes particleExplode{0%{transform:rotate(var(--angle)) translate(0) scale(1);opacity:1}to{transform:rotate(var(--angle)) translate(150px) scale(0);opacity:0}}.miss-effect{position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);z-index:15;pointer-events:none}.miss-text{font-family:var(--font-display);font-size:2rem;font-weight:900;color:var(--neon-red);text-shadow:0 0 20px var(--neon-red),0 0 40px var(--neon-red);animation:missTextFade .5s ease-out forwards;letter-spacing:4px}@keyframes missTextFade{0%{transform:scale(1);opacity:1}to{transform:scale(.8) translateY(20px);opacity:0}}.preview-card{position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);text-align:center;z-index:8;animation:previewEnter .4s cubic-bezier(.34,1.56,.64,1)}@keyframes previewEnter{0%{opacity:0;transform:translate(-50%,-50%) scale(.5)}to{opacity:1;transform:translate(-50%,-50%) scale(1)}}.preview-category{font-family:var(--font-display);font-size:.875rem;text-transform:uppercase;letter-spacing:4px;color:var(--neon-magenta);margin-bottom:16px;text-shadow:0 0 15px var(--neon-magenta)}.preview-action{font-family:var(--font-display);font-size:3rem;font-weight:900;color:#fff;text-shadow:0 0 30px rgba(255,255,255,.8),0 0 60px var(--neon-cyan),0 0 90px var(--neon-magenta);max-width:500px;line-height:1.2;animation:previewPulse 1.5s ease-in-out infinite}@keyframes previewPulse{0%,to{text-shadow:0 0 30px rgba(255,255,255,.8),0 0 60px var(--neon-cyan),0 0 90px var(--neon-magenta)}50%{text-shadow:0 0 40px rgba(255,255,255,1),0 0 80px var(--neon-cyan),0 0 120px var(--neon-magenta)}}.preview-hint{font-family:var(--font-body);font-size:1rem;color:#ffffff80;margin-top:24px;letter-spacing:2px;animation:previewHintBlink .8s ease-in-out infinite}@keyframes previewHintBlink{0%,to{opacity:.5}50%{opacity:1}}.shortcut-card.from-preview{animation:cardFromPreview .4s ease-out}@keyframes cardFromPreview{0%{opacity:.8}to{opacity:1}}.shortcut-action.shrink-from-preview{animation:shrinkFromPreview .4s ease-out}@keyframes shrinkFromPreview{0%{font-size:3rem;text-shadow:0 0 30px rgba(255,255,255,.8),0 0 60px var(--neon-cyan)}to{font-size:1.5rem;text-shadow:0 0 20px rgba(255,255,255,.5),0 0 40px rgba(0,255,255,.3)}}.shortcut-keys.slide-in{animation:slideInFromBelow .4s cubic-bezier(.34,1.56,.64,1)}@keyframes slideInFromBelow{0%{opacity:0;transform:translateY(30px) scale(.9)}to{opacity:1;transform:translateY(0) scale(1)}}.scoreboard{display:flex;flex-direction:column;align-items:center;gap:24px;padding:24px;background:linear-gradient(135deg,#0a0a14f2,#140a1ef2);border:1px solid rgba(0,255,255,.2);border-radius:16px;box-shadow:0 0 40px #00000080,inset 0 0 30px #00ffff0d;min-width:280px}.score-main{text-align:center}.score-label{font-family:var(--font-display);font-size:.75rem;letter-spacing:4px;color:var(--neon-cyan);text-shadow:0 0 10px var(--neon-cyan);margin-bottom:4px}.score-value{font-family:var(--font-mono);font-size:3rem;font-weight:700;color:#fff;text-shadow:0 0 20px rgba(255,255,255,.5),0 0 40px rgba(0,255,255,.3);line-height:1}.multiplier{position:relative;width:100px;height:100px}.multiplier-ring{position:absolute;top:0;left:0;width:100%;height:100%}.multiplier-ring svg{width:100%;height:100%;transition:all .3s ease}.multiplier.active .multiplier-ring svg circle:last-of-type{filter:drop-shadow(0 0 8px var(--neon-cyan))}.multiplier-content{position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);text-align:center}.multiplier-value{font-family:var(--font-display);font-size:1.75rem;font-weight:900;color:var(--neon-magenta);text-shadow:0 0 20px var(--neon-magenta);transition:all .2s ease}.multiplier.active .multiplier-value{color:var(--neon-yellow);text-shadow:0 0 20px var(--neon-yellow),0 0 40px var(--neon-yellow);animation:multiplierPulse .5s ease-in-out infinite}@keyframes multiplierPulse{0%,to{transform:scale(1)}50%{transform:scale(1.1)}}.multiplier-label{font-family:var(--font-display);font-size:.625rem;letter-spacing:2px;color:#ffffff80;margin-top:2px}.stats-row{display:flex;gap:24px;justify-content:center;width:100%}.stat{text-align:center;flex:1}.stat-value{font-family:var(--font-mono);font-size:1.5rem;font-weight:700;color:#fff;margin-bottom:4px}.stat-value.streak{color:var(--neon-cyan);text-shadow:0 0 15px var(--neon-cyan)}.stat-value.accuracy{color:var(--neon-green);text-shadow:0 0 15px var(--neon-green)}.stat-value.high-score{color:var(--neon-yellow);text-shadow:0 0 15px var(--neon-yellow)}.stat-label{font-family:var(--font-display);font-size:.625rem;letter-spacing:2px;color:#fff6;text-transform:uppercase}.level-display{display:flex;align-items:center;gap:14px;padding:10px 20px;background:#000000b3;border:2px solid rgba(0,255,255,.3);border-radius:50px;box-shadow:0 0 25px #0ff3}.level-badge{width:50px;height:50px;display:flex;align-items:center;justify-content:center;background:linear-gradient(135deg,var(--neon-cyan),var(--neon-magenta));border-radius:50%;box-shadow:0 0 20px #00ffff80,0 0 40px #ff00ff4d,inset 0 0 10px #ffffff4d;flex-shrink:0}.level-number{font-family:var(--font-display);font-size:1.5rem;font-weight:900;color:#fff;text-shadow:0 2px 4px rgba(0,0,0,.4)}.level-info{display:flex;flex-direction:column;gap:4px}.level-name{font-family:var(--font-display);font-size:1.1rem;font-weight:700;letter-spacing:3px;text-transform:uppercase;color:var(--neon-cyan);text-shadow:0 0 15px var(--neon-cyan);line-height:1}.level-progress-bar{position:relative;width:160px;height:8px;background:#ffffff1a;border-radius:4px;overflow:hidden;border:1px solid rgba(255,255,255,.1)}.level-progress-fill{position:absolute;top:0;left:0;height:100%;background:linear-gradient(90deg,var(--neon-cyan),var(--neon-magenta));border-radius:4px;transition:width .3s ease-out;box-shadow:0 0 10px var(--neon-cyan)}.level-progress-segments{position:absolute;inset:0;display:flex;gap:2px;padding:2px}.segment{flex:1;background:transparent;border-radius:2px;border:1px solid rgba(255,255,255,.15);transition:all .3s ease}.segment.filled{border-color:transparent}.level-progress-text{font-family:var(--font-body);font-size:.65rem;color:#ffffff80;letter-spacing:.5px}.game{position:fixed;inset:0;display:flex;flex-direction:column;overflow:hidden}.game-bg{position:absolute;inset:0;pointer-events:none;z-index:0}.bg-pulse{position:absolute;top:50%;left:50%;width:150%;height:150%;transform:translate(-50%,-50%);background:radial-gradient(ellipse at center,rgba(255,0,255,.05) 0%,transparent 50%);animation:bgPulse 4s ease-in-out infinite}@keyframes bgPulse{0%,to{transform:translate(-50%,-50%) scale(1);opacity:.5}50%{transform:translate(-50%,-50%) scale(1.1);opacity:1}}.bg-lines{position:absolute;inset:0;background:repeating-linear-gradient(90deg,transparent 0px,transparent 100px,rgba(0,255,255,.02) 100px,rgba(0,255,255,.02) 101px)}.game-header{position:relative;z-index:10;display:flex;align-items:flex-start;justify-content:space-between;padding:20px 24px;min-height:100px;background:linear-gradient(180deg,rgba(0,0,0,.9) 0%,rgba(0,0,0,.5) 70%,transparent 100%)}.exit-btn{display:flex;align-items:center;gap:8px;padding:10px 16px;background:#ffffff0d;border:1px solid rgba(255,255,255,.1);border-radius:8px;color:#ffffffb3;font-family:var(--font-display);font-size:.875rem;letter-spacing:1px;cursor:pointer;transition:all .2s ease}.exit-btn:hover{border-color:var(--neon-red);color:var(--neon-red);background:#ff32321a}.exit-icon{font-size:1.25rem}.header-center{position:absolute;top:12px;left:50%;transform:translate(-50%);display:flex;flex-direction:column;align-items:center;gap:6px}.mode-indicator{font-family:var(--font-display);font-size:.625rem;letter-spacing:2px;padding:4px 12px;border-radius:20px;background:#ffffff0d;border:1px solid rgba(255,255,255,.1)}.mode-indicator.learning{color:var(--neon-cyan);border-color:#00ffff4d;text-shadow:0 0 10px var(--neon-cyan)}.mode-indicator.challenge{color:var(--neon-magenta);border-color:#ff00ff4d;text-shadow:0 0 10px var(--neon-magenta)}.mode-indicator.ultra{color:var(--neon-yellow);border-color:#ffc80066;background:#ffc8001a;text-shadow:0 0 10px var(--neon-yellow);animation:ultraIndicatorPulse .5s ease-in-out infinite}@keyframes ultraIndicatorPulse{0%,to{box-shadow:0 0 10px #ffc8004d}50%{box-shadow:0 0 20px #ffc80099}}.pause-btn{display:flex;align-items:center;justify-content:center;width:40px;height:40px;background:#ffffff0d;border:1px solid rgba(255,255,255,.2);border-radius:8px;color:#fffc;font-size:1.25rem;cursor:pointer;transition:all .2s ease}.pause-btn:hover{background:#ffffff1a;border-color:var(--neon-cyan);color:var(--neon-cyan);box-shadow:0 0 15px #00ffff4d}.lives-display{display:flex;gap:12px;align-items:center}.life{font-size:2.5rem;transition:all .3s ease;filter:drop-shadow(0 0 5px rgba(255,50,50,.3))}.life.active{color:var(--neon-red);text-shadow:0 0 20px var(--neon-red),0 0 40px rgba(255,50,50,.5);animation:heartBeat 1s ease-in-out infinite}.life.lost{color:#ffffff1a;transform:scale(.7);filter:none;text-shadow:none}.life.losing{animation:heartLose .6s ease-out forwards}@keyframes heartBeat{0%,to{transform:scale(1)}50%{transform:scale(1.15)}}@keyframes heartLose{0%{color:var(--neon-red);transform:scale(1);text-shadow:0 0 20px var(--neon-red)}20%{transform:scale(1.4);text-shadow:0 0 40px var(--neon-red),0 0 60px rgba(255,50,50,.8)}40%{transform:scale(.5) rotate(-15deg)}60%{transform:scale(.9) rotate(10deg);opacity:.5}80%{transform:scale(.6) rotate(-5deg);opacity:.3}to{color:#ffffff1a;transform:scale(.7) rotate(0);text-shadow:none;opacity:1}}.game-main{flex:1;display:flex;align-items:center;justify-content:center;padding:20px;position:relative;z-index:5}.game-layout{display:flex;align-items:flex-start;gap:32px;max-width:1100px;width:100%}.track-container{flex:1;display:flex;justify-content:center}.game-sidebar{display:flex;flex-direction:column;gap:16px;min-width:280px}.skip-btn{padding:12px 20px;background:transparent;border:1px solid rgba(255,255,255,.15);border-radius:8px;color:#ffffff80;font-family:var(--font-body);font-size:.875rem;cursor:pointer;transition:all .2s ease}.skip-btn:hover:not(:disabled){border-color:var(--neon-red);color:var(--neon-red);background:#ff32321a}.skip-btn:disabled{opacity:.3;cursor:not-allowed}.game-footer{position:relative;z-index:10;display:flex;align-items:center;justify-content:center;gap:16px;padding:16px;background:linear-gradient(0deg,rgba(0,0,0,.8) 0%,transparent 100%)}.hint{font-family:var(--font-body);font-size:.75rem;color:#fff6;letter-spacing:1px}.hint-divider{color:#fff3}.header-right{display:flex;align-items:center;gap:16px}.level-info-panel{padding:16px;background:#0006;border:1px solid rgba(255,255,255,.1);border-radius:12px;display:flex;flex-direction:column;gap:8px}.level-description{display:flex;flex-direction:column;gap:4px}.level-label{font-family:var(--font-display);font-size:.75rem;letter-spacing:2px;text-transform:uppercase;color:var(--neon-magenta);text-shadow:0 0 10px var(--neon-magenta)}.level-desc{font-family:var(--font-body);font-size:.875rem;color:#ffffffb3}.shortcuts-in-level{font-family:var(--font-body);font-size:.75rem;color:#fff6;text-align:right}.level-up-overlay{position:fixed;inset:0;display:flex;align-items:center;justify-content:center;background:#000000e6;z-index:100;animation:fadeIn .3s ease-out}.level-up-content{position:relative;text-align:center;animation:levelUpPop .5s cubic-bezier(.34,1.56,.64,1)}@keyframes levelUpPop{0%{transform:scale(0);opacity:0}to{transform:scale(1);opacity:1}}.level-up-burst{position:absolute;top:50%;left:50%;width:400px;height:400px;transform:translate(-50%,-50%);background:radial-gradient(circle,rgba(0,255,255,.4) 0%,rgba(255,0,255,.2) 30%,transparent 70%);animation:burstPulse 1s ease-in-out infinite}@keyframes burstPulse{0%,to{transform:translate(-50%,-50%) scale(1);opacity:.5}50%{transform:translate(-50%,-50%) scale(1.3);opacity:1}}.level-up-text{position:relative;font-family:var(--font-display);font-size:4rem;font-weight:900;letter-spacing:8px;color:var(--neon-yellow);text-shadow:0 0 30px var(--neon-yellow),0 0 60px var(--neon-yellow),0 0 90px rgba(255,200,0,.5);animation:levelUpGlow .5s ease-in-out infinite alternate}@keyframes levelUpGlow{0%{text-shadow:0 0 30px var(--neon-yellow),0 0 60px var(--neon-yellow)}to{text-shadow:0 0 50px var(--neon-yellow),0 0 100px var(--neon-yellow),0 0 150px var(--neon-yellow)}}.new-level{position:relative;font-family:var(--font-display);font-size:1.5rem;font-weight:700;letter-spacing:4px;color:var(--neon-cyan);text-shadow:0 0 20px var(--neon-cyan);margin-top:24px}.new-level-desc{position:relative;font-family:var(--font-body);font-size:1rem;color:#ffffffb3;margin-top:8px}@media(max-width:900px){.game-layout{flex-direction:column;align-items:center}.game-sidebar{width:100%;max-width:600px}.header-center{position:static;transform:none}.header-right{flex-direction:column;gap:8px}.game-header{flex-wrap:wrap;gap:12px;justify-content:center}.level-up-text{font-size:2.5rem}}.game-over{position:fixed;inset:0;display:flex;align-items:center;justify-content:center;background:#000000f2;animation:fadeIn .5s ease-out;z-index:100}@keyframes fadeIn{0%{opacity:0}to{opacity:1}}.game-over-content{display:flex;flex-direction:column;align-items:center;gap:24px;padding:40px;max-width:500px;width:100%}.new-high-score{position:relative;animation:nhsPop .6s cubic-bezier(.34,1.56,.64,1)}@keyframes nhsPop{0%{transform:scale(0);opacity:0}50%{transform:scale(1.2)}to{transform:scale(1);opacity:1}}.nhs-burst{position:absolute;top:50%;left:50%;width:300px;height:100px;transform:translate(-50%,-50%);background:radial-gradient(ellipse at center,rgba(255,200,0,.4) 0%,transparent 70%);animation:nhsBurst 2s ease-in-out infinite}@keyframes nhsBurst{0%,to{transform:translate(-50%,-50%) scale(1);opacity:.5}50%{transform:translate(-50%,-50%) scale(1.3);opacity:1}}.nhs-text{position:relative;font-family:var(--font-display);font-size:1.5rem;font-weight:900;letter-spacing:4px;color:var(--neon-yellow);text-shadow:0 0 20px var(--neon-yellow),0 0 40px var(--neon-yellow),0 0 60px rgba(255,200,0,.5);animation:nhsGlow 1s ease-in-out infinite}@keyframes nhsGlow{0%,to{text-shadow:0 0 20px var(--neon-yellow),0 0 40px var(--neon-yellow)}50%{text-shadow:0 0 30px var(--neon-yellow),0 0 60px var(--neon-yellow),0 0 80px var(--neon-yellow)}}.game-over-title{font-family:var(--font-display);font-size:3rem;font-weight:900;letter-spacing:8px;color:#fff;text-shadow:0 0 20px rgba(255,255,255,.5),0 0 40px var(--neon-magenta);margin:0;animation:titlePulse 2s ease-in-out infinite}@keyframes titlePulse{0%,to{opacity:1}50%{opacity:.8}}.level-reached{display:flex;align-items:center;gap:16px;padding:16px 24px;background:#00ffff0d;border:1px solid rgba(0,255,255,.3);border-radius:12px;margin-bottom:8px}.level-reached-badge{width:50px;height:50px;display:flex;align-items:center;justify-content:center;background:linear-gradient(135deg,var(--neon-cyan),var(--neon-magenta));border-radius:50%;box-shadow:0 0 20px #0ff6,inset 0 0 10px #fff3}.level-reached-num{font-family:var(--font-display);font-size:1.5rem;font-weight:900;color:#fff;text-shadow:0 2px 4px rgba(0,0,0,.3)}.level-reached-info{display:flex;flex-direction:column;gap:4px}.level-reached-label{font-family:var(--font-display);font-size:.625rem;letter-spacing:2px;color:#ffffff80}.level-reached-name{font-family:var(--font-display);font-size:1.25rem;font-weight:700;color:var(--neon-cyan);text-shadow:0 0 10px var(--neon-cyan)}.rank-display{position:relative;display:flex;flex-direction:column;align-items:center;padding:20px 40px}.rank-glow{position:absolute;top:50%;left:50%;width:150px;height:150px;transform:translate(-50%,-50%);background:radial-gradient(circle,var(--rank-color) 0%,transparent 70%);opacity:.3;filter:blur(30px);animation:rankGlow 1.5s ease-in-out infinite}@keyframes rankGlow{0%,to{transform:translate(-50%,-50%) scale(1)}50%{transform:translate(-50%,-50%) scale(1.2)}}.rank-letter{position:relative;font-family:var(--font-display);font-size:6rem;font-weight:900;line-height:1;text-shadow:0 0 30px currentColor,0 0 60px currentColor;animation:rankPop .8s cubic-bezier(.34,1.56,.64,1) .3s both}@keyframes rankPop{0%{transform:scale(0) rotate(-20deg);opacity:0}to{transform:scale(1) rotate(0);opacity:1}}.rank-label{font-family:var(--font-display);font-size:.75rem;letter-spacing:4px;color:#ffffff80;margin-top:8px}.final-score{display:flex;flex-direction:column;align-items:center;gap:8px;opacity:0;transform:translateY(20px);transition:all .5s ease-out}.final-score.visible{opacity:1;transform:translateY(0)}.score-label{font-family:var(--font-display);font-size:.75rem;letter-spacing:4px;color:var(--neon-cyan);text-shadow:0 0 10px var(--neon-cyan)}.score-number{font-family:var(--font-mono);font-size:3.5rem;font-weight:700;color:#fff;text-shadow:0 0 20px rgba(255,255,255,.5),0 0 40px var(--neon-cyan)}.stats-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:16px;width:100%;padding:20px;background:#ffffff05;border:1px solid rgba(255,255,255,.1);border-radius:12px}.stat-item{display:flex;flex-direction:column;align-items:center;gap:4px}.stat-num{font-family:var(--font-mono);font-size:1.5rem;font-weight:700;color:#fff}.stat-name{font-family:var(--font-body);font-size:.75rem;color:#ffffff80}.high-score-compare{display:flex;align-items:center;gap:12px;padding:12px 24px;background:#ffffff08;border:1px solid rgba(255,255,255,.1);border-radius:8px}.hsc-label{font-family:var(--font-display);font-size:.75rem;letter-spacing:2px;color:#ffffff80;text-transform:uppercase}.hsc-value{font-family:var(--font-mono);font-size:1.25rem;font-weight:700;color:var(--neon-yellow);text-shadow:0 0 10px var(--neon-yellow)}.game-over-buttons{display:flex;gap:16px;margin-top:16px}.go-button{display:flex;align-items:center;gap:10px;padding:14px 28px;border:none;border-radius:8px;font-family:var(--font-display);font-size:1rem;font-weight:700;letter-spacing:2px;cursor:pointer;transition:all .2s ease}.go-button.primary{background:linear-gradient(135deg,var(--neon-cyan),var(--neon-magenta));color:#fff;box-shadow:0 0 20px #00ffff4d}.go-button.primary:hover{transform:scale(1.05);box-shadow:0 0 30px #00ffff80}.go-button.secondary{background:transparent;border:1px solid rgba(255,255,255,.2);color:#fffc}.go-button.secondary:hover{border-color:#fff6;background:#ffffff0d}.btn-icon{font-size:1.25rem}@media(max-width:500px){.stats-grid{grid-template-columns:repeat(2,1fr)}.game-over-buttons{flex-direction:column;width:100%}.go-button{justify-content:center}}.app{width:100%;height:100vh;overflow:hidden}
