/* Learn & Play: the same lantern palette, reshaped around short, hands-on lessons. */
body[data-view=learn] .topbar,
body[data-view=learn] #world,
body[data-view=learn] #illustrated-world,
body[data-view=learn] .room-shade,
body[data-view=learn] #touch-magic{display:none!important}
body[data-view=learn] #interface{position:fixed;inset:0;z-index:20;overflow:hidden}
.learn-shell{--learn-paper:#fff8e5;--learn-ink:#34474a;--learn-teal:#28575a;--learn-gold:#eac778;position:absolute;inset:0;overflow:auto;overscroll-behavior:contain;direction:ltr;background:radial-gradient(ellipse at 50% 8%,#637f79 0,transparent 55%),linear-gradient(155deg,#203743,#1f293e 68%,#2f303e);color:#fff7e4;padding:max(22px,env(safe-area-inset-top)) max(20px,calc((100vw - 1060px)/2)) max(30px,env(safe-area-inset-bottom));font:16px/1.5 var(--ui,'Fredoka','Noto Sans Arabic',sans-serif)}
.learn-top{display:flex;align-items:center;justify-content:space-between;gap:12px;max-width:1060px;margin:0 auto 34px}.learn-back{display:inline-flex;align-items:center;justify-content:center;gap:8px;min-height:46px;padding:8px 14px;border:1px solid #e4d2a370;border-radius:24px;background:#192f3dbb;color:#fff4d7;font-size:15px;touch-action:manipulation}.learn-back:hover{background:#33595b}.learn-kicker{color:#e7cc93;font-size:13px;font-weight:600;letter-spacing:2px;text-align:end}.learn-intro{max-width:1060px;margin:0 auto 26px;display:flex;justify-content:space-between;align-items:center;gap:25px}.learn-eyebrow{margin:0 0 6px;color:#ecd091;font-size:13px;font-weight:600;letter-spacing:2px}.learn-intro h1,.learn-lesson-heading h1{font:clamp(30px,5vw,48px)/1.1 Georgia,'Noto Naskh Arabic',serif;font-weight:400;margin:0;color:#fff5dd;letter-spacing:-.6px}.learn-intro>div:first-child>p:last-child{margin:12px 0 0;color:#d5e0d9;font-size:18px}.learn-lantern{flex:0 0 78px;width:78px;height:78px;border-radius:50%;display:grid;place-items:center;color:#fff0bd;font-size:42px;background:radial-gradient(circle,#dfae5e 0 12%,#d18a42 16%,#d4ae6c66 46%,transparent 70%);filter:drop-shadow(0 0 18px #f4bd6077)}
.learn-paths{max-width:1060px;margin:0 auto;display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:16px}.learn-path{min-height:128px;display:grid;grid-template-columns:72px minmax(0,1fr) 42px;align-items:center;gap:16px;text-align:start;padding:18px 20px;background:linear-gradient(140deg,#fff9e9,#f2e7cc);color:#35494a;border:1px solid #fff4d799;border-radius:17px;box-shadow:0 7px 0 #10293266,0 13px 24px #091c2440;touch-action:manipulation;transition:transform .18s,box-shadow .18s}.learn-path:hover{transform:translateY(-3px);box-shadow:0 10px 0 #10293255,0 16px 27px #091c2440}.learn-path-symbol{width:68px;height:68px;border-radius:18px;display:grid;place-items:center;background:#e4eddd;color:#2b5353;font-size:26px;font-weight:700;text-align:center}.learn-path-symbol[lang=ar]{font:32px/1.6 'Noto Naskh Arabic','Noto Sans Arabic',serif}.learn-path-copy{min-width:0;display:grid;gap:2px}.learn-path-copy strong{font-size:21px;line-height:1.25}.learn-path-copy>span{font:17px/1.45 'Noto Naskh Arabic','Noto Sans Arabic',serif;color:#536c67}.learn-path-copy small{font-size:14px;color:#60736c}.learn-path-count{justify-self:end;width:34px;height:34px;border-radius:50%;display:grid;place-items:center;background:#e8d29e;color:#4a4b40;font-weight:700}.learn-note{max-width:1060px;margin:24px auto 0;color:#d5e0d9;font-size:14px}.learn-stories-link{margin-inline-start:auto}
.learn-lesson{padding-bottom:max(20px,env(safe-area-inset-bottom))}.learn-lesson .learn-top{margin-bottom:14px}.learn-lesson-heading{max-width:900px;margin:0 auto 14px;display:flex;justify-content:space-between;align-items:end;gap:15px}.learn-lesson-heading h1 span{display:block;margin-top:6px;font:22px/1.5 'Noto Naskh Arabic','Noto Sans Arabic',serif;letter-spacing:0;color:#edd69f}.learn-step{flex:0 0 auto;color:#ffefc4;background:#203d43;border:1px solid #c5aa6d70;border-radius:22px;padding:7px 13px;margin:0;font-size:14px}.learn-tabs{max-width:900px;margin:0 auto 13px;display:flex;gap:8px}.learn-tabs button{min-height:44px;min-width:112px;padding:7px 14px;border:1px solid #e1d2ae7a;border-radius:22px;background:#203941;color:#fff4d4}.learn-tabs button[aria-pressed=true]{background:#f4dda8;color:#34474a;border-color:#ffefc8}.learn-tabs button span{margin-inline-start:6px;font:15px/1.3 'Noto Naskh Arabic','Noto Sans Arabic',serif}
.learn-content{max-width:900px;margin:0 auto;background:#fff8e7;color:#39484a;border:1px solid #e8d9b6;border-radius:18px;box-shadow:0 10px 30px #071a2560;overflow:hidden}.learn-card{min-height:365px;padding:clamp(18px,3vw,28px);display:flex;flex-direction:column;align-items:center;justify-content:center;text-align:center}.learn-glyph-row{display:flex;align-items:center;justify-content:center;gap:clamp(18px,5vw,50px);min-height:112px}.learn-glyph{display:inline-flex;align-items:center;gap:10px;color:#295257;font:700 clamp(56px,9vw,90px)/1.1 Georgia,serif}.learn-glyph small{font:600 clamp(34px,5vw,52px)/1 Georgia,serif;color:#8a7959}.learn-object{font-size:58px;line-height:1}.learn-example{margin:10px 0 0;color:#455957}.learn-example p{margin:0 0 4px;font-size:15px;color:#738078}.learn-example strong{font-size:20px}.learn-example strong[lang=ar],.learn-example [lang=ar]{font:24px/1.7 'Noto Naskh Arabic','Noto Sans Arabic',serif}.learn-tip{max-width:640px;margin:15px auto 5px;color:#66716b;font-size:15px;line-height:1.55}.learn-speak{display:inline-flex;align-items:center;gap:7px;min-height:44px;margin:12px 0 0;padding:7px 16px;border:1px solid #9caf9c;border-radius:22px;background:#edf2e6;color:#2f5c59}.learn-speak:hover{background:#dce9d9}.learn-practice-action{min-height:46px;padding:8px 15px;border:1px solid #9caf9c;border-radius:22px;background:#e9f0e4;color:#2e5454;font-size:15px}.learn-practice-action span{display:block;font:14px/1.35 'Noto Naskh Arabic','Noto Sans Arabic',serif}.trace-wrap{width:min(100%,480px);margin:17px auto 0}.trace-wrap>p{margin:0 0 8px;color:#66716b;font-size:14px}.trace-pad{position:relative;isolation:isolate;width:100%;height:128px;border:2px dashed #b5aa8b;border-radius:14px;background:repeating-linear-gradient(0deg,#f8f1dc 0 42px,#dacaa7 43px,#f8f1dc 44px);touch-action:none;overflow:hidden}.trace-pad>span{position:absolute;inset:0;z-index:0;display:grid;place-items:center;color:#bca87977;font:700 88px/1 Georgia,serif;pointer-events:none}.trace-pad.trace-rtl>span{font:80px/1.7 'Noto Naskh Arabic','Noto Sans Arabic',serif}.trace-pad canvas{position:absolute;inset:0;z-index:1;width:100%;height:100%;touch-action:none}.trace-wrap .learn-practice-action{margin-top:9px}
.number-pair{display:flex;align-items:baseline;gap:16px}.learn-number{font:700 clamp(62px,12vw,112px)/1 Georgia,serif;color:#295257}.arabic-indic{font:500 clamp(34px,7vw,58px)/1.2 'Noto Naskh Arabic','Noto Sans Arabic',serif;color:#866d46}.number-word{display:flex;justify-content:center;gap:14px;align-items:baseline;margin-top:8px;color:#455957;font-size:22px}.number-word span{font:24px/1.6 'Noto Naskh Arabic','Noto Sans Arabic',serif;color:#365f5d}.number-board{display:grid;justify-items:center}.count-prompt{margin:20px 0 8px;font-size:18px}.count-dots{width:min(100%,440px);min-height:64px;display:flex;flex-wrap:wrap;justify-content:center;align-content:center;gap:9px;padding:10px}.count-dots i,.practice-count i{width:19px;height:19px;border-radius:50%;background:#e2a84f;border:2px solid #a9793e;box-shadow:inset 0 2px 0 #fff4ce}.count-dots i:nth-child(3n+2),.practice-count i:nth-child(3n+2){background:#82a997;border-color:#527b70}.count-dots i:nth-child(3n),.practice-count i:nth-child(3n){background:#d67b61;border-color:#975d50}.empty-basket{font-size:40px}.arabic-card .arabic-glyph-row{gap:clamp(20px,6vw,70px)}.arabic-glyph{font:500 clamp(80px,16vw,142px)/1.2 'Noto Naskh Arabic','Noto Sans Arabic',serif}.arabic-identity{display:grid;justify-items:start;gap:3px;text-align:start}.arabic-identity span:first-child{font:28px/1.65 'Noto Naskh Arabic','Noto Sans Arabic',serif;color:#305b5c}.arabic-identity span:last-child{font-size:16px;color:#65726d}.sound-note{max-width:590px;margin:13px 0 0;display:grid;gap:3px;padding:9px 14px;border-radius:12px;background:#f1ecd9;color:#4f615c;text-align:start}.sound-note strong{font-size:14px;color:#756044}.sound-note span{font-size:16px}.arabic-card .learn-tip{max-width:700px}.vocab-card .word-art{font-size:48px;margin-bottom:1px}.word-english{font-size:22px;font-weight:600;margin:2px 0}.vocab-arabic{font:500 clamp(38px,8vw,66px)/1.6 'Noto Naskh Arabic','Noto Sans Arabic',serif;color:#2d5d5b}.vocab-latin{font-size:16px;color:#65726d}.practice-card{min-height:345px}.practice-prompt{font-size:21px;font-weight:600;margin:2px 0 10px}.practice-letter-target{font:700 clamp(58px,10vw,88px)/1.15 Georgia,'Noto Naskh Arabic',serif;color:#295257;margin:4px 0 12px}.practice-letter-target[lang=ar]{font:500 clamp(70px,13vw,112px)/1.4 'Noto Naskh Arabic','Noto Sans Arabic',serif}.practice-word-target{font-size:23px;margin:10px 0}.practice-count{max-width:550px;min-height:58px;display:flex;flex-wrap:wrap;justify-content:center;align-items:center;gap:7px;margin:6px 0 12px}.practice-count i{width:16px;height:16px}.practice-count>span{font-size:38px}.practice-options{display:flex;justify-content:center;flex-wrap:wrap;gap:12px}.practice-options button{min-width:76px;min-height:58px;padding:8px 14px;border:1px solid #c8b990;border-radius:15px;background:#fffdfa;color:#345457;font-size:22px;touch-action:manipulation}.practice-options button:hover:not(:disabled){background:#eaf0e4}.practice-options button[lang=ar],.practice-options [lang=ar]{font:30px/1.45 'Noto Naskh Arabic','Noto Sans Arabic',serif}.practice-feedback{min-height:26px;color:#527561;font-size:16px;margin:11px 0 0}.learn-pager{max-width:900px;min-height:55px;margin:11px auto 0;display:flex;align-items:center;justify-content:space-between;gap:10px}.learn-nav{min-height:44px;padding:7px 12px;border:1px solid #d8c79a;border-radius:22px;background:#1e3943;color:#fff3d7}.learn-feedback{flex:1;text-align:center;color:#f4e5c0;font-size:15px}
.learn-shell button:focus-visible{outline:3px solid #ffd56d;outline-offset:3px}.learn-shell button:disabled{opacity:.55}.learn-path:focus-visible{outline-color:#ffd56d}.learn-paths [lang=ar],.learn-shell [lang=ar]{font-family:'Noto Naskh Arabic','Noto Sans Arabic',Tahoma,serif}.learn-shell [lang=ar]{unicode-bidi:isolate}.learn-shell .arabic-glyph,.learn-shell .vocab-arabic,.learn-shell .sound-note [lang=ar]{font-feature-settings:normal;font-variant-ligatures:normal;letter-spacing:normal}.learn-shell .learn-back [lang=ar]{font-size:14px}.learn-shell .learn-back span+span{font-family:'Noto Naskh Arabic','Noto Sans Arabic',serif}
@media(max-width:650px){.learn-shell{padding:16px 16px max(22px,env(safe-area-inset-bottom))}.learn-top{margin-bottom:23px}.learn-kicker{display:none}.learn-intro{margin-bottom:18px}.learn-intro h1{font-size:34px}.learn-intro>div:first-child>p:last-child{font-size:16px}.learn-lantern{flex-basis:58px;width:58px;height:58px;font-size:34px}.learn-paths{grid-template-columns:1fr;gap:12px}.learn-path{min-height:100px;padding:13px 15px;grid-template-columns:60px minmax(0,1fr) 34px;gap:12px}.learn-path-symbol{width:56px;height:56px;font-size:22px}.learn-path-copy strong{font-size:19px}.learn-path-copy small{font-size:14px}.learn-note{font-size:14px;margin-top:18px}.learn-lesson .learn-top{margin-bottom:10px}.learn-lesson-heading h1{font-size:31px}.learn-lesson-heading h1 span{font-size:19px}.learn-step{font-size:13px;padding:6px 10px}.learn-content{border-radius:14px}.learn-card{min-height:360px;padding:16px}.learn-glyph-row{min-height:90px}.learn-object{font-size:43px}.learn-example strong{font-size:18px}.learn-tip{font-size:14px}.trace-pad{height:112px}.learn-lesson .learn-top .learn-back{font-size:14px;padding:7px 10px}.learn-back span+span{font-size:13px}.learn-tabs{margin-bottom:10px}.learn-tabs button{min-width:98px}}
@media(max-height:720px) and (min-width:700px){.learn-shell{padding-top:15px;padding-bottom:15px}.learn-top{margin-bottom:13px}.learn-intro{margin-bottom:15px}.learn-intro h1{font-size:38px}.learn-path{min-height:110px}.learn-lesson .learn-card{min-height:300px;padding:14px 20px}.learn-lesson .learn-top{margin-bottom:8px}.learn-lesson-heading{margin-bottom:8px}.learn-tabs{margin-bottom:8px}.learn-lesson .trace-pad{height:94px}.learn-pager{margin-top:5px}}
@media(prefers-reduced-motion:reduce){.learn-path,.learn-back,.learn-path:hover{transition:none;transform:none}}

.learn-levels,.learn-categories{max-width:900px;margin:0 auto 11px;display:flex;justify-content:center;flex-wrap:wrap;gap:8px}.learn-levels button,.learn-categories button{min-height:44px;padding:6px 12px;border:1px solid #d5c293;border-radius:22px;background:#203941;color:#fff2d3;font-size:14px;touch-action:manipulation}.learn-levels button[aria-pressed=true],.learn-categories button[aria-pressed=true]{background:#f4dda8;color:#34474a}.learn-levels button span,.learn-categories button span{display:inline-block;margin-inline-start:7px;font:14px/1.4 'Noto Naskh Arabic','Noto Sans Arabic',serif}.learn-categories{padding:9px 10px 10px;background:#fff8e7;border:1px solid #e8d9b6;border-radius:16px;margin-bottom:-1px}.learn-categories button{background:#305356;color:#fff7e4}.learn-categories button[aria-pressed=true]{background:#f4dda8;color:#34474a}
.learn-audio-row{display:flex;align-items:center;justify-content:center;flex-wrap:wrap;gap:8px;margin-top:10px}.learn-audio-row .learn-speak{margin:0}.learn-audio-stop{min-height:44px;padding:7px 14px;border:1px solid #b9b09c;border-radius:22px;background:#f2eee4;color:#58625d;font-size:14px}.learn-audio-stop:disabled{opacity:.55}.learn-example p{margin:5px 0}.phonetic,.number-phonetics{font:15px/1.4 ui-monospace,Consolas,monospace;color:#635744;unicode-bidi:isolate}.sound-caveat{color:#746246;font-size:14px}.number-phonetics{display:flex;flex-wrap:wrap;justify-content:center;gap:16px;margin-top:4px}.number-phonetics span[lang=ar]{font:15px/1.6 'Noto Naskh Arabic','Noto Sans Arabic',serif}.arabic-sample{font:23px/1.7 'Noto Naskh Arabic','Noto Sans Arabic',serif;color:#335b5a}.word-category{align-self:flex-start;padding:4px 10px;border-radius:15px;background:#e9e5d4;color:#6c6655;font-size:13px;text-transform:capitalize}.practice-word-hint{margin:0 0 4px;font-size:16px;color:#5b6c66}.practice-card .learn-audio-row{margin:0 0 8px}.ten-bundles{display:grid;grid-template-columns:repeat(auto-fit,minmax(70px,1fr));gap:8px;max-width:540px}.ten-bundle{min-width:58px;min-height:36px;display:grid;grid-template-columns:repeat(5,8px);grid-auto-rows:8px;align-content:center;justify-content:center;gap:3px;border:1px solid #bca36e;border-radius:8px;background:#f4ead0}.ten-bundle i,.count-ones i{width:8px;height:8px;border-radius:50%;background:#e2a84f;border:1px solid #a9793e}.ten-bundle i:nth-child(3n+2){background:#82a997;border-color:#527b70}.ten-bundle i:nth-child(3n){background:#d67b61;border-color:#975d50}.count-ones{display:flex;flex-wrap:wrap;justify-content:center;gap:6px;margin-top:8px}.count-ones i{width:15px;height:15px}
@media(max-width:650px){.learn-levels,.learn-categories{gap:6px;margin-bottom:9px}.learn-levels button,.learn-categories button{min-height:44px;padding:6px 9px;font-size:13px}.learn-levels button span,.learn-categories button span{margin-inline-start:4px;font-size:13px}.learn-categories{border-radius:13px}.ten-bundles{grid-template-columns:repeat(auto-fit,minmax(56px,1fr));gap:5px}.ten-bundle{min-width:52px;grid-template-columns:repeat(5,7px);grid-auto-rows:7px;gap:2px}.ten-bundle i{width:7px;height:7px}.learn-audio-row{gap:6px}.learn-audio-stop{font-size:13px;padding:6px 11px}}

.learn-collection-actions{display:flex;align-items:center;justify-content:flex-end;flex-wrap:wrap;gap:9px}
@media(max-width:700px){.learn-collection-actions{justify-content:flex-start;margin-top:12px}}
.learn-free-heading{max-width:1060px;margin:24px auto 12px;color:#f5e6bf;font:500 22px/1.3 Georgia,serif}
.guided-start{max-width:1060px;margin:0 auto 20px;padding:clamp(16px,2.5vw,24px);border:1px solid #d8bd8066;border-radius:20px;background:linear-gradient(135deg,#142d38e8,#243e48e8);box-shadow:0 12px 30px #071b2870}
.guided-heading{display:flex;align-items:flex-start;justify-content:space-between;gap:18px}.guided-heading h2{margin:0;color:#fff1d0;font:400 clamp(24px,3vw,34px)/1.15 Georgia,serif}.guided-heading p:not(.learn-eyebrow){max-width:650px;margin:8px 0 0;color:#d7e1d9}.guided-saved{flex:0 0 auto;color:#f2d89d;font-size:13px}
.guided-choices{display:flex;align-items:center;justify-content:space-between;gap:12px;margin:16px 0 12px}.guided-choice-row{display:flex;flex-wrap:wrap;gap:8px}.guided-choice-row button,.guided-review,.guided-adjust{min-height:44px;padding:8px 14px;border:1px solid #d7c18b77;border-radius:22px;background:#213d47;color:#fff3d5;font-size:15px;touch-action:manipulation}.guided-choice-row button[aria-pressed=true]{background:#f4dda8;color:#35484a;border-color:#fff0c5}.guided-choice-row button span{display:block;font-size:12px;opacity:.82}.language-choices button[lang=ar]{font:19px/1.5 'Noto Naskh Arabic','Noto Sans Arabic',serif}
.guided-steps{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:8px;list-style:none;margin:10px 0;padding:0}.guided-steps li{min-width:0}.guided-steps button{width:100%;min-height:70px;display:grid;grid-template-columns:28px minmax(0,1fr) auto;align-items:center;gap:9px;padding:10px 12px;text-align:start;border:1px solid #e8dab577;border-radius:13px;background:#fff8e9;color:#3c5050}.guided-steps button:not(:disabled):hover{background:#f2e7ce}.guided-steps button:disabled{opacity:.52}.guided-steps button.is-done{background:#e6f0e3;border-color:#99b49c}.guided-step-mark{width:26px;height:26px;display:grid;place-items:center;border-radius:50%;background:#ead7a5;color:#47544b;font-weight:700}.guided-step-state{padding:4px 8px;border-radius:14px;background:#e8e0c9;color:#53605a;font-size:12px}.guided-steps strong,.guided-steps small{display:block}.guided-steps strong{font-size:16px}.guided-steps small{margin-top:3px;color:#62706b;font-size:13px;line-height:1.3}.guided-actions{display:flex;align-items:center;flex-wrap:wrap;gap:9px;margin-top:10px}.guided-primary{min-height:46px;padding:9px 18px;border:1px solid #fff0c5;border-radius:24px;background:#f3d995;color:#34484a;font-weight:700}.guided-review{background:#355351}.guided-adjust{background:#253d4e}.guided-complete{margin:3px 0;color:#deebdc}.guided-privacy{margin:12px 0 0;color:#c9d8d3;font-size:12px}
.guided-context{max-width:900px;margin:0 auto 12px;padding:12px 15px;display:flex;align-items:center;flex-wrap:wrap;gap:10px;border:1px solid #d4bd806e;border-radius:14px;background:#213b46;color:#fff4d8}.guided-context>div{display:grid;gap:2px;flex:1 1 300px}.guided-context strong{font-size:17px}.guided-context span,.guided-context small,.guided-review-count{color:#d4e0da;font-size:13px}.guided-context button{min-height:42px;padding:7px 13px;border:1px solid #e4d2a370;border-radius:22px;background:#314e52;color:#fff4d8}.guided-context .guided-hint{flex:1 1 100%;margin:0;padding:8px 10px;border-radius:10px;background:#fff7e6;color:#485854;font-size:14px}.guided-context .guided-adjust{background:transparent}.spelling-board{margin:12px auto;padding:16px 22px;border:2px dashed #c6af75;border-radius:16px;background:#f5edd8;color:#2e5858;font:700 clamp(38px,8vw,66px)/1.15 Georgia,serif;letter-spacing:.12em;text-align:center}
@media(max-width:700px){.learn-free-heading{font-size:20px}.guided-start{padding:15px;margin-bottom:16px}.guided-heading{display:block}.guided-heading h2{font-size:26px}.guided-saved{margin:8px 0 0!important}.guided-choices{display:grid;justify-content:stretch}.guided-choice-row{justify-content:flex-start}.guided-choice-row button{flex:1 1 auto}.guided-steps{grid-template-columns:1fr;gap:7px}.guided-steps button{min-height:64px}.guided-context{align-items:flex-start}.guided-context>div{flex-basis:100%}.guided-context .guided-adjust{flex:1 1 100%}}

.skill-demo{display:grid;gap:18px}.sound-tiles,.arabic-forms,.sound-change{display:flex;align-items:center;justify-content:center;gap:14px;flex-wrap:wrap;padding:22px;border-radius:18px;background:#f8f0df}.sound-tiles span,.sound-tiles strong,.arabic-forms span{min-width:54px;min-height:54px;display:grid;place-items:center;padding:8px;border-radius:14px;background:white;box-shadow:0 3px 9px #60452520;font-size:1.6rem}.sound-focus{outline:3px solid #db986b}.sound-change strong{font-size:2rem}.counter-groups{display:flex;justify-content:center;gap:22px;flex-wrap:wrap}.counter-groups>div{display:grid;gap:8px;justify-items:center;padding:14px;border:2px solid #ead5af;border-radius:16px}.counter-groups>div>span{display:flex;gap:5px;flex-wrap:wrap;max-width:190px}.math-dot{display:inline-block;width:22px;height:22px;border-radius:50%;background:#e89a64}.math-equation{display:block;text-align:center;font-size:2rem}.guided-story-link{grid-column:1/-1}.learn-story-prompt{margin:12px auto;padding:16px 20px;max-width:600px;background:#fff5dc;border:1px solid #e9c994;border-radius:16px}.learn-story-prompt p{margin:8px 0}.learn-story-prompt button{min-height:44px}

.place-value-pairs{display:flex;justify-content:center;gap:14px;flex-wrap:wrap}.place-value-card{display:grid;grid-template-columns:1fr 1fr;gap:6px;padding:12px;border:2px solid #ead5af;border-radius:14px}.place-value-card>b{grid-column:1/-1;text-align:center}.place-value-label{font-size:.85rem;color:#75604d}.place-value-shapes{display:flex;gap:4px;align-items:center;min-height:38px}.ten-rod{display:inline-block;width:12px;height:34px;border-radius:5px;background:#7aa4a1}

.workshop-launches{max-width:1060px;margin:14px auto 22px;padding:16px;border:1px solid #d8bd8066;border-radius:16px;background:#193640;color:#fff3d5}.workshop-launches h2{margin:0;font:500 20px/1.25 Georgia,serif}.workshop-launches p{margin:6px 0 12px;color:#d5e1da;font-size:14px}.workshop-launches>div{display:flex;flex-wrap:wrap;gap:8px}.workshop-launches button,.hands-on-actions button{min-height:46px;padding:8px 14px;border:1px solid #d8c698;border-radius:22px;background:#fff8e7;color:#34484a;font-size:15px;touch-action:manipulation}.sound-boxes,.tile-word-slots{display:flex;justify-content:center;gap:9px;flex-wrap:wrap;margin:12px 0}.sound-boxes>div{min-width:78px;min-height:78px;display:grid;align-content:center;gap:6px;border:2px solid #90a8a0;border-radius:14px;background:#f8f2e4}.sound-boxes span{color:#69766e;font-size:12px}.sound-boxes strong,.tile-word-slots strong{font:700 30px/1.15 Georgia,serif;color:#285457}.tile-word-slots strong{width:64px;height:64px;display:grid;place-items:center;border:2px dashed #a99b77;border-radius:13px;background:#f7f0df}.hands-on-tiles,.hands-on-actions{display:flex;justify-content:center;flex-wrap:wrap;gap:9px;margin:10px 0}.hands-on-tiles button{min-width:58px;min-height:58px;padding:8px 14px;border:2px solid #b9a879;border-radius:14px;background:#fffefa;color:#285457;font:700 27px/1 Georgia,serif;touch-action:manipulation}.hands-on-tiles button:disabled{opacity:.48}.ten-frame-grid{display:grid;grid-template-columns:repeat(5,minmax(42px,66px));gap:7px;justify-content:center;max-width:420px;margin:12px auto}.ten-frame-grid button{aspect-ratio:1;min-width:42px;min-height:42px;display:grid;place-items:center;border:2px solid #9a9a7d;border-radius:10px;background:#fffefa;touch-action:manipulation}.ten-frame-grid button[aria-pressed=true]{background:#e9f1e7;border-color:#719187}.ten-frame-grid button:disabled{opacity:1}.ten-frame-grid i{width:23px;height:23px;border-radius:50%;background:#e2a84f;border:2px solid #a9793e;box-shadow:inset 0 2px 0 #fff4ce}.frame-count{margin:5px 0;color:#52665d;font-weight:600}.hands-on-card .practice-note{margin:3px 0;color:#627568;font-size:14px}
@media(max-width:650px){.workshop-launches{padding:14px}.workshop-launches>div{display:grid;grid-template-columns:1fr}.workshop-launches button{width:100%}.sound-boxes>div{min-width:66px;min-height:66px}.tile-word-slots strong{width:56px;height:56px}.ten-frame-grid{grid-template-columns:repeat(5,minmax(38px,54px));gap:5px}.ten-frame-grid button{min-width:38px;min-height:38px}}


/* Samana’s World activity desk — shared structure, controls and feedback. */
.learn-shell{--learn-ink:#263f45;--learn-paper:#fffdf8;--learn-teal:#2e625d;--learn-gold:#f2c66d;--learn-muted:#526b6b;--learn-line:#cbd7ce;--learn-wash:#eff3ec;padding:0 0 max(28px,env(safe-area-inset-bottom));background:#f5f2e9;color:var(--learn-ink);font:18px/1.5 var(--read,'Andika','Noto Sans Arabic',sans-serif);scrollbar-gutter:stable}
.learn-shell *{box-sizing:border-box}.learn-shell button,.learn-shell input,.learn-shell select,.learn-shell textarea{font:inherit}.learn-shell button{touch-action:manipulation}.learn-shell button:not(.read-word){min-height:48px}.learn-shell button:disabled{cursor:default}.learn-shell :is(button,input,select,textarea,summary):focus-visible{outline:3px solid #175fc1;outline-offset:4px}.learn-shell h1:focus{outline:none}.learn-shell h1,.learn-shell h2,.learn-shell h3,.learn-shell strong{color:var(--learn-ink)}.learn-shell h1,.learn-shell h2,.learn-shell h3{font-family:var(--ui,'Fredoka',sans-serif);font-weight:500;line-height:1.2;letter-spacing:0}.learn-shell h1{font-size:clamp(28px,3.5vw,40px);margin:0}.learn-shell h2{font-size:clamp(23px,2.7vw,31px)}.learn-shell h3{font-size:23px}.learn-shell p{max-width:100%}.learn-shell .learn-eyebrow{color:var(--learn-muted);letter-spacing:.09em;font-size:13px;font-weight:700}.learn-shell .fine-print,.learn-shell .local-note{font-size:14px;color:var(--learn-muted);line-height:1.6}.local-note{text-align:center;margin:24px 0 0}.learn-main{width:min(1040px,100%);padding:24px 28px 36px;margin:0 auto}.learn-top{position:sticky;top:0;z-index:10;max-width:none;margin:0;min-height:78px;padding:12px max(22px,calc((100vw - 1000px)/2));display:flex;align-items:center;gap:16px;background:#243f45;color:#fff;border:0;box-shadow:0 3px 12px #14253b18}.learn-top .learn-back{background:#ffffff12;border:1px solid #ffffff50;border-radius:14px;color:#fff;min-width:92px;padding:9px 16px;font:500 16px/1.3 var(--ui);box-shadow:none}.learn-top .learn-back:hover{background:#ffffff24}.learn-brand{font:500 22px/1.2 var(--ui);flex:1;text-align:center;letter-spacing:.2px}.learn-brand>span{display:block;font:14px/1.3 var(--read);color:#d2e2f6;margin-top:3px}.learner-chip{display:flex;align-items:center;gap:9px;background:#ffffff12;color:#fff;border:1px solid #ffffff50;border-radius:14px;padding:8px 12px;font-size:14px!important}.learner-chip>span:first-child{font-size:23px}.learn-lesson-heading{display:flex;align-items:center;justify-content:space-between;gap:14px;max-width:940px;margin:0 auto 20px}.learn-lesson-heading h1{color:var(--learn-ink);font-weight:500}.learn-lesson-heading h1>span{display:block;font:20px/1.7 'Noto Sans Arabic',sans-serif;margin-top:4px;color:var(--learn-muted)}.learner-label{font-size:15px;color:var(--learn-muted);white-space:nowrap}.learn-shell button:not([class]){border:1.5px solid #c1cede;border-radius:13px;background:var(--learn-paper);color:#254563;padding:10px 16px}.learn-shell :is(.feature-primary,.guided-primary,.learn-practice-action){min-height:54px;padding:12px 24px;border:2px solid #b7862d;border-radius:15px;background:var(--learn-gold);color:#233852;font:600 18px/1.3 var(--ui);box-shadow:0 3px 0 #b7862d;cursor:pointer}.learn-shell :is(.feature-primary,.guided-primary,.learn-practice-action):hover{background:#ffd37b}.learn-shell :is(.feature-primary,.guided-primary,.learn-practice-action):active{transform:translateY(2px);box-shadow:0 2px 0 #b7862d}.learn-shell :is(.quiet-action,.review-link){background:transparent;border:0;border-radius:12px;color:#315c84;font-size:16px;text-decoration:underline;text-underline-offset:4px;padding:10px 12px}.learn-shell details{border:1px solid var(--learn-line);border-radius:16px;background:#ffffffb3;padding:0 18px;margin:16px 0}.learn-shell summary{min-height:52px;display:flex;align-items:center;gap:10px;padding:12px 0;font-size:16px;font-weight:700;color:#385772;cursor:pointer;list-style:none}.learn-shell summary::-webkit-details-marker{display:none}.learn-shell summary:before{content:'+';font:500 25px/1 var(--ui);width:22px;flex:none}.learn-shell details[open]>summary:before{content:'−'}.learn-shell details[open]{padding-bottom:16px}.learn-shell details p{font-size:16px;color:var(--learn-muted)}.learn-shell details summary span{font-size:14px;font-weight:400;margin-left:auto}.learn-shell .adult-note{margin-top:22px;background:var(--learn-wash);border:1px solid var(--learn-line)}.learn-shell .adult-note summary{min-height:44px;font-size:14px}.learn-shell .adult-note p{font-size:14px;margin:5px 0}.home-greeting{display:flex;align-items:center;justify-content:space-between;gap:16px;margin-bottom:20px}.home-greeting>span{color:var(--learn-muted);font-size:16px}.next-adventure{position:relative;display:grid;grid-template-columns:minmax(0,1fr) 210px;align-items:center;gap:10px;background:var(--learn-paper);border:1px solid var(--learn-line);border-radius:26px;overflow:hidden;box-shadow:0 8px 30px #20375308}.next-copy{padding:30px 12px 30px 32px;position:relative;z-index:1}.next-copy h2{margin:4px 0 10px;font-size:clamp(27px,3.4vw,38px)}.next-copy>p:not(.learn-eyebrow){margin:0 0 22px;max-width:570px;color:var(--learn-muted);line-height:1.5}.home-milo{width:220px;height:245px;object-fit:contain;align-self:end;margin-top:12px;transform:translate(6px,12px);filter:drop-shadow(0 8px 10px #21385518)}.path-caption{display:block;margin-top:15px;color:var(--learn-muted);font-size:14px}.home-choice-heading{margin:26px 0 14px}.home-choice-heading h2{font-size:22px;margin:0}.activity-doors{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:14px}.activity-door{min-height:168px;display:flex;align-items:flex-start;flex-direction:column;text-align:left;gap:6px;border:1px solid #c0d2be;border-radius:22px;padding:20px;background:#e6eee5;color:var(--learn-ink);box-shadow:0 2px 0 #c0d2be;transition:transform .15s ease}.activity-door:hover{transform:translateY(-3px)}.activity-door strong{font:500 24px/1.2 var(--ui);margin-top:3px}.activity-door>span:last-child{font-size:15px;line-height:1.4;color:var(--learn-muted)}.door-symbol{font:600 36px/1 var(--ui);display:flex;align-items:center;gap:10px;min-height:48px}.door-symbol small{font-size:22px;color:#58779a}.door-read{background:#fff0c8;border-color:#e4cc91;box-shadow:0 2px 0 #e4cc91}.door-create{background:#f2e4dc;border-color:#dbc5b7;box-shadow:0 2px 0 #dbc5b7}.door-read .door-symbol{font-size:40px}.door-create .door-symbol{font-size:54px}.mission-home-link{display:flex;align-items:center;text-align:left;gap:15px;width:100%;padding:16px 20px;margin:20px 0;background:var(--learn-paper);border:1px solid var(--learn-line);border-radius:18px}.mission-home-link>span:first-child{font-size:32px}.mission-home-link strong,.mission-home-link small{display:block}.mission-home-link strong{font-size:18px}.mission-home-link small{font-size:14px;color:var(--learn-muted);margin-top:3px}.guided-choices{display:flex;flex-wrap:wrap;gap:14px;margin:14px 0}.guided-choice-row{display:flex;gap:8px;flex-wrap:wrap}.learn-shell .guided-choice-row button{border:1.5px solid #bccbdd;border-radius:12px;background:var(--learn-paper);color:#294663;padding:9px 17px;min-height:48px}.learn-shell .guided-choice-row button[aria-pressed=true]{background:var(--learn-teal);border-color:var(--learn-teal);color:#fff}.learn-shell .guided-steps{list-style:none;padding:0;display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:8px}.learn-shell .guided-steps button{min-height:62px;width:100%;display:grid;grid-template-columns:28px 1fr auto;gap:10px;align-items:center;text-align:left;border-radius:12px;background:var(--learn-paper);color:var(--learn-ink);border:1px solid var(--learn-line);padding:9px 12px;font-size:16px}.learn-shell .guided-steps button small{color:var(--learn-muted);font-size:13px}.learn-shell .guided-step-mark{background:#e4ece0;color:#284969}.learn-paths{max-width:none;display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:10px}.learn-shell .learn-path{min-height:120px;display:flex;align-items:center;gap:16px;text-align:left;padding:16px;border:1px solid var(--learn-line);border-radius:16px;background:var(--learn-paper);color:var(--learn-ink);box-shadow:none}.learn-path>span:last-child{display:grid;gap:4px}.learn-path strong{font-size:20px}.learn-path small{font-size:14px;color:var(--learn-muted)}.learn-path-symbol{min-width:70px;color:#274d76;font:600 34px/1.3 var(--ui)}
.feature-panel{max-width:940px;margin:0 auto;padding:28px;border:1px solid var(--learn-line);border-radius:24px;background:var(--learn-paper);box-shadow:0 7px 25px #223f6207}.feature-intro{margin:0 0 22px;color:var(--learn-muted);font-size:19px}.feature-panel>h2{margin-top:0}.feature-panel .fine-print{margin-top:20px}.practice-selection{display:grid;grid-template-columns:220px minmax(0,1fr);gap:14px}.mix-choice{display:flex;flex-direction:column;justify-content:center;align-items:center;gap:13px;border:2px solid #e3bd69;border-radius:19px;background:#fff0c6;color:var(--learn-ink);padding:20px;text-align:center}.mix-choice>span{font-size:50px;color:#be7e1e}.mix-choice strong{font:500 26px/1.2 var(--ui)}.mix-choice small{font-size:14px;color:#6d5e3a}.bank-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:11px}.learn-shell .bank-grid button{display:flex;flex-direction:column;align-items:flex-start;text-align:left;min-height:138px;gap:6px;padding:16px;border:1.5px solid var(--learn-line);border-radius:17px;background:var(--learn-wash);color:var(--learn-ink)}.bank-grid strong{font:500 20px/1.2 var(--ui)}.bank-grid button>span:last-child{font-size:14px;line-height:1.4;color:var(--learn-muted)}.bank-symbol{font:600 27px/1.2 var(--ui);color:#365f92;min-height:33px}.bank-grid button:hover{border-color:#5085b9;background:#e3eddf}.resume-strip{display:flex;align-items:center;justify-content:space-between;gap:15px;padding:16px;border-radius:17px;background:#e5f2e9;margin-bottom:18px}.workshop-launches{max-width:none;padding:0 18px!important;background:var(--learn-wash)!important;color:#294663!important}.workshop-launches>div{padding-bottom:16px;display:flex;flex-wrap:wrap;gap:8px}.workshop-launches button{background:#fff!important;color:#294663!important;border-color:#bccdde!important}.session-settings{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:16px}.learn-shell label{display:flex;flex-direction:column;gap:7px;font-size:16px;color:#38536d}.learn-shell input,.learn-shell select,.learn-shell textarea{width:100%;min-height:48px;border:1.5px solid #b8c9dc;border-radius:12px;background:var(--learn-paper);color:var(--learn-ink);padding:10px 12px;font-size:17px}.learn-shell textarea{min-height:92px;resize:vertical}.learn-shell .session-progress{display:flex;align-items:center;justify-content:space-between;gap:18px;color:var(--learn-muted);font-size:15px;margin-bottom:22px}.session-progress progress{width:150px;max-width:45%;height:10px;accent-color:#487cab;border:0;border-radius:8px;overflow:hidden}.learn-shell .practice-card{text-align:center;max-width:820px;display:block}.learn-shell .practice-prompt{font-size:clamp(23px,2.8vw,31px);color:var(--learn-ink);margin:8px 0 20px;line-height:1.4}.learn-shell .practice-options{display:flex;flex-wrap:wrap;justify-content:center;gap:14px;margin:24px 0 16px}.learn-shell .practice-options button{position:relative;min-width:100px;min-height:76px;max-width:100%;flex:1 1 100px;padding:14px 18px;border:2px solid #b5c9de;border-radius:18px;background:var(--learn-wash);color:var(--learn-ink);box-shadow:0 4px 0 #b5c9de;font:500 clamp(24px,3.2vw,34px)/1.4 var(--ui);overflow-wrap:anywhere}.learn-shell .practice-options button:hover:not(:disabled){background:#e3eddf;border-color:#618eb9}.learn-shell .practice-options button.answer-correct,.learn-shell .mission-choice button.answer-correct{background:#dff4e5;border-color:#4f9b6d;box-shadow:0 4px 0 #4f9b6d;opacity:1}.learn-shell .practice-options button.answer-retry{border-style:dashed;background:#fff6df}.answer-mark{margin-left:12px;font-size:22px}.answer-feedback{min-height:52px;margin:13px 0 16px;color:#315b75;font-size:18px;line-height:1.5}.answer-feedback strong,.answer-feedback span{display:block}.answer-feedback span{font-size:16px}.practice-card[data-result=right] .answer-feedback strong{color:#236446}.practice-card>.quiet-action,.mission-panel>.quiet-action{display:block;margin:16px auto 0}.round-complete{text-align:center;max-width:650px;padding:40px}.round-complete img{object-fit:contain;margin-bottom:15px}.round-complete button{display:block;margin:18px auto 0}.celebrate-symbol{font-size:72px;color:#cf8a18}.celebrate-symbol .learn-icon{width:72px;height:72px;fill:#f2c45a;stroke:#cf8a18}.tap-counters{display:grid;grid-template-columns:repeat(5,48px);justify-content:center;gap:10px;margin:22px auto}.learn-shell .tap-counters button{width:48px;height:48px;padding:0;border:2px solid #d28b3c;border-radius:50%;background:#ffd390;color:#97581e;font-size:30px;box-shadow:0 3px 0 #d28b3c}.learn-shell .tap-counters button[aria-pressed=true]{background:#22577e;color:#fff;border-color:#163e5b;box-shadow:0 3px 0 #163e5b}.counter-tally{font-size:17px;color:#516b85}.word-to-say{font:500 54px/1.3 var(--ui);color:var(--learn-teal)}.learn-shell .learn-audio-row{display:flex;align-items:center;justify-content:center;gap:10px;flex-wrap:wrap;margin:14px 0}.learn-shell .learn-speak,.learn-shell .learn-audio-stop{min-height:48px;background:var(--learn-wash);color:var(--learn-teal);border:1px solid #aac6e2;border-radius:14px;padding:10px 16px;font-size:16px;box-shadow:none}.learn-shell .learn-audio-stop:disabled{display:none}.learn-shell .practice-feedback{font-size:18px;color:#305d78;min-height:28px;margin:14px 0}.learn-shell .practice-count{display:flex;flex-wrap:wrap;justify-content:center;gap:9px;max-width:500px;margin:20px auto}.learn-shell .practice-count>i,.learn-shell .count-dots>i{width:25px;height:25px;border:2px solid #bd8541;border-radius:50%;background:#ffc565}.learn-shell .spelling-board{font-family:var(--ui);color:var(--learn-teal);background:var(--learn-wash);border:2px dashed #98b6d5;margin:20px auto;font-size:clamp(40px,8vw,66px);letter-spacing:.12em}.learn-shell .math-equation{font:500 40px/1.3 var(--ui);margin:20px 0;color:#294e76}.counter-set{display:grid;gap:9px;padding:16px;background:var(--learn-wash);border:1px solid var(--learn-line);border-radius:16px}.place-value-shapes{display:flex;justify-content:center;gap:6px;flex-wrap:wrap;max-width:250px}.learn-shell .math-dot{background:#ffc35c;border:1px solid #b88535;width:22px;height:22px}.learn-shell .ten-rod{background:repeating-linear-gradient(to bottom,#6395c6 0 5px,#a9c6e1 5px 6px);width:15px;height:60px;border:1px solid #477399;border-radius:4px}.learn-shell .counter-groups{align-items:stretch}.learn-shell .learn-tip,.learn-shell .sound-caveat{color:var(--learn-muted);font-size:15px;line-height:1.6}.learn-shell .learn-tip{max-width:650px;margin:15px auto}.learn-shell .practice-word-target{font-size:86px;margin:16px 0}
.readalong-panel{max-width:850px;text-align:center}.readalong-toolbar{display:flex;justify-content:center;gap:8px;margin-bottom:20px}.readalong-toolbar button[aria-pressed=true]{background:var(--learn-teal)!important;color:#fff!important;border-color:var(--learn-teal)!important}.reading-steps{display:flex;justify-content:center;gap:8px;margin:10px 0 20px}.reading-steps span{padding:7px 15px;font-size:14px;color:#5c748c;background:#edf2f8;border-radius:22px}.reading-steps span[aria-current=step]{background:#fff0bf;color:#725213;font-weight:700}.readalong-panel h2{font-size:28px}.read-page{border:1px solid var(--learn-line);border-radius:20px;background:var(--learn-paper);padding:24px;margin:20px 0}.read-page-number{font-size:14px;color:var(--learn-muted);margin:0 0 20px}.readalong-lines{min-height:150px;display:grid;align-content:center}.readalong-lines p{margin:0;font-family:var(--read);line-height:1.9}.learn-shell .read-word{display:inline-block;border:0;border-bottom:2px solid #a4c2de;border-radius:9px;background:transparent;color:#243e5b;font:inherit;font-size:clamp(27px,4vw,38px);padding:3px 7px;min-height:48px;margin:2px 0}.learn-shell .read-word:hover,.learn-shell .read-word.word-speaking{background:#ffe9a7;border-bottom-color:#c2942f}.silent-word{border-bottom-color:transparent!important}.read-voice-note{font-size:15px;color:var(--learn-muted);margin:22px 0}.read-page-actions{display:flex;justify-content:center;gap:12px;flex-wrap:wrap}.read-task{padding:10px 0}.read-task .practice-options button{font-size:24px}.sequence-list{list-style:none;padding:0;display:grid;gap:10px;text-align:start}.sequence-list li{display:grid;grid-template-columns:30px minmax(0,1fr) auto;align-items:center;gap:12px;padding:13px;border:1px solid var(--learn-line);border-radius:15px;background:var(--learn-wash);font-size:18px}.sequence-number{width:28px;height:28px;display:grid;place-items:center;border-radius:50%;background:#ddeaf7;color:#315980;font-size:15px}.sequence-list li>div{display:flex;gap:5px}.sequence-list button{padding:0!important;min-width:46px!important;height:46px!important;font-size:22px!important}.reader-finish{padding:22px;border-radius:18px;background:#e5f4e9;display:flex;flex-wrap:wrap;gap:12px;align-items:center;justify-content:center}.reader-finish strong{width:100%;font-size:23px}.mission-cards{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:16px;margin:20px 0}.learn-shell .mission-cards button{display:flex;flex-direction:column;align-items:center;gap:13px;padding:30px 18px;background:#fff3d6;border:2px solid #e5c785;border-radius:22px}.mission-cards button>span{font-size:57px}.mission-cards strong{font:500 27px/1.2 var(--ui)}.mission-cards small{font-size:16px;color:#725e3d}.mission-panel{text-align:center}.mission-request{display:grid;justify-items:center;gap:8px;margin-bottom:22px}.mission-request h2{margin:0;max-width:660px}.mission-request-icon{font-size:52px}.mission-choice-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(145px,1fr));gap:14px;margin:22px 0}.mission-choice{display:flex;flex-direction:column;gap:8px}.learn-shell .mission-choice>button:first-child{display:flex;flex-direction:column;align-items:center;gap:6px;flex:1;border:2px solid #c4d6e6;border-radius:18px;background:var(--learn-wash);padding:18px 10px;box-shadow:0 4px 0 #c4d6e6}.mission-choice button>span:first-child{font-size:46px}.mission-choice button strong{font-size:20px}.mission-choice button [lang=ar]{font-size:24px;line-height:1.8}.learn-shell .mission-audio{border:0!important;background:transparent!important;color:#2b5c8a!important;font-size:14px!important;text-decoration:underline;text-underline-offset:3px}
.studio-panel{max-width:1000px}.studio-workspace{display:grid;grid-template-columns:minmax(0,1fr) 230px;gap:18px;align-items:start}.studio-stage{border:2px solid #9db4ce;border-radius:18px;overflow:hidden;box-shadow:0 5px 0 #cedae7;background:var(--learn-paper)}.studio-canvas{width:100%;height:auto;display:block;touch-action:none;user-select:none;aspect-ratio:5/3}.studio-toolbox{padding:0 0 0 2px}.studio-toolbox h2{font-size:18px;margin:0 0 9px}.studio-toolbox h2:not(:first-child){margin-top:19px}.studio-colors{display:flex;gap:5px;flex-wrap:wrap}.learn-shell .studio-colors button{width:44px;min-height:48px;padding:4px;border:2px solid transparent;border-radius:12px;background:transparent}.studio-colors i{display:block;width:28px;height:28px;border-radius:50%;border:2px solid #ffffff;box-shadow:0 0 0 1px #9cb0c5}.learn-shell .studio-colors button[aria-pressed=true]{border-color:var(--learn-teal);background:#e2edfa}.studio-stickers{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:5px}.learn-shell .studio-stickers button{min-height:68px;padding:7px 4px;background:var(--learn-wash);border:1px solid #c6d5e5;border-radius:12px}.studio-stickers button>span{font-size:26px;display:block}.studio-stickers small{display:block;font-size:12px}.studio-backgrounds{display:flex;gap:5px;flex-wrap:wrap}.learn-shell .studio-backgrounds button{font-size:14px;padding:8px}.studio-backgrounds button[aria-pressed=true]{background:var(--learn-teal)!important;color:#fff!important}.studio-actions{display:flex;flex-wrap:wrap;align-items:center;gap:8px;margin:15px 0}.studio-actions button{font-size:14px!important;padding:8px 12px!important}.draft-label{font-size:13px;color:#5b7187;margin-left:auto}.sticker-controls{display:flex;flex-wrap:wrap;align-items:end;gap:14px;margin:20px 0;padding:14px;border-radius:16px;background:var(--learn-wash)}.sticker-controls>label{min-width:160px;flex:1}.sticker-controls>div{display:flex;gap:5px;flex-wrap:wrap}.sticker-controls button{padding:8px 12px!important}.studio-tell{max-width:650px;margin:28px auto 0;padding-top:24px;border-top:1px solid var(--learn-line);display:grid;gap:16px}.studio-tell h2{margin:0}.studio-tell .feature-primary{justify-self:start}.studio-tell .answer-feedback{margin:0;min-height:0}.studio-gallery{margin-top:28px!important}.saved-scenes{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:14px}.saved-scenes article{min-width:0;border:1px solid var(--learn-line);border-radius:16px;overflow:hidden;background:var(--learn-paper)}.saved-scenes article>button:first-child{display:block;width:100%;text-align:left;padding:0!important;border:0!important;border-radius:0!important}.saved-scenes article strong,.saved-scenes article button>span{display:block;padding:9px 12px 0;overflow-wrap:anywhere}.saved-scenes article button>span{font-size:14px;padding-top:4px;padding-bottom:9px;color:var(--learn-muted)}.saved-scenes .studio-canvas{pointer-events:none}.saved-scenes .quiet-action{font-size:14px;margin:0 4px}
.family-panel h2{font-size:24px;margin:30px 0 14px}.family-panel h2:first-of-type{margin-top:20px}.profile-list{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:12px}.learn-shell .profile-list button{display:flex;flex-direction:column;align-items:center;gap:7px;min-height:130px;padding:15px;border:2px solid var(--learn-line);border-radius:18px;background:var(--learn-wash)}.profile-list button>span{font-size:34px}.profile-list strong{font-size:17px;overflow-wrap:anywhere}.profile-list small{font-size:13px;color:#567189}.profile-list button[aria-pressed=true]{background:#fff1cc!important;border-color:#cfab58!important}.profile-edit{padding:18px;margin-top:18px;background:var(--learn-wash);border-radius:18px;display:grid;grid-template-columns:minmax(0,1fr) auto;align-items:end;gap:18px}.avatar-picks{display:flex;flex-wrap:wrap;gap:5px}.learn-shell .avatar-picks button{font-size:25px;width:48px;padding:5px;background:var(--learn-paper);border:1.5px solid #bfcede;border-radius:12px}.avatar-picks button[aria-pressed=true]{border-color:#234d79!important;background:#dceafb!important}.progress-summary{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:12px;margin:18px 0 28px}.progress-summary>div{display:flex;flex-direction:column-reverse;justify-content:end;gap:7px;background:var(--learn-wash);border:1px solid var(--learn-line);border-radius:17px;padding:18px}.progress-summary dt{font-size:15px;color:#506982}.progress-summary dd{margin:0;font:500 33px/1 var(--ui);color:#264e79}
/* Keep the established hands-on lesson controls in the same visual language. */
.learn-lesson{padding:0 0 28px}.learn-lesson>.learn-lesson-heading{padding:25px 24px 0}.learn-lesson>.learn-content{max-width:900px;margin:auto;padding:0 24px}.learn-lesson .learn-card{background:var(--learn-paper);border:1px solid var(--learn-line);border-radius:24px;color:var(--learn-ink);box-shadow:0 6px 22px #243b5508;padding:25px;max-width:900px}.learn-lesson .learn-step{background:#e2ecf7;color:#385d7e;border:0;font-size:15px;padding:8px 12px}.learn-lesson .learn-tabs{margin:17px auto;display:flex;max-width:400px;justify-content:center;gap:8px}.learn-lesson .learn-tabs button{min-width:140px;min-height:50px;border:1.5px solid #a9c2db;border-radius:14px;background:var(--learn-paper);color:#365a7b;padding:9px 15px;box-shadow:none;font-size:17px}.learn-lesson .learn-tabs button[aria-pressed=true]{background:var(--learn-teal);color:#fff;border-color:var(--learn-teal)}.learn-tabs button>span{font-size:14px}.learn-lesson .guided-context{max-width:852px;margin:15px auto;padding:0;display:flex;align-items:center;flex-wrap:wrap;gap:10px;background:transparent;border:0;color:#2a4b6a}.guided-context .adult-note{margin:0;flex:1;background:var(--learn-paper)}.learn-lesson .guided-context button{min-height:48px;border:1px solid #b7cbdf;background:var(--learn-paper);color:#315b7c;padding:9px 16px;font-size:16px;border-radius:13px}.learn-lesson .guided-context .guided-hint{background:#fff0c8;color:#5a4b28;padding:15px;font-size:16px;width:100%;flex-basis:100%;border-radius:15px}.learn-lesson .learn-pager{max-width:900px;padding:0 24px;margin:18px auto;display:flex;align-items:center;gap:12px}.learn-lesson .learn-nav{border:1px solid #afc5dc;background:var(--learn-paper);color:var(--learn-teal);border-radius:14px;padding:9px 15px;font-size:16px;min-height:48px;box-shadow:none}.learn-lesson .learn-feedback{font-size:16px;color:var(--learn-teal);flex:1}.learn-lesson .learn-nav:disabled{visibility:hidden}.learn-shell .learn-glyph,.learn-shell .learn-number{color:var(--learn-teal)}.learn-shell .learn-example,.learn-shell .learn-example p,.learn-shell .number-word,.learn-shell .arabic-identity,.learn-shell .sound-note,.learn-shell .vocab-latin,.learn-shell .word-english{color:#375570}.learn-shell .trace-wrap{border-color:var(--learn-line)}.learn-shell .trace-pad{background:var(--learn-wash);border:2px dashed #9eb8d1;border-radius:20px}.trace-pad canvas{touch-action:none}.learn-shell .trace-pad span{color:#c6d9ed}.learn-shell .learn-levels,.learn-shell .learn-categories{max-width:852px;margin:15px auto}.learn-shell .learn-levels button,.learn-shell .learn-categories button{min-height:48px;background:var(--learn-paper);color:#365b7d;border-color:#b9cee1;border-radius:13px;padding:8px 13px;font-size:15px}.learn-shell .learn-levels button[aria-pressed=true],.learn-shell .learn-categories button[aria-pressed=true]{background:var(--learn-teal);color:#fff;border-color:var(--learn-teal)}.learn-shell .sound-tiles,.learn-shell .arabic-forms,.learn-shell .sound-change{background:var(--learn-wash);border-radius:18px;padding:18px;color:#2d557f}.learn-shell .sound-tiles span,.learn-shell .sound-tiles strong,.learn-shell .arabic-forms span{background:var(--learn-paper);color:var(--learn-teal);border:1px solid #bfd2e5;border-radius:13px;box-shadow:0 3px 0 #d8e3ef}.learn-shell .hands-on-tiles button{background:#f2f7ff;border:2px solid #9fbada;border-radius:14px;color:var(--learn-teal);min-width:60px;min-height:60px;box-shadow:0 4px 0 #9fbada}.learn-shell .hands-on-actions button{border:1px solid #b2c6dc;background:var(--learn-paper);color:#355976;border-radius:14px;min-height:48px}.learn-shell .hands-on-actions .learn-practice-action{background:var(--learn-gold);border:2px solid #b7862d;color:#233852}.learn-shell .ten-frame-grid{grid-template-columns:repeat(5,54px);gap:8px}.learn-shell .ten-frame-grid button{width:54px;min-width:54px;height:54px;min-height:54px;border:2px solid #8faecc;background:var(--learn-wash);border-radius:12px}.learn-shell .ten-frame-grid button[aria-pressed=true]{background:#e2edf8;border-color:#678cad}.learn-shell .ten-frame-grid button:disabled{opacity:1}.learn-shell .sound-boxes>div,.learn-shell .tile-word-slots strong{border-color:#94b3d1;background:var(--learn-wash);color:#244e78}.learn-shell .place-value-card{border-color:var(--learn-line);background:var(--learn-wash)}.learn-shell .vocab-arabic{color:var(--learn-teal)}.learn-shell [lang=ar]{letter-spacing:normal}.learn-shell .learn-collection-actions{display:flex;gap:10px}.learn-story-prompt{color:var(--learn-ink)}
@media(max-width:760px){.learn-top{padding:10px 16px;min-height:70px;gap:10px}.learn-brand{font-size:20px}.learn-main{padding:20px 18px 30px}.practice-selection{grid-template-columns:1fr}.mix-choice{flex-direction:row;justify-content:flex-start;text-align:left;flex-wrap:wrap;padding:17px;gap:12px}.mix-choice>span{font-size:32px}.mix-choice strong{font-size:24px}.mix-choice small{width:100%;padding-left:44px}.next-adventure{grid-template-columns:minmax(0,1fr) 140px}.home-milo{width:160px;height:205px}.next-copy{padding:24px 0 24px 24px}.activity-door{padding:16px;min-height:160px}.activity-door strong{font-size:21px}.door-symbol{font-size:29px}.door-symbol small{display:none}.feature-panel{padding:22px}.studio-workspace{grid-template-columns:1fr}.studio-toolbox{display:grid;grid-template-columns:90px 1fr;align-items:center;gap:10px}.studio-toolbox h2,.studio-toolbox h2:not(:first-child){margin:0;font-size:17px}.studio-stickers{grid-template-columns:repeat(6,minmax(0,1fr))}.studio-backgrounds{flex-wrap:nowrap}.studio-actions{margin-bottom:2px}.profile-edit{grid-template-columns:1fr}.saved-scenes{grid-template-columns:repeat(2,minmax(0,1fr))}.learn-lesson .guided-context{margin:15px 24px}.learn-lesson .learn-content{padding:0 18px}.learn-lesson .learn-pager{padding:0 18px}.learn-lesson .learn-card{padding:22px}.learn-lesson .learn-lesson-heading{padding-inline:18px}}
@media(max-width:520px){.learn-top{padding:8px 12px;gap:8px;min-height:66px}.learn-top .learn-back{padding:8px 10px;min-width:65px;font-size:14px}.learn-brand{font-size:18px}.learn-brand>span{display:none}.learner-chip{padding:6px 9px;font-size:12px!important;gap:5px}.learner-chip>span:first-child{font-size:21px}.learn-main{padding:18px 13px 26px}.home-greeting{margin-bottom:15px;align-items:start}.home-greeting h1{font-size:28px}.home-greeting>span{font-size:14px;max-width:120px;text-align:right}.next-adventure{grid-template-columns:minmax(0,1fr) 86px;border-radius:21px;gap:0}.next-copy{padding:22px 0 22px 20px}.next-copy h2{font-size:27px}.next-copy>p:not(.learn-eyebrow){font-size:16px;line-height:1.5;margin-bottom:17px}.home-milo{width:115px;height:167px;object-position:bottom;transform:translate(0,9px);align-self:end}.next-copy .learn-eyebrow{font-size:12px;letter-spacing:.07em}.path-caption{font-size:12px;width:calc(100% + 60px)}.next-copy .feature-primary,.next-copy .guided-primary{font-size:18px;padding:11px 19px}.activity-doors{gap:9px;grid-template-columns:1fr}.activity-door{min-height:82px;display:grid;grid-template-columns:54px minmax(0,1fr);padding:13px 17px;gap:3px 13px;border-radius:17px}.door-symbol{grid-row:span 2;justify-content:center;font-size:28px}.door-read .door-symbol{font-size:31px}.door-create .door-symbol{font-size:43px}.activity-door strong{font-size:21px;align-self:end;margin:0}.activity-door>span:last-child{font-size:14px;align-self:start}.home-choice-heading{margin:22px 0 12px}.mission-home-link{padding:14px;margin-top:16px;gap:10px}.mission-home-link strong{font-size:17px}.mission-home-link small{font-size:13px}.learn-shell summary{font-size:15px}.learn-shell details summary span{font-size:12px;max-width:110px;text-align:right}.learn-shell .guided-steps{grid-template-columns:1fr}.learn-paths{grid-template-columns:1fr}.learn-shell .learn-path{min-height:95px}.learn-shell .learn-path-symbol{font-size:31px;min-width:65px}.feature-panel{padding:20px 15px;border-radius:20px}.feature-intro{font-size:18px}.learn-lesson-heading{margin-bottom:15px;align-items:start}.learn-lesson-heading h1{font-size:29px}.learner-label{font-size:13px;max-width:110px;overflow-wrap:anywhere;white-space:normal;text-align:right}.bank-grid{gap:9px}.learn-shell .bank-grid button{padding:13px;min-height:150px}.bank-grid strong{font-size:19px}.bank-grid button>span:last-child{font-size:14px}.session-settings{grid-template-columns:1fr}.resume-strip{display:grid;padding:14px}.learn-shell .practice-prompt{font-size:25px}.learn-shell .practice-options{gap:10px}.learn-shell .practice-options button{min-width:80px;flex-basis:80px;min-height:70px;padding:11px;font-size:28px;border-radius:15px}.learn-shell .practice-options button[lang=ar]{font-size:25px}.tap-counters{grid-template-columns:repeat(5,44px);gap:9px}.learn-shell .tap-counters button{width:44px;height:44px;min-height:44px}.learn-shell .session-progress{font-size:14px}.read-page{padding:18px 10px}.readalong-panel h2{font-size:25px}.readalong-lines{min-height:175px}.readalong-lines p{line-height:1.85}.learn-shell .read-word{font-size:28px;padding:2px 5px}.reading-steps span{font-size:13px;padding:7px 12px}.read-page-actions{display:grid;grid-template-columns:1fr}.read-page-actions .feature-primary{order:-1}.sequence-list li{grid-template-columns:23px minmax(0,1fr);gap:8px;padding:12px;font-size:17px}.sequence-list li>div{grid-column:2;justify-content:flex-end}.sequence-number{width:23px;height:23px}.read-task .practice-options{flex-direction:column}.read-task .practice-options button{flex-basis:auto;font-size:23px;min-height:60px}.mission-cards{grid-template-columns:1fr}.learn-shell .mission-cards button{padding:24px 18px}.mission-choice-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:10px}.mission-choice button>span:first-child{font-size:37px}.mission-choice button strong{font-size:18px}.mission-choice button [lang=ar]{font-size:23px}.mission-request h2{font-size:26px}.studio-toolbox{display:block}.studio-toolbox h2,.studio-toolbox h2:not(:first-child){margin:17px 0 8px}.studio-stickers{grid-template-columns:repeat(6,minmax(0,1fr));gap:4px}.learn-shell .studio-stickers button{min-height:62px;padding:7px 2px}.studio-stickers small{font-size:12px}.studio-stickers button>span{font-size:25px}.studio-colors{gap:8px}.learn-shell .studio-colors button{width:46px}.studio-actions{gap:5px}.draft-label{width:100%;margin:4px 0 0}.sticker-controls{padding:12px;gap:10px}.sticker-controls>div{display:grid;grid-template-columns:repeat(4,1fr);width:100%}.sticker-controls>div>button:last-child{grid-column:1/-1}.studio-tell{gap:14px}.saved-scenes{grid-template-columns:1fr}.profile-list{grid-template-columns:repeat(2,minmax(0,1fr));gap:10px}.progress-summary{grid-template-columns:repeat(2,minmax(0,1fr));gap:10px}.progress-summary>div{padding:14px}.progress-summary dt{font-size:14px}.avatar-picks{gap:6px}.learn-shell .avatar-picks button{width:46px}.learn-lesson .learn-lesson-heading{padding-top:20px}.learn-lesson .learn-content{padding:0 13px}.learn-lesson .learn-card{padding:20px 14px}.learn-lesson .guided-context{margin:13px}.learn-lesson .learn-tabs{max-width:330px}.learn-lesson .learn-tabs button{min-width:130px}.learn-lesson .learn-pager{padding:0 13px;flex-wrap:wrap}.learn-lesson .learn-feedback{order:3;width:100%;flex-basis:100%;text-align:center}.learn-shell .ten-frame-grid{grid-template-columns:repeat(5,44px);gap:7px}.learn-shell .ten-frame-grid button{width:44px;min-width:44px;height:44px;min-height:44px}.learn-shell .learn-levels,.learn-shell .learn-categories{margin:13px}.learn-shell .sound-tiles,.learn-shell .arabic-forms{padding:13px;gap:10px}.sound-boxes>div{min-width:66px}.learn-shell .hands-on-actions{gap:8px}.learn-shell .hands-on-actions button{padding:9px 12px;font-size:15px}.learn-shell .hands-on-actions .learn-practice-action{flex-basis:100%}}
@media(prefers-reduced-motion:reduce){.learn-shell *{animation:none!important;transition:none!important;scroll-behavior:auto!important}.learn-shell button:hover,.learn-shell button:active{transform:none!important}}

.lesson-start{text-align:center;margin:20px 0}.learn-lesson[data-result=right] .practice-feedback{color:#236446}.learn-shell .learn-top :focus-visible{outline-color:#ffd36d}

@media(max-width:520px){.studio-stickers{grid-template-columns:repeat(3,minmax(0,1fr))}.studio-stickers button{min-height:70px!important}}

.studio-save-actions{display:flex;align-items:center;gap:12px;flex-wrap:wrap}.practice-card .practice-options:has(button:nth-child(4)){display:grid;grid-template-columns:repeat(2,minmax(0,1fr))}

/* Shared icon sizing and small-screen controls. Content pictures keep their own scale. */
.learn-shell .learn-icon{display:block;width:24px;height:24px;flex:none;pointer-events:none}
.learn-top .learn-back{display:inline-flex;align-items:center;gap:8px}
.learn-shell .learner-chip{gap:8px}
.learn-shell .door-symbol{width:64px;height:56px;color:var(--learn-teal);font-size:32px}
.learn-shell .door-symbol .learn-icon{width:36px;height:36px}
.learn-shell .door-symbol small{font-size:18px;color:var(--learn-muted)}
.learn-shell .door-read .door-symbol{color:#796025}
.learn-shell .door-create .door-symbol{color:#82553f}
.learn-shell .mission-link-icon{display:grid;place-items:center;width:48px;height:48px;flex:none;border-radius:12px;background:var(--learn-wash);color:var(--learn-teal)}
.learn-shell .mission-link-icon .learn-icon{width:28px;height:28px}
.learn-shell .mix-choice .learn-icon{width:40px;height:40px}
.learn-shell .bank-symbol .learn-icon{width:30px;height:30px}
.learn-shell .learn-brand{min-width:0}
.learn-shell .learn-brand>span{color:#d8e5d9}
.learn-shell .learn-back>span{font:inherit}
.learn-shell .learn-main,.learn-shell .next-copy,.learn-shell .feature-panel{min-width:0}
.learn-shell .home-greeting h1,.learn-shell .learn-lesson-heading h1{overflow-wrap:anywhere}
.learn-shell .home-greeting>span{overflow-wrap:anywhere;min-width:0}
.learn-shell .path-caption{width:auto}
.learn-shell .activity-door{text-align:start}
.learn-shell .activity-door:hover{transform:translateY(-2px)}
.learn-shell .learn-path-symbol{background:var(--learn-wash);border-radius:14px}
.learn-shell .learn-path:hover{transform:translateY(-2px)}
.learn-shell .readalong-lines{overflow-wrap:anywhere}
.learn-shell .answer-feedback{max-width:620px;margin-inline:auto}
.learn-shell .answer-feedback span{unicode-bidi:plaintext}
.learn-shell .read-word:is(button){min-width:48px}
.learn-shell .sequence-list button{min-width:48px!important;min-height:48px!important;height:48px!important}
.learn-shell .studio-colors button,.learn-shell .avatar-picks button{width:48px;min-width:48px;min-height:48px}
.learn-shell .studio-backgrounds{flex-wrap:wrap}
.learn-shell .custom-practice-stage{max-width:100%;overflow-x:auto}
.learn-shell .practice-options button:disabled:not(.answer-correct){opacity:.65}
.learn-shell .practice-card[data-result=right] .answer-feedback,.learn-shell .mission-panel[data-result=right] .answer-feedback{color:#236446}
.learn-shell .session-progress progress{accent-color:var(--learn-teal)}
.learn-shell .learn-top :focus-visible{outline-color:#ffd36d}
@media(max-width:520px){
  .learn-shell .learn-top{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);padding:10px 14px;gap:8px 12px}
  .learn-shell .learn-brand{grid-column:1/-1;order:-1;font-size:18px}
  .learn-shell .learn-back{justify-self:start;min-height:48px;min-width:0;font-size:15px}
  .learn-shell .learner-chip{justify-self:end;min-height:48px;font-size:14px!important;padding:8px 10px}
  .learn-shell .learner-chip .learn-icon,.learn-shell .learn-back .learn-icon{width:20px;height:20px}
  .learn-shell .home-greeting{display:block}
  .learn-shell .home-greeting>span{display:block;max-width:none;text-align:start;margin-top:6px}
  .learn-shell .next-adventure{grid-template-columns:minmax(0,1fr) 78px}
  .learn-shell .next-copy{padding:22px 0 22px 18px}
  .learn-shell .next-copy h2{font-size:26px;overflow-wrap:anywhere}
  .learn-shell .home-milo{width:98px;height:156px;transform:translate(0,6px)}
  .learn-shell .next-copy .feature-primary,.learn-shell .next-copy .guided-primary{padding:11px 15px;font-size:17px}
  .learn-shell .activity-door{grid-template-columns:48px minmax(0,1fr);gap:3px 13px}
  .learn-shell .door-symbol{width:48px;height:48px;font-size:26px}
  .learn-shell .door-symbol .learn-icon{width:30px;height:30px}
  .learn-shell .mix-choice{display:grid;grid-template-columns:40px minmax(0,1fr);text-align:start;gap:6px 12px}
  .learn-shell .mix-choice>span{grid-row:span 2}
  .learn-shell .mix-choice strong{font-size:23px}
  .learn-shell .mix-choice small{padding:0}
  .learn-shell .tap-counters{grid-template-columns:repeat(5,48px);gap:5px}
  .learn-shell .tap-counters button{width:48px;height:48px;min-width:48px;min-height:48px}
  .learn-shell .ten-frame-grid{grid-template-columns:repeat(5,48px);width:max-content;gap:5px}
  .learn-shell .ten-frame-grid button{width:48px;height:48px;min-width:48px;min-height:48px}
  .learn-shell.learn-lesson .learn-content{padding-inline:10px}
  .learn-shell.learn-lesson .learn-card{padding-inline:10px}
  .learn-shell .bank-grid{grid-template-columns:1fr}
  .learn-shell .bank-grid button{display:grid;grid-template-columns:48px minmax(0,1fr);align-items:center;gap:3px 12px;min-height:90px;padding:14px}
  .learn-shell .bank-symbol{grid-row:span 2;font-size:24px}
  .learn-shell .bank-grid strong{align-self:end;font-size:20px}
  .learn-shell .bank-grid button>span:last-child{align-self:start}
}
@media(max-width:360px){
  .learn-shell .learn-main{padding-inline:10px}
  .learn-shell .feature-panel{padding-inline:10px}
  .learn-shell .tap-counters{gap:4px}
  .learn-shell .ten-frame-grid{gap:4px}
  .learn-shell .readalong-toolbar{flex-wrap:wrap}
  .learn-shell .reading-steps{flex-wrap:wrap}
  .learn-shell .guided-steps button{grid-template-columns:28px minmax(0,1fr)}
  .learn-shell .guided-steps button small{grid-column:2}
}
@media(prefers-reduced-motion:reduce){
  .learn-shell .activity-door:hover,.learn-shell .learn-path:hover{transform:none}
}

/* ==========================================================================
   Design-system layer (tokens.css). Readable; later rules here win over the
   legacy layers above. Change look here, not in the minified rules.
   ========================================================================== */
.learn-shell {
  --learn-ink: var(--color-text);
  --learn-paper: var(--color-surface);
  --learn-teal: var(--color-primary);
  --learn-gold: var(--honey-300);
  --learn-muted: var(--color-text-muted);
  --learn-line: var(--color-border);
  --learn-wash: var(--teal-50);
  background: var(--color-bg);
  font-family: var(--font-text);
}

/* Type */
.learn-shell h1,
.learn-shell h2 {
  font-family: var(--font-display);
  font-weight: var(--weight-display);
  font-variation-settings: 'SOFT' 100;
  letter-spacing: var(--tracking-display);
  line-height: var(--leading-tight);
}
.learn-shell h3 {
  font-family: var(--font-text);
  font-weight: var(--weight-bold);
}
.learn-shell .learn-eyebrow {
  font: var(--weight-bold) var(--text-xs) / 1.2 var(--font-text);
  letter-spacing: var(--tracking-eyebrow);
  text-transform: uppercase;
  color: var(--teal-700);
}
.learn-shell .practice-prompt {
  font-family: var(--font-text);
  font-weight: var(--weight-bold);
  color: var(--color-text);
}

/* Top bar */
.learn-shell .learn-top {
  min-height: 72px;
  background: var(--teal-800);
  box-shadow: var(--shadow-1);
}
.learn-shell .learn-top .learn-back,
.learn-shell .learner-chip {
  min-height: var(--tap-min);
  padding: 0 var(--space-4) 0 var(--space-3);
  border: var(--border-hair) solid rgb(255 255 255 / 0.28);
  border-radius: var(--radius-pill);
  background: rgb(255 255 255 / 0.08);
  color: var(--paper-50);
  font: var(--weight-bold) var(--text-md) / 1 var(--font-text);
  transition: background-color var(--dur-state) var(--ease-out);
}
.learn-shell .learn-top .learn-back:hover,
.learn-shell .learner-chip:hover {
  background: rgb(255 255 255 / 0.16);
}
.learn-shell .learn-brand {
  font-family: var(--font-display);
  font-size: var(--text-xl);
  font-weight: 600;
  font-variation-settings: 'SOFT' 100;
  letter-spacing: var(--tracking-display);
}
.learn-shell .learn-brand > span {
  font: var(--weight-regular) var(--text-sm) / 1.3 var(--font-text);
  letter-spacing: 0;
  color: var(--teal-100);
}
.learn-shell .learn-top :focus-visible {
  outline-color: var(--honey-300);
  box-shadow: none;
}

/* Surfaces */
.learn-shell .feature-panel,
.learn-shell .next-adventure {
  background: var(--color-surface);
  border: var(--border-hair) solid var(--color-border);
  border-radius: var(--radius-xl);
  box-shadow: var(--shadow-2);
}
.learn-shell .mission-home-link,
.learn-shell .learn-path {
  background: var(--color-surface);
  border: var(--border-hair) solid var(--color-border);
  border-radius: var(--radius-lg);
  box-shadow: var(--shadow-1);
}

/* Activity doors */
.learn-shell .activity-door {
  --door-tint: var(--teal-50);
  --door-edge: var(--teal-200);
  background: var(--door-tint);
  border: var(--border-hair) solid var(--door-edge);
  border-radius: var(--radius-lg);
  box-shadow: 0 var(--edge) 0 var(--door-edge);
  transition: transform var(--dur-state) var(--ease-out), box-shadow var(--dur-state) var(--ease-out);
}
.learn-shell .door-read {
  --door-tint: var(--honey-100);
  --door-edge: var(--honey-300);
}
.learn-shell .door-create {
  --door-tint: var(--coral-100);
  --door-edge: var(--coral-300);
}
.learn-shell .activity-door:hover {
  transform: translateY(-3px);
  box-shadow: 0 calc(var(--edge) + 3px) 0 var(--door-edge), var(--shadow-2);
}
.learn-shell .activity-door:active {
  transform: translateY(2px);
  box-shadow: 0 2px 0 var(--door-edge);
  transition-duration: var(--dur-press);
}
.learn-shell .activity-door strong {
  font-family: var(--font-display);
  font-weight: var(--weight-display);
  font-variation-settings: 'SOFT' 100;
  letter-spacing: var(--tracking-display);
}
.learn-shell .door-symbol {
  color: var(--teal-800);
}

/* Primary action: honey, tactile */
.learn-shell :is(.feature-primary, .guided-primary, .learn-practice-action) {
  min-height: 56px;
  padding: 0 var(--space-6);
  border: var(--border-hair) solid var(--honey-700);
  border-radius: var(--radius-pill);
  background: var(--honey-300);
  box-shadow: 0 var(--edge) 0 var(--honey-700);
  color: var(--ink-900);
  font: var(--weight-bold) var(--text-lg) / 1 var(--font-text);
  transition: transform var(--dur-press) var(--ease-out), background-color var(--dur-state) var(--ease-out), box-shadow var(--dur-press) var(--ease-out);
}
.learn-shell :is(.feature-primary, .guided-primary, .learn-practice-action):hover {
  background: var(--honey-500);
}
.learn-shell :is(.feature-primary, .guided-primary, .learn-practice-action):active {
  transform: translateY(2px);
  box-shadow: 0 2px 0 var(--honey-700);
}

/* Choice chips */
.learn-shell .guided-choice-row button {
  border: var(--border-hair) solid var(--color-border-strong);
  border-radius: var(--radius-pill);
  background: var(--color-surface);
  color: var(--color-text);
  font-weight: var(--weight-bold);
}
.learn-shell .guided-choice-row button[aria-pressed=true] {
  background: var(--color-primary);
  border-color: var(--color-primary);
  color: var(--color-on-primary);
}

/* Answer tiles */
.learn-shell .practice-options button {
  border: var(--border-hair) solid var(--teal-200);
  border-radius: var(--radius-lg);
  background: var(--color-surface);
  box-shadow: 0 var(--edge) 0 var(--teal-200);
  color: var(--color-text);
  font-family: var(--font-text);
  font-weight: var(--weight-bold);
  transition: transform var(--dur-press) var(--ease-out), background-color var(--dur-state) var(--ease-out), border-color var(--dur-state) var(--ease-out), box-shadow var(--dur-press) var(--ease-out);
}
.learn-shell .practice-options button:hover:not(:disabled) {
  background: var(--teal-50);
  border-color: var(--teal-300);
}
.learn-shell .practice-options button:active:not(:disabled) {
  transform: translateY(2px);
  box-shadow: 0 2px 0 var(--teal-200);
}
.learn-shell .practice-options button.answer-correct,
.learn-shell .mission-choice button.answer-correct {
  background: var(--color-correct-bg);
  border-color: var(--color-correct-border);
  box-shadow: 0 var(--edge) 0 var(--color-correct-border);
  color: var(--color-correct-text);
}
/* A wrong pick stays warm and neutral, never green, even while hovered or after a tap. */
.learn-shell .practice-options button.answer-retry,
.learn-shell .practice-options button.answer-retry:hover:not(:disabled) {
  background: var(--color-retry-bg);
  border: var(--border-hair) dashed var(--color-retry-border);
  box-shadow: 0 var(--edge) 0 var(--honey-200);
  color: var(--ink-800);
}

/* Feedback text */
.learn-shell .answer-feedback {
  color: var(--color-text);
}
.learn-shell .answer-feedback strong {
  font-size: var(--text-lg);
  font-weight: var(--weight-bold);
}
.learn-shell .answer-feedback span {
  color: var(--color-text-muted);
}
.learn-shell .practice-card[data-result=right] .answer-feedback strong,
.learn-shell .mission-panel[data-result=right] .answer-feedback strong,
.learn-lesson[data-result=right] .practice-feedback {
  color: var(--color-correct-text);
}

/* Round progress: themed, not the browser default */
.learn-shell .session-progress progress {
  -webkit-appearance: none;
  appearance: none;
  width: 160px;
  height: 10px;
  border: 0;
  border-radius: var(--radius-pill);
  background: var(--paper-200);
  overflow: hidden;
}
.learn-shell .session-progress progress::-webkit-progress-bar {
  background: var(--paper-200);
  border-radius: var(--radius-pill);
}
.learn-shell .session-progress progress::-webkit-progress-value {
  background: var(--teal-500);
  border-radius: var(--radius-pill);
  transition: width var(--dur-enter) var(--ease-out);
}
.learn-shell .session-progress progress::-moz-progress-bar {
  background: var(--teal-500);
  border-radius: var(--radius-pill);
}

/* Listen buttons */
.learn-shell .learn-speak,
.learn-shell .learn-audio-stop {
  gap: var(--space-2);
  min-height: var(--tap-min);
  border: var(--border-hair) solid var(--teal-200);
  border-radius: var(--radius-pill);
  background: var(--teal-50);
  color: var(--teal-800);
  font: var(--weight-bold) var(--text-md) / 1 var(--font-text);
}
.learn-shell .learn-speak .learn-icon {
  width: 20px;
  height: 20px;
}

/* Logo in the Learn & Play header */
.learn-shell .learn-brand .samana-logo {
  width: auto;
  height: 40px;
  margin: 0 auto 2px;
}
@media (max-width: 650px) {
  .learn-shell .learn-brand .samana-logo {
    height: 32px;
  }
}

/* ==========================================================================
   Learn & Play sits in the same room as the stories
   (assets/learn-room.jpg: the story room's shelf view, captured from the 3D
   scene and pre-blurred, so Learn & Play never has to load the 3D engine)
   ========================================================================== */
.learn-shell {
  background:
    linear-gradient(rgb(248 243 234 / 0.42), rgb(248 243 234 / 0.58)),
    url('assets/learn-room.jpg') center 40% / cover no-repeat fixed,
    var(--paper-100);
}
/* Floating paper controls, like the story room's top bar */
.learn-shell .learn-top {
  background: transparent;
  box-shadow: none;
  color: var(--ink-900);
  transition: background-color var(--dur-state) var(--ease-out), box-shadow var(--dur-state) var(--ease-out);
}
/* Once the page scrolls, the header becomes a solid paper bar so content never shows through it */
.learn-shell.scrolled .learn-top {
  background: rgb(248 243 234 / 0.97);
  box-shadow: var(--shadow-2);
}
.learn-shell .learn-top .learn-back,
.learn-shell .learner-chip {
  border: var(--border-hair) solid var(--paper-300);
  background: var(--paper-50);
  box-shadow: 0 3px 0 var(--paper-400), var(--shadow-2);
  color: var(--teal-800);
}
.learn-shell .learn-top .learn-back:hover,
.learn-shell .learner-chip:hover {
  background: var(--paper-100);
}
.learn-shell .learn-brand > span {
  color: var(--teal-800);
}
.learn-shell .learn-top :focus-visible {
  outline-color: var(--color-focus);
}