*,*:before,*:after{margin:0;padding:0;box-sizing:border-box}@font-face{font-family:cravelo;src:url(/assets/cravelo-_142S7nW.woff2) format("woff2");font-weight:400;font-style:normal;font-display:swap}@font-face{font-family:strong;src:url(/assets/strong-DELf9G3Z.woff2) format("woff2");font-weight:400;font-style:normal;font-display:swap}html,body{width:100%;height:100%;overflow:hidden;background:#0a1628;font-family:Times New Roman,serif}#game{display:block;width:100vw;height:100vh}#intro-screen{position:fixed;top:0;right:0;bottom:0;left:0;z-index:100;display:flex;align-items:flex-start;justify-content:center;margin-top:65vh;transition:opacity .35s ease,visibility .35s ease;pointer-events:none;mix-blend-mode:plus-lighter}#intro-screen.hidden{opacity:0;visibility:hidden}.intro-content{text-align:center;color:#fff;pointer-events:auto;display:flex;flex-direction:column;align-items:center;gap:0rem}.intro-content h1{font-family:cravelo,serif;font-size:7rem;text-shadow:0 0 10px rgb(5,58,86)}.intro-content p{font-family:strong,serif;font-size:1.1rem;text-align:center;width:18rem;letter-spacing:2.8rem}.button-container{margin-top:1.5rem;width:100%}#play-btn{background-color:transparent;width:100%;border:none;color:#fff;padding:12px 36px;font-family:strong,serif;font-size:1.1rem;letter-spacing:.1em;cursor:pointer;transition:all .2s ease;margin-top:1rem}#play-btn:hover{background:#fff;color:#142e56;transform:translateY(-2px)}.intro-hint{font-size:.8rem;opacity:.4;margin-top:1rem}#hud-instrument{position:fixed;bottom:-70px;left:50%;transform:translate(-50%);width:400px;height:250px;z-index:10;pointer-events:auto;display:flex;flex-direction:column;align-items:center;justify-content:flex-end;opacity:0;transition:opacity 1.5s ease,transform .5s cubic-bezier(.2,.8,.2,1);mix-blend-mode:plus-lighter;cursor:auto}#hud-instrument.visible{opacity:.75}#hud-instrument:hover{transform:translate(-50%) translateY(-45px)}#hud-settings{display:flex;align-items:center;gap:20px;margin-top:-20px;margin-bottom:35px;opacity:0;transition:opacity .4s ease;pointer-events:none}#hud-instrument:hover #hud-settings{opacity:1;pointer-events:auto}#hud-instrument:hover .hud-labels{opacity:1!important}.hud-controls{display:flex;flex-direction:row;align-items:center;justify-content:center;gap:0px}.instructions{color:#ffffffba;font-size:12px;font-weight:400}.key{font-weight:700;opacity:.9}.settings-btn{background:none;border:none;color:#fff;cursor:pointer;padding:8px;opacity:.6;transition:all .2s ease;display:flex;align-items:center;justify-content:center;border-radius:50%}.settings-btn:hover{opacity:1;transform:scale(1.1);background:#ffffff1a}.settings-btn.active{opacity:1;color:#a0d2ff}.settings-btn svg{width:20px;height:20px;filter:drop-shadow(0 2px 4px rgba(0,0,0,.3))}#mute-btn svg{fill:currentColor}.hud-svg{width:100%;height:100%;overflow:visible}.hud-labels{opacity:0!important;position:absolute;bottom:70px;width:100%;display:flex;justify-content:space-between;padding:0 10px;transition:opacity .3s ease}.hud-label{color:#fff6;font-size:12px;font-weight:600;text-align:center;letter-spacing:.05em}.tick-text{fill:#fff9;font-size:8px;font-family:Times New Roman,serif;text-anchor:middle}.compass-text{fill:#fff;font-family:strong,sans-serif!important;font-weight:600;text-anchor:middle;transition:opacity .1s ease,font-size .1s ease}@media(max-width:600px){#hud-instrument{width:300px}}#vignette{position:fixed;top:0;left:0;width:100%;height:100%;pointer-events:none;z-index:9999;background:radial-gradient(circle,transparent 50%,rgba(0,0,0,.45) 120%);mix-blend-mode:overlay}