@import url('https://fonts.googleapis.com/css2?family=Nunito:wght@400;600;700;800;900&display=swap');
:root{font-family:Nunito,'Trebuchet MS',system-ui,sans-serif;color:#382350;font-synthesis:none}*{box-sizing:border-box}body{margin:0;background:#d3f5e7}button{font:inherit;cursor:pointer;touch-action:manipulation}button:focus-visible{outline:4px solid #ffcd55;outline-offset:3px}.screen{min-height:100dvh;position:relative;overflow:hidden}.hidden{display:none!important}.home{isolation:isolate;background:linear-gradient(155deg,#b6ecff,#8edfc1 55%,#f6dca5)}.scenery{position:absolute;inset:0;z-index:-2;background:url('../assets/concept.png') center/cover no-repeat;filter:blur(5px) saturate(1.05);transform:scale(1.035)}.home:before{content:'';position:absolute;inset:0;z-index:-1;background:linear-gradient(180deg,rgba(17,65,69,.35),rgba(229,255,241,.7) 32%,rgba(246,255,239,.79) 76%,rgba(37,89,65,.25))}.topbar{display:flex;align-items:center;justify-content:space-between;padding:18px clamp(16px,4vw,50px)}.profile{display:flex;gap:10px;align-items:center;background:#fffef4;border:3px solid white;border-radius:30px;padding:9px 16px;box-shadow:0 6px 0 #ffffff77;font-weight:900}.profile small{color:#8353c7;font-size:.8rem}.controls{display:flex;gap:8px}.round{background:#fff;border:3px solid #fff;border-radius:50%;width:48px;height:48px;box-shadow:0 4px 0 #386fa3;color:#34558e;font-size:1.4rem}.home-content{max-width:1050px;margin:auto;text-align:center;padding:0 18px 30px}.brand{margin:0 auto 18px}.eyebrow{font-weight:900;color:#fff;text-shadow:0 2px 5px #634775;letter-spacing:.03em}.brand h1{font-size:clamp(2.7rem,7vw,5.7rem);line-height:1.05;margin:6px 0;color:#fff;text-shadow:0 5px 0 #8553ad,0 9px 18px #492b59;-webkit-text-stroke:1px #8252ad}.brand h1 span{color:#ffcf42}.brand p{margin:8px 0;color:#4b3460;font-size:clamp(.95rem,2vw,1.25rem);font-weight:900}.activities{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:14px;max-width:850px;margin:20px auto}.activity{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:3px;min-height:138px;border:4px solid #fff;border-radius:30px;background:linear-gradient(145deg,#fff2b4,#ffd568);box-shadow:0 8px 0 #d4a94d,0 12px 20px #22452a30;color:#50335c;padding:12px;transition:transform .15s}.activity:nth-child(2){background:linear-gradient(145deg,#efd5ff,#c49aff);box-shadow:0 8px 0 #9973cc}.activity:nth-child(3){background:linear-gradient(145deg,#d5f7ff,#8bddff);box-shadow:0 8px 0 #65b3d3}.activity:nth-child(4){background:linear-gradient(145deg,#d7ffc5,#9ce77d);box-shadow:0 8px 0 #74b85a}.activity:nth-child(5){background:linear-gradient(145deg,#ffe2f5,#ffadd8);box-shadow:0 8px 0 #d47bab}.activity:hover{transform:translateY(-3px)}.activity-emoji{font-size:2.4rem}.activity strong{font-size:1.1rem;line-height:1.1}.activity small{font-weight:800;opacity:.72}.activity.locked{opacity:.86}.primary{border:4px solid #fff;border-radius:100px;background:linear-gradient(#c877ff,#872cde);box-shadow:0 8px 0 #6320a5,0 12px 22px #57317865;color:white;font-weight:900;font-size:clamp(1.3rem,3vw,1.9rem);padding:12px 48px;text-shadow:0 2px #6e3a9b}.primary:active{transform:translateY(5px);box-shadow:0 3px 0 #6320a5}.home-footer{text-align:center;color:#fff;font-weight:900;text-shadow:0 2px 5px #356443;padding:0 10px 16px}.game{background:radial-gradient(circle at 50% 0,#d4faff,#b1e9d0 60%,#9cdbab);padding:18px}.game-header{max-width:1050px;margin:0 auto 20px;display:flex;align-items:center;justify-content:space-between;gap:10px}.pill{border:3px solid white;border-radius:30px;padding:9px 16px;font-weight:900}.secondary{background:#fff;color:#65508b;box-shadow:0 4px 0 #b5d5ce}.progress-label{text-align:center;font-weight:900}.progress-label span{display:block;color:#7653a1;font-size:.85rem}.game-panel{max-width:790px;margin:0 auto;background:#fffcf4;border:5px solid white;border-radius:38px;padding:clamp(18px,4vw,35px);box-shadow:0 14px 0 #86cbb2,0 25px 55px #397f7040;text-align:center}.game-intro{display:flex;justify-content:center;align-items:center;gap:15px}.mascot{font-size:clamp(3rem,8vw,5rem)}.dark{color:#b27cbe;text-shadow:none;font-size:.8rem}.game h2{margin:4px 0;font-size:clamp(1.4rem,4vw,2.2rem)}.game-intro p{margin:0;font-weight:800;color:#8b7294}.object-field{min-height:180px;margin:22px auto 15px;background:linear-gradient(#e8faff,#e5f6dc);border:3px dashed #b6e4cd;border-radius:28px;display:flex;justify-content:center;align-items:center;flex-wrap:wrap;gap:clamp(8px,3vw,22px);padding:20px}.object{font-size:clamp(3.1rem,8vw,5.3rem);filter:drop-shadow(0 7px 3px #88c0a355);animation:pop .35s both}.answers{display:grid;grid-template-columns:repeat(3,1fr);gap:15px;max-width:510px;margin:auto}.answer{min-height:90px;border:4px solid white;border-radius:26px;background:linear-gradient(#b9e7ff,#8ecbfa);box-shadow:0 7px 0 #64a9d8;font-size:2.5rem;font-weight:900;color:#4d488b}.answer:nth-child(2){background:linear-gradient(#ffe5a5,#ffcb6e);box-shadow:0 7px 0 #dba64c}.answer:nth-child(3){background:linear-gradient(#f7c4ec,#eda3d8);box-shadow:0 7px 0 #ca7cae}.answer.correct{background:#a7eec0;box-shadow:0 7px 0 #67b98b}.answer.wrong{background:#ffe4bf;animation:shake .25s}.answer:disabled{cursor:default}.feedback{min-height:36px;margin:24px 0 5px;font-weight:900;color:#6a5187}.next{margin:12px auto 0;font-size:1.2rem;padding:10px 30px}.game-bottom{text-align:center;margin:25px;font-weight:900;color:#548c7b}@keyframes pop{from{transform:scale(.5);opacity:0}to{transform:scale(1);opacity:1}}@keyframes shake{25%{transform:translateX(-5px)}75%{transform:translateX(5px)}}@media(min-width:750px){.activities .activity:nth-child(4){grid-column:1 / 2;margin-left:45%}.activities .activity:nth-child(5){grid-column:2 / 4;margin-right:45%}}@media(max-width:749px){.activities{grid-template-columns:repeat(2,minmax(0,1fr));gap:12px}.activity{min-height:124px;border-radius:23px}.activity:last-child{grid-column:1/-1;max-width:240px;width:100%;justify-self:center}.activity strong{font-size:.98rem}.activity-emoji{font-size:2rem}.brand h1{font-size:clamp(2.8rem,10vw,4.3rem)}.game-header{flex-wrap:wrap}.game-header .pill{padding:8px 10px}.game-intro{gap:8px}.object-field{min-height:150px}.answer{min-height:76px}}@media(max-width:370px){.topbar{padding:12px}.activities{gap:8px}.activity{min-height:110px;padding:7px}.activity strong{font-size:.88rem}.activity small{font-size:.7rem}.brand p{font-size:.9rem}.game{padding:10px}.game-panel{padding:12px}.progress-label{font-size:.8rem}}@media(prefers-reduced-motion:reduce){*,*:before,*:after{animation:none!important;transition:none!important}}
/* MVP 2 — novos jogos */
.shape-visual{display:inline-block;width:clamp(52px,9vw,78px);height:clamp(52px,9vw,78px);background:var(--shape-color);vertical-align:middle;filter:drop-shadow(0 5px 2px #0002)}.shape-visual.circle{border-radius:50%}.shape-visual.square{border-radius:12px}.shape-visual.triangle{clip-path:polygon(50% 0,100% 100%,0 100%)}.shape-sample{display:flex;gap:18px;align-items:center;justify-content:center;font-weight:900;flex-wrap:wrap;font-size:1.2rem}.answer .shape-visual{width:clamp(48px,8vw,70px);height:clamp(48px,8vw,70px)}.letter-example{display:flex;align-items:center;justify-content:center;gap:32px;font-size:clamp(4rem,12vw,7rem);font-weight:900;color:#9145c4}.missing{border:4px dashed #9fc9ce;border-radius:22px;padding:6px;background:#fff}.memory-instruction{font-size:3.5rem}.answers.memory-grid{max-width:550px;grid-template-columns:repeat(4,minmax(0,1fr));gap:12px}.memory-card{aspect-ratio:1;border:4px solid white;border-radius:20px;background:linear-gradient(145deg,#d3b3ff,#a87ce9);box-shadow:0 6px 0 #8862b7;font-size:clamp(2rem,7vw,4rem);min-width:0}.memory-card.flipped{background:#fff0c9}.memory-card.matched{background:#b7f4c7;box-shadow:0 6px 0 #70c993}.memory-card:focus-visible{outline:4px solid #f5b600}@media(max-width:540px){.answers.memory-grid{gap:8px}.memory-card{border-radius:14px;border-width:3px}.shape-sample{font-size:1rem}.object-field{padding:12px;gap:8px}.object{font-size:clamp(2.7rem,9vw,4.5rem)}}

/* MVP 3 — acabamento responsivo e acessibilidade */
html{scroll-behavior:smooth}body{min-width:280px}button{-webkit-tap-highlight-color:transparent;user-select:none}button:active{transform:translateY(3px)}.home{display:flex;flex-direction:column}.home-content{width:100%;flex:1;display:flex;flex-direction:column;justify-content:center}.home-footer{padding-top:12px}.topbar{position:relative;z-index:2}.activity{position:relative;overflow:hidden;min-height:142px}.activity:before{content:'';position:absolute;inset:0 0 55% 0;background:linear-gradient(#fff8,transparent);pointer-events:none}.activity-emoji{filter:drop-shadow(0 3px 1px #0002)}.activity strong{max-width:16ch}.game{display:flex;flex-direction:column;min-height:100dvh;background:radial-gradient(ellipse at 50% 0,#e5faff 0%,#c3f3df 52%,#8cd7b6 100%)}.game-panel{width:100%;flex:0 1 auto}.game-header{width:100%}.game-bottom{margin-top:auto;padding-top:22px}.object-field{position:relative}.memory-instruction{font-size:clamp(1rem,3vw,1.4rem);font-weight:900;color:#755393}.memory-card{transition:background .18s,transform .18s;min-height:74px}.memory-card:not(.matched):active{transform:scale(.95)}.memory-card.matched{cursor:default}.answer{transition:transform .12s}.answer:not(:disabled):active{transform:scale(.95)}.game-intro{text-align:left}.mascot{flex-shrink:0}.pill{min-height:46px}.round{min-width:48px;min-height:48px}@media(min-width:1100px) and (min-height:780px){.home-content{padding-bottom:42px}.activities{gap:20px;margin:28px auto}.activity{min-height:154px}}@media(max-width:749px){.home-content{justify-content:flex-start}.brand{margin-top:8px}.activities{margin:12px auto 22px}.activity{min-height:126px}.game{padding:12px}.game-panel{border-radius:28px}.game-intro{align-items:center}.object-field{margin:14px auto}.feedback{margin-top:16px}.game-bottom{font-size:.85rem}}@media(max-width:540px){.topbar{padding:12px 14px}.profile{padding:7px 10px;font-size:.9rem}.round{width:44px;height:44px}.brand h1{font-size:clamp(2.3rem,11vw,3.6rem)}.eyebrow{font-size:.8rem}.brand p{font-size:.88rem}.activity{min-height:114px;padding:8px}.activity small{font-size:.72rem}.activity-emoji{font-size:1.9rem}.primary{padding:12px 32px}.game-header{margin-bottom:12px}.game-header .pill{font-size:.82rem}.progress-label{order:3;flex:1 0 100%;font-size:.9rem}.game-intro h2{font-size:1.3rem}.mascot{font-size:2.7rem}.object-field{min-height:128px}.answers{gap:9px}.answer{min-height:72px;font-size:2rem}.answers.memory-grid{grid-template-columns:repeat(4,minmax(0,1fr))}.memory-card{min-height:64px;font-size:clamp(1.7rem,8vw,3rem)}.letter-example{font-size:3.8rem}.game-bottom{padding-top:12px}}@media(max-width:370px){.profile small{font-size:.68rem}.activity{min-height:100px}.activity strong{font-size:.83rem}.game-panel{border-width:3px}.memory-card{min-height:58px}.answers.memory-grid{gap:5px}}@media(orientation:landscape) and (max-height:600px){.home-content{justify-content:flex-start}.brand{margin:0}.brand h1{font-size:2.4rem}.activities{margin:8px auto;gap:9px}.activity{min-height:85px;padding:5px}.activity-emoji{font-size:1.5rem}.activity small{display:none}.home-footer{padding:5px}.game-panel{padding:12px}.object-field{min-height:95px;margin:8px auto}.object{font-size:2.6rem}.answer{min-height:56px}.feedback{margin:10px 0}.game-bottom{display:none}}

/* MVP 4 — acabamento e áreas complementares */
.home-extras{display:flex;justify-content:center;gap:12px;flex-wrap:wrap;margin:22px auto 8px}.extra{background:#fffef6;color:#6c3f91;box-shadow:0 5px 0 #d7c2ea;min-height:50px}.overlay{position:fixed;inset:0;z-index:20;background:#251b47aa;display:grid;place-items:center;padding:16px;overflow-y:auto}.overlay-card{position:relative;width:min(560px,100%);max-height:min(88dvh,760px);overflow-y:auto;background:#fffaf1;border:5px solid #fff;border-radius:32px;padding:28px;box-shadow:0 16px 0 #8060aa,0 30px 65px #1b174d55;text-align:center}.overlay-card h2{font-size:clamp(1.5rem,4vw,2.3rem);margin:8px 35px 14px}.overlay-close{position:absolute;right:15px;top:13px;border:0;background:#f1dcff;border-radius:50%;width:44px;height:44px;font-size:1.2rem;color:#67368a}.overlay-lead{font-weight:800;color:#665273}.garden-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:12px;margin:22px 0}.garden-item{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:6px;background:#e7f8e2;border:3px solid white;border-radius:22px;min-height:112px}.garden-item span{font-size:3rem}.garden-item small{font-weight:900;color:#587a60}.garden-item.locked{background:#eee9f0}.garden-item.locked span{opacity:.55}.overlay-note{font-weight:800;color:#745787}.achievements{display:grid;gap:10px;margin:20px auto}.achievement{display:flex;align-items:center;justify-content:space-between;gap:12px;background:#eaf7ff;border-radius:18px;padding:13px 17px;font-weight:900}.achievement strong{white-space:nowrap;color:#8052af}.settings-body{text-align:left;font-weight:700;line-height:1.5}.danger{background:#ffe1e4;color:#963a54;border-color:#fff}.activity:focus-visible,.primary:focus-visible,.pill:focus-visible{outline:4px solid #ffe267;outline-offset:4px}@media(max-width:540px){.home-extras{margin:15px auto 5px;gap:8px}.extra{font-size:.86rem;padding:8px 12px;min-height:44px}.overlay-card{padding:18px 14px}.garden-grid{gap:7px}.garden-item{min-height:90px}.garden-item span{font-size:2.2rem}}@media(orientation:landscape) and (max-height:600px){.home-extras{margin:7px auto}.extra{min-height:38px;padding:4px 10px}}

/* V5 — introdução e cenários adaptativos */
.splash{position:fixed;inset:0;z-index:100;display:grid;place-items:center;overflow:auto;isolation:isolate;background:#a5e5d1;padding:24px 16px;text-align:center}.splash.is-leaving{animation:splashExit .65s ease both;pointer-events:none}.splash-landscape{position:absolute;inset:-16px;z-index:-2;background:url('../assets/concept.png') center 53%/cover no-repeat;filter:blur(10px) saturate(1.13);transform:scale(1.05)}.splash:before{content:"";position:absolute;inset:0;z-index:-1;background:linear-gradient(180deg,rgba(24,91,106,.42),rgba(244,255,232,.76) 40%,rgba(238,252,229,.88) 80%,rgba(58,135,91,.45))}.splash-content{width:min(100%,600px);padding:clamp(22px,5vw,45px);background:rgba(255,255,246,.91);border:4px solid white;border-radius:40px;box-shadow:0 18px 65px #254d4960;backdrop-filter:blur(9px)}.splash-badge{font-size:.8rem;font-weight:900;letter-spacing:.1em;color:#9361bb}.splash-friends{font-size:clamp(3rem,10vw,5.5rem);margin:8px 0;animation:floatFriends 2.6s ease-in-out infinite}.splash h1{font-size:clamp(2rem,6vw,3.6rem);line-height:1.1;margin:10px 0;color:#644394}.splash h1 span{color:#e88e35}.splash p{font-size:clamp(.95rem,2.6vw,1.2rem);font-weight:800;color:#5c5970}.loading-track{height:17px;border-radius:30px;background:#e2d9f2;overflow:hidden;border:2px solid white;margin:25px auto 9px;max-width:420px}.loading-track span{display:block;width:0;height:100%;background:linear-gradient(90deg,#8edb9a,#f4c757,#d890e6);border-radius:30px;transition:width .22s}.loading-message{font-size:.85rem;color:#6e6185;font-weight:800;min-height:25px}.splash-enter{margin-top:15px;padding:12px 25px;font-size:1.2rem}.splash-enter:disabled{opacity:.65;cursor:wait}.skip-intro{display:block;margin:17px auto 0;border:0;background:transparent;color:#655287;text-decoration:underline;font-weight:900;min-height:36px}.game{isolation:isolate;background:linear-gradient(180deg,#d7f7ef,#9ddbb8)}.game-scenery{position:absolute;inset:0;z-index:-2;background:url('../assets/concept.png') center center/cover no-repeat;filter:blur(9px) saturate(.9);transform:scale(1.05)}.game:before{content:"";position:absolute;inset:0;z-index:-1;background:linear-gradient(180deg,rgba(219,252,242,.9),rgba(216,251,230,.8) 40%,rgba(184,230,199,.88))}.game-panel{background:rgba(255,252,245,.96);backdrop-filter:blur(6px)}.scenery{filter:blur(9px) saturate(.95)}.home:before{background:linear-gradient(180deg,rgba(16,66,70,.42),rgba(229,255,241,.83) 28%,rgba(246,255,239,.88) 79%,rgba(37,89,65,.32))}.activity,.answer,.memory-card,.pill,.round{touch-action:manipulation}.activity{min-height:140px}.game-panel{width:100%}@keyframes floatFriends{50%{transform:translateY(-9px)}}@keyframes splashExit{to{opacity:0;transform:scale(1.035)}}@media(max-width:600px){.splash{padding:14px}.splash-content{border-radius:28px;padding:22px 15px}.splash-friends{font-size:3.7rem}.splash h1{font-size:2.25rem}.splash p{margin:10px auto}.game{padding:12px}.game-header{margin-bottom:14px}.game-panel{border-radius:26px;padding:15px}.game-intro{align-items:center}.game-intro p{font-size:.85rem}.object-field{margin:13px auto;min-height:135px;padding:12px}.answers{gap:9px}.answer{min-height:76px}.topbar{gap:8px}.profile{padding:8px 11px}.profile small{font-size:.7rem}}@media(max-height:560px) and (orientation:landscape){.splash-content{max-width:660px;padding:10px 24px}.splash-friends{font-size:2.3rem;margin:0}.splash h1{font-size:1.7rem;margin:3px}.splash p{margin:4px}.loading-track{margin:8px auto 3px}.splash-enter{margin-top:5px}.skip-intro{margin:3px auto 0}.game-header{margin-bottom:8px}.game-panel{padding:12px}.object-field{min-height:95px;margin:8px auto}.answer{min-height:60px}}@media(prefers-reduced-motion:reduce){.splash-friends,.splash.is-leaving{animation:none!important}.loading-track span{transition:none}}


/* V6: a arte aprovada é a própria composição da home em desktop.
   Os botões HTML são regiões clicáveis e acessíveis sobre a arte. */
html,body,#app{width:100%;height:100%;margin:0;overflow:hidden;overscroll-behavior:none}
.screen{height:100dvh;min-height:0;overflow:hidden}
.home{display:block;background:#4f9f8c;isolation:isolate}
.home .scenery,.home:before{display:none}
.art-stage{position:absolute;inset:0;background:url('../assets/concept.png') center/contain no-repeat;pointer-events:none}
.home .topbar,.home .home-content,.home .home-footer{position:relative;z-index:1}
.home .home-content{max-width:none;margin:0;padding:0;display:block;width:100%;height:100%}
.home .brand,.home .home-footer{display:none}
.home .topbar{position:absolute;inset:0;pointer-events:none;padding:0}
.home .profile{position:absolute;left:1%;top:1.3%;padding:5px 12px;font-size:.9rem;opacity:.96;pointer-events:auto}
.home .controls{position:absolute;right:1.2%;top:1.4%;pointer-events:auto;gap:7px}
.home .controls .round{width:clamp(35px,4.1vw,60px);height:clamp(35px,4.1vw,60px);font-size:clamp(1rem,2vw,1.5rem);opacity:.06}
.home .controls .round:focus-visible,.home .controls .round:hover{opacity:1}
.home .activities{position:absolute;inset:0;display:block;max-width:none;margin:0;pointer-events:none}
.home .activity{position:absolute;min-height:0;padding:0;border:0;border-radius:12%;background:transparent!important;box-shadow:none!important;color:transparent;pointer-events:auto;overflow:visible}
.home .activity:before,.home .activity-emoji,.home .activity strong,.home .activity small{display:none}
.home .activity:nth-child(1){left:30.5%;top:30.8%;width:14.5%;height:20.9%}
.home .activity:nth-child(2){left:47.3%;top:30.8%;width:16.1%;height:20.9%}
.home .activity:nth-child(3){left:66.8%;top:30.8%;width:16.5%;height:20.9%}
.home .activity:nth-child(4){left:37.6%;top:54.4%;width:17.4%;height:21%}
.home .activity:nth-child(5){left:58.4%;top:54.4%;width:18.4%;height:21%}
.home .activity:hover{transform:none;outline:4px solid #fff9;outline-offset:0}
.home #play{position:absolute;left:37%;top:79.4%;width:26%;height:14.6%;padding:0;opacity:0;box-shadow:none}
.home #play:focus-visible,.home #play:hover{opacity:.85}
.home .home-extras{position:absolute;left:0;right:0;bottom:1%;margin:0;display:flex;justify-content:space-between;padding:0 2%;pointer-events:none}
.home .home-extras button{pointer-events:auto;min-height:35px;padding:5px 12px;font-size:clamp(.65rem,1vw,.9rem);opacity:.93}
.game{height:100dvh;min-height:0;padding:clamp(6px,1.3vh,16px);display:grid;grid-template-rows:auto minmax(0,1fr);align-items:stretch}
.game-header{margin:0 auto 6px;width:min(100%,1050px);min-height:40px}
.game-panel{align-self:center;max-height:calc(100dvh - 62px);overflow:hidden;padding:clamp(8px,1.6vh,20px);border-radius:24px}
.game-intro h2{font-size:clamp(1.05rem,2.8vh,2rem)}
.game-intro p{font-size:clamp(.7rem,1.8vh,1rem)}
.game .mascot{font-size:clamp(1.7rem,5vh,3.5rem)}
.game .object-field{min-height:0;height:clamp(68px,22vh,170px);margin:clamp(4px,1vh,12px) auto;padding:6px;gap:clamp(3px,1vw,12px)}
.game .object{font-size:clamp(1.4rem,6vh,4rem)}
.game .answer{min-height:clamp(45px,10vh,75px);font-size:clamp(1.2rem,4vh,2.5rem)}
.game .answers{gap:clamp(4px,1vw,12px)}
.game .feedback{min-height:22px;margin:clamp(3px,1vh,12px) 0 0;font-size:clamp(.75rem,2vh,1rem)}
.game .next{margin-top:5px;padding:5px 18px;font-size:clamp(.85rem,2vh,1.15rem)}
.game-bottom{display:none}
.game .memory-card{min-height:0;aspect-ratio:auto;height:clamp(44px,10vh,80px);font-size:clamp(1.3rem,5vh,3rem)}
.splash{overflow:hidden}
.splash-content{max-height:95dvh;overflow:hidden;padding:clamp(10px,3vh,35px)}
@media (min-aspect-ratio: 1648/928) {.art-stage{background-size:100% auto}}
@media (max-aspect-ratio: 1648/928) and (min-width:800px) {.art-stage{background-size:auto 100%}}
/* Em retrato usamos uma composição mobile real, não reduzimos o menu horizontal. */
@media (max-width:799px), (orientation:portrait){
.home{background:linear-gradient(#8bd7f3,#b7f2d0)}
.art-stage{background-size:auto 100%;background-position:35% center;filter:saturate(1.12)}
.home:after{content:'';position:absolute;inset:0;background:linear-gradient(#e7faff22,#f0fff2d9 30%,#efffe5d9 85%,#62b88a44);pointer-events:none}
.home .topbar{z-index:3;height:48px;inset:0 0 auto}
.home .profile{left:8px;top:6px;font-size:.8rem;padding:5px 8px}
.home .controls{top:5px;right:7px;gap:4px}
.home .controls .round{opacity:1;width:38px;height:38px;font-size:1rem}
.home .home-content{z-index:2;display:flex;flex-direction:column;justify-content:center;align-items:center;padding:clamp(52px,10vh,75px) 10px clamp(5px,2vh,15px)}
.home .brand{display:block;margin:0 0 clamp(5px,1.5vh,14px);text-align:center}
.home .brand .eyebrow,.home .brand p{display:none}
.home .brand h1{font-size:clamp(2.2rem,8vw,4rem);margin:0;color:white}
.home .activities{position:static;display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:clamp(6px,1.4vh,13px);width:min(100%,500px);pointer-events:auto;max-width:none;margin:0}
.home .activity,.home .activity:nth-child(n){position:static;display:flex;width:auto;height:auto;min-height:clamp(72px,13vh,120px);padding:7px 4px;border:3px solid white;border-radius:22px;background:linear-gradient(140deg,#fff1a9,#ffc956)!important;box-shadow:0 4px 0 #ca9e48!important;color:#4c2d5d;overflow:hidden}
.home .activity:nth-child(2){background:linear-gradient(140deg,#edccff,#b68afa)!important}
.home .activity:nth-child(3){background:linear-gradient(140deg,#d3f5ff,#8ddcff)!important}
.home .activity:nth-child(4){background:linear-gradient(140deg,#d8ffc9,#9fe87c)!important}
.home .activity:nth-child(5){background:linear-gradient(140deg,#ffe0f4,#ffa8d3)!important;grid-column:1/-1;min-height:clamp(64px,10vh,95px)}
.home .activity-emoji,.home .activity strong{display:block}
.home .activity-emoji{font-size:clamp(1.4rem,4vh,2.3rem)}
.home .activity strong{font-size:clamp(.85rem,2.1vh,1.1rem)}
.home .activity small{display:none}
.home #play{position:static;opacity:1;width:min(80%,330px);height:auto;min-height:clamp(46px,8vh,68px);margin:clamp(8px,2vh,20px) auto 0;padding:5px 16px;font-size:clamp(1.1rem,3vh,1.7rem);box-shadow:0 5px 0 #6320a5}
.home .home-extras{position:static;width:100%;padding:0;margin:clamp(6px,1.5vh,12px) 0 0;justify-content:center;gap:8px}
.home .home-extras button{font-size:.75rem;padding:4px 9px;min-height:34px}
.game .game-header{flex-wrap:nowrap}
.game .progress-label{order:0;flex:0 1 auto;font-size:.78rem}
.game .game-header .pill{font-size:.78rem;padding:6px 9px;min-height:36px}
.game .game-panel{padding:clamp(7px,1.5vh,16px);border-width:3px}
.game .game-intro{gap:5px}
.game .object-field{height:clamp(65px,19vh,145px)}
.game .memory-card{height:clamp(45px,9vh,75px)}
}
@media (max-height:540px) and (orientation:landscape){
.home .home-extras{bottom:0}.home .home-extras button{font-size:.65rem;min-height:27px;padding:2px 7px}
.game .object-field{height:17vh}.game .answer{min-height:38px}.game .memory-card{height:13vh}
.splash-friends{font-size:1.8rem}.splash h1{font-size:1.5rem}.splash p{font-size:.8rem}.splash-content{padding:8px}
}
@media (max-height:630px) and (orientation:portrait){
.home .brand h1{font-size:2rem}.home .activities{gap:5px}.home .activity:nth-child(n){min-height:62px;padding:3px}.home .activity-emoji{font-size:1.3rem}.home .activity strong{font-size:.77rem}.home #play{min-height:40px;margin-top:7px}.home .home-extras{margin-top:5px}
}


/* MVP 7: independent interactive UI, no baked-in image controls */
html,body,#app{height:100%;height:100dvh;overflow:hidden}
.home{height:100dvh;display:flex;flex-direction:column;background:#80cba6;isolation:isolate}
.home .art-stage{inset:-8%;background:url('../assets/garden-soft.webp') center/cover no-repeat;filter:saturate(1.3);transform:scale(1.03)}
.home .scenery{display:none}.home:before{display:block;inset:0;background:linear-gradient(180deg,#46b9e833,#edffe333 65%,#55b16c44)}
.home:after{display:none}
.home .topbar{position:relative;inset:auto;z-index:8;flex:none;height:clamp(50px,9vh,75px);display:flex;justify-content:space-between;align-items:center;padding:8px clamp(12px,2vw,32px);pointer-events:auto}
.home .profile,.home .controls{position:static;pointer-events:auto}
.home .controls .round{opacity:1;width:clamp(38px,4.3vw,54px);height:clamp(38px,4.3vw,54px);font-size:1.25rem;background:linear-gradient(#e4f7ff,#78b8f2);border:3px solid white;box-shadow:0 4px 0 #3265a1}
.home .home-content{position:relative;z-index:4;display:flex;flex:1;min-height:0;width:min(100%,1000px);height:auto;max-width:1000px;margin:0 auto;padding:0 12px 8px;flex-direction:column;align-items:center;justify-content:center}
.home .brand{display:block;margin:0 auto clamp(7px,1.4vh,16px);text-align:center}
.home .brand .eyebrow{display:block;font-size:clamp(.7rem,1.6vh,1rem);letter-spacing:.05em}
.home .brand h1{font-size:clamp(2.1rem,5.8vw,4.8rem);line-height:1.06;margin:2px 0 0;color:white;text-shadow:0 4px #9b5299,0 7px 15px #58396a;-webkit-text-stroke:1px #ad6cb5}
.home .brand h1 span{color:#ffcd3d}
.home .brand p{display:none}
.home .activities{position:static;display:grid;grid-template-columns:repeat(6,minmax(0,1fr));gap:clamp(7px,1.5vh,17px);width:min(100%,790px);max-width:790px;margin:0 auto clamp(10px,2vh,20px);inset:auto;pointer-events:auto}
.home .activity,.home .activity:nth-child(n){position:relative;grid-column:span 2;display:flex;flex-direction:column;justify-content:center;align-items:center;width:auto;height:auto;min-height:0;aspect-ratio:1.45;padding:8px 6px;border:4px solid #fff9df;border-radius:clamp(17px,2vw,28px);color:#50335c;overflow:hidden;pointer-events:auto;transition:transform .2s,filter .2s;box-shadow:0 6px 0 #bf9248,0 12px 20px #0002!important;background:linear-gradient(145deg,#fff6d7,#ffd17b)!important}
.home .activity:nth-child(2){background:linear-gradient(145deg,#f3dcff,#bd8df6)!important;box-shadow:0 6px 0 #9973cc!important}
.home .activity:nth-child(3){background:linear-gradient(145deg,#e1f9ff,#86d8fa)!important;box-shadow:0 6px 0 #65b3d3!important}
.home .activity:nth-child(4){grid-column:2/span 2;background:linear-gradient(145deg,#e4ffd1,#a3e977)!important;box-shadow:0 6px 0 #74b85a!important}
.home .activity:nth-child(5){grid-column:4/span 2;background:linear-gradient(145deg,#ffe6f6,#ffa9d7)!important;box-shadow:0 6px 0 #d47bab!important}
.home .activity:before{display:block;inset:0 0 50%;background:linear-gradient(#fff9,transparent)}
.home .activity-emoji,.home .activity strong{display:block}
.home .activity-emoji{font-size:clamp(1.65rem,5.5vh,3.5rem);line-height:1.2}
.home .activity strong{font-size:clamp(.83rem,2.2vh,1.3rem);line-height:1.08;max-width:16ch}
.home .activity small{display:none}
.home .activity:hover{transform:translateY(-4px);filter:brightness(1.04)}
.home #play{position:static;opacity:1;width:min(70%,350px);height:auto;min-height:clamp(45px,8vh,70px);margin:0 auto clamp(7px,1vh,12px);padding:4px 14px;box-shadow:0 7px 0 #6320a5;font-size:clamp(1.2rem,3.5vh,2rem)}
.home .home-extras{position:static;display:flex;justify-content:space-between;width:min(100%,620px);padding:0;margin:0 auto;pointer-events:auto;gap:8px}
.home .home-extras button{opacity:1;min-height:34px;padding:5px 12px;font-size:clamp(.7rem,1.6vh,.95rem);background:#fffaf2}
.home .home-footer{display:none}
.character{position:absolute;z-index:2;pointer-events:none;background-size:contain;background-repeat:no-repeat;background-position:center bottom;filter:drop-shadow(0 10px 14px #244c3733)}
.character-maya{background-image:url('../assets/maya-character.webp');left:-2%;bottom:-3%;width:clamp(150px,30vw,480px);height:80%}
.character-fox{background-image:url('../assets/fox-character.webp');left:0;bottom:-3%;width:clamp(100px,17vw,270px);height:35%}
.character-bunny{background-image:url('../assets/bunny-character.webp');right:-1%;bottom:-2%;width:clamp(110px,20vw,310px);height:36%}
.butterfly{position:absolute;right:17%;top:12%;font-size:clamp(22px,4vw,45px);z-index:2;animation:butterflyFly 5s ease-in-out infinite;pointer-events:none}
@keyframes butterflyFly{50%{transform:translate(-25px,12px) rotate(12deg)}}
/* The game content remains inside the viewport and scales to available height. */
.game{height:100dvh;min-height:0;overflow:hidden}
.game-panel{min-height:0;overflow:hidden}
@media(max-width:950px){.character-maya{opacity:.65;left:-8%}.character-bunny{opacity:.65;right:-6%}.character-fox{opacity:.7}}
@media(max-width:650px), (orientation:portrait){
 .home .topbar{height:52px;padding:5px 8px}.home .profile{font-size:.75rem;padding:5px 8px}.home .controls{gap:4px}.home .controls .round{width:37px;height:37px;min-width:37px;min-height:37px;font-size:1rem}
 .home .home-content{width:100%;padding:0 10px 10px;justify-content:center}
 .home .brand{margin:0 auto clamp(5px,1.5vh,12px)}.home .brand .eyebrow{font-size:.65rem}.home .brand h1{font-size:clamp(2rem,9vw,3.6rem)}
 .home .activities{grid-template-columns:repeat(2,minmax(0,1fr));gap:clamp(6px,1.4vh,12px);width:min(100%,460px);margin-bottom:clamp(7px,1.5vh,15px)}
 .home .activity,.home .activity:nth-child(n){grid-column:auto;aspect-ratio:auto;min-height:clamp(72px,13vh,118px);border-width:3px;border-radius:20px;padding:5px}
 .home .activity:nth-child(5){grid-column:1/-1;min-height:clamp(64px,10vh,88px)}
 .home .activity-emoji{font-size:clamp(1.5rem,4vh,2.3rem)}.home .activity strong{font-size:clamp(.8rem,2vh,1.05rem)}
 .home #play{width:min(75%,290px);min-height:clamp(44px,7vh,62px);font-size:clamp(1.15rem,3vh,1.7rem);margin-bottom:clamp(7px,1.2vh,12px)}
 .home .home-extras{justify-content:center}.home .home-extras button{font-size:.72rem;min-height:33px}
 .character-maya{width:40vw;height:38%;left:-16%;bottom:0;opacity:.35}.character-fox{width:29vw;height:24%;left:-7%;opacity:.6}.character-bunny{width:32vw;height:23%;right:-10%;opacity:.55}.butterfly{right:7%;top:15%}
}
@media(max-height:560px) and (orientation:landscape){.home .topbar{height:43px}.home .brand{margin-bottom:4px}.home .brand h1{font-size:clamp(1.5rem,5vh,2.2rem)}.home .brand .eyebrow{display:none}.home .activities{width:min(75%,650px);gap:5px;margin-bottom:7px}.home .activity,.home .activity:nth-child(n){aspect-ratio:auto;min-height:clamp(60px,19vh,90px);padding:2px}.home .activity-emoji{font-size:clamp(1.2rem,4vh,1.9rem)}.home .activity strong{font-size:clamp(.7rem,2.7vh,.95rem)}.home #play{min-height:35px;font-size:1rem;margin-bottom:5px}.home .home-extras button{min-height:26px;padding:1px 9px}.character-maya{height:75%}}
@media(max-height:650px) and (orientation:portrait){.home .brand h1{font-size:1.9rem}.home .brand .eyebrow{display:none}.home .activities{gap:5px}.home .activity,.home .activity:nth-child(n){min-height:clamp(55px,11vh,74px);padding:2px}.home .activity-emoji{font-size:1.3rem}.home .activity strong{font-size:.75rem}.home #play{min-height:38px;margin-bottom:5px}}
@media(prefers-reduced-motion:reduce){.butterfly{animation:none}}

/* MVP 8 — art direction rebuild: no awkward character crops or double UI */
.home{background:linear-gradient(180deg,#6dd3f8 0%,#b9f4e4 57%,#6cce83 100%);overflow:hidden}
.home .art-stage{inset:0;transform:none;background: url('../assets/garden-v8.svg') center center/cover no-repeat;filter:none;opacity:1}
.home:before{content:'';position:absolute;inset:0;background:linear-gradient(90deg,#183f4a24,transparent 24%,transparent 78%,#183f4a20),linear-gradient(0deg,#367f322c,transparent 30%);z-index:1;pointer-events:none}
.home .character{display:none!important}
.home .home-content{width:min(100%,860px);max-width:860px;justify-content:center;padding:0 18px 8px;filter:drop-shadow(0 7px 15px #24544a25)}
.home .brand{margin:0 auto clamp(12px,2.4vh,22px)}
.home .brand .eyebrow{display:inline-block;background:#fff8e9;border:2px solid #fff;box-shadow:0 3px 0 #dbb66c;border-radius:100px;color:#865d3a;padding:6px 18px;font-weight:900;letter-spacing:.03em}
.home .brand h1{font-size:clamp(2.5rem,5.5vw,4.8rem);letter-spacing:-.045em;line-height:1.05;color:#fff;text-shadow:0 3px 0 #85406b,0 6px 0 #85406b,0 10px 16px #43334b70;-webkit-text-stroke:1.4px #824567}
.home .brand h1 span{color:#ffca46;-webkit-text-stroke:1.5px #a45877}
.home .activities{width:min(100%,740px);gap:clamp(9px,1.8vh,17px);margin-bottom:clamp(12px,2.1vh,20px)}
.home .activity,.home .activity:nth-child(n){border:4px solid #fffdf3;border-radius:26px;aspect-ratio:1.52;box-shadow:0 7px 0 #c89554,0 13px 20px #2b5a4b3d!important;isolation:isolate}
.home .activity:before{content:'';position:absolute;inset:0 0 52%;border-radius:inherit;background:linear-gradient(#ffffff9e,#ffffff00);pointer-events:none}
.home .activity-emoji{font-size:clamp(2rem,5.8vh,3.7rem);filter:drop-shadow(0 3px 2px #0002)}
.home .activity strong{font-size:clamp(.95rem,2.35vh,1.35rem);font-weight:900;text-shadow:0 1px #fff9}
.home .activity:focus-visible,.home #play:focus-visible{outline:5px solid #ffdc4a;outline-offset:4px}
.home #play{border:4px solid #fff8ed;border-radius:100px;background:linear-gradient(#d874fa,#9e35e7 60%,#7d24c5);box-shadow:0 7px 0 #5d249b,0 12px 20px #263c4a60;font-weight:1000;letter-spacing:.01em}
.home .home-extras button{background:#fffaf1;border:2px solid white;box-shadow:0 3px 0 #bdcbb0;color:#614478;font-weight:800}
.home .topbar{z-index:7}.home .profile{background:#fff9e9;border:2px solid white;box-shadow:0 3px 0 #c4ae7b}.home .controls .round{border:3px solid white}
.home .butterfly{z-index:2;top:16%;right:14%;filter:drop-shadow(0 2px 3px #0004)}
@media(min-width:1100px){.home .home-content{transform:translateX(2.5vw)}.home .activities{width:min(100%,720px)}}
@media(max-width:760px), (orientation:portrait){
.home .art-stage{background-position:49% center}
.home:before{background:linear-gradient(#d6fff76b,#efffe3c4 25%,#f5ffe8df 82%,#b6eeb85e)}
.home .home-content{padding:0 12px 10px;filter:none}
.home .brand{margin-bottom:clamp(7px,1.4vh,14px)}
.home .brand .eyebrow{font-size:.65rem;padding:4px 9px}
.home .brand h1{font-size:clamp(2.15rem,8.7vw,3.5rem)}
.home .activities{width:min(100%,440px);gap:clamp(7px,1.25vh,12px)}
.home .activity,.home .activity:nth-child(n){aspect-ratio:auto;min-height:clamp(75px,12vh,116px);border-width:3px;border-radius:20px;padding:5px 4px}
.home .activity:nth-child(5){min-height:clamp(64px,9vh,85px)}
.home .activity-emoji{font-size:clamp(1.55rem,3.8vh,2.35rem)}
.home .activity strong{font-size:clamp(.85rem,2vh,1.1rem)}
.home #play{min-height:clamp(45px,7vh,60px)}
.home .butterfly{right:6%;top:14%}
}
@media(max-height:600px) and (orientation:landscape){
.home .brand{margin-bottom:5px}.home .brand .eyebrow{display:none}.home .brand h1{font-size:clamp(1.6rem,6vh,2.5rem)}
.home .activities{width:min(75%,640px);gap:6px;margin-bottom:7px}
.home .activity,.home .activity:nth-child(n){aspect-ratio:auto;min-height:clamp(50px,18vh,86px);padding:2px;border-width:2px;border-radius:14px}
.home .activity-emoji{font-size:clamp(1.1rem,4vh,1.8rem)}.home .activity strong{font-size:clamp(.7rem,2.6vh,.95rem)}
.home #play{min-height:34px;margin-bottom:5px}.home .home-extras button{min-height:26px;padding:2px 8px}
}
@media(max-height:630px) and (orientation:portrait){.home .brand h1{font-size:1.85rem}.home .activities{gap:5px}.home .activity,.home .activity:nth-child(n){min-height:56px}.home .activity:nth-child(5){min-height:48px}.home .activity-emoji{font-size:1.25rem}.home .activity strong{font-size:.75rem}.home #play{min-height:37px;margin-bottom:5px}}