/* The child sees one action or short line. Detailed teaching notes live in the dialog. */
.topbar{height:72px;padding-inline:clamp(18px,4vw,64px)}
.home{padding-block:20px}.hero{min-height:min(660px,calc(100dvh - 112px))}.hero-copy{width:48%}.hero h1{font-size:clamp(52px,7vw,94px);margin:0 0 42px}.hero-buttons .primary{font:400 34px Andika,sans-serif;min-height:88px;min-width:190px}.hero-buttons .secondary{font:400 24px Andika,sans-serif;min-height:72px;display:flex;align-items:center;gap:12px}.hero-buttons svg{width:32px;height:32px}
.story-shell,.practice-shell{max-width:1500px;margin:auto;padding:12px clamp(18px,3.5vw,56px) 18px}.story-heading{justify-content:center;min-height:14px;margin-bottom:12px}.scene-dot{width:20px;height:8px}.scene-dot.current{width:32px}.story-layout{grid-template-columns:minmax(0,1.4fr) minmax(340px,1fr);min-height:0;height:clamp(400px,calc(100dvh - 220px),660px)}.living-arena{min-height:0;height:100%}.story-panel{padding:clamp(18px,2.6vw,38px);justify-content:center;align-items:center;gap:24px;min-height:0;overflow:auto}.story-panel h2.reading-line{font:400 clamp(35px,3.5vw,54px)/1.55 Andika,sans-serif;letter-spacing:0;text-align:center;margin:0;max-width:none;width:100%}.story-word{font:inherit;letter-spacing:inherit;color:var(--pine);background:transparent;padding:2px 5px;border-radius:12px;border-bottom:4px solid #d9e2cd;min-height:60px;transition:background .12s,transform .12s}.story-word:hover,.story-word:focus-visible{background:#fce8ad}.story-word:active{transform:translateY(3px)}.story-word.speaking{background:#ffda75;border-bottom-color:#bd8e2f}.story-panel.story-step-0,.story-panel.story-step-3,.story-panel.story-step-5{background:radial-gradient(ellipse at 50% 70%,#f2f5e7,transparent 65%),#fffdf7}.story-step-2 .story-word:last-child,.story-step-4 .story-word:last-child{background:#ffdf86;border-bottom-color:#c2953c;min-width:64px}
.activity{width:100%;margin:0;position:relative}.model{max-width:290px;display:flex;flex-direction:column;align-items:center;padding:18px}.model-letter{display:block;background:transparent;width:100%;font:400 clamp(100px,13vw,172px)/1.2 Andika,sans-serif;color:var(--pine);border-radius:18px}.model-letter:hover{background:#ffe09a}.model .word-button{font:400 30px Andika,sans-serif;display:flex;align-items:center;justify-content:center;gap:13px;min-height:64px;margin:10px 0 0;padding:8px 14px}.word-button svg{width:26px;height:26px}.letter-options{margin-top:12px;gap:14px}.letter-tile{font-size:64px;min-height:112px}.hunt .letter-tile{font-size:54px;min-height:88px}.hunt-progress{justify-content:center;gap:12px;margin:0 0 12px}.pebble{width:18px;height:18px;border-width:2px}.activity-feedback{font:400 24px Andika,sans-serif;min-height:42px;margin-top:15px;display:flex;justify-content:center;align-items:center;gap:9px;color:#356a3e}.activity-feedback svg{width:29px;height:29px}.help-button{display:flex;gap:8px;align-items:center;justify-content:center;margin:4px auto 0;background:#edf1e6;color:var(--pine);border-radius:16px;padding:8px 15px;font:400 20px Andika,sans-serif;min-height:48px}.help-button:hover{background:#dde9ce}
.child-nav{display:grid;grid-template-columns:1fr 1fr 1fr;align-items:center;gap:20px;margin-top:16px}.nav-control{width:76px;height:68px;display:grid;place-items:center;border-radius:20px;background:#e5edda;color:var(--pine);border:2px solid #cad8ba;box-shadow:0 4px 0 #bccdab;position:relative}.nav-control svg{width:36px;height:36px;stroke-width:2.5}.nav-control:hover:not(:disabled){background:#d4e5c3;transform:translateY(-2px)}.nav-control:active:not(:disabled){transform:translateY(3px);box-shadow:0 1px 0 #bccdab}.back-control{justify-self:start}.listen-control{justify-self:center}.next-control{justify-self:end;background:linear-gradient(#ffdd7a,#fbc54d);border-color:#d4a446;box-shadow:0 4px 0 #aa7926;width:112px}.next-control:hover:not(:disabled){background:#ffdb75}.next-control:disabled{opacity:.3}.back-control:disabled{opacity:.22}
.arena-caption{position:absolute!important;width:1px!important;height:1px!important;padding:0!important;margin:-1px!important;overflow:hidden!important;clip:rect(0,0,0,0)!important;white-space:nowrap!important;border:0!important}.living-arena .art-tag{display:none}.arena-nameplates span{font-family:Andika,sans-serif;font-weight:400}.arena-tools{bottom:18px;right:18px}.motion-toggle,.action-replay{min-height:52px;min-width:52px;font-size:23px}.arena-beat{top:100px}.arena-tools .action-replay{max-width:none}
.practice-shell{max-width:1200px}.click-lesson{min-height:400px;height:clamp(400px,calc(100dvh - 220px),660px);border:3px solid #274e39;border-radius:26px;background:#f0f4e6;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:22px;padding:24px}.click-lesson h1{font:400 clamp(32px,4.5vw,54px)/1.3 Andika,sans-serif;letter-spacing:0}.practice-picture{position:relative;width:min(600px,90%);min-height:0;padding:0;border:5px solid #ffcf58;border-radius:24px;background:#244e39;box-shadow:0 6px 0 #bc8f38;overflow:visible}.practice-picture img{display:block;width:100%;max-height:340px;object-fit:cover;border-radius:18px}.practice-picture:hover{outline:5px solid #c4d8ab;outline-offset:7px}.practice-picture:active{transform:scale(.98)}.pointer-demo{position:absolute;bottom:-14px;right:15%;width:58px;height:68px;color:#183e2d;pointer-events:none;filter:drop-shadow(0 3px 0 #fff);animation:point-click 2s 2}.pointer-demo svg{width:100%;height:100%;fill:#fff9dd;stroke-width:1.5}.practice-portrait{width:170px;height:170px;object-fit:cover;border-radius:50%;border:5px solid #dce8cd}.practice-word{position:relative;color:var(--pine);background:#ffdf87;border:2px solid #cba359;border-bottom:7px solid #af8843;border-radius:22px;padding:5px 38px 15px;font:400 74px/1.4 Andika,sans-serif}.practice-word:hover:not(.static-word){background:#ffebae}.practice-word .pointer-demo{right:-24px;bottom:-20px}.static-word{background:transparent;border-color:transparent}.practice-next .pointer-demo{right:-13px;bottom:-12px;width:45px;height:55px}.practice-next{outline:4px solid #e1c477;outline-offset:5px}
.paths{padding-top:26px;max-width:1300px}.paths-intro h1{font:400 48px Andika,sans-serif;letter-spacing:0}.path-cards{margin-top:26px}.path-card img{aspect-ratio:1.35}.path-info{padding:20px;display:flex;flex-direction:row;align-items:center;gap:10px;justify-content:space-between}.path-info h2{font:400 clamp(25px,2.6vw,36px)/1.25 Andika,sans-serif;margin:0;letter-spacing:0}.path-info>svg{width:32px;height:32px;flex-shrink:0}.paths-actions{gap:28px}.rest h1{font:400 52px Andika,sans-serif}.rest-actions{margin-top:30px}.rest .primary{margin:0;font:400 30px Andika,sans-serif;min-height:68px}.library-card h3{font:400 24px Andika,sans-serif;margin:13px}.setting summary{cursor:pointer;font-size:16px;font-weight:650}.setting p{font-size:15px}.voice-status{position:fixed;bottom:12px;left:50%;transform:translateX(-50%);background:#fff6d7;border:2px solid #bc8f38;padding:12px 20px;border-radius:18px;font:400 22px Andika,sans-serif;z-index:30;box-shadow:0 3px 10px #173d3120;pointer-events:none}
@keyframes point-click{0%,55%,100%{transform:translate(8px,10px)}65%,85%{transform:translate(0,0) scale(.92)}}
@media(max-width:950px){.story-layout{grid-template-columns:minmax(0,1.1fr) minmax(310px,1fr)}.story-panel{padding:20px;gap:16px}.story-panel h2.reading-line{font-size:37px}.letter-tile{min-height:93px;font-size:54px}.hunt .letter-tile{min-height:80px;font-size:47px}.hero-copy{width:60%}.arena-nameplates{left:13px;right:13px}.arena-beat{font-size:32px}}
@media(max-width:700px){.topbar{height:64px;padding-inline:16px}.brand{font-size:25px}.top-actions .quiet-button span{display:none}.top-actions .quiet-button{width:46px;height:46px;display:grid;place-items:center;background:#e7eddf;border-radius:50%}.hero{min-height:calc(100dvh - 104px);max-height:850px}.hero-copy{width:100%;padding:28px}.hero h1{font-size:54px;margin:0 0 22px}.hero-buttons .primary{min-height:70px;font-size:30px;min-width:150px}.hero-buttons .secondary{font-size:20px;min-height:60px}.story-shell,.practice-shell{padding:10px 12px 16px}.story-heading{margin-bottom:9px}.story-layout{display:flex;flex-direction:column;height:auto;min-height:0}.living-arena{height:clamp(245px,36dvh,340px);flex:none}.story-panel{min-height:150px;padding:20px;overflow:visible;gap:12px}.story-panel h2.reading-line{font-size:36px}.story-word{min-height:54px}.arena-nameplates{top:12px}.arena-nameplates span{font-size:19px}.arena-beat{top:75px;font-size:29px}.arena-tools{right:12px;bottom:12px}.motion-toggle,.action-replay{min-width:46px;min-height:46px;padding:5px 10px}.child-nav{position:sticky;bottom:0;z-index:5;background:var(--cream);padding:10px 3px 12px;margin-top:4px;gap:12px}.nav-control{height:60px;width:66px}.next-control{width:96px}.model{max-width:none;padding:6px 18px;display:flex;flex-direction:row;justify-content:space-around;gap:15px}.model-letter{font-size:95px;width:auto;padding:0 12px}.model .word-button{font-size:28px;margin:0;min-height:65px}.letter-tile{min-height:82px;font-size:49px}.hunt .letter-tile{min-height:73px;font-size:43px}.activity-feedback{min-height:31px;margin-top:8px;font-size:21px}.help-button{min-height:44px;font-size:19px}.hunt-progress{margin-bottom:6px}.click-lesson{height:calc(100dvh - 190px);min-height:380px;padding:20px 14px;gap:25px}.click-lesson h1{font-size:36px}.practice-picture{width:95%}.practice-portrait{height:140px;width:140px}.practice-word{font-size:66px}.paths{padding:20px 16px}.paths-intro h1{font-size:38px}.path-cards{gap:14px;margin-top:18px}.path-card{grid-template-columns:42% 58%;min-height:130px}.path-card img{min-height:130px;height:130px}.path-info{padding:16px;gap:8px}.path-info h2{font-size:27px}.paths-actions{gap:24px;margin-top:24px}.voice-status{bottom:85px;white-space:nowrap}.library-card h3{font-size:22px}}
@media(prefers-reduced-motion:reduce){.pointer-demo{animation:none}.story-word{transition:none}}
.hero h1{font-size:clamp(45px,5.2vw,74px);overflow-wrap:normal}.hero-copy{width:55%;max-width:720px}.path-card img{aspect-ratio:1.65}.path-info h2{font-size:clamp(24px,2.5vw,32px);line-height:1.25}.practice-shell{max-width:1500px}
@media(max-width:700px){.hero-copy{width:100%;padding:28px 22px}.hero h1{font-size:clamp(38px,10vw,55px)}.path-info h2{font-size:24px}.path-card img{aspect-ratio:auto}}
.name-game{width:100%;text-align:center;font:400 24px Andika,sans-serif}.name-tiles{display:flex;justify-content:center;gap:16px;margin-top:20px}.name-tile{font:400 35px/1.2 Andika,sans-serif;min-width:125px;min-height:78px;padding:12px 20px;border-radius:18px;background:#ffdf87;color:var(--pine);border:2px solid #cba359;border-bottom:6px solid #af8843;touch-action:none;user-select:none;-webkit-user-select:none;cursor:grab}.name-tile:hover,.name-tile[aria-pressed=true]{background:#ffeeb8;outline:3px solid #9cb77a;outline-offset:4px}.name-tile:active{cursor:grabbing}.name-tile:disabled{opacity:.25;cursor:default}.name-slot{position:relative;font:400 31px Andika,sans-serif;min-width:128px;min-height:68px;border:3px dashed #ffdf87;border-radius:18px;background:#173d31e6;color:#fff4d6;padding:6px 17px;pointer-events:auto}.name-slot:hover:not(:disabled),.name-slot.drop-hover{background:#496c3b;outline:4px solid #ffe8a6;outline-offset:4px}.name-slot.name-ready{box-shadow:0 0 0 4px #ffe8a633}.name-slot.name-placed{border-style:solid;background:#e1efc5;color:#173d31;opacity:1}.name-check{position:absolute;right:-6px;top:-9px;background:#356a3e;color:white;font:700 15px system-ui;width:24px;height:24px;display:grid;place-items:center;border-radius:50%}.arena-nameplates .name-check{padding:0;min-width:0;border:0;box-shadow:none;font-size:15px}.name-feedback{min-height:34px;font:400 22px Andika,sans-serif;margin-top:17px;color:#356a3e}.drag-word{position:fixed;z-index:1000;pointer-events:none;transform:translate(-50%,-65%) rotate(-4deg);font:400 35px Andika,sans-serif;padding:12px 22px;background:#ffe49b;color:#173d31;border:3px solid #ad8436;border-radius:18px;box-shadow:0 15px 30px #102d2545}.drag-source{opacity:.3}.word-practice{display:flex;gap:28px;align-items:center;justify-content:center}.word-practice .name-tiles{margin:0}.word-practice .name-slot{min-height:82px;background:#fff8dd;color:#355640;border-color:#b79852}.word-practice .name-tile{min-width:160px;font-size:44px}.match-arrow svg{width:50px;height:50px;stroke-width:3}.word-practice .name-slot{min-width:160px;font-size:44px}.word-practice .name-tile{animation:match-demo 2.4s 2}.word-practice .name-tile[aria-pressed=true],.word-practice .name-tile.drag-source{animation:none}
@keyframes match-demo{0%,40%,100%{transform:translateX(0)}55%,75%{transform:translateX(20px)}}
.reading-line.reading-playing{border-radius:18px;background:#fff0bf;box-shadow:0 0 0 10px #fff0bf}
@media(max-width:700px){.name-tile{font-size:30px;min-width:112px;min-height:72px;padding:10px 15px}.name-slot{font-size:24px;min-width:103px;min-height:62px;padding:6px 12px}.name-game{font-size:22px}.name-tiles{margin-top:13px;gap:14px}.word-practice{gap:12px;width:100%}.word-practice .name-tile,.word-practice .name-slot{min-width:103px;min-height:74px;font-size:34px;padding:8px 13px}.match-arrow svg{width:32px;height:32px}.name-feedback{font-size:20px;margin-top:12px}.story-step-0{gap:10px}}

.library-card{position:relative}.completed-mark{position:absolute;left:10px;top:10px;display:grid;place-items:center;width:38px;height:38px;border-radius:50%;background:#33664a;color:#fffdf0;font:700 27px Andika;border:3px solid #fffdf0;box-shadow:0 2px 0 #284c3430}
