.playground{padding-block:45px 60px;border-top:1px solid #d8dfcd}.playground-heading{display:flex;justify-content:space-between;align-items:center;gap:20px}.playground h2{font-family:var(--round);font-size:32px;margin:12px 0}.playground p{font-size:13px;line-height:1.8}.playground-controls{display:flex;gap:8px;flex-wrap:wrap}.playground-controls button{background:#fffdf4;border:1px solid #a9b79f;color:var(--ink);border-radius:24px;padding:10px 18px;min-height:44px}.playground-floor{display:flex;justify-content:center;gap:clamp(16px,7vw,110px);background:#f1f0df;border-radius:28px;padding:72px 20px 26px;margin-top:20px;overflow:hidden}.hopper{position:relative;text-align:center}.hop-cat{display:block;border:0;padding:0;background:none;color:var(--ink);min-width:80px;position:relative}.hop-cat .hop-art{display:block;width:clamp(78px,17vw,135px);height:clamp(78px,17vw,135px);transform-origin:50% 100%;margin:auto}.hop-name{display:block;margin-top:18px;font-size:12px}.hop-shadow{position:absolute;left:10%;top:calc(clamp(78px,17vw,135px) - 4px);width:80%;height:11px;border-radius:50%;background:#23362b26;transform-origin:center;pointer-events:none}.hopper.is-hopping .hop-art{animation:cat-hop 1.25s both}.hopper.is-hopping .hop-shadow{animation:cat-shadow 1.25s both}.hop-cat::after{content:'';position:absolute;top:calc(clamp(78px,17vw,135px) - 6px);left:50%;width:5px;height:5px;border-radius:50%;background:#a9b79f;opacity:0;box-shadow:28px 0 #a9b79f,-28px 0 #a9b79f;pointer-events:none}.is-hopping .hop-cat::after{animation:cat-dust 1.25s both}@keyframes cat-hop{0%,100%{transform:translateY(0) scale(1)}12%{transform:translateY(0) scale(1.12,.86)}28%{transform:translateY(-38px) scale(.9,1.1)}43%,50%{transform:translateY(-54px) scale(.98,1.02)}70%{transform:translateY(0) scale(.94,1.07)}78%{transform:translateY(0) scale(1.15,.82)}89%{transform:translateY(-5px) scale(.98,1.02)}}@keyframes cat-shadow{0%,100%{transform:scale(1);opacity:1}43%,50%{transform:scale(.6);opacity:.35}78%{transform:scale(1.15);opacity:1}}@keyframes cat-dust{0%,69%,100%{opacity:0;transform:translate(-50%,0) scale(1)}76%{opacity:.6}94%{opacity:0;transform:translate(-50%,-9px) scale(1.6)}}@media(max-width:700px){.playground-heading{display:block}.playground h2{font-size:27px}.playground-floor{padding-inline:10px;gap:18px}.playground p{font-size:12px}}@media(prefers-reduced-motion:reduce){.hopper.is-hopping .hop-art,.hopper.is-hopping .hop-shadow,.is-hopping .hop-cat::after{animation:none}.hop-cat:active .hop-art{outline:3px solid #b25130;outline-offset:3px}}
.playground .hop-cat{margin:0}.playground .hop-art img{pointer-events:none}.playground .hop-cat:focus-visible{border-radius:18px}
.playground .hop-art{overflow:visible;background:none;border-radius:0;position:relative}.playground .hop-art img{position:static;display:block;width:100%;height:100%;object-fit:contain;max-width:100%}
.playground-floor{gap:clamp(10px,4vw,110px)}