:root{color-scheme:light;--ink:#294c35;--paper:#fffef1;font-family:ui-rounded,"Arial Rounded MT Bold","Trebuchet MS",system-ui,sans-serif}
*{box-sizing:border-box}html,body{margin:0;width:100%;height:100%;overflow:hidden}body{background:#dbe9aa;color:var(--ink);font-size:16px;-webkit-tap-highlight-color:transparent}button{font:inherit;color:inherit;cursor:pointer}button:focus-visible{outline:3px solid #214f42;outline-offset:4px}button:disabled{cursor:default}button,img{-webkit-user-select:none;user-select:none}button{touch-action:manipulation}#garden{position:relative;width:100%;height:100%;height:100svh;min-height:320px;overflow:hidden;isolation:isolate;touch-action:manipulation}.garden-art{position:absolute;inset:0;width:100%;height:100%;object-fit:fill;z-index:-3;pointer-events:none}.garden-shade{position:absolute;inset:0;background:linear-gradient(180deg,rgba(232,240,188,.12),transparent 22%,transparent 78%,rgba(39,67,39,.08));pointer-events:none;z-index:-2}.game-header{position:absolute;top:max(28px,env(safe-area-inset-top));left:clamp(22px,3vw,50px);right:clamp(22px,3vw,50px);display:flex;justify-content:space-between;align-items:flex-start;gap:16px;z-index:15;pointer-events:none}.brand{padding:14px 23px 17px;background:#fffef1f0;border:2px solid white;border-radius:27px;box-shadow:0 5px 0 #78944e35}.eyebrow{font-size:12px;font-weight:800;letter-spacing:.12em}h1{font-size:clamp(30px,3.4vw,44px);font-weight:900;letter-spacing:-.065em;margin:3px 0 0;line-height:1.08}h1 span{color:#e88483}.snack-counter{position:relative;display:flex;gap:13px;align-items:center;min-width:165px;padding:15px 23px 13px 15px;background:var(--paper);border:2px solid #fff;border-radius:27px;box-shadow:0 5px 0 #78944e35;transform-origin:50% 40%}.counter-icon{width:45px;height:52px;background:#eef2d6;border-radius:17px;display:grid;place-items:center;transform:rotate(-9deg)}.counter-icon img{width:32px;height:40px;object-fit:contain;transform:rotate(23deg)}.counter-copy{display:flex;flex-direction:column;gap:2px}.counter-label{font-size:14px;font-weight:700;white-space:nowrap}.score{font-size:37px;line-height:1.05;font-weight:900;font-variant-numeric:tabular-nums;letter-spacing:-.05em}.counter-yum{position:absolute;right:-11px;bottom:-12px;background:#f591a4;border:2px solid var(--paper);border-radius:15px;padding:3px 10px;font-size:14px;font-weight:800;transform:rotate(-8deg) scale(0);transition:transform .16s;color:#683744}.counter-yum.visible{transform:rotate(-8deg) scale(1)}.counter-pop{animation:counter-pop .4s ease-out}@keyframes counter-pop{0%,100%{transform:scale(1)}40%{transform:scale(1.12) rotate(-3deg)}70%{transform:scale(.97)}}#ants{position:absolute;inset:0;z-index:3}.ant{position:absolute;top:0;left:0;display:grid;place-items:center;width:60px;height:60px;border:0;background:transparent;padding:8px;border-radius:50%;will-change:transform;touch-action:manipulation;transition:opacity .16s}.ant:focus-visible{outline:3px dashed #426d47;outline-offset:0;background:#ffffdd99}.ant img{width:36px;height:43px;object-fit:contain;pointer-events:none;filter:drop-shadow(1px 2px 1px #344d3430)}.ant[data-caught="true"]{pointer-events:none;z-index:6}.ant[data-queued="true"]{pointer-events:none}.frog{position:absolute;left:50%;top:65%;width:clamp(130px,17vw,225px);aspect-ratio:1;transform:translate(-50%,-50%);z-index:5;pointer-events:none}.frog-body{width:100%;height:100%;transform-origin:50% 90%;animation:breathe 3.6s ease-in-out infinite}.frog img{display:block;width:100%;height:100%;object-fit:contain;filter:drop-shadow(0 7px 3px #2246352b)}@keyframes breathe{0%,100%{transform:scale(1,1)}50%{transform:scale(1.025,.98) translateY(1px)}}.frog-body.chomp{animation:chomp .38s ease-out}@keyframes chomp{0%,100%{transform:scale(1)}35%{transform:scale(1.1,.88) translateY(4px)}65%{transform:scale(.96,1.06)}}.tongue-layer{position:absolute;inset:0;width:100%;height:100%;z-index:7;pointer-events:none;overflow:visible}.tongue-shadow,.tongue,.tongue-shine{fill:none;stroke-linecap:round;stroke-linejoin:round}.tongue-shadow{stroke:#963c6480;stroke-width:15;transform:translateY(3px)}.tongue{stroke:#ef7796;stroke-width:13}.tongue-shine{stroke:#ffb2c3;stroke-width:3;transform:translateY(-2px)}#effects{position:absolute;inset:0;z-index:9;pointer-events:none}.snack-pop{position:absolute;color:#31573c;background:#fffef1;box-shadow:0 3px 0 #4e713027;font-size:18px;font-weight:900;padding:7px 13px;border-radius:17px;animation:snack-float .85s ease-out forwards;white-space:nowrap}.snack-pop.milestone{background:#ffc1cd;color:#71394b;font-size:22px}.sparkle{position:absolute;width:7px;height:7px;border-radius:50%;background:#fff9c0;box-shadow:0 0 0 2px #c5b34b40;animation:spark .6s ease-out forwards}@keyframes snack-float{0%{opacity:0;transform:translate(-50%,-20%) scale(.6)}20%{opacity:1;transform:translate(-50%,-60%) scale(1.1)}60%{opacity:1}100%{opacity:0;transform:translate(-50%,-140%) scale(.9)}}@keyframes spark{to{transform:translate(var(--x),var(--y)) scale(.3);opacity:0}}.frog-bubble{position:absolute;left:50%;top:calc(65% - clamp(80px,10vw,128px));z-index:9;transform:translateX(-50%) rotate(-5deg);padding:9px 17px;background:var(--paper);border:2px solid white;border-radius:18px;box-shadow:0 4px 0 #5477401a;font-size:16px;font-weight:800;pointer-events:none;transition:opacity .4s}.frog-bubble:after{content:"";position:absolute;width:9px;height:9px;background:var(--paper);bottom:-5px;left:50%;transform:rotate(45deg)}.frog-bubble.dismissed{opacity:0}.game-footer{position:absolute;left:clamp(22px,3vw,50px);right:clamp(22px,3vw,50px);bottom:max(28px,env(safe-area-inset-bottom));display:grid;grid-template-columns:1fr auto 1fr;align-items:center;gap:18px;z-index:15;pointer-events:none}.controls{display:flex;gap:10px;pointer-events:auto}.icon-button{height:46px;width:46px;border-radius:50%;border:2px solid #fffef0b8;background:#fffef1ee;display:grid;place-items:center;box-shadow:0 3px 0 #48633720;transition:transform .15s,background .15s}.icon-button:hover{background:#fffef1;transform:translateY(-2px)}.icon-button:active{transform:translateY(1px)}.icon-button svg{width:21px;height:21px}.play-icon{display:none}.is-paused .pause-icon{display:none}.is-paused .play-icon{display:block}.instruction{font-size:15px;font-weight:700;display:flex;align-items:center;gap:10px;padding:14px 23px;background:#fffef1f5;border:1px solid #fff;border-radius:30px;box-shadow:0 4px 0 #47623516;margin:0;white-space:nowrap}.tap-icon{display:inline-flex;width:19px;height:22px;transform:rotate(-12deg);color:#6c8c51}.tap-icon svg{width:100%;height:100%}.pause-notice{position:absolute;left:50%;top:39%;transform:translate(-50%,-50%);padding:22px 30px;background:var(--paper);border:2px solid #fff;border-radius:26px;box-shadow:0 6px 0 #57774720;z-index:12;display:flex;flex-direction:column;gap:15px;align-items:center;white-space:nowrap}.pause-notice[hidden]{display:none}.pause-title{font-size:23px;font-weight:800;letter-spacing:-.03em}.resume-button{background:var(--ink);color:var(--paper);border:0;border-radius:20px;padding:11px 18px;font-size:15px;font-weight:700}.is-paused .frog-body{animation-play-state:paused}.is-paused .ant{opacity:.6}.sr-only{position:absolute;width:1px;height:1px;padding:0;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}
@media(max-width:650px){.game-header{top:max(20px,env(safe-area-inset-top));left:14px;right:14px;gap:8px;align-items:center}.brand{padding:15px 13px;border-radius:22px}.eyebrow{display:none}h1{font-size:clamp(26px,7vw,34px);margin:0}.snack-counter{min-width:122px;gap:8px;padding:11px 12px 10px 10px;border-radius:22px}.counter-icon{width:25px;height:39px;border-radius:12px}.counter-icon img{width:24px;height:34px}.counter-label{font-size:12px}.score{font-size:31px}.frog{width:155px;top:64%}.frog-bubble{top:calc(64% - 88px)}.game-footer{left:20px;right:20px;bottom:max(22px,env(safe-area-inset-bottom));grid-template-columns:1fr;gap:15px}.controls{position:absolute;bottom:63px;left:0;gap:8px}.icon-button{height:44px;width:44px}.instruction{justify-self:center;padding:13px 18px;font-size:14px;gap:9px}.ant img{width:33px;height:40px}}
@media(max-height:500px) and (min-width:651px){.game-header{top:15px}.game-footer{bottom:15px}.brand{padding:9px 16px}.eyebrow{display:none}h1{font-size:32px}.snack-counter{padding:8px 16px;min-width:140px}.counter-icon{height:36px;width:28px}.counter-icon img{height:30px;width:24px}.counter-label{font-size:12px}.score{font-size:27px}.frog{width:125px;top:61%}.frog-bubble{top:calc(61% - 72px)}.instruction{padding:10px 18px}.game-footer{grid-template-columns:1fr auto 1fr}}
.frog-body.feeding{animation:none;transform:none}
@media(prefers-reduced-motion:reduce){.frog-body{animation:none}.counter-pop{animation:none}.snack-pop{animation-duration:.2s}.sparkle{display:none}.icon-button{transition:none}}

.ant.red-ant img{filter:sepia(1) saturate(12) hue-rotate(317deg) brightness(1.65) drop-shadow(1px 2px 1px #86211850)}
.ant.worm img{width:46px;height:51px;filter:drop-shadow(1px 2px 1px #80493530)}
.frog-body.hot{animation:hot-wiggle .32s ease-in-out infinite;transform-origin:50% 90%}
.frog-body.hot img{filter:drop-shadow(0 0 12px #ff732785) drop-shadow(0 7px 3px #2246352b)}
@keyframes hot-wiggle{0%,100%{transform:rotate(-2deg) translateY(0)}50%{transform:rotate(2deg) translateY(-3px)}}
.frog-body.flipping{animation:none;transform-origin:50% 50%;will-change:transform}
.water-button{position:absolute;z-index:13;width:104px;min-height:110px;display:flex;flex-direction:column;align-items:center;justify-content:center;padding:5px 8px 10px;gap:0;border:2px solid #fff;background:#f3fcffeb;border-radius:26px;box-shadow:0 5px 0 #3a929545,0 0 24px #abedfa55;transform:translate(-50%,-50%);animation:water-bob 1.1s ease-in-out infinite;touch-action:manipulation}
.water-button[hidden]{display:none}.water-button img{width:74px;height:76px;object-fit:contain;pointer-events:none}.water-button span{font-size:16px;font-weight:900;color:#266e89}.water-button:hover{background:#fff}.water-button:active{background:#dff8ff}
@keyframes water-bob{0%,100%{transform:translate(-50%,-50%) rotate(-3deg)}50%{transform:translate(-50%,-55%) rotate(3deg)}}
.is-hot .instruction{background:#fff2dd;border-color:#ffd7b6;color:#783825}.is-hot .frog-bubble{color:#9a372e;background:#fff0d8;margin-top:-24px}.is-hot .frog-bubble:after{background:#fff0d8}
.is-paused .frog-body,.is-paused .water-button{animation-play-state:paused}.water-button:disabled{opacity:.6}
@media(max-width:650px){.water-button{width:94px;min-height:104px;border-radius:23px}.water-button img{width:68px;height:70px}}
@media(prefers-reduced-motion:reduce){.frog-body.hot,.water-button{animation:none}}

.ant.blue-ant img{filter:sepia(1) saturate(9) hue-rotate(165deg) brightness(1.65) drop-shadow(1px 2px 1px #164eaa55)}
.ant.butterfly img{width:55px;height:51px;filter:drop-shadow(1px 3px 2px #6e368035)}
.frog-body{position:relative;isolation:isolate}
.frog-body.blue #frog-image{filter:hue-rotate(115deg) saturate(1.6) drop-shadow(0 7px 3px #2246352b)}
.frog-body.blue.hot #frog-image{filter:hue-rotate(190deg) saturate(1.4) drop-shadow(0 0 12px #ff732785)}
.frog .frog-wings{display:none;position:absolute;z-index:-1;width:180%;height:145%;left:-40%;top:-30%;object-fit:contain;transform-origin:50% 60%;filter:drop-shadow(0 4px 3px #754ca633)}
.frog-body.has-wings .frog-wings{display:block;animation:wing-flutter .4s ease-in-out infinite alternate}
@keyframes wing-flutter{from{transform:scaleX(.83) rotate(-3deg)}to{transform:scaleX(1.08) rotate(3deg)}}
.frog .wipe-art{display:none;position:absolute;z-index:2;width:65%;height:65%;top:16%;left:15%}
.frog-body.wiping .wipe-art{display:block;animation:towel-wipe .8s ease-in-out}
@keyframes towel-wipe{0%,100%{transform:translateX(-25%) rotate(-15deg)}50%{transform:translateX(45%) rotate(15deg)}}
.towel-button{background:#f5f4ff;touch-action:none;animation:none}
.is-paused .frog-wings,.is-paused .wipe-art{animation-play-state:paused}
@media(prefers-reduced-motion:reduce){.frog-body.has-wings .frog-wings,.frog-body.wiping .wipe-art{animation:none}}

.ant.green-ant img{filter:sepia(1) saturate(9) hue-rotate(72deg) brightness(1.6) drop-shadow(1px 2px 1px #1d7d3550)}
.ant.rainbow-ant:after{content:"";position:absolute;inset:8px 12px;background:linear-gradient(#ff4267 0% 16%,#ff9a32 16% 32%,#ffe34b 32% 48%,#51d961 48% 64%,#3bb9ff 64% 80%,#ba63ef 80%);mask:url('/assets/ant.png') center/contain no-repeat;-webkit-mask:url('/assets/ant.png') center/contain no-repeat;transform:var(--ant-rotation);pointer-events:none}
.ant.rainbow-ant img{filter:drop-shadow(0 0 4px #fff)}
.mask-button{position:absolute;left:0;top:-14.5%;width:100%;height:65%;padding:0;border:0;background:transparent;z-index:4;pointer-events:auto;touch-action:manipulation;border-radius:35%}
.mask-button[hidden]{display:none}.frog .mask-button img{width:100%;height:100%;object-fit:fill;filter:drop-shadow(0 3px 2px #22463540)}
.mask-button:focus-visible{outline:3px dashed #fff;outline-offset:3px}
.rainbow-jets{display:none;position:absolute;inset:0;z-index:5;pointer-events:none}
.rainbow-power .rainbow-jets{display:block}
.rainbow-jet{position:absolute;display:block;width:clamp(140px,28vw,420px);height:22px;background:linear-gradient(to bottom,#ff4166 0% 14.28%,#ff9339 14.28% 28.56%,#ffe355 28.56% 42.84%,#57dc68 42.84% 57.12%,#40caff 57.12% 71.4%,#6571ef 71.4% 85.68%,#c365ed 85.68%);transform-origin:0 50%;border-radius:3px 60% 60% 3px;opacity:.92;mask-image:linear-gradient(to right,#000 65%,transparent);animation:rainbow-stream .65s ease-out infinite alternate;box-shadow:0 0 12px #fff7}
.eye-left{left:29%;top:14%;--beam-angle:-145deg;transform:rotate(var(--beam-angle))}
.eye-right{left:72%;top:14%;--beam-angle:-35deg;transform:rotate(var(--beam-angle));animation-delay:-.2s}
.mouth-jet{left:50%;top:32%;height:32px;--beam-angle:70deg;transform:rotate(var(--beam-angle));animation-delay:-.4s}
@keyframes rainbow-stream{from{transform:rotate(var(--beam-angle)) scaleX(.82)}to{transform:rotate(var(--beam-angle)) scaleX(1)}}
.is-paused .rainbow-jet{animation-play-state:paused}
@media(prefers-reduced-motion:reduce){.rainbow-jet{animation:none}}

.frog .dino-tail{display:none;position:absolute;width:100%;height:65%;left:63%;top:38%;z-index:-2;object-fit:contain;transform-origin:12% 65%;filter:drop-shadow(0 4px 2px #22463525)}
.has-tail .dino-tail{display:block;animation:tail-wag 1.8s ease-in-out infinite alternate}
@keyframes tail-wag{from{transform:rotate(-7deg)}to{transform:rotate(7deg)}}
.dino-progress{position:absolute;top:137px;right:clamp(22px,3vw,50px);z-index:15;background:#e4ffc8;color:#325d2d;border:2px solid white;border-radius:18px;padding:7px 12px;font-size:14px;font-weight:800}
.dino-progress[hidden],.dino-cinema[hidden]{display:none}
.dino-cinema{position:absolute;inset:0;z-index:30;background:linear-gradient(#203659 0%,#758faa 61%,#c7ad77 62%,#927043 100%);overflow:hidden;border-block:clamp(16px,5vh,45px) solid #182327;display:flex;align-items:center;flex-direction:column}
.cinema-sky{position:absolute;inset:0;background:url('/assets/garden.webp') center/cover;opacity:.12;pointer-events:none}
.dino-cinema h2{position:absolute;top:8%;margin:0 20px;text-align:center;color:#fff5c5;font-size:clamp(24px,5vw,50px);letter-spacing:.03em;text-shadow:0 3px #203047;z-index:3}
.stomp-stage{position:absolute;inset:0;transform-origin:center 75%}
.stomp-hill{position:absolute;bottom:19%;width:clamp(90px,19vw,235px);height:clamp(105px,25vh,240px);object-fit:fill;transform-origin:50% 100%;transform:translateX(-50%);filter:drop-shadow(3px 7px 2px #302b2945)}
.stomp-frog{position:absolute;left:8%;bottom:17%;width:clamp(170px,30vw,365px);height:clamp(210px,43vh,420px);object-fit:contain;transform:translateX(-50%);z-index:2;filter:drop-shadow(3px 9px 3px #302b2960)}
.dino-cinema>.resume-button{position:absolute;bottom:4%;z-index:4;background:#fff4cd;color:#294c35;min-height:44px}
.stomp-impact .stomp-stage{animation:stomp-shake .16s ease-in-out infinite}
@keyframes stomp-shake{0%,100%{translate:0 0}50%{translate:0 5px}}
.in-cinema .game-header,.in-cinema .game-footer,.in-cinema #ants,.in-cinema .mask-button,.in-cinema .water-button{visibility:hidden}
.in-cinema .pause-notice{z-index:40}
.is-paused .dino-tail,.is-paused .stomp-stage{animation-play-state:paused}
@media(max-width:650px){.dino-progress{top:102px;right:15px;font-size:14px}.stomp-frog{width:185px}.stomp-hill{width:105px}}
@media(prefers-reduced-motion:reduce){.has-tail .dino-tail,.stomp-impact .stomp-stage{animation:none}}

.ant.gold-ant img{filter:sepia(1) saturate(8) hue-rotate(3deg) brightness(2.1) drop-shadow(0 0 3px #ffd339)}
.ant.pink-ant img{filter:sepia(1) saturate(7) hue-rotate(285deg) brightness(2) drop-shadow(1px 2px 1px #a3297355)}
.crown-button{position:absolute;left:24%;top:-22%;width:52%;height:34%;padding:0;border:0;background:transparent;z-index:7;pointer-events:auto;touch-action:manipulation;border-radius:20%}
.frog .crown-button img{width:100%;height:100%;object-fit:contain;filter:drop-shadow(0 3px 2px #85682350)}
.crown-button[hidden],.belly-button[hidden]{display:none}
.frog .pink-belly-art{display:none;position:absolute;inset:0;z-index:1;pointer-events:none;clip-path:ellipse(23% 24% at 50% 62%);filter:sepia(1) saturate(3) hue-rotate(285deg)}
.pink-belly .pink-belly-art{display:block}
.belly-button{position:absolute;left:28%;top:43%;width:44%;height:40%;padding:0;border:0;background:transparent;border-radius:50%;z-index:3;pointer-events:auto;touch-action:manipulation;min-width:44px;min-height:44px}
.belly-button:focus-visible,.crown-button:focus-visible{outline:3px dashed #fff;outline-offset:3px}
.soap-bubble{position:absolute;left:0;top:0;border-radius:50%;border:1.5px solid #fffdf0;background:radial-gradient(circle at 30% 25%,#fff 0 7%,transparent 13%),radial-gradient(circle at 65% 75%,#ffc4e960,transparent 65%);box-shadow:inset 2px 2px 5px #d3faffb0,inset -2px -2px 4px #ffbee99c,0 0 2px #71adbc;pointer-events:none;will-change:transform,opacity}
.in-cinema .crown-button,.in-cinema .belly-button{visibility:hidden}
