:root{--safe-t:env(safe-area-inset-top,0px);--safe-r:env(safe-area-inset-right,0px);--safe-b:env(safe-area-inset-bottom,0px);--safe-l:env(safe-area-inset-left,0px)}*{box-sizing:border-box}html,body{-webkit-user-select:none;user-select:none;-webkit-tap-highlight-color:transparent;overscroll-behavior:none;height:100%;margin:0;overflow:hidden}html,body,button{touch-action:manipulation}#app,#app canvas{touch-action:none;width:100%;height:100%;display:block;position:fixed;inset:0}#ui{pointer-events:none;position:fixed;inset:0}#ui>*{pointer-events:auto}.hidden{display:none!important}#loading{z-index:50;place-items:center;transition:opacity .5s;display:grid;position:fixed;inset:0}#loading.done{opacity:0;pointer-events:none}.gp-focus{outline-offset:3px}.screen#title{padding:calc(16px + var(--safe-t)) calc(16px + var(--safe-r)) calc(16px + var(--safe-b)) calc(16px + var(--safe-l));pointer-events:none;flex-direction:column;justify-content:center;align-items:center;display:flex;position:absolute;inset:0}#title>*{position:relative}#title .menu{pointer-events:auto;flex-direction:column;display:flex}#title .copyright{left:0;right:0;bottom:calc(10px + var(--safe-b));text-align:center;position:absolute}.modal{z-index:10;padding:calc(12px + var(--safe-t)) calc(12px + var(--safe-r)) calc(12px + var(--safe-b)) calc(12px + var(--safe-l));place-items:center;display:grid;position:absolute;inset:0}.card{flex-direction:column;align-items:stretch;width:min(26em,100%);max-height:100%;display:flex;overflow:auto}.row{justify-content:space-between;align-items:center;gap:1em;display:flex}.keys{grid-template-columns:auto 1fr;align-items:center;gap:.5em 1em;display:grid}.keys dt{text-align:right}.keys dd{margin:0}#hud{pointer-events:none;position:absolute;inset:0}#hud .score{top:calc(12px + var(--safe-t));left:calc(16px + var(--safe-l));position:absolute}#hud .hints{bottom:calc(12px + var(--safe-b));left:calc(16px + var(--safe-l));gap:1em;display:flex;position:absolute}#hud .hints span{align-items:center;gap:.35em;display:flex}[data-device=touch] #hud .hints{display:none}.gl{vertical-align:middle;border-radius:6px;justify-content:center;align-items:center;min-width:1.7em;height:1.7em;margin:0 .08em;padding:0 .35em;font:700 .8em/1 system-ui,sans-serif;display:inline-flex}.gl svg{width:1.3em;height:1.3em}.gl-face{border-radius:50%;width:1.7em;padding:0}.gl-pill{border-radius:999px;padding:0 .6em}.gl-stick b{margin-left:.1em;font-size:.7em}.gl-mouse{padding:0 .15em}.gl-or{opacity:.7;margin:0 .15em}#touch{pointer-events:none;touch-action:none;position:absolute;inset:0}#touch .stick{width:120px;height:120px;left:calc(40px + var(--safe-l));bottom:calc(40px + var(--safe-b));border-radius:50%;position:absolute}#touch .stick.on{bottom:auto}#touch .knob{border-radius:50%;width:50px;height:50px;position:absolute;top:35px;left:35px}#touch .tbtn{pointer-events:auto;white-space:pre-line;border-radius:50%;width:76px;min-width:0;height:76px;padding:0;line-height:1.2;position:absolute}#touch .slot-0{width:92px;height:92px;right:calc(24px + var(--safe-r));bottom:calc(32px + var(--safe-b))}#touch .slot-1{right:calc(130px + var(--safe-r));bottom:calc(24px + var(--safe-b))}#touch .slot-2{right:calc(36px + var(--safe-r));bottom:calc(138px + var(--safe-b))}#touch .slot-3{right:calc(124px + var(--safe-r));bottom:calc(118px + var(--safe-b))}#touch .tbtn.pause{width:46px;height:46px;top:calc(10px + var(--safe-t));bottom:auto;right:calc(12px + var(--safe-r))}:root{--ink:#2b2118;--paper:#fff8ec;--accent:#ff7a59;--accent-ink:#fff;--teal:#22aab0;--sun:#ffc43d;--shade:#12283080;--font:"Hiragino Maru Gothic ProN", "M PLUS Rounded 1c", system-ui, sans-serif;--pop:"Mochiy Pop One", "Hiragino Maru Gothic ProN", "M PLUS Rounded 1c", system-ui, sans-serif}html,body{color:var(--ink);font:16px/1.5 var(--font);background:#9fdde0}#loading{color:#2b2118;background:linear-gradient(#7fd3d6,#f6dfae);font-weight:700}#focus-hint{left:50%;bottom:calc(6vh + var(--safe-b,0px));pointer-events:none;color:#fff;text-align:center;background:#0009;border:1px solid #ffffff40;border-radius:999px;max-width:min(90vw,36em);padding:.5em 1.2em;font-size:clamp(13px,1.6vw,16px);animation:2.4s ease-in-out infinite focus-blink;position:absolute;transform:translate(-50%)}@keyframes focus-blink{50%{opacity:.5}}#paddiag{pointer-events:none;z-index:60;color:#fff;white-space:pre-wrap;background:#000000b3;max-width:92vw;margin:0;padding:6px 8px;font:11px/1.4 ui-monospace,Menlo,monospace;position:absolute;top:8px;left:8px}button{font:inherit;color:var(--ink);background:var(--paper);cursor:pointer;border:2px solid #f0dcc0;border-radius:999px;min-width:12em;padding:.55em 1.6em;font-weight:700;box-shadow:0 4px #d9b98f}button.gp-focus{background:var(--accent);color:var(--accent-ink);border-color:#e85f3e;box-shadow:0 4px #c94a2c}@media (hover:hover) and (pointer:fine){button:hover{background:var(--accent);color:var(--accent-ink);border-color:#e85f3e;box-shadow:0 4px #c94a2c}}button:active{transform:translateY(3px);box-shadow:0 1px #d9b98f}button.danger{color:#b8432a;background:#fff0ea;border-color:#f3c7b8;margin-top:.4em;font-size:.85em}button.danger.armed{color:#fff;background:#e2533a;border-color:#b8432a}.gp-focus{outline:3px solid #fff}input[type=range]{width:10em;accent-color:var(--accent)}select{font:inherit;background:#fff;border:1px solid #0002;border-radius:8px;padding:.25em .5em}.screen#title{padding-left:calc(6vw + var(--safe-l));justify-content:center;align-items:flex-start}#title{gap:.3em}#title:before{content:"";pointer-events:none;background:linear-gradient(90deg,#10343c8c,#10343c00);width:min(560px,70vw);position:absolute;top:0;bottom:0;left:0}#title h1{font:400 clamp(38px, 7vw, 80px)/1.08 var(--pop);color:#fff8e6;letter-spacing:.02em;text-shadow:0 3px #e2643f,0 6px #9c3a22,0 10px 18px #00000059;margin:0}#title .tagline{color:#fff;text-shadow:0 1px 2px #0009,0 0 12px #00000059;margin:.2em 0 1.1em;font-size:clamp(14px,1.8vw,18px);font-weight:700}#title .menu{gap:.55em}#title .menu button{min-width:14em}#title .copyright{color:#fffffff2;text-shadow:0 1px 2px #0009;letter-spacing:.04em;font-size:12px}#title .copyright .build{opacity:.75;letter-spacing:.06em;font-variant-numeric:tabular-nums;margin-top:2px;font-size:10px;display:block}@media (max-aspect-ratio:9/10){.screen#title{padding:0 16px calc(13vh + var(--safe-b));justify-content:flex-end;align-items:center}#title:before{background:linear-gradient(#10343c00,#10343c99);width:auto;height:62%;top:auto;left:0;right:0}#title h1,#title .tagline{text-align:center}}.modal{background:var(--shade)}.card{background:var(--paper);border:3px solid #f3e1c4;border-radius:22px;gap:.6em;padding:1.2em 1.4em;box-shadow:0 10px #e3c79f,0 18px 40px #0000004d}.card h2{text-align:center;font:400 1.5em/1.2 var(--pop);color:#e2643f;margin:0 0 .2em}.card button{min-width:0}.keys{margin:.4em 0 .6em}.howto-steps{flex-direction:column;gap:.45em;margin:0;padding-left:1.3em;font-size:.95em;display:flex}.touch-note{color:#6b5a48;margin:0;font-size:.85em}[data-device=touch] .keys,#hud .touch-hint{display:none}[data-device=touch] #hud .touch-hint{left:50%;bottom:calc(18px + var(--safe-b));color:#fff;white-space:nowrap;text-shadow:0 1px 3px #000000b3;pointer-events:none;font-size:15px;font-weight:800;display:block;position:absolute;transform:translate(-50%)}html:not([data-device=touch]) .touch-note{display:none}.book-card{width:min(40em,100%)}.book-sum{text-align:center;color:#22888c;margin:-.2em 0 .3em;font-weight:700}.book-grid{grid-template-columns:repeat(auto-fill,minmax(8.4em,1fr));gap:.6em;display:grid}.book-item{text-align:center;background:#fff;border:2px solid #f0dcc0;border-radius:14px;padding:.5em .4em .45em}.book-item.unknown{background:#f3ede4}.book-item .icon svg{width:100%;height:auto;max-height:4.6em;margin:0 auto .2em;display:block}.book-item .name{place-items:center;min-height:2.5em;font-size:.82em;font-weight:700;line-height:1.25;display:grid}.book-item.unknown .name{color:#9a8a76}.book-item .meta{color:#b08a4a;justify-content:center;gap:.5em;font-size:.75em;display:flex}.book-item .stars{letter-spacing:-.05em;color:#e8a92a}.book-item .count{color:#22888c;font-weight:700}.book-item.got.r5{border-color:#f2c94c;box-shadow:inset 0 0 0 3px #fff2b8}#hud .topbar{top:calc(10px + var(--safe-t));left:calc(12px + var(--safe-l));align-items:center;gap:8px;display:flex;position:absolute}#hud .chip{transform-origin:0;background:#fff8ecf0;border:2px solid #f0dcc0;border-radius:999px;align-items:center;gap:6px;padding:4px 14px 4px 6px;display:flex;box-shadow:0 3px #a0784673}#hud .chip .ico{place-items:center;width:30px;height:30px;display:grid}#hud .chip .ico svg{width:100%;height:100%}#hud .chip .ico.clawd svg{width:34px;height:26px}#hud .chip .n{font:400 24px/1 var(--pop);color:var(--ink);font-variant-numeric:tabular-nums;min-width:1.6em}#hud .chip.book .n{font-size:18px}#hud .refill{top:calc(56px + var(--safe-t));left:calc(14px + var(--safe-l));color:#fff;background:#22888cd9;border-radius:999px;padding:2px 10px;font-size:13px;font-weight:700;position:absolute}#hud .pops{top:calc(48px + var(--safe-t));left:calc(70px + var(--safe-l));position:absolute}#hud .pop{font:400 22px/1 var(--pop);color:#ffd23f;white-space:nowrap;text-shadow:0 2px #b5651d,0 0 6px #00000059;position:absolute;top:0;left:0}#hud .pop.refill{color:#bff4f2;text-shadow:0 2px #1d6f73}#hud .fever{top:calc(12px + var(--safe-t));text-align:center;width:min(280px,46vw);position:absolute;left:50%;transform:translate(-50%)}@media (max-width:640px){#hud .fever{top:calc(62px + var(--safe-t));width:min(300px,76vw)}}#hud .fever b{font:400 15px/1.2 var(--pop);color:#fff;text-shadow:0 2px #c2412b,0 0 8px #0000004d;display:block}#hud .fever i{background:#0000004d;border-radius:999px;height:9px;margin-top:4px;display:block;overflow:hidden}#hud .fever span{background:linear-gradient(90deg,#ffd23f,#ff7a59,#e2457a);height:100%;display:block}#hud .banner{text-align:center;pointer-events:none;white-space:nowrap;position:absolute;top:42%;left:50%;transform:translate(-50%,-50%)}#hud .banner .big{font:400 clamp(34px, 7vw, 72px)/1.1 var(--pop);color:#fff7d6;text-shadow:0 3px #e2643f,0 6px #9c3a22,0 12px 22px #00000059;display:block}#hud .banner .sub{color:#fff;text-shadow:0 2px 4px #0009;margin-top:.4em;font-size:clamp(14px,2vw,20px);font-weight:800;display:block}#hud .banner.prize .big{color:#fff;text-shadow:0 3px #22aab0,0 6px #146a6e,0 12px 22px #00000059}#hud .banner.fever .big{color:#ffe9a8;text-shadow:0 3px #e2457a,0 6px #7a2050,0 12px 22px #00000059}#hud .toast{left:50%;bottom:calc(54px + var(--safe-b));white-space:nowrap;background:#fff8ecf2;border:2px solid #f0dcc0;border-radius:999px;padding:.4em 1.1em;font-size:15px;font-weight:700;position:absolute;transform:translate(-50%);box-shadow:0 3px #a0784666}#hud .hints{color:#fff;text-shadow:0 1px 3px #000000b3;font-size:14px}#hud .hints b{font-weight:700}#hud .hints i{white-space:nowrap;align-items:center;font-style:normal;display:inline-flex}.gl{color:#fff;background:#1e2230d9}.card .gl{background:#4a3a2a}#touch .tbtn{background:#fff8ece6;border:2px solid #f0dcc0;font-size:13px;box-shadow:0 3px #a0784673}#touch .tbtn.on{background:var(--accent);color:#fff}#touch .tbtn.prog{background:conic-gradient(color-mix(in srgb, var(--accent), #000 35%) calc(var(--p) * 1turn), var(--accent) 0);color:#fff}#touch .tbtn.pause{min-width:0;padding:0;font-size:16px}@media (max-height:480px){#title h1{font-size:clamp(30px,8vh,52px)}#title .tagline{margin-bottom:.5em}#title .menu{gap:.35em}button{padding:.4em 1.4em}#hud .banner{top:40%}}