:root{--vh: 100vh;--font: "Helvetica Neue", "Inter", "Segoe UI", Arial, sans-serif}*{box-sizing:border-box;-webkit-tap-highlight-color:transparent}html,body{margin:0;height:100%;background:#000;color:#fff;overflow:hidden;font-family:var(--font);overscroll-behavior:none;touch-action:none;-webkit-user-select:none;user-select:none}#c{position:fixed;inset:0;width:100vw;height:var(--vh);display:block}#ui{position:fixed;inset:0;pointer-events:none}#ui>*{pointer-events:auto}.hidden{display:none!important}#boot{position:fixed;inset:0;display:grid;place-items:center;background:#000;letter-spacing:.6em;font-weight:200;font-size:14px;transition:opacity .8s;z-index:50}#boot.gone{opacity:0;pointer-events:none}.btn{font:inherit;font-size:13px;letter-spacing:.32em;text-transform:uppercase;color:#000;background:#fff;border:1px solid #fff;padding:14px 0;width:220px;cursor:pointer;transition:all .25s}.btn:hover{background:transparent;color:#fff}.btn.ghost{background:transparent;color:#fff;border-color:#ffffff59}.btn.ghost:hover{border-color:#fff}.screen{position:fixed;inset:0;display:grid;place-items:center}#title{background:radial-gradient(ellipse at 50% 50%,#0000009e,#000000b8 55%,#000000f0);backdrop-filter:blur(3px);-webkit-backdrop-filter:blur(3px)}.t-wrap{text-align:center;animation:rise 1.6s ease both}.t-itia{font-size:clamp(56px,12vw,132px);font-weight:200;letter-spacing:.42em;margin-right:-.42em;line-height:1}.t-rule{width:64px;height:1px;background:#fff;margin:22px auto 18px;opacity:.8}.t-restore{font-size:clamp(13px,2.2vw,18px);letter-spacing:1.1em;margin-right:-1.1em;font-weight:400}.t-menu{margin-top:56px;display:flex;flex-direction:column;gap:12px;align-items:center}.t-foot{position:absolute;bottom:calc(22px + env(safe-area-inset-bottom));width:100%;text-align:center;font-size:11px;letter-spacing:.3em;text-transform:uppercase;opacity:.55}@keyframes rise{0%{opacity:0;transform:translateY(14px);filter:blur(6px)}to{opacity:1;transform:none;filter:none}}#hud{position:fixed;top:calc(18px + env(safe-area-inset-top));left:calc(22px + env(safe-area-inset-left));font-size:15px;letter-spacing:.28em;font-weight:300;pointer-events:none;text-shadow:0 0 12px rgba(0,0,0,.6)}#hud .dia{font-size:18px;color:#ffc23a}#hud .sl{opacity:.45}#hud.bump{animation:bump .5s ease}@keyframes bump{30%{transform:scale(1.18)}}#b-pause{position:fixed;top:calc(12px + env(safe-area-inset-top));right:calc(14px + env(safe-area-inset-right));width:42px;height:42px;border-radius:50%;border:1px solid rgba(255,255,255,.3);background:#00000040;color:#fff;font-size:11px;letter-spacing:-1px;cursor:pointer}#prompt{position:fixed;left:50%;bottom:calc(5% + env(safe-area-inset-bottom));transform:translate(-50%);text-align:center;pointer-events:none;animation:rise .5s ease both}.p-title{font-size:20px;font-weight:300;letter-spacing:.5em;margin-right:-.5em}.p-sub{margin-top:10px;font-size:11px;letter-spacing:.26em;text-transform:uppercase;opacity:.7}.p-act{margin-top:16px;font-size:11px;letter-spacing:.3em;text-transform:uppercase;color:var(--accent)}.key{display:inline-grid;place-items:center;width:24px;height:24px;border:1px solid currentColor;border-radius:4px;margin-right:6px;letter-spacing:0}#hint{position:fixed;left:50%;bottom:calc(26px + env(safe-area-inset-bottom));transform:translate(-50%);font-size:11px;letter-spacing:.3em;text-transform:uppercase;opacity:.75;white-space:nowrap;pointer-events:none;text-shadow:0 0 10px #000;animation:rise .6s ease both}#toast{position:fixed;left:50%;top:22%;transform:translate(-50%);font-size:12px;letter-spacing:.3em;text-transform:uppercase;padding:12px 22px;background:#0000008c;border:1px solid rgba(255,255,255,.18);pointer-events:none;backdrop-filter:blur(6px);-webkit-backdrop-filter:blur(6px);max-width:90vw;text-align:center}#ltitle{position:fixed;inset:0;display:grid;place-content:center;text-align:center;pointer-events:none}#ltitle.anim{animation:lt 4.2s ease both}.lt-t{font-size:clamp(26px,5vw,46px);font-weight:200;letter-spacing:.6em;margin-right:-.6em;text-shadow:0 0 30px rgba(0,0,0,.4)}.lt-s{margin-top:14px;font-size:11px;letter-spacing:.4em;text-transform:uppercase;opacity:.75}@keyframes lt{0%{opacity:0;filter:blur(10px)}20%,70%{opacity:1;filter:none}to{opacity:0;filter:blur(6px)}}.m-box{display:flex;flex-direction:column;gap:12px;align-items:center;padding:40px 44px;background:#000000b8;border:1px solid rgba(255,255,255,.12);backdrop-filter:blur(14px);-webkit-backdrop-filter:blur(14px);max-height:94%;overflow:auto}.m-h{font-size:13px;letter-spacing:.5em;text-transform:uppercase;margin-bottom:14px;opacity:.8}.m-keys{margin-top:14px;font-size:10px;letter-spacing:.14em;opacity:.5;text-align:center;max-width:300px;line-height:1.8}.row{width:260px;display:flex;justify-content:space-between;align-items:center;font-size:11px;letter-spacing:.25em;text-transform:uppercase;padding:8px 0;border-bottom:1px solid rgba(255,255,255,.1)}.row select{background:#000;color:#fff;border:1px solid rgba(255,255,255,.3);font:inherit;padding:4px}.row input[type=range]{width:110px;accent-color:#fff}#pause,#settings,#complete{background:#00000059}#settings{z-index:5}.c-box{min-width:320px}.c-k{font-size:11px;letter-spacing:.6em;color:#ffc23a}.c-t{font-size:28px;font-weight:200;letter-spacing:.5em;margin:4px -.5em 18px 0}.c-stats{width:100%;margin-bottom:18px}.c-stats div{display:flex;justify-content:space-between;font-size:11px;letter-spacing:.2em;text-transform:uppercase;padding:9px 0;border-bottom:1px solid rgba(255,255,255,.1)}.c-stats b{font-weight:400}#fade{position:fixed;inset:0;background:#000;opacity:0;pointer-events:none;z-index:20}#portalfx{position:fixed;inset:0;pointer-events:none;z-index:21;opacity:0}#portalfx .pf-img{position:absolute;inset:-10%;background-size:cover;background-position:center;transform:scale(.35);filter:saturate(1.4) blur(2px);clip-path:circle(0% at 50% 50%)}#portalfx.on{opacity:1}#portalfx.on .pf-img{animation:pin 1.1s cubic-bezier(.6,0,.2,1) forwards}#portalfx.out{animation:pout .9s ease forwards}@keyframes pin{0%{transform:scale(.35);clip-path:circle(0% at 50% 50%);filter:saturate(1.4) blur(0) brightness(1)}70%{clip-path:circle(80% at 50% 50%);filter:saturate(1.6) blur(3px) brightness(1.6)}to{transform:scale(1.5);clip-path:circle(100% at 50% 50%);filter:saturate(0) blur(18px) brightness(4)}}@keyframes pout{0%{opacity:1}to{opacity:0}}#rotate-hint{position:fixed;top:calc(64px + env(safe-area-inset-top));left:50%;transform:translate(-50%);font-size:10px;letter-spacing:.3em;text-transform:uppercase;opacity:.6;pointer-events:none}#touch{display:none;position:fixed;inset:0;pointer-events:none}body.ingame #touch{display:block}@media(hover:hover)and (pointer:fine){body.ingame #touch{display:none}}.stick{position:absolute;left:calc(26px + env(safe-area-inset-left));bottom:calc(26px + env(safe-area-inset-bottom));width:132px;height:132px;border-radius:50%;border:1px solid rgba(255,255,255,.28);background:radial-gradient(circle,#ffffff0f,#00000040);pointer-events:auto;touch-action:none}.knob{position:absolute;left:50%;top:50%;width:54px;height:54px;margin:-27px 0 0 -27px;border-radius:50%;background:#ffffffd9;box-shadow:0 0 18px #ffffff59;transition:transform .06s}.tbtns{position:absolute;right:calc(22px + env(safe-area-inset-right));bottom:calc(22px + env(safe-area-inset-bottom));width:190px;height:160px;pointer-events:none}.tb{position:absolute;pointer-events:auto;touch-action:none;border-radius:50%;border:1px solid rgba(255,255,255,.35);background:#0000004d;color:#fff;font:300 18px var(--font)}.tb.on{background:#ffffffd9;color:#000}.tb-jump{right:0;bottom:0;width:84px;height:84px;font-size:26px}.tb-e{right:96px;bottom:6px;width:58px;height:58px;font-size:15px;letter-spacing:0}.tb-pulse{right:22px;bottom:98px;width:54px;height:54px;color:#ffc23a}@media(orientation:portrait){.stick{width:120px;height:120px}}@media(pointer:coarse){#prompt{bottom:auto;top:calc(62px + env(safe-area-inset-top));width:92vw}.p-title{font-size:15px;letter-spacing:.4em;margin-right:-.4em}#hint{bottom:auto;top:calc(66px + env(safe-area-inset-top));font-size:10px;white-space:normal;width:86vw;text-align:center;line-height:1.7}#rotate-hint{top:auto;bottom:calc(190px + env(safe-area-inset-bottom))}}@media(pointer:coarse)and (orientation:landscape)and (max-height:500px){#prompt{top:calc(10px + env(safe-area-inset-top))}.p-title{font-size:15px}.p-sub{margin-top:4px}.p-act{margin-top:6px}#hint{top:calc(16px + env(safe-area-inset-top))}.t-menu{margin-top:22px}.t-rule{margin:12px auto 10px}.t-itia{font-size:64px}}
