@import url('https://fonts.googleapis.com/css2?family=Fredoka:wght@400;500;600;700&family=Nunito:wght@400;600;700;800;900&display=swap');
.narration{min-height:44px;text-decoration:underline;text-underline-offset:4px}#game>.narration{margin:-14px 0 12px}
:root{--ink:#42375c;--muted:#827b91;--purple:#7960bd;--paper:#faf8f2;--a:#ee8e8f;--e:#f0bf57;--i:#7bbfa8;--o:#7aaee0;--u:#b293d4;font-family:'Nunito','Trebuchet MS',sans-serif;color:var(--ink);background:var(--paper)}*{box-sizing:border-box}body{margin:0;min-height:100svh;display:flex;flex-direction:column;background:radial-gradient(ellipse at 2% 45%,#eee8f770,transparent 35%),radial-gradient(ellipse at 100% 70%,#e8f2e780,transparent 35%)}button,a{-webkit-tap-highlight-color:transparent}button{font:inherit;cursor:pointer;border:0;color:inherit}button:focus-visible,a:focus-visible{outline:4px solid #62459d;outline-offset:6px}button:disabled{cursor:default}button:hover:not(:disabled){filter:brightness(1.025);transform:translateY(-3px)}button:active:not(:disabled){transform:translateY(2px)}button{transition:transform .18s,filter .18s}a{color:inherit;text-decoration:none}[hidden]{display:none!important}.icon-button{width:43px;height:43px;border:1px solid #e4dfeb;border-radius:50%;background:#fff9;font-size:23px;color:#88759c}main{max-width:1000px;margin:auto;padding:22px 24px 38px;width:100%;flex:1}.screen{text-align:center;animation:appear .4s ease}.eyebrow{font-size:10px;font-weight:900;letter-spacing:2.3px;color:#9282a7;display:flex;gap:8px;justify-content:center;align-items:center}.eyebrow>span{height:7px;width:7px;border-radius:50%;background:#b1a0cb}h1,h2{font-family:Fredoka,'Trebuchet MS',sans-serif;font-weight:500}h1{font-size:clamp(42px,5.3vw,68px);line-height:1.06;letter-spacing:-1.5px;margin:22px 0 17px}h1>span{color:var(--purple);position:relative}.title-star{position:absolute;font-size:29px;color:#e6ba5e;right:-43px;top:7px}.intro{color:var(--muted);line-height:1.75;font-size:15px;font-weight:600;margin:0}.letter-garden{height:210px;max-width:620px;margin:13px auto 7px;display:flex;gap:14px;justify-content:center;align-items:center;position:relative}.letter{font-family:Fredoka,sans-serif;font-size:86px;font-weight:600;width:95px;height:114px;display:grid;place-content:center;border-radius:25px;position:relative;box-shadow:0 8px 0 #0000000a,inset 0 2px 0 #ffffff70;animation:float 4s ease-in-out infinite}.a{background:#f6b6b3;color:#a64750;--tile:#f6b6b3}.e{background:#f8d987;color:#9c6c24;--tile:#f8d987}.i{background:#add9c6;color:#3d826b;--tile:#add9c6}.o{background:#b3d4ef;color:#3e75a3;--tile:#b3d4ef}.u{background:#d0b9e6;color:#80599d;--tile:#d0b9e6}.letter:nth-of-type(1){transform:rotate(-12deg);margin-top:20px}.letter:nth-of-type(2){transform:rotate(7deg);margin-top:-18px;animation-delay:-1s}.letter:nth-of-type(3){transform:rotate(-6deg);margin-top:14px;animation-delay:-2s}.letter:nth-of-type(4){transform:rotate(9deg);margin-top:-15px;animation-delay:-.5s}.letter:nth-of-type(5){transform:rotate(-9deg);margin-top:23px;animation-delay:-1.5s}.letter i{position:absolute;width:17px;height:6px;bottom:9px;left:40px;border-bottom:2px solid currentColor;border-radius:50%;opacity:.6}.spark{position:absolute;color:#d7b45a;font-size:28px}.s1{left:5px;top:18px}.s2{right:17px;top:4px;color:#b5a2ce;font-size:38px}.garden-flower{position:absolute;bottom:2px;left:53px;color:#b8cbb2;font-size:36px}.garden-star{position:absolute;bottom:12px;right:37px;color:#e8c76f;font-size:24px;transform:rotate(15deg)}.primary{background:var(--purple);color:white;min-height:62px;padding:16px 38px;border-radius:20px;font-size:18px;font-weight:900;letter-spacing:1.5px;box-shadow:0 5px 0 #5f4799;display:inline-flex;align-items:center;justify-content:center;gap:33px}.menu>.primary{min-width:230px;animation:gentle-pulse 3s infinite}.primary span{font-size:26px;font-weight:400}.menu-details{display:flex;justify-content:center;gap:26px;font-size:11px;color:#948b9e;font-weight:700;margin:24px 0 30px}.educator{background:#fff9;border:1px solid #eae5e1;border-radius:18px;display:flex;align-items:center;text-align:left;max-width:535px;margin:auto;padding:16px 22px;gap:17px}.book{color:#9c88b6;font-size:32px}.educator p{font-size:11px;line-height:1.7;margin:0;color:#9a919f}.educator strong{font-size:12px;color:#756981}.age{margin-left:auto;flex-shrink:0;border-left:1px solid #eae5e1;padding-left:19px;color:#a08ab6;font:500 22px Fredoka,sans-serif;text-align:center}.age small{font:800 8px Nunito,sans-serif;letter-spacing:1px}footer{width:calc(100% - 40px);align-items:center;gap:16px;max-width:1172px;margin:0 auto;padding:21px 0;border-top:1px solid #e8e4df;display:flex;justify-content:space-between;color:#a59caa;font-size:10px;letter-spacing:.5px}.footer-dots{color:#bfa9d2;letter-spacing:7px}.game-toolbar{display:flex;align-items:center;justify-content:space-between;font-weight:800;font-size:14px}.quiet{background:transparent;font-size:14px;color:#857493;padding:12px}.score{background:#fff1ca;border-radius:20px;padding:9px 19px;color:#98701c}.progress{height:8px;background:#eae4f1;border-radius:10px;margin:13px 0 27px;overflow:hidden}.progress>div{background:#b49ad3;height:100%;transition:width .4s;width:0}#game{max-width:760px;margin:auto}h2{font-size:30px;margin:0 0 7px}.helper{color:var(--muted);font-size:14px;margin:0 0 20px}.picture-card{width:310px;height:245px;border:1px solid #eee7db;border-radius:30px;background:#fffdf8;position:relative;margin:auto;box-shadow:0 10px 30px #59436a06;display:flex;align-items:center;justify-content:center}.picture-card img{width:240px;height:200px;object-fit:contain;margin-bottom:23px}.card-spark{position:absolute;right:23px;top:17px;color:#e1c47d;font-size:24px}.listen{position:absolute;bottom:9px;background:#f0eaf7;border-radius:12px;padding:7px 13px;color:#8a70aa;font-size:12px;font-weight:800}.word{display:flex;justify-content:center;gap:7px;margin-top:19px;flex-wrap:wrap}.word span{font:500 clamp(26px,5vw,42px) Fredoka,sans-serif;min-width:29px}.word .missing{border-bottom:4px solid #b19bc9;color:var(--purple);min-width:37px}.feedback{font-size:14px;min-height:22px;color:#8e8099;margin:14px 0 18px;font-weight:800}.feedback.correct{color:#4f9178}.feedback.retry{color:#aa713e}.vowels{display:flex;gap:15px;justify-content:center}.vowel{width:86px;height:83px;border-radius:20px;box-shadow:0 5px 0 color-mix(in srgb,var(--tile),#444 14%);font:600 48px Fredoka,sans-serif}.vowel:disabled{opacity:.45}.vowel.chosen{opacity:1;outline:3px solid #699d7c;outline-offset:5px}.vowel.wiggle{animation:wiggle .35s}.next{min-height:49px;padding:8px 25px;font-size:13px;margin-top:25px;gap:22px}.finish{padding-top:30px}.finish-stars{font-size:74px;letter-spacing:12px;color:#ebbf50;margin:34px 0 25px}.finish-stars .empty{color:#e4dfea}.finish-stars span{display:inline-block}.finish-stars span:nth-child(2){transform:translateY(-17px);font-size:90px}.result{background:#fffaf0;border:1px solid #ede3cd;border-radius:25px;width:290px;margin:28px auto 15px;padding:20px;display:flex;flex-direction:column;gap:4px}.result strong{font:500 45px Fredoka,sans-serif;color:#9374b5}.result>span{font-size:12px;color:#9b8e9e}.finish>p:last-of-type{color:#8a7a98;font-size:14px;margin-bottom:25px}.finish>.quiet{display:block;margin:19px auto}#confetti{pointer-events:none;position:fixed;inset:0;overflow:hidden;z-index:20}.confetti-bit{position:absolute;top:-30px;font-size:25px;animation:fall 1.8s ease-in forwards}@keyframes float{50%{translate:0 -8px}}@keyframes gentle-pulse{50%{box-shadow:0 5px 0 #5f4799,0 0 0 8px #7960bd0a}}@keyframes appear{from{opacity:0;translate:0 8px}to{opacity:1;translate:0 0}}@keyframes wiggle{25%,75%{translate:-5px 0}50%{translate:5px 0}}@keyframes fall{to{translate:40px 105vh;rotate:280deg;opacity:0}}@media(min-width:1400px){main{padding-top:48px}.letter-garden{height:240px}.menu-details{margin-bottom:38px}}@media(max-width:640px){main{padding:20px 18px 30px}h1{font-size:44px}.eyebrow{font-size:8px;letter-spacing:1.3px}.intro{font-size:13px}.letter-garden{gap:8px;height:185px}.letter{width:57px;height:83px;border-radius:17px;font-size:59px}.letter i{left:24px;width:12px}.s1{left:0}.s2{right:0}.menu-details{font-size:9px;gap:13px}.educator{padding:14px;gap:10px}.educator p{font-size:10px}.educator strong{font-size:11px}.book{display:none}.age{padding-left:10px}footer{margin:0 20px;font-size:8px;gap:12px}.footer-dots{display:none}h2{font-size:25px}.helper{font-size:12px}.vowels{gap:10px}.vowel{height:65px;width:57px;font-size:38px;border-radius:16px}.picture-card{height:225px;width:280px}.picture-card img{height:180px}.word{gap:4px}.word span{min-width:22px}.title-star{right:-28px;font-size:22px}.finish-stars{font-size:56px;letter-spacing:4px}.finish-stars span:nth-child(2){font-size:70px}.finish .primary{font-size:13px;padding:15px 23px;gap:20px}}@media(prefers-reduced-motion:reduce){*,*::before,*::after{animation:none!important;transition:none!important;scroll-behavior:auto!important}}