*,*:before,*:after{box-sizing:border-box}*{margin:0}html{interpolate-size:allow-keywords}body{line-height:1.5;-webkit-font-smoothing:antialiased}img,picture,video,canvas,svg{display:block;max-width:100%}input,button,textarea,select{font:inherit}p{overflow-wrap:break-word;text-wrap:pretty}h1,h2,h3,h4,h5,h6{overflow-wrap:break-word;text-wrap:balance}#root,#app{isolation:isolate}:root{font-family:system-ui,-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,Oxygen,Ubuntu,Cantarell,Open Sans,Helvetica Neue,sans-serif;color-scheme:light dark}body{min-height:100dvh}#app{max-width:80ch;margin-inline:auto;padding:2rem}:root{--buddy-sky: #29a8e0;--buddy-sky-deep: #1f8ec2;--buddy-face: #fbc02d;--buddy-ink: #102a43;--buddy-cheek: #f4633a;--buddy-bubble: #f8f5ec}.buddy-page{min-height:100dvh;margin-inline:-2rem;margin-block:-2rem;padding:2rem 2rem 3rem;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:.25rem;text-align:center;background:radial-gradient(circle at 50% 30%,var(--buddy-sky) 0%,var(--buddy-sky-deep) 100%);color:#fff}.buddy-page h1{font-size:clamp(2rem,8vw,3rem);font-weight:800;letter-spacing:-.02em;margin:0;text-shadow:0 2px 0 rgba(16,42,67,.25)}.buddy-hint{margin:0 0 1rem;font-size:clamp(1rem,4vw,1.25rem);font-weight:600;opacity:.95}.buddy-stage{position:relative;width:min(72vw,320px);aspect-ratio:1;display:grid;place-items:center}.buddy{appearance:none;border:none;background:none;padding:0;margin:0;width:100%;cursor:pointer;-webkit-tap-highlight-color:transparent;transition:transform .12s ease}.buddy svg{width:100%;height:auto;display:block;filter:drop-shadow(0 12px 18px rgba(16,42,67,.3))}.buddy:active{transform:scale(.96)}.buddy:focus-visible{outline:4px solid #fff;outline-offset:8px;border-radius:50%}.buddy--blowing{animation:buddy-wobble .45s ease}@keyframes buddy-wobble{0%{transform:scale(1) rotate(0)}30%{transform:scale(1.05,.95) rotate(-3deg)}60%{transform:scale(.97,1.03) rotate(2deg)}to{transform:scale(1) rotate(0)}}.buddy-hair{fill:var(--buddy-ink)}.buddy-face{fill:var(--buddy-face);stroke:var(--buddy-ink);stroke-width:6}.buddy-cheek{fill:var(--buddy-cheek);opacity:.85}.buddy-eye{fill:var(--buddy-ink)}.buddy-nose,.buddy-mouth{fill:none;stroke:var(--buddy-ink);stroke-width:5;stroke-linecap:round}.buddy-mouth{fill:#b23a23}.bubble{position:absolute;left:58%;top:64%;width:var(--size, 64px);height:var(--size, 64px);margin-left:calc(var(--size, 64px) / -2);margin-top:calc(var(--size, 64px) / -2);border-radius:50%;background:radial-gradient(circle at 32% 30%,#ffffff 0%,var(--buddy-bubble) 45%,rgba(248,245,236,.6) 100%);border:3px solid rgba(16,42,67,.85);box-shadow:inset 0 -6px 10px #102a431f;pointer-events:none;transform-origin:center;animation:bubble-float 1.8s ease-out forwards}@keyframes bubble-float{0%{transform:translate(0) scale(.1);opacity:0}18%{opacity:1}70%{transform:translate(calc(var(--drift) * .7),-130px) scale(1);opacity:1}92%{transform:translate(var(--drift),-210px) scale(1.05);opacity:1}to{transform:translate(var(--drift),-224px) scale(1.3);opacity:0}}@media(prefers-reduced-motion:reduce){.buddy--blowing{animation:none}.bubble{animation:bubble-float-still 1.4s linear forwards}@keyframes bubble-float-still{0%{opacity:0;transform:scale(.6)}20%{opacity:1;transform:scale(1)}80%{opacity:1;transform:scale(1)}to{opacity:0;transform:scale(1)}}}
