*{box-sizing:border-box}body{margin:0;background:#e8f5fb;color:#244956;font-family:system-ui,sans-serif}header{display:flex;justify-content:space-between;align-items:center;padding:12px 20px;background:#fffdf7}a{color:inherit;font-weight:750;text-decoration:none}header img{width:35px;vertical-align:middle;margin-right:6px}main{max-width:900px;margin:auto;padding:14px}h1{font-size:clamp(1.35rem,3vw,1.9rem);margin:0}.top,.controls{display:flex;align-items:center;justify-content:space-between;gap:10px}.controls{justify-content:center;margin:12px 0}button{font:inherit;cursor:pointer;border:3px solid white;border-radius:17px;padding:10px 15px;color:#244956;background:#fffaf0;font-weight:750;min-height:48px}button:focus-visible,a:focus-visible{outline:4px solid #244956;outline-offset:3px}.prompt{font-size:clamp(1.1rem,3vw,1.5rem);text-align:center;margin:12px 0 4px;min-height:2.6em;display:grid;place-items:center}.arena{height:clamp(300px,56svh,510px);position:relative;overflow:hidden;border:4px solid white;border-radius:30px;background:radial-gradient(ellipse at 20% 20%,#fff 0,transparent 45%),linear-gradient(#d7effb,#f9f1e2);touch-action:manipulation}.balloon{position:absolute;width:90px;height:110px;padding:0;border:0;background:transparent;will-change:transform;min-height:0;touch-action:manipulation}.balloon:before{content:'';position:absolute;inset:0 0 12px;border:2px solid #0002;border-radius:49% 49% 47% 47%;background:radial-gradient(ellipse at 30% 22%,#fffc 0,#fff5 12%,transparent 32%),var(--color);box-shadow:inset -8px -8px 0 #00000012,0 7px 10px #31536512}.balloon:after{content:'';position:absolute;bottom:3px;left:calc(50% - 7px);border-left:7px solid transparent;border-right:7px solid transparent;border-bottom:10px solid var(--color)}.balloon.pop{animation:pop .22s ease-out forwards}.balloon.wiggle:before{animation:wiggle .3s}.balloon.hint:before{outline:4px dashed #244956;outline-offset:5px}@keyframes pop{to{opacity:0;scale:1.25}}@keyframes wiggle{25%{rotate:-9deg}75%{rotate:9deg}}.progress{display:flex;gap:7px;justify-content:center;margin:12px}.progress i{width:13px;height:13px;border-radius:50%;background:#ccdedf}.progress i.done{background:#63a98a}.finish{position:absolute;inset:0;z-index:3;background:#fffaf0ed;display:grid;align-content:center;justify-items:center;text-align:center;padding:25px}.finish h2{font-size:2.2rem;margin:0 0 20px}.finish button{background:#e58a31;color:white;font-size:1.2rem}.finish[hidden],[hidden]{display:none!important}.audio-note{text-align:center;font-size:.85rem;color:#617d84}details{margin:18px 0;line-height:1.6}summary{cursor:pointer;font-weight:650}select{font:inherit;padding:8px;max-width:100%}.parent-options{display:flex;gap:8px;align-items:center;flex-wrap:wrap}.stars{font-size:3rem;color:#e6ad35}@media(max-width:400px){main{padding:10px}.controls{gap:6px}.controls button{padding:9px 11px}}@media(prefers-reduced-motion:reduce){.balloon{will-change:auto}.balloon.pop{animation-duration:.01s}}
