:root{--paper:#f8f7ef;--surface:#fffef8;--ink:#263e35;--muted:#606f63;--green:#315d4c;--pale:#e5ebd9;--lime:#ddec88;--coral:#ed795d;--peach:#fce3cc;--line:#d9dfd0;--radius:22px;--shadow:0 5px 0 #e5e9da;--space-1:4px;--space-2:8px;--space-3:12px;--space-4:16px;--space-6:24px;--space-8:32px;font-synthesis:none;color:var(--ink);background:#e8ece3;font-family:ui-rounded,SF Pro Rounded,-apple-system,BlinkMacSystemFont,Segoe UI,sans-serif;line-height:1.5}*{box-sizing:border-box}body{margin:0}button,input,textarea{font:inherit}button,a{-webkit-tap-highlight-color:transparent;touch-action:manipulation}button{cursor:pointer;color:inherit}button:disabled{cursor:default}a{color:inherit}svg{display:block}h1,h2,h3,p{margin:0}h1{letter-spacing:-1.6px;font-size:36px;font-weight:760;line-height:1.1}h2{letter-spacing:-.7px;font-size:23px;line-height:1.2}h3{font-size:16px;line-height:1.3}p{line-height:1.6}button:focus-visible,a:focus-visible,input:focus-visible,textarea:focus-visible,summary:focus-visible{outline-offset:4px;outline:3px solid #a94f33}h1:focus{outline:none}button:disabled{opacity:.5}.app{background:var(--paper);width:100%;max-width:460px;min-height:100dvh;margin:auto;position:relative}.brandbar{justify-content:space-between;align-items:center;gap:12px;padding:23px 23px 0;display:flex}.brand{letter-spacing:-.7px;align-items:center;gap:4px;font-size:20px;font-weight:780;text-decoration:none;display:flex}.brand>.flower{width:47px;height:45px;transform:rotate(-8deg)}main{padding:27px 23px 123px}.pill{border:1px solid var(--line);white-space:nowrap;border-radius:100px;align-items:center;padding:5px 9px;font-size:10px;font-weight:750;display:inline-flex}.eyebrow{letter-spacing:1.6px;color:var(--green);text-transform:uppercase;font-size:10px;font-weight:800;line-height:1.5}.page-heading{margin-bottom:22px}.page-heading .eyebrow{margin-bottom:11px}.intro{margin-top:12px;font-size:14px}.muted{color:var(--muted)}.small{font-size:12px}.center{text-align:center}.button{border:1px solid #0000;border-radius:15px;justify-content:center;align-items:center;gap:9px;width:100%;min-height:50px;padding:12px 15px;font-size:13px;font-weight:750;text-decoration:none;transition:transform .15s,background .15s;display:inline-flex}.button--primary{background:var(--green);color:var(--surface);box-shadow:0 3px #203d31}.button--secondary{color:var(--green);background:#e9eddd;border-color:#d2ddc4}.button--quiet{color:var(--muted);text-underline-offset:3px;background:0 0;text-decoration:underline}.button--icon{background:var(--surface);border-color:var(--line);width:46px}.button:active{transform:translateY(1px)}.button.compact{width:auto;min-height:44px;padding:9px 12px;font-size:11px}.icon{fill:none;stroke:currentColor;stroke-width:1.7px;stroke-linecap:round;stroke-linejoin:round;flex-shrink:0;width:20px;height:20px}.flower,.pet{width:100%;height:auto}.hero{background:#e4ebd5;border-radius:25px;margin:20px 0 0;padding:22px 0 0;position:relative;overflow:hidden}.hero-copy{z-index:1;padding-left:23px;position:relative}.hero-copy .eyebrow{margin-bottom:8px;font-size:9px}.hero h2{letter-spacing:-.9px;font-size:26px;line-height:1.13}.hero-copy>p:last-child{color:#50614f;margin-top:8px;font-size:12px}.hero-badge{background:var(--surface);border:1px solid #ced8be;border-radius:100px;padding:8px 12px;font-size:14px;position:absolute;top:39px;right:20px;transform:rotate(9deg)}.garden-scene{width:100%;height:190px;position:relative;overflow:hidden}.hero .garden-scene{height:155px;margin-top:-17px}.scene-hill{background:#c6d6ad;border-radius:50% 50% 0 0;width:120%;height:125px;position:absolute;bottom:-55px;left:-10%}.scene-sun{background:#edc96d;border-radius:50%;width:34px;height:34px;position:absolute;top:13px;right:32px}.scene-coral{width:41%;position:absolute;bottom:21px;left:5%;transform:rotate(-3deg)}.scene-ivory{width:36%;position:absolute;bottom:28px;right:6%}.scene-cat{width:25%;position:absolute;bottom:3px;left:34%}.scene-dog{width:25%;position:absolute;bottom:0;right:2%}.scene-spark{color:#6f8a56;font-size:28px;position:absolute;bottom:3px;left:10%}.hero .scene-sun{display:none}.chapter-stats{color:var(--muted);justify-content:space-between;gap:5px;padding:19px 0 22px;font-size:11px;display:flex}.chapter-stats strong{color:var(--ink)}.section-heading{justify-content:space-between;align-items:center;margin:29px 0 20px;display:flex}.section-heading h2{font-size:18px}.section-heading span{color:var(--muted);font-size:11px}.lesson-path{margin:0;padding:0;list-style:none}.lesson-path li{grid-template-columns:65px 1fr;align-items:center;gap:12px;padding-bottom:18px;display:grid;position:relative}.lesson-path li:not(:last-child):before{content:"";border-left:3px dotted #bccba5;position:absolute;top:60px;bottom:-12px;left:32px}.path-flower{z-index:1;background:var(--paper);border-radius:50%;height:69px;position:relative}.path-flower svg{width:72px;height:72px;margin-left:-3px;transform:rotate(-6deg)}.path-flower span{background:var(--surface);border:1px solid var(--line);border-radius:50%;place-items:center;width:21px;height:21px;font-size:10px;font-weight:800;display:grid;position:absolute;bottom:-2px;right:0}.path-flower.complete span{background:var(--lime)}.lesson-card{border:1px solid var(--line);background:var(--surface);border-radius:18px;padding:13px 30px 13px 14px;text-decoration:none;display:block;position:relative}.lesson-card .eyebrow{letter-spacing:1px;color:var(--muted);font-size:9px}.lesson-card h3{letter-spacing:-.25px;margin-top:5px;font-size:15px}.lesson-card p{color:var(--muted);margin-top:5px;font-size:11px}.lesson-card>.icon{width:16px;position:absolute;top:43%;right:10px}.progress{background:var(--surface);border:1px solid var(--line);border-radius:16px;margin:14px 0 20px;padding:13px}.progress-label{justify-content:space-between;gap:8px;margin-bottom:9px;font-size:11px;font-weight:700;display:flex}progress{appearance:none;background:#e8ecdd;border:0;border-radius:9px;width:100%;height:6px;display:block;overflow:hidden}progress::-webkit-progress-bar{background:#e8ecdd}progress::-webkit-progress-value{background:var(--green);border-radius:9px}progress::-moz-progress-bar{background:var(--green);border-radius:9px}.bottom-nav{z-index:10;border-top:1px solid var(--line);width:100%;max-width:460px;padding:9px 10px max(12px, env(safe-area-inset-bottom));-webkit-backdrop-filter:blur(16px);backdrop-filter:blur(16px);background:#f8f7effa;justify-content:space-around;display:flex;position:fixed;bottom:0}.bottom-nav a{color:#5b6d5d;border-radius:12px;flex-direction:column;justify-content:center;align-items:center;gap:6px;min-width:64px;min-height:54px;font-size:10px;font-weight:700;text-decoration:none;display:flex}.bottom-nav a.active{color:var(--green);background:#e5ebd7}.back-link{min-height:44px;color:var(--muted);align-items:center;margin-top:-13px;margin-bottom:12px;font-size:12px;text-decoration:none;display:inline-flex}.step-tabs{gap:7px;margin:0 0 25px;display:flex}.step-tabs a{text-align:center;border-top:4px solid #dce3ce;flex:1;min-height:36px;padding-top:8px;font-size:10px;font-weight:700;text-decoration:none}.step-tabs .current{border-color:var(--coral)}.step-tabs .done{border-color:#829c63}.word-card{text-align:center;background:var(--surface);border:1px solid var(--line);box-shadow:var(--shadow);border-radius:26px;margin-bottom:23px;padding:17px 20px 21px;position:relative}.card-meta{color:var(--muted);justify-content:space-between;align-items:center;font-size:10px;display:flex}.card-meta .pill{background:var(--pale);border:0;font-size:8px}.word-art{width:157px;height:134px;margin:12px auto 0}.word-art svg{width:100%;height:100%}.hanzi{letter-spacing:0;font-family:PingFang SC,Microsoft YaHei,sans-serif;font-size:64px;font-weight:550;line-height:1.4}.reveal{font-size:12px}.reveal>.button{min-height:44px;padding:8px;font-size:11px}.revealed{margin:0 0 7px}.pinyin{color:var(--green);font-size:18px}.speech{margin:6px 0 0}.speech>.button{border-radius:100px}.speech>.small{max-width:290px;margin-top:7px}.word-card .speech>.small{margin:auto}.example-card{background:#eceedf;border-radius:18px;margin-bottom:22px;padding:18px}.example-hanzi{margin-top:8px;font-size:24px;line-height:1.6}.example-card .reveal>.button{justify-content:flex-start;padding-left:0}.picture-prompt{border:1px solid var(--line);background:var(--surface);text-align:center;border-radius:23px;margin:20px 0;padding:18px 16px}.picture-prompt>.flower{width:85px;height:80px;margin:0 auto}.picture-prompt h2{margin:6px 0;font-size:36px}.picture-options{grid-template-columns:1fr 1fr;gap:13px;margin:20px 0;display:grid}.picture-option{background:var(--surface);border:2px solid var(--line);border-radius:20px;min-height:170px;padding:13px 7px 10px;font-size:12px;font-weight:650}.picture-option .pet{height:130px}.correct{background:#e5edcf!important;border-color:#809d57!important}.incorrect{background:#fbe5d9!important;border-color:#bb7155!important}.feedback{background:#e9eddd;border-radius:15px;align-items:center;gap:10px;margin:17px 0;padding:11px;display:flex}.feedback>.flower{flex-shrink:0;width:49px;height:49px}.feedback p{font-size:12px}.feedback--error{color:#763f29;background:#fbe6da}.garden-scene--compact{background:#e5ebd8;border-radius:22px;height:165px}.sentence-prompt{text-align:center;margin:20px 0;font-size:16px;font-weight:700}.sentence-tray{background:#eef1e2;border:2px dashed #b9c8a4;border-radius:18px;flex-wrap:wrap;align-items:center;gap:7px;min-height:83px;padding:12px;display:flex}.sentence-tray>p{text-align:center;flex:1}.word-tile{background:var(--surface);border:1px solid #c7d2b9;border-bottom-width:3px;border-radius:12px;min-width:53px;min-height:48px;padding:7px 12px;font-size:23px}.tile-bank{flex-wrap:wrap;justify-content:center;gap:10px;margin-top:21px;display:flex}.sentence-tray .word-tile{background:#e2ebce}.tile-bank .word-tile:disabled{opacity:.3}.story-cover{background:#f4dfc7;border-radius:23px;margin-bottom:17px;overflow:hidden}.story-controls{justify-content:space-between;align-items:center;gap:12px;margin-bottom:26px;display:flex}.story-controls p{max-width:170px}.dialogue{align-items:flex-start;gap:9px;margin:0 0 27px;display:flex}.dialogue--ivory{flex-direction:row-reverse}.speaker-flower{flex-shrink:0;width:42px;height:45px;margin-top:23px}.dialogue-body{min-width:0;max-width:calc(100% - 51px)}.speaker{letter-spacing:1px;color:var(--muted);margin:0 0 6px 3px;font-size:9px;font-weight:800}.dialogue--ivory .speaker{text-align:right}.bubble{border:1px solid var(--line);background:var(--surface);border-radius:3px 18px 18px;padding:12px;font-size:23px;line-height:2}.dialogue--ivory .bubble{background:#edf0df;border-radius:18px 3px 18px 18px}.story-word{background:0 0;border:0;border-bottom:1px dashed #8f9f80;border-radius:0;min-width:32px;min-height:44px;padding:0 2px;font-size:23px;line-height:1.8}.story-word rt{color:var(--green);font-family:inherit;font-size:10px}.story-token{display:inline}.word-help{background:#e0e8ce;border-radius:7px;padding:6px 9px;font-size:12px;line-height:1.6;display:block}.dialogue .reveal>.button{justify-content:flex-start;padding-left:0}.dialogue .speech .button{min-height:44px;font-size:10px}.dialogue .speech .icon{width:15px;height:15px}.story-end{text-align:center;letter-spacing:1.7px;color:var(--muted);margin:26px 0;font-size:9px;font-weight:800}.comprehension{border-top:1px solid var(--line);padding-top:25px}.comprehension h2{margin:7px 0 21px}fieldset{border:0;min-width:0;margin:0 0 23px;padding:0}legend{margin-bottom:12px;padding:0;font-size:13px;font-weight:700}.answer-options{grid-template-columns:1fr 1fr;gap:10px;display:grid}.answer-button{border:1.5px solid var(--line);background:var(--surface);border-radius:13px;min-height:50px;padding:10px;font-size:14px}.writing-card{background:#eceedf;border-radius:22px;margin:27px 0;padding:20px}.writing-card h2{margin:8px 0 12px}.writing-card>.muted{margin-bottom:16px;font-size:13px}.field-label{margin:15px 0 8px;font-size:12px;font-weight:750;display:block}textarea,input[type=password]{background:var(--surface);width:100%;color:var(--ink);border:1px solid #c5d0b7;border-radius:12px;padding:12px;font-size:16px;display:block}textarea{resize:vertical;min-height:109px;font-size:20px;line-height:1.6}.writing-actions{justify-content:space-between;align-items:center;gap:8px;margin-top:8px;display:flex}.writing-actions .button--quiet{width:auto;padding-left:0;font-size:11px}.writing-card>.small{margin:14px 0}details{font-size:12px}summary{cursor:pointer;align-items:center;min-height:44px;display:flex}details p{padding:7px 0 12px}.ai-section{border-top:1px solid #cbd6bc;margin-top:16px;padding-top:19px}.ai-section h3{margin-bottom:8px}.ai-section>.small{margin-bottom:14px}.settings-link{min-height:44px;padding:10px 0;font-size:12px;display:block}.ai-response{background:var(--surface);border:1px solid #c5d0b7;border-radius:13px;margin-top:14px;padding:13px}.ai-response p{white-space:pre-wrap;font-size:13px}.ai-response .eyebrow{margin-bottom:7px;font-size:9px}.settings-card{background:var(--surface);border:1px solid var(--line);border-radius:22px;margin:0 0 22px;padding:20px}.settings-card>h2{margin-bottom:12px;font-size:21px}.settings-card>p{margin-bottom:12px;font-size:13px}.settings-card>.small{font-size:12px}.notice,.warning{color:#6e4931}.notice{background:#f8ead4;border-radius:12px;margin-bottom:19px;padding:12px;font-size:12px;line-height:1.6}.checkbox-label{cursor:pointer;align-items:flex-start;gap:9px;min-height:44px;margin:18px 0 10px;font-size:13px;display:flex}.checkbox-label input{width:20px;height:20px;accent-color:var(--green);flex-shrink:0}.settings-card form>.small{margin-bottom:20px}.key-state{justify-content:space-between;align-items:center;gap:10px;margin-top:13px;font-size:11px;display:flex}.key-state>.button{width:auto;font-size:11px}.two-buttons{gap:10px;display:flex}.status-banner{background:#e2e8cb;border-radius:12px;margin:0 0 15px;padding:10px;font-size:12px}.pwa-banner{background:#e5ebd8;border:1px solid #c4d1b6;border-radius:16px;margin:0 0 20px;padding:13px;font-size:12px}.pwa-banner .button{min-height:44px;margin-top:9px}.pwa-banner .button--quiet{margin-top:0}.desktop-note{display:none}.skip-link{z-index:50;background:var(--surface);padding:8px;position:absolute;top:5px;left:10px;transform:translateY(-150%)}.skip-link:focus{transform:translateY(0)}@media (width>=850px){.app-layout{justify-content:center;align-items:flex-start;gap:75px;max-width:1000px;margin:34px auto;padding:0 30px;display:flex}.app{border:1px solid #d4ddcb;border-radius:30px;flex-shrink:0;min-height:calc(100dvh - 68px);margin:0;overflow:hidden;box-shadow:0 14px 70px #263e350a}.bottom-nav{border-radius:0 0 29px 29px;width:458px;bottom:34px}.desktop-note{flex-shrink:0;width:280px;margin-top:100px;display:block;position:sticky;top:70px}.desktop-note>.desktop-flower{width:113px;height:110px;margin-bottom:18px;margin-left:-10px;transform:rotate(-10deg)}.desktop-note .eyebrow{letter-spacing:1.4px;margin-bottom:19px;font-size:9px}.desktop-note h2{letter-spacing:-2px;margin-bottom:22px;font-size:47px;line-height:1.1}.desktop-note p{color:var(--muted);font-size:13px;line-height:1.8}.desktop-note .small{font-size:11px}.desktop-line{background:var(--coral);width:40px;height:3px;margin:24px 0;display:block}}@media (width<=359px){main,.brandbar{padding-left:16px;padding-right:16px}h1{font-size:32px}.hero-badge{right:14px}.lesson-path li{grid-template-columns:57px 1fr;gap:10px}.path-flower svg{width:65px}.lesson-path li:not(:last-child):before{left:28px}.lesson-card h3{font-size:14px}.word-tile{min-width:46px;padding:8px 10px}.picture-option .pet{height:105px}.writing-card{padding:16px}.story-word{font-size:21px}.bubble{padding:9px}.chapter-stats{font-size:10px}.settings-card{padding:17px}}@media (prefers-reduced-motion:reduce){*{transition:none!important;animation:none!important}html{scroll-behavior:auto}}main:focus{outline:none}.visually-hidden{clip-path:inset(50%);white-space:nowrap;border:0;width:1px;height:1px;margin:-1px;padding:0;position:absolute;overflow:hidden}.app-layout.app-layout--focus{max-width:460px;margin:0 auto;padding:0;display:block}.app.app--focus{min-height:100dvh;box-shadow:none;border:0;border-radius:0;overflow:visible}.app--focus .focus-main{padding:calc(12px + env(safe-area-inset-top,0px)) 20px calc(16px + env(safe-area-inset-bottom,0px))}.learn-focus{min-height:calc(100dvh - 28px - env(safe-area-inset-top,0px) - env(safe-area-inset-bottom,0px));flex-direction:column;gap:8px;display:flex}.learn-topbar{align-items:center;gap:16px;display:flex}.learn-close{border-radius:50%;place-items:center;min-width:44px;min-height:44px;font-size:1.25rem;text-decoration:none;display:grid}.learn-progress{color:var(--muted);flex:1;align-items:center;gap:12px;font-size:.8125rem;display:flex}.learn-progress>span{white-space:nowrap}.learn-progress>progress{flex:1;min-width:24px}.learn-focus .word-card{box-shadow:none;background:0 0;border:0;flex-direction:column;flex:1;justify-content:center;align-items:center;gap:8px;margin:0;padding:8px 0;display:flex}.learn-focus .word-art{width:clamp(64px,14dvh,112px);height:clamp(64px,14dvh,112px);margin:0}.learn-focus .word-art svg{width:100%;height:100%}.learn-focus .hanzi{margin:0;font-size:clamp(3.5rem,10dvh,4.5rem);line-height:1.15}.learn-focus .word-card>.reveal{width:100%;min-height:6rem;margin:0}.learn-focus .reveal>.button{min-height:44px;margin:0;padding:8px;font-size:.875rem}.learn-focus .revealed{margin:0;font-size:.9375rem}.learn-focus .revealed p{line-height:1.35}.learn-focus .pinyin{margin:0;font-size:1.25rem}.learn-focus .speech{width:100%;min-height:4.5rem;margin:0}.learn-focus .speech>.button{min-height:44px;margin:0;font-size:.875rem}.learn-focus .speech>.small{max-width:32ch;margin:4px auto 0;line-height:1.4}.learn-footer{gap:8px;display:grid}.learn-example>summary{min-height:44px;color:var(--muted);text-align:center;cursor:pointer;padding:12px 8px;font-size:.8125rem}.learn-example .example-card{margin:0 0 8px;padding:12px}.learn-example .small+.small{margin-top:8px}.learn-actions{grid-template-columns:48px minmax(0,1fr);gap:8px;display:grid}.learn-actions>.button{min-height:50px;margin:0;font-size:.875rem}