@font-face{font-family:Inter;src:url('/assets/InterVariable.woff2') format('woff2');font-weight:100 900;font-display:swap}
:root{color-scheme:dark;font-family:Inter,Arial,sans-serif;--short:min(100vw,calc(100dvh - 100px));--d:calc(var(--short)*.87)}
*{box-sizing:border-box}html,body{margin:0;width:100%;height:100%;overflow:hidden;background:#090909;color:#f5f4f0}button,a{-webkit-tap-highlight-color:transparent}button{font:inherit;color:inherit;cursor:pointer}a{color:inherit}button:focus-visible,a:focus-visible{outline:2px solid #d57837;outline-offset:5px}[hidden]{display:none!important}
#world,#canvas,#transition,#page-shell{position:fixed;inset:0}#canvas{width:100%;height:100%;display:block;touch-action:none}#world-hud{position:absolute;inset:0;pointer-events:none;z-index:2}.hud{position:absolute;transform:translate(-50%,-50%);width:56px;height:56px;padding:13px;border:0;background:none;pointer-events:auto;filter:drop-shadow(0 2px 8px #0008)}.hud img{display:block;width:100%;height:100%;object-fit:contain}.home{left:50%;top:calc(50% - var(--d)/2);width:52px;height:58px}.previous{left:calc(50% - var(--d)/2);top:50%}.next{left:calc(50% + var(--d)/2);top:50%}.enter{left:50%;top:calc(50% + var(--d)/2)}
#hint{position:absolute;bottom:110px;left:50%;transform:translateX(-50%);margin:0;text-transform:uppercase;letter-spacing:.19em;font-size:10px;white-space:nowrap;opacity:.65;text-shadow:0 1px 8px #000}#transition{pointer-events:none;background:#090909;opacity:0;z-index:3}#page-shell{z-index:4;bottom:100px;background:#090909}#page-frame-wrap,.page-frame{width:100%;height:100%;border:0;display:block}.loader{position:absolute;inset:0;display:flex;flex-direction:column;gap:14px;align-items:center;justify-content:center;background:#090909;z-index:5;font-size:12px;letter-spacing:.06em}.pulse{width:7px;height:7px;background:#c47538;transform:rotate(45deg);animation:pulse 1.4s ease infinite}@keyframes pulse{50%{opacity:.2}}
.utility{position:fixed;z-index:12;top:max(14px,env(safe-area-inset-top));min-height:42px;padding:11px 15px;border:1px solid #ffffff1a;background:#111d;backdrop-filter:blur(12px);border-radius:7px;text-decoration:none;font-size:12px;letter-spacing:.04em}.return{left:16px}.original{right:16px;color:#d1d0cc}.pause{position:fixed;bottom:22px;left:22px;z-index:8;border:0;background:none;color:#aaa;font-size:10px;text-transform:uppercase;letter-spacing:.1em;padding:12px}.error-card{position:fixed;z-index:10;left:50%;top:50%;transform:translate(-50%,-50%);width:min(440px,calc(100vw - 36px));padding:28px;background:#141414;border:1px solid #333;border-radius:12px}.error-card h1{font-size:23px;margin:0 0 12px}.error-card p{font-size:14px;line-height:1.6;color:#aaa}.error-card button,.fallback-links a{display:inline-block;padding:12px;margin:5px;border:1px solid #444;background:#202020;border-radius:5px;text-decoration:none}.sr-only{position:absolute;clip:rect(0,0,0,0);width:1px;height:1px;overflow:hidden}
@media(max-width:600px){#page-shell{bottom:94px}.hud{width:48px;height:48px;padding:12px}.home{height:54px}.utility{top:max(10px,env(safe-area-inset-top));padding:10px 12px}.return{left:10px}.original{right:10px}.original span{display:none}.pause{left:8px;bottom:100px;font-size:8px;padding:9px}#hint{bottom:111px;font-size:9px}}
@media(max-height:700px){#hint{display:none}.enter{transform:translate(-50%,-50%) translateX(48px)}}
@media(prefers-reduced-motion:reduce){.pulse{animation:none}}

/* The diamond is measured inside the world viewport, above the shared navigation. */
#world{bottom:100px}#canvas{position:absolute}#hint{display:none}
@media(max-height:700px){.enter{transform:translate(-50%,-50%)}}
