@font-face{font-family:Inter;src:url(assets/Inter-400.woff2);font-display:swap}*{box-sizing:border-box}body{margin:0;background:radial-gradient(#ccc 0.7px,transparent .8px) 0 0/20px 20px #f5f5f5;color:#1e1e1e;font-family:Inter,system-ui;line-height:1.5}header{max-width:1120px;margin:auto;padding:24px;display:flex;align-items:center;justify-content:space-between;gap:12px}header span{font-size:14px}.brand{display:flex;gap:10px;align-items:center;color:inherit;text-decoration:none;font-size:21px;font-weight:800}main{max-width:1040px;margin:0 auto;padding:0 24px}section{background:#fbfbfb;border:1px solid #80caff;border-radius:0 24px 24px 24px;padding:32px 40px;position:relative}h1{font-size:clamp(48px,7vw,80px);line-height:1.05;letter-spacing:-.05em;margin:12px 0 24px}h1 span{background:#ffc488;padding:0 8px}h2{font-size:32px;line-height:1.2}.lead{font-size:23px;margin:12px 0}.eyebrow{font-size:12px;color:#005a9e;letter-spacing:.09em;font-weight:bold}.intro{display:grid;grid-template-columns:1.3fr 1fr;align-items:center;padding-bottom:28px}.hero-art{position:relative;height:265px}.demo-balloon,.small-balloon{position:absolute;border:2px solid #005a9e;background:#dbf0ff;border-radius:50% 50% 47% 47%;width:180px;height:220px;left:30px;top:0;transform:rotate(-9deg)}.demo-balloon img{width:155px;margin:22px 10px}.small-balloon{left:175px;top:90px;width:115px;height:140px;background:#ffcd29;transform:rotate(10deg);text-align:center;padding-top:40px;font-size:32px;font-weight:bold}.demo-balloon:after,.small-balloon:after{content:'';position:absolute;width:1px;height:35px;background:#005a9e;left:50%;top:100%}fieldset{border:0;padding:0;margin:24px 0}legend{font-size:18px;font-weight:bold;margin-bottom:12px}.pack-grid,.modes{display:grid;grid-template-columns:repeat(3,1fr);gap:12px}button,select{font:inherit;cursor:pointer;min-height:48px;border:1px solid #80caff;border-radius:10px;padding:10px 18px;background:#fbfbfb;color:#0b3a66}button:hover{background:#dbf0ff}button:disabled{cursor:default;opacity:.65}.pack{display:grid;grid-template-columns:60px 1fr;text-align:left;align-items:center;padding:12px;gap:10px}.pack img{width:60px}.pack strong,.pack small{display:block}.pack small{font-size:12px;margin-top:3px}.pack[aria-pressed=true]{background:#dbf0ff;border:2px solid #005a9e}.modes label{padding:16px;border:1px solid #80caff;border-radius:12px;cursor:pointer}.modes input{accent-color:#005a9e}.modes strong{font-size:14px}.modes small{display:block;margin-top:8px;font-size:12px}.modes label:has(:checked){background:#dbf0ff;border-color:#005a9e}.bottom-settings{display:flex;justify-content:space-between;gap:12px;align-items:center;flex-wrap:wrap}.bottom-settings select{margin-left:8px}.primary{background:#ffcd29;border-color:#cfaa1e;color:#1e1e1e;font-weight:bold}.primary:hover{background:#ffc488}.secondary{background:#f5fbff}.fine{font-size:13px;color:#454545}details{margin:16px 0}summary{cursor:pointer;padding:10px 0;color:#005a9e}#word-picker,#learn-grid,#result-words{display:grid;grid-template-columns:repeat(3,1fr);gap:12px}.word-option{display:flex;align-items:center;gap:10px;background:#f5fbff;padding:10px;border-radius:10px}.word-option img{width:45px}.word-option input{width:20px;height:20px;accent-color:#005a9e}.learn-card{display:flex;flex-direction:column;align-items:center;font-size:22px;background:#f5fbff}.learn-card img{width:125px;height:125px}.game-bar{display:flex;gap:12px;align-items:center;flex-wrap:wrap;font-size:14px}.game-bar #pack-title{font-weight:bold;margin-right:auto}#prompt{text-align:center;min-height:205px;padding:16px}#instruction{font-size:22px;font-weight:bold;margin:0 0 10px}#target-image{width:140px;height:140px;display:block;margin:auto}#target-image[hidden]{display:none}.audio-button{background:#dbf0ff;border:2px solid #005a9e;font-weight:bold;font-size:20px}.text-button{border:0;background:transparent;display:block;margin:6px auto;font-size:14px;text-decoration:underline}#hint-content{font-size:24px;font-weight:bold}#hint-content img{width:85px;display:block;margin:auto}#stage{display:flex;align-items:center;justify-content:center;gap:24px;min-height:250px;background:#f5fbff;border:1px solid #bde3ff;border-radius:18px;padding:28px 15px 40px}.balloon{width:180px;height:200px;border:2px solid #005a9e;border-radius:50% 50% 46% 46%;position:relative;font-size:28px;font-weight:bold;flex-shrink:1;padding:10px;background:var(--fill)}.balloon:after{content:'';position:absolute;top:100%;height:25px;border-left:2px solid #80caff;left:50%}.balloon img{width:100%;height:140px;object-fit:contain}.float .balloon{animation:bob 3.4s ease-in-out infinite alternate}.float .balloon:nth-child(2){animation-delay:-1.1s}.float .balloon:nth-child(3){animation-delay:-2.2s}@keyframes bob{from{transform:translateY(-10px) rotate(-3deg)}to{transform:translateY(10px) rotate(3deg)}}.balloon.correct{background:#dbf0ff;outline:4px solid #005a9e}.balloon.wrong{border-style:dashed;background:#fff8e8}#feedback{min-height:30px;text-align:center;font-size:18px}#next{display:block;margin:auto}#next[hidden]{display:none}#pause-panel{position:absolute;inset:70px 0 0;background:#fbfbfbf5;z-index:2;text-align:center;padding-top:100px;border-radius:24px}.paused .balloon{animation-play-state:paused}.result-word{padding:14px;background:#f5fbff;border-radius:10px}.result-word img{width:70px;display:block}.result-word small{display:block}.teacher{max-width:800px;margin:24px auto;font-size:14px}footer{text-align:center;font-size:13px;padding:24px;color:#454545}:focus-visible{outline:3px solid #005a9e;outline-offset:4px}[hidden]{display:none!important}@media(max-width:650px){header{padding:16px}header span{font-size:11px}main{padding:0 12px}section{padding:22px 16px}.intro{grid-template-columns:1fr;padding-bottom:0}.hero-art{display:none}h1{font-size:52px}.pack-grid{gap:8px}.pack{display:block;padding:10px 6px}.pack img{width:48px}.pack small{font-size:11px}.pack strong{font-size:13px}.modes{grid-template-columns:1fr;gap:8px}.modes label{padding:12px}.modes small{display:inline;margin-left:8px}.bottom-settings{display:block}.bottom-settings button{margin-top:12px}#stage{gap:8px;min-height:190px;padding:20px 8px 30px}.balloon{width:30%;height:130px;font-size:21px;padding:4px}.balloon img{height:90px}.game-bar{gap:8px}.game-bar button{padding:8px;font-size:12px}#prompt{min-height:205px}#learn-grid{grid-template-columns:repeat(2,1fr)}#word-picker{grid-template-columns:repeat(2,1fr)}#result-words{grid-template-columns:repeat(2,1fr)}.lead{font-size:19px}}@media(prefers-reduced-motion:reduce){.float .balloon{animation:none}}
.balloon.correct{animation:pop .35s ease-out both;background:transparent;border-color:transparent;outline:0}.balloon.correct img{opacity:.18}.balloon.correct:before{content:'✓';position:absolute;inset:25% 0;text-align:center;font-size:56px;color:#005a9e;text-shadow:0 2px #fbfbfb}.balloon.correct:after{border:0;width:100%;height:100%;left:0;top:0;background:repeating-conic-gradient(from 0deg,transparent 0deg 28deg,#ffa41f 28deg 31deg,transparent 31deg 36deg);mask:radial-gradient(transparent 57%,#000 58% 62%,transparent 63%);animation:spark .4s ease-out forwards;pointer-events:none}@keyframes pop{0%{transform:scale(1)}45%{transform:scale(1.15)}100%{transform:scale(.93)}}@keyframes spark{from{transform:scale(.5);opacity:1}to{transform:scale(1.5);opacity:0}}@media(prefers-reduced-motion:reduce){.balloon.correct,.balloon.correct:after{animation:none}.balloon.correct:after{display:none}}