@font-face{font-family:Meadow;src:url('/assets/fonts/baloo.woff2') format('woff2');font-display:swap}@font-face{font-family:Field;src:url('/assets/fonts/nunito.woff2') format('woff2');font-display:swap}
:root{color-scheme:light;--ink:#173f37;--cream:#fff4d9;--hold:0;--pull:0}*{box-sizing:border-box}html,body{margin:0;width:100%;height:100%;overscroll-behavior:none}body{font-family:Field,sans-serif;background:#173f37;color:var(--cream)}button,a{-webkit-tap-highlight-color:transparent}button{font:800 14px Field,sans-serif;cursor:pointer;min-height:44px;min-width:44px;border:1px solid #8aa08c;border-radius:14px;background:var(--cream);color:var(--ink);padding:10px 15px}button:focus-visible,a:focus-visible{outline:3px solid #f8df67;outline-offset:4px}a{color:inherit}button[hidden],[hidden]{display:none!important}button:active{filter:brightness(1.08)}#app{height:100svh;height:100dvh;min-height:300px;overflow:clip;position:relative;background:radial-gradient(ellipse at 48% 46%,#517b52 0%,#244f41 55%,#143b34 100%);isolation:isolate}#app:before{content:'';position:absolute;inset:0;z-index:-1;opacity:.14;background:repeating-linear-gradient(115deg,transparent 0 90px,#adc783 92px,transparent 94px 160px)}.topbar{height:64px;display:flex;align-items:center;justify-content:space-between;gap:8px;padding:8px max(12px,env(safe-area-inset-right)) 8px max(12px,env(safe-area-inset-left));border-bottom:1px solid #ffffff26;position:relative;z-index:4}.topbar>a{min-height:44px;display:flex;align-items:center;font-size:13px;text-decoration:none}.brand{font:28px/.85 Meadow,cursive}.brand small{display:block;font:800 9px Field,sans-serif;letter-spacing:2px;margin-top:7px;color:#f2d99b}.topbar nav{display:flex;gap:7px}.topbar button{background:#0c312b8c;color:var(--cream);border-color:#8ba88b;font-size:12px;padding:8px 12px}#game{height:calc(100% - 64px);display:grid;grid-template-rows:auto minmax(0,1fr) auto;padding:14px 12px 8px;position:relative}.hud{text-align:center;z-index:2;pointer-events:none}.scoreline{display:flex;justify-content:center;gap:24px;font-size:9px;font-weight:800;letter-spacing:1.5px;color:#c3d6b1}.scoreline b{font:22px Meadow,cursive;color:var(--cream);margin-left:5px;letter-spacing:0}h1{font:clamp(24px,4vw,36px)/1.04 Meadow,cursive;margin:5px 0}#detail{font-size:14px;margin:5px 0;color:#e6edce;min-height:20px}.progress{height:16px;display:flex;justify-content:center;gap:6px;align-items:center}.progress i{width:7px;height:7px;border:1px solid #cbdcad;border-radius:50%;transition:background .15s}.progress i.done{background:#ffe09a;border-color:#ffe09a}.stage{min-height:0;position:relative;display:grid;place-items:center}.meadow-halo{position:absolute;width:min(90vw,470px);aspect-ratio:1;border:1px solid #b7d09522;border-radius:50%;box-shadow:0 0 0 24px #c6daa108,0 0 0 56px #c6daa105}.totem{position:relative;height:100%;max-height:540px;aspect-ratio:370/500;max-width:100%;filter:drop-shadow(0 22px 18px #001f2370);container-type:size}.spine{position:absolute;left:17%;right:17%;top:8%;bottom:6%;border-radius:46% 46% 28% 28% / 22% 22% 12% 12%;background:repeating-linear-gradient(94deg,transparent 0 14px,#5b2f1715 15px,transparent 17px 25px),linear-gradient(90deg,#9b542f,#e6b36b 20%,#f1c481 50%,#d29854 85%,#8a472d);border:3px solid #e5b878;box-shadow:inset 7px 0 5px #fff1be66,inset -10px 0 8px #5e322b60,0 9px 0 #75452d;transform:rotate(-2deg)}.spine i{position:absolute;border:1px solid #96562b4f;border-radius:50%;width:70%;height:15%;left:15%;top:42%}.spine i+i{top:64%;width:50%;left:25%}.action{position:absolute;border:0;padding:0;display:flex;align-items:center;justify-content:center;flex-direction:column;touch-action:none;user-select:none;box-shadow:inset 3px 4px 2px #ffffff75,inset -6px -7px 4px #294c3540,0 8px 0 #233f34,0 12px 8px #062e324f;transition:transform .12s,filter .12s;z-index:2}.action strong{font:clamp(14px,5cqw,23px)/1 Meadow,cursive;letter-spacing:.5px}.action small{font:800 clamp(10px,3.4cqw,14px)/1.2 Field,sans-serif}.action svg{fill:none;stroke:currentColor;stroke-width:3;stroke-linecap:round;stroke-linejoin:round;pointer-events:none}.sun{left:28%;top:1%;width:44%;height:30%;border-radius:50%;color:#603b17;background:conic-gradient(#fff3bd calc(var(--hold)*1turn),#eaa93d 0)}.sun-face{position:absolute;inset:9%;border:2px solid #fbe0a0;border-radius:50%;background:radial-gradient(circle at 30% 20%,#ffefb4,#f8cd64 50%,#e7a443);box-shadow:inset 0 3px 4px #ffffffbd,0 3px 3px #80521766;display:flex;flex-direction:column;align-items:center;justify-content:center}.sun svg{width:46%;height:44%;margin-top:-6%}.rays{position:absolute;inset:-6%;border:2px dashed #f5ca70;border-radius:50%;opacity:.75}.leaf{left:1%;top:34%;width:36%;height:32%;background:linear-gradient(130deg,#d1ed8d,#8fc275 50%,#5f985a);color:#1d533b;border-radius:70% 15% 60% 20% / 55% 25% 75% 35%;transform:rotate(-11deg);padding-bottom:3%}.leaf svg{height:46%;width:65%}.blossom{right:1%;top:34%;width:36%;height:32%;background:radial-gradient(circle at 35% 20%,#ffc1a5,#f39b85 50%,#d86562);color:#682f31;border-radius:35% 50% 35% 50%;transform:rotate(10deg)}.blossom svg{width:55%;height:43%}.petals{position:absolute;inset:6%;border:1px dashed #853c3f44;border-radius:35% 50% 35% 50%;pointer-events:none}.tap-pips{display:flex;gap:4px;position:absolute;bottom:7%}.tap-pips i{width:5px;height:5px;border-radius:50%;border:1px solid #713d3e}.blossom.waiting .tap-pips i:first-child,.blossom.fired .tap-pips i{background:#692d37}.heart{position:absolute;top:33%;left:32%;width:36%;height:29%;border-radius:48%;background:radial-gradient(circle at 38% 20%,#fff8dc,#e9d6a7);border:3px solid #af7d46;box-shadow:inset 0 4px 0 #fffef094,0 5px 0 #865736;display:flex;align-items:center;justify-content:center;flex-direction:column;z-index:3;pointer-events:none;color:#204a40}#cue-symbol{font:clamp(28px,13cqw,60px)/1 Meadow,cursive;white-space:nowrap}#cue-word{font:900 clamp(8px,2.6cqw,12px) Field,sans-serif;letter-spacing:1px;margin-top:4px}.meter{position:absolute;bottom:16%;left:20%;width:60%;height:4px;background:#8c9c7455;border-radius:5px;overflow:hidden}.meter i{display:block;height:100%;width:100%;background:#447253;transform-origin:left}.stream{position:absolute;left:6%;right:6%;height:23%;top:69%;border-radius:40% 20% 35% 20%;background:linear-gradient(170deg,#c0eee4,#82cdd4 40%,#4ba3b1);border:3px solid #abe1d8;box-shadow:inset 0 5px 2px #eefff789,inset 0 -7px 2px #38778866,0 8px 0 #235767;z-index:4;touch-action:none;user-select:none;overflow:hidden;color:#174955}.stream-title{display:flex;flex-direction:column;align-items:center;margin-top:4%;pointer-events:none}.stream-title strong{font:clamp(15px,5cqw,24px)/1 Meadow,cursive}.stream-title small{font-size:clamp(10px,3cqw,13px);font-weight:800}.stream-track{position:absolute;left:22%;right:22%;bottom:16%;height:26%;display:flex;align-items:center;justify-content:space-between;border-bottom:2px solid #f2ffed99;font-size:26px;pointer-events:none}#ripple{width:18px;height:18px;border:3px solid #fffbd3;border-radius:50%;position:absolute;left:calc(50% + var(--pull)*34%);top:20%;transform:translateX(-50%);opacity:.8}.stream-alt{position:absolute;bottom:10%;padding:0;border-radius:50%;background:#0b4f6440;color:#fff8dc;border:1px solid #eafff0aa;font-size:22px;width:44px;height:44px}.stream-alt[data-dir=stream-left]{left:4%}.stream-alt[data-dir=stream-right]{right:4%}.flow{position:absolute;inset:55% -20% -50%;background:repeating-radial-gradient(ellipse at center,transparent 0 12px,#dffff031 13px 15px,transparent 17px 25px);pointer-events:none}.foot{position:absolute;bottom:0;left:20%;right:20%;text-align:center;font:900 clamp(7px,2cqw,10px) Field,sans-serif;letter-spacing:2px;color:#dbce99}.play-actions{text-align:center;z-index:5;padding:9px 0 0}.play-actions button{min-width:144px}.play-actions p{font-size:10px;margin:7px 0 0;color:#c7d8b6}.primary{font:22px/1.2 Meadow,cursive;background:#f4cf72;color:#254d3e;border-color:#f5dc98;box-shadow:0 5px 0 #9b763c;padding:13px 22px}.action.lit,.stream.lit{filter:brightness(1.2);outline:4px solid #fff0a6;outline-offset:6px}.action.pressed{filter:brightness(1.1);translate:0 5px}.leaf.lit{transform:rotate(-22deg) scale(1.07)}.sun.lit .rays{animation:orbit 2.8s linear infinite}.blossom.lit{transform:rotate(20deg) scale(1.06)}.stream.lit .flow{animation:river .65s linear infinite}.totem[data-phase=ack] .heart{animation:ack .33s ease-out}.totem[data-phase=miss] .heart{background:#f5c3a1}.totem[data-phase=countin] #cue-symbol{animation:beat .45s ease-out infinite}.totem[data-phase=complete] .rays{animation:orbit 7s linear infinite}.totem[data-phase=complete] .spine{box-shadow:inset 7px 0 5px #fff1be66,inset -10px 0 8px #5e322b60,0 9px 0 #75452d,0 0 60px #f6d77688}@keyframes orbit{to{rotate:360deg}}@keyframes river{to{translate:24px 0}}@keyframes ack{50%{scale:1.15;rotate:6deg}}@keyframes beat{0%{scale:1.35}100%{scale:1}}.veil{position:absolute;inset:64px 0 0;display:grid;place-items:center;padding:16px;z-index:8;background:#103a329c;backdrop-filter:blur(5px);overflow:auto}.card{color:var(--ink);background:var(--cream);border:1px solid #efd7a7;border-radius:32px;box-shadow:0 12px 0 #0a2b294a,0 24px 40px #082a3044;max-width:440px;width:100%;padding:28px;text-align:center}.eyebrow{font-size:10px;font-weight:900;letter-spacing:1.7px;color:#93553a;margin:0 0 12px}h2{font:38px/1.05 Meadow,cursive;margin:0 0 14px}h2 em{color:#af5439;font-style:normal}.card p{line-height:1.55}.card>.primary{width:100%}.how{display:grid;grid-template-columns:1fr 1fr;gap:7px;margin:20px 0}.how span{background:#e6e7c8;border-radius:12px;padding:10px 4px;font-size:13px}.how b{display:block;font:22px Meadow,cursive}.fine{font-size:12px;margin:15px 0 5px}.muted{color:#647455}.quiet{border:0;background:none;text-decoration:underline}.card>button:not(.primary){display:block;width:100%;margin-top:10px}.card>a{display:inline-flex;align-items:center;min-height:44px;margin-top:10px;font-size:14px}dialog{padding:0;background:none;border:0;width:min(440px,calc(100% - 24px));max-height:calc(100dvh - 24px);overflow:auto;border-radius:32px}dialog::backdrop{background:#072d28b0;backdrop-filter:blur(3px)}#storage-note{position:absolute;bottom:3px;margin:0;left:0;right:0;text-align:center;background:#fff1d3;color:#58381e;font-size:11px;z-index:9}#storage-note:empty{display:none}.sr-only{position:absolute;width:1px;height:1px;overflow:hidden;clip-path:inset(50%);white-space:nowrap}.no-script{position:absolute;inset:0;background:var(--cream);color:var(--ink);padding:50px;z-index:30}
@media(max-width:600px){.brand{font-size:23px}.brand small{font-size:7px;letter-spacing:1px}.topbar{gap:5px}.topbar nav{gap:4px}.topbar button{padding:8px;font-size:11px}.hud h1{font-size:27px}.totem{max-height:570px}}
@media(max-width:420px){.brand{display:none}.topbar{padding-left:10px;padding-right:10px}.topbar nav{gap:6px}.topbar button{padding:8px 10px}.scoreline{gap:20px}#game{padding-top:10px}}
@media(max-height:650px) and (orientation:portrait){.topbar{height:56px}#game{height:calc(100% - 56px);padding-top:7px}.hud h1{font-size:23px}.scoreline b{font-size:18px}#detail{font-size:12px;margin:3px 0}.progress{height:10px}.play-actions{padding-top:4px}.play-actions p{font-size:8px;margin:4px 0}.veil{inset:56px 0 0;padding:8px}.card{padding:18px}.card h2{font-size:29px}.card p{margin:9px 0}.how{margin:12px 0}.how span{padding:5px}.how b{font-size:18px}.primary{padding:11px 17px;font-size:20px}.card .eyebrow{font-size:8px}.totem{aspect-ratio:370/440}.stream{height:25%}.sun{height:31%}.leaf,.blossom{height:33%}.stream-alt{bottom:4%}.foot{display:none}}
@media(orientation:landscape) and (max-height:600px){.topbar{height:56px}.brand{display:block}.brand small{display:none}#game{height:calc(100% - 56px);grid-template-columns:minmax(190px,1fr) minmax(270px,1.3fr);grid-template-rows:minmax(0,1fr) auto;max-width:1000px;margin:auto;padding:6px 18px 8px;gap:0 10px}.hud{grid-column:1;grid-row:1;align-self:center}.hud h1{font-size:28px;margin:12px 0}.scoreline{gap:12px;flex-wrap:wrap}.stage{grid-column:2;grid-row:1/3}.totem{height:100%;aspect-ratio:370/400;max-height:none}.sun{height:32%;width:40%;left:30%}.leaf,.blossom{height:35%;width:34%;top:32%}.stream{height:27%;top:69%}.stream-alt{bottom:5%}.stream-title{margin-top:2%}.foot{display:none}.play-actions{grid-column:1;grid-row:2;padding-bottom:6px}.play-actions p{max-width:240px;margin:8px auto 0}.veil{inset:56px 0 0;padding:8px}.card{padding:20px}.veil>.card{max-width:650px;display:grid;grid-template-columns:1fr 1fr;gap:4px 20px;align-items:center}.veil .eyebrow{grid-column:1;margin:0;font-size:9px}.veil h2{grid-column:1;grid-row:2/4;font-size:32px;margin:0}.veil .card>p:not(.eyebrow){font-size:12px;margin:4px 0}.veil .how{grid-column:2;grid-row:1/4;margin:0;gap:5px}.veil .how span{padding:6px}.veil .how b{font-size:19px}.veil .primary{grid-column:2;grid-row:4/6;margin:4px 0;padding:11px;font-size:20px}.veil #reset-menu{grid-column:1;margin:0}.veil .muted{display:none}}
@media(prefers-reduced-motion:reduce){*,*:before,*:after{animation:none!important;transition:none!important;scroll-behavior:auto!important}.leaf.lit,.blossom.lit{transform:none}}
.stage{min-width:0;container-type:size}.totem{width:min(90cqw,calc(100cqh * .74),400px);height:auto;max-width:none;max-height:100%;aspect-ratio:370/500}
@media(max-height:650px) and (orientation:portrait){.totem{width:min(90cqw,calc(100cqh * .84));aspect-ratio:370/440}}
@media(orientation:landscape) and (max-height:600px){.totem{width:min(92cqw,calc(100cqh * .925));aspect-ratio:370/400}}
button,a{touch-action:manipulation}.action,.stream{touch-action:none}.pointer-input .action:focus-visible{outline:none}
