:root{--paper:#fbf3e6;--ink:#46352b;--rose:#c94f76;--gold:#b8923f;--gold-light:#f8d16b;--leaf:#7fbf7b;--leaf-deep:#5f9e4d;--sky:#cfe8f2;--card:#fffdf8;--focus:#2d5a7b}*{box-sizing:border-box}html,body{background:var(--paper);min-height:100%;color:var(--ink);-webkit-tap-highlight-color:transparent;margin:0;padding:0;font-family:Nunito,Segoe UI,Poppins,system-ui,-apple-system,sans-serif}#app{flex-direction:column;min-height:100vh;display:flex}.screen{flex-direction:column;flex:1;padding:.75rem;display:flex}button{cursor:pointer;font-family:inherit}:focus-visible{outline:3px solid var(--focus);outline-offset:2px}.start-screen{flex:1;justify-content:center;align-items:center;display:flex}.start-frame{background:var(--card);border:3px solid var(--gold);text-align:center;border-radius:28px;width:min(560px,100%);padding:1.5rem 1.25rem 2rem;overflow:hidden;box-shadow:0 10px 30px #b8923f33}.start-title{color:var(--rose);letter-spacing:.02em;margin:0;font-size:2.6rem}.start-subtitle{opacity:.85;margin:.4rem 0 1.2rem;font-size:1.05rem}.album{background:var(--paper);border:2px dashed var(--gold);border-radius:18px;margin-bottom:1.25rem;padding:.75rem}.album__title{color:var(--gold);margin:0 0 .5rem;font-size:1.1rem}.album__shelf{flex-wrap:wrap;justify-content:center;align-items:center;gap:.6rem;min-height:96px;display:flex}.album__empty{opacity:.7;margin:0;font-size:.95rem}.album__sticker{background:0 0;border:none;border-radius:16px;padding:.25rem;transition:transform .15s}.album__sticker:hover{transform:scale(1.08)rotate(-3deg)}.big-button{background:var(--rose);color:#fff;border:none;border-radius:22px;min-width:min(280px,80vw);min-height:72px;padding:.9rem 1.6rem;font-size:1.45rem;font-weight:700;transition:transform .12s,box-shadow .12s;box-shadow:0 6px #a03a5d}.big-button:active{transform:translateY(4px);box-shadow:0 2px #a03a5d}.start-button{width:100%}.screen--play{gap:.5rem;padding:.5rem}.book{perspective:1400px;flex:1;min-height:420px;position:relative}.stage-slot{position:absolute;inset:0}.page{background:var(--card);border:3px solid var(--gold-light);transform-origin:0;backface-visibility:hidden;border-radius:24px;flex-direction:column;display:flex;position:absolute;inset:0;overflow:hidden;box-shadow:0 12px 34px #b8923f2e}.page--flip-in{animation:.7s forwards page-in}.page--flip-out{animation:.7s forwards page-out}@keyframes page-in{0%{opacity:.35;transform:rotateY(28deg)}to{opacity:1;transform:rotateY(0)}}@keyframes page-out{0%{opacity:1;transform:rotateY(0)}to{opacity:.15;transform:rotateY(-88deg)}}.stage{touch-action:pan-y;flex:1;min-height:300px;position:relative;overflow:hidden}.parallax,.bg-layer{position:absolute;inset:0}.bg-layer{will-change:transform;transition:transform .2s ease-out}.bg-layer svg{width:110%;height:100%;position:absolute;bottom:0;left:-5%}.bg-layer--far svg{top:0}.bg-layer--mid svg{height:auto;bottom:96px}.bg-layer--near svg{height:40%}.scenery{position:absolute;inset:0}.actors,.actor,.prop{pointer-events:none}.actor svg,.prop svg{pointer-events:visiblePainted}.prop{position:absolute}.scenery__tree{width:min(48%,340px);bottom:12%;right:1%}.scenery__tree svg,.scenery__basket svg,.scenery__water svg,.scenery__fruits svg{width:100%;height:auto;display:block}.scenery__basket{width:min(26%,150px);bottom:14%;left:6%}.scenery__water{width:min(20%,120px);bottom:13%;left:4%}.scenery__fruits{width:min(100%,460px);bottom:30%;left:50%;transform:translate(-50%)}.fruit-hit{cursor:pointer}.actors{pointer-events:none;justify-content:center;align-items:flex-end;gap:2%;display:flex;position:absolute;bottom:6%;left:0;right:0}.actor{pointer-events:auto;width:clamp(96px,24vw,170px);transition:transform .15s;position:relative}.actor svg{width:100%;height:auto;display:block}.char-idle-toto,.char-idle-nana{animation:3.4s ease-in-out infinite breathe}.char-idle-lili,.char-idle-momo{animation:3s ease-in-out infinite bob}@keyframes breathe{0%,to{transform:scale(1)}50%{transform:scale(1.025)}}@keyframes bob{0%,to{transform:translateY(0)}50%{transform:translateY(-6px)}}.char-eyes{transform-box:fill-box;transform-origin:50%;animation:4.6s infinite blink}@keyframes blink{0%,93%,to{transform:scaleY(1)}96%{transform:scaleY(.12)}}.reaction-giggle{animation:.85s giggle}@keyframes giggle{0%,to{transform:translateY(0)rotate(0)}25%{transform:translateY(-14px)rotate(-6deg)}55%{transform:translateY(-6px)rotate(5deg)}80%{transform:translateY(-10px)rotate(-3deg)}}.reaction-spin{animation:.8s spin-around}@keyframes spin-around{0%{transform:rotate(0)scale(1)}50%{transform:rotate(180deg)scale(1.08)}to{transform:rotate(360deg)scale(1)}}.actor__bubble{border:2px solid var(--rose);color:var(--rose);z-index:3;background:#fff;border-radius:14px;padding:.25rem .55rem;font-size:.95rem;font-weight:800;animation:.25s bubble-pop;position:absolute;top:-14px;right:-6px}@keyframes bubble-pop{0%{opacity:0;transform:scale(.4)}to{opacity:1;transform:scale(1)}}.target-glow{filter:drop-shadow(0 0 10px #f8d16b)}.target-glow:after{content:"";border:4px dashed var(--gold);pointer-events:none;border-radius:20px;animation:1.6s ease-in-out infinite target-pulse;position:absolute;inset:4%}.target-glow--strong:after{border-color:var(--rose);animation-duration:.7s}@keyframes target-pulse{0%,to{opacity:.35;transform:scale(.97)}50%{opacity:.95;transform:scale(1.03)}}.count-fruit{cursor:pointer;transition:transform .5s,opacity .5s}.count-fruit--collected{opacity:0;pointer-events:none;transform:translateY(-70px)scale(.3)}.praise{background:var(--gold-light);color:var(--ink);z-index:5;text-align:center;border:3px solid #fff;border-radius:22px;max-width:86%;padding:.7rem 1.3rem;font-size:1.4rem;font-weight:800;animation:.3s praise-pop;position:absolute;top:14%;left:50%;transform:translate(-50%);box-shadow:0 8px 24px #b8923f66}.praise--short{padding:.4rem .9rem;font-size:1.15rem;top:8%}@keyframes praise-pop{0%{opacity:0;transform:translate(-50%)scale(.5)}to{opacity:1;transform:translate(-50%)scale(1)}}.hint-bubble{border:2px solid var(--gold);z-index:5;background:#fff;border-radius:16px;padding:.4rem .9rem;font-size:1rem;animation:.25s bubble-pop;position:absolute;bottom:4%;left:50%;transform:translate(-50%)}.narration-bar{background:var(--paper);border-top:3px solid var(--gold-light);cursor:pointer;align-items:center;gap:.6rem;min-height:96px;padding:.7rem .9rem;display:flex}.replay-btn{border:3px solid var(--rose);background:#fff;border-radius:50%;flex:none;width:64px;height:64px;font-size:1.5rem;transition:transform .12s}.replay-btn:active{transform:scale(.92)}.karaoke{margin:0;font-size:clamp(1.1rem,3.4vw,1.45rem);font-weight:700;line-height:1.5}.karaoke__word{border-radius:6px;padding:0 3px;transition:background-color .15s}.karaoke__word--active{background:var(--gold-light)}.narration-notice{opacity:.75;margin:.2rem 0 0;font-size:.85rem;font-weight:400}.hud{justify-content:space-between;align-items:center;gap:1rem;padding:.5rem .4rem;display:flex}.next-btn{background:var(--leaf-deep);color:#fff;border:none;border-radius:20px;min-width:180px;min-height:72px;font-size:1.35rem;font-weight:800;transition:transform .12s;box-shadow:0 6px #4a7d3b}.next-btn:active{transform:translateY(4px);box-shadow:0 2px #4a7d3b}.next-btn.hidden{visibility:hidden}.progress-dots{gap:.4rem;display:flex}.dot{background:#e3d3b8;border-radius:50%;width:14px;height:14px}.dot--active{background:var(--rose);transform:scale(1.25)}.dot--done{background:var(--gold)}.celebrate{pointer-events:none;z-index:20;position:fixed;inset:0;overflow:hidden}.celebrate__star,.celebrate__dot{font-size:2rem;animation-name:celebrate-fall;animation-timing-function:linear;animation-fill-mode:forwards;position:absolute;top:-6%}.celebrate__dot{font-size:1rem}@keyframes celebrate-fall{0%{opacity:1;transform:translateY(0)rotate(0)}to{opacity:.6;transform:translateY(110vh)rotate(340deg)}}.hikmah-screen{flex:1;justify-content:center;align-items:center;display:flex}.hikmah-card{background:var(--card);border:3px solid var(--gold);text-align:center;border-radius:30px;width:min(560px,100%);padding:1.6rem 1.4rem;box-shadow:0 12px 34px #b8923f38}.hikmah-title{color:var(--gold);letter-spacing:.14em;text-transform:uppercase;margin:0;font-size:1.5rem}.hikmah-sentence{color:var(--rose);margin:1rem 0;font-size:clamp(1.5rem,5vw,2.1rem);font-weight:800;line-height:1.4}.hikmah-prompts{background:var(--paper);text-align:left;border-radius:16px;padding:.9rem 1rem}.hikmah-prompts h2{color:var(--gold);margin:0 0 .5rem;font-size:1rem}.hikmah-prompts ul{margin:0;padding-left:1.2rem}.hikmah-prompts li{margin:.3rem 0;font-size:1rem}.hikmah-actions{flex-direction:column;align-items:center;gap:.8rem;margin-top:1.4rem;display:flex}.hikmah-replay{background:var(--leaf-deep);box-shadow:0 6px #4a7d3b}.hikmah-home{background:var(--sky);color:var(--ink);box-shadow:0 6px #9dbecd}.parent-gate{z-index:40;border:2px solid var(--gold);color:var(--ink);background:#fffcf5ee;border-radius:14px;padding:.5rem .85rem;font-size:.85rem;font-weight:700;position:fixed;bottom:.7rem;left:.7rem;overflow:hidden}.parent-gate--holding{background:#fff3d9}.parent-gate__progress{height:5px;width:var(--progress,0%);background:var(--gold);transition:width .1s linear;position:absolute;bottom:0;left:0}.parent-backdrop{z-index:50;background:#46352bd9;justify-content:center;align-items:center;padding:1rem;display:flex;position:fixed;inset:0}.parent-menu{background:var(--card);border-radius:22px;width:min(520px,100%);max-height:88vh;padding:1.1rem 1.2rem;overflow:auto}.parent-menu__header{justify-content:space-between;align-items:center;display:flex}.parent-menu__header h2{color:var(--rose);margin:0;font-size:1.2rem}.parent-menu__close{border:2px solid var(--gold);background:var(--paper);border-radius:12px;padding:.45rem .9rem;font-weight:700}.parent-menu__tabs{gap:.5rem;margin:.9rem 0;display:flex}.parent-menu__tab{border:2px solid var(--gold);background:var(--paper);border-radius:12px;flex:1;padding:.5rem;font-weight:700}.parent-menu__tab[aria-pressed=true]{background:var(--gold);color:#fff}.parent-menu__lang-row{gap:.6rem;display:flex}.parent-menu__lang{border:2px solid var(--rose);background:#fff;border-radius:14px;flex:1;min-height:64px;font-weight:700}.parent-menu__lang[aria-pressed=true]{background:var(--rose);color:#fff}.parent-menu__select,.parent-menu__input{border:2px solid var(--gold);background:#fff;border-radius:12px;width:100%;min-height:52px;margin-bottom:.8rem;padding:.5rem .7rem;font-size:1rem}.parent-menu__key-field{border:2px solid var(--paper);border-radius:12px;margin-bottom:.8rem;padding:.6rem}.parent-menu__key-field legend{padding:0 .4rem;font-size:.9rem;font-weight:700}.parent-menu__note{opacity:.8;font-size:.85rem}.load-error{background:var(--rose);color:#fff;z-index:60;border-radius:12px;padding:.6rem 1.1rem;position:fixed;top:1rem;left:50%;transform:translate(-50%)}.loading{text-align:center;margin:auto;font-size:1.4rem}@media (prefers-reduced-motion:reduce){.char-idle-toto,.char-idle-nana,.char-idle-lili,.char-idle-momo,.char-eyes,.target-glow:after,.celebrate__star,.celebrate__dot{animation:none!important}.page--flip-in,.page--flip-out,.bg-layer{transition:none!important;animation:none!important}}
