*{margin:0;padding:0;box-sizing:border-box}html,body{height:100%;overflow:hidden}body{font-family:ui-rounded,SF Pro Rounded,Arial Rounded MT Bold,Nunito,system-ui,sans-serif;background:#aee1f5;-webkit-tap-highlight-color:transparent;user-select:none;-webkit-user-select:none}button{font:inherit;border:none;cursor:pointer}#app{height:100dvh;display:flex;flex-direction:column}header{display:flex;align-items:center;justify-content:space-between;padding:10px 16px;gap:10px;position:relative;z-index:30}.title-chip{background:#16626c;color:#fff;border-radius:999px;padding:7px 18px;box-shadow:0 3px #0000001f;line-height:1.05;text-align:left}.title-chip .t{font-size:17px;font-weight:800;letter-spacing:.5px;display:block}.title-chip .k{font-size:10px;font-weight:700;text-transform:uppercase;letter-spacing:1.2px;opacity:.82;display:block}.counter-chip{background:#fff;color:#16626c;border-radius:999px;padding:8px 16px;font-weight:800;font-size:15px;box-shadow:0 3px #0000001a;display:flex;align-items:center;gap:7px;transition:transform .18s cubic-bezier(.34,1.56,.64,1)}.counter-chip.bump{transform:scale(1.18)}.counter-chip svg{width:21px;height:21px;color:#2e7d32;flex-shrink:0}.header-right{display:flex;align-items:center;gap:8px}.mute-btn{background:#fff;border-radius:50%;width:38px;height:38px;box-shadow:0 3px #0000001a;display:grid;place-items:center;transition:transform .15s cubic-bezier(.34,1.56,.64,1);color:#16626c}.mute-btn svg{width:21px;height:21px}.mute-btn:active{transform:scale(.9)}.help-btn{color:#16626c;font-weight:800;font-size:19px}#stage{position:relative;flex:1;overflow:visible;touch-action:none;background:linear-gradient(#9fd4ee,#bfe6f7 55%)}.hill-back{position:absolute;left:-8%;right:30%;bottom:36%;height:34%;background:#a2cf7f;border-radius:50% 50% 0 0/100% 100% 0 0}.ground{position:absolute;left:-5%;right:-5%;bottom:0;height:60%;background:linear-gradient(#8ec46e,#7dbb5e 30%);border-radius:48% 52% 0 0/80px 64px 0 0}.ground:after{content:"";position:absolute;top:0;right:0;bottom:0;left:0;background:radial-gradient(140px 36px at 20% 34%,#74b356 60%,transparent 61%),radial-gradient(170px 44px at 72% 58%,#74b356 60%,transparent 61%),radial-gradient(100px 28px at 46% 84%,#6aa84e 60%,transparent 61%),radial-gradient(120px 32px at 88% 30%,#6fae51 60%,transparent 61%);border-radius:inherit}.decor{position:absolute;pointer-events:none}.sun{top:4%;left:4%;width:min(9vw,74px);height:min(9vw,74px);background:#ffe9a3;border-radius:50%;box-shadow:0 0 0 12px #ffe9a359,0 0 0 26px #ffe9a324}.bird-flight{left:0;top:8%;animation:fly 46s linear infinite;will-change:transform}.bird-flight.bf2{top:13%;animation-duration:64s;animation-delay:-30s}.bird-flight.bf3{top:5.5%;animation-duration:55s;animation-delay:-44s}@keyframes fly{0%{transform:translate(-8vw)}to{transform:translate(106vw)}}.bird{display:block;width:30px;animation:bob 3.4s ease-in-out infinite alternate}.bf2 .bird{width:23px;animation-duration:2.9s}.bf3 .bird{width:17px;animation-duration:3.8s}@keyframes bob{0%{transform:translateY(0)}to{transform:translateY(-10px)}}.bird path{stroke:#6b8a9e;stroke-width:2.6;fill:none;stroke-linecap:round;transform-box:view-box;transform-origin:14px 10px}.bird .wl{animation:flapL .55s ease-in-out infinite alternate}.bird .wr{animation:flapR .55s ease-in-out infinite alternate}@keyframes flapL{0%{transform:rotate(16deg)}to{transform:rotate(-14deg)}}@keyframes flapR{0%{transform:rotate(-16deg)}to{transform:rotate(14deg)}}.decor-cloud{background:#fff;opacity:.9;border-radius:999px;box-shadow:26px 8px 0 -4px #fff,-24px 10px 0 -6px #fff;animation:drift 60s linear infinite}.decor-cloud.c1{width:70px;height:26px;top:7%;left:14%}.decor-cloud.c2{width:90px;height:30px;top:14%;left:58%;animation-duration:80s}.decor-cloud.c3{width:56px;height:22px;top:4%;left:82%;animation-duration:70s}@keyframes drift{0%{transform:translate(0)}to{transform:translate(-120vw)}}.treeline{left:-4%;width:108%;bottom:58%;height:clamp(34px,6.5vw,58px)}.fence{left:-2%;width:104%;bottom:55.8%;height:clamp(13px,2.4vw,22px)}.path-svg{left:50%;transform:translate(-50%);bottom:0;height:56.5%;width:clamp(180px,30vw,340px)}.decor-tree.t1{width:min(16vw,150px);left:2%;bottom:44%}.swingset{width:min(24vw,220px);left:14%;bottom:34%}.slide{width:min(26vw,250px);right:3%;bottom:32%}.bench{width:min(11vw,100px);right:30%;bottom:31%}.bush.b1{width:min(10vw,95px);left:30%;bottom:46%}.bush.b2{width:min(9vw,85px);right:31%;bottom:43%}.flower.f1{width:clamp(16px,2.4vw,26px);left:26%;bottom:24%}.flower.f2{width:clamp(16px,2.4vw,26px);right:18%;bottom:34%}.tuft.u1{width:clamp(16px,2.2vw,24px);left:10%;bottom:16%;opacity:.9}.tuft.u2{width:clamp(16px,2.2vw,24px);right:8%;bottom:22%;opacity:.9}.parksign{width:min(11vw,104px);left:4%;bottom:26%}.item .label-chip{opacity:0;transition:opacity .3s ease .15s}.item.held .label-chip{opacity:1}#mascot{position:absolute;z-index:4;width:clamp(70px,10.5vw,110px);left:14%;top:76%;transform:translate(-50%,-88%);pointer-events:none}#mascot .rc-wrap{position:relative;transform-origin:50% 92%;animation:rcbob 3s ease-in-out infinite}#mascot .rc{display:block;width:100%}@keyframes rcbob{0%,to{transform:scaleY(1)}50%{transform:scaleY(.97)}}.rc-tail{transform-box:view-box;transform-origin:88px 96px;animation:rcwag 3.4s ease-in-out infinite}@keyframes rcwag{0%,to{transform:rotate(0)}50%{transform:rotate(7deg)}}.rc-armL,.rc-armR{transform-box:view-box;transition:transform .22s cubic-bezier(.34,1.56,.64,1)}.rc-armL{transform-origin:38px 91px}.rc-armR{transform-origin:82px 91px}.rc-eyes{position:absolute;top:24.5%;left:50%;transform:translate(-50%);display:flex;gap:clamp(9px,1.4vw,14px)}.rc-eyes .eye{width:clamp(15px,2.3vw,21px);height:clamp(15px,2.3vw,21px);background:#fff;border-radius:50%;display:grid;place-items:center}.rc-eyes .pupil{position:relative;width:52%;height:52%;background:#222;border-radius:50%;transition:transform .1s linear}.rc-eyes .pupil:after{content:"";position:absolute;width:36%;height:36%;top:10%;right:8%;background:#fff;border-radius:50%}#mascot.walking{transition:left 2.2s linear}#mascot.walking .rc-wrap{animation:rcwaddle .38s ease-in-out infinite alternate}@keyframes rcwaddle{0%{transform:rotate(4deg) translateY(-2px)}to{transform:rotate(-4deg) translateY(0)}}#mascot.cheer .rc-wrap{animation:rcjump .48s cubic-bezier(.34,1.56,.64,1) 2}@keyframes rcjump{0%,to{transform:translateY(0)}40%{transform:translateY(-20px) scaleY(1.05)}65%{transform:translateY(-12px)}}#mascot.cheer .rc-armL{transform:rotate(-42deg)}#mascot.cheer .rc-armR{transform:rotate(42deg)}#mascot.oops .rc-wrap{animation:rcoops .95s ease-in-out}@keyframes rcoops{0%,to{transform:rotate(0)}25%{transform:rotate(-7deg)}60%{transform:rotate(5deg)}}.item{--psize: 1;position:absolute;width:calc(clamp(64px,10.5vw,96px) * var(--psize));transform:translate(-50%,-50%);cursor:pointer;z-index:5;transition:transform .22s cubic-bezier(.34,1.56,.64,1);touch-action:none}.item:hover{transform:translate(-50%,-50%) scale(1.08) rotate(-2deg)}.item svg{position:relative;z-index:1;width:100%;height:auto;display:block;pointer-events:none}.item .ishadow{position:absolute;z-index:0;left:50%;bottom:-4%;width:86%;height:14%;transform:translate(-50%);background:#14320f2e;border-radius:50%;filter:blur(2px)}.item.held{z-index:40;cursor:grab;width:calc(clamp(110px,17vw,165px) * var(--psize));transition:left .38s cubic-bezier(.3,1.35,.5,1),top .38s cubic-bezier(.3,1.35,.5,1),width .38s cubic-bezier(.3,1.35,.5,1);animation:floaty 2.4s ease-in-out .45s infinite}.item.held .ishadow,.item.dragging .ishadow{opacity:0;transition:opacity .2s}.item.returning{transition:left .45s cubic-bezier(.3,1.2,.5,1),top .45s cubic-bezier(.3,1.2,.5,1),width .45s cubic-bezier(.3,1.2,.5,1),rotate .45s ease;animation:none}.item.dragging{transition:none;animation:none;cursor:grabbing}.item.settling{transition:left .3s cubic-bezier(.3,1.4,.5,1),top .3s cubic-bezier(.3,1.4,.5,1);animation:none}@keyframes floaty{0%,to{transform:translate(-50%,-50%) rotate(-1.5deg)}50%{transform:translate(-50%,-52.5%) rotate(1.5deg)}}.item.tobin,.item.held.tobin{z-index:40;transition:left .3s cubic-bezier(.45,.05,.7,.4),top .3s cubic-bezier(.45,.05,.7,.4);animation:none;cursor:default}.item.tobin.vanish,.item.held.tobin.vanish{z-index:12;transition:width .3s ease-in,opacity .2s ease-in .14s,left .3s ease-in,top .3s ease-in;opacity:0;width:calc(clamp(60px,9vw,90px) * var(--psize))}#bins{position:relative;z-index:20;display:flex;justify-content:center;align-items:flex-end;gap:clamp(8px,2.4vw,26px);padding:0 10px calc(12px + env(safe-area-inset-bottom));background:#7dbb5e;margin-top:-1px}.bin{position:relative;width:clamp(76px,20vw,150px);cursor:pointer;transition:transform .2s cubic-bezier(.34,1.56,.64,1)}.bin:hover{transform:translateY(-4px)}.bin:after{content:"";position:absolute;z-index:-1;left:50%;bottom:-9px;width:112%;height:13px;transform:translate(-50%);background:#14320f29;border-radius:50%;filter:blur(2px)}.bin{--lidh: clamp(20px, 3.4vw, 28px)}.bin .lid{position:relative;z-index:3;height:var(--lidh);margin:0 -4%;background:var(--bin-dark);border-radius:10px 10px 4px 4px;transform-origin:6% 98%;transition:transform .22s cubic-bezier(.34,1.56,.64,1)}.bin .eyes{position:absolute;z-index:4;top:clamp(-16px,-2.4vw,-12px);left:50%;transform:translate(-50%);display:flex;gap:clamp(6px,1.4vw,12px)}.bin .eye{width:clamp(16px,3vw,24px);height:clamp(16px,3vw,24px);background:#fff;border-radius:50%;box-shadow:0 2px #00000026;display:grid;place-items:center}.bin .pupil{width:42%;height:42%;background:#222;border-radius:50%;transition:transform .1s linear}.bin .mouth{position:absolute;z-index:2;top:calc(var(--lidh) - 3px);left:50%;transform:translate(-50%) scaleY(.22);width:52%;height:clamp(14px,2.6vw,22px);background:#2b1c1c;border-radius:0 0 999px 999px;transform-origin:top center;transition:transform .18s cubic-bezier(.34,1.56,.64,1)}.bin .mouth:after{content:"";position:absolute;bottom:12%;left:22%;width:56%;height:42%;background:#d96a6a;border-radius:999px 999px 40% 40%}.bin.open .mouth{transform:translate(-50%) scaleY(1)}.bin.open .lid{transform:rotate(-11deg) translateY(-2px)}.bin .body{position:relative;margin:-3px 2% 0;background:var(--bin-color);border-radius:8px 8px 14px 14px;height:clamp(72px,15vw,118px);display:flex;flex-direction:column;align-items:center;justify-content:center;gap:clamp(3px,.8vw,7px);box-shadow:inset -8px 0 #0000001f,0 5px #00000024;padding:4px 6px}.bin .icon{width:clamp(26px,5.4vw,42px);height:clamp(26px,5.4vw,42px);background:#fff;color:var(--bin-color);border-radius:50%;display:grid;place-items:center;padding:5px}.bin .icon svg{width:100%;height:100%}.bin .name{background:#fff;color:#333;font-size:clamp(8.5px,1.55vw,12.5px);font-weight:800;text-align:center;line-height:1.1;border-radius:6px;padding:3px 6px;letter-spacing:.2px}.bin.ready .body{animation:readypulse 1.6s ease-in-out infinite}@keyframes readypulse{0%,to{box-shadow:inset -8px 0 #0000001f,0 5px #00000024,0 0 #fff0}50%{box-shadow:inset -8px 0 #0000001f,0 5px #00000024,0 0 0 6px #ffffff8c}}.bin.gulp{animation:gulp .55s cubic-bezier(.34,1.56,.64,1)}@keyframes gulp{0%{transform:scale(1)}30%{transform:scale(1.12,.82)}60%{transform:scale(.94,1.1)}to{transform:scale(1)}}.bin.shake{animation:shake .5s ease-in-out}@keyframes shake{0%,to{transform:translate(0) rotate(0)}20%{transform:translate(-7px) rotate(-3deg)}40%{transform:translate(7px) rotate(3deg)}60%{transform:translate(-5px) rotate(-2deg)}80%{transform:translate(5px) rotate(2deg)}}.bin.beckon{animation:beckon 1s ease-in-out infinite}@keyframes beckon{0%,to{transform:translateY(0) rotate(0)}25%{transform:translateY(-10px) rotate(-4deg)}50%{transform:translateY(0) rotate(0)}75%{transform:translateY(-10px) rotate(4deg)}}#label-backdrop{position:fixed;top:0;right:0;bottom:0;left:0;z-index:45;background:#16626c59;opacity:0;pointer-events:none;transition:opacity .25s ease}#label-backdrop.show{opacity:1;pointer-events:auto}#label-card{position:fixed;z-index:50;left:50%;top:54%;transform:translate(-50%,-46%) scale(.6);width:min(88vw,380px);background:#fff;border-radius:22px;box-shadow:0 18px 50px #00000047;opacity:0;pointer-events:none;transition:transform .32s cubic-bezier(.34,1.56,.64,1),opacity .22s ease;overflow:hidden;border:4px solid #16626c}#label-card.show{opacity:1;pointer-events:auto;transform:translate(-50%,-46%) scale(1)}.lc-kicker{background:#16626c;color:#fff;font-size:11px;font-weight:800;letter-spacing:1.6px;text-transform:uppercase;text-align:center;padding:8px}.lc-labelwrap{display:grid;place-items:center;padding:14px 16px 6px;background:radial-gradient(circle at 30% 20%,#f6f3ea,#eeeadf)}.lc-labelwrap svg.h2r-label{width:min(52vw,190px);transform:rotate(-1.6deg);filter:drop-shadow(0 6px 14px rgba(0,0,0,.16))}.h2r-label .des-hl{stroke:var(--des-color);animation:hlpulse 1.5s ease-in-out infinite}#label-card.pulse-hard .h2r-label .des-hl{animation:hlpulse .55s ease-in-out infinite}@keyframes hlpulse{0%,to{opacity:0}50%{opacity:1}}.lc-kidline{margin:12px 16px;padding:10px 12px;display:flex;align-items:center;gap:12px;border-radius:14px;background:color-mix(in srgb,var(--des-color) 12%,#fff);border:2.5px solid var(--des-color)}.lc-kidline .ic{flex:0 0 46px;height:46px;background:var(--des-color);color:#fff;border-radius:50%;display:grid;place-items:center;padding:7px}.lc-kidline .ic svg{width:100%;height:100%}.lc-kidline .words{display:flex;flex-direction:column;gap:2px}.lc-kidline .words b{font-size:clamp(16px,4.2vw,20px);font-weight:800;color:#222;line-height:1.1}.lc-kidline .words span{font-size:clamp(12px,3.2vw,14px);font-weight:600;color:#555}.lc-cta{display:block;width:calc(100% - 32px);margin:0 16px 12px;background:#f0a422;color:#4a3000;font-size:19px;font-weight:800;padding:13px;border-radius:14px;box-shadow:0 4px #c07d0a;transition:transform .12s ease}.lc-cta:active{transform:translateY(3px);box-shadow:0 1px #c07d0a}.lc-site{text-align:center;font-size:10px;font-weight:700;color:#aaa;padding-bottom:10px;letter-spacing:.6px}#toast{position:fixed;z-index:60;left:50%;bottom:24%;transform:translate(-50%) translateY(14px);background:#16626c;color:#fff;font-size:clamp(14px,3.6vw,17px);font-weight:800;padding:12px 22px;border-radius:999px;box-shadow:0 6px 20px #00000040;opacity:0;pointer-events:none;transition:opacity .22s ease,transform .3s cubic-bezier(.34,1.56,.64,1);max-width:86vw;text-align:center}#toast.show{opacity:1;transform:translate(-50%) translateY(0)}#toast.happy{background:#2e7d32}#toast.oops{background:#b23a2f}#hand{position:fixed;z-index:70;width:52px;pointer-events:none;opacity:0;transition:opacity .3s ease,left .9s cubic-bezier(.45,.1,.35,1),top .9s cubic-bezier(.45,.1,.35,1);filter:drop-shadow(0 4px 6px rgba(0,0,0,.25))}#hand.show{opacity:1}#hand.tapping{animation:handtap 1.1s ease-in-out infinite}@keyframes handtap{0%,to{transform:translateY(0) scale(1)}50%{transform:translateY(-14px) scale(.92)}}.tap-ring{position:fixed;z-index:69;width:70px;height:70px;border:4px solid #fff;border-radius:50%;transform:translate(-50%,-50%);pointer-events:none;opacity:0}.tap-ring.show{animation:ringpulse 1.1s ease-out infinite}@keyframes ringpulse{0%{opacity:.9;transform:translate(-50%,-50%) scale(.5)}to{opacity:0;transform:translate(-50%,-50%) scale(1.25)}}#clear-overlay{position:fixed;top:0;right:0;bottom:0;left:0;z-index:80;display:grid;place-items:center;background:#16626c80;opacity:0;pointer-events:none;transition:opacity .3s ease}#clear-overlay.show{opacity:1;pointer-events:auto}.clear-card{background:#fff;border-radius:26px;padding:34px 40px;text-align:center;box-shadow:0 24px 60px #0000004d;transform:scale(.7);transition:transform .38s cubic-bezier(.34,1.56,.64,1);max-width:86vw}#clear-overlay.show .clear-card{transform:scale(1)}.clear-card .emoji{font-size:54px}.clear-card h2{color:#16626c;font-size:clamp(22px,6vw,30px);margin:10px 0 4px}.clear-card p{color:#555;font-weight:700;font-size:17px;margin-bottom:20px}.clear-card p b{color:#2e7d32;font-size:22px}.clear-card button{background:#2e7d32;color:#fff;font-size:19px;font-weight:800;padding:14px 34px;border-radius:999px;box-shadow:0 5px #1d5a21;transition:transform .12s ease}.clear-card button:active{transform:translateY(4px);box-shadow:0 1px #1d5a21}#intro-overlay{position:fixed;top:0;right:0;bottom:0;left:0;z-index:100;display:grid;place-items:center;background:#16626c8c;padding:16px;transition:opacity .35s ease}#intro-overlay.hidden{opacity:0;pointer-events:none}.intro-card{position:relative;background:#fff;border-radius:26px;padding:54px 30px 22px;text-align:center;box-shadow:0 24px 60px #0000004d;max-width:min(92vw,470px)}.intro-mascot{position:absolute;top:-58px;left:50%;transform:translate(-50%);width:86px;pointer-events:none}.intro-mascot .rc-wrap{position:relative}.intro-card h1{color:#16626c;font-size:clamp(30px,8vw,40px);letter-spacing:.5px;line-height:1}.intro-kicker{color:#16626c;opacity:.75;font-size:12px;font-weight:800;text-transform:uppercase;letter-spacing:2px;margin:6px 0 12px}.intro-blurb{color:#444;font-weight:600;font-size:clamp(14px,3.6vw,16.5px);line-height:1.45;max-width:36ch;margin:0 auto 18px}.intro-steps{display:flex;justify-content:center;align-items:stretch;gap:clamp(8px,2.4vw,18px);margin-bottom:20px}.intro-steps .step{flex:1;max-width:120px;background:#f1f1ee;border-radius:14px;padding:12px 8px 10px;display:flex;flex-direction:column;align-items:center;gap:8px}.intro-steps .step-ic{height:58px;display:grid;place-items:center}.intro-steps .step-ic svg{height:56px;width:auto}.intro-steps .step-ic.step-bin{width:54px;height:54px;border-radius:50%;background:#2e7d32;color:#fff;padding:9px;align-self:center}.intro-steps .step-ic.step-bin svg{width:100%;height:100%}.intro-steps span{font-size:clamp(11px,2.8vw,13px);font-weight:700;color:#444;line-height:1.25}.intro-steps span b{display:inline-grid;place-items:center;width:18px;height:18px;border-radius:50%;background:#16626c;color:#fff;font-size:11px;margin-right:3px}#play-btn{background:#2e7d32;color:#fff;font-size:clamp(19px,5vw,23px);font-weight:800;padding:15px 52px;border-radius:999px;box-shadow:0 5px #1d5a21;transition:transform .12s ease;animation:playpulse 1.8s ease-in-out infinite}#play-btn:active{transform:translateY(4px);box-shadow:0 1px #1d5a21}@keyframes playpulse{0%,to{transform:scale(1)}50%{transform:scale(1.05)}}.intro-grownup{margin-top:16px;font-size:10.5px;font-weight:600;color:#999;max-width:44ch;margin-left:auto;margin-right:auto;line-height:1.4}.confetti{position:fixed;z-index:90;border-radius:2px;pointer-events:none}@media(prefers-reduced-motion:reduce){*,*:before,*:after{animation-duration:.01ms!important;animation-iteration-count:1!important;transition-duration:.01ms!important}}
