:root{--teal:#268eaa;--ink:#244d68;--muted:#617f91;--paper:#eafbfc;--orange:#ffa962}
body{background:linear-gradient(180deg,#d5f5fc,#f5fffb 70%,#e5f7ed);min-height:100dvh}.app{max-width:1120px;padding:18px 24px}.brand{letter-spacing:0;font-size:23px}.brand small{letter-spacing:1.2px;color:#58808e}.brand-icon{background:#fff4c8}.header{margin-bottom:16px}.header-actions{gap:6px}.parent-button{color:#527586}.star-pill{background:white;color:#896524}.sound-toggle{border:2px solid #d0e9e8;border-radius:50%;background:white;font-size:22px;width:46px;padding:0}.adventure-home{position:relative;border:4px solid white;border-radius:38px;overflow:hidden;background:#edfbfc;box-shadow:0 12px 40px #268eaa15}.island-scene{width:100%;display:block}.home-copy{position:absolute;top:25px;left:35px;max-width:65%}.home-copy h1{font-size:36px;letter-spacing:-1px;margin:0 0 7px}.home-copy p{font-size:17px;color:#4d7d8d;margin:0}.home-dock{display:flex;align-items:center;justify-content:space-between;gap:20px;padding:16px 28px 22px;background:#fffefa}.home-dock p{margin:0;color:#5a7d84;font-size:17px}.home-dock small{display:block;font-size:13px;margin-top:6px;color:#718984}.home-play{font-size:23px;min-height:64px;border-radius:24px;padding:12px 34px;background:#ffae65;box-shadow:0 5px 0 #dc8541;color:#563b27}.home-practice{display:block;margin:18px auto;color:#557d87;text-decoration:underline;font-size:13px}.home-bubble{position:absolute;width:48px;height:48px;border-radius:50%;border:3px solid #fff;background:#ffffff70;font-size:25px;animation:bubble-drift 5s ease-in-out infinite}.bubble-a{left:49%;top:37%}.bubble-b{right:8%;top:35%;animation-delay:-2s}.bubble-c{left:39%;top:66%;animation-delay:-1s}.home-bubble.popped{animation:bubble-pop .4s forwards}.adventure-map{display:flex;align-items:center;justify-content:space-between;border-radius:25px;background:#fffdf4;border:2px solid #f5e6c3;padding:10px 20px;margin:12px 0;gap:12px}.quest-copy{min-width:0}.quest-copy strong{font-size:17px}.quest-copy small{display:block;color:#798d90;font-size:12px;margin-top:3px}.shell-track{display:flex;align-items:center;gap:13px}.quest-shell{font-size:31px;filter:grayscale(1);opacity:.3;transform:scale(.85);transition:all .4s}.quest-shell.earned{filter:none;opacity:1;transform:scale(1)}.sticker-button{background:#f0eafb;border-radius:17px;font-size:25px;padding:8px 14px;white-space:nowrap}.sticker-button small{font-size:12px;color:#775c9d}.quest-reward{position:fixed;top:18%;left:50%;transform:translateX(-50%);background:#fff9d8;border:4px solid white;border-radius:28px;padding:20px 34px;box-shadow:0 15px 65px #244d6830;z-index:50;display:flex;align-items:center;gap:18px;max-width:90vw;pointer-events:none;animation:reward-in .45s cubic-bezier(.2,1.6,.5,1)}.quest-reward>span{font-size:62px}.quest-reward strong{font-size:22px;display:block}.quest-reward small{display:block;font-size:14px;color:#8d784b;margin-top:6px}.sticker-collection{display:grid;grid-template-columns:repeat(3,1fr);gap:12px;margin:22px 0}.sticker-cell{background:#f0f6f7;border-radius:22px;text-align:center;padding:18px 5px;font-size:45px;filter:grayscale(1);opacity:.3}.sticker-cell.unlocked{filter:none;opacity:1;background:#fff2d1}.sticker-cell small{display:block;font-size:12px;color:#547888;margin-top:6px}.finish-adventure{background:#ffe9ac;color:#77602f;border-radius:15px;padding:8px 15px;font-weight:700}
body:not(.playing):not(.tools-open) #teacher-panel,body:not(.playing):not(.tools-open) .adventure-map,body:not(.playing):not(.tools-open) .workspace,body:not(.playing):not(.tools-open) .subject-tabs{display:none!important}body.playing #adventure-home,body.playing .home-practice,body.tools-open #adventure-home,body.tools-open .home-practice{display:none}body:not(.tools-open) .subject-tabs,body:not(.tools-open) .lesson-picker,body:not(.tools-open) .mode-tabs,body:not(.tools-open) .lesson-nav,body:not(.tools-open) .segmented,body:not(.tools-open) #quiz-next,body:not(.tools-open) #trace-next,body:not(.tools-open) .begin-button,body:not(.tools-open) .lesson-kicker,body:not(.tools-open) #lesson-kicker{display:none!important}body:not(.tools-open) .workspace{display:block}body:not(.tools-open) .trace-tools{justify-content:flex-end}body:not(.tools-open) .lesson-panel{max-width:900px;margin:auto;padding:17px 24px 12px;border:3px solid white;border-radius:32px;background:#ffffffed;box-shadow:0 8px 35px #42849a15}body:not(.tools-open) .lesson-topline{margin:0 0 13px}body:not(.tools-open) h2{font-size:25px}body:not(.tools-open) .learn-view{gap:22px}body:not(.tools-open) .big-card{min-height:260px;border-radius:32px;background:#fff0d8;border:3px solid #ffdfae}body:not(.tools-open) .meaning-card{background:#e9f8e2;border:3px solid #cce9bd;border-radius:32px}body:not(.tools-open) .fruit{font-size:44px;min-width:44px;min-height:52px}.fruit.counted{opacity:1;transform:scale(.86);filter:drop-shadow(0 0 6px #ffd464)}.fruit.counted::after{content:'✓';font-size:17px;color:#428541;display:inline-block;vertical-align:top}body:not(.tools-open) .quiz-mascot{font-size:0;height:70px;background:url('finn.svg') center/95px auto no-repeat}body:not(.tools-open) .quiz-option{border-radius:50%;height:125px;width:125px;background:radial-gradient(circle at 30% 25%,#fff 0%,#d9f7ff 45%,#a9e2ee);border:4px solid #a0d9ec;box-shadow:inset -5px -7px 0 #76bad326,0 7px 0 #6eb8ce24;color:#286b91;animation:bubble-drift 4s ease-in-out infinite}body:not(.tools-open) .quiz-option:nth-child(2){animation-delay:-1.3s}body:not(.tools-open) .quiz-option:nth-child(3){animation-delay:-2.6s}.quiz-option.correct{animation:reward-in .5s!important;background:#fff0a8!important;border-color:#f2cc64!important;color:#816118!important}.board-wrap{border:3px solid #b8e4d7;background:#f8fffa}.board{background:none;border-color:#b6d8c7;border-radius:25px}.trace-feedback{color:#477968}.trace-actions button{font-size:15px;color:#428299;background:#eaf5f9;border-radius:16px;margin-left:7px}.trace-success{background:#fff4c4!important}.teacher-avatar{width:105px;height:84px;background:url('finn.svg') center/contain no-repeat;font-size:0;transform-origin:60% 70%;animation:finn-float 4s ease-in-out infinite}.teacher-copy h1{font-size:23px;letter-spacing:0}.teacher-copy .eyebrow{display:none}.teacher-copy p{color:#3c7185;font-size:15px!important}#teacher-caption{font-size:18px!important;color:#244d68!important}#teacher-panel{border:3px solid white;background:#e2f5ff;border-radius:28px;box-shadow:0 6px 25px #4c9bab13;padding:10px 18px;gap:12px;margin:12px 0!important}.teacher-actions{min-width:130px}.teacher-actions button{min-width:0;font-size:13px;min-height:44px}.teacher-live #teacher-start{display:none}.teacher-live #teacher-panel{border-color:#98d6e6}.teacher-live .teacher-avatar{animation:finn-float 3.5s ease-in-out infinite}body[data-teacher-phase=speaking] .teacher-avatar{animation:finn-talk .5s ease-in-out infinite}body[data-teacher-phase=listening] .teacher-avatar{filter:drop-shadow(0 0 7px #76d7e9)}.teacher-avatar.cheer{animation:finn-cheer .75s ease-out!important}.page-footer{color:#678b92;padding-top:15px}.practice-tag{font-size:12px;color:#5e778a;background:#eef5f8;border-radius:12px;padding:6px 10px}.sound-note{font-size:12px;color:#668795;text-align:center}.sparkle-burst{position:fixed;pointer-events:none;z-index:48;font-size:28px;animation:sparkle .9s ease-out forwards}
@keyframes bubble-drift{50%{transform:translateY(-9px) rotate(3deg)}}@keyframes bubble-pop{to{transform:scale(1.4);opacity:0}}@keyframes finn-float{50%{transform:translateY(-5px) rotate(-3deg)}}@keyframes finn-talk{50%{transform:translateY(-3px) rotate(2deg) scale(1.025)}}@keyframes finn-cheer{35%{transform:translateY(-18px) rotate(-10deg)}70%{transform:translateY(-5px) rotate(8deg)}}@keyframes reward-in{from{opacity:0;scale:.7}to{opacity:1;scale:1}}@keyframes sparkle{to{transform:translate(var(--dx),-95px) rotate(40deg);opacity:0}}
@media(min-width:900px) and (max-height:850px){.app{padding-top:10px}.header{margin-bottom:7px}.adventure-map{padding:6px 17px;margin:8px 0}.teacher-copy h1{font-size:20px}.teacher-avatar{width:78px;height:60px}#teacher-caption{font-size:15px!important}body[data-mode=trace] #teacher-caption{display:block}body[data-mode=trace] .teacher-copy h1{display:none}body[data-mode=trace] .teacher-avatar{width:72px;height:58px}body:not(.tools-open) .board{width:280px}body:not(.tools-open) .trace-tools{margin:0 0 5px}body:not(.tools-open) .board-label{padding:7px 13px}body:not(.tools-open) .trace-footer{min-height:35px}.shell-track{gap:10px}body[data-mode=trace] .lesson-topline{margin:0 0 6px}body:not(.tools-open) .lesson-panel{padding-top:12px}}
@media(max-width:700px){.app{padding:12px}.brand{font-size:18px}.brand small{font-size:8px}.header-actions{gap:2px}.star-pill{padding:7px 9px}.sound-toggle{width:40px;min-height:40px}.home-copy{top:18px;left:20px;max-width:80%}.home-copy h1{font-size:27px}.home-copy p{font-size:14px}.island-scene{height:310px;object-fit:cover;object-position:42%}.home-dock{padding:17px;flex-direction:column;text-align:center;gap:15px}.home-play{width:100%;font-size:22px}.home-bubble{width:42px;height:42px}.adventure-map{padding:9px 12px;gap:8px}.quest-copy strong{font-size:14px}.quest-copy small{font-size:10px}.shell-track{gap:4px}.quest-shell{font-size:25px}.sticker-button{font-size:23px;padding:7px}.sticker-button small{display:none}#teacher-panel{padding:10px!important}.teacher-avatar{width:72px;height:65px}.teacher-copy h1{font-size:20px}.teacher-actions{flex-direction:row;flex-wrap:wrap;min-width:0;width:100%}.teacher-actions button{flex:1}.teacher-copy p{font-size:13px!important}#teacher-caption{font-size:15px!important}body:not(.tools-open) .lesson-panel{padding:16px 12px}body:not(.tools-open) .big-card{min-height:230px}body:not(.tools-open) .learn-view{gap:10px}body:not(.tools-open) .fruit{font-size:30px;min-width:30px}body:not(.tools-open) h2{font-size:20px}body:not(.tools-open) .quiz-option{width:87px;height:95px;min-height:95px;font-size:46px}body:not(.tools-open) .quiz-choices{gap:13px}.quest-reward{padding:16px 20px;gap:12px}.quest-reward>span{font-size:42px}.quest-reward strong{font-size:18px}}
@media(prefers-reduced-motion:reduce){*,*::before,*::after{animation:none!important;transition:none!important}}

@media(prefers-reduced-motion:reduce){.teacher-avatar.cheer,.teacher-live .teacher-avatar,body[data-teacher-phase=speaking] .teacher-avatar,.home-bubble,.home-bubble.popped,.quiz-option.correct,body:not(.tools-open) .quiz-option{animation:none!important}}

.home-actions{display:flex;flex-direction:column;align-items:center;gap:7px}.home-actions .quiet-button{color:#477b8f;font-size:14px;padding:5px 12px}@media(max-width:700px){.home-actions{width:100%}}

.imagine-view{background:linear-gradient(145deg,#effafa,#fff8e7);border-radius:26px;text-align:center;padding:16px 20px 24px;min-height:290px}.imagine-invitation{font-weight:800;color:#347c87;font-size:20px;margin:0 0 6px}.shape-story{display:flex;align-items:center;justify-content:center;gap:16px;min-width:0}.shape-story svg{width:clamp(120px,22vw,210px);height:clamp(120px,22vw,210px);flex-shrink:1}.shape-picture{font-size:clamp(58px,9vw,100px);line-height:1.3;max-width:45%;overflow-wrap:anywhere}.shape-spark{font-size:32px;color:#d3a15d}.imagine-view h3{font-size:clamp(19px,3vw,25px);margin:5px 0 8px;color:#285a68}.imagine-view p:not(.imagine-invitation){margin:4px 0 10px}.imagine-view small{color:#58777b}.shape-story svg{animation:shape-arrive .45s ease-out}@keyframes shape-arrive{from{opacity:0;transform:scale(.92)}to{opacity:1;transform:scale(1)}}@media(prefers-reduced-motion:reduce){.shape-story svg{animation:none}}

.hunt-view{border-radius:24px;padding:14px 18px;background:linear-gradient(150deg,#eaf6db,#fff8dc);min-height:300px}.hunt-view[data-scene=snow]{background:linear-gradient(150deg,#e0f5ff,#f9fdff)}.hunt-view[data-scene=ocean]{background:linear-gradient(150deg,#d9f7fa,#dfebff)}.hunt-view[data-scene=garden]{background:linear-gradient(150deg,#eaf8df,#fff0f8)}.hunt-heading{display:flex;align-items:center;gap:12px;margin-bottom:12px}.hunt-heading>span{font-size:36px}.hunt-heading h3{font-size:clamp(19px,3vw,25px);margin:3px 0}.hunt-heading small{color:#56766d}.hunt-heading strong{margin-left:auto;font-size:23px;background:white;padding:10px 14px;border-radius:18px;white-space:nowrap}.hunt-grid{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:10px}.hunt-item{position:relative;border:2px solid #ffffff;border-radius:21px;min-height:68px;min-width:0;background:#ffffffb3;font-size:clamp(34px,5vw,49px);cursor:pointer;touch-action:manipulation;transition:transform .15s,opacity .2s;display:grid;place-items:center;padding:6px}.hunt-item:active{transform:scale(.93)}.hunt-item.found{background:#cbf1d8;border-color:#74b795;opacity:.62}.hunt-item.found:after{content:'✓';position:absolute;right:4px;top:1px;font-size:17px;color:#21603f}.treasure-base{position:absolute;font-size:53px;opacity:.23}.letter-treasure .hunt-label{position:relative;font-weight:850;color:#255965;text-shadow:0 1px white}.hunt-view>p{margin:12px 0 2px;text-align:center;min-height:24px}.gentle-wiggle{animation:gentle-wiggle .3s ease-out}@keyframes gentle-wiggle{25%{transform:rotate(-4deg)}75%{transform:rotate(4deg)}}@media(max-width:500px){.hunt-grid{grid-template-columns:repeat(4,minmax(0,1fr));gap:8px}.hunt-view{padding:12px}.hunt-item{min-height:61px}.hunt-heading{gap:7px}.hunt-heading>span{font-size:25px}.hunt-heading strong{font-size:19px;padding:8px}.hunt-heading h3{font-size:19px}}@media(prefers-reduced-motion:reduce){.hunt-item{transition:none}.gentle-wiggle{animation:none}}

/* Always-visible small directory: browse content without exposing parent tools. */
.lesson-menu{position:relative;z-index:12;margin:8px 0 12px;background:#ffffffde;border:2px solid #d3e9e6;border-radius:20px;max-width:100%}.lesson-menu-bar{display:flex;align-items:center;gap:8px;padding:7px 10px;flex-wrap:wrap}.menu-label{font-size:12px;color:#6b8588;margin-right:3px}.lesson-menu-bar button{min-height:44px;padding:8px 14px;border-radius:14px;background:#e8f7f7;color:#286579;font-size:17px;font-weight:800}.lesson-menu-bar button:nth-of-type(2){background:#f2eaff;color:#735990}.lesson-menu-bar button[aria-expanded=true]{outline:2px solid #58a6ae;background:#d8f0f0}.lesson-menu-bar button span{font-size:13px;margin-left:4px}.menu-current{margin-left:auto;color:#5a7d88;font-size:12px;padding-right:5px}.lesson-menu-drawer{position:absolute;top:calc(100% + 6px);left:0;right:0;background:#fffef7;border:2px solid #d1e9e3;border-radius:20px;padding:12px 15px;box-shadow:0 14px 35px #244d6826;z-index:20}.menu-drawer-heading{display:flex;justify-content:space-between;align-items:center;margin-bottom:8px;color:#466e7c;font-size:14px}.menu-drawer-heading button{min-width:44px;min-height:44px;border-radius:12px;background:#f0f6f4}.menu-grid{display:grid;grid-template-columns:repeat(10,minmax(44px,1fr));gap:7px}.menu-grid.letter-menu{grid-template-columns:repeat(13,minmax(44px,1fr))}.menu-grid button{min-width:44px;min-height:46px;border-radius:13px;font-size:23px;font-weight:800;background:#eaf5f2;color:#2b6170;border:2px solid transparent}.menu-grid button[aria-pressed=true]{background:#ffe7b4;border-color:#e5bd72}.lesson-menu-drawer p{font-size:12px;color:#71857d;margin:10px 0 0}.menu-actions{display:flex;align-items:center;flex-wrap:wrap;gap:7px;padding:0 10px 7px}.menu-actions>strong{background:#fff0cc;color:#846632;min-width:35px;text-align:center;padding:4px 8px;border-radius:10px;font-size:20px}.menu-actions button{min-height:44px;border-radius:12px;background:#f4f7f3;color:#487478;font-size:13px;padding:6px 12px}.menu-actions>span{font-size:11px;color:#728b8c;margin-left:auto}.lesson-menu button:disabled{opacity:.5}@media(max-width:800px){.menu-grid.letter-menu{grid-template-columns:repeat(9,minmax(44px,1fr))}}@media(max-width:600px){.menu-label{display:none}.menu-current{font-size:11px}.lesson-menu-bar{gap:6px}.lesson-menu-bar button{padding:7px 11px}.lesson-menu-bar button span{font-size:12px}.menu-grid,.menu-grid.letter-menu{grid-template-columns:repeat(5,minmax(44px,1fr))}.menu-actions>span{display:none}.lesson-menu-drawer{padding:10px}.menu-grid{gap:6px}.menu-grid button{min-height:44px}.menu-drawer-heading{margin-bottom:5px}}
@media(min-width:900px){.lesson-menu{display:flex;align-items:center;flex-wrap:wrap}.lesson-menu-bar{flex:1;min-width:0}.menu-actions{padding:7px 10px}.menu-actions>span{display:none}body.playing .menu-label{display:none}}

.shape-picture{display:flex;align-items:center;justify-content:center;width:clamp(120px,22vw,210px);max-width:45%;font-size:initial}.shape-picture svg{width:100%;height:auto;display:block}.objects.letter-object svg{width:min(100%,190px);height:auto;display:block;margin:auto}.objects.letter-object{min-width:0}

.shape-tap{display:flex;align-items:center;justify-content:center;width:clamp(120px,22vw,210px);min-width:0;flex-shrink:1;padding:0;border:3px solid transparent;border-radius:22px;background:transparent;box-shadow:none;touch-action:manipulation}.shape-tap svg{width:100%;max-width:100%}.shape-tap.selected{background:#d9f3e6;border-color:#398b71}.shape-tap:focus-visible{outline:3px solid #347c87;outline-offset:3px}#shape-feedback{min-height:1.5em;color:#28634f;font-weight:700}
