body{overflow:hidden;font-family:Arial,sans-serif}.game-container{width:100vw;height:100vh;position:relative}.mainMenu{display:flex;flex-direction:column;align-items:center;justify-content:center;height:100vh;background:#0a0a0a;background-image:radial-gradient(ellipse at top,#1a0000 0%,transparent 70%),radial-gradient(ellipse at bottom,#000000 0%,transparent 70%);color:#e0e0e0;position:relative;overflow:hidden}.mainMenu:before{content:"";position:absolute;top:0;left:0;right:0;bottom:0;background-image:radial-gradient(circle at 20% 50%,rgba(139,0,0,.3) 0%,transparent 50%),radial-gradient(circle at 80% 50%,rgba(139,0,0,.3) 0%,transparent 50%),radial-gradient(circle at 40% 20%,rgba(139,0,0,.2) 0%,transparent 40%),radial-gradient(circle at 60% 80%,rgba(139,0,0,.2) 0%,transparent 40%);animation:floatingBlood 20s ease-in-out infinite;opacity:.5}@keyframes floatingBlood{0%,to{transform:translate(0) scale(1)}33%{transform:translate(-20px,-30px) scale(1.1)}66%{transform:translate(20px,20px) scale(.9)}}.title{font-size:4rem;font-weight:700;margin-bottom:1rem;text-transform:uppercase;letter-spacing:3px;color:#b30000;text-shadow:0 0 10px rgba(179,0,0,.8),0 0 20px rgba(179,0,0,.6),0 0 30px rgba(179,0,0,.4),2px 2px 4px rgba(0,0,0,.8);animation:titleGlow 2s ease-in-out infinite alternate;z-index:1}@keyframes titleGlow{0%{text-shadow:0 0 10px rgba(179,0,0,.8),0 0 20px rgba(179,0,0,.6),0 0 30px rgba(179,0,0,.4),2px 2px 4px rgba(0,0,0,.8)}to{text-shadow:0 0 20px rgba(255,0,0,.9),0 0 30px rgba(255,0,0,.7),0 0 40px rgba(255,0,0,.5),2px 2px 6px rgba(0,0,0,.9)}}.subtitle{font-size:1.5rem;margin-bottom:4rem;color:#999;text-transform:uppercase;letter-spacing:2px;z-index:1}.buttonContainer{display:flex;flex-direction:column;gap:1.5rem;z-index:1}.menuButton{padding:1rem 3rem;font-size:1.25rem;font-weight:700;text-transform:uppercase;letter-spacing:1px;border:2px solid transparent;border-radius:4px;cursor:pointer;transition:all .3s ease;position:relative;overflow:hidden;min-width:250px}.menuButton:before{content:"";position:absolute;top:0;left:-100%;width:100%;height:100%;background:#ffffff1a;transition:left .3s ease}.menuButton:hover:before{left:100%}.menuButton:hover{transform:translateY(-2px);box-shadow:0 5px 15px #00000080}.menuButton:active{transform:translateY(0);box-shadow:0 2px 5px #00000080}.menuButton.selected{transform:translateY(-2px);box-shadow:0 5px 15px #00000080}.menuButton.selected:after{content:"▶";position:absolute;left:10px;top:50%;transform:translateY(-50%);color:#dc143c;font-size:1.2rem;animation:pulse 1s ease-in-out infinite}@keyframes pulse{0%,to{opacity:.5}50%{opacity:1}}.startButton{background:linear-gradient(135deg,#8b0000,#dc143c);color:#fff;border-color:#dc143c}.startButton:hover{background:linear-gradient(135deg,#a00000,#ff1744);border-color:#ff1744;box-shadow:0 5px 20px #dc143c80}.settingsButton{background:linear-gradient(135deg,#2c2c2c,#4a4a4a);color:#fff;border-color:#4a4a4a}.settingsButton:hover{background:linear-gradient(135deg,#3c3c3c,#5a5a5a);border-color:#5a5a5a;box-shadow:0 5px 20px #ffffff1a}.scoresButton{background:linear-gradient(135deg,#1a1a1a,#2a2a2a);color:#999;border-color:#2a2a2a}.scoresButton:hover{background:linear-gradient(135deg,#2a2a2a,#3a3a3a);border-color:#3a3a3a;color:#ccc;box-shadow:0 5px 20px #ffffff0d}@media (max-width: 768px){.title{font-size:3rem}.subtitle{font-size:1.2rem}.menuButton{padding:.8rem 2rem;font-size:1rem;min-width:200px}}@media (max-width: 480px){.title{font-size:2rem}.subtitle{font-size:1rem}.menuButton{padding:.7rem 1.5rem;font-size:.9rem;min-width:180px}}.levelSelectContainer{scrollbar-width:thin;scrollbar-color:#00ff00 rgba(0,0,0,.3)}.levelSelectContainer::-webkit-scrollbar{width:8px}.levelSelectContainer::-webkit-scrollbar-track{background:#0000004d;border-radius:4px}.levelSelectContainer::-webkit-scrollbar-thumb{background:#0f0;border-radius:4px}.levelSelectContainer::-webkit-scrollbar-thumb:hover{background:#0c0}.levelSelectItem{transition:all .3s ease;transform:translate(0)}.levelSelectItem:hover{transform:translate(10px);background-color:#ffffff1a!important}.levelSelectItem.selected{transform:translate(15px);box-shadow:0 0 20px #00ff004d}.gameOverScreen{background:#0a0a0a;background-image:radial-gradient(ellipse at center,#1a0000 0%,transparent 70%),linear-gradient(180deg,#000,#1a0000)}.gameOverTitle{color:red;text-shadow:0 0 20px rgba(255,0,0,.8),0 0 40px rgba(255,0,0,.6),0 0 60px rgba(255,0,0,.4),3px 3px 6px rgba(0,0,0,.9);animation:gameOverPulse 1s ease-in-out infinite}@keyframes gameOverPulse{0%,to{transform:scale(1);opacity:.9}50%{transform:scale(1.05);opacity:1}}.levelCompleteScreen{background:#0a0a0a;background-image:radial-gradient(ellipse at center,#001a00 0%,transparent 70%),linear-gradient(180deg,#000,#001a00)}.successTitle{color:#0f0;text-shadow:0 0 20px rgba(0,255,0,.8),0 0 40px rgba(0,255,0,.6),0 0 60px rgba(0,255,0,.4),3px 3px 6px rgba(0,0,0,.9);animation:successPulse 1.5s ease-in-out infinite}@keyframes successPulse{0%,to{transform:scale(1) rotate(0)}25%{transform:scale(1.1) rotate(2deg)}75%{transform:scale(1.1) rotate(-2deg)}}.levelInfo{margin-bottom:2rem;z-index:1}.levelInfo h2{font-size:2rem;color:#ccc;text-transform:uppercase;letter-spacing:2px}.statsContainer{display:flex;flex-direction:column;gap:1rem;margin-bottom:3rem;padding:2rem;background:#00000080;border:2px solid rgba(255,255,255,.1);border-radius:8px;z-index:1}.statItem{display:flex;justify-content:space-between;align-items:center;padding:.5rem 1rem;background:#ffffff0d;border-radius:4px;min-width:300px}.statLabel{font-size:1.2rem;color:#999;text-transform:uppercase;letter-spacing:1px}.statValue{font-size:1.5rem;font-weight:700;color:#fff;text-shadow:0 0 10px rgba(255,255,255,.5)}.menuButtons{display:flex;flex-direction:column;gap:1rem;z-index:1}.primaryButton{background:linear-gradient(135deg,#006400,#0c0);color:#fff;border-color:#0c0}.primaryButton:hover{background:linear-gradient(135deg,green,#0f0);border-color:#0f0;box-shadow:0 5px 20px #00ff0080}.secondaryButton{background:linear-gradient(135deg,#1a1a4d,#33c);color:#fff;border-color:#33c}.secondaryButton:hover{background:linear-gradient(135deg,#2a2a5d,#44d);border-color:#44d;box-shadow:0 5px 20px #4444dd80}.settingsMenu{display:flex;flex-direction:column;align-items:center;min-height:100vh;max-height:100vh;background:#0a0a0a;background-image:radial-gradient(ellipse at top,#1a0000 0%,transparent 70%),radial-gradient(ellipse at bottom,#000000 0%,transparent 70%);color:#e0e0e0;padding:2rem;position:relative;overflow-y:auto;overflow-x:hidden}.settingsTitle{font-size:2.5rem;font-weight:700;margin-bottom:1.5rem;text-transform:uppercase;letter-spacing:3px;color:#b30000;text-shadow:0 0 10px rgba(179,0,0,.8),0 0 20px rgba(179,0,0,.6),2px 2px 4px rgba(0,0,0,.8);flex-shrink:0}.settingsContainer{width:100%;max-width:600px;background:#000c;border:2px solid #2a0000;border-radius:8px;padding:2rem;box-shadow:0 8px 32px #00000080;margin-bottom:1.5rem;flex-shrink:1;overflow-y:auto}.settingsSection{margin-bottom:2.5rem}.settingsSection:last-child{margin-bottom:0}.sectionTitle{font-size:1.5rem;color:#dc143c;margin-bottom:1rem;text-transform:uppercase;letter-spacing:1px;border-bottom:2px solid #2a0000;padding-bottom:.5rem}.settingRow{display:flex;justify-content:space-between;align-items:center;margin-bottom:1.5rem}.settingLabel{font-size:1.1rem;color:#ccc;min-width:150px}.sliderContainer{display:flex;align-items:center;gap:1rem;flex:1;max-width:300px}.volumeSlider{-webkit-appearance:none;-moz-appearance:none;appearance:none;width:100%;height:6px;background:#2a2a2a;outline:none;opacity:.8;transition:opacity .2s;border-radius:3px}.volumeSlider:hover{opacity:1}.volumeSlider::-webkit-slider-thumb{-webkit-appearance:none;-moz-appearance:none;appearance:none;width:20px;height:20px;background:#dc143c;cursor:pointer;border-radius:50%;transition:all .2s ease;box-shadow:0 2px 8px #dc143c80}.volumeSlider::-webkit-slider-thumb:hover{background:#ff1744;transform:scale(1.2);box-shadow:0 2px 12px #ff1744b3}.volumeSlider::-moz-range-thumb{width:20px;height:20px;background:#dc143c;cursor:pointer;border-radius:50%;border:none;transition:all .2s ease;box-shadow:0 2px 8px #dc143c80}.volumeSlider::-moz-range-thumb:hover{background:#ff1744;transform:scale(1.2);box-shadow:0 2px 12px #ff1744b3}.volumeValue{min-width:45px;text-align:right;font-size:1rem;color:#999}.qualityButtons{display:flex;gap:.5rem}.qualityButton{padding:.5rem 1.5rem;background:#2a2a2a;border:2px solid #3a3a3a;color:#999;cursor:pointer;transition:all .3s ease;text-transform:uppercase;font-weight:700;border-radius:4px}.qualityButton:hover{background:#3a3a3a;color:#ccc;border-color:#4a4a4a}.qualityButton.active{background:#dc143c;color:#fff;border-color:#dc143c;box-shadow:0 2px 8px #dc143c80}.controlsList{display:grid;grid-template-columns:repeat(auto-fit,minmax(200px,1fr));gap:1rem}.controlItem{display:flex;justify-content:space-between;padding:.5rem;background:#2a2a2a4d;border-radius:4px}.controlKey{font-weight:700;color:#dc143c;font-family:monospace;font-size:1rem}.controlAction{color:#999;font-size:.9rem}.backButton{padding:1rem 3rem;font-size:1.25rem;font-weight:700;text-transform:uppercase;letter-spacing:1px;background:linear-gradient(135deg,#2c2c2c,#4a4a4a);color:#fff;border:2px solid #4a4a4a;border-radius:4px;cursor:pointer;transition:all .3s ease;position:relative;overflow:hidden;margin-bottom:2rem;flex-shrink:0}.backButton:before{content:"";position:absolute;top:0;left:-100%;width:100%;height:100%;background:#ffffff1a;transition:left .3s ease}.backButton:hover:before{left:100%}.backButton:hover{transform:translateY(-2px);background:linear-gradient(135deg,#3c3c3c,#5a5a5a);border-color:#5a5a5a;box-shadow:0 5px 20px #ffffff1a}@media (max-width: 768px){.settingsTitle{font-size:2rem}.settingsContainer{padding:1.5rem}.sectionTitle{font-size:1.2rem}.settingRow{flex-direction:column;align-items:flex-start;gap:.5rem}.sliderContainer{width:100%;max-width:none}.controlsList{grid-template-columns:1fr}}.pauseOverlay{position:absolute;top:0;left:0;width:100%;height:100%;background-color:#000000d9;display:flex;flex-direction:column;align-items:center;justify-content:center;z-index:1000}.pauseContainer{background:#0a0a0af2;border:2px solid #2a0000;border-radius:8px;padding:3rem;box-shadow:0 8px 32px #000c;text-align:center}.pauseTitle{font-size:3rem;font-weight:700;margin-bottom:2rem;text-transform:uppercase;letter-spacing:4px;color:#dc143c;text-shadow:0 0 10px rgba(220,20,60,.8),0 0 20px rgba(220,20,60,.6),2px 2px 4px rgba(0,0,0,.8);animation:pausePulse 2s ease-in-out infinite}@keyframes pausePulse{0%,to{text-shadow:0 0 10px rgba(220,20,60,.8),0 0 20px rgba(220,20,60,.6),2px 2px 4px rgba(0,0,0,.8)}50%{text-shadow:0 0 15px rgba(255,20,60,.9),0 0 30px rgba(255,20,60,.7),2px 2px 6px rgba(0,0,0,.9)}}.pauseButtonContainer{display:flex;flex-direction:column;gap:1rem}.pauseButton{padding:1rem 3rem;font-size:1.1rem;font-weight:700;text-transform:uppercase;letter-spacing:1px;border:2px solid transparent;border-radius:4px;cursor:pointer;transition:all .3s ease;position:relative;overflow:hidden;min-width:250px}.pauseButton:before{content:"";position:absolute;top:0;left:-100%;width:100%;height:100%;background:#ffffff1a;transition:left .3s ease}.pauseButton:hover:before{left:100%}.pauseButton:hover{transform:translateY(-2px);box-shadow:0 5px 15px #00000080}.pauseButton:active{transform:translateY(0);box-shadow:0 2px 5px #00000080}.pauseButton.selected{transform:translateY(-2px);box-shadow:0 5px 15px #00000080}.pauseButton.selected:after{content:"▶";position:absolute;left:10px;top:50%;transform:translateY(-50%);color:#dc143c;font-size:1rem;animation:pulse 1s ease-in-out infinite}.resumeButton{background:linear-gradient(135deg,#1b5e20,#4caf50);color:#fff;border-color:#4caf50}.resumeButton:hover{background:linear-gradient(135deg,#2e7d32,#66bb6a);border-color:#66bb6a;box-shadow:0 5px 20px #4caf5080}.settingsButtonPause{background:linear-gradient(135deg,#2c2c2c,#4a4a4a);color:#fff;border-color:#4a4a4a}.settingsButtonPause:hover{background:linear-gradient(135deg,#3c3c3c,#5a5a5a);border-color:#5a5a5a;box-shadow:0 5px 20px #ffffff1a}.quitButton{background:linear-gradient(135deg,#8b0000,#dc143c);color:#fff;border-color:#dc143c}.quitButton:hover{background:linear-gradient(135deg,#a00000,#ff1744);border-color:#ff1744;box-shadow:0 5px 20px #dc143c80}.pauseHint{margin-top:2rem;color:#666;font-size:.9rem;text-transform:uppercase;letter-spacing:1px}@media (max-width: 768px){.pauseContainer{padding:2rem}.pauseTitle{font-size:2rem}.pauseButton{padding:.8rem 2rem;font-size:1rem;min-width:200px}}*{margin:0;padding:0;box-sizing:border-box}body{margin:0;padding:0;overflow:hidden;background-color:#000;font-family:-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,Oxygen,Ubuntu,Cantarell,Fira Sans,Droid Sans,Helvetica Neue,sans-serif;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale}#root{width:100vw;height:100vh}
