.hrh-f-pinky{--hrh-ink:#f9a8d4;--hrh-tint:#f9a8d433;--hrh-glow:#f9a8d48c}.hrh-f-ring{--hrh-ink:#93c5fd;--hrh-tint:#93c5fd33;--hrh-glow:#93c5fd8c}.hrh-f-middle{--hrh-ink:#86efac;--hrh-tint:#86efac33;--hrh-glow:#86efac8c}.hrh-f-pointer{--hrh-ink:#fde68a;--hrh-tint:#fde68a33;--hrh-glow:#fde68a8c}.hrh{color:#fff;flex-direction:column;flex:auto;justify-content:center;align-self:stretch;gap:.5rem;width:100%;max-width:1040px;min-height:0;margin-left:auto;margin-right:auto;display:flex;position:relative}.hrh>.game-prompt{margin:auto}html[data-osk=closed] .hrh{padding-bottom:3rem}.hrh-hud{flex-wrap:wrap;flex:none;order:-1;justify-content:center;align-items:center;gap:.5rem;display:flex}.hrh-chip{color:#fff;background:#081022a8;border:1px solid #ffffff29;border-radius:999px;align-items:center;gap:.45rem;padding:.25rem .85rem;font-size:.95rem;font-weight:700;line-height:1.3;display:inline-flex}.hrh-chip strong{color:#86efac;font-variant-numeric:tabular-nums;font-size:1.15rem}.hrh-dots{align-items:center;gap:3px;display:inline-flex}.hrh-dot{border:1.5px solid #ffffff80;border-radius:50%;width:8px;height:8px}.hrh-dot.is-done{background:#86efac;border-color:#86efac}.hrh-dot.is-goal{border-color:#f9a8d4;width:11px;height:11px}.hrh-dot.is-goal.is-done{background:#f9a8d4}.hrh-say{text-align:center;color:#fff;flex-wrap:wrap;flex:none;justify-content:center;align-items:center;gap:.5rem;min-height:2.9rem;margin:0;font-size:clamp(1.05rem,2.4vmin,1.4rem);font-weight:800;line-height:1.2;display:flex}.hrh-say.visually-hidden{min-height:0}.hrh-say-target{flex-wrap:wrap;justify-content:center;align-items:center;gap:.5rem;display:inline-flex}.hrh-say-press{color:#fff}.hrh-say-key{background:var(--hrh-ink);color:#0b1020;min-width:2.4rem;height:2.4rem;box-shadow:0 3px 0 #00000059, 0 0 18px var(--hrh-glow);border-radius:12px;place-items:center;padding:0 .5rem;font-size:clamp(1.4rem,4vmin,2rem);font-weight:900;line-height:1;display:inline-grid}.hrh-say-finger{color:var(--hrh-ink);font-size:.85em}.hrh-say-win{color:#f9a8d4}.hrh-pond{--hrh-pad:clamp(66px, 12vmin, 112px);--hrh-step:calc(var(--hrh-pad) * 1.3);--hrh-frog-x:clamp(calc(var(--hrh-pad) * .85), 18%, 220px);--hrh-line:62%;touch-action:manipulation;background:radial-gradient(at 82% 6%,#fde68a29,#0000 42%),linear-gradient(#0a1733 0%,#13305a 55%,#184a6b 100%);border:2px solid #86efac47;border-radius:24px;flex:auto;min-height:min(44vh,400px);max-height:560px;position:relative;overflow:hidden;box-shadow:0 10px 30px #00000059}.hrh-moon{font-size:calc(var(--hrh-pad) * .4);opacity:.85;pointer-events:none;line-height:1;position:absolute;top:7%;right:6%}.hrh-twinkle{color:#fde68a;opacity:.6;pointer-events:none;font-size:.8rem;line-height:1;animation:2.8s ease-in-out infinite hrhTwinkle;position:absolute}.hrh-twinkle-a{top:12%;left:32%}.hrh-twinkle-b{font-size:.6rem;animation-delay:.9s;top:24%;left:58%}.hrh-twinkle-c{animation-delay:1.7s;top:9%;left:76%}@keyframes hrhTwinkle{0%,to{opacity:.25}50%{opacity:.85}}.hrh-water{bottom:0;left:0;right:0;top:var(--hrh-line);margin-top:calc(var(--hrh-pad) * -.1);background:repeating-linear-gradient(#bae6fd12 0 2px,#0000 2px 16px),linear-gradient(#11707e 0%,#0b4f60 55%,#083a4a 100%);border-top:2px solid #a5f3fc66;position:absolute}.hrh-reed{font-size:calc(var(--hrh-pad) * .55);opacity:.75;pointer-events:none;line-height:1;position:absolute;bottom:4%}.hrh-reed-a{left:3%}.hrh-reed-b{right:4%}.hrh-banner{z-index:5;pointer-events:none;justify-content:center;margin:0;padding:0 .75rem;display:flex;position:absolute;top:.6rem;left:0;right:0}.hrh-banner span{color:#fde68a;text-align:center;background:#081022bd;border:1px solid #fde68a80;border-radius:999px;padding:.3rem .9rem;font-size:.95rem;font-weight:800;line-height:1.3;animation:.42s ease-out backwards hrhBannerIn}@keyframes hrhBannerIn{0%{opacity:0;transform:translateY(-8px)}to{opacity:1;transform:none}}.hrh-track{left:var(--hrh-frog-x);top:var(--hrh-line);width:0;height:0;transform:translateX(calc(var(--hrh-pos,0) * var(--hrh-step) * -1));will-change:transform;transition:transform .4s cubic-bezier(.3,.7,.35,1);position:absolute}.hrh-pad{left:calc(var(--i,0) * var(--hrh-step));top:calc(var(--hrh-pad) * -.72);width:var(--hrh-pad);height:var(--hrh-pad);margin-left:calc(var(--hrh-pad) * -.5);animation:.48s ease-out backwards hrhPadIn;animation-delay:calc(var(--i,0) * 45ms);transition:opacity .3s;position:absolute}.hrh-pad.is-home{animation:none}.hrh-pad.is-behind{opacity:.55}@keyframes hrhPadIn{0%{opacity:0;transform:translateY(14px)scale(.9)}to{opacity:1;transform:none}}.hrh-leaf{filter:drop-shadow(0 4px 6px #00000059);width:100%;height:60%;position:absolute;bottom:0;left:0;overflow:visible}.hrh-leaf-body{fill:#2f9e44}.hrh-leaf-shine{fill:#ffffff21}.hrh-leaf-vein{fill:none;stroke:#dcfce759;stroke-width:2px;stroke-linecap:round}.hrh-pad.is-goal .hrh-leaf-body{fill:#3aa655}.hrh-cap{border:3px solid var(--hrh-ink);width:54%;height:54%;color:var(--hrh-ink);font-size:calc(var(--hrh-pad) * .3);background:#070e1ed1;border-radius:50%;place-items:center;margin-left:-27%;font-weight:900;line-height:1;display:grid;position:absolute;top:18%;left:50%;box-shadow:0 4px 10px #0006}.hrh-pad.is-target .hrh-cap{box-shadow:0 0 0 3px #ffffffd9, 0 0 22px var(--hrh-glow);background:#070e1eeb}.hrh-pad.is-target .hrh-cap:after{content:"";border:3px solid var(--hrh-ink);pointer-events:none;border-radius:50%;animation:1.2s ease-out infinite hrhRing;position:absolute;inset:-9px}@keyframes hrhRing{0%{opacity:.95;transform:scale(.85)}to{opacity:0;transform:scale(1.35)}}.hrh-cap.is-nudge{animation:.38s hrhNudge}@keyframes hrhNudge{0%,to{transform:translate(0)}20%{transform:translate(-6px)rotate(-6deg)}45%{transform:translate(5px)rotate(5deg)}70%{transform:translate(-3px)}}.hrh-bloom{font-size:calc(var(--hrh-pad) * .34);pointer-events:none;line-height:1;position:absolute;top:34%;right:-16%}.hrh-pad.is-reached .hrh-bloom{animation:.9s ease-out forwards hrhBloom}@keyframes hrhBloom{0%{transform:scale(1)rotate(0)}40%{transform:scale(1.7)rotate(-15deg)}70%{transform:scale(1.3)rotate(8deg)}to{transform:scale(1.35)rotate(0)}}.hrh-frog{left:var(--hrh-frog-x);top:var(--hrh-line);z-index:3;width:calc(var(--hrh-pad) * .8);margin-left:calc(var(--hrh-pad) * -.4);text-align:center;font-size:calc(var(--hrh-pad) * .62);pointer-events:none;line-height:1;position:absolute;transform:translateY(-84%)}.hrh-frog-body{transform-origin:50% 100%;filter:drop-shadow(0 5px 6px #00000073);display:inline-block}.hrh-frog-body.is-hop{animation:.4s cubic-bezier(.3,.7,.4,1) hrhHop}@keyframes hrhHop{0%{transform:translateY(0)scale(1)}15%{transform:translateY(0)scale(1.08,.9)}55%{transform:translateY(-70%)scale(.96,1.06)}85%{transform:translateY(0)scale(1.06,.92)}to{transform:translateY(0)scale(1)}}.hrh-frog-body.is-wobble{animation:.42s hrhWobble}@keyframes hrhWobble{0%,to{transform:rotate(0)}20%{transform:rotate(-12deg)}45%{transform:rotate(10deg)}70%{transform:rotate(-6deg)}}.hrh-splash{left:var(--hrh-frog-x);top:var(--hrh-line);z-index:2;width:calc(var(--hrh-pad) * 1.1);height:calc(var(--hrh-pad) * .34);margin-left:calc(var(--hrh-pad) * -.55);margin-top:calc(var(--hrh-pad) * -.12);opacity:0;pointer-events:none;border:3px solid #bae6fdd9;border-radius:50%;animation:.62s ease-out .25s hrhSplash;position:absolute}.hrh-splash:before,.hrh-splash:after{content:"";background:#bae6fdf2;border-radius:50%;width:8px;height:8px;position:absolute;top:-40%}.hrh-splash:before{animation:.62s ease-out .25s hrhDropL;left:22%}.hrh-splash:after{animation:.62s ease-out .25s hrhDropR;right:22%}@keyframes hrhSplash{0%{opacity:.9;transform:scale(.35)}to{opacity:0;transform:scale(1.25)}}@keyframes hrhDropL{0%{transform:translate(0)}to{transform:translate(-14px,-22px)}}@keyframes hrhDropR{0%{transform:translate(0)}to{transform:translate(14px,-22px)}}.hrh-go{left:calc(var(--hrh-frog-x) + var(--hrh-step));top:calc(var(--hrh-line) - var(--hrh-pad) * .72);z-index:4;width:var(--hrh-pad);height:var(--hrh-pad);margin:0 0 0 calc(var(--hrh-pad) * -.5);cursor:pointer;touch-action:manipulation;-webkit-tap-highlight-color:transparent;background:0 0;border:0;border-radius:50%;padding:0;position:absolute}.hrh-go[aria-disabled=true]{cursor:default}.hrh-go:focus-visible{outline-offset:3px;outline:3px solid #fde68a}.hrh-keys{flex-direction:column;flex:none;align-items:center;gap:.35rem;display:flex}.hrh-keyrow{background:#081022a8;border:1px solid #ffffff24;border-radius:16px;justify-content:center;gap:.35rem;max-width:100%;padding:.45rem .6rem;display:flex}.hrh-key{background:var(--hrh-tint);border:2px solid var(--hrh-ink);color:#fff;border-radius:10px;flex:0 auto;place-items:center;width:2.7rem;min-width:0;height:2.6rem;font-size:1.15rem;font-weight:800;line-height:1;transition:transform .16s,background-color .16s,opacity .2s;display:grid;position:relative}.hrh-key.is-split{margin-left:.7rem}.hrh-key.is-off{opacity:.3}.hrh-key.is-target{background:var(--hrh-ink);color:#0b1020;box-shadow:0 0 0 2px #fff, 0 0 16px var(--hrh-glow);transform:translateY(-3px)}.hrh-bump{opacity:.75;background:currentColor;border-radius:2px;width:34%;height:3px;margin-left:-17%;position:absolute;bottom:16%;left:50%}.hrh-key.is-tried:after{content:"";opacity:0;pointer-events:none;border:2px solid #ffffffe6;border-radius:13px;animation:.7s ease-out hrhTried;position:absolute;inset:-5px}@keyframes hrhTried{0%{opacity:.95}to{opacity:0}}.hrh-legend{color:#fffc;flex-wrap:wrap;justify-content:center;gap:.25rem .9rem;font-size:.8rem;font-weight:700;display:flex}.hrh-lg{align-items:center;gap:.3rem;display:inline-flex}.hrh-lg:before{content:"";background:var(--hrh-ink);border-radius:50%;width:.7rem;height:.7rem}@media (max-width:600px){.hrh{gap:.4rem}.hrh-chip{padding:.15rem .6rem;font-size:.8rem}.hrh-chip strong{font-size:.95rem}.hrh-say{gap:.4rem;min-height:2.5rem}.hrh-say-key{min-width:2.1rem;height:2.1rem}.hrh-pond{border-radius:18px;min-height:180px}.hrh-banner span{font-size:.82rem}html[data-osk=closed] .hrh{padding-bottom:0}.hrh-keys{order:1}.hrh-pond{order:2}.hrh-keyrow{border-radius:12px;gap:.18rem;padding:.3rem .35rem}.hrh-key{border-width:1.5px;border-radius:7px;width:2rem;height:2rem;font-size:.95rem}.hrh-key.is-split{margin-left:.35rem}.hrh-legend{display:none}}html[data-osk=open] .hrh-pond{min-height:160px}@media (max-height:700px){html[data-osk=open] .hrh-hud,html[data-osk=open] .hrh-keys{display:none}html[data-osk=open] .hrh-say{min-height:0}html[data-osk=open] .hrh-pond{--hrh-frog-x:clamp(86px, 24%, 220px);min-height:112px}html[data-osk=open] .hrh>.game-prompt{gap:.6rem;padding:.5rem .75rem}html[data-osk=open] .hrh>.game-prompt p{font-size:.95rem;line-height:1.45}}@media (prefers-reduced-motion:reduce){.hrh-track{transition:none}.hrh-pad,.hrh-banner span{animation-name:hrhFadeIn}.hrh-frog-body.is-hop{animation:.26s ease-out hrhFadeIn}.hrh-frog-body.is-wobble,.hrh-cap.is-nudge{animation:.36s hrhDim}.hrh-pad.is-target .hrh-cap:after{animation:1.6s ease-in-out infinite hrhBreathe}.hrh-splash{animation-name:hrhSplashFade}.hrh-splash:before,.hrh-splash:after{display:none}.hrh-pad.is-reached .hrh-bloom{animation:.6s ease-out hrhFadeIn}.hrh-key{transition:background-color .16s,opacity .2s}.hrh-key.is-target{transform:none}.hrh-twinkle{animation:none}}@keyframes hrhFadeIn{0%{opacity:0}to{opacity:1}}@keyframes hrhDim{0%,to{opacity:1}45%{opacity:.4}}@keyframes hrhBreathe{0%,to{opacity:.35}50%{opacity:1}}@keyframes hrhSplashFade{0%{opacity:.85}to{opacity:0}}
