@import url('https://fonts.googleapis.com/css2?family=DM+Sans:wght@400;500;600;700&family=Fredoka:wght@400;500;600&display=swap');
:root{font-family:'DM Sans',sans-serif;color:#304f40;background:#f8f3e7;font-synthesis:none;--ink:#304f40;--orange:#c95b38}*{box-sizing:border-box}body{margin:0}button{font:inherit;cursor:pointer;color:inherit;border:0;touch-action:manipulation;-webkit-tap-highlight-color:transparent}button:focus-visible{outline:4px solid #315f91;outline-offset:5px}button:disabled{cursor:default}button svg{width:23px;height:23px;fill:none;stroke:currentColor;stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round;flex-shrink:0}header{max-width:1240px;margin:auto;padding:25px 36px;display:flex;align-items:center;justify-content:space-between;border-bottom:1px solid #dedfd1}.brand{display:flex;align-items:center;gap:12px;text-align:left;background:none;font-size:15px;line-height:1.2}.brand b{font-size:21px}.brand-mark{font:54px 'Fredoka',sans-serif;color:#c95b38;position:relative;line-height:1}.brand-mark span{font-size:22px;position:absolute;right:-9px;top:-6px;color:#c79c37}.header-actions{display:flex;gap:16px;align-items:center}.icon-button{position:relative;border:1px solid #d6dacb;border-radius:50%;height:48px;width:48px;display:grid;place-items:center;background:transparent}.slash{position:absolute;font-size:38px}.parent-button{display:flex;align-items:center;gap:9px;background:none;font-size:13px;font-weight:600;min-height:48px}main{max-width:1168px;margin:auto}.intro{display:flex;align-items:center;justify-content:space-between;padding:36px 9px 28px}.eyebrow{font-size:10px;letter-spacing:2.2px;font-weight:700;color:#607561;margin:0 0 13px}h1,h2{font-family:'Fredoka','Trebuchet MS',sans-serif;font-weight:500}h1{font-size:clamp(32px,3.7vw,48px);line-height:1.08;margin:0;letter-spacing:-.8px}.intro-copy{font-size:15px;color:#647467;margin:14px 0 0}.welcome-flower{font-size:90px;line-height:.9;text-align:center;color:#dca541;transform:rotate(9deg);margin-right:50px}.welcome-flower span{font:12px 'DM Sans',sans-serif;display:block;color:#68755c;margin-top:12px}.map{position:relative;height:510px;overflow:hidden;border-radius:25px;background:#deece6;border:6px solid #eeeadb}.landscape{position:absolute;inset:0;width:100%;height:100%}.map-label{position:absolute;top:22px;left:25px;font-size:10px;letter-spacing:1.8px;display:flex;align-items:center;gap:8px;font-weight:700}.live-dot{width:7px;height:7px;border-radius:50%;background:#648b66}.place{position:absolute;display:flex;flex-direction:column;align-items:center;width:245px;background:none;padding:0;isolation:isolate}.place:focus-visible{border-radius:15px}.garden-place{left:6%;top:114px}.house-place{left:40%;top:62px}.train-place{right:3%;top:185px}.building{height:160px;width:210px;display:block;position:relative;transition:transform .25s ease-out}.place button:hover,.place:hover .building{transform:translateY(-5px)}.place-label{display:block;background:#fff8e7;padding:12px 20px;border-radius:12px;box-shadow:0 4px 0 #486d5430;white-space:nowrap;font-family:'Fredoka',sans-serif;font-size:20px;font-weight:500;text-align:center}.place-label>span{font-family:'DM Sans',sans-serif;display:block;font-size:11px;font-weight:400;color:#697361;margin-top:4px}.muted-label{background:#e9e9d7;color:#4c6650}.tree{position:absolute;width:80px;height:100px;border-radius:48% 55% 45% 46%;background:#518364;top:6px;left:3px}.tree:after{content:'';position:absolute;width:10px;height:70px;background:#97734d;top:73px;left:35px;z-index:-1}.tree.two{left:126px;top:20px;background:#669361;width:65px;height:86px}.garden-friend{position:absolute;left:65px;bottom:8px;width:100px;height:110px;z-index:2}.fence{position:absolute;bottom:0;left:0;font:51px Georgia;color:#ead9ac;letter-spacing:-8px}.house-body{position:absolute;width:144px;height:112px;background:#ecb776;border-radius:5px;bottom:0;left:34px;box-shadow:inset -13px 0 #d69c64}.roof{position:absolute;top:0;left:16px;width:180px;height:75px;background:#bf6246;clip-path:polygon(50% 0,100% 100%,0 100%);z-index:3}.chimney{position:absolute;right:49px;top:9px;width:22px;height:53px;background:#b05a42}.door{position:absolute;bottom:0;right:18px;width:37px;height:67px;border-radius:25px 25px 0 0;background:#55776c;border:5px solid #f6d7a1}.window{position:absolute;left:14px;top:22px;width:51px;height:51px;background:#faf0ce;border:5px solid #bd7b50;border-radius:50%;font:33px 'Fredoka';text-align:center;line-height:37px}.train{height:120px}.engine{position:absolute;right:5px;bottom:22px;background:#bd7654;width:95px;height:65px;border-radius:10px 30px 3px 3px;font:44px 'Fredoka';text-align:center;color:#fae6b4}.engine:before{content:'';position:absolute;width:35px;height:23px;background:#637a60;top:-23px;left:9px;border-radius:3px}.wagon{position:absolute;bottom:22px;left:9px;width:82px;height:54px;border-radius:5px;background:#e0b768;font:40px 'Fredoka';color:#856638;text-align:center}.engine:after,.wagon:after{content:'●  ●';color:#475b50;font-size:29px;letter-spacing:9px;position:absolute;bottom:-19px;left:5px;white-space:nowrap}.track{position:absolute;bottom:8px;width:220px;height:5px;background:#7a7c5c}.mission{position:absolute;bottom:20px;left:22px;right:22px;background:#fff9eb;display:flex;align-items:center;gap:15px;padding:16px 20px;border-radius:16px;box-shadow:0 4px 0 #35543b15}.mission-star{display:grid;place-items:center;border-radius:50%;background:#f5e5ae;width:47px;height:47px;color:#9a712a}.mission-star svg{width:24px;height:24px;fill:none;stroke:currentColor;stroke-width:1.5}.mission small{display:block;font-size:9px;font-weight:700;letter-spacing:1.6px;color:#7e805f;margin-bottom:5px}.mission strong{font:20px 'Fredoka',sans-serif}.primary{display:inline-flex;align-items:center;justify-content:center;gap:13px;background:#bd5334;color:#fff8e8;border-radius:50px;padding:15px 25px;min-height:54px;font-weight:600;box-shadow:0 3px 0 #923e27}.mission .primary{margin-left:auto}.primary:active{transform:translateY(2px);box-shadow:none}.collection{display:flex;align-items:center;gap:30px;padding:30px 10px}.collection h2{margin:0;font-size:22px}.collection p{font-size:12px;color:#6c7968;margin:6px 0}.friend-list{display:flex;gap:12px}.friend{position:relative;width:63px;height:70px;border-radius:50%;background:#ede9da;padding:9px;opacity:.65}.friend.found{background:#e3ebce;opacity:1}.sprite{display:block;position:relative;overflow:hidden;height:100%;aspect-ratio:var(--ratio);margin:auto;mix-blend-mode:multiply;pointer-events:none}.sprite img{position:absolute;max-width:none;left:var(--left);top:var(--top);width:var(--width);height:auto}.check{position:absolute;right:-3px;bottom:0;border-radius:50%;background:#466d4a;color:#fff8e8;width:20px;height:20px;font-size:13px;display:grid;place-items:center}.collection-note{font-size:12px;line-height:1.6;margin-left:auto;color:#78816b;font-style:italic}footer{max-width:1168px;margin:0 auto;display:flex;justify-content:space-between;padding:19px 10px 25px;border-top:1px solid #dedfd1;font-size:10px;color:#71806e}footer span span{color:#c29042;font-size:18px;margin-left:6px}.activity{text-align:center;padding:25px 20px 60px;min-height:73vh}.back{display:flex;align-items:center;gap:8px;background:none;min-height:48px;margin-bottom:22px;font-size:14px}.activity-copy{color:#677661}.listen{margin:10px 0 26px}.listen .sprite{height:100px}.choices{display:flex;justify-content:center;gap:28px;margin:16px auto;max-width:780px}.choice{background:#f0e8d3;border:3px solid transparent;border-radius:40% 40% 22px 22px;padding:25px;min-width:170px;width:230px;height:245px;transition:transform .2s,background .2s}.choice .sprite{height:155px;max-width:100%}.character-name{display:block;margin-top:12px;font:19px 'Fredoka',sans-serif}.letter{font:125px 'Trebuchet MS',sans-serif;line-height:1}.choice.correct{background:#dfebce;border-color:#5f8751;transform:translateY(-6px)}.choice.try-again{background:#f1dcc0}.feedback{min-height:38px;margin:20px auto 10px;font-size:18px;color:#436641}.next[hidden]{display:none}.all-friends{display:grid;grid-template-columns:repeat(3,1fr);max-width:800px}.all-friends .choice{width:100%;min-width:0}.singing{animation:hello .7s ease-in-out}.parents{max-width:760px;padding:25px 25px 60px}.parents h1{margin-bottom:15px}.parents section{margin-top:35px;line-height:1.7}.parents h2{margin-top:27px;font-size:25px}.parents p{color:#60705f}.secondary{min-height:48px;padding:12px 20px;background:#e7e8d7;border-radius:9px}h1:focus{outline:none}@keyframes hello{50%{transform:rotate(-7deg) translateY(-9px)}}@media(min-width:1500px){.intro{padding-top:48px;padding-bottom:36px}.map{height:550px}}@media(max-width:900px){main,footer{margin-left:22px;margin-right:22px}.collection{gap:16px}.friend-list{gap:5px}.friend{width:49px;height:59px}.collection-note{display:none}.place{width:200px}.garden-place{left:1%;top:115px}.house-place{left:35%;top:65px}.train-place{right:0%;top:200px}.place-label{font-size:17px;padding:11px 14px}.building{transform:scale(.88);transform-origin:bottom center}.place:hover .building{transform:scale(.88) translateY(-5px)}.welcome-flower{margin-right:20px}.mission strong{font-size:18px}}@media(max-width:580px){header{padding:15px 20px}.brand b{font-size:18px}.brand{font-size:12px}.brand-mark{font-size:45px}.parent-button span{display:none}.header-actions{gap:8px}main,footer{margin-left:14px;margin-right:14px}.intro{padding:26px 4px 24px}.eyebrow{font-size:8px;letter-spacing:1.5px}.intro h1{font-size:34px}.intro-copy{font-size:13px;max-width:250px;line-height:1.5}.welcome-flower{font-size:57px;margin:0 6px 25px}.welcome-flower span{font-size:9px}.map{height:610px;border-width:4px;border-radius:21px}.map-label{left:17px;font-size:9px}.place{width:175px}.garden-place{left:0;top:70px}.house-place{left:auto;right:0;top:230px}.train-place{left:7px;right:auto;top:340px;width:145px}.train-place .building{transform:scale(.65);height:110px}.train-place .place-label{font-size:14px}.building{transform:scale(.8)}.place:hover .building{transform:scale(.8)}.place-label{font-size:16px;padding:10px 12px}.mission{left:10px;right:10px;bottom:11px;padding:13px;gap:10px}.mission-star{display:none}.mission strong{font-size:15px;display:block;max-width:160px}.mission small{font-size:7px}.mission .primary{padding:12px 16px;font-size:13px;gap:6px}.mission .primary svg{width:18px}.collection{display:block;padding:25px 4px}.collection h2{font-size:21px}.friend-list{margin-top:16px;justify-content:space-between}.friend{width:45px;height:56px}.collection p{font-size:11px}footer{gap:20px;font-size:9px;line-height:1.6}footer>span{max-width:48%}.activity{padding:18px 0 35px}.activity h1{font-size:32px}.choices{gap:12px}.choice{width:46%;min-width:0;height:210px;padding:18px 8px}.choice .sprite{height:130px}.character-name{font-size:16px}.all-friends{grid-template-columns:repeat(2,1fr)}.letter{font-size:110px}.feedback{font-size:16px}.parents{padding:20px 6px 40px}}@media(prefers-reduced-motion:reduce){*,*:before,*:after{animation:none!important;transition:none!important}}

.sprite{border-radius:0}.garden-friend{mix-blend-mode:multiply}
.voice-row{display:flex;gap:10px;align-items:center;padding:16px 0;border-bottom:1px solid #d8ddcd}.voice-row>div{flex:1}.voice-row small{display:block;color:#60705f;font-size:12px}.record-controls{display:flex;flex-wrap:wrap;gap:10px;margin-top:18px}.record-controls [hidden]{display:none}.voice-studio #voice-status{min-height:30px;font-weight:600}.import-label{cursor:pointer;display:flex;align-items:center;gap:10px;flex-wrap:wrap}.import-label input{max-width:220px;font:inherit;font-size:13px}button:disabled{opacity:.5;cursor:default}#audio-status{text-align:center;padding:0 20px}#audio-status:empty{display:none}@media(max-width:580px){.voice-row{flex-wrap:wrap}.voice-row>div{flex-basis:100%}.voice-row button{flex:1}}
.narration-panel label{display:block;margin:16px 0 6px;font-weight:600}.narration-panel select{display:block;width:100%;min-height:48px;padding:10px;font:inherit;color:var(--ink);background:#fff9eb;border:1px solid #9ca992;border-radius:8px}.narration-panel button{margin-top:16px}.narration-panel select:focus-visible{outline:3px solid #315f91;outline-offset:3px}
.illustrated-building{width:250px;height:190px}.illustrated-building>img{display:block;width:100%;height:100%;object-fit:contain;pointer-events:none}.garden-alpha{position:absolute;left:36%;top:44%;height:46%;width:31%;mix-blend-mode:multiply}.illustrated-train{width:260px;height:165px}.garden-place{top:84px}.house-place{top:32px}.train-place{top:140px}.place-label{position:relative;z-index:2}.place:active .illustrated-building{transform:translateY(-3px)}@media(max-width:900px){.garden-place{top:90px}.house-place{top:35px}.train-place{top:152px}.illustrated-building{width:230px}.illustrated-train{width:225px}}@media(max-width:580px){.garden-place{top:50px}.house-place{top:196px}.train-place{top:322px}.illustrated-building{width:215px;height:180px}.train-place .illustrated-train{height:130px;width:215px}.garden-alpha{left:36%;top:44%}}
.illustrated-building{mix-blend-mode:multiply}
@media(min-width:901px) and (max-width:1239px){main,footer{margin-left:26px;margin-right:26px}}

.character-art{--art-height:155px;display:flex;align-items:center;justify-content:center;height:var(--art-height);width:100%}.choice .character-art .sprite{height:auto;width:min(100%,calc(var(--art-height) * var(--ratio)));max-width:100%;flex:none}@media(max-width:580px){.character-art{--art-height:130px}}
.place{isolation:auto}.garden-alpha,.garden-alpha .sprite{mix-blend-mode:multiply}.collection{flex-wrap:wrap}.friend-list{flex:1 1 100%;display:grid;grid-template-columns:repeat(auto-fit,minmax(58px,1fr));gap:16px}.friend{justify-self:center}.collection-note{display:none}.all-friends{grid-template-columns:repeat(4,minmax(0,1fr));max-width:1000px}.all-friends .choice{padding:20px 12px}.all-friends .character-name{font-size:17px}@media(max-width:900px){.all-friends{grid-template-columns:repeat(3,minmax(0,1fr))}}@media(max-width:580px){.all-friends{grid-template-columns:repeat(2,minmax(0,1fr))}.friend-list{grid-template-columns:repeat(5,minmax(0,1fr));gap:12px}.friend{width:50px;height:60px}}

.illustrated-train{mix-blend-mode:normal}.house-place .illustrated-building{mix-blend-mode:normal}
.train-picker{display:flex;justify-content:center;gap:35px;margin:30px auto}.train-picker fieldset{border:0;margin:0;padding:0;min-width:0}.train-picker legend{font:20px 'Fredoka',sans-serif;margin-bottom:15px}.train-picker fieldset>div{display:flex;gap:10px}.train-pick{width:82px;height:98px;border:3px solid transparent;border-radius:18px;background:#eee5cf;padding:9px}.train-pick[aria-pressed=true]{border-color:#527752;background:#dce8ca}.syllable-train{display:flex;justify-content:center;align-items:center;margin:34px auto 42px}.sound-wagon{position:relative;width:180px;height:175px;background:#e2b76d;border-radius:22px 22px 8px 8px;border-bottom:12px solid #ba8c50;padding:15px;display:flex;align-items:center;gap:8px}.sound-wagon .sprite{height:110px;max-width:110px}.sound-wagon>span:last-child{font:42px 'Fredoka',sans-serif}.sound-wagon:after{content:'';position:absolute;bottom:-27px;left:22px;width:29px;height:29px;border:7px solid #3e5c4b;border-radius:50%;background:#d4be88;box-shadow:98px 0 0 -7px #d4be88,98px 0 0 0 #3e5c4b}.coupling{width:24px;height:10px;background:#54755c}.syllable-play strong{font:35px 'Fredoka',sans-serif}.train-activity .feedback{max-width:580px}@media(max-width:580px){.train-picker{gap:14px}.train-picker legend{font-size:16px}.train-picker fieldset>div{gap:4px}.train-pick{width:47px;height:70px;padding:5px}.sound-wagon{width:139px;height:145px;padding:9px}.sound-wagon .sprite{height:86px;max-width:88px}.sound-wagon:after{left:16px;box-shadow:70px 0 0 -7px #d4be88,70px 0 0 0 #3e5c4b}.sound-wagon>span:last-child{font-size:30px}.coupling{width:16px}}
.train-pick{display:flex;align-items:center;justify-content:center}.train-pick .sprite{height:auto;width:min(100%,calc(74px * var(--ratio)));flex:none}.sound-wagon .sprite{height:auto;width:min(68%,calc(110px * var(--ratio)));max-width:none;flex:none}.sound-wagon>span:last-child{flex:none}@media(max-width:580px){.train-pick .sprite{width:min(100%,calc(50px * var(--ratio)))}.sound-wagon .sprite{width:min(65%,calc(86px * var(--ratio)))}}
.village-path{text-align:center;font-size:42px;letter-spacing:7px;color:#b7a47a;height:68px}.lower-map{height:380px}.bridge-place{left:15%;top:62px}.workshop-place{right:15%;top:30px}.learning-activity{max-width:900px}.family-tabs{display:flex;justify-content:center;gap:12px;flex-wrap:wrap;margin:25px auto}.family-tabs [aria-pressed=true]{outline:3px solid #4f7c53;background:#dce8ca}.sound-bridge{position:relative;display:flex;justify-content:center;gap:8px;margin:35px auto 20px;max-width:380px;padding:20px 10px 45px;border-bottom:15px solid #b28b57;border-radius:0 0 40% 40%;background:#ead7ae}.sound-bridge>span{font:70px 'Fredoka',sans-serif}.bridge-water{position:absolute;bottom:-45px;color:#659eac;font-size:30px}.learning-activity .primary{margin:12px}.word-model{font:52px 'Fredoka',sans-serif;margin:25px}.word-slots{display:flex;justify-content:center;gap:8px;flex-wrap:wrap}.word-slots>span{width:70px;min-height:70px;border-bottom:4px solid #a58358;background:#eee5cf;border-radius:8px;font:42px 'Fredoka',sans-serif}.piece{font:32px 'Fredoka',sans-serif;background:#e2bb76;border-radius:15px;padding:12px 20px;min-width:64px;min-height:64px}.word-reveal{margin:24px;display:flex;flex-direction:column;gap:12px}.word-reveal>span{font-size:100px}.word-reveal strong{font:40px 'Fredoka',sans-serif}.prepare-word{padding:30px;background:#eee8d7;border-radius:20px;margin:25px auto;max-width:580px}@media(max-width:580px){.lower-map{height:530px}.bridge-place{left:0;top:52px}.workshop-place{right:0;top:247px}.word-slots>span{width:48px;min-height:56px;font-size:34px}.sound-bridge>span{font-size:56px}.learning-activity h1{font-size:30px}}
.picture-choice{font-size:65px;min-width:95px;min-height:100px}
/* One continuous landscape keeps every destination in the same village. */
.continuous-village{height:810px}.continuous-village .landscape{object-fit:fill}.village-routes{position:absolute;inset:0;width:100%;height:100%;pointer-events:none}.continuous-village .garden-place{left:4%;top:115px}.continuous-village .house-place{left:36%;top:38px}.continuous-village .train-place{left:auto;right:2%;top:195px}.continuous-village .bridge-place{left:15%;top:408px}.continuous-village .workshop-place{right:16%;top:434px}.continuous-village .mission{bottom:20px}.continuous-village .workshop-place .illustrated-building,.continuous-village .bridge-place .illustrated-building{mix-blend-mode:normal}@media(max-width:900px){.continuous-village{height:880px}.continuous-village .garden-place{left:1%;top:65px}.continuous-village .house-place{left:auto;right:3%;top:35px}.continuous-village .train-place{right:5%;top:319px}.continuous-village .bridge-place{left:3%;top:371px}.continuous-village .workshop-place{right:24%;top:583px}.continuous-village .illustrated-building{height:158px}.continuous-village .illustrated-train{height:145px}}@media(max-width:580px){.continuous-village{height:1220px}.continuous-village .place{width:175px}.continuous-village .garden-place{left:0;top:52px}.continuous-village .house-place{right:0;top:260px}.continuous-village .train-place{left:0;right:auto;top:466px}.continuous-village .bridge-place{left:auto;right:0;top:664px}.continuous-village .workshop-place{right:auto;left:0;top:867px}.continuous-village .illustrated-building{height:163px;width:210px}.continuous-village .illustrated-train{height:145px}.continuous-village .mission{bottom:16px}.continuous-village .landscape{width:200%;max-width:none;left:-50%}}
/* Buildings and terrain share the same coordinate system at each layout. */
.continuous-village{height:auto;aspect-ratio:1200/900}.continuous-village .village-terrain{left:0;width:100%;height:100%;max-width:100%}.routes-narrow{display:none}.continuous-village .place{width:22%;right:auto}.continuous-village .illustrated-building,.continuous-village .illustrated-train{width:100%;height:auto;aspect-ratio:280/220;transform:none}.continuous-village .illustrated-train{aspect-ratio:300/200}.continuous-village .garden-place{left:5%;top:13%}.continuous-village .house-place{left:35%;top:8%}.continuous-village .train-place{left:72%;top:24%}.continuous-village .bridge-place{left:16.5%;top:46%}.continuous-village .workshop-place{left:58%;top:49%}.continuous-village .place:hover .building{transform:translateY(-3px)}.continuous-village .place-label{font-size:clamp(14px,1.6vw,20px);padding:10px 13px}.continuous-village .place-label>span{font-size:11px}.continuous-village .garden-alpha{top:44%;height:46%}.continuous-village .mission{bottom:2.5%}@media(max-width:680px){.continuous-village{aspect-ratio:auto;height:1220px}.routes-wide{display:none}.routes-narrow{display:block}.continuous-village .place{width:48%;max-width:220px}.continuous-village .garden-place{left:1%;top:5%}.continuous-village .house-place{left:auto;right:1%;top:21%}.continuous-village .train-place{left:1%;top:38%}.continuous-village .bridge-place{left:auto;right:1%;top:54%}.continuous-village .workshop-place{left:1%;top:71%}.continuous-village .mission{bottom:16px}.continuous-village .place-label{font-size:16px}.continuous-village .place-label>span{font-size:10px}.continuous-village .village-terrain{height:100%;width:100%;left:0}}
#recording-panel.near-voice{padding:4px 16px 12px;background:#eee8d7;border-radius:0 0 14px 14px;margin-bottom:16px;scroll-margin:20px}#recording-panel.near-voice .record-controls{margin-top:8px}#recording-panel.near-voice #voice-status{margin-bottom:0;font-size:14px}#stop-record{background:#a43d2e;min-width:140px;min-height:56px}

/* Large, stable targets for the four-letter activity. */
html { touch-action: pan-x pan-y; }
.letter-choices { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); max-width:580px; gap:16px; }
.letter-choices .choice { width:100%; min-width:0; height:155px; padding:12px; border-radius:26px; }
.letter-choices .letter { font-family:'Trebuchet MS',sans-serif; font-size:100px; }
@media(max-height:650px) and (min-width:650px) {
  .letter-choices { grid-template-columns:repeat(4,minmax(0,1fr)); max-width:800px; }
}
/* The easel shares the village ground; the story lives in its existing invitation. */
.continuous-village .tracing-place{left:40%;top:63%;width:18%}
.continuous-village .tracing-place .place-label{white-space:normal;min-width:170px}
.continuous-village .tracing-place .illustrated-building{aspect-ratio:280/180}
@media(max-width:680px){
 .continuous-village{height:1430px}
 .continuous-village .garden-place{top:61px}.continuous-village .house-place{top:256px}
 .continuous-village .train-place{top:464px}.continuous-village .bridge-place{top:659px}
 .continuous-village .workshop-place{top:866px}
 .continuous-village .tracing-place{left:auto;right:1%;top:1060px;width:48%}
}
.trace-activity{max-width:880px;padding-top:16px}
.trace-activity .back{margin-bottom:10px}
.trace-heading{display:flex;justify-content:space-between;align-items:center;gap:18px;text-align:left;max-width:620px;margin:auto}
.trace-heading p:last-child{font-size:14px;line-height:1.5;max-width:360px;margin-bottom:0}
.trace-heading h1{font-size:clamp(28px,4vw,40px)}
.trace-friend{width:92px;height:95px;flex:none;display:flex;align-items:center;justify-content:center}
.trace-friend .sprite{height:auto;width:min(100%,calc(95px * var(--ratio)));flex:none}
.trace-tools{display:flex;align-items:center;justify-content:space-between;gap:12px;max-width:620px;margin:16px auto 10px;text-align:left}
.trace-tools p{font-size:14px;line-height:1.4;min-height:40px;margin:0;display:flex;align-items:center}
.trace-tools button{font-size:13px;white-space:nowrap}
#trace-board{display:block;width:min(100%,620px);height:min(53vh,500px);min-height:275px;margin:auto;touch-action:none;user-select:none;-webkit-user-select:none;cursor:crosshair;border-radius:24px}
#trace-board:focus-visible{outline:4px solid #315f91;outline-offset:4px}
.trace-guide,.trace-ink{fill:none;stroke-linecap:round;stroke-linejoin:round;stroke-width:36}
.trace-guide{stroke:#e4d6b5}.trace-ink{stroke:#6f9470}
#trace-marker circle{fill:#cc633b;stroke:#fff9eb;stroke-width:4}
#trace-marker path{fill:none;stroke:#fff9eb;stroke-width:3;stroke-linecap:round;stroke-linejoin:round}
#trace-demo-dot[hidden]{display:none}
.trace-complete .trace-ink{stroke:#477654}
.trace-keyboard{max-width:600px;margin:14px auto;color:#64705d;font-size:12px;line-height:1.5}
@media(pointer:coarse){.trace-keyboard{display:none}}
.trace-stars{font-size:70px;color:#bb8b2f;margin:35px 0 15px}
.trace-alphabet{font:clamp(28px,7vw,65px) 'Trebuchet MS',sans-serif;letter-spacing:10px;margin:30px 0}
.trace-finish .secondary{margin:16px}
.story-activity{max-width:1000px}
.story-book{display:grid;grid-template-columns:1fr 1fr;margin:30px auto;text-align:left;background:#fff9eb;border-radius:30px;overflow:hidden}
.story-scene{position:relative;min-height:380px;overflow:hidden;background:#dce9df;display:flex;flex-direction:column;align-items:center;justify-content:center;padding:25px}
.story-orbit{font-size:24px;color:#9c7430;display:flex;gap:24px;align-items:center}
.story-orbit>span{font-size:100px;line-height:1.3}
.story-hero{font:30px 'Fredoka',sans-serif;z-index:1}
.story-friends{display:flex;align-items:end;justify-content:center;gap:12px;height:120px;margin:28px 0 8px;z-index:1;width:100%}
.story-friends .sprite{height:auto;width:min(28%,calc(110px * var(--ratio)));margin:0;flex:none;max-height:115px}
.story-hills{position:absolute;left:-20%;right:-20%;height:130px;bottom:-45px;border-radius:50%;background:#a7bd8b;transform:rotate(-8deg)}
.story-night{background:#dcdbe2}.story-night .story-hills{background:#b3adc1}.story-night .story-orbit{color:#6b577e}
.story-magic .story-orbit{color:#aa7529}
.story-copy{padding:32px;display:flex;flex-direction:column;justify-content:center;gap:18px}
.story-copy>p{font:23px/1.6 'Fredoka',sans-serif;margin:0}
.story-copy>#story-listen{align-self:flex-start}
.story-navigation{display:flex;justify-content:space-between;gap:12px;margin-top:12px}
.story-navigation .primary{min-height:60px;font-size:18px;flex:1}
.story-navigation .secondary{min-width:55px}
@media(max-width:680px){.story-book{grid-template-columns:1fr;margin-top:20px}.story-scene{min-height:225px;padding:14px}.story-orbit>span{font-size:55px}.story-hero{font-size:25px}.story-friends{height:85px;margin:14px 0 5px}.story-friends .sprite{width:min(24%,calc(75px * var(--ratio)));max-height:80px}.story-copy{padding:22px;gap:14px}.story-copy>p{font-size:21px}.trace-tools .secondary{padding:10px}.trace-heading{gap:8px}.trace-friend{width:65px;height:78px}}
.voice-row:has(.story-record-text){flex-wrap:wrap}.voice-row .story-record-text{max-width:620px;font-size:15px;line-height:1.6;margin:10px 0}.voice-row:has(.story-record-text)>div{flex-basis:100%}
.story-friends{mix-blend-mode:multiply}
@media(min-width:681px){.continuous-village .tracing-place{top:56%}.continuous-village .tracing-place .place-label{font-size:13px;white-space:nowrap;min-width:160px;padding:9px}.continuous-village .tracing-place .place-label>span{font-size:10px}}
.continuous-village .tracing-place .illustrated-building{mix-blend-mode:normal}