:root{color-scheme:light;font-family:ui-rounded,Nunito,Arial Rounded MT Bold,system-ui,sans-serif;font-synthesis:none;text-rendering:optimizeLegibility;--ink: #543d52;--cream: #fff3d6;--pink: #ff8eaa;--purple: #9d83dc;--green: #7bcf8d;--shadow: 0 8px 0 rgb(113 71 107 / 13%), 0 14px 26px rgb(82 54 91 / 12%);--safe-top: env(safe-area-inset-top, 0px);--safe-right: env(safe-area-inset-right, 0px);--safe-bottom: env(safe-area-inset-bottom, 0px);--safe-left: env(safe-area-inset-left, 0px)}*{box-sizing:border-box}html,body,#app{width:100%;height:100%;min-height:100%;margin:0}body{overflow:hidden;background:var(--cream);color:var(--ink);-webkit-tap-highlight-color:transparent}button{color:inherit;font:inherit;-webkit-appearance:none;appearance:none;touch-action:manipulation}button:focus-visible{outline:4px solid #51419a;outline-offset:4px}.app-root{position:fixed;inset:0;overflow:hidden;isolation:isolate}.scene{position:absolute;inset:0;overflow:hidden;padding:calc(18px + var(--safe-top)) calc(18px + var(--safe-right)) calc(18px + var(--safe-bottom)) calc(18px + var(--safe-left))}.scene:before{position:absolute;inset:0;z-index:-1;content:"";background:radial-gradient(ellipse at 50% 18%,#fffdf1 0,transparent 52%),linear-gradient(160deg,#fff7df,#e9f9e9 86%)}.btn-candy{border:0;border-radius:28px;background:linear-gradient(180deg,#ffb0c2,#ff7e9e);box-shadow:0 8px #d95678,0 13px 22px #d9567838;color:#fff;font-weight:900;cursor:pointer}.btn-candy:active,.chrome-btn:active,.home-card:active,.garden-tray-btn:active{transform:translateY(4px) scale(.97)}@media(prefers-reduced-motion:reduce){*,*:before,*:after{scroll-behavior:auto!important;animation-duration:.01ms!important;animation-iteration-count:1!important;transition-duration:.01ms!important}}.top-bar{position:absolute;z-index:20;top:calc(16px + var(--safe-top));left:calc(16px + var(--safe-left));right:calc(16px + var(--safe-right));display:flex;align-items:center;justify-content:space-between;pointer-events:none}.top-bar>*{pointer-events:auto}.chrome-btn{display:grid;place-items:center;width:clamp(56px,10vw,76px);height:clamp(56px,10vw,76px);border:3px solid white;border-radius:24px;background:#fff9;box-shadow:var(--shadow);font-size:clamp(28px,5vw,42px);cursor:pointer;transition:transform .12s ease}.star-badge{display:flex;align-items:center;gap:8px;min-width:88px;padding:9px 17px;border:3px solid white;border-radius:24px;background:#fff9;box-shadow:var(--shadow);font-size:clamp(20px,4vw,30px);font-weight:900}.star-badge-icon{filter:drop-shadow(0 2px 1px #cf9a36)}.scene-home .top-bar.has-stars .star-badge{position:absolute;left:82px}.home-top-right{position:absolute;z-index:20;top:calc(18px + var(--safe-top));right:calc(20px + var(--safe-right));display:flex;gap:10px}.home-top-right .parent-btn,.home-top-right .sound-btn{width:58px;height:58px;font-size:27px}.confetti-piece{position:absolute;z-index:80;border-radius:3px;pointer-events:none;animation:confetti-fly .75s cubic-bezier(.12,.7,.25,1) forwards}@keyframes confetti-fly{to{transform:translate3d(var(--tx),var(--ty),0) rotate(var(--rot)) scale(.3);opacity:0}}.celebrate-overlay{position:absolute;z-index:70;inset:0;pointer-events:none;overflow:hidden}.celebrate-star{position:absolute;top:110%;font-size:clamp(34px,8vw,68px);animation:star-float 1.6s ease-out forwards}@keyframes star-float{to{top:12%;transform:rotate(28deg) scale(1.3);opacity:0}}.scene-splash{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:clamp(14px,3vh,28px);text-align:center}.splash-sun{font-size:clamp(64px,13vw,118px);animation:bob 2.4s ease-in-out infinite}.splash-title{color:#6d55aa;font-size:clamp(38px,8vw,76px);font-weight:1000;letter-spacing:-.04em;text-shadow:0 4px white}.splash-sub{color:#967b99;font-size:clamp(17px,3vw,25px);font-weight:800;letter-spacing:.1em;text-transform:uppercase}.splash-toys{display:flex;gap:clamp(14px,4vw,34px);font-size:clamp(40px,9vw,76px)}.splash-start{display:flex;align-items:center;gap:12px;min-width:180px;padding:16px 30px;font-size:29px;cursor:pointer}.splash-start-emoji{font-size:38px}.scene-home{display:grid;place-items:center}.home-content{width:min(780px,100%);padding-top:45px}.home-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:clamp(14px,3vw,28px)}.home-card{display:flex;min-height:clamp(150px,29vh,250px);flex-direction:column;align-items:center;justify-content:center;gap:8px;border:5px solid #fff;border-radius:34px;box-shadow:var(--shadow);cursor:pointer;animation:card-enter .55s both cubic-bezier(.2,.8,.2,1);transition:transform .12s ease}.card-pop{background:linear-gradient(145deg,#d9f7ff,#a3e8f4)}.card-paint{background:linear-gradient(145deg,#ffe2e8,#ffb9cd)}.card-mix{background:linear-gradient(145deg,#f0e7ff,#c9b2f3)}.card-garden{background:linear-gradient(145deg,#e1f8d9,#a9e2a6)}.home-card-emoji{font-size:clamp(50px,10vw,92px);line-height:1;filter:drop-shadow(0 6px 2px #664d4920)}.home-card-label{color:#594367;font-size:clamp(24px,5vw,42px);font-weight:950}.home-grass{display:flex;justify-content:center;gap:30px;margin-top:18px;font-size:clamp(24px,5vw,42px);opacity:.86}@keyframes card-enter{0%{opacity:0;transform:translateY(22px) scale(.95)}to{opacity:1;transform:none}}@keyframes bob{50%{transform:translateY(-10px) rotate(6deg)}}.scene-parents{display:grid;place-items:center;overflow-y:auto}.parents-panel{width:min(560px,100%);max-height:100%;overflow-y:auto;padding:clamp(22px,5vw,38px);border:4px solid white;border-radius:32px;background:#fffdf4ed;box-shadow:var(--shadow)}.parents-title{margin-bottom:24px;color:#7259a8;font-size:clamp(29px,6vw,42px);font-weight:950;text-align:center}.parents-row{display:flex;width:100%;min-height:70px;align-items:center;gap:16px;margin:10px 0;padding:12px 16px;border:2px solid #eee4f0;border-radius:20px;background:#fff;text-align:left;cursor:pointer}.parents-row-icon{font-size:29px}.parents-row-label{flex:1;font-size:18px;font-weight:800}.toggle-track{width:58px;height:34px;padding:4px;border-radius:30px;background:#c7c0c9;transition:background .18s}.toggle-track.is-on{background:#79cb88}.toggle-knob{display:block;width:26px;height:26px;border-radius:50%;background:#fff;box-shadow:0 1px 4px #0003;transition:transform .18s}.toggle-track.is-on .toggle-knob{transform:translate(24px)}.parents-row-danger{color:#a84e59}.parents-row-danger.is-armed{border-color:#ed7081;background:#fff0f1}.parents-note{margin:22px 4px;color:#736979;font-size:14px;line-height:1.55}.parents-note h2{margin:18px 0 5px;color:#66518a;font-size:17px}.parents-note p{margin:0}.parents-done{display:block;width:100%;padding:13px;font-size:21px;cursor:pointer}.gate-panel{display:flex;flex-direction:column;align-items:center;text-align:center}.gate-ring{display:grid;width:164px;height:164px;place-items:center;margin:5px auto 22px;border-radius:50%;background:conic-gradient(#8f75d0 calc(var(--gate-progress, 0) * 1turn),#eee7f4 0)}.gate-ring-inner{display:grid;width:142px;height:142px;place-items:center;border-radius:50%;background:#fffdf4;font-size:58px}.gate-hold{width:100%;min-height:66px;border:0;border-radius:22px;background:#9c80d1;box-shadow:0 6px #7457a7;color:#fff;font-size:21px;font-weight:900;touch-action:none}.gate-hint{color:#877c89}.scene-pop{background:linear-gradient(#b9eafa,#e8fbff 72%,#c8edbe)}.pop-layer{position:absolute;inset:100px 0 65px;overflow:hidden;touch-action:manipulation}.bubble{position:absolute;top:0;left:0;border:2px solid;border-radius:50%;box-shadow:inset -8px -10px 17px #fff4,inset 7px 6px 12px #fff9,0 7px 10px #567d8020;will-change:transform;cursor:pointer}.bubble:after{position:absolute;top:18%;left:22%;width:25%;height:14%;border-radius:50%;background:#fff9;content:"";transform:rotate(-35deg)}.bubble-popped{animation:pop-away .28s ease-out forwards}@keyframes pop-away{to{opacity:0;scale:1.6}}.tap-ripple{position:absolute;width:24px;height:24px;border:4px solid #fff9;border-radius:50%;transform:translate(-50%,-50%);animation:ripple .45s ease-out forwards;pointer-events:none}@keyframes ripple{to{width:86px;height:86px;opacity:0}}.scene-grass{position:absolute;right:0;bottom:0;left:0;height:52px;background:linear-gradient(#8bd989,#70c879);border-radius:50% 50% 0 0/22% 22% 0 0}.scene-paint{display:flex;flex-direction:column;padding-bottom:calc(14px + var(--safe-bottom));background:#fff9ec}.paint-canvas{position:absolute;inset:100px 12px calc(124px + var(--safe-bottom));width:calc(100% - 24px);height:calc(100% - 224px - var(--safe-bottom));border:4px dashed #e3d9ed;border-radius:28px;background:#fffffff0;touch-action:none}.paint-toolbar{position:absolute;right:12px;bottom:calc(12px + var(--safe-bottom));left:12px;display:flex;flex-wrap:wrap;align-items:center;justify-content:center;gap:6px 10px;min-height:106px;padding:8px;border:3px solid white;border-radius:25px;background:#fff9;box-shadow:var(--shadow)}.paint-tools-group{display:flex;align-items:center;justify-content:center;gap:clamp(4px,1.4vw,12px)}.paint-tools-group:first-child{width:100%}.paint-swatch,.paint-dot,.paint-clear{display:grid;width:clamp(42px,8vw,62px);height:clamp(42px,8vw,62px);place-items:center;border:3px solid white;border-radius:50%;background:#f4eefa;box-shadow:0 3px 8px #47354b28;font-size:23px;cursor:pointer}.paint-swatch.is-active,.paint-dot.is-active{outline:4px solid #7054aa;outline-offset:2px}.swatch-red{background:#faa}.swatch-yellow{background:#fff0a0}.swatch-blue{background:#a8ceff}.swatch-green{background:#b7ebad}.swatch-rainbow{background:linear-gradient(135deg,#ff8a8a,#ffd36f,#91dc9d,#8ac2ff,#c39aff)}.paint-dot{border:0;background:#eee7f4}.dot-s:after,.dot-m:after,.dot-l:after{width:10px;height:10px;border-radius:50%;background:#604e6a;content:""}.dot-m:after{width:19px;height:19px}.dot-l:after{width:30px;height:30px}.paint-clear{border-radius:19px}.paint-clearing{animation:clear-flash .24s ease}@keyframes clear-flash{50%{opacity:.35}}.scene-mix{background:linear-gradient(160deg,#f2e9ff,#fff4df 70%,#e8f7ee)}.mix-stage{position:absolute;inset:110px 10px 190px;display:flex;flex-direction:column;align-items:center;justify-content:center}.mix-slots{display:flex;gap:24px;margin-bottom:15px}.mix-slot{width:clamp(48px,11vw,78px);height:clamp(48px,11vw,78px);border:4px dashed #b6a7c4;border-radius:50%;background:#fff9;transition:background .3s,transform .3s}.mix-slot.is-filled{border-style:solid;transform:scale(1.08)}.mix-blob{display:grid;width:clamp(150px,38vw,260px);aspect-ratio:1;place-items:center;border:5px solid #fff;border-radius:43% 57% 62% 38%/47% 43% 57% 53%;background:#f9b0ca;box-shadow:0 14px 30px #614e6825;transition:background .45s,transform .4s}.blob-body{position:relative;width:100%;height:100%}.blob-eye{position:absolute;top:40%;width:13px;height:19px;border-radius:50%;background:#523f56}.blob-eye-l{left:38%}.blob-eye-r{right:38%}.blob-smile{position:absolute;top:51%;left:45%;width:26px;height:13px;border-bottom:4px solid #523f56;border-radius:0 0 50% 50%}.blob-cheek{position:absolute;top:52%;width:22px;height:12px;border-radius:50%;background:#ffb2baaa}.blob-cheek-l{left:27%}.blob-cheek-r{right:27%}.mix-result{min-height:48px;margin-top:15px;color:#66508b;font-size:clamp(23px,5vw,38px);font-weight:950;opacity:0;transform:translateY(8px);transition:.25s}.mix-result.is-shown{opacity:1;transform:none}.blob-mixing{animation:blob-spin .62s ease-in-out}.blob-bounce{animation:blob-bounce .42s cubic-bezier(.2,1.5,.5,1)}.blob-squash{animation:blob-squash .26s ease-out}@keyframes blob-spin{50%{transform:rotate(180deg) scale(.82,1.12);border-radius:50%}}@keyframes blob-bounce{45%{transform:scale(1.14,.88)}}@keyframes blob-squash{45%{transform:scale(1.13,.88)}}.mix-buckets{position:absolute;right:12px;bottom:calc(24px + var(--safe-bottom));left:12px;display:flex;justify-content:center;gap:clamp(10px,4vw,28px)}.mix-bucket{display:flex;width:clamp(66px,15vw,104px);height:clamp(80px,17vw,118px);flex-direction:column;align-items:center;justify-content:space-between;padding:7px;overflow:hidden;border:4px solid white;border-radius:22px 22px 28px 28px;box-shadow:var(--shadow);cursor:pointer}.bucket-red{background:#f99}.bucket-yellow{background:#ffe990}.bucket-blue{background:#91b8ff}.bucket-white{background:#fff}.mix-bucket-emoji{font-size:clamp(25px,6vw,40px)}.mix-bucket-fill{width:100%;height:28%;border-radius:50% 50% 12px 12px;background:#ffffff60}.mix-reset{position:absolute;right:calc(18px + var(--safe-right));bottom:calc(142px + var(--safe-bottom));width:52px;height:52px;border:3px solid white;border-radius:18px;background:#ffffffc9;box-shadow:var(--shadow);font-size:30px;cursor:pointer}.scene-garden{background:linear-gradient(#c9f0ff,#eaffff 62%,#d8f1c8)}.garden-layer{position:absolute;inset:96px 0 116px;overflow:hidden;touch-action:none}.garden-ground{position:absolute;right:0;bottom:96px;left:0;display:flex;height:65px;align-items:center;justify-content:space-around;border-radius:50% 50% 0 0/30% 30% 0 0;background:#86d37e;font-size:35px;pointer-events:none}.garden-deco:nth-child(2n){transform:translateY(-8px)}.garden-sticker{position:absolute;top:0;left:0;display:grid;place-items:center;filter:drop-shadow(0 5px 3px #4e55452a);cursor:grab;touch-action:none;user-select:none}.sticker-pop{animation:sticker-in .3s cubic-bezier(.2,1.5,.5,1) both}.sticker-wiggle{animation:wiggle .35s ease-in-out}.sticker-fly{animation:sticker-fly .6s ease-in forwards}@keyframes sticker-in{0%{scale:.2;opacity:0}to{scale:1;opacity:1}}@keyframes wiggle{25%{rotate:-12deg}75%{rotate:12deg}}@keyframes sticker-fly{to{translate:var(--fly-x) -180px;rotate:35deg;scale:.35;opacity:0}}.garden-tray{position:absolute;right:12px;bottom:calc(12px + var(--safe-bottom));left:12px;display:flex;justify-content:center;gap:clamp(4px,2vw,14px);padding:8px;border:3px solid white;border-radius:25px;background:#fff9;box-shadow:var(--shadow)}.garden-tray-btn{display:grid;width:clamp(46px,10vw,68px);height:clamp(46px,10vw,68px);place-items:center;border:0;border-radius:20px;background:#fff;box-shadow:0 4px 8px #514b5220;font-size:clamp(25px,5vw,39px);cursor:pointer;transition:transform .12s}.garden-broom{position:absolute;right:calc(20px + var(--safe-right));bottom:calc(104px + var(--safe-bottom));width:58px;height:58px;border:3px solid white;border-radius:19px;background:#fff9;box-shadow:var(--shadow);font-size:30px;cursor:pointer}@media(min-width:760px){.home-content{width:min(900px,84vw)}.home-card{min-height:min(31vh,280px)}.paint-canvas{right:max(30px,calc((100vw - 900px)/2));left:max(30px,calc((100vw - 900px)/2));width:auto}.paint-toolbar{width:min(720px,calc(100% - 40px));right:50%;left:auto;flex-wrap:nowrap;transform:translate(50%)}.paint-tools-group:first-child{width:auto}.mix-buckets{bottom:28px}.mix-stage{bottom:180px}}@media(max-height:600px){.home-content{padding-top:54px}.home-card{min-height:130px}.home-grass{display:none}.paint-toolbar{min-height:62px}.paint-swatch,.paint-dot,.paint-clear{width:44px;height:44px}.mix-stage{inset-block:84px 145px}.mix-blob{width:140px}.garden-layer{bottom:98px}.garden-ground{bottom:78px}}.paint-canvas{bottom:calc(144px + var(--safe-bottom));height:calc(100% - 244px - var(--safe-bottom))}.paint-toolbar{min-height:126px;flex-wrap:wrap;gap:5px 8px}.paint-tools-group.paint-palette,.paint-tools-group.paint-actions{width:100%;justify-content:flex-start;overflow-x:auto;overflow-y:hidden;scrollbar-width:thin}.paint-swatch,.paint-dot,.paint-tool,.paint-clear{flex:0 0 clamp(42px,8vw,62px)}.paint-tool{display:grid;width:clamp(42px,8vw,62px);height:clamp(42px,8vw,62px);place-items:center;border:3px solid white;border-radius:50%;background:#eee7f4;box-shadow:0 3px 8px #47354b28;font-size:23px;cursor:pointer}.paint-tool.is-active{outline:4px solid #7054aa;outline-offset:2px}.swatch-orange{background:#ffc17e}.swatch-pink{background:#ffbdd8}.swatch-purple{background:#ccb6ff}.mix-buckets{justify-content:flex-start;overflow-x:auto;padding:8px 10px 12px;scrollbar-width:thin;scroll-snap-type:x proximity}.mix-bucket{flex:0 0 clamp(66px,15vw,104px);scroll-snap-align:center;transition:transform .2s cubic-bezier(.2,1.4,.4,1),box-shadow .2s}.mix-bucket.is-selected{transform:translateY(-10px) scale(1.06);box-shadow:0 0 0 4px #fff,0 10px 24px #735a9c44}.bucket-orange{background:#ffad63}.bucket-green{background:#9de0aa}.garden-tray{justify-content:flex-start;overflow-x:auto;scrollbar-width:thin;scroll-snap-type:x proximity}.garden-tray-btn{flex:0 0 clamp(46px,10vw,68px);scroll-snap-align:center}.mix-instruction{min-height:34px;margin-bottom:8px;color:#73599a;font-size:clamp(18px,4vw,26px);font-weight:900;text-align:center;animation:instruction-in .25s ease-out both}.star-badge.star-earned{animation:star-earned .42s cubic-bezier(.2,1.6,.4,1)}.garden-tray:after{position:absolute;top:0;right:0;bottom:0;display:grid;width:30px;place-items:center;border-radius:0 22px 22px 0;background:linear-gradient(90deg,transparent,#fffde9eF 45%);color:#73599a;content:"›";font-size:32px;font-weight:900;pointer-events:none}@keyframes instruction-in{0%{translate:0 8px;opacity:.4}to{translate:0 0;opacity:1}}@keyframes star-earned{40%{scale:1.24;rotate:-5deg}72%{scale:.94;rotate:3deg}}.bubble-born{animation:bubble-in .34s cubic-bezier(.18,1.5,.35,1) both}.bubble-bonus{box-shadow:inset -8px -10px 17px #fff6,inset 7px 6px 12px #fff,0 0 0 3px #ffdd6b88,0 0 24px #ffc83d99}.bubble-star{position:absolute;inset:0;display:grid;place-items:center;font-size:30px;filter:drop-shadow(0 2px 2px #9c6b2780);animation:star-twinkle .8s ease-in-out infinite alternate}.bubble-bonus:after{display:none}.pop-reward{position:absolute;z-index:10;color:#986200;font-size:28px;font-weight:1000;text-shadow:0 2px white,0 4px #fff9;pointer-events:none;transform:translate(-50%,-50%);animation:reward-rise .9s cubic-bezier(.18,.8,.28,1) forwards}@keyframes bubble-in{0%{scale:.35;opacity:.3}to{scale:1;opacity:1}}@keyframes star-twinkle{to{scale:1.18;rotate:8deg}}@keyframes reward-rise{to{translate:0 -72px;scale:1.24;opacity:0}}button{transition:translate .12s ease,scale .12s ease,filter .12s ease}button:active{translate:0 3px;scale:.96;filter:saturate(1.15)}@media(min-width:760px){.paint-canvas{bottom:calc(144px + var(--safe-bottom))}.paint-toolbar{flex-wrap:wrap}.mix-buckets{width:min(760px,calc(100% - 24px));right:50%;left:auto;transform:translate(50%)}}@media(max-height:600px){.paint-canvas{bottom:calc(132px + var(--safe-bottom));height:calc(100% - 232px - var(--safe-bottom))}.paint-toolbar{min-height:116px;padding:6px;gap:4px}.paint-swatch,.paint-dot,.paint-tool,.paint-clear{flex-basis:38px;width:38px;height:38px;font-size:19px}}@media(max-width:759px){.paint-palette,.paint-actions{mask-image:linear-gradient(90deg,#000 0,#000 calc(100% - 25px),transparent)}.mix-instruction:after{color:#967ca9;content:" · ↔ swipe";font-size:.68em;white-space:nowrap}}
