@font-face{font-family:Space Grotesk;font-weight:500;src:url(assets/fonts/space-grotesk-latin-500-normal.woff2) format("woff2")}@font-face{font-family:Space Grotesk;font-weight:700;src:url(assets/fonts/space-grotesk-latin-700-normal.woff2) format("woff2")}@font-face{font-family:Fraunces;font-weight:600;src:url(assets/fonts/fraunces-latin-600-normal.woff2) format("woff2")}@font-face{font-family:JetBrains Mono;font-weight:500;src:url(assets/fonts/jetbrains-mono-latin-500-normal.woff2) format("woff2")}:root{--ink: #fff7ea;--muted: #c7b9a6;--butter: #ffc94d;--coral: #ff7a45;--glass: rgba(24, 18, 13, .62);--line: rgba(255, 240, 220, .14);--shadow: 0 18px 50px rgba(0, 0, 0, .45);--r: 22px}html,body{margin:0;height:100%;overflow:hidden;background:#120e0b;color:var(--ink);font-family:Space Grotesk,system-ui,sans-serif;-webkit-user-select:none;user-select:none;touch-action:none;-webkit-tap-highlight-color:transparent}canvas#gl{display:block;position:fixed;inset:0}button{font:inherit;color:inherit;cursor:pointer;border:0;background:none;-webkit-tap-highlight-color:transparent}.glass{background:var(--glass);border:1px solid var(--line);backdrop-filter:blur(16px) saturate(1.2);-webkit-backdrop-filter:blur(16px) saturate(1.2);box-shadow:var(--shadow)}.hide{display:none!important}.fade{animation:fade .45s ease both}@keyframes fade{0%{opacity:0;transform:translateY(10px)}to{opacity:1;transform:none}}#loading{position:fixed;inset:0;z-index:50;display:grid;place-items:center;transition:opacity .6s;--gold: linear-gradient(180deg, #f6dc94 0%, #c9973f 55%, #f1cf7c 100%);background:repeating-linear-gradient(0deg,rgba(255,255,255,.022) 0 1px,transparent 1px 3px),repeating-linear-gradient(90deg,rgba(0,0,0,.05) 0 1px,transparent 1px 3px),radial-gradient(120% 85% at 50% 38%,#2f5748,#20403a,#12261f)}#loading.out{opacity:0;pointer-events:none}#loading .frame{position:absolute;inset:max(20px,env(safe-area-inset-top)) 20px max(20px,env(safe-area-inset-bottom));border:1.5px solid rgba(219,178,96,.8);border-radius:3px;outline:1.5px solid rgba(0,0,0,.28);outline-offset:7px;pointer-events:none}.ld{width:min(360px,calc(100% - 72px));text-align:center}.ld .kick{font:700 11px Space Grotesk,sans-serif;letter-spacing:.46em;margin-right:-.46em;color:#d9b263}.logo,.ld .sub,.seal b,#loading .foot{background:var(--gold);-webkit-background-clip:text;background-clip:text;color:transparent}.logo{margin-top:14px;font:600 clamp(66px,19vw,112px)/1 Fraunces,Georgia,serif;letter-spacing:-.01em;filter:drop-shadow(0 3px 10px rgba(0,0,0,.35))}.ld .sub{margin-top:10px;font:600 clamp(20px,5.4vw,28px) Fraunces,Georgia,serif}.seal{position:relative;width:104px;height:104px;margin:46px auto 22px;display:grid;place-items:center}.seal svg{position:absolute;inset:0;transform:rotate(-90deg)}.seal circle{fill:none;stroke-width:3}.seal .track{stroke:#dbb26033}.seal .ring{stroke:#e2bd6b;stroke-linecap:round;transition:stroke-dashoffset .35s ease}.seal b{font:600 46px/1 Fraunces,Georgia,serif}.ldl{display:flex;justify-content:center;gap:12px;font:500 11px JetBrains Mono,monospace;letter-spacing:.08em;color:#e9d6aab3}.tip{margin:26px auto 0;max-width:300px;min-height:42px;font-size:14px;line-height:1.5;color:#f3e8d0d1}#loading .foot{position:absolute;left:0;right:0;bottom:calc(max(20px,env(safe-area-inset-bottom)) + 22px);text-align:center;font:500 11px JetBrains Mono,monospace;letter-spacing:.22em}#start{position:fixed;left:0;right:0;bottom:max(44px,calc(env(safe-area-inset-bottom) + 28px));z-index:30;display:flex;flex-direction:column;align-items:center;gap:10px;pointer-events:none;animation:fade .6s ease both}#start span{padding:15px 30px;border-radius:999px;font:700 15px Space Grotesk,sans-serif;letter-spacing:.2em;color:#2a1706;background:linear-gradient(180deg,#f6dc94,#d9a548);box-shadow:0 12px 34px #00000073,inset 0 1px #fff9;animation:breathe 2.2s ease-in-out infinite}#start small{font:500 11px JetBrains Mono,monospace;letter-spacing:.14em;color:#fff3df;text-shadow:0 1px 6px rgba(0,0,0,.8);opacity:.8}@keyframes breathe{0%,to{transform:scale(1)}50%{transform:scale(1.045)}}.panel{width:min(420px,100%);border-radius:var(--r);padding:18px}.btn{display:flex;align-items:center;justify-content:center;gap:10px;width:100%;padding:16px 18px;border-radius:16px;font-weight:700;font-size:17px;letter-spacing:.04em}.btn.primary{background:linear-gradient(180deg,#ffd56a,#ffad3a);color:#2a1706;box-shadow:0 10px 28px #ffaa3c59,inset 0 1px #fff9}.btn.ghost{background:#ffffff0f;border:1px solid var(--line)}.btn+.btn{margin-top:10px}.row{display:flex;gap:10px;margin-top:10px}.row .btn{margin:0}#hud{position:fixed;inset:0;z-index:20;pointer-events:none}.hb{position:absolute;top:max(14px,env(safe-area-inset-top));width:44px;height:44px;border-radius:14px;display:grid;place-items:center;pointer-events:auto}.hb svg{width:20px;height:20px}#bMenu{left:14px}#bSound{left:66px}#bBook{left:118px}#temp{position:absolute;top:max(14px,env(safe-area-inset-top));right:14px;display:flex;align-items:baseline;gap:6px;padding:9px 14px 9px 12px;border-radius:999px;font:700 17px Space Grotesk;color:#fff3df;pointer-events:none}#temp i{align-self:center;width:9px;height:9px;border-radius:50%;background:#7fb2ff;box-shadow:0 0 10px currentColor}#temp small{font:500 11px JetBrains Mono,monospace;letter-spacing:.14em;color:var(--muted)}#temp[data-zone=warm] i{background:#ffd56a}#temp[data-zone=ready] i{background:#ff9b3d}#temp[data-zone=hot] i{background:#ff4f2e}#ff{position:absolute;top:calc(max(14px,env(safe-area-inset-top)) + 52px);right:14px;padding:9px 14px;border-radius:999px;font:500 12px JetBrains Mono,monospace;letter-spacing:.12em;color:#ffe2a6}.hint{position:absolute;transform:translate(-50%,-100%);padding:7px 11px;border-radius:12px;font-size:12.5px;font-weight:700;letter-spacing:.03em;white-space:nowrap;pointer-events:none;transition:opacity .35s}.hint:after{content:"";position:absolute;left:50%;bottom:-6px;transform:translate(-50%);border:6px solid transparent;border-bottom:0;border-top-color:#18120d9e}.hint em{font-style:normal;color:var(--butter)}.hint.gone{opacity:0}#hold{position:absolute;left:50%;bottom:max(22px,env(safe-area-inset-bottom));transform:translate(-50%);display:flex;align-items:center;gap:14px;padding:8px 8px 8px 18px;border-radius:18px;pointer-events:auto;font-size:14px;font-weight:700;white-space:nowrap}#hold em{font-style:normal;color:var(--butter)}#hold button{padding:12px 16px;border-radius:13px;background:linear-gradient(180deg,#ffd56a,#ffad3a);color:#2a1706;font-weight:700;letter-spacing:.05em;font-size:13px}#toast{position:absolute;left:50%;bottom:max(96px,calc(env(safe-area-inset-bottom) + 74px));transform:translate(-50%);padding:12px 18px;border-radius:16px;font-size:14px;font-weight:700;max-width:calc(100% - 40px);text-align:center;transition:opacity .4s}#toast.gone{opacity:0}.dlg{position:fixed;inset:0;z-index:45;display:grid;place-items:center;background:#08060473;padding:16px}.dlg .panel{text-align:center}.dlg p{margin:4px 0 16px;font-size:18px;font-weight:700}.dlg small{display:block;color:var(--muted);margin:-8px 0 16px;font-size:13px}#results{position:fixed;inset:0;z-index:40;display:grid;place-items:end center;padding:16px 16px max(18px,env(safe-area-inset-bottom));background:linear-gradient(180deg,#08060400 25%,#080604b3 70%)}.res{width:min(440px,100%);border-radius:26px;padding:22px 20px 18px}.res small{font:500 11px JetBrains Mono,monospace;letter-spacing:.2em;color:var(--muted)}.score{display:flex;align-items:baseline;gap:8px}.score b{font-size:84px;line-height:.95;letter-spacing:-.04em;background:linear-gradient(180deg,#fff3cf,#ffc94d 60%,#ff9a3c);-webkit-background-clip:text;background-clip:text;color:transparent}.score span{font-size:30px;font-weight:700;color:var(--butter)}.rank{margin:4px 0 14px;font-size:18px;font-weight:700}.rank em{font-style:normal;color:var(--butter);font-size:14px;margin-left:6px}.stat{display:grid;grid-template-columns:112px 1fr 42px;gap:10px;align-items:center;font-size:14px;margin:7px 0}.stat i{height:8px;border-radius:6px;background:#ffffff14;overflow:hidden}.stat i u{display:block;height:100%;border-radius:6px}.stat b{text-align:right;font-family:JetBrains Mono,monospace;font-size:13px}.g u{background:#ffd56a}.s u{background:#c9a43a}.u u{background:#b98c55}.b u{background:#5a3a24}.l u{background:#8f8f8f}.meta{margin:12px 0 4px;font-size:12.5px;color:var(--muted);line-height:1.5}.tips{margin:10px 0 2px;padding:10px 12px;border-radius:14px;background:#ffc94d14;font-size:13px;line-height:1.5;color:#f3e6d3}.res .row{margin-top:14px}@media (min-width: 900px){.panel{width:400px}}
