*{box-sizing:border-box}body{margin:0;background:#e8f3f1;color:#173e43;font-family:ui-rounded,'Trebuchet MS',sans-serif;font-size:16px}button,select,input{font:inherit}button{cursor:pointer;border:0;touch-action:manipulation}button:focus-visible,select:focus-visible{outline:3px solid #f3ad33;outline-offset:3px}.app{max-width:680px;min-height:100dvh;margin:auto;padding:22px 20px 110px;background:#f7fbf7}header{display:flex;align-items:center;justify-content:space-between;margin-bottom:22px}small{font-size:12px;font-weight:bold;letter-spacing:2px;color:#518181}h1{font-size:29px;margin:4px 0}h1 span{color:#e4a326}.coins{background:#fff0ba;border:2px solid #f3d985;border-radius:25px;padding:12px 17px;white-space:nowrap}h2{font-size:24px;margin:0 0 6px}p{line-height:1.5;margin:8px 0 18px;color:#5b777c}.row{display:flex;gap:10px;align-items:center;justify-content:space-between}.primary,.secondary{border-radius:18px;padding:17px 20px;font-weight:bold;font-size:17px}.primary{background:#126b68;color:white;box-shadow:0 4px 0 #084d4b}.secondary{background:#ffda77;color:#523e12;box-shadow:0 4px 0 #eabb47}.actions{display:grid;grid-template-columns:1fr 1fr;gap:12px;margin:20px 0}.room{position:relative;background:#a9d6cb url('room-art.png') center/cover;aspect-ratio:3/4;border-radius:26px;overflow:hidden;border:5px solid white;box-shadow:0 6px 25px #173e4315;max-height:560px}.room-item{position:absolute;transform:translate(-50%,-50%);font-size:clamp(40px,10vw,76px);background:none;padding:5px;line-height:1.1;user-select:none;touch-action:none;filter:drop-shadow(0 8px 3px #0002)}.avatar{position:absolute;left:50%;top:69%;transform:translate(-50%,-50%);text-align:center;filter:drop-shadow(0 10px 4px #0002);width:110px;pointer-events:none}.avatar .face{font-size:85px;line-height:1}.avatar .shirt{font-size:65px;line-height:.85}.avatar .hat{position:absolute;left:30px;top:-28px;font-size:53px}.avatar .accessory{position:absolute;right:-10px;top:55px;font-size:40px}.room-label{position:absolute;top:15px;left:15px;background:#ffffffe8;padding:9px 13px;border-radius:20px;font-weight:bold;font-size:14px}.hint{font-size:14px;text-align:center;margin:10px 0}.goal{padding:15px;background:#edf0df;border-radius:17px;margin:14px 0}.goal progress{width:100%;accent-color:#126b68;height:8px}.settings{display:flex;flex-wrap:wrap;gap:8px;margin:14px 0}.chip{background:#e1efea;color:#225b58;border-radius:14px;padding:10px 13px;font-size:14px}.chip.active{background:#126b68;color:white}nav{position:fixed;bottom:0;left:50%;transform:translateX(-50%);width:min(100%,680px);display:flex;justify-content:space-around;background:#fffffff5;border-top:1px solid #d9e7e1;padding:12px 10px max(12px,env(safe-area-inset-bottom));z-index:10}nav button{background:none;color:#6b8382;font-size:23px;width:30%;border-radius:16px;padding:7px}nav span{display:block;font-size:14px;margin-top:5px}nav button.active{background:#e1efea;color:#126b68;font-weight:bold}.card{background:white;border-radius:24px;padding:22px;border:1px solid #dceae4}.puzzle{text-align:center;margin-top:20px}.equation{font-size:clamp(38px,11vw,62px);font-weight:bold;margin:25px 0}.answer{width:150px;border:2px solid #b5d4ce;border-radius:17px;padding:12px;text-align:center;font-size:32px;color:#173e43}.keypad{display:grid;grid-template-columns:repeat(3,1fr);gap:10px;max-width:350px;margin:20px auto}.keypad button{border-radius:14px;background:#edf4f1;color:#173e43;padding:15px;font-size:23px;font-weight:bold}.feedback{min-height:48px;line-height:1.5;font-weight:bold;margin:16px 0}.dots{display:flex;justify-content:center;gap:12px;margin:15px}.dot{width:13px;height:13px;border-radius:50%;background:#dce8df}.dot.done{background:#e8b437}.shop-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:12px}.product{background:white;border:1px solid #dae9df;border-radius:22px;padding:16px;text-align:center}.product .icon{font-size:58px;padding:12px}.product h3{font-size:16px;margin:5px 0}.product small{letter-spacing:0;font-size:13px}.product button{width:100%;padding:11px 6px;border-radius:12px;background:#126b68;color:white;margin-top:12px;font-weight:bold;font-size:14px}.product .wish{background:#edf4f1;color:#426b65;margin-top:6px}.product button:disabled{background:#e4ebe6;color:#62746d;cursor:default}.celebrate{text-align:center;padding:35px 10px}.celebrate .big{font-size:82px}.reward{font-size:36px;font-weight:bold;color:#a67100;margin:18px}.pop{animation:pop .35s ease}#toast{position:fixed;bottom:110px;left:50%;transform:translateX(-50%);background:#173e43;color:white;border-radius:16px;padding:13px 20px;max-width:90%;opacity:0;pointer-events:none;z-index:20}#toast.show{opacity:1}@keyframes pop{50%{transform:scale(1.12)}}@media(min-width:600px){.room{aspect-ratio:1/1}.shop-grid{grid-template-columns:repeat(3,1fr)}}@media(prefers-reduced-motion:reduce){*{animation:none!important}}
button{transition:transform .12s ease,box-shadow .12s ease,background .2s}button:active:not(:disabled){transform:scale(.94) translateY(2px)}main{animation:arrive .22s ease}header{flex-wrap:wrap}.coins{margin-left:auto}.avatar{pointer-events:auto;cursor:pointer;animation:breathe 4s ease-in-out infinite;z-index:2}.avatar .face{animation:peek 8s ease-in-out infinite}.room-item{z-index:3}.room-item.lifted{transform:translate(-50%,-60%) scale(1.12);filter:drop-shadow(0 18px 6px #0004);z-index:5}.room-item.glowing{filter:drop-shadow(0 0 18px #ffe572) drop-shadow(0 0 35px #ffed9a)}.pet{position:absolute;left:65%;top:80%;font-size:48px;background:none;z-index:4;animation:wander 12s ease-in-out infinite}.sunbeam{position:absolute;inset:0;background:linear-gradient(125deg,transparent 35%,#fff8bf22 45%,transparent 65%);pointer-events:none;animation:sunlight 10s ease-in-out infinite}.particle{position:fixed;z-index:100;font-size:24px;pointer-events:none}.math-buddy{font-size:46px;margin:6px auto 12px}.correct-answer{background:#e4f8de!important;border-color:#62ad76!important;color:#247742}.success-text{color:#247742}.completed-stars{font-size:32px;letter-spacing:8px;color:#e4a326;margin-bottom:15px}.happy-dance{animation:dance .9s ease-in-out 2}.preview-icon{background:none;font-size:58px;padding:0}.preview-dialog{border:0;border-radius:27px;padding:24px;width:min(92vw,420px);max-height:90dvh;overflow:auto;color:#173e43;box-shadow:0 20px 70px #0004}.preview-dialog::backdrop{background:#153d43aa;backdrop-filter:blur(4px)}.preview-room{aspect-ratio:1/1;min-height:250px;margin-top:12px}.close-preview{float:right;background:#e1efea;border-radius:50%;height:35px;width:35px;font-size:26px}.preview-dialog .purchase{width:100%}.purchase:disabled{opacity:.5;cursor:default}.preview-note{text-align:center;margin:16px 0}.preview-dialog .avatar{pointer-events:none}.room button:focus-visible{outline:3px solid white}@keyframes arrive{from{opacity:.7;translate:0 5px}to{opacity:1;translate:0 0}}@keyframes breathe{50%{translate:0 -3px}}@keyframes peek{0%,85%,100%{rotate:0deg}90%{rotate:-5deg}95%{rotate:5deg}}@keyframes wander{0%,100%{translate:0 0}40%{translate:-50px -8px}65%{translate:-30px 0}}@keyframes sunlight{50%{opacity:.4}}@keyframes dance{25%{rotate:-10deg;translate:0 -10px}75%{rotate:10deg;translate:0 -10px}}@media(prefers-reduced-motion:reduce){*{animation:none!important;transition:none!important}}
/* Sunny cartoon dollhouse with warm storybook surfaces. */
body{background:#8bcdc6;color:#583622}.app{background:#fff3dc;max-width:620px;padding:16px 16px 105px}header{margin-bottom:15px}header small{color:#a86b34;letter-spacing:1.4px}h1{font-size:32px;color:#227f82;text-shadow:0 2px #fff}h2{color:#6d432a;font-size:23px}p{color:#8a6549}.coins{background:#ffe191;border:2px solid #bf853c;box-shadow:inset 0 3px #fff3c7,0 3px #c08a45;color:#65421c}.room{background-image:url('room-v3.png');border:3px solid #a66c40;border-radius:25px;box-shadow:0 5px #be854d,0 12px 24px #7c51351a;aspect-ratio:3/4;max-height:none}.room-label{background:#fff4dbe8;color:#735031;border:1px solid #c9a171}.primary{background:#ffd05f;border:2px solid #b37a35;color:#68411b;box-shadow:inset 0 3px #fff0b5,0 5px #b37a35}.secondary{background:#58c1d2;color:#164e61;border:2px solid #297b91;box-shadow:inset 0 3px #a5e4ea,0 5px #297b91}.actions{margin:16px 0}.hint{color:#986b43}.goal{background:#ffe7b4;border:1px solid #deb675;color:#715022}.goal small{letter-spacing:0;color:#8c6236}.goal .row b{display:flex;align-items:center;font-size:14px}.goal .item-art{width:38px;height:38px;flex-shrink:0}.chip{background:#f4dbb4;color:#7d5431;border:1px solid #e0bb88}.chip.active{background:#32989b;color:white;border-color:#237779}.card{background:#fffaf0;border:2px solid #ddbd85;box-shadow:0 5px #e7c999}.keypad button{background:#ffe9bd;color:#6b452b;border:1px solid #dab575;box-shadow:0 3px #d9b476}.answer{background:#fff3d7;border-color:#d4b079;color:#6c462b}.product{background:#fff9ec;border:2px solid #dfb883;box-shadow:0 4px #ead0a7;padding:12px}.product button{background:#39a3a4;color:white;border:1px solid #258587}.product .wish{background:#fff0cb;color:#8c6335}.product .icon{padding:4px;line-height:1}.shop-grid{gap:15px}.product h3{color:#68442a}.product small{color:#927251}.preview-dialog{background:#fff3dc;border:2px solid #b58454}.preview-dialog .room{aspect-ratio:3/4;max-height:360px}.preview-dialog p{margin:8px 0 12px}.preview-note{font-size:14px}nav{background:#fff0d9f5;border-top:2px solid #dab785}nav button{color:#9a724a}nav button.active{background:#ffe1a5;color:#6c4929}.item-art{display:inline-block;width:80px;height:80px;background-image:url('items-v3.png');background-size:400% 400%;background-position:calc(var(--col)*100%/3) calc(var(--row)*100%/3);background-repeat:no-repeat;vertical-align:middle;pointer-events:none}.product .item-art{width:105px;height:105px}.room-item{padding:0;font-size:0}.room-item .item-art{width:clamp(65px,20vw,115px);height:clamp(65px,20vw,115px)}.room-item.floor-rug{z-index:1}.room-item.floor-rug .item-art{width:135px;height:135px}.avatar{width:125px;height:215px;top:70%;left:50%;filter:drop-shadow(0 8px 3px #61381925)}.character-art{display:block;position:absolute;inset:0;background-image:url('avatars-v3.png');background-size:200% 200%;background-position:calc(var(--col)*100%) calc(var(--row)*100%);background-repeat:no-repeat;pointer-events:none}.wearable{position:absolute;pointer-events:none;z-index:2;left:50%;transform:translateX(-50%)}.wear-hat{top:-5%;width:86px;height:86px}.wear-hat .item-art{width:86px;height:86px}.wear-shirt{top:39%;width:73px;height:73px}.wear-shirt .item-art{width:73px;height:73px}.wear-accessory{top:12%;width:72px;height:72px}.wear-accessory .item-art{width:72px;height:72px}.pet{width:75px;height:85px;padding:0;left:69%;top:77%;font-size:0}.pet img{width:100%;height:100%;object-fit:contain;pointer-events:none;filter:drop-shadow(0 5px 2px #61381925)}.illustrated-buddy{position:relative;width:90px;height:140px;margin:0 auto}.illustrated-buddy .wear-hat,.illustrated-buddy .wear-hat .item-art{width:60px;height:60px}.illustrated-buddy .wear-shirt,.illustrated-buddy .wear-shirt .item-art{width:51px;height:51px}.illustrated-buddy .wear-accessory,.illustrated-buddy .wear-accessory .item-art{width:50px;height:50px}.puzzle .equation{margin:15px 0;font-size:46px}.puzzle{padding:15px}.math-buddy{margin-bottom:0}.keypad{margin:16px auto}.keypad button{padding:12px}.preview-icon{font-size:0}.room .avatar:focus-visible{outline:3px solid #ffd064;border-radius:20px}button:active:not(:disabled){transform:scale(.95) translateY(3px)}@media(min-width:600px){.room{aspect-ratio:3/4;max-height:640px}.shop-grid{grid-template-columns:repeat(3,1fr)}}@media(max-width:360px){.avatar{width:110px;height:190px}.product .item-art{width:85px;height:85px}.primary,.secondary{font-size:15px;padding:15px 12px}}
@media(max-width:599px){#room{height:clamp(340px,calc(100dvh - 285px),580px);aspect-ratio:auto}.app>header{margin-bottom:12px}#main>p{margin:6px 0 12px;font-size:15px}}.wear-accessory{top:16%}.wear-shirt{top:40%}
/* V4: the complete earn-coins interaction fits the available phone viewport. */
body.earning-screen{overflow:hidden}.earning-screen .app{height:100dvh;min-height:0;display:flex;flex-direction:column;padding:10px 14px calc(84px + env(safe-area-inset-bottom));overflow:hidden}.earning-screen header{flex-shrink:0;margin-bottom:8px}.earning-screen header h1{font-size:25px}.earning-screen header small{font-size:12px}.earning-screen header .coins{padding:8px 12px}.earning-screen #main{flex:1;min-height:0;display:flex;flex-direction:column;gap:7px}.earning-screen #main>h2{font-size:21px;line-height:1.15;margin:0}.earning-screen #main>p,.earning-screen #main>.goal{display:none}.earning-screen .settings{margin:0;flex-shrink:0;gap:6px}.earning-screen .settings .chip{padding:8px 10px;font-size:14px}.earning-screen .puzzle{margin:0;min-height:0;flex:1;display:flex;flex-direction:column;padding:12px;box-shadow:0 3px #e7c999}.earning-screen .math-buddy,.earning-screen .dots{display:none}.earning-screen .puzzle>.row{font-size:14px;flex-shrink:0;gap:6px}.earning-screen .equation{font-size:clamp(32px,7dvh,48px);line-height:1.1;margin:8px 0;flex-shrink:0}.earning-screen .answer{font-size:27px;padding:5px;width:130px;line-height:1.2;flex-shrink:0}.earning-screen .feedback{font-size:14px;line-height:1.3;min-height:36px;margin:6px 0 0;flex-shrink:0;display:flex;align-items:center;justify-content:center}.earning-screen .keypad{flex:1;min-height:0;width:100%;max-width:350px;grid-template-rows:repeat(4,minmax(0,1fr));gap:7px;margin:7px auto 9px}.earning-screen .keypad button{padding:0;font-size:22px;min-height:0;box-shadow:0 2px #d9b476}.earning-screen #hint{padding:7px 12px;align-self:center;flex-shrink:0}.earning-screen #next{margin:auto 0;padding:14px}.earning-screen .celebrate{flex:1;min-height:0;display:flex;flex-direction:column;justify-content:center;padding:10px}.earning-screen .celebrate .big{height:110px;width:75px;flex-shrink:0}.earning-screen .celebrate p{margin:6px 0;font-size:15px}.earning-screen .celebrate .reward{margin:8px 0;font-size:30px}.earning-screen .completed-stars{margin-bottom:6px;font-size:25px}.earning-screen .celebrate .actions{margin:10px 0}.earning-screen nav{padding-top:7px;padding-bottom:max(7px,env(safe-area-inset-bottom))}.earning-screen nav button{padding:4px}.earning-screen nav span{margin-top:3px}@media(max-height:650px){.earning-screen .app{padding-top:7px}.earning-screen header{margin-bottom:5px}.earning-screen .puzzle{padding:8px}.earning-screen .equation{margin:4px 0;font-size:32px}.earning-screen .feedback{min-height:32px;margin-top:3px}.earning-screen #main{gap:5px}.earning-screen .keypad{gap:5px;margin:5px auto 7px}.earning-screen .settings .chip{padding:6px 9px}.earning-screen .celebrate .big{height:80px;width:55px}.earning-screen .celebrate p{margin:3px 0}.earning-screen .celebrate .actions button{padding:10px;font-size:15px}}@media(orientation:landscape) and (max-height:500px){.earning-screen header small,.earning-screen #main>h2{display:none}.earning-screen header h1{font-size:20px;margin:0}.earning-screen .puzzle{display:grid;grid-template-columns:1fr 1fr;grid-template-rows:auto 1fr auto auto;column-gap:16px}.earning-screen .puzzle>.row{grid-column:1/-1}.earning-screen .equation{grid-column:1;grid-row:2;align-self:center}.earning-screen .answer{grid-column:1;grid-row:3}.earning-screen .feedback{grid-column:1;grid-row:4}.earning-screen .keypad{grid-column:2;grid-row:2/5;margin:4px 0;min-height:0}.earning-screen #hint{grid-column:1;grid-row:5}.earning-screen #next{grid-column:2;grid-row:2/5}.earning-screen .app{padding-bottom:74px}.earning-screen nav button{font-size:18px}}
.earning-screen .keypad button[data-key="✓"]{background:#50b970;color:#fff;border:2px solid #2b8446;box-shadow:inset 0 2px #8bd79d,0 3px #2b8446;font-size:30px}.earning-screen .keypad button:disabled{opacity:.65;cursor:default}
/* V6: tangible, clearly clickable bottom navigation. */
nav{gap:10px;padding:10px 12px max(12px,env(safe-area-inset-bottom));align-items:stretch}nav button{width:auto;flex:1;background:linear-gradient(#fff8e8,#ffe5b6);border:2px solid #c69a60;border-radius:16px;color:#80522f;box-shadow:inset 0 2px #fff,0 4px #b3814a;padding:8px 5px;min-height:58px;font-size:22px}nav button.active{background:linear-gradient(#73d3d5,#3ca4aa);border-color:#277b80;color:#123f48;box-shadow:inset 0 2px #b4eeee,0 4px #236e77}nav button:active:not(:disabled){transform:translateY(3px) scale(.98);box-shadow:inset 0 2px #fff6,0 1px #b3814a}nav span{font-weight:bold;font-size:14px;margin-top:4px}.earning-screen nav{gap:10px;padding:8px 12px max(10px,env(safe-area-inset-bottom))}.earning-screen nav button{padding:6px 4px;min-height:56px}.earning-screen .app{padding-bottom:calc(91px + env(safe-area-inset-bottom))}@media(orientation:landscape) and (max-height:500px){.earning-screen nav button{min-height:45px;padding:3px}.earning-screen nav span{font-size:13px}.earning-screen .app{padding-bottom:calc(78px + env(safe-area-inset-bottom))}}
/* V7: the room shares the available viewport with controls and navigation. */
body.room-screen{overflow:hidden}.room-screen .app{height:100dvh;min-height:0;display:flex;flex-direction:column;overflow:hidden;padding:10px 14px calc(94px + env(safe-area-inset-bottom))}.room-screen header{flex-shrink:0;margin-bottom:10px}.room-screen #main{min-height:0;flex:1;display:flex;flex-direction:column;gap:10px}.room-screen #main>.row{flex-shrink:0;gap:8px}.room-screen #main>.row h2{font-size:21px;margin:0;line-height:1.2}.room-screen #look{flex-shrink:0;padding:8px 10px;font-size:14px}.room-screen #main>p{display:none}.room-screen #room{flex:1;width:100%;height:auto;min-height:0;max-height:none;aspect-ratio:auto;background-size:cover;background-position:center;border-radius:22px}.room-screen .hint{flex-shrink:0;margin:0;font-size:14px;line-height:1.3;color:#795331}.room-screen .avatar{height:clamp(135px,27dvh,215px);width:clamp(79px,15.7dvh,125px)}.room-screen .pet{height:clamp(55px,10.6dvh,85px);width:clamp(49px,9.4dvh,75px)}@media(max-height:650px){.room-screen header{margin-bottom:7px}.room-screen h1{font-size:25px}.room-screen .coins{padding:8px 12px}.room-screen #main{gap:7px}.room-screen .room-label{font-size:13px;padding:6px 10px;top:10px;left:10px}.room-screen .hint{font-size:13px}.room-screen .room-item .item-art{width:65px;height:65px}.room-screen .wear-hat,.room-screen .wear-hat .item-art{width:60px;height:60px}.room-screen .wear-shirt,.room-screen .wear-shirt .item-art{width:51px;height:51px}.room-screen .wear-accessory,.room-screen .wear-accessory .item-art{width:50px;height:50px}}@media(orientation:landscape) and (max-height:500px){.room-screen header small,.room-screen .hint{display:none}.room-screen header{margin-bottom:4px}.room-screen h1{font-size:20px}.room-screen #main{gap:4px}.room-screen #main>.row h2{font-size:17px}.room-screen #look{padding:4px 9px}.room-screen .avatar{height:100px;width:58px}.room-screen .pet{height:48px;width:43px}.room-screen .room-item .item-art{width:50px;height:50px}}
/* V8: three difficulty choices stay on one row on phones. */
.earning-screen .settings{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:5px}.earning-screen .settings .chip{padding:8px 3px;font-size:clamp(11px,3.3vw,14px);white-space:nowrap}

/* V9: clear, gentle incorrect-answer feedback. */
.earning-screen .answer.wrong{border-color:#d4544c;background:#fff0ee;color:#a33832;box-shadow:0 0 0 2px #e37c7030}.earning-screen .feedback.wrong-feedback{color:#a33832}
