:root{--color-space-dark: #0a0a0f;--color-space-medium: #1a1a2e;--color-space-accent: #16213e;--color-electric-blue: #007bff;--color-cyan: #00ffff;--color-warning: #ff6b6b;--color-success: #4ecdc4;--color-ship: #00ff00;--color-trajectory: rgba(0, 255, 255, .5);--color-gravity-standard: #4a69bd;--color-gravity-repulsor: #e74c3c;--color-gravity-wormhole: #9b59b6;--color-text-primary: #ffffff;--color-text-secondary: rgba(255, 255, 255, .7);--color-text-dim: rgba(255, 255, 255, .3);font-family:Inter,system-ui,-apple-system,sans-serif;font-size:16px;line-height:1.5;font-weight:400;color:var(--color-text-primary);background-color:var(--color-space-dark);font-synthesis:none;text-rendering:optimizeLegibility;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale}*{box-sizing:border-box;margin:0;padding:0}body{margin:0;min-width:320px;min-height:100vh;overflow:hidden}#root{width:100%;height:100vh}h1,h2,h3,h4,h5,h6{font-weight:600;line-height:1.2}h1{font-size:2.5rem}h2{font-size:2rem}h3{font-size:1.5rem}button{border-radius:4px;border:1px solid transparent;padding:.6em 1.2em;font-size:1em;font-weight:500;font-family:inherit;background-color:var(--color-space-medium);color:var(--color-text-primary);cursor:pointer;transition:all .2s ease}button:hover{background-color:var(--color-space-accent);border-color:var(--color-electric-blue)}button:focus,button:focus-visible{outline:2px solid var(--color-electric-blue);outline-offset:2px}button:active{transform:translateY(1px)}.text-secondary{color:var(--color-text-secondary)}.text-dim{color:var(--color-text-dim)}.glow{filter:drop-shadow(0 0 10px currentColor)}.pulse{animation:pulse 2s ease-in-out infinite}@keyframes pulse{0%,to{opacity:1}50%{opacity:.5}}.game-canvas{cursor:crosshair;display:block;position:absolute;top:0;left:0}.hud-container{position:absolute;top:0;left:0;width:100%;height:100%;pointer-events:none;z-index:10;font-family:Courier New,Courier,monospace}.hud-container.no-animation .hud-element{animation:none!important;transition:none!important}.hud-element{position:absolute;color:#f0f0ff;text-shadow:0 0 5px rgba(240,240,255,.5);animation:hudFadeIn .5s ease-out;pointer-events:none}.fuel-gauge{background:#0a0a0fcc;border:1px solid rgba(128,0,255,.3);border-radius:8px;padding:12px 16px;backdrop-filter:blur(10px);min-width:200px}.fuel-label{font-size:12px;letter-spacing:2px;margin-bottom:8px;color:#8000ff;font-weight:700}.fuel-bar-container{position:relative;width:100%;height:24px;background:#8000ff1a;border:1px solid rgba(128,0,255,.4);border-radius:4px;overflow:hidden}.fuel-bar{position:absolute;top:0;left:0;height:100%;transition:width .3s ease-out,background-color .3s ease-out;background:linear-gradient(90deg,#00ff80cc,#00ff80);box-shadow:0 0 10px currentColor}.fuel-text{position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);font-size:14px;font-weight:700;z-index:1;mix-blend-mode:screen}.wells-counter{background:#0a0a0fcc;border:1px solid rgba(0,255,255,.3);border-radius:8px;padding:12px 16px;backdrop-filter:blur(10px);min-width:120px}.wells-label{font-size:12px;letter-spacing:2px;margin-bottom:4px;color:#0ff;font-weight:700}.wells-display{font-size:24px;font-weight:700;display:flex;align-items:center;gap:4px}.wells-current{color:#0ff;text-shadow:0 0 10px rgba(0,255,255,.8)}.wells-divider{color:#f0f0ff66;font-size:20px}.wells-max{color:#f0f0ff99;font-size:20px}.wells-par{font-size:11px;color:#f0f0ff80;margin-top:4px}.timer{background:#0a0a0fcc;border:1px solid rgba(255,215,0,.3);border-radius:8px;padding:12px 24px;backdrop-filter:blur(10px);text-align:center}.timer-label{font-size:12px;letter-spacing:2px;margin-bottom:4px;color:gold;font-weight:700}.timer-display{font-size:28px;font-weight:700;color:#f0f0ff;font-variant-numeric:tabular-nums;text-shadow:0 0 10px rgba(255,215,0,.5)}.star-rating{background:#0a0a0fcc;border:1px solid rgba(255,215,0,.3);border-radius:8px;padding:12px 16px;backdrop-filter:blur(10px);text-align:center}.stars-container{display:flex;gap:4px;justify-content:center;margin-bottom:8px}.star{font-size:24px;transition:all .3s ease}.star-filled{color:gold;text-shadow:0 0 15px rgba(255,215,0,.8);animation:starPulse 2s ease-in-out infinite}.star-empty{color:#ffd70033}.star-criteria{display:flex;gap:8px;font-size:10px;justify-content:center}.criterion{padding:2px 6px;border-radius:3px;background:#ffd7001a;color:#f0f0ff66;transition:all .3s ease}.criterion.met{background:#ffd7004d;color:gold;text-shadow:0 0 5px rgba(255,215,0,.5)}.level-info{background:#0a0a0fe6;border:2px solid rgba(128,0,255,.4);border-radius:12px;padding:16px 32px;backdrop-filter:blur(15px);text-align:center;transform:translate(-50%);transition:opacity 1s ease-out}.level-info.fade-out{opacity:0}.level-name{font-size:24px;font-weight:700;color:#8000ff;text-shadow:0 0 20px rgba(128,0,255,.8);margin-bottom:8px;letter-spacing:2px}.level-objective{font-size:14px;color:#f0f0ffcc;font-style:italic}.pause-indicator{position:fixed;top:50%;left:50%;transform:translate(-50%,-50%);background:#0a0a0ff2;border:2px solid #8000ff;border-radius:16px;padding:32px 48px;text-align:center;animation:pausePulse 2s ease-in-out infinite}.pause-icon{font-size:48px;color:#8000ff;margin-bottom:16px;text-shadow:0 0 30px rgba(128,0,255,.8)}.pause-text{font-size:28px;font-weight:700;color:#f0f0ff;letter-spacing:4px;margin-bottom:12px}.pause-hint{font-size:14px;color:#f0f0ff99}.level-complete-overlay{position:fixed;top:0;left:0;width:100%;height:100%;background:#0a0a0fcc;display:flex;align-items:center;justify-content:center;animation:overlayFadeIn .5s ease-out;pointer-events:all;cursor:pointer}.complete-content{background:#0a0a0ff2;border:3px solid #ffd700;border-radius:24px;padding:48px 64px;text-align:center;animation:completeSlideIn .8s ease-out;box-shadow:0 0 50px #ffd70080}.complete-title{font-size:36px;color:gold;text-shadow:0 0 30px rgba(255,215,0,.8);margin-bottom:24px;letter-spacing:3px;animation:titleGlow 2s ease-in-out infinite}.complete-stars{display:flex;gap:16px;justify-content:center;margin-bottom:32px}.star-large{font-size:64px;transition:all .5s ease;animation:starRotate 3s linear infinite}.complete-stats{margin-bottom:24px}.stat-row{display:flex;justify-content:space-between;align-items:center;padding:8px 0;font-size:18px;border-bottom:1px solid rgba(255,215,0,.2)}.stat-label{color:#f0f0ffb3}.stat-value{color:#f0f0ff;font-weight:700;text-shadow:0 0 10px rgba(240,240,255,.5)}.complete-hint{font-size:14px;color:#f0f0ff80;font-style:italic;animation:hintBlink 2s ease-in-out infinite}.game-over-overlay{position:fixed;top:0;left:0;width:100%;height:100%;background:#0a0a0fe6;display:flex;align-items:center;justify-content:center;animation:overlayFadeIn .5s ease-out}.game-over-content{background:#0a0a0ff2;border:3px solid #ff0040;border-radius:24px;padding:48px 64px;text-align:center;animation:gameOverShake .5s ease-out;box-shadow:0 0 50px #ff004080}.game-over-title{font-size:36px;color:#ff0040;text-shadow:0 0 30px rgba(255,0,64,.8);margin-bottom:16px;letter-spacing:3px}.game-over-reason{font-size:20px;color:#f0f0ffcc;margin-bottom:24px}.game-over-hint{font-size:16px;color:#f0f0ff80;font-style:italic;animation:hintBlink 2s ease-in-out infinite}@keyframes hudFadeIn{0%{opacity:0;transform:translateY(-10px)}to{opacity:1;transform:translateY(0)}}@keyframes starPulse{0%,to{transform:scale(1)}50%{transform:scale(1.1)}}@keyframes pausePulse{0%,to{box-shadow:0 0 20px #8000ff80}50%{box-shadow:0 0 40px #8000ffcc}}@keyframes overlayFadeIn{0%{opacity:0}to{opacity:1}}@keyframes completeSlideIn{0%{transform:scale(.8) translateY(50px);opacity:0}to{transform:scale(1) translateY(0);opacity:1}}@keyframes titleGlow{0%,to{text-shadow:0 0 30px rgba(255,215,0,.8)}50%{text-shadow:0 0 50px rgba(255,215,0,1)}}@keyframes starRotate{0%{transform:rotate(0)}to{transform:rotate(360deg)}}@keyframes hintBlink{0%,to{opacity:.5}50%{opacity:.8}}@keyframes gameOverShake{0%,to{transform:translate(0)}25%{transform:translate(-10px)}75%{transform:translate(10px)}}@media (max-width: 768px){.fuel-gauge{min-width:160px}.fuel-label,.wells-label,.timer-label{font-size:10px}.timer-display{font-size:24px}.wells-display{font-size:20px}.complete-title,.game-over-title{font-size:28px}.star-large{font-size:48px}}@keyframes fadeInOut{0%{opacity:0;transform:translate(-50%) translateY(10px)}20%{opacity:1;transform:translate(-50%) translateY(0)}80%{opacity:1;transform:translate(-50%) translateY(0)}to{opacity:0;transform:translate(-50%) translateY(-10px)}}@media (prefers-contrast: high){.hud-element,.fuel-bar-container,.criterion{border-width:2px}.fuel-text{font-weight:900;-webkit-text-stroke:1px black}}.charge-indicator{pointer-events:none;filter:drop-shadow(0 0 10px rgba(100,200,255,.5));animation:chargeGlow 2s ease-in-out infinite}.charge-indicator svg{transform:translateZ(0);will-change:transform}@keyframes chargeGlow{0%,to{filter:drop-shadow(0 0 10px rgba(100,200,255,.5))}50%{filter:drop-shadow(0 0 20px rgba(100,200,255,.8))}}.hud-element{transform:translateZ(0);backface-visibility:hidden}.fuel-bar{transform:translateZ(0);will-change:width,background-color}.timer-display,.wells-current,.fuel-text{font-variant-numeric:tabular-nums;letter-spacing:.05em}.hud-cosmic-minimalist{position:absolute;top:0;left:0;width:100%;height:100%;pointer-events:none;font-family:SF Mono,Monaco,Inconsolata,Fira Code,monospace;font-size:11px;letter-spacing:.5px}.edge-bar{position:absolute;background:#6060801a;overflow:hidden}.edge-bar-fill{position:absolute;transition:all .3s ease-out}.edge-bar.top{top:0;left:0;right:0;height:2px}.edge-bar.right{top:0;right:0;bottom:0;width:2px}.edge-bar.bottom{bottom:0;left:0;right:0;height:2px}.edge-bar.left{top:0;left:0;bottom:0;width:2px}.corner-status{position:absolute;display:flex;align-items:center;gap:8px;padding:12px;font-size:10px;color:#f0f0ff;text-shadow:0 0 2px rgba(0,0,0,.5)}.status-dot{width:6px;height:6px;border-radius:50%;background:currentColor;box-shadow:0 0 4px currentColor}.corner-status.top-left{top:0;left:0}.corner-status.top-right{top:0;right:0;flex-direction:row-reverse}.corner-status.bottom-left{bottom:0;left:0}.corner-status.bottom-right{bottom:0;right:0;flex-direction:row-reverse}.center-reticle{position:absolute;top:50%;left:50%;transform:translate(-50%,-50%)}.center-reticle svg{filter:drop-shadow(0 0 2px rgba(240,240,255,.3))}.achievement-toast{position:absolute;left:20px;top:50%;transform:translateY(-50%);padding:16px 24px;background:#0a0a0fcc;backdrop-filter:blur(10px);border:1px solid rgba(240,240,255,.1);border-radius:4px;color:#f0f0ff;box-shadow:0 4px 16px #0000004d}.achievement-title{font-size:14px;font-weight:600;margin-bottom:4px}.achievement-subtitle{font-size:11px;color:#606080}.level-progression{position:absolute;bottom:20px;left:50%;transform:translate(-50%);display:flex;gap:8px}.progression-dot{width:4px;height:4px;border-radius:50%;background:#6060804d;transition:all .3s ease-out}.progression-dot.filled{background:#00ff80;box-shadow:0 0 4px #00ff80}.cosmic-overlay{position:absolute;top:0;left:0;width:100%;height:100%;display:flex;align-items:center;justify-content:center;background:#0a0a0ff2;backdrop-filter:blur(20px)}.cosmic-overlay-content{text-align:center;color:#f0f0ff;padding:40px}.cosmic-title{font-size:24px;font-weight:200;letter-spacing:4px;margin-bottom:20px;text-transform:uppercase}.cosmic-subtitle{font-size:12px;color:#606080;margin-top:20px}.cosmic-stars{display:flex;justify-content:center;gap:16px;margin:20px 0;font-size:32px}.cosmic-stats{margin-top:30px;font-size:11px;color:#606080}.cosmic-stat-row{display:flex;justify-content:center;gap:40px;margin:8px 0}.cosmic-stat-label{text-align:right;width:100px}.cosmic-stat-value{text-align:left;width:100px;color:#f0f0ff;font-weight:600}@keyframes pulse{0%,to{opacity:.8}50%{opacity:1}}@keyframes rotate{0%{transform:translate(-50%,-50%) rotate(0)}to{transform:translate(-50%,-50%) rotate(360deg)}}.star-criteria{display:flex;gap:12px;font-size:10px;color:#606080}.star-criteria .criterion{transition:all .3s ease}.star-criteria .criterion.met{color:#00ff80;text-shadow:0 0 4px #00ff80}.fps-counter{position:fixed;background:#0a0a0fd9;border:1px solid rgba(100,200,255,.3);border-radius:8px;padding:8px 12px;font-family:Courier New,monospace;font-size:14px;color:#f0f0ff;backdrop-filter:blur(10px);z-index:100;pointer-events:none;transition:all .3s cubic-bezier(.4,0,.2,1);min-width:80px}.fps-main{display:flex;align-items:baseline;gap:6px;justify-content:center}.fps-value{font-size:24px;font-weight:700;text-shadow:0 0 10px currentColor;font-variant-numeric:tabular-nums;transition:color .3s ease}.fps-label{font-size:12px;color:#f0f0ffb3;letter-spacing:1px}.fps-counter.detailed{min-width:140px;padding:12px 16px}.fps-details{margin-top:8px;padding-top:8px;border-top:1px solid rgba(100,200,255,.2)}.fps-detail-row{display:flex;justify-content:space-between;align-items:center;margin-bottom:4px;font-size:11px}.detail-label{color:#f0f0ff99;font-size:10px;text-transform:uppercase;letter-spacing:.5px}.detail-value{color:#f0f0ff;font-weight:700;font-variant-numeric:tabular-nums}.fps-graph{margin-top:8px;padding-top:8px;border-top:1px solid rgba(100,200,255,.2);height:40px;position:relative;overflow:hidden}.fps-graph-svg{display:block;width:100%;height:100%}.fps-counter:hover{background:#0a0a0ff2;border-color:#64c8ff80;box-shadow:0 0 20px #64c8ff33}.fps-value.warning{animation:fpsPulse 1s ease-in-out infinite}@keyframes fpsPulse{0%,to{opacity:1}50%{opacity:.7}}.fps-counter:not(.detailed){background:#0a0a0fb3;padding:6px 10px;border-radius:6px}.fps-counter:not(.detailed) .fps-main{flex-direction:row}.fps-counter:not(.detailed) .fps-value{font-size:18px}@media (prefers-reduced-motion: reduce){.fps-value,.fps-counter{transition:none}@keyframes fpsPulse{0%,to{opacity:1}}}@media (max-width: 768px){.fps-counter{transform:scale(.85);transform-origin:bottom right}.fps-counter.detailed{min-width:120px}}.performance-settings-overlay{position:fixed;top:0;left:0;width:100%;height:100%;background:#000c;display:flex;align-items:center;justify-content:center;z-index:1000;animation:fadeIn .3s ease-out;backdrop-filter:blur(5px)}.performance-settings-panel{background:linear-gradient(135deg,#0a0a0f,#1a1a2e);border:2px solid rgba(100,200,255,.3);border-radius:16px;padding:32px;max-width:600px;width:90%;max-height:90vh;overflow-y:auto;box-shadow:0 0 50px #64c8ff33;animation:slideIn .3s ease-out}.settings-header{display:flex;justify-content:space-between;align-items:center;margin-bottom:24px}.settings-header h2{margin:0;color:#64c8ff;font-size:28px;font-family:Courier New,monospace;text-shadow:0 0 20px rgba(100,200,255,.5)}.close-button{background:none;border:none;color:#ff6b6b;font-size:32px;cursor:pointer;padding:0;width:40px;height:40px;display:flex;align-items:center;justify-content:center;border-radius:50%;transition:all .3s ease}.close-button:hover{background:#ff6b6b33;transform:scale(1.1)}.performance-metrics{background:#00000080;border:1px solid rgba(100,200,255,.2);border-radius:8px;padding:16px;margin-bottom:24px;display:flex;justify-content:space-around;gap:24px}.metric-item{display:flex;flex-direction:column;align-items:center;gap:8px}.metric-label{color:#f0f0ffb3;font-size:12px;text-transform:uppercase;letter-spacing:1px}.metric-value{font-size:24px;font-weight:700;font-family:Courier New,monospace;text-shadow:0 0 10px currentColor}.quality-presets{margin-bottom:24px}.quality-presets h3{color:#f0f0ff;font-size:18px;margin-bottom:16px;font-family:Courier New,monospace}.preset-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(120px,1fr));gap:12px}.preset-button{background:#64c8ff1a;border:2px solid rgba(100,200,255,.3);border-radius:8px;padding:16px;cursor:pointer;transition:all .3s cubic-bezier(.4,0,.2,1);color:#f0f0ff;text-align:center}.preset-button:hover{background:#64c8ff33;border-color:#64c8ff80;transform:translateY(-2px);box-shadow:0 4px 20px #64c8ff4d}.preset-button.active{background:#64c8ff4d;border-color:#64c8ff;box-shadow:0 0 20px #64c8ff80}.preset-name{font-size:16px;font-weight:700;margin-bottom:4px}.preset-description{font-size:11px;color:#f0f0ffb3;line-height:1.3}.performance-recommendation{background:#ffd7001a;border:1px solid rgba(255,215,0,.3);border-radius:8px;padding:12px 16px;margin-bottom:24px;display:flex;align-items:center;gap:12px;animation:pulse 2s ease-in-out infinite}.recommendation-icon{font-size:20px}.advanced-toggle{background:none;border:none;color:#64c8ff;font-size:16px;cursor:pointer;padding:8px 0;margin-bottom:16px;font-family:Courier New,monospace;transition:color .3s ease;display:flex;align-items:center;gap:8px}.advanced-toggle:hover{color:#96dcff}.advanced-settings{background:#0000004d;border:1px solid rgba(100,200,255,.2);border-radius:8px;padding:20px;margin-bottom:24px;animation:expandIn .3s ease-out}.setting-group{margin-bottom:20px;display:grid;grid-template-columns:200px 1fr auto;align-items:center;gap:16px}.setting-label{color:#f0f0ff;font-size:14px;display:flex;align-items:center;gap:8px;cursor:pointer}.setting-label input[type=checkbox]{width:18px;height:18px;cursor:pointer;accent-color:#64c8ff}.setting-info{color:#f0f0ff99;font-size:12px;font-style:italic}.setting-select{background:#64c8ff1a;border:1px solid rgba(100,200,255,.3);border-radius:4px;padding:8px 12px;color:#f0f0ff;font-family:Courier New,monospace;cursor:pointer;transition:all .3s ease}.setting-select:hover{background:#64c8ff33;border-color:#64c8ff80}.setting-select:focus{outline:none;border-color:#64c8ff;box-shadow:0 0 10px #64c8ff4d}.setting-slider{width:100%;height:6px;background:#64c8ff33;border-radius:3px;outline:none;-webkit-appearance:none;cursor:pointer}.setting-slider::-webkit-slider-thumb{-webkit-appearance:none;appearance:none;width:16px;height:16px;background:#64c8ff;border-radius:50%;cursor:pointer;transition:all .3s ease;box-shadow:0 0 10px #64c8ff80}.setting-slider::-webkit-slider-thumb:hover{transform:scale(1.2);box-shadow:0 0 20px #64c8ffcc}.setting-slider::-moz-range-thumb{width:16px;height:16px;background:#64c8ff;border-radius:50%;cursor:pointer;transition:all .3s ease;border:none;box-shadow:0 0 10px #64c8ff80}.setting-value{color:#64c8ff;font-weight:700;font-family:Courier New,monospace;min-width:50px;text-align:right}.settings-footer{display:flex;justify-content:center;margin-top:24px}.apply-button{background:linear-gradient(135deg,#64c8ff,#4a9eff);border:none;border-radius:8px;padding:12px 48px;color:#0a0a0f;font-size:16px;font-weight:700;font-family:Courier New,monospace;cursor:pointer;transition:all .3s cubic-bezier(.4,0,.2,1);text-transform:uppercase;letter-spacing:2px;box-shadow:0 4px 20px #64c8ff4d}.apply-button:hover{transform:translateY(-2px);box-shadow:0 6px 30px #64c8ff80}.apply-button:active{transform:translateY(0)}@keyframes slideIn{0%{transform:translateY(-20px);opacity:0}to{transform:translateY(0);opacity:1}}@keyframes expandIn{0%{max-height:0;opacity:0}to{max-height:1000px;opacity:1}}@keyframes pulse{0%,to{box-shadow:0 0 10px #ffd7004d}50%{box-shadow:0 0 20px #ffd70080}}.performance-settings-panel::-webkit-scrollbar{width:8px}.performance-settings-panel::-webkit-scrollbar-track{background:#64c8ff1a;border-radius:4px}.performance-settings-panel::-webkit-scrollbar-thumb{background:#64c8ff4d;border-radius:4px}.performance-settings-panel::-webkit-scrollbar-thumb:hover{background:#64c8ff80}@media (max-width: 600px){.performance-settings-panel{padding:20px;max-width:95%}.preset-grid{grid-template-columns:1fr 1fr}.setting-group{grid-template-columns:1fr;gap:8px}.performance-metrics{flex-direction:column;gap:16px}.metric-item{flex-direction:row;justify-content:space-between;width:100%}}.game-container{position:fixed;top:0;left:0;width:100vw;height:100vh;background-color:#0a0a0f;overflow:hidden}.main-menu{position:fixed;top:0;left:0;width:100%;height:100%;display:flex;align-items:center;justify-content:center;overflow:hidden;font-family:Courier New,Courier,monospace}.menu-background{position:absolute;top:0;left:0;width:100%;height:100%;background:#0a0a0f;overflow:hidden}.stars-layer-1,.stars-layer-2,.stars-layer-3{position:absolute;width:200%;height:200%;background-repeat:repeat;animation:drift linear infinite}.stars-layer-1{background-image:radial-gradient(1px 1px at 20px 30px,#f0f0ff,transparent),radial-gradient(1px 1px at 40px 70px,#f0f0ff,transparent),radial-gradient(1px 1px at 80px 10px,#f0f0ff,transparent);background-size:200px 200px;animation-duration:120s;opacity:.8}.stars-layer-2{background-image:radial-gradient(2px 2px at 60px 50px,#8000ff,transparent),radial-gradient(1px 1px at 90px 90px,#8000ff,transparent),radial-gradient(2px 2px at 130px 20px,#8000ff,transparent);background-size:300px 300px;animation-duration:180s;opacity:.5}.stars-layer-3{background-image:radial-gradient(1px 1px at 50px 100px,#ffd700,transparent),radial-gradient(1px 1px at 150px 50px,#ffd700,transparent);background-size:400px 400px;animation-duration:240s;opacity:.3}@keyframes drift{0%{transform:translate(0)}to{transform:translate(-100%,-100%)}}.nebula-overlay{position:absolute;width:100%;height:100%;background:radial-gradient(ellipse at center,rgba(128,0,255,.1) 0%,transparent 50%);animation:nebulaPulse 20s ease-in-out infinite}@keyframes nebulaPulse{0%,to{opacity:.3;transform:scale(1)}50%{opacity:.5;transform:scale(1.1)}}.menu-content{position:relative;z-index:10;text-align:center;max-width:600px;width:90%;animation:menuFadeIn 1s ease-out}@keyframes menuFadeIn{0%{opacity:0;transform:translateY(20px)}to{opacity:1;transform:translateY(0)}}.game-title{margin-bottom:60px;animation:titleGlow 4s ease-in-out infinite}.title-main{font-size:72px;font-weight:700;color:#f0f0ff;text-shadow:0 0 20px rgba(128,0,255,.8),0 0 40px rgba(128,0,255,.6),0 0 60px rgba(128,0,255,.4);letter-spacing:8px;margin:0 0 16px;transform:perspective(500px) rotateX(15deg)}.title-subtitle{font-size:18px;color:#f0f0ffcc;letter-spacing:2px;margin:0;font-style:italic}@keyframes titleGlow{0%,to{text-shadow:0 0 20px rgba(128,0,255,.8),0 0 40px rgba(128,0,255,.6),0 0 60px rgba(128,0,255,.4)}50%{text-shadow:0 0 30px rgba(128,0,255,1),0 0 60px rgba(128,0,255,.8),0 0 90px rgba(128,0,255,.6)}}.menu-options{display:flex;flex-direction:column;gap:16px;margin-bottom:60px}.menu-button{position:relative;background:#0a0a0fcc;border:2px solid rgba(128,0,255,.3);border-radius:8px;padding:20px 40px;color:#f0f0ff;font-family:inherit;cursor:pointer;transition:all .3s cubic-bezier(.4,0,.2,1);overflow:hidden;backdrop-filter:blur(10px)}.menu-button:before{content:"";position:absolute;top:0;left:-100%;width:100%;height:100%;background:linear-gradient(90deg,transparent,rgba(128,0,255,.2),transparent);transition:left .5s ease}.menu-button:hover:before{left:100%}.menu-button:hover{border-color:#8000ff99;background:#0a0a0fe6;transform:translateY(-2px);box-shadow:0 4px 20px #8000ff66,0 0 40px #8000ff33}.menu-button:active{transform:translateY(0);box-shadow:0 2px 10px #8000ff66,0 0 20px #8000ff33}.menu-button.primary{border-color:#ffd70066;background:#0a0a0fe6}.menu-button.primary:before{background:linear-gradient(90deg,transparent,rgba(255,215,0,.2),transparent)}.menu-button.primary:hover{border-color:#ffd70099;box-shadow:0 4px 20px #ffd70066,0 0 40px #ffd70033}.menu-button.temporal-mode{border-color:#00ffff4d;position:relative}.menu-button.temporal-mode:before{background:linear-gradient(90deg,transparent,rgba(0,255,255,.2),transparent)}.menu-button.temporal-mode:hover{border-color:#0ff9;box-shadow:0 4px 20px #0ff6,0 0 40px #0ff3}.menu-button.temporal-mode.active{border-color:#00ffff80;background:#00ffff1a}.menu-button.temporal-mode.active:after{content:"";position:absolute;inset:-2px;background:linear-gradient(45deg,transparent,rgba(0,255,255,.4),transparent);border-radius:8px;opacity:0;animation:temporal-pulse 2s ease-in-out infinite;z-index:-1}@keyframes temporal-pulse{0%,to{opacity:0;transform:scale(1)}50%{opacity:1;transform:scale(1.05)}}.mode-badge{display:inline-block;margin-left:8px;padding:2px 8px;background:#0ff3;border:1px solid rgba(0,255,255,.4);border-radius:12px;font-size:12px;font-weight:400;vertical-align:middle}.button-text{display:block;font-size:24px;font-weight:700;letter-spacing:3px;text-transform:uppercase;margin-bottom:4px}.button-hint{display:block;font-size:14px;color:#f0f0ff99;letter-spacing:1px}.menu-footer{position:absolute;bottom:-100px;left:50%;transform:translate(-50%);text-align:center;width:100%}.control-hint{font-size:16px;color:#f0f0ff99;margin:0 0 8px;animation:hintPulse 3s ease-in-out infinite}@keyframes hintPulse{0%,to{opacity:.6}50%{opacity:.9}}.version{font-size:12px;color:#f0f0ff4d;margin:0}@media (max-width: 768px){.title-main{font-size:48px;letter-spacing:4px}.title-subtitle{font-size:16px}.menu-button{padding:16px 32px}.button-text{font-size:20px}.button-hint{font-size:12px}}@media (max-width: 480px){.title-main{font-size:36px;letter-spacing:2px}.title-subtitle{font-size:14px}.menu-button{padding:14px 24px}.button-text{font-size:18px}}@media (prefers-reduced-motion: reduce){.stars-layer-1,.stars-layer-2,.stars-layer-3,.nebula-overlay,.menu-content,.game-title,.control-hint{animation:none}.menu-button:before{display:none}.menu-button{transition:border-color .2s,background-color .2s}}.level-select{position:fixed;top:0;left:0;width:100%;height:100%;overflow:hidden;font-family:Courier New,Courier,monospace}.level-select-background{position:absolute;top:0;left:0;width:100%;height:100%;background:#0a0a0f}.level-select-content{position:relative;z-index:10;width:100%;height:100%;display:flex;flex-direction:column;padding:20px;box-sizing:border-box;overflow-y:auto}.level-select-header{display:flex;align-items:center;margin-bottom:40px;animation:slideInTop .5s ease-out}@keyframes slideInTop{0%{opacity:0;transform:translateY(-20px)}to{opacity:1;transform:translateY(0)}}.back-button{background:#0a0a0fcc;border:1px solid rgba(128,0,255,.3);border-radius:6px;color:#f0f0ff;padding:10px 20px;font-size:16px;cursor:pointer;transition:all .3s cubic-bezier(.4,0,.2,1);font-family:inherit;backdrop-filter:blur(10px)}.back-button:hover{border-color:#8000ff99;background:#0a0a0fe6;transform:translate(-2px)}.level-select-title{flex:1;text-align:center;font-size:48px;color:#f0f0ff;text-shadow:0 0 20px rgba(128,0,255,.6);letter-spacing:4px;margin:0}.chapter-tabs{display:flex;justify-content:center;gap:20px;margin-bottom:40px;flex-wrap:wrap;animation:fadeIn .6s ease-out .1s both}@keyframes fadeIn{0%{opacity:0}to{opacity:1}}.chapter-tab{background:#0a0a0f99;border:2px solid rgba(128,0,255,.2);border-radius:8px;padding:12px 24px;color:#f0f0ffb3;font-size:16px;font-family:inherit;cursor:pointer;transition:all .3s cubic-bezier(.4,0,.2,1);backdrop-filter:blur(5px)}.chapter-tab:hover{border-color:#8000ff66;color:#f0f0ff;background:#0a0a0fcc}.chapter-tab.active{border-color:#ffd70099;color:gold;background:#0a0a0fe6;box-shadow:0 0 20px #ffd7004d}.level-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(300px,1fr));gap:20px;margin-bottom:40px;animation:slideInBottom .6s ease-out .2s both}@keyframes slideInBottom{0%{opacity:0;transform:translateY(20px)}to{opacity:1;transform:translateY(0)}}.level-card{position:relative;background:#0a0a0fcc;border:2px solid rgba(128,0,255,.3);border-radius:12px;padding:24px;cursor:pointer;transition:all .3s cubic-bezier(.4,0,.2,1);overflow:hidden;backdrop-filter:blur(10px);font-family:inherit;text-align:left}.level-card:before{content:"";position:absolute;top:0;left:-100%;width:100%;height:100%;background:linear-gradient(90deg,transparent,rgba(128,0,255,.1),transparent);transition:left .6s ease}.level-card:not(.locked):hover:before{left:100%}.level-card:not(.locked):hover{border-color:#8000ff99;transform:translateY(-4px);box-shadow:0 8px 24px #8000ff4d,0 0 40px #8000ff1a}.level-card.completed{border-color:#00ff804d}.level-card.completed:hover{border-color:#00ff8099;box-shadow:0 8px 24px #00ff804d,0 0 40px #00ff801a}.level-card.locked{opacity:.5;cursor:not-allowed}.level-card.locked:hover{transform:none;border-color:#8000ff4d}.level-icon{position:absolute;top:16px;right:16px;width:40px;height:40px;display:flex;align-items:center;justify-content:center;font-size:24px;font-weight:700;color:#8000ff;background:#8000ff1a;border-radius:50%;border:2px solid rgba(128,0,255,.3)}.level-card.completed .level-icon{color:#00ff80;background:#00ff801a;border-color:#00ff804d}.level-name{font-size:24px;color:#f0f0ff;margin:0 0 8px;letter-spacing:1px}.level-description{font-size:14px;color:#f0f0ffb3;margin:0 0 16px;line-height:1.4}.level-stars{display:flex;gap:4px;margin-bottom:12px}.star{font-size:20px;transition:all .3s ease}.star.filled{color:gold;text-shadow:0 0 10px rgba(255,215,0,.6)}.star.empty{color:#ffd70033}.level-par{display:flex;gap:16px;font-size:12px;color:#f0f0ff99}.par-item{display:flex;gap:4px}.par-label{opacity:.7}.par-value{color:#8000ff;font-weight:700}.chapter-progress{margin-top:auto;padding-top:20px;text-align:center;animation:fadeIn .6s ease-out .3s both}.progress-bar{width:100%;max-width:500px;height:8px;background:#8000ff1a;border-radius:4px;margin:0 auto 12px;overflow:hidden}.progress-fill{height:100%;background:linear-gradient(90deg,#8000ff,gold);border-radius:4px;transition:width .5s cubic-bezier(.4,0,.2,1);box-shadow:0 0 10px #8000ff99}.progress-text{font-size:14px;color:#f0f0ffb3;margin:0}.level-mode-toggle{display:flex;gap:4px;background:#0a0a0f99;border:1px solid rgba(128,0,255,.3);border-radius:20px;padding:4px;margin-left:auto}.mode-tab{background:transparent;border:none;color:#f0f0ff99;font-family:inherit;font-size:14px;padding:8px 16px;border-radius:16px;cursor:pointer;transition:all .3s ease;position:relative}.mode-tab:hover{color:#f0f0ffcc}.mode-tab.active{background:#8000ff33;color:#f0f0ff}.mode-tab.active:last-child{background:#0ff3}.echo-count{display:inline-block;margin-left:6px;padding:2px 6px;background:#0ff3;border-radius:10px;font-size:12px;font-weight:700}.temporal-info{margin-top:12px;padding-top:12px;border-top:1px solid rgba(0,255,255,.2)}.echo-requirement{display:flex;align-items:center;gap:8px;color:#0ffc;font-size:14px}.echo-icon{font-size:18px}.echo-label{color:#f0f0ff99}.echo-value{font-weight:700;color:#0ff}.echo-stats{display:flex;flex-direction:column;gap:4px;margin-top:8px;font-size:12px;color:#f0f0ff99}.stat-item{display:flex;justify-content:space-between}.level-card.temporal{border-color:#00ffff4d}.level-card.temporal:hover{border-color:#0ff9;box-shadow:0 4px 20px #00ffff4d,inset 0 0 20px #00ffff1a}@media (max-width: 768px){.level-select-content{padding:16px}.level-select-title{font-size:32px}.chapter-tab{padding:10px 16px;font-size:14px}.level-grid{grid-template-columns:1fr;gap:16px}.level-card{padding:20px}.level-name{font-size:20px}}@media (prefers-reduced-motion: reduce){.level-select-header,.chapter-tabs,.level-grid,.chapter-progress{animation:none}.level-card:before{display:none}.level-card,.chapter-tab,.back-button{transition:border-color .2s,background-color .2s,opacity .2s}}.settings{position:fixed;top:0;left:0;width:100%;height:100%;overflow:hidden;font-family:Courier New,Courier,monospace}.settings-background{position:absolute;top:0;left:0;width:100%;height:100%;background:#0a0a0f}.settings-content{position:relative;z-index:10;width:100%;height:100%;display:flex;flex-direction:column;padding:20px;box-sizing:border-box;overflow-y:auto;max-width:800px;margin:0 auto}.settings-header{display:flex;align-items:center;margin-bottom:40px;animation:slideInTop .5s ease-out}.settings-title{flex:1;text-align:center;font-size:48px;color:#f0f0ff;text-shadow:0 0 20px rgba(128,0,255,.6);letter-spacing:4px;margin:0}.settings-sections{flex:1;display:flex;flex-direction:column;gap:40px;animation:fadeIn .6s ease-out .1s both}.settings-section{background:#0a0a0fcc;border:1px solid rgba(128,0,255,.3);border-radius:12px;padding:24px;backdrop-filter:blur(10px)}.section-title{font-size:24px;color:#8000ff;margin:0 0 20px;letter-spacing:2px;text-shadow:0 0 10px rgba(128,0,255,.5)}.setting-option{display:flex;flex-direction:column;margin-bottom:20px;cursor:pointer;padding:12px;border-radius:8px;transition:background-color .3s ease}.setting-option:hover{background:#8000ff0d}.option-label{font-size:18px;color:#f0f0ff;margin-bottom:8px;font-weight:700;display:flex;align-items:center;gap:12px}.option-checkbox{width:24px;height:24px;cursor:pointer;accent-color:#8000ff;margin-left:auto}.option-description{font-size:14px;color:#f0f0ff99;line-height:1.4;margin-left:36px}.hud-selector{cursor:default;padding:16px}.hud-selector:hover{background:none}.hud-selector-controls{display:flex;align-items:center;gap:20px;margin-top:12px}.hud-selector-arrow{background:#8000ff33;border:1px solid rgba(128,0,255,.4);border-radius:8px;width:48px;height:48px;font-size:24px;color:#f0f0ff;cursor:pointer;transition:all .3s ease;display:flex;align-items:center;justify-content:center}.hud-selector-arrow:hover{background:#8000ff4d;border-color:#8000ff99;box-shadow:0 0 15px #8000ff80;transform:scale(1.05)}.hud-selector-arrow:active{transform:scale(.95)}.hud-selector-display{flex:1;text-align:center;min-width:300px}.hud-variant-name{font-size:20px;font-weight:700;color:#f0f0ff;margin-bottom:8px;text-shadow:0 0 10px rgba(128,0,255,.5)}.hud-variant-description{font-size:14px;color:#f0f0ffb3;line-height:1.4}.controls-info{display:flex;flex-direction:column;gap:16px}.control-item{display:flex;align-items:center;gap:16px}.control-key{background:#8000ff33;border:1px solid rgba(128,0,255,.4);border-radius:6px;padding:8px 16px;font-size:16px;font-weight:700;color:#f0f0ff;min-width:100px;text-align:center}.control-action{font-size:16px;color:#f0f0ffcc}.temporal-settings{border:1px solid rgba(0,255,255,.2);background:#00ffff0d}.temporal-settings .section-title{color:#00ffffe6}.intensity-slider{width:200px;height:4px;background:#8000ff33;border-radius:2px;outline:none;cursor:pointer;-webkit-appearance:none;appearance:none}.intensity-slider::-webkit-slider-thumb{-webkit-appearance:none;appearance:none;width:16px;height:16px;background:#0ffc;border-radius:50%;cursor:pointer;transition:all .2s ease}.intensity-slider::-webkit-slider-thumb:hover{transform:scale(1.2);background:#0ff;box-shadow:0 0 10px #0ff9}.intensity-slider::-moz-range-thumb{width:16px;height:16px;background:#0ffc;border-radius:50%;cursor:pointer;border:none;transition:all .2s ease}.intensity-value{display:inline-block;min-width:40px;margin-left:12px;color:#00ffffe6;font-weight:700}.settings-footer{margin-top:40px;text-align:center;animation:fadeIn .6s ease-out .2s both}.settings-note{font-size:14px;color:#f0f0ff80;font-style:italic}input[type=checkbox]{appearance:none;-webkit-appearance:none;-moz-appearance:none;width:24px;height:24px;border:2px solid rgba(128,0,255,.4);border-radius:4px;background:#0a0a0f99;cursor:pointer;position:relative;transition:all .3s ease}input[type=checkbox]:checked{background:#8000ff;border-color:#8000ff}input[type=checkbox]:checked:after{content:"✓";position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);color:#0a0a0f;font-size:16px;font-weight:700}input[type=checkbox]:hover{border-color:#8000ff99;box-shadow:0 0 10px #8000ff4d}.quality-selector{display:flex;flex-direction:column;gap:12px}.quality-dropdown{background:#0a0a0fcc;border:2px solid rgba(128,0,255,.4);border-radius:8px;color:#f0f0ff;font-size:16px;font-family:Courier New,Courier,monospace;padding:12px 48px 12px 16px;cursor:pointer;transition:all .3s ease;appearance:none;-webkit-appearance:none;-moz-appearance:none;background-image:url("data:image/svg+xml;charset=UTF-8,%3csvg width='14' height='8' viewBox='0 0 14 8' fill='none' xmlns='http://www.w3.org/2000/svg'%3e%3cpath d='M1 1L7 7L13 1' stroke='%238000ff' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'/%3e%3c/svg%3e");background-repeat:no-repeat;background-position:right 16px center;width:100%;max-width:300px}.quality-dropdown:hover{border-color:#8000ff99;box-shadow:0 0 15px #8000ff4d}.quality-dropdown:focus{outline:none;border-color:#8000ff;box-shadow:0 0 20px #8000ff80}.quality-dropdown:focus-visible{outline:2px solid #8000ff;outline-offset:2px}.quality-dropdown option{background:#0a0a0f;color:#f0f0ff;padding:8px}@media (max-width: 768px){.settings-content{padding:16px}.settings-title{font-size:32px}.settings-section{padding:20px}.section-title{font-size:20px}.option-label{font-size:16px}.control-key{min-width:80px;font-size:14px;padding:6px 12px}.control-action{font-size:14px}.hud-selector-arrow{width:40px;height:40px;font-size:20px}.hud-selector-display{min-width:200px}.hud-variant-name{font-size:18px}.hud-variant-description{font-size:12px}.quality-dropdown{font-size:14px;padding:10px 44px 10px 14px}}.performance-settings-button{width:100%;padding:12px 24px;background:linear-gradient(135deg,#64c8ff1a,#64c8ff33);border:2px solid rgba(100,200,255,.4);border-radius:8px;color:#64c8ff;font-family:Courier New,monospace;font-size:16px;font-weight:700;text-transform:uppercase;letter-spacing:1px;cursor:pointer;transition:all .3s cubic-bezier(.4,0,.2,1);margin-top:16px}.performance-settings-button:hover{background:linear-gradient(135deg,#64c8ff33,#64c8ff4d);border-color:#64c8ff;transform:translateY(-2px);box-shadow:0 4px 20px #64c8ff4d}.performance-settings-button:active{transform:translateY(0)}@media (prefers-reduced-motion: reduce){.settings-header,.settings-sections,.settings-footer{animation:none}.setting-option,input[type=checkbox],.performance-settings-button{transition:none}}.credits{position:fixed;top:0;left:0;width:100%;height:100%;overflow:hidden;font-family:Courier New,Courier,monospace}.credits-background{position:absolute;top:0;left:0;width:100%;height:100%;background:#0a0a0f}.credits-content{position:relative;z-index:10;width:100%;height:100%;display:flex;flex-direction:column;padding:20px;box-sizing:border-box}.credits-header{margin-bottom:20px;animation:fadeIn .5s ease-out}.credits-scroll{flex:1;overflow-y:auto;display:flex;flex-direction:column;align-items:center;padding:40px 20px;animation:scrollUp 30s linear infinite;animation-play-state:paused}.credits-scroll:hover{animation-play-state:paused}@keyframes scrollUp{0%{transform:translateY(0)}to{transform:translateY(-100%)}}.credits-section{text-align:center;margin-bottom:60px;max-width:600px;animation:fadeInUp 1s ease-out;animation-fill-mode:both}.credits-section:nth-child(1){animation-delay:.1s}.credits-section:nth-child(2){animation-delay:.2s}.credits-section:nth-child(3){animation-delay:.3s}.credits-section:nth-child(4){animation-delay:.4s}.credits-section:nth-child(5){animation-delay:.5s}.credits-section:nth-child(6){animation-delay:.6s}.credits-section:nth-child(7){animation-delay:.7s}@keyframes fadeInUp{0%{opacity:0;transform:translateY(20px)}to{opacity:1;transform:translateY(0)}}.credits-title{font-size:48px;color:#f0f0ff;text-shadow:0 0 30px rgba(128,0,255,.8);letter-spacing:6px;margin:0 0 16px;animation:titlePulse 4s ease-in-out infinite}@keyframes titlePulse{0%,to{text-shadow:0 0 30px rgba(128,0,255,.8)}50%{text-shadow:0 0 50px rgba(128,0,255,1)}}.credits-subtitle{font-size:20px;color:#f0f0ffcc;font-style:italic;margin:0;letter-spacing:2px}.section-header{font-size:24px;color:#8000ff;text-transform:uppercase;letter-spacing:3px;margin:0 0 20px;text-shadow:0 0 15px rgba(128,0,255,.6)}.credit-item{font-size:16px;color:#f0f0ffb3;margin:0 0 8px;font-style:italic}.credit-name{font-size:20px;color:#f0f0ff;margin:0 0 8px;font-weight:700;text-shadow:0 0 10px rgba(240,240,255,.5)}.credit-quote{font-size:24px;color:gold;font-style:italic;margin:40px 0 20px;text-shadow:0 0 20px rgba(255,215,0,.6);letter-spacing:1px}.credit-year{font-size:32px;color:#f0f0ff80;font-weight:700;letter-spacing:4px}.credits-section.final{margin-top:80px;margin-bottom:100px}.credits-scroll::-webkit-scrollbar{width:8px}.credits-scroll::-webkit-scrollbar-track{background:#8000ff1a;border-radius:4px}.credits-scroll::-webkit-scrollbar-thumb{background:#8000ff66;border-radius:4px}.credits-scroll::-webkit-scrollbar-thumb:hover{background:#8000ff99}@media (max-width: 768px){.credits-title{font-size:36px;letter-spacing:3px}.credits-subtitle{font-size:16px}.section-header{font-size:20px}.credit-item{font-size:14px}.credit-name{font-size:18px}.credit-quote{font-size:20px}}@media (prefers-reduced-motion: reduce){.credits-scroll,.credits-section,.credits-title{animation:none}}.procedural-generator{position:fixed;inset:0;overflow-y:auto;background:#0a0a0f}.procedural-background{position:fixed;inset:0;pointer-events:none;z-index:0}.procedural-background .stars-layer-1,.procedural-background .stars-layer-2{position:absolute;inset:0;background-image:radial-gradient(2px 2px at 20px 30px,white,transparent),radial-gradient(2px 2px at 40px 70px,white,transparent),radial-gradient(1px 1px at 50px 90px,white,transparent),radial-gradient(1px 1px at 130px 40px,white,transparent),radial-gradient(2px 2px at 80px 10px,white,transparent);background-repeat:repeat;background-size:200px 200px;opacity:.3}.procedural-background .stars-layer-2{background-position:50px 50px;opacity:.2;animation:drift 200s linear infinite}.procedural-background .nebula-overlay{position:absolute;inset:0;background:radial-gradient(ellipse at top left,rgba(138,43,226,.1) 0%,transparent 50%),radial-gradient(ellipse at bottom right,rgba(30,58,138,.1) 0%,transparent 50%)}.procedural-content{position:relative;z-index:1;min-height:100vh;padding:2rem;max-width:1200px;margin:0 auto}.procedural-header{display:flex;align-items:center;gap:2rem;margin-bottom:3rem}.back-button{padding:.75rem 1.5rem;background:#ffffff1a;border:1px solid rgba(255,255,255,.2);border-radius:8px;color:#fff;font-size:1rem;cursor:pointer;transition:all .2s}.back-button:hover{background:#ffffff26;border-color:#ffffff4d;transform:translate(-2px)}.procedural-title{font-size:2.5rem;font-weight:300;color:#fff;text-shadow:0 0 20px rgba(138,43,226,.5);margin:0}section{margin-bottom:3rem}section h3{font-size:1.5rem;font-weight:400;color:#fff;margin-bottom:1rem;text-shadow:0 0 10px rgba(138,43,226,.3)}.difficulty-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(250px,1fr));gap:1.5rem}.difficulty-card{padding:2rem;background:#ffffff0d;border:2px solid rgba(255,255,255,.1);border-radius:12px;cursor:pointer;transition:all .3s;text-align:center}.difficulty-card:hover{background:#ffffff14;border-color:var(--difficulty-color, rgba(255, 255, 255, .2));transform:translateY(-2px);box-shadow:0 8px 24px #0003}.difficulty-card.selected{background:#ffffff1a;border-color:var(--difficulty-color, rgba(255, 255, 255, .5));box-shadow:0 0 20px var(--difficulty-color, rgba(138, 43, 226, .3))}.difficulty-icon{font-size:3rem;margin-bottom:1rem}.difficulty-card h4{font-size:1.25rem;font-weight:500;color:#fff;margin:0 0 .5rem}.difficulty-card p{font-size:.875rem;color:#ffffffb3;margin:0;line-height:1.4}.seed-controls{display:flex;gap:1rem;max-width:500px}.seed-input{flex:1;padding:.75rem 1rem;background:#ffffff0d;border:1px solid rgba(255,255,255,.2);border-radius:8px;color:#fff;font-size:1rem;font-family:Monaco,Courier New,monospace}.seed-input::placeholder{color:#fff6}.seed-input:focus{outline:none;border-color:#8a2be299;background:#ffffff14}.seed-button{padding:.75rem 1.5rem;background:#8a2be233;border:1px solid rgba(138,43,226,.4);border-radius:8px;color:#fff;font-size:.875rem;cursor:pointer;transition:all .2s}.seed-button:hover:not(:disabled){background:#8a2be24d;border-color:#8a2be299}.seed-button:disabled{opacity:.5;cursor:not-allowed}.advanced-toggle{padding:.75rem 1rem;background:transparent;border:1px solid rgba(255,255,255,.2);border-radius:8px;color:#fff;font-size:1rem;cursor:pointer;transition:all .2s;display:flex;align-items:center;gap:.5rem}.advanced-toggle:hover{background:#ffffff0d;border-color:#ffffff4d}.advanced-params{margin-top:1.5rem;padding:1.5rem;background:#ffffff08;border:1px solid rgba(255,255,255,.1);border-radius:12px;display:grid;grid-template-columns:repeat(auto-fit,minmax(200px,1fr));gap:1.5rem}.param-group label{display:flex;flex-direction:column;gap:.5rem;color:#fff}.param-group span{font-size:.875rem;color:#fffc}.param-inputs{display:flex;align-items:center;gap:.5rem}.param-group input{padding:.5rem;background:#ffffff0d;border:1px solid rgba(255,255,255,.2);border-radius:6px;color:#fff;font-size:.875rem;width:80px;text-align:center}.param-group input:focus{outline:none;border-color:#8a2be299;background:#ffffff14}.generate-button{padding:1rem 3rem;background:linear-gradient(135deg,#8b5cf6,#6d28d9);border:none;border-radius:10px;color:#fff;font-size:1.125rem;font-weight:500;cursor:pointer;transition:all .3s;position:relative;overflow:hidden}.generate-button.primary{box-shadow:0 4px 20px #8b5cf64d}.generate-button:hover:not(:disabled){transform:translateY(-2px);box-shadow:0 6px 30px #8b5cf666}.generate-button:disabled{opacity:.7;cursor:not-allowed}.generating{display:flex;align-items:center;gap:.75rem}.spinner{width:20px;height:20px;border:2px solid rgba(255,255,255,.3);border-top-color:#fff;border-radius:50%;animation:spin 1s linear infinite}@keyframes spin{to{transform:rotate(360deg)}}.level-preview{padding:2rem;background:#ffffff0d;border:1px solid rgba(255,255,255,.2);border-radius:12px}.preview-stats{display:grid;grid-template-columns:repeat(auto-fit,minmax(150px,1fr));gap:1.5rem;margin-bottom:2rem}.stat{text-align:center;padding:1rem;background:#ffffff08;border-radius:8px;border:1px solid rgba(255,255,255,.1)}.stat-label{display:block;font-size:.875rem;color:#fff9;margin-bottom:.5rem}.stat-value{display:block;font-size:1.5rem;font-weight:500;color:#fff}.preview-actions{display:flex;gap:1rem;justify-content:center}.action-button{padding:.875rem 2rem;background:#ffffff1a;border:1px solid rgba(255,255,255,.2);border-radius:8px;color:#fff;font-size:1rem;cursor:pointer;transition:all .2s}.action-button:hover{background:#ffffff26;border-color:#ffffff4d;transform:translateY(-1px)}.action-button.play{background:linear-gradient(135deg,#10b981,#059669);border:none;font-weight:500}.action-button.play:hover{box-shadow:0 4px 20px #10b9814d}.action-button.save{background:linear-gradient(135deg,#3b82f6,#2563eb);border:none}.action-button.save:hover{box-shadow:0 4px 20px #3b82f64d}@keyframes drift{0%{transform:translate(0)}to{transform:translate(-200px,-200px)}}@media (max-width: 768px){.procedural-content{padding:1rem}.procedural-header{flex-direction:column;align-items:flex-start;gap:1rem}.procedural-title{font-size:2rem}.difficulty-grid{grid-template-columns:1fr}.seed-controls,.preview-actions{flex-direction:column}.action-button{width:100%}}.audio-demo-container{height:100vh;background:#0a0a0f;color:#e0e0e0;padding:0;overflow-y:auto;overflow-x:hidden;font-family:Space Mono,monospace;position:relative;display:flex;flex-direction:column}.audio-init-overlay{position:fixed;inset:0;background:#000000e6;display:flex;align-items:center;justify-content:center;z-index:1000;cursor:pointer}.init-message{text-align:center;padding:3rem;background:#1e1e28e6;border:2px solid #4a9eff;border-radius:10px;animation:pulse-border 2s ease-in-out infinite}.init-message h2{color:#4a9eff;margin-bottom:1rem}@keyframes pulse-border{0%,to{border-color:#4a9eff}50%{border-color:#8ac7ff}}.audio-demo-header{text-align:center;padding:2rem 2rem 1rem;border-bottom:1px solid rgba(255,255,255,.1);background:#0a0a0f;z-index:10;flex-shrink:0}.audio-demo-header h1{font-size:2.5rem;margin-bottom:.5rem;background:linear-gradient(135deg,#4a9eff,#8ac7ff);-webkit-background-clip:text;-webkit-text-fill-color:transparent}.audio-demo-header p{opacity:.7;font-size:1.1rem}.master-controls{margin:2rem 0;display:flex;justify-content:center;align-items:center}.master-controls label{display:flex;align-items:center;gap:1rem;font-size:1.1rem}.master-controls input[type=range]{width:200px;height:6px;background:#ffffff1a;border-radius:3px;outline:none;-webkit-appearance:none}.master-controls input[type=range]::-webkit-slider-thumb{-webkit-appearance:none;width:20px;height:20px;background:#4a9eff;border-radius:50%;cursor:pointer;transition:transform .2s}.master-controls input[type=range]::-webkit-slider-thumb:hover{transform:scale(1.2)}.master-controls span{min-width:50px;text-align:right}.audio-visualizer{display:flex;justify-content:center;align-items:flex-end;height:60px;gap:2px;margin:2rem auto;max-width:400px}.visualizer-bar{width:10px;background:linear-gradient(to top,#4a9eff,#8ac7ff);border-radius:2px 2px 0 0;transition:height .1s ease-out,opacity .1s ease-out}.audio-demo-content{flex:1;overflow-y:auto;overflow-x:hidden;padding:2rem}.audio-categories{max-width:1200px;margin:0 auto;display:grid;gap:2rem}.audio-category{background:#14141e80;border:1px solid rgba(255,255,255,.1);border-radius:10px;padding:2rem}.audio-category h2{color:#8ac7ff;margin-bottom:.5rem;font-size:1.5rem}.audio-category>p{opacity:.6;margin-bottom:1.5rem}.audio-items{display:grid;grid-template-columns:repeat(auto-fill,minmax(300px,1fr));gap:1.5rem}.audio-item{background:#1e1e2880;border:1px solid rgba(255,255,255,.1);border-radius:8px;padding:1.5rem;transition:all .3s ease;position:relative;overflow:hidden}.audio-item.active{border-color:#4a9eff;box-shadow:0 0 20px #4a9eff4d}.audio-item.active:before{content:"";position:absolute;inset:0;background:radial-gradient(circle at center,rgba(74,158,255,.1),transparent);animation:pulse-bg 2s ease-in-out infinite}@keyframes pulse-bg{0%,to{opacity:0}50%{opacity:1}}.item-header{display:flex;justify-content:space-between;align-items:center;margin-bottom:.5rem}.item-header h3{margin:0;font-size:1.2rem}.item-description{opacity:.6;font-size:.9rem;margin-bottom:1rem}.play-button{width:40px;height:40px;border-radius:50%;border:2px solid #4a9eff;background:#4a9eff1a;color:#4a9eff;font-size:1.2rem;cursor:pointer;transition:all .3s ease;display:flex;align-items:center;justify-content:center}.play-button:hover:not(:disabled){background:#4a9eff33;transform:scale(1.1)}.play-button:disabled{opacity:.3;cursor:not-allowed}.play-button.continuous,.play-button.loop{border-color:#ff9a4a;background:#ff9a4a1a;color:#ff9a4a}.play-button.continuous:hover:not(:disabled),.play-button.loop:hover:not(:disabled){background:#ff9a4a33}.item-params{margin-top:1rem}.param-control{margin-bottom:.5rem}.param-control label{display:flex;align-items:center;gap:.5rem;font-size:.9rem;text-transform:capitalize}.param-control input[type=range]{flex:1;height:4px;background:#ffffff1a;border-radius:2px;outline:none;-webkit-appearance:none}.param-control input[type=range]::-webkit-slider-thumb{-webkit-appearance:none;width:16px;height:16px;background:#8ac7ff;border-radius:50%;cursor:pointer}.param-control span{min-width:40px;text-align:right;opacity:.7}.active-indicator{position:absolute;top:1rem;right:1rem;display:flex;align-items:center;gap:.5rem;font-size:.9rem;color:#4a9eff}.pulse{width:8px;height:8px;background:#4a9eff;border-radius:50%;animation:pulse-dot 1s ease-in-out infinite}@keyframes pulse-dot{0%,to{transform:scale(1);opacity:1}50%{transform:scale(1.5);opacity:.5}}.audio-demo-footer{margin-top:3rem;padding:2rem;border-top:1px solid rgba(255,255,255,.1);text-align:center;background:#0a0a0f}.back-button{padding:.75rem 2rem;font-size:1rem;background:#ffffff1a;border:1px solid rgba(255,255,255,.2);color:#e0e0e0;border-radius:5px;cursor:pointer;transition:all .3s ease;margin-bottom:1rem}.back-button:hover{background:#fff3;transform:translateY(-2px)}.tech-info{opacity:.6;font-size:.9rem;font-style:italic}@media (max-width: 768px){.audio-demo-content{padding:1rem}.audio-demo-header{padding:1rem 1rem .5rem}.audio-items{grid-template-columns:1fr}.audio-demo-header h1{font-size:2rem}}.app{position:fixed;top:0;left:0;width:100%;height:100vh;overflow:hidden;background-color:#0a0a0f}body{margin:0;padding:0;overflow:hidden}