:root{--bg:#040508;--fg:#eef1f6;--muted:#eef1f680;--line:#eef1f629;--mono:"JetBrains Mono", ui-monospace, "SF Mono", Menlo, monospace}*,:before,:after{box-sizing:border-box}html,body{overscroll-behavior:none;background:var(--bg);height:100%;color:var(--fg);font-family:var(--mono);-webkit-font-smoothing:antialiased;-webkit-user-select:none;user-select:none;margin:0;overflow:hidden}#world{touch-action:none;outline:none;width:100%;height:100%;display:block;position:fixed;inset:0}.loader{z-index:20;background:var(--bg);place-items:center;transition:opacity 1.2s,visibility 1.2s;display:grid;position:fixed;inset:0}.loader.is-done{opacity:0;visibility:hidden}.loader__inner{letter-spacing:.3em;text-transform:uppercase;flex-direction:column;align-items:center;gap:18px;font-size:16px;display:flex}.loader__quote{letter-spacing:.12em;max-width:34ch;color:var(--muted);text-align:center;text-transform:lowercase;margin:0 24px 10px;font-size:14px;line-height:1.6}.loader__bar{background:var(--line);width:260px;height:1px;overflow:hidden}.loader__bar span{background:var(--fg);height:100%;box-shadow:0 0 8px var(--fg);transform-origin:0;display:block;transform:scaleX(0)}.loader__pct{color:var(--muted);letter-spacing:.2em;font-variant-numeric:tabular-nums}.loader__error{text-align:center;letter-spacing:.06em;text-transform:none;max-width:34ch;color:var(--muted);line-height:1.8}.loader__error a{color:var(--fg)}.hud{z-index:5;padding:max(20px, env(safe-area-inset-top)) 24px 20px;letter-spacing:.14em;text-transform:uppercase;opacity:0;justify-content:space-between;font-size:14px;transition:opacity 1.2s .4s;display:flex;position:fixed;top:0;left:0;right:0}.hud a{color:var(--muted);text-decoration:none;transition:color .3s}.hud a:hover{color:var(--fg)}.hint{left:50%;bottom:max(76px, calc(env(safe-area-inset-bottom) + 56px));z-index:5;letter-spacing:.12em;text-transform:uppercase;white-space:nowrap;color:var(--muted);opacity:0;font-size:13px;transition:opacity 1s .8s;position:fixed;transform:translate(-50%)}.hint.is-hidden{transition-delay:0s;opacity:0!important}.hint__keys{align-items:center;gap:14px;display:flex}.hint__touch{display:none}.keys{grid-template-rows:repeat(2,32px);grid-template-columns:repeat(3,32px);gap:5px;display:grid}.key{border:1px solid var(--line);height:32px;color:var(--fg);border-radius:5px;place-items:center;font-size:13px;transition:background .15s,color .15s,box-shadow .15s;display:grid}.key--w{grid-column:2}.key--a{grid-area:2/1}.key--d{grid-area:2/3}.key.is-down{background:var(--fg);color:var(--bg);box-shadow:0 0 12px #eef1f680}body.is-ready .hud,body.is-ready .hint{opacity:1}.links{right:24px;bottom:max(28px, env(safe-area-inset-bottom));z-index:5;letter-spacing:.12em;text-transform:uppercase;opacity:0;gap:22px;font-size:14px;transition:opacity 1.2s .6s;display:flex;position:fixed}.links a{color:var(--muted);text-decoration:none;transition:color .3s}.links a:hover{color:var(--fg)}body.is-ready .links{opacity:1}[data-clock]{color:var(--muted);font-variant-numeric:tabular-nums}.music{left:50%;bottom:max(17px, env(safe-area-inset-bottom));z-index:5;-webkit-backdrop-filter:blur(4px);backdrop-filter:blur(4px);width:38px;height:38px;color:var(--fg);cursor:pointer;opacity:0;background:#eef1f60a;border:1px solid #eef1f647;border-radius:50%;place-items:center;padding:0;transition:opacity 1.2s .6s,border-color .3s,background .3s;display:grid;position:fixed;transform:translate(-50%)}.music:hover{background:#eef1f61a;border-color:#eef1f699}.music.is-on{border-color:#eef1f629}.music:focus-visible{outline:1px solid var(--fg);outline-offset:4px}.music.is-error{color:var(--muted);cursor:default}body.is-ready .music:not(.is-touched):after{content:"";border:1px solid var(--fg);border-radius:inherit;opacity:0;pointer-events:none;animation:3.2s ease-out 2.5s 3 music-invite;position:absolute;inset:-1px}@keyframes music-invite{0%{opacity:.55;transform:scale(1)}70%,to{opacity:0;transform:scale(1.6)}}.music__icon{width:18px;height:18px}.music__bars{align-items:flex-end;gap:3px;height:12px;display:none}.music.is-on .music__icon{display:none}.music.is-on .music__bars{display:flex}.music__bars i{transform-origin:bottom;background:currentColor;width:2px;height:100%;transform:scaleY(.15)}.music__label{clip-path:inset(50%);white-space:nowrap;width:1px;height:1px;position:absolute;overflow:hidden}body.is-ready .music{opacity:1}@media (prefers-reduced-motion:reduce){body.is-ready .music:not(.is-touched):after{animation:none}}.nudge{left:24px;bottom:max(28px, env(safe-area-inset-bottom));z-index:5;letter-spacing:.12em;text-transform:uppercase;white-space:nowrap;color:var(--muted);pointer-events:none;opacity:0;margin:0;font-size:13px;transition:opacity .8s;position:fixed}.nudge.is-showing{opacity:1}.joystick{left:max(28px, env(safe-area-inset-left));bottom:max(40px, env(safe-area-inset-bottom));z-index:6;border:1px solid var(--line);-webkit-backdrop-filter:blur(4px);backdrop-filter:blur(4px);touch-action:none;opacity:0;background:#eef1f608;border-radius:50%;width:128px;height:128px;transition:opacity 1s .6s;display:none;position:fixed}.joystick__knob{background:#eef1f6d9;border-radius:50%;width:50px;height:50px;margin:-25px 0 0 -25px;transition:transform .2s ease-out;position:absolute;top:50%;left:50%;box-shadow:0 0 18px #eef1f68c}.joystick.is-active .joystick__knob{transition:none}@media (pointer:coarse){.joystick{display:block}body.is-ready .joystick{opacity:1}.hint{bottom:max(196px, calc(env(safe-area-inset-bottom) + 160px));left:max(28px, env(safe-area-inset-left));transform:none}.hint__keys{display:none}.hint__touch{display:block}.links{right:20px;bottom:max(52px, calc(env(safe-area-inset-bottom) + 24px));flex-direction:column;align-items:flex-end;gap:12px}.nudge{left:calc(max(28px, env(safe-area-inset-left)) + 64px);bottom:max(14px, calc(env(safe-area-inset-bottom) - 20px));letter-spacing:.1em;font-size:11px;transform:translate(-50%)}.music{left:calc(max(28px, env(safe-area-inset-left)) + 128px + 12px);bottom:max(40px, env(safe-area-inset-bottom));width:48px;height:48px;transform:none}.music__icon{width:20px;height:20px}.music__bars{height:14px}.music__bars i{width:2.5px}}
