:root{--color-paper: #faf8f0;--color-surface: #fffdf8;--color-ink: #403b37;--color-muted: #797269;--color-purple: #7960a6;--color-purple-deep: #62488e;--color-focus: #493471;--color-on-accent: #ffffff;--color-celebration-yellow: #f2b544;--color-celebration-pink: #e982a5;--color-celebration-blue: #68a9d8;--space-page: 24px;--space-shell: 40px;--radius-button: 16px;color:var(--color-ink);background:var(--color-paper);font-family:Trebuchet MS,Segoe UI,Arial,sans-serif;font-synthesis:none}:root[data-theme=sky]{--color-paper: #eef8ff;--color-surface: #ffffff;--color-ink: #263b4a;--color-muted: #5f7482}:root[data-theme=mint]{--color-paper: #effaf4;--color-surface: #ffffff;--color-ink: #29443a;--color-muted: #607a6d}:root[data-theme=blush]{--color-paper: #fff1f5;--color-surface: #ffffff;--color-ink: #4a3038;--color-muted: #795c66;--color-purple: #d96b8a;--color-purple-deep: #b34f6d;--color-focus: #8c3f5b}:root[data-theme=sunny]{--color-paper: #fff4c2;--color-surface: #fffdf2;--color-ink: #4a3b20;--color-muted: #75633d;--color-purple: #e08a24;--color-purple-deep: #a85d12;--color-focus: #73420d}:root[data-theme=peach]{--color-paper: #fff0f2;--color-surface: #ffffff;--color-ink: #512f3a;--color-muted: #795c66;--color-purple: #d85c78;--color-purple-deep: #a63d5b;--color-focus: #733047}:root[data-theme=lavender]{--color-paper: #f3eeff;--color-surface: #ffffff;--color-ink: #3d3452;--color-muted: #6f6680;--color-purple: #7656b3;--color-purple-deep: #543487;--color-focus: #3d256d}:root[data-theme=coral]{--color-paper: #fff1e8;--color-surface: #ffffff;--color-ink: #51352b;--color-muted: #7d6256;--color-purple: #d8663a;--color-purple-deep: #a94320;--color-focus: #713018}:root[data-theme=ocean]{--color-paper: #e8f5fa;--color-surface: #ffffff;--color-ink: #25404a;--color-muted: #5d7680;--color-purple: #32839a;--color-purple-deep: #216073;--color-focus: #174654}:root[data-theme=forest]{--color-paper: #eef7e8;--color-surface: #ffffff;--color-ink: #30452c;--color-muted: #607a58;--color-purple: #5a8f48;--color-purple-deep: #3e6d32;--color-focus: #294c22}*{box-sizing:border-box}html{min-width:320px;background:var(--color-paper);color-scheme:light;overflow-x:hidden}body{min-width:320px;min-height:100vh;min-height:100dvh;margin:0;overflow-x:hidden}button{min-height:56px;padding:12px 24px;border:0;border-radius:var(--radius-button);background:var(--color-purple);color:#fff;cursor:pointer;font:inherit;font-weight:700;transition:background-color .18s ease,transform .18s ease}.screen-header{display:flex;align-items:center;justify-content:space-between;gap:16px;margin-bottom:32px}.home-screen{display:flex;flex-direction:column}.home-screen .ui-button{align-self:flex-start;margin-top:12px}.theme-picker{max-width:480px;margin:8px 0 20px;padding:0;border:0}.theme-picker legend{margin-bottom:8px;color:var(--color-muted);font-size:.9rem;font-weight:700}.theme-picker__options{display:flex;flex-wrap:wrap;gap:8px}.theme-picker__option{min-height:44px;padding:8px 14px;border:2px solid transparent;background:var(--color-surface);color:var(--color-ink);box-shadow:inset 0 0 0 1px #403b372e;font-size:.85rem}.theme-picker__option[aria-pressed=true]{border-color:var(--color-focus);box-shadow:inset 0 0 0 2px var(--color-focus)}.learning-map{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:12px}.learning-node{display:flex;min-height:128px;padding:12px;flex-direction:column;align-items:center;justify-content:center;gap:4px;border:2px solid transparent;border-radius:20px;background:var(--color-surface);box-shadow:0 4px 12px #403b3714;color:var(--color-ink);cursor:pointer;font:inherit}.learning-node strong{color:var(--color-purple-deep);font-size:2.2rem;line-height:1}.learning-node small,.learning-node__order{color:var(--color-muted);font-size:.75rem}.learning-node--locked{opacity:.55;cursor:not-allowed}.learning-node--available{border-color:var(--color-purple)}.writing-practice{text-align:center}.writing-practice h2{margin:0 0 8px;font-size:clamp(1.5rem,5vw,2rem)}.writing-practice>p{color:var(--color-muted)}.writing-board{position:relative;width:min(100%,360px);height:min(68vh,420px);min-height:280px;margin:24px auto;overflow:hidden;border:3px dashed var(--color-purple);border-radius:24px;background:var(--color-surface);touch-action:none}.writing-board__guide,.writing-board__canvas{position:absolute;inset:0;width:100%;height:100%}.writing-board__guide{padding:12%;color:var(--color-muted);opacity:.22}.writing-board__guide path{fill:currentColor}.writing-board__canvas{cursor:crosshair}.writing-practice__message{min-height:1.5em;color:var(--color-purple-deep)!important;font-weight:700}@media (max-width: 480px){.learning-map{grid-template-columns:repeat(3,minmax(0,1fr))}}.home-stars{margin:0;color:#f0a93b;font-size:1.35rem;font-weight:800}.letter-select-screen h1{margin-bottom:12px}.letter-group{margin-top:32px}.letter-group h2{margin:0 0 12px;color:var(--color-muted);font-size:1rem}.letter-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:12px}.letter-card{display:flex;min-height:180px;padding:16px 12px;flex-direction:column;align-items:center;gap:7px;border:2px solid transparent;border-radius:20px;background:var(--color-surface);color:var(--color-ink);box-shadow:0 4px 12px #403b3714}.letter-card:not(:disabled):hover,.letter-card:not(:disabled):focus-visible{background:var(--color-purple-deep);border-color:var(--color-purple);color:var(--color-on-accent)}.letter-card:not(:disabled):hover .letter-card__glyph,.letter-card:not(:disabled):focus-visible .letter-card__glyph,.letter-card:not(:disabled):hover .letter-card__lowercase,.letter-card:not(:disabled):focus-visible .letter-card__lowercase,.letter-card:not(:disabled):hover .letter-card__status,.letter-card:not(:disabled):focus-visible .letter-card__status{color:var(--color-on-accent)}.letter-card:disabled{cursor:not-allowed;opacity:.62}.letter-card:disabled:hover{background:var(--color-surface);color:var(--color-ink)}.listen-puzzle__option:not(:disabled):hover,.listen-puzzle__option:not(:disabled):focus-visible,.find-puzzle__option:not(:disabled):hover,.find-puzzle__option:not(:disabled):focus-visible,.build-puzzle__piece:not(:disabled):hover,.build-puzzle__piece:not(:disabled):focus-visible{background:var(--color-purple-deep);color:var(--color-on-accent)}.listen-puzzle__option:disabled:hover,.find-puzzle__option:disabled:hover,.build-puzzle__piece:disabled:hover{background:var(--color-surface);color:var(--color-purple-deep)}.letter-card__glyph{color:var(--color-purple-deep);font-size:3.2rem;line-height:1}.letter-card__lowercase{color:var(--color-muted);font-size:1.2rem}.letter-card__status{min-height:1.2em;color:var(--color-muted);font-size:.75rem}.letter-card .star-rating{font-size:1rem}@media (max-width: 480px){.letter-grid{grid-template-columns:repeat(2,minmax(0,1fr))}}.ui-button{display:inline-flex;align-items:center;justify-content:center}.ui-button--secondary{background:var(--color-surface);color:var(--color-purple-deep);box-shadow:inset 0 0 0 2px var(--color-purple)}.sound-button{display:grid;width:56px;min-height:56px;padding:0;place-items:center;background:var(--color-surface);color:var(--color-ink);font-size:1.35rem}.sound-button:hover{background:#f3edde;color:var(--color-ink)}.progress{margin:28px 0}.progress__label{display:flex;justify-content:space-between;gap:16px;margin-bottom:8px;color:var(--color-muted);font-size:.9rem}.progress__track{height:8px;overflow:hidden;border-radius:999px;background:#e9e6dc}.progress__value{display:block;height:100%;border-radius:inherit;background:var(--color-purple);transition:width .18s ease}.star-rating{display:flex;gap:3px;color:#d8d1c3;font-size:1.45rem;line-height:1}.star-rating__star.is-filled{color:#f0c05b}button:focus-visible{outline:3px solid var(--color-focus);outline-offset:4px}@media (hover: hover) and (pointer: fine){button:hover{background:var(--color-purple-deep)}}button:active{transform:translateY(2px)}a{color:var(--color-purple-deep);font-weight:700}a:focus-visible{outline:3px solid var(--color-focus);outline-offset:4px}.route-nav{display:flex;flex-wrap:wrap;gap:20px}.app-shell{width:min(100%,720px);min-height:100vh;min-height:100dvh;margin:0 auto;padding:var(--space-shell) var(--space-page)}.eyebrow{margin:0 0 12px;color:#7960a6;font-size:12px;font-weight:800;letter-spacing:.12em}h1{max-width:560px;margin:0;font-size:clamp(2rem,6vw,3.25rem);line-height:1.15}.intro{max-width:520px;margin:20px 0 28px;color:#797269;font-size:1.05rem;line-height:1.6}.letter-glyph{display:block;width:min(100%,180px);height:220px;margin:32px auto;color:var(--color-purple);font-size:clamp(7rem,28vw,11rem);line-height:1;object-fit:contain}.lesson-screen .progress{margin-top:0}.lesson-screen h1{outline:none}.lesson-intro{display:flex;flex-direction:column;align-items:center}.lesson-intro .letter-glyph{margin-bottom:8px}.lesson-lowercase{margin:0 0 28px;color:var(--color-muted);font-size:clamp(2rem,8vw,4rem);line-height:1}.lesson-actions{display:flex;flex-wrap:wrap;justify-content:center;gap:16px}.lesson-review{position:relative;isolation:isolate;display:flex;flex-direction:column;align-items:center;text-align:center}.celebration{min-height:min(72vh,560px);justify-content:center;overflow:hidden}.celebration__kicker{margin:0;color:var(--color-purple-deep);font-size:1.25rem;font-weight:800}.celebration-score{display:flex;margin:0 0 24px;padding:12px 24px;flex-direction:column;align-items:center;gap:8px;border-radius:16px;background:var(--color-surface)}.celebration-score h3{margin:0;font-size:1rem}.celebration h2{max-width:24rem;text-wrap:balance}.celebration .ui-button:hover,.celebration .ui-button:focus-visible{color:var(--color-on-accent)}.fireworks{position:absolute;z-index:1;inset:0;pointer-events:none}.fireworks-canvas{display:block;width:100%;height:100%}.celebration>:not(.fireworks){position:relative;z-index:2}.celebration .lesson-review__glyph{z-index:0}.lesson-review h2{margin:24px 0 0;font-size:clamp(1.5rem,5vw,2rem)}.lesson-review__glyph{width:min(44vw,180px);height:min(52vw,220px);margin:20px 0 8px;color:var(--color-purple);font-size:clamp(7rem,28vw,11rem);object-fit:contain}.lesson-review__lowercase{margin:0 0 28px;color:var(--color-muted);font-size:clamp(2rem,8vw,4rem);line-height:1}.lesson-placeholder{min-height:280px;padding:24px;border-radius:24px;background:var(--color-surface);text-align:center}.listen-puzzle{margin-top:24px}.listen-puzzle__prompt{display:flex;min-height:190px;padding:24px;flex-direction:column;align-items:center;justify-content:center;gap:16px;border-radius:24px;background:var(--color-surface);text-align:center}.listen-puzzle__prompt h2{margin:0;font-size:clamp(1.5rem,5vw,2rem)}.listen-puzzle__sample{width:84px;height:104px;color:var(--color-purple-deep);font-size:5rem;object-fit:contain}.listen-puzzle__replay{background:var(--color-surface);color:var(--color-purple-deep);box-shadow:inset 0 0 0 2px var(--color-purple)}.listen-puzzle__options{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:16px;margin-top:24px}.listen-puzzle__option{display:grid;min-height:112px;padding:12px;place-items:center;background:var(--color-surface);color:var(--color-ink);box-shadow:0 4px 12px #403b3714}.listen-puzzle__option:disabled{cursor:wait;opacity:.72}.listen-puzzle__option.is-hint,.find-puzzle__option.is-hint,.build-puzzle__piece.is-hint{border:3px solid #f0a93b;box-shadow:0 0 0 4px #f0a93b38}.listen-puzzle__option-glyph{width:64px;height:80px;color:currentColor;font-size:4.5rem;line-height:1;object-fit:contain}.listen-puzzle__option-glyph path,.find-puzzle__option-glyph path{fill:currentColor}.listen-puzzle__feedback{min-height:1.5em;margin:16px 0 0;color:var(--color-purple-deep);font-size:1.1rem;font-weight:800;text-align:center}.find-puzzle{margin-top:24px}.find-puzzle__prompt{display:flex;min-height:260px;padding:24px;flex-direction:column;align-items:center;justify-content:center;gap:12px;border-radius:24px;background:var(--color-surface);text-align:center}.find-puzzle__prompt h2{margin:0;font-size:clamp(1.5rem,5vw,2rem)}.find-puzzle__sample{width:min(42vw,160px);height:min(48vw,190px);color:var(--color-purple-deep);font-size:clamp(5rem,22vw,10rem);line-height:1;object-fit:contain}.find-puzzle__options{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:16px;margin-top:24px}.find-puzzle__option{display:grid;min-height:112px;padding:12px;place-items:center;background:var(--color-surface);color:var(--color-ink);box-shadow:0 4px 12px #403b3714}.find-puzzle__option:disabled{cursor:wait;opacity:.72}.find-puzzle__option.is-hint{border:3px solid #f0a93b;box-shadow:0 0 0 4px #f0a93b38}.find-puzzle__option-glyph{width:64px;height:80px;color:currentColor;font-size:4.5rem;line-height:1;object-fit:contain}.find-puzzle__feedback{min-height:1.5em;margin:16px 0 0;color:var(--color-purple-deep);font-size:1.1rem;font-weight:800;text-align:center}.build-puzzle{margin-top:24px}.build-puzzle__board{padding:24px;border-radius:24px;background:var(--color-surface);text-align:center}.build-puzzle__board h2{margin:0;font-size:clamp(1.5rem,5vw,2rem)}.build-puzzle__letter{position:relative;width:min(54vw,220px);height:min(62vw,260px);margin:16px auto 8px}.build-puzzle__letter svg{position:absolute;inset:0;width:100%;height:100%}.build-puzzle__silhouette{color:#e6e0d5}.build-puzzle__silhouette path{fill:currentColor}.build-puzzle__placed{color:var(--color-purple)}.build-puzzle__placed path{fill:currentColor}.build-puzzle__hint{margin:0;color:var(--color-muted)}.build-puzzle__pieces{display:flex;flex-wrap:wrap;justify-content:center;gap:12px;margin-top:20px}.build-puzzle__piece{display:grid;width:96px;min-height:96px;padding:12px;place-items:center;background:var(--color-surface);color:var(--color-ink);box-shadow:0 4px 12px #403b3714}.build-puzzle__piece svg{width:72px;height:72px}.build-puzzle__piece path{fill:currentColor}.build-puzzle__piece:disabled{cursor:wait;opacity:.72}.build-puzzle__piece.is-hint{border:3px solid #f0a93b;box-shadow:0 0 0 4px #f0a93b38}.build-puzzle__feedback{min-height:1.5em;margin:16px 0 0;color:var(--color-purple-deep);font-size:1.1rem;font-weight:800;text-align:center}.word-match-puzzle{display:grid;gap:16px;margin-top:24px;padding:24px;border-radius:24px;background:var(--color-surface);text-align:center}.word-match-puzzle h2{margin:0}.word-match-puzzle__image{width:min(100%,240px);height:180px;margin:0 auto;object-fit:contain}.word-match-puzzle__image-fallback{display:grid;width:min(100%,240px);height:180px;margin:0 auto;place-items:center;border:2px dashed var(--color-purple);color:var(--color-muted)}.word-match-puzzle__options{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px}.review-plan{display:grid;gap:8px;margin:20px 0}.review-plan__item{display:flex;justify-content:space-between;gap:12px;padding:12px 16px;border-radius:12px;background:var(--color-surface);color:var(--color-ink)}.word-match-puzzle__options button{background:var(--color-surface);color:var(--color-ink);box-shadow:inset 0 0 0 2px var(--color-purple)}.word-match-puzzle__options button:hover,.word-match-puzzle__options button:focus-visible{background:var(--color-purple-deep);color:var(--color-on-accent)}@media (max-width: 420px){.listen-puzzle__options{gap:10px}.listen-puzzle__option{min-height:96px;padding:8px}.listen-puzzle__option-glyph{width:52px;height:68px}.find-puzzle__options{gap:10px}.find-puzzle__option{min-height:96px;padding:8px}.find-puzzle__option-glyph{width:52px;height:68px}.build-puzzle__piece{width:84px;min-height:84px}.build-puzzle__piece svg{width:64px;height:64px}}.sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}@media (max-width: 600px){.app-shell{padding:max(24px,env(safe-area-inset-top)) max(20px,env(safe-area-inset-right)) max(24px,env(safe-area-inset-bottom)) max(20px,env(safe-area-inset-left))}}@media (max-height: 520px) and (orientation: landscape){.app-shell{padding-top:max(16px,env(safe-area-inset-top));padding-bottom:max(16px,env(safe-area-inset-bottom))}}@media (prefers-reduced-motion: reduce){*,*:before,*:after{scroll-behavior:auto!important;transition-duration:.01ms!important;animation-duration:.01ms!important;animation-iteration-count:1!important}button:active{transform:none}}
