body{margin:0;overflow:hidden;background-color:#1a1a1a;font-family:Lato,sans-serif}canvas{display:block}#landing-page{position:absolute;top:0;left:0;width:100%;height:100%;background:#0f1419d9;display:flex;align-items:center;justify-content:center;color:#fff;z-index:10;-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px)}.menu-container{display:flex;flex-direction:column;justify-content:center;align-items:center;gap:20px;width:90%;max-width:500px}.content-box{width:100%;text-align:center;border:1px solid rgba(255,255,255,.15);padding:50px 40px;background:#0a0f1480;border-radius:16px;box-shadow:0 30px 60px #0009;backdrop-filter:blur(12px);-webkit-backdrop-filter:blur(12px)}h1{font-family:Cinzel,serif;font-size:3.5rem;margin:0;color:#f0f0f0;font-weight:400;text-shadow:0 10px 30px rgba(0,0,0,.5);letter-spacing:5px;text-transform:uppercase}.separator{width:60px;height:1px;background:#e6c288;margin:20px auto 30px;opacity:.6}.form-group{margin:20px 0;display:flex;flex-direction:column;align-items:center}input[type=text]{padding:10px 0;font-size:1.1rem;border:none;border-bottom:1px solid rgba(255,255,255,.3);background:transparent;color:#fff;text-align:center;font-family:Lato,sans-serif;width:200px;outline:none;transition:.3s;letter-spacing:1px}input[type=text]:focus{border-bottom-color:#e6c288}#play-btn{margin-top:20px;padding:14px 45px;font-size:1.05rem;background:#e6c2880d;color:#e6c288;border:1px solid rgba(230,194,136,.4);border-radius:30px;cursor:pointer;font-family:Lato,sans-serif;transition:all .4s cubic-bezier(.165,.84,.44,1);text-transform:uppercase;letter-spacing:3px;-webkit-backdrop-filter:blur(4px);backdrop-filter:blur(4px)}#play-btn:hover{background:#e6c288;color:#0f1419;box-shadow:0 0 40px #e6c28840;transform:translateY(-3px) scale(1.02);border:1px solid #e6c288}.coming-soon-btn{font-family:Cinzel,serif;font-size:1rem;font-weight:700;color:#ffffff4d;background:#1e2328cc;border:1px solid rgba(255,255,255,.1);border-radius:8px;padding:16px 50px;cursor:not-allowed;letter-spacing:2px;text-transform:uppercase;box-shadow:0 5px 15px #0000004d;margin-top:15px;width:100%}.icon-btn{position:absolute;top:30px;left:40px;font-family:Cinzel,serif;font-size:1.1rem;color:#fdfaf0;background:#0a0f1480;border:1px solid rgba(255,255,255,.2);border-radius:8px;padding:10px 20px;cursor:pointer;-webkit-backdrop-filter:blur(5px);backdrop-filter:blur(5px);transition:all .3s;z-index:30}.icon-btn:hover{background:#e6c2884d;border-color:#e6c288}#settings-modal{position:absolute;top:0;left:0;width:100%;height:100%;background:#0a0f1499;-webkit-backdrop-filter:blur(5px);backdrop-filter:blur(5px);z-index:50;display:flex;align-items:center;justify-content:center;transition:opacity .3s ease}#settings-modal.modal-hidden{opacity:0;pointer-events:none}.parchment-box{background:linear-gradient(to bottom right,#fff,#fdfaf0 50%,#f4ebd8);border:2px solid #d4c6af;border-radius:8px;padding:40px 50px;width:90%;max-width:400px;text-align:center;color:#4a3e2e;box-shadow:0 20px 50px #0009;position:relative;transform:scale(1);transition:transform .3s cubic-bezier(.175,.885,.32,1.275)}#settings-modal.modal-hidden .parchment-box{transform:scale(.9)}.close-btn{position:absolute;top:15px;right:20px;background:none;border:none;font-size:2rem;color:#8c7e6e;cursor:pointer;transition:color .2s;padding:0;line-height:1}.close-btn:hover{color:#5c4a35}.settings-group{margin:25px 0;text-align:left}.settings-group label{display:block;font-family:Cinzel,serif;font-size:1.1rem;color:#7b6243;margin-bottom:15px;text-transform:uppercase}input[type=range]{width:100%;accent-color:#7b6243}.keybind-row{display:flex;justify-content:space-between;align-items:center;margin-bottom:10px;padding-bottom:10px;border-bottom:1px dashed #d4c6af;color:#5c4a35}.keybind-btn{background:#7b62431a;border:1px solid #c2b199;color:#5c4a35;padding:8px 15px;border-radius:6px;font-weight:700;min-width:60px;cursor:pointer;transition:all .2s}.keybind-btn:hover{background:#7b624333;border-color:#7b6243}.keybind-btn.listening{background:#7b6243;color:#fdfaf0;box-shadow:0 0 10px #7b624380;animation:pulse 1s infinite alternate}@keyframes pulse{0%{transform:scale(1)}to{transform:scale(1.05)}}.permanent-info{position:absolute;top:0;right:40px;background:linear-gradient(to bottom right,#fff,#fdfaf0 50%,#f4ebd8);border:2px solid #d4c6af;border-top:none;border-radius:0 0 4px 4px;padding:30px 25px 25px;width:250px;text-align:center;color:#4a3e2e;z-index:20;box-shadow:3px 5px 20px #00000080,inset 0 0 15px #c8b4964d}.permanent-info:after{content:"";position:absolute;bottom:-12px;left:-10px;right:-10px;height:18px;background:linear-gradient(to bottom,#d4c6af,#8c7e6e);border-radius:12px;box-shadow:0 8px 15px #0009,inset 0 2px 4px #ffffff4d;z-index:21}.permanent-info h2{font-family:Cinzel,serif;font-size:1.5rem;margin:0 0 5px;color:#7b6243}.permanent-info .version{font-size:.8rem;color:#8c7e6e;margin:0}.permanent-info .separator{background:#d4c6af;height:1px;width:40px;margin:15px auto}.permanent-info .dev-text{font-size:.9rem;line-height:1.4;color:#5c4a35;margin-bottom:20px}.permanent-info .social-links{display:flex;flex-direction:column;gap:10px}.permanent-info .social-links a{display:block;text-decoration:none;background:#fbf6ec;border:1px solid #d4c6af;color:#5c4a35;padding:10px;border-radius:6px;font-size:.85rem;transition:all .2s;letter-spacing:1px}.permanent-info .social-links a:hover{background:#e8dcc6;transform:translateY(-2px);box-shadow:0 4px 10px #0000001a;border-color:#bfae91}.locked-mode{position:relative;padding:30px 50px;overflow:hidden;transform:scale(.95);border:1px solid rgba(255,255,255,.1);max-width:600px;width:90%;border-radius:16px;-webkit-backface-visibility:hidden;-moz-backface-visibility:hidden;backface-visibility:hidden;-webkit-transform:translate3d(0,0,0);transform:translateZ(0);isolation:isolate}.locked-mode:before{content:"";position:absolute;top:0;left:0;right:0;bottom:0;background-image:url(../assets/locked_mode.png);background-size:cover;background-position:center;filter:blur(8px) grayscale(40%);transform:scale(1.1);z-index:-2}.locked-mode:after{content:"";position:absolute;top:0;left:0;right:0;bottom:0;background:#0a0f14b3;z-index:-1;border-radius:16px}.locked-mode h2{font-family:Cinzel,serif;font-size:1.8rem;color:#ffffffe6;margin:0 0 10px}.loading-wrapper{display:none;width:100%;height:48px;align-items:center;justify-content:center;margin-top:20px;opacity:0;transition:opacity .4s ease}.loading-track{width:200px;height:1px;background:#e6c28826;position:relative;overflow:hidden}.loading-fill{position:absolute;top:0;left:0;width:0%;height:100%;background:#e6c288;box-shadow:0 0 10px #e6c288;transition:width 1.2s cubic-bezier(.25,1,.5,1)}@keyframes fadeInUp{0%{opacity:0;transform:translateY(30px)}to{opacity:1;transform:translateY(0)}}.content-box>*{opacity:0;animation:fadeInUp 1s cubic-bezier(.165,.84,.44,1) forwards}.content-box h1{animation-delay:.1s}.content-box .separator{animation-delay:.3s}.content-box p{animation-delay:.5s}.content-box .form-group{animation-delay:.7s}.content-box #play-btn{animation-delay:.9s}#crosshair{position:absolute;top:50%;left:50%;width:2px;height:2px;background:#ffffff4d;border-radius:50%;transform:translate(-50%,-50%);pointer-events:none;display:none;z-index:10}#fps-counter{position:absolute;top:12px;right:16px;font-family:Lato,monospace;font-size:.75rem;color:#ffffff80;letter-spacing:1px;pointer-events:none;z-index:20;display:none}#compass-container{position:absolute;top:20px;left:50%;transform:translate(-50%);width:300px;height:40px;overflow:hidden;pointer-events:none;z-index:20;-webkit-mask-image:linear-gradient(to right,transparent,black 25%,black 75%,transparent);mask-image:linear-gradient(to right,transparent,black 25%,black 75%,transparent);display:none}#compass-strip{display:flex;flex-direction:row;position:absolute;left:50%;height:100%;will-change:transform}.compass-tick{width:30px;text-align:center;font-family:Cinzel,serif;font-size:1.1rem;font-weight:700;color:#e6c288e6;line-height:40px;text-shadow:0 2px 4px rgba(0,0,0,.8)}#compass-marker{position:absolute;top:-5px;left:50%;transform:translate(-50%);color:#e6c288;font-size:.8rem;text-shadow:0 2px 4px rgba(0,0,0,.8)}#altitude-hud{position:absolute;bottom:20px;left:50%;transform:translate(-50%);font-family:Lato,monospace;font-size:.85rem;color:#e6c288b3;letter-spacing:2px;text-transform:uppercase;pointer-events:none;z-index:20;display:none}#onboarding{position:absolute;bottom:60px;left:50%;transform:translate(-50%);font-family:Cinzel,serif;font-size:.85rem;color:#e6c288d9;letter-spacing:2px;text-align:center;pointer-events:none;z-index:15;display:none;animation:onboardFadeOut 5s ease forwards}@keyframes onboardFadeOut{0%{opacity:0}10%{opacity:1}70%{opacity:1}to{opacity:0}}.onboard-key{display:inline-block;padding:2px 8px;border:1px solid rgba(230,194,136,.4);border-radius:4px;font-size:.8rem;background:#e6c28814}#mobile-warning{display:none;position:fixed;top:0;left:0;width:100%;height:100%;background:#0a0f14;z-index:99999;align-items:center;justify-content:center;color:#fff;text-align:center;padding:20px}#mobile-warning h2{font-family:Cinzel,serif;font-size:1.8rem;color:#7b6243;margin-bottom:20px}#mobile-warning p{font-family:Lato,sans-serif;color:#4a3e2e;line-height:1.6}#mobile-warning .parchment-box{transform:scale(1);margin:0 auto}@media(hover:none)and (pointer:coarse),(max-width:768px){#mobile-warning{display:flex}#landing-page,#crosshair,#onboarding,#compass-container,#altitude-hud,#fps-counter,.permanent-info{display:none!important}canvas{display:none!important}}