:root{
  --bg:#fff9f1;--card:#fff;--ink:#27313b;--muted:#6e7884;
  --purple:#6c63ff;--purple2:#9a93ff;--yellow:#ffbd2e;--green:#2fbd73;
  --red:#ef476f;--blue:#3a78e8;--orange:#ff8a3d;--line:#ebe6df;
  --shadow:0 14px 34px rgba(53,50,95,.12)
}
*{box-sizing:border-box;-webkit-tap-highlight-color:transparent}
html,body{margin:0;min-height:100%;background:
radial-gradient(circle at 5% 8%,#fff0bd 0 125px,transparent 126px),
radial-gradient(circle at 95% 15%,#eae7ff 0 160px,transparent 161px),var(--bg);
color:var(--ink);font-family:ui-rounded,"Arial Rounded MT Bold",system-ui,-apple-system,Segoe UI,sans-serif}
button,input{font:inherit}
button{border:0;cursor:pointer;touch-action:manipulation;min-height:44px}
button:disabled{cursor:default}
button:focus-visible,input:focus-visible,select:focus-visible,summary:focus-visible,.field input:focus-visible,.field select:focus-visible,.name input:focus-visible{outline:3px solid #4037d6;outline-offset:3px}
.app{max-width:1040px;margin:auto;padding:14px 14px 34px}
.top{display:flex;align-items:center;justify-content:space-between;gap:12px;margin:5px 0 12px}
.brand{display:flex;gap:11px;align-items:center}.logo{width:52px;height:52px;border-radius:18px;background:linear-gradient(140deg,var(--purple),#a49eff);display:grid;place-items:center;color:#fff;font-size:29px;box-shadow:var(--shadow)}
h1{font-size:clamp(23px,5vw,36px);line-height:1;margin:0}.sub{font-size:13px;color:var(--muted);margin-top:4px}
.score{background:#fff;border:1px solid var(--line);border-radius:18px;padding:10px 12px;font-weight:900;box-shadow:var(--shadow);white-space:nowrap;pointer-events:none;user-select:none}.top-actions{display:flex;align-items:center;justify-content:flex-end;gap:8px;flex-wrap:wrap}.text-size-btn{min-width:48px;min-height:44px;padding:8px 10px;border-radius:14px;background:#fff;border:1px solid var(--line);box-shadow:var(--shadow);font-weight:1000;color:#4d44d7}.text-size-btn[aria-pressed="true"]{background:#efedff;border-color:#cfc9ff}.large-text .titlebar h2{font-size:31px}.large-text .titlebar p,.large-text .instruction-audio,.large-text .tip,.large-text .feedback,.large-text .card p{font-size:17px;line-height:1.55}.large-text .btn,.large-text .nav-btn{font-size:17px}.large-text .level small{font-size:14px;line-height:1.4}.large-text .tool-word-help span{font-size:15px}.large-text .readaloud-sentence{font-size:clamp(36px,8vw,60px)}@media(max-width:620px){.top{align-items:flex-start}.top-actions{max-width:190px}.text-size-btn{min-width:46px}.large-text .stage{padding:14px}.large-text .titlebar{flex-direction:column}.large-text .pill{white-space:normal}}
.progress-card{background:#ffffffd9;border:1px solid var(--line);border-radius:18px;padding:10px 12px;box-shadow:var(--shadow);margin-bottom:12px}
.progress-head{display:flex;justify-content:space-between;font-size:12px;color:var(--muted);font-weight:800;margin-bottom:7px}
.progress{height:10px;background:#eeeaf5;border-radius:999px;overflow:hidden}.progress>div{height:100%;background:linear-gradient(90deg,var(--purple),#b1abff);transition:.35s;width:0}
.layout{display:grid;grid-template-columns:220px 1fr;gap:13px}
.nav,.stage{background:#ffffffeb;border:1px solid var(--line);border-radius:23px;box-shadow:var(--shadow)}
.nav{padding:11px;height:max-content;position:sticky;top:10px}
.name{margin-bottom:10px}.name label{display:block;color:var(--muted);font-size:12px;margin:0 0 5px 3px}.name input{width:100%;padding:10px;border:1px solid var(--line);border-radius:12px;outline:none;background:#fff}.name input:focus{border-color:var(--purple)}
.nav-btn{width:100%;display:flex;align-items:center;gap:8px;padding:11px;border-radius:14px;background:transparent;text-align:left;font-weight:850;color:var(--ink);margin:3px 0}.nav-btn.active{background:#efedff;color:#4d44d7}.nav-btn:hover{background:#f6f5ff}
.nav-more{margin:3px 0;border-radius:14px}.parent-nav{margin-top:10px!important;border-top:1px solid var(--line);border-radius:0 0 14px 14px!important;color:#5f6973!important}.parent-nav.active{border-top-color:transparent;border-radius:14px!important;color:#4d44d7!important}.nav-more summary{list-style:none;cursor:pointer;padding:11px;border-radius:14px;font-weight:850;color:var(--ink);user-select:none}.nav-more summary::-webkit-details-marker{display:none}.nav-more summary::after{content:"›";float:right;transition:transform .16s ease}.nav-more[open] summary{background:#f6f5ff}.nav-more[open] summary::after{transform:rotate(90deg)}.nav-more .nav-btn{padding-left:18px;font-size:13px}
.stage{padding:18px;min-height:610px;overflow:hidden}
.titlebar{display:flex;align-items:flex-start;justify-content:space-between;gap:10px}.titlebar h2{font-size:26px;margin:0 0 4px}.titlebar p{margin:0;color:var(--muted);font-size:14px}.pill{background:#fff1bf;color:#745a00;border-radius:999px;padding:7px 10px;font-size:12px;font-weight:900;white-space:nowrap}
.card{background:#fff;border:1px solid var(--line);border-radius:21px;padding:16px;margin-top:13px}.center{text-align:center}
.hero-emoji{font-size:58px;line-height:1;margin:5px 0}.big{font-size:clamp(62px,14vw,112px);font-weight:1000;line-height:1;margin:7px 0}
.red{color:#df3e55}.blue{color:#376ed8}.green{color:#24965a}.purple{color:var(--purple)}
.btn{padding:12px 15px;border-radius:14px;font-weight:900;background:#efedff;color:#4c43d2;min-height:47px}.btn.primary{background:var(--purple);color:#fff;box-shadow:0 8px 18px #6c63ff33}.btn.good{background:#e4f7ed;color:#176d40}.btn.gray{background:#f2f2f2;color:#555f69}.btn.yellow{background:#fff1bd;color:#765600}
.speaker{font-size:18px}.actions{display:flex;gap:9px;align-items:center;justify-content:center;flex-wrap:wrap}
.instruction-audio{display:flex;align-items:center;justify-content:flex-start;gap:9px;margin-top:11px;padding:9px 10px;border:1px solid #ddd8ff;border-radius:14px;background:#f8f7ff;color:#514a7a;font-weight:750;font-size:13px;line-height:1.35}.instruction-audio span{flex:1;text-align:left}.instruction-replay{order:-1;flex:0 0 auto;white-space:nowrap;min-height:44px;padding:8px 11px}@media(max-width:520px){.instruction-audio{align-items:center;gap:7px;padding:8px}.instruction-audio span{font-size:12px;line-height:1.3}.instruction-replay{width:auto;font-size:12px;padding:7px 9px}}
.tool-word-help{display:flex;align-items:center;justify-content:center;gap:8px;flex-wrap:wrap;margin:12px 0 2px;padding:10px;border-radius:14px;background:#fffaf0;border:1px solid #f0dfad}.tool-word-help span{font-size:13px;font-weight:900;color:#71664d}.tool-word-audio{min-height:44px;padding:9px 12px;border-radius:12px;background:#fff1bd;color:#765600;font-weight:900;border:1px solid #edd681}.tool-word-audio:active{transform:scale(.97)}
.readaloud-sentence{max-width:720px;margin:18px auto 10px;padding:18px 16px;border-radius:20px;background:#fcfbff;border:2px solid #e6e0f7;font-size:clamp(30px,7vw,52px);line-height:1.35;font-weight:1000;letter-spacing:.01em}.readaloud-model{display:flex;align-items:center;justify-content:center;gap:10px;flex-wrap:wrap;margin-top:14px;padding:12px;border-radius:15px;background:#f5fbff;border:1px solid #d9edf9}.readaloud-model[hidden]{display:none}@media(max-width:520px){.readaloud-model{align-items:stretch;flex-direction:column}.readaloud-model .btn{width:100%}}
.nextbar{display:flex;justify-content:space-between;gap:10px;align-items:center;margin-top:14px}
.choices{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:10px;margin-top:14px}.choice{min-height:72px;border:2px solid #e8e3f1;background:#fff;border-radius:17px;font-size:30px;font-weight:1000;color:var(--ink);transition:.15s transform,.15s border-color,.15s background}.choice:active{transform:scale(.97)}.choice.correct{background:#e7f8ee;border-color:var(--green);color:#176d40}.choice.wrong{background:#fff0f4;border-color:var(--red);color:#a21d44}
.choice.picture{font-size:42px;min-height:100px}.choice.picture small{display:block;font-size:14px;color:var(--muted);margin-top:5px}
.feedback{min-height:49px;margin-top:11px;display:flex;justify-content:center;align-items:center}.feedback .ok,.feedback .no{width:100%;padding:11px;border-radius:14px;font-weight:900}.ok{background:#e9f9f0;color:#176d40}.no{background:#fff1f4;color:#9f2145}
.sound-grid{display:grid;grid-template-columns:repeat(5,1fr);gap:8px;margin-top:12px}.sound-tile{border:2px solid #e6e0f7;background:#faf9ff;border-radius:16px;padding:12px 6px;font-size:31px;font-weight:1000;min-height:63px;position:relative}.sound-tile:active{transform:scale(.96)}.sound-tile.practiced{border-color:#6dcf9a;background:#effaf4}.sound-tile.practiced::after{content:"✓";position:absolute;right:6px;top:4px;font-size:13px;color:#1d8c54}.family-roadmap{display:flex;gap:7px;overflow-x:auto;padding:8px 1px 3px;margin-top:10px;scrollbar-width:none}.family-roadmap::-webkit-scrollbar{display:none}.family-chip{min-width:58px;padding:9px 8px;border-radius:13px;border:1px solid #e8e3f1;background:#faf9ff;text-align:center;font-weight:1000;flex:0 0 auto}.family-chip small{display:block;font-size:9px;color:var(--muted);margin-top:3px}.family-chip.open{border-color:#c8c1ff;background:#f3f1ff;color:#4d44d7}.family-chip.locked{opacity:.42;filter:grayscale(1)}
.syllable{display:inline-flex;flex-direction:column;gap:4px;min-width:108px;min-height:78px;padding:10px 15px;align-items:center;justify-content:center;border:2px solid #ded9ff;border-radius:19px;background:#faf9ff;font-size:42px;font-weight:1000;margin:6px}.syllable small{font-size:12px;color:#8a83c7;letter-spacing:1px}
.word{font-size:clamp(42px,9vw,72px);font-weight:1000;line-height:1.15;margin:13px 0}.word span:nth-child(odd){color:#dc3d53}.word span:nth-child(even){color:#3b70d7}.word span.silent-letter.pending{color:inherit}.word span.silent-letter.revealed,.silent-example span.silent-letter.revealed{color:#8b93a7;text-decoration:line-through;text-decoration-thickness:2px;text-decoration-color:#b6bdcb}.silent-e-intro{background:#f7f8fc;border-color:#dfe3ed}.silent-example{font-size:1.2em;letter-spacing:.02em}.structure-sep{color:var(--muted);padding:0 .05em;font-weight:800}.word .missing-slot{display:inline-grid;place-items:center;min-width:1.15em;border-bottom:4px solid var(--purple);color:var(--purple);padding:0 .08em}
.word-parts{display:flex;gap:8px;justify-content:center;flex-wrap:wrap}.part{padding:12px 18px;border-radius:15px;background:#f7f5ff;color:#4b43d0;font-size:27px;font-weight:1000}
.tip{margin-top:11px;padding:11px 12px;background:#f5fbff;border:1px solid #d9edf9;border-radius:14px;color:#486676;font-size:14px;line-height:1.45}
.mission{display:flex;gap:10px;align-items:center;padding:11px;border-radius:15px;background:#fffaf0;border:1px solid #f3e0ad;margin-top:12px}.mission-icon{font-size:30px}.mission b{display:block}.mission span{font-size:13px;color:#71664d}
.streak{display:inline-flex;gap:5px;align-items:center;background:#fff3d5;padding:7px 10px;border-radius:999px;font-weight:900;font-size:13px}
.levels{display:grid;grid-template-columns:repeat(3,1fr);gap:10px;margin-top:13px}.level{border:1px solid var(--line);background:#fff;border-radius:18px;padding:13px;text-align:center}.level:disabled{opacity:.46;filter:grayscale(1);cursor:default}.level .ico{font-size:34px}.level b{display:block;margin-top:5px}.level small{color:var(--muted)}
.game-group{padding:0;overflow:hidden}.game-group>summary{position:relative;cursor:pointer;list-style:none;padding:15px 16px;font-weight:1000;display:flex;align-items:center;justify-content:space-between;gap:12px}.game-group>summary::-webkit-details-marker{display:none}.game-group>summary::after{content:"›";font-size:22px;color:var(--muted);transition:transform .16s ease}.game-group[open]>summary::after{transform:rotate(90deg)}.game-group>summary span{font-size:17px}.game-group>summary small{font-size:12px;color:var(--muted);font-weight:750;text-align:right}.game-group>.levels{margin:0;padding:0 14px 14px}.game-group:not([open])>summary{border-radius:20px}.game-group[open]>summary{border-bottom:1px solid var(--line);background:#fbfaff}.progressive-stage-note{margin:10px 16px 14px;color:var(--muted);font-size:13px;line-height:1.45;font-weight:750}
.star-pop{position:fixed;left:50%;top:45%;transform:translate(-50%,-50%);font-size:80px;pointer-events:none;animation:pop .75s both;z-index:30}@keyframes pop{0%{opacity:0;transform:translate(-50%,-50%) scale(.4) rotate(-20deg)}45%{opacity:1;transform:translate(-50%,-50%) scale(1.22) rotate(8deg)}100%{opacity:0;transform:translate(-50%,-75%) scale(.9)}}@keyframes wiggle{0%,100%{transform:rotate(0)}25%{transform:rotate(-4deg)}75%{transform:rotate(4deg)}}.wiggle{animation:wiggle .25s 2}
.confetti{position:fixed;inset:0;pointer-events:none;z-index:25;overflow:hidden}.confetti i{position:absolute;top:-20px;font-style:normal;animation:fall 1.5s linear forwards}@keyframes fall{to{transform:translateY(110vh) rotate(560deg);opacity:.2}}
.order-zone{display:flex;gap:8px;min-height:73px;justify-content:center;align-items:center;flex-wrap:wrap;padding:10px;border:2px dashed #d9d3ec;border-radius:17px;background:#fcfbff;margin-top:12px}.order-zone .empty{color:#9298a0;font-size:14px}.token{min-width:76px;padding:13px 15px;border-radius:15px;background:#efedff;color:#4b42c9;font-size:25px;font-weight:1000}
.encode-zone{display:flex;justify-content:center;gap:12px;margin:18px 0 14px}.encode-zone span{width:72px;height:76px;display:grid;place-items:center;border:3px dashed #d9d3ec;border-radius:18px;background:#fcfbff;color:#9a9fa7;font-size:42px;font-weight:1000}.encode-zone span.filled{border-style:solid;border-color:#b9b2ff;background:#f3f1ff;color:#4c43d2}.encode-bank{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:9px;max-width:520px;margin:0 auto}.encode-letter{min-height:64px;border:2px solid #e6e0f7;background:#fff;border-radius:16px;font-size:32px;font-weight:1000;color:#4c43d2}.encode-letter:disabled{opacity:.45}.encode-letter:active{transform:scale(.96)}.progressive-hint{min-height:0;margin-top:8px}.progressive-hint:empty{display:none}.progressive-hint .tip{margin:0;text-align:left}.progressive-hint .red,.progressive-hint .blue{font-size:1.08em;font-weight:1000}@media(max-width:420px){.encode-bank{grid-template-columns:repeat(3,minmax(0,1fr))}.encode-zone span{width:64px;height:68px;font-size:36px}}
.emojis{font-size:58px;margin:8px 0}
.parent-grid{display:grid;grid-template-columns:1fr 1fr;gap:10px}.parent-box{border:1px solid var(--line);border-radius:17px;padding:13px;background:#fff}.parent-box h3{margin:0 0 7px;font-size:16px}.parent-box p,.parent-box li{font-size:13px;color:#5f6973;line-height:1.5}.parent-summary{margin-top:13px}.parent-section{background:#fff;border:1px solid var(--line);border-radius:21px;padding:16px;margin-top:13px}.parent-details>summary{cursor:pointer;list-style:none;font-weight:1000;font-size:16px;padding:2px 0}.parent-details>summary::-webkit-details-marker{display:none}.parent-details>summary::after{content:"›";float:right;color:var(--muted);font-size:22px;line-height:1;transition:transform .16s ease}.parent-details[open]>summary::after{transform:rotate(90deg)}.parent-details[open]>summary{padding-bottom:10px;border-bottom:1px solid var(--line)}
.mic-status{margin:13px auto 0;max-width:520px;padding:11px 13px;border-radius:14px;background:#f5f3ff;color:#554db5;font-weight:850;font-size:14px}.mic-status.listening{background:#fff3d5;color:#765600}.mic-status.success{background:#e9f9f0;color:#176d40}.mic-status.error{background:#fff1f4;color:#9f2145}.mic-pulse{display:inline-block;animation:micPulse .9s infinite alternate}@keyframes micPulse{to{transform:scale(1.16)}}.puzzle-wrap{display:grid;grid-template-columns:150px 1fr;gap:14px;align-items:center}.puzzle-grid{display:grid;grid-template-columns:1fr 1fr;gap:5px;width:140px;height:140px}.puzzle-piece{display:grid;place-items:center;border-radius:18px;border:2px dashed #d9d3ec;background:#f8f6ff;font-size:30px;color:#aaa}.puzzle-piece.on{border-style:solid;border-color:#f0c760;background:#fff4c8;color:#6a5000}.collection-row{display:flex;gap:7px;flex-wrap:wrap;margin-top:8px}.collectible{padding:7px 9px;border-radius:12px;background:#f5f3ff;font-size:12px;font-weight:850;color:#554db5}button.collectible{border:1px solid #ded8ff;cursor:pointer;font:inherit}button.collectible:focus-visible{outline:3px solid #9c96ff;outline-offset:2px}.world-path{display:grid;gap:12px;margin-top:14px}.world-zone{display:grid;grid-template-columns:74px 1fr auto;gap:12px;align-items:center;padding:14px;border-radius:20px;border:2px solid #ebe6df;background:#fff}.world-zone.unlocked{border-color:#cbc5ff;background:linear-gradient(135deg,#fff,#f8f6ff)}.world-zone.current{border-color:#6c63ff;box-shadow:0 10px 25px #6c63ff1d}.world-zone.locked{opacity:.48;filter:grayscale(.8)}.world-emoji{font-size:48px;text-align:center}.world-zone h3{margin:0 0 4px}.world-zone p{margin:0;color:var(--muted);font-size:13px;line-height:1.4}.zone-badge{padding:7px 9px;border-radius:999px;background:#efedff;color:#4d44d7;font-size:11px;font-weight:900;white-space:nowrap}.companion-card{background:linear-gradient(135deg,#fff7d6,#fff);border:2px solid #f2d87d}.collection-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:10px;margin-top:14px}.treasure-card{border:1px solid var(--line);border-radius:18px;padding:14px;text-align:center;background:#fff}.treasure-card.locked{filter:grayscale(1);opacity:.52}.treasure-card .treasure-emoji{font-size:46px}.badge-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:9px;margin-top:10px}.badge-card{padding:12px;border-radius:16px;border:1px solid #ebe6df;background:#fff;text-align:center}.badge-card.locked{opacity:.42;filter:grayscale(1)}.badge-card .badge-emoji{font-size:34px}.badge-card b{display:block;margin-top:4px}.badge-card small{display:block;color:var(--muted);margin-top:3px}.badge-count{font-size:13px;color:var(--muted);margin:5px 0 0}.badge-empty{font-size:13px;color:var(--muted);margin:12px 0 0}.badge-next{margin-top:14px;padding-top:12px;border-top:1px solid var(--line)}.badge-next .badge-grid{grid-template-columns:minmax(0,220px)}.badge-more{border-top:1px solid var(--line);margin-top:12px;padding-top:8px}.badge-more>summary{cursor:pointer;list-style:none;display:flex;align-items:center;min-height:44px;font-weight:850;color:var(--muted)}.badge-more>summary::-webkit-details-marker{display:none}.badge-more>summary::after{content:"›";margin-left:auto}.badge-more[open]>summary::after{transform:rotate(90deg)}.treasure-next{margin-top:14px;padding-top:12px;border-top:1px solid var(--line)}.treasure-next .collection-grid{grid-template-columns:minmax(0,220px)}.treasure-more{border-top:1px solid var(--line);margin-top:12px;padding-top:8px}.treasure-more>summary{cursor:pointer;list-style:none;display:flex;align-items:center;min-height:44px;font-weight:850;color:var(--muted)}.treasure-more>summary::-webkit-details-marker{display:none}.treasure-more>summary::after{content:"›";margin-left:auto}.treasure-more[open]>summary::after{transform:rotate(90deg)}.mastery-grid{display:grid;grid-template-columns:repeat(5,1fr);gap:7px;margin-top:10px}.mastery-chip{padding:9px 5px;border-radius:12px;background:#faf9ff;border:1px solid #e8e3f1;text-align:center;font-weight:900}.mastery-chip small{display:block;color:#8a83c7;font-size:10px;margin-top:3px}@media(max-width:520px){.collection-grid,.badge-grid{grid-template-columns:repeat(2,1fr)}.mastery-grid{grid-template-columns:repeat(3,1fr)}.world-zone{grid-template-columns:58px 1fr}.world-emoji{font-size:40px}.zone-badge{grid-column:2;justify-self:start}}@media(max-width:520px){.puzzle-wrap{grid-template-columns:1fr}.puzzle-grid{margin:auto}.home-welcome{grid-template-columns:auto 1fr}.home-welcome .btn{grid-column:1/-1;width:100%}.home-reward .puzzle-wrap{grid-template-columns:90px 1fr}.home-reward .puzzle-grid{width:82px;height:82px;margin:0}}
.bubble-arena{display:grid;grid-template-columns:repeat(3,1fr);gap:14px;max-width:620px;margin:18px auto}.bubble{aspect-ratio:1;border-radius:50%;border:3px solid #ded9ff;background:radial-gradient(circle at 32% 28%,#fff,#efedff 58%,#ddd8ff);font-size:clamp(26px,6vw,43px);font-weight:1000;color:#4d44d7;box-shadow:inset -7px -9px 16px #6c63ff13,0 8px 18px #6c63ff18;transition:.16s transform,.16s opacity}.bubble:active{transform:scale(.91)}.bubble.pop{transform:scale(1.18);opacity:0}.memory-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:10px;max-width:600px;margin:16px auto}.memory-card{min-height:105px;border-radius:18px;border:2px solid #e6e0f7;background:#6c63ff;color:#fff;font-size:30px;font-weight:1000;display:grid;place-items:center;transition:.18s transform,.18s background}.memory-card:active{transform:scale(.96)}.memory-card.open,.memory-card.matched{background:#fff;color:#27313b}.memory-card.open small{display:block;font-size:12px;font-weight:850;line-height:1.15}.memory-card.matched{border-color:#2fbd73;background:#e9f9f0}.beta-pill{display:inline-block;margin-left:5px;padding:2px 6px;border-radius:999px;background:#fff1bd;color:#745a00;font-size:10px;font-weight:900}@media(max-width:520px){.bubble-arena,.memory-grid{grid-template-columns:repeat(2,1fr)}}
.home-welcome{display:grid;grid-template-columns:auto 1fr auto;gap:12px;align-items:center;margin-top:13px;padding:12px 14px;border:1px solid var(--line);border-radius:18px;background:#fff}.home-welcome-emoji{font-size:36px}.home-welcome b{display:block;font-size:17px}.home-welcome small{display:block;color:var(--muted);margin-top:3px;line-height:1.4}.home-secondary>summary{cursor:pointer;list-style:none;font-weight:1000;font-size:16px}.home-secondary>summary::-webkit-details-marker{display:none}.home-secondary>summary::after{content:"›";float:right;color:var(--muted);font-size:22px;line-height:1;transition:transform .16s ease}.home-secondary[open]>summary::after{transform:rotate(90deg)}.home-secondary[open]>summary{padding-bottom:10px;border-bottom:1px solid var(--line)}.rhythm-panel{padding-top:12px}.home-reward .puzzle-wrap{grid-template-columns:110px 1fr}.home-reward .puzzle-grid{width:96px;height:96px}.home-reward .puzzle-piece{font-size:22px;border-radius:14px}
.daily-mission{border:2px solid #ded9ff;background:linear-gradient(145deg,#fff,#f8f6ff);border-radius:22px;padding:15px;margin-top:13px}.mission-focus{display:flex;align-items:center;gap:10px;padding:11px;border-radius:15px;background:#fff;border:1px solid #e8e3f5}.mission-focus .num{width:34px;height:34px;border-radius:50%;display:grid;place-items:center;background:#efedff;color:#4c43d2;font-weight:1000;flex:0 0 auto}.mission-focus b{display:block}.mission-focus small{display:block;color:var(--muted);margin-top:2px;line-height:1.4}.mission-focus.done .num{background:#e4f7ed;color:#176d40}.mission-done-note{margin:12px auto 0;padding:10px 12px;border-radius:14px;background:#f3f8f5;font-weight:900;max-width:540px}.mission-parent-result{margin-top:12px;text-align:left;border-top:1px solid var(--line);padding-top:10px}.mission-parent-result>summary{cursor:pointer;list-style:none;min-height:44px;display:flex;align-items:center;justify-content:center;font-weight:850;color:var(--muted)}.mission-parent-result>summary::-webkit-details-marker{display:none}.mission-parent-result>summary::after{content:" ›";margin-left:5px}.mission-parent-result[open]>summary::after{transform:rotate(90deg)}.account-danger>summary{cursor:pointer;font-weight:900}.account-danger-intro{color:var(--muted);font-size:13px;margin:10px 0 14px}.account-danger-block{border:1px solid var(--line);border-radius:14px;padding:12px}.account-danger-block>small{display:block;color:var(--muted);margin:4px 0 10px}.account-danger-final{margin-top:12px;border-style:dashed}.parent-danger{margin-top:14px;border-top:1px solid var(--line);padding-top:12px}.parent-danger>summary{cursor:pointer;list-style:none;font-weight:900;color:#8a4a26;min-height:44px;display:flex;align-items:center}.parent-danger>summary::-webkit-details-marker{display:none}.parent-danger>summary::after{content:" ›";margin-left:auto}.parent-danger[open]>summary::after{transform:rotate(90deg)}.parent-danger>p{color:var(--muted);font-size:13px;line-height:1.5}.mission-progress{display:flex;gap:6px;margin:10px 0 12px}.mission-dot{height:9px;flex:1;border-radius:999px;background:#ebe7f6}.mission-dot.done{background:#2fbd73}.mission-dot.current{background:#6c63ff}.mission-steps{display:grid;gap:7px}.mission-step{display:flex;align-items:center;gap:10px;padding:10px;border-radius:14px;background:#fff;border:1px solid #eee9f7}.mission-step .num{width:31px;height:31px;border-radius:50%;display:grid;place-items:center;background:#f0edff;color:#4c43d2;font-weight:1000;flex:0 0 auto}.mission-step.done .num{background:#e4f7ed;color:#176d40}.mission-step.current{border-color:#b9b2ff;background:#faf9ff}.mission-step small{display:block;color:var(--muted);margin-top:2px}.mission-celebrate{font-size:64px;margin:5px 0}
.footer-note{text-align:center;color:#8c9299;font-size:11px;margin-top:16px}
@media(max-width:760px){
 .app{padding:8px}.progress-card{padding:7px 10px;margin-bottom:8px;box-shadow:none}.progress-head{margin-bottom:5px}.progress{height:7px}.sync{font-size:10px!important;line-height:1.25!important;margin-top:3px;opacity:.72}.sync.err{font-size:11px!important;opacity:1;font-weight:850}.layout{grid-template-columns:1fr;gap:8px}.nav{position:sticky;top:4px;z-index:40;display:flex;align-items:center;gap:6px;overflow-x:auto;padding:7px;scrollbar-width:none;-webkit-overflow-scrolling:touch;background:#fffffff2}.nav::-webkit-scrollbar{display:none}.profilebox{min-width:150px;margin:0;flex:0 0 auto;padding:7px 8px}.profilebox .tiny{display:none}.profileline{gap:4px}.nav-btn{width:auto;min-width:max-content;flex:0 0 auto;margin:0;padding:10px 11px;font-size:13px}.nav-more{flex:0 0 auto;margin:0}.parent-nav{margin-top:0!important;border-top:0!important;border-left:1px solid var(--line);border-radius:14px!important}.nav-more summary{min-height:44px;display:flex;align-items:center;gap:6px;padding:10px 11px;white-space:nowrap}.nav-more[open]{min-width:170px}.nav-more .nav-btn{width:100%;padding-left:12px}.stage{padding:13px;min-height:auto}.sound-grid{grid-template-columns:repeat(4,1fr)}.levels{grid-template-columns:1fr 1fr}.parent-grid{grid-template-columns:1fr}.top{align-items:flex-start}.top-actions{gap:5px}.score,.account-chip{font-size:12px;padding:8px 9px}.choices{gap:8px}.choice{min-height:66px}
}
@media(max-width:390px){.nav-btn{font-size:13px}.sound-grid{grid-template-columns:repeat(3,1fr)}.choice{font-size:26px}}
@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-actions{display:flex;gap:8px;align-items:center;flex-wrap:wrap;justify-content:flex-end}.account-chip{background:#fff;border:1px solid var(--line);border-radius:18px;padding:10px 12px;font-weight:900;box-shadow:var(--shadow);white-space:nowrap;font-size:13px}.profilebox{margin-bottom:10px;padding:10px;border-radius:14px;background:#faf9ff;border:1px solid #e9e4ff}.profilebox .tiny{font-size:11px;color:var(--muted);margin-bottom:5px}.profileline{display:flex;justify-content:space-between;align-items:center;gap:6px}.sync{font-size:11px;color:var(--muted);margin-top:5px}.sync.ok{color:#228c55}.sync.err{color:#b32949}.modal{position:fixed;inset:0;background:rgba(24,24,35,.62);z-index:100;display:flex;align-items:center;justify-content:center;padding:16px}.modal.hidden{display:none}.modal-card{width:min(540px,100%);max-height:92vh;overflow:auto;background:#fff;border-radius:24px;padding:19px;box-shadow:0 30px 80px rgba(0,0,0,.25)}.modal-card h2{margin:0 0 6px}.modal-card p{color:var(--muted);font-size:14px;line-height:1.45}.form{display:grid;gap:10px;margin-top:13px}.field label{display:block;font-size:12px;color:var(--muted);margin:0 0 5px 3px}.field input,.field select{width:100%;padding:12px;border:1px solid var(--line);border-radius:13px;outline:none;background:#fff}.tabs{display:grid;grid-template-columns:1fr 1fr;background:#f4f2fb;border-radius:13px;padding:4px;gap:4px}.tab{padding:10px;border-radius:10px;background:transparent;font-weight:850}.tab.active{background:#fff;box-shadow:0 3px 10px #00000012;color:#4b43ce}.auth-msg{min-height:20px;font-size:13px;margin-top:8px}.auth-msg.error{color:#b32949}.auth-msg.good{color:#228c55}.children-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:10px;margin-top:12px}.child-card{padding:14px;border:2px solid #eee9f7;border-radius:18px;background:#fff;text-align:center}.child-card.selected{border-color:#8d83ff;background:#f7f5ff;box-shadow:0 0 0 2px #8d83ff1f}.child-card .avatar{font-size:45px}.child-card b{display:block;margin:5px 0}.child-card small{color:var(--muted)}.btn.redbtn{background:#fff0f3;color:#a11f42}

/* Keep every screen usable on small phones, at large text sizes and with a keyboard. */
.layout>*{min-width:0}.brand{min-width:0}.brand>div:last-child{min-width:0}
h1{line-height:1.12}.titlebar{flex-wrap:wrap}.word,.choice,.token{overflow-wrap:anywhere}
.field input,.field select{font-size:16px}.nav-btn,.account-chip,.tab{min-height:44px}
.family-chip small{font-size:12px}.mastery-chip small{font-size:12px}
.nextbar{flex-wrap:wrap}.nextbar .btn{flex:1 1 130px}
button:disabled{opacity:.65}.choice:disabled.correct{opacity:1}
.stage{scroll-margin-top:90px}.modal-card{padding-bottom:max(19px,env(safe-area-inset-bottom))}
@media(max-width:760px){
 .app{padding:10px max(10px,env(safe-area-inset-right)) max(20px,env(safe-area-inset-bottom)) max(10px,env(safe-area-inset-left))}
 .nav{scrollbar-width:thin}.nav::-webkit-scrollbar{display:block;height:4px}.nav::-webkit-scrollbar-thumb{background:#c8c1ff;border-radius:4px}
 .profilebox{min-width:160px;margin:0}.stage{padding:12px}.sync{font-size:12px;line-height:1.5}
}
@media(max-width:480px){
 .top{display:grid;grid-template-columns:minmax(0,1fr)}.top-actions{justify-content:space-between;width:100%}
 .brand .logo{flex:0 0 44px;width:44px;height:44px}.titlebar h2{font-size:24px}
 .card{padding:12px}.sound-grid{gap:6px}.actions .btn{max-width:100%}
 .game-group{padding:0}.game-group>summary{align-items:flex-start;flex-direction:column;gap:3px;padding:13px}.game-group>summary small{text-align:left}.game-group>summary::after{position:absolute;right:14px}.game-group>.levels{padding:0 10px 10px}
}
.mastery-chip{min-width:0;color:var(--ink);overflow-wrap:anywhere}
.mastery-chip:disabled{color:var(--muted);background:#f4f3f6}
.mastery-chip .practice-link{color:#4037d6;font-weight:800}

/* Show validation only after the complete answer is correct. */
.answer-success,.answer-success *{color:#14532d!important}
.answer-success{background:#dcfce7!important;border-color:#15803d!important;opacity:1!important;box-shadow:0 0 0 2px #15803d}
.success-check{font-size:.8em;font-weight:900;margin-left:.15em}

/* Reveal the actual mission reward on its final exercise, before the optional detail screen. */
.mission-reward-preview{
 display:flex;gap:14px;align-items:center;text-align:left;max-width:490px;
 margin:15px auto;padding:14px;border:2px solid #e7ca62;border-radius:17px;
 background:#fff8d8;box-shadow:0 4px 16px #7a5c0020;color:#604800
}
.mission-reward-preview>div:last-child{min-width:0;overflow-wrap:anywhere}
.mission-reward-preview b,.mission-reward-preview strong,.mission-reward-preview small{display:block}
.mission-reward-preview b{font-size:17px}
.mission-reward-preview strong{margin-top:3px;font-size:20px}
.mission-reward-preview small{margin-top:4px;font-size:13px;line-height:1.4;color:#6f5b29}
.mission-reward-puzzle{display:grid;grid-template-columns:repeat(2,36px);grid-template-rows:repeat(2,36px);gap:5px;flex:0 0 auto}
.mission-reward-piece{
 display:grid;place-items:center;border:2px dashed #d8c796;border-radius:9px;
 background:#fffdf4;font-size:19px;font-weight:900;color:#9c8c64
}
.mission-reward-piece.on{border:2px solid #dfab2d;background:#ffe49a;color:#644500}
.mission-reward-piece.earned{animation:rewardPieceArrive .55s ease-out both}
@keyframes rewardPieceArrive{0%{transform:scale(.68) rotate(-12deg);opacity:.35}75%{transform:scale(1.12) rotate(4deg);opacity:1}100%{transform:scale(1) rotate(0);opacity:1}}
@media(max-width:360px){
 .mission-reward-preview{gap:10px;padding:10px}
 .mission-reward-puzzle{grid-template-columns:repeat(2,29px);grid-template-rows:repeat(2,29px);gap:4px}
 .mission-reward-piece{font-size:16px;border-radius:7px}
 .mission-reward-preview b{font-size:15px}
 .mission-reward-preview strong{font-size:18px}
}
@media(prefers-reduced-motion:reduce){.mission-reward-piece.earned{animation:none}}

/* LUMA — visual finish line for Bubble free play; does not alter reward accounting. */
#bubbleRoundResult.bubble-finish{
 position:relative;overflow:hidden;max-width:650px;margin:12px auto 0;
 border:2px solid #b9b3ff;border-radius:24px;
 background:radial-gradient(circle at 88% 8%,#fff0ad 0 60px,transparent 62px),
 linear-gradient(145deg,#f1efff,#f2fbff 58%,#fff9e7);
 box-shadow:0 10px 26px #6c63ff16;padding:23px 18px
}
.bubble-finish-hero{font-size:clamp(36px,7vw,56px);line-height:1.2;margin:0 0 8px}
.bubble-finish h3{font-size:clamp(21px,5vw,27px);margin:2px 0 4px;color:#4037a6}
.bubble-finish-intro{color:#4b5471;font-size:15px;margin:5px 0 18px}
.bubble-finish-journey{
 display:grid;grid-template-columns:repeat(6,minmax(0,1fr));gap:8px;
 max-width:410px;margin:0 auto 12px
}
.bubble-finish-step{
 display:grid;place-items:center;min-width:0;aspect-ratio:1;border-radius:50%;
 border:2px solid #79c8f0;background:radial-gradient(circle at 32% 22%,#fff 0 6%,#bef1ff 35%,#82d9fa 100%);
 color:#175478;font-size:clamp(15px,3vw,22px);font-weight:1000;
 box-shadow:inset 0 2px 5px #fff9,0 3px 8px #428bb22b
}
.bubble-finish-step.last{
 border-color:#e5ad32;background:radial-gradient(circle at 32% 22%,#fff9db,#ffe18f 50%,#ffc851);
 color:#704500;animation:bubbleFinishSpark .65s ease-out both
}
@keyframes bubbleFinishSpark{
 0%{opacity:.45;transform:scale(.72)}65%{opacity:1;transform:scale(1.13)}100%{opacity:1;transform:scale(1)}
}
.bubble-finish-total{font-size:15px;color:#4037a6;margin:4px 0}
.bubble-finish-total b{font-size:22px}
.bubble-finish-numbers{font-size:13px;color:#495a6e;line-height:1.5;margin:8px auto;max-width:480px}
.bubble-finish-encouragement{font-size:16px;font-weight:850;color:#215b49;line-height:1.45;margin:16px auto 9px;max-width:510px}
.bubble-finish-saved{font-size:13px;color:#5d6373;margin:8px 0 0}
.bubble-finish-actions{max-width:650px;margin:14px auto 4px}
.bubble-finish-actions .btn:first-child{flex:1 1 100%;font-size:17px}
.bubble-finish-actions .btn:not(:first-child){flex:1 1 155px}
@media(max-width:360px){
 #bubbleRoundResult.bubble-finish{padding:18px 10px}
 .bubble-finish-journey{gap:4px}
 .bubble-finish-intro{margin-bottom:14px}
 .bubble-finish-actions .btn{flex:1 1 100%}
}
@media(prefers-reduced-motion:reduce){.bubble-finish-step.last{animation:none}}

/* LUMA — a compact child-facing finish for 6 syllables or 4 words. */
#activityRoundResult.activity-finish{
 max-width:650px;margin:12px auto 0;padding:23px 18px;overflow:hidden;
 border:2px solid #a7d6cd;border-radius:24px;
 background:radial-gradient(circle at 10% 9%,#dcffed 0 53px,transparent 55px),
 linear-gradient(145deg,#ebfff5,#f3efff 65%,#fff8ed);
 box-shadow:0 10px 26px #2b92751b
}
.activity-finish-hero{font-size:clamp(34px,7vw,53px);line-height:1.25;margin-bottom:7px}
.activity-finish h3{font-size:clamp(21px,5vw,27px);margin:2px 0 4px;color:#235c4e}
.activity-finish-intro{font-size:15px;color:#526371;margin:5px 0 17px}
.activity-finish-journey{
 display:grid;gap:8px;max-width:410px;margin:0 auto 12px
}
.activity-finish-journey.four{grid-template-columns:repeat(4,minmax(0,1fr));max-width:325px}
.activity-finish-journey.six{grid-template-columns:repeat(6,minmax(0,1fr))}
.activity-finish-step{
 display:grid;place-items:center;min-width:0;aspect-ratio:1;border-radius:16px;
 border:2px solid #81bfc0;background:linear-gradient(145deg,#ecffff,#a4efdd);
 color:#125b57;font-size:clamp(17px,3vw,24px);font-weight:900;
 box-shadow:inset 0 2px 5px #ffffffa0,0 3px 8px #438c8030
}
.activity-finish-step.last{
 background:linear-gradient(145deg,#fff8cb,#ffd667);border-color:#cf9b26;color:#705009;
 animation:activityFinishArrive .55s ease-out both
}
@keyframes activityFinishArrive{
 0%{transform:scale(.72);opacity:.45}
 70%{transform:scale(1.1);opacity:1}
 100%{transform:scale(1);opacity:1}
}
.activity-finish-total{color:#235c4e;font-size:15px;margin:5px 0}
.activity-finish-total b{font-size:22px}
.activity-finish-numbers{color:#4e5c68;font-size:13px;line-height:1.5;margin:8px auto;max-width:480px}
.activity-finish-effort{color:#285e47;font-weight:850;font-size:16px;line-height:1.45;margin:15px auto 8px;max-width:515px}
.activity-finish-saved{color:#5b6770;font-size:13px;margin:8px 0 0}
.activity-finish-actions{max-width:650px;margin:14px auto 4px}
.activity-finish-actions .btn:first-child{flex:1 1 100%;font-size:17px}
.activity-finish-actions .btn:not(:first-child){flex:1 1 155px}
@media(max-width:360px){
 #activityRoundResult.activity-finish{padding:18px 10px}
 .activity-finish-journey{gap:4px}
 .activity-finish-step{border-radius:11px}
 .activity-finish-actions .btn{flex:1 1 100%}
}
@media(prefers-reduced-motion:reduce){.activity-finish-step.last{animation:none}}

/* LUMA — in-round progress: visible goal without introducing score or rewards. */
#activityRoundProgress.activity-round-progress{
 max-width:520px;margin:11px auto;padding:10px 13px;text-align:center;
 display:flex;flex-direction:column;align-items:center;gap:9px;
 background:#f7fbff;border:1px solid #dceaf4
}
.activity-round-progress-text{font-size:13px;font-weight:850;color:#456577}
.activity-round-trail{
 width:min(100%,410px);display:grid;grid-template-columns:repeat(6,minmax(0,1fr));gap:7px
}
.activity-round-trail.four{grid-template-columns:repeat(4,minmax(0,1fr));max-width:310px}
.activity-round-dot{
 display:block;min-width:0;height:13px;border-radius:999px;
 background:#e3e8f1;border:1px solid #cdd5e3;transition:background .15s ease,border-color .15s ease
}
.activity-round-dot.current{background:#ece6ff;border:2px solid #6c63ff}
.activity-round-dot.done{background:#2fbd73;border-color:#20955c}
@media(max-width:360px){#activityRoundProgress.activity-round-progress{padding:9px 10px}.activity-round-trail{gap:5px}}
@media(prefers-reduced-motion:reduce){.activity-round-dot{transition:none}}