:root{--color-bg-dark: #0A0E1A;--color-card-dark: #1A1F3A;--color-neon-pink: #FF006E;--color-neon-blue: #00F5FF;--color-neon-green: #39FF14;--color-text-light: #E0E0E0;--color-text-secondary: #6B7280;--font-mono: "JetBrains Mono", "Fira Code", "SF Mono", Menlo, monospace;--font-sans: "Inter", system-ui, sans-serif}body,html,#root{margin:0;padding:0;width:100%;height:100%;overflow:hidden;font-family:var(--font-sans);background-color:var(--color-bg-dark);color:var(--color-text-light);display:flex;justify-content:center;align-items:center;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale}.app-container{position:relative;width:100%;height:100%;display:flex;justify-content:center;align-items:center;background:linear-gradient(to bottom,#0a0e1a,#1a1f3acc,#0a0e1a);overflow:hidden}.cloud-status{position:absolute;top:20px;right:20px;z-index:1000;display:flex;flex-direction:column;align-items:flex-end}.cloud-message{display:flex;align-items:center;padding:8px 15px;border-radius:6px;font-size:.9em;font-weight:500;box-shadow:0 0 10px #00000080;margin-bottom:10px;backdrop-filter:blur(5px);-webkit-backdrop-filter:blur(5px)}.cloud-message .icon{width:18px;height:18px;margin-right:8px}.cloud-message.success{background-color:#39ff1426;color:var(--color-neon-green);border:1px solid var(--color-neon-green)}.cloud-message.error{background-color:#ff006e26;color:var(--color-neon-pink);border:1px solid var(--color-neon-pink)}.cloud-message.info{background-color:#00f5ff26;color:var(--color-neon-blue);border:1px solid var(--color-neon-blue)}.game-wrapper{position:relative;width:480px;height:640px;border:2px solid var(--color-neon-blue);box-shadow:0 0 20px var(--color-neon-blue),inset 0 0 10px var(--color-neon-blue);background-color:#00000080;overflow:hidden;border-radius:4px}.game-canvas{display:block;width:100%;height:100%;background:repeating-linear-gradient(0deg,rgba(0,245,255,.05),rgba(0,245,255,.05) 1px,transparent 1px,transparent 40px),repeating-linear-gradient(90deg,rgba(0,245,255,.05),rgba(0,245,255,.05) 1px,transparent 1px,transparent 40px),radial-gradient(circle at 50% 50%,#00f5ff1a,#00f5ff00 60%),linear-gradient(to bottom,#0a0e1a,#1a1f3a);background-size:100% 100%,100% 100%,100% 100%,100% 100%;animation:backgroundScroll 30s linear infinite}@keyframes backgroundScroll{0%{background-position:0 0}to{background-position:0 640px}}.start-screen,.game-over-screen,.pause-overlay{position:absolute;top:0;left:0;width:100%;height:100%;display:flex;flex-direction:column;justify-content:center;align-items:center;background-color:#000c;backdrop-filter:blur(3px);-webkit-backdrop-filter:blur(3px);z-index:10;padding:20px;text-align:center}.game-title{font-family:var(--font-mono);font-size:3.5em;color:var(--color-neon-blue);text-shadow:0 0 15px var(--color-neon-blue),0 0 30px var(--color-neon-blue);margin-bottom:20px;letter-spacing:.1em;text-transform:uppercase;position:relative;display:flex;flex-direction:column;line-height:.9}.glitch-text{position:relative;animation:glitch 1s infinite linear alternate-reverse}.glitch-text:nth-child(2){color:var(--color-neon-pink);animation-delay:.1s}@keyframes glitch{0%{text-shadow:.05em 0 0 var(--color-neon-blue),-.05em -.025em 0 var(--color-neon-pink),.025em .05em 0 var(--color-neon-green);transform:translate(.025em,.025em)}14%{text-shadow:.05em 0 0 var(--color-neon-blue),-.05em -.025em 0 var(--color-neon-pink),.025em .05em 0 var(--color-neon-green);transform:translate(.025em,.025em)}15%{text-shadow:-.05em -.025em 0 var(--color-neon-blue),.025em .025em 0 var(--color-neon-pink),-.05em -.05em 0 var(--color-neon-green);transform:translate(-.025em,-.05em)}49%{text-shadow:-.05em -.025em 0 var(--color-neon-blue),.025em .025em 0 var(--color-neon-pink),-.05em -.05em 0 var(--color-neon-green);transform:translate(-.025em,-.05em)}50%{text-shadow:.025em .05em 0 var(--color-neon-blue),.05em 0 0 var(--color-neon-pink),0 -.05em 0 var(--color-neon-green);transform:translate(.05em,.025em)}99%{text-shadow:.025em .05em 0 var(--color-neon-blue),.05em 0 0 var(--color-neon-pink),0 -.05em 0 var(--color-neon-green);transform:translate(.05em,.025em)}to{text-shadow:-.025em 0 0 var(--color-neon-blue),-.025em -.025em 0 var(--color-neon-pink),-.025em -.05em 0 var(--color-neon-green);transform:translate(-.025em,-.025em)}}.instructions{font-size:.9em;color:var(--color-text-secondary);margin-bottom:30px;letter-spacing:.05em;line-height:1.6}.instructions kbd{display:inline-block;padding:3px 6px;border-radius:4px;background-color:#ffffff1a;border:1px solid rgba(255,255,255,.2);box-shadow:0 1px #0003,inset 0 0 0 1px #ffffff0d;font-family:var(--font-mono);font-size:.8em;color:var(--color-text-light);margin:0 2px}.start-button,.restart-button{background:none;border:1px solid var(--color-neon-blue);color:var(--color-neon-blue);padding:12px 25px;font-size:1.2em;font-family:var(--font-mono);cursor:pointer;border-radius:4px;text-transform:uppercase;letter-spacing:.1em;transition:all .3s ease;position:relative;overflow:hidden;box-shadow:0 0 10px #00f5ff80;display:flex;align-items:center;justify-content:center}.start-button:hover:not(:disabled),.restart-button:hover:not(:disabled){background-color:#00f5ff1a;color:var(--color-text-light)}.start-button:disabled{opacity:.5;cursor:not-allowed;box-shadow:none;border-color:var(--color-text-secondary);color:var(--color-text-secondary)}.start-button .pulse-dot{width:8px;height:8px;background-color:var(--color-neon-blue);border-radius:50%;position:absolute;right:10px;animation:pulse 1.5s infinite ease-out}.start-button:disabled .pulse-dot{animation:none;background-color:var(--color-text-secondary)}.restart-button{border-color:var(--color-neon-pink);color:var(--color-neon-pink);box-shadow:0 0 10px #ff006e80;margin-top:20px}.restart-button:hover{background-color:#ff006e1a;color:var(--color-text-light)}.restart-button .icon{margin-right:8px;width:20px;height:20px}@keyframes pulse{0%{transform:scale(.8);opacity:.7}50%{transform:scale(1.2);opacity:1}to{transform:scale(.8);opacity:.7}}.high-score-display{margin-top:20px;font-size:1.1em;color:var(--color-text-light);display:flex;align-items:center;font-family:var(--font-mono);letter-spacing:.05em}.high-score-display .icon{width:20px;height:20px;color:gold;filter:drop-shadow(0 0 5px gold);margin-right:8px}.loading-images{margin-top:30px;font-size:.85em;color:var(--color-text-secondary);display:flex;align-items:center;gap:10px}.loading-spinner{animation:spin 1.5s linear infinite;width:18px;height:18px;color:var(--color-neon-blue)}@keyframes spin{0%{transform:rotate(0)}to{transform:rotate(360deg)}}.game-over-title{font-family:var(--font-mono);font-size:3em;color:var(--color-neon-pink);text-shadow:0 0 15px var(--color-neon-pink),0 0 30px var(--color-neon-pink);margin-bottom:20px;letter-spacing:.1em;text-transform:uppercase}.final-score{font-size:1.5em;color:var(--color-text-light);margin-bottom:10px;font-family:var(--font-mono)}.new-record-badge{background-color:var(--color-neon-green);color:var(--color-bg-dark);padding:4px 8px;border-radius:4px;font-size:.7em;margin-left:10px;font-weight:700;box-shadow:0 0 8px var(--color-neon-green)}.hud{position:absolute;top:0;left:0;width:100%;display:flex;justify-content:space-between;align-items:center;padding:10px 15px;background:linear-gradient(to bottom,#1a1f3acc,#1a1f3a00);font-family:var(--font-mono);font-size:1.1em;color:var(--color-text-light);letter-spacing:.05em;z-index:5}.hud-group{display:flex;align-items:center}.hud-item{display:flex;align-items:center;margin-right:15px}.hud-item:last-child{margin-right:0}.score-display{position:relative}.score-display .score-value{color:var(--color-neon-blue);text-shadow:0 0 5px var(--color-neon-blue);margin-left:5px}.score-pop-animation{position:absolute;color:var(--color-neon-green);font-size:1.2em;font-weight:700;text-shadow:0 0 8px var(--color-neon-green);pointer-events:none;white-space:nowrap;top:-20px;left:50%;transform:translate(-50%)}.life-icon{width:24px;height:24px;color:var(--color-neon-pink);filter:drop-shadow(0 0 5px var(--color-neon-pink));margin-left:5px}.level-display{color:var(--color-neon-green);text-shadow:0 0 5px var(--color-neon-green)}.difficulty-display{color:var(--color-neon-blue);text-shadow:0 0 5px var(--color-neon-blue)}.player-health-bar-container{width:80px;height:8px;background-color:#333c;border-radius:4px;overflow:hidden;position:relative;margin-right:15px;border:1px solid var(--color-text-secondary);box-shadow:0 0 5px #00000080}.player-health-bar-label{position:absolute;left:50%;top:50%;transform:translate(-50%,-50%);font-size:.6em;font-family:var(--font-mono);color:var(--color-text-light);z-index:1;text-shadow:0 0 3px black;letter-spacing:.05em}.player-health-bar-fill{height:100%;background-color:var(--color-neon-green);transition:width .2s ease-out,background-color .2s ease-out;box-shadow:0 0 5px var(--color-neon-green)}.player-health-bar-fill.medium-health{background-color:#ff0;box-shadow:0 0 5px #ff0}.player-health-bar-fill.low-health{background-color:var(--color-neon-pink);box-shadow:0 0 5px var(--color-neon-pink);animation:lowHealthFlash 1s infinite alternate}@keyframes lowHealthFlash{0%{opacity:1}to{opacity:.7}}.player-skin-selector{margin-top:20px;display:flex;flex-direction:column;align-items:center;gap:15px}.player-skin-selector p,.difficulty-selector p{font-family:var(--font-mono);font-size:1em;color:var(--color-text-light);letter-spacing:.05em}.skin-options-container,.difficulty-options-container{display:flex;gap:15px}.skin-option,.difficulty-option{background:none;border:1px solid var(--color-card-dark);border-radius:8px;width:70px;height:70px;display:flex;flex-direction:column;justify-content:center;align-items:center;cursor:pointer;transition:all .2s ease;padding:5px;box-shadow:0 0 5px #0000004d;font-family:var(--font-mono);font-size:.8em;color:var(--color-text-secondary);text-transform:uppercase}.skin-option:hover:not(:disabled),.difficulty-option:hover:not(:disabled){border-color:var(--color-neon-blue);box-shadow:0 0 15px var(--color-neon-blue)}.skin-option.selected{border-color:var(--color-neon-green);box-shadow:0 0 15px var(--color-neon-green),inset 0 0 5px var(--color-neon-green);transform:scale(1.05);color:var(--color-neon-green)}.difficulty-option.selected{border-color:var(--color-neon-blue);box-shadow:0 0 15px var(--color-neon-blue),inset 0 0 5px var(--color-neon-blue);transform:scale(1.05);color:var(--color-neon-blue)}.skin-option:disabled,.difficulty-option:disabled{opacity:.5;cursor:not-allowed;filter:grayscale(100%)}.skin-option img{width:100%;height:100%;object-fit:contain;filter:drop-shadow(0 0 5px rgba(0,245,255,.5))}.skin-option span{font-size:2.5em;filter:drop-shadow(0 0 5px rgba(0,245,255,.5))}.difficulty-icon{width:30px;height:30px;margin-bottom:5px}.difficulty-option:not(.selected) .difficulty-icon{color:var(--color-text-secondary)}.difficulty-option.selected .difficulty-icon{color:var(--color-neon-blue);filter:drop-shadow(0 0 5px var(--color-neon-blue))}.difficulty-selector{margin-bottom:20px;display:flex;flex-direction:column;align-items:center;gap:15px}.pause-overlay{background-color:#000000b3;backdrop-filter:blur(5px);-webkit-backdrop-filter:blur(5px);z-index:11}.pause-text{font-family:var(--font-mono);font-size:2.5em;color:var(--color-neon-blue);text-shadow:0 0 15px var(--color-neon-blue),0 0 30px var(--color-neon-blue);margin-bottom:10px;letter-spacing:.1em;text-transform:uppercase}.pause-hint{font-size:1.1em;color:var(--color-text-secondary);letter-spacing:.05em}.shoot-direction-selector{display:flex;gap:8px;margin-left:20px}.shoot-direction-option{background:none;border:1px solid var(--color-card-dark);border-radius:4px;width:35px;height:35px;display:flex;justify-content:center;align-items:center;cursor:pointer;transition:all .2s ease;font-size:1.2em;color:var(--color-text-secondary);box-shadow:0 0 5px #0000004d}.shoot-direction-option .icon{width:20px;height:20px;color:var(--color-text-secondary);transition:color .2s ease}.shoot-direction-option:hover:not(:disabled){border-color:var(--color-neon-blue);box-shadow:0 0 10px var(--color-neon-blue)}.shoot-direction-option:hover:not(:disabled) .icon{color:var(--color-neon-blue)}.shoot-direction-option.selected{border-color:var(--color-neon-green);box-shadow:0 0 10px var(--color-neon-green),inset 0 0 5px var(--color-neon-green);transform:scale(1.05)}.shoot-direction-option.selected .icon{color:var(--color-neon-green);filter:drop-shadow(0 0 5px var(--color-neon-green))}.shoot-direction-option:disabled{opacity:.6;cursor:not-allowed}@media (max-width: 600px){.game-wrapper{width:100vw;height:calc(100vh - 40px);border-radius:0;border:none;box-shadow:none}.game-title{font-size:2.5em}.start-button,.restart-button{font-size:1em;padding:10px 20px}.hud{font-size:.9em;padding:8px 10px;flex-direction:column;align-items:flex-start}.hud-group{width:100%;justify-content:space-between;margin-bottom:5px}.hud-item{margin-right:0}.player-health-bar-container{width:60px;margin-right:10px}.life-icon{width:20px;height:20px}.skin-option,.difficulty-option{width:60px;height:60px;font-size:.7em}.skin-option span{font-size:2em}.difficulty-icon{width:25px;height:25px}.pause-text{font-size:2em}.shoot-direction-selector{margin-left:0;margin-top:10px;justify-content:center;width:100%}}