@import url('https://fonts.googleapis.com/css2?family=Baloo+2:wght@500;600;700;800&family=Nunito:wght@600;700;800;900&display=swap');
:root{font-family:'Nunito',sans-serif;color:#164d39;background:#cdeecb;font-synthesis:none}*{box-sizing:border-box}body{margin:0;overflow:hidden}button{font:inherit;border:0;cursor:pointer;-webkit-tap-highlight-color:transparent;touch-action:manipulation}button:focus-visible{outline:5px solid #ffbf38;outline-offset:6px}button:disabled{cursor:default}#game{position:relative;width:100%;height:100svh;min-height:420px;overflow:hidden;isolation:isolate;background:radial-gradient(ellipse at 50% 35%,#eef5c8 0,#b9e7c5 47%,#70b89d 100%)}.backdrop{position:absolute;inset:0;z-index:-4;background:url('assets/jungle.png') center/cover;transition:filter 1.2s;filter:saturate(.83)}.sunlight{position:absolute;inset:0;background:linear-gradient(120deg,#fffbc529,transparent 50%);opacity:.4;z-index:-3;transition:opacity 1s}header{height:112px;display:flex;align-items:center;justify-content:space-between;padding:20px 4%;gap:24px;position:relative;z-index:3}.brand{display:flex;gap:10px;align-items:center;font-weight:900;font-size:19px;letter-spacing:1px;text-shadow:0 1px #ffffff77}.brand-leaf{font-size:38px;color:#427743}.brand small{display:block;font-size:9px;letter-spacing:2.5px;margin-top:2px}.progress{display:flex;gap:8px;padding:12px 22px;border-radius:40px;background:#fffdf2b8;box-shadow:0 3px 0 #38634812;backdrop-filter:blur(8px)}.star{font-size:30px;color:#bdd2bc;-webkit-text-stroke:1px #a0bea2;line-height:1}.star.earned{color:#ffcc43;-webkit-text-stroke:1px #e6a52e;animation:star-pop .55s both}.icon-button,.replay{display:grid;place-items:center;background:#fffdf1;box-shadow:0 4px 0 #1f573c24;color:#235e43;border-radius:50%;width:52px;height:52px;flex-shrink:0}.icon-button svg,.replay svg{width:26px;height:26px}.play-area{position:relative;width:min(1230px,82%);margin:2vh auto 0;text-align:center;z-index:2}.eyebrow{font-size:12px;font-weight:900;letter-spacing:3px;color:#457c52;margin-bottom:7px}.prompt-row{display:flex;justify-content:center;align-items:center;gap:16px;min-height:83px}h1{font-family:'Baloo 2',sans-serif;font-size:clamp(32px,3.8vw,62px);line-height:1.08;margin:0;font-weight:800;color:#164d39;text-shadow:0 2px 0 #f8ffda}.replay{background:#dff39e;width:54px;height:54px;box-shadow:0 4px 0 #abc876;transition:transform .2s}.replay:hover{transform:rotate(-8deg) scale(1.07)}.choices{display:grid;grid-template-columns:repeat(4,1fr);gap:22px;margin:35px auto 22px;align-items:center}.choice{position:relative;aspect-ratio:.93;max-height:300px;background:#fffdf1;border:5px solid #fffef9;border-radius:42px;box-shadow:0 10px 0 #164d3922,0 17px 30px #194d3820;color:#205941;transition:transform .18s,box-shadow .18s;display:flex;flex-direction:column;align-items:center;justify-content:center;padding:14px;overflow:visible;animation:arrive .4s both}.choice:nth-child(2){background:#fff1d1;animation-delay:.045s}.choice:nth-child(3){background:#e7f4f8;animation-delay:.09s}.choice:nth-child(4){background:#f7e8dc;animation-delay:.135s}.choice:hover:not(:disabled){transform:translateY(-9px);box-shadow:0 14px 0 #164d3922,0 22px 30px #194d3830}.choice:active:not(:disabled){transform:translateY(5px) scale(.97)}.art{display:block;width:100%;max-width:225px;aspect-ratio:1;animation:breathe 4s ease-in-out infinite;animation-delay:var(--delay,0s)}.art svg{width:100%;height:100%;overflow:visible}.choice.word{font-size:clamp(25px,2.8vw,48px);font-weight:900;letter-spacing:1px}.choice .number{font-family:'Baloo 2';font-size:clamp(64px,8vw,125px);font-weight:800;color:#29997d;text-shadow:3px 5px #caecd8}.choice.correct{background:#ecfdbd;border-color:#fff8ba;animation:reward 1s both}.choice.wiggle{animation:wiggle .65s}.choice.hint{box-shadow:0 0 0 7px #ffda63,0 0 45px #fff295;animation:hint .75s infinite alternate}.choice.reaction::after{content:'?';position:absolute;right:15%;top:5%;color:#42755c;font-size:40px;font-weight:900;animation:arrive .25s}.play-button{display:inline-flex;align-items:center;justify-content:center;gap:22px;min-width:265px;height:86px;padding:0 36px;background:#ffcd45;border:4px solid #fff1a7;border-radius:29px;box-shadow:0 8px 0 #c28b29,0 15px 26px #17452b26;color:#254e36;font-weight:900;font-size:36px;letter-spacing:1px;transition:transform .15s}.play-button:hover{transform:translateY(-4px) scale(1.025)}.play-button:active{transform:translateY(5px);box-shadow:0 3px 0 #c28b29}.play-button span{font-size:27px}#start-wrap p{font-size:14px;font-weight:800;margin-top:20px;color:#3d714a}#feedback{height:35px;font-size:22px;font-weight:900;margin:15px auto;color:#21563d}.mascot{position:absolute;left:2.5%;bottom:2%;width:clamp(105px,13vw,220px);z-index:4;pointer-events:none}.mascot img{width:100%;filter:drop-shadow(0 7px 5px #1b53351c);animation:mascot-bob 5s ease-in-out infinite}.speech{background:#fffdf0;padding:12px 18px;border-radius:22px 22px 22px 5px;font-weight:900;font-size:18px;width:max-content;max-width:220px;margin-left:25%;margin-bottom:5px;box-shadow:0 4px 0 #184d391a}.world-caption{position:absolute;bottom:4%;left:50%;transform:translateX(-50%);font-size:14px;font-weight:800;color:#285e42;background:#fffdeaab;padding:10px 20px;border-radius:25px;text-align:center;white-space:nowrap;z-index:2}#environment{position:absolute;inset:0;z-index:-1;pointer-events:none}.growth{position:absolute;bottom:0;width:180px;height:210px;transform-origin:bottom;animation:grow 1s cubic-bezier(.3,1.6,.4,1) both}.growth svg{width:100%;height:100%}.growth.butterfly{bottom:16%;animation:float 7s ease-in-out infinite;width:85px;height:85px}.growth.bird{bottom:20%;width:105px;animation:float 8s ease-in-out infinite}.rainbow{position:absolute;width:65%;height:62%;left:17.5%;top:12%;border-radius:50% 50% 0 0;opacity:.55;overflow:hidden;mask-image:linear-gradient(#000 50%,transparent 88%);border:15px solid #fa9094;box-shadow:inset 0 0 0 14px #ffc86f,inset 0 0 0 28px #fff18e,inset 0 0 0 42px #92dca4,inset 0 0 0 56px #8bcadf;animation:grow 2s both}.celebration{position:absolute;inset:110px 0 0;z-index:6;display:flex;align-items:center;justify-content:center;flex-direction:column;background:radial-gradient(ellipse,#edffdfe8, #e4f8b977 55%,transparent 75%);text-align:center}.celebration[hidden]{display:none}.celebration h2{font-family:'Baloo 2';font-size:clamp(60px,8vw,130px);line-height:1;margin:0;color:#236447;text-shadow:0 6px #fff4b7;animation:star-pop 1s both}.celebration p{font-size:23px;font-weight:900;margin:20px}.celebration-stars{font-size:64px;letter-spacing:12px;color:#ffc53e;text-shadow:0 4px #d59c24}.celebration .play-button{margin-top:20px}.celebration .play-button[hidden]{display:none}#particles{position:absolute;inset:0;pointer-events:none;z-index:8;overflow:hidden}.particle{position:absolute;font-size:26px;color:var(--c);animation:burst 1.15s ease-out forwards;left:var(--x);top:var(--y)}[data-mode=playing] #start-wrap,[data-mode=complete] .play-area{display:none}[data-mode=attract] .choices{opacity:1}[data-mode=playing] .choices{margin-top:5vh}.attract-label{display:none}.leaf-sway{transform-origin:bottom;animation:sway 5s ease-in-out infinite}.ears{transform-origin:center;animation:sway 4s ease-in-out infinite}.blink{animation:blink 6s infinite;transform-origin:center}.tail{transform-origin:75% 65%;animation:sway 3s ease-in-out infinite}@keyframes breathe{0%,100%{transform:translateY(0) rotate(-1deg)}50%{transform:translateY(-5px) rotate(1deg)}}@keyframes mascot-bob{50%{transform:translateY(-6px)}}@keyframes sway{50%{transform:rotate(5deg)}}@keyframes blink{0%,43%,47%,100%{opacity:1}45%{opacity:.1}}@keyframes arrive{from{opacity:0;transform:translateY(24px) scale(.93)}to{opacity:1;transform:none}}@keyframes star-pop{0%{transform:scale(.4)}65%{transform:scale(1.2)}100%{transform:scale(1)}}@keyframes reward{0%{transform:scale(1)}15%{transform:scale(1.1,.83)}42%{transform:translateY(-28px) scale(.95,1.15) rotate(-4deg)}65%{transform:translateY(-14px) scale(1.13) rotate(3deg)}100%{transform:scale(1.04)}}@keyframes wiggle{20%,60%{transform:rotate(-5deg)}40%,80%{transform:rotate(5deg)}}@keyframes hint{to{transform:translateY(-9px) scale(1.025)}}@keyframes grow{from{transform:scale(.1);opacity:0}to{transform:scale(1);opacity:1}}@keyframes float{0%,100%{transform:translate(0,0) rotate(-6deg)}50%{transform:translate(45px,-30px) rotate(6deg)}}@keyframes burst{to{transform:translate(var(--dx),var(--dy)) rotate(210deg) scale(.1);opacity:0}}@media(min-width:1600px){.play-area{margin-top:4vh}.choices{gap:30px;margin-top:45px}.choice{max-height:350px}.art{max-width:270px}.play-button{height:94px}.world-caption{bottom:5%}}@media(max-height:750px){header{height:82px}.play-area{margin-top:0}.prompt-row{min-height:66px}.choices{margin-top:18px;gap:16px}.choice{max-height:235px;border-radius:32px}.art{max-width:180px}.play-button{height:66px;font-size:30px}#start-wrap p{margin-top:13px}.mascot{width:115px}.world-caption{bottom:2%}.celebration{inset:80px 0 0}}@media(max-width:800px){header{height:90px;padding:15px 4%;gap:10px}.brand{font-size:12px;letter-spacing:.2px}.brand small{font-size:7px;letter-spacing:1px}.brand-leaf{display:none}.progress{gap:3px;padding:10px 12px}.star{font-size:22px}.icon-button{width:42px;height:42px}.play-area{width:87%;margin-top:2vh}.choices{grid-template-columns:repeat(2,1fr);width:min(470px,100%);gap:15px;margin-top:20px}.choice{aspect-ratio:1.25;max-height:180px;border-radius:28px}.art{width:80%;max-width:145px}.prompt-row{gap:9px}h1{font-size:32px}.replay{width:43px;height:43px}.eyebrow{font-size:10px;letter-spacing:2px}.mascot{width:95px;left:1%;bottom:1%}.speech{font-size:13px;padding:8px 12px;margin-left:10%}.world-caption{font-size:10px;bottom:2%;left:63%;max-width:65%;white-space:normal}.play-button{min-width:220px;height:66px;font-size:29px}#start-wrap p{font-size:12px}.choice.word{font-size:29px}[data-mode=playing] .choices{margin-top:25px}.growth{width:110px;height:150px}.celebration h2{font-size:65px}.celebration p{font-size:18px}.celebration-stars{font-size:44px}}@media(max-height:560px) and (min-width:801px){header{height:60px}.choices{margin:12px auto}.choice{max-height:170px}.art{max-width:145px}.prompt-row{min-height:48px}h1{font-size:35px}.eyebrow{font-size:10px}.play-button{height:53px;font-size:25px;min-width:210px}#start-wrap p{display:none}.mascot{width:80px}.speech{font-size:12px}.world-caption{font-size:10px}[data-mode=playing] .choices{margin-top:14px}}@media(prefers-reduced-motion:reduce){*,*::before,*::after{animation-duration:.01ms!important;animation-iteration-count:1!important;transition-duration:.01ms!important}}

.brand{padding:9px 15px;background:#fffdeac9;border-radius:20px;backdrop-filter:blur(6px)}

@media(max-width:600px){header{display:grid;grid-template-columns:1fr auto;height:117px;gap:6px;padding:9px 5%}.brand{justify-self:start;padding:7px 12px}.brand small{letter-spacing:1.2px}.progress{grid-column:1/-1;grid-row:2;justify-self:center;padding:6px 15px;gap:4px}.star{font-size:20px}.icon-button{grid-column:2;grid-row:1;width:39px;height:39px}.play-area{margin-top:1vh}.choices{margin-top:16px}.prompt-row{min-height:70px}.choice{max-height:180px}h1{font-size:29px}.speech{max-width:170px}}