@import url('https://fonts.googleapis.com/css2?family=DM+Sans:wght@400;500;600;700&family=Space+Grotesk:wght@400;500;600;700&display=swap');
:root{color-scheme:dark;--lime:#f1b660;--white:#f4eee6;--muted:#c2b5a5}
*{box-sizing:border-box}html,body{margin:0;width:100%;height:100%;overflow:hidden;background:#080e10;color:var(--white);font-family:'DM Sans',Arial,sans-serif}button,a{-webkit-tap-highlight-color:transparent;touch-action:manipulation}button{font:inherit;color:inherit;border:0;background:none;cursor:pointer}button:focus-visible,a:focus-visible{outline:2px solid var(--lime);outline-offset:5px}button:hover{color:var(--lime)}
#experience,#world{position:fixed;inset:0;width:100%;height:100%}#world{display:block;touch-action:none}.sr-only{position:absolute;width:1px;height:1px;overflow:hidden;clip-path:inset(50%)}
.hud{position:absolute;z-index:10;inset:0 0 auto;display:flex;align-items:center;justify-content:flex-end;gap:20px;padding:22px 32px 40px;background:linear-gradient(#071013e8,#07101360 68%,transparent);pointer-events:none}.hud>*{pointer-events:auto}.utilities{display:flex;gap:8px;align-items:center}.utilities button{font-size:13px;font-weight:500;min-height:44px;padding:10px 12px;background:#081216a6;border:1px solid #c7dccd2b;border-radius:5px;white-space:nowrap}.sound-icon{margin-right:7px;letter-spacing:2px;color:var(--lime);font-size:16px}
.side-note{position:absolute;z-index:3;left:30px;top:49%;writing-mode:vertical-rl;transform:rotate(180deg);display:flex;gap:26px;font:10px monospace;letter-spacing:1.5px;color:#b8c6c0;pointer-events:none}.side-note b{font-weight:400}#hint{position:absolute;z-index:10;left:50%;top:92px;transform:translateX(-50%);margin:0;max-width:calc(100% - 36px);width:max-content;padding:8px 14px;border-radius:30px;background:#081216d9;font-size:14px;color:#edf4e9;text-align:center;pointer-events:none}
.cockpit{position:absolute;z-index:10;bottom:0;left:0;right:0;display:grid;grid-template-columns:1fr auto 1fr;gap:20px;align-items:end;padding:38px 32px 22px;background:linear-gradient(transparent,#071013d9 45%,#071013f5);pointer-events:none}.cockpit button{pointer-events:auto}.phase{display:flex;flex-direction:column;gap:7px;padding-bottom:6px}.phase span{font:11px monospace;letter-spacing:1.5px;color:var(--muted)}.phase strong{font:500 14px 'Space Grotesk',Arial,sans-serif}.journey{width:240px;display:flex;align-items:center;flex-direction:column;gap:12px}#enter{font:600 14px 'Space Grotesk',Arial,sans-serif;padding:12px 20px;min-height:44px;border:1px solid #cce7b678;border-radius:4px;background:#0b1718;white-space:nowrap}#enter:hover{background:#173027}#depth{width:100%;height:3px;background:#61797077;overflow:hidden}#depth i{display:block;width:100%;height:100%;background:var(--lime);transform:scaleX(0);transform-origin:left}.footer-tools{justify-self:end;display:flex;align-items:center;gap:12px}.footer-tools button{min-height:44px;padding:10px 3px;font-size:13px}.footer-tools #replay span{font-size:19px;vertical-align:-1px;margin-right:4px}#credits-open{color:var(--muted)}
#loading{position:absolute;inset:0;z-index:50;background:#080e10;display:flex;align-items:center;justify-content:center;flex-direction:column;gap:25px;font:12px monospace;letter-spacing:3px;transition:opacity .4s}#loading.done{opacity:0;pointer-events:none}.boot-mark{font:500 80px 'Space Grotesk',Arial,sans-serif;letter-spacing:-8px;color:var(--lime)}#loading i{height:2px;width:120px;background:linear-gradient(90deg,transparent,var(--lime),transparent);animation:load 1s infinite}
#toast{position:absolute;z-index:20;left:50%;top:92px;transform:translateX(-50%);border:1px solid #d0ff7760;border-radius:5px;padding:10px 18px;background:#091511;color:var(--lime);font-size:14px;opacity:0;pointer-events:none;transition:opacity .2s;max-width:90%;text-align:center}#toast.visible{opacity:1}dialog{width:min(480px,calc(100% - 32px));padding:26px;border:1px solid #79917c;border-radius:7px;background:#101a1b;color:#edf4e9;font:16px/1.6 'DM Sans',Arial,sans-serif}dialog::backdrop{background:#000b}dialog a{color:#d0ff77}dialog button{float:right;padding:8px;border-bottom:1px solid #d0ff77}dialog h2{font:600 28px 'Space Grotesk',Arial,sans-serif}
#fallback{position:absolute;inset:0;background:#071211;z-index:40;display:grid;grid-template-columns:1fr 1fr;align-items:center;padding:8vw;gap:5vw}#fallback[hidden]{display:none}#fallback img{width:100%;border-radius:5px}#fallback p{color:#bbccc4;font-size:16px;line-height:1.7}#fallback h1{font-size:clamp(32px,5vw,68px);line-height:1.1}#fallback button{border:1px solid var(--lime);padding:16px;color:var(--lime)}@keyframes load{50%{opacity:.25}}
@media(max-width:800px){.hud{padding:18px 20px 35px}.brand small{display:none}.brand{font-size:12px;gap:8px}.monogram{font-size:32px}.utilities button{font-size:12px;padding:10px}.side-note{display:none}.cockpit{padding:35px 20px 18px;gap:12px;grid-template-columns:1fr auto}.journey{grid-row:1 / 3;grid-column:2;width:190px;align-self:center}.footer-tools{justify-self:start;gap:14px}.phase{gap:5px;padding:0}.phase strong{font-size:13px}.phase span{font-size:10px}#hint,#toast{top:83px}#enter{font-size:13px;padding:12px 14px}}
@media(max-width:450px){.hud{padding:12px 15px 32px;gap:10px}.brand{gap:5px;font-size:11px;letter-spacing:.5px}.monogram{font-size:30px;margin-right:3px}.utilities{gap:5px}.utilities button{font-size:11px;padding:9px 7px;min-height:40px}.sound-icon{display:none}#hint,#toast{top:73px;font-size:13px}.cockpit{padding:30px 15px 15px;gap:8px}.journey{width:168px}#enter{font-size:12px;padding:12px}.phase strong{font-size:12px}.footer-tools button{font-size:12px}.footer-tools{gap:10px}#fallback{grid-template-columns:1fr;padding:22px;gap:5px;overflow:auto}#fallback img{max-height:40vh;object-fit:contain}}
@media(prefers-reduced-motion:reduce){*{animation:none!important;transition:none!important}}