:root{--bg:oklch(1 0 0);--surface:oklch(.973 0 0);--ink:oklch(.23 .008 80);--muted:oklch(.45 .012 80);--line:oklch(.86 .007 80);--primary:oklch(.46 .105 80);--tint:oklch(.95 .035 80);--accent:oklch(.35 .055 230);--success:oklch(.39 .075 155);--error:oklch(.43 .12 28);--radius:12px;font-family:-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif;color:var(--ink);background:var(--bg);font-synthesis:none}
*{box-sizing:border-box}body{margin:0}button,a{-webkit-tap-highlight-color:transparent}button{font:inherit;cursor:pointer;min-height:44px}button:disabled{cursor:default;opacity:.45}button:focus-visible,a:focus-visible{outline:3px solid var(--accent);outline-offset:4px}a{color:var(--primary);text-underline-offset:4px}button{transition:background .16s,color .16s}p{line-height:1.6}h1,h2,p{margin-top:0}h1,h2{text-wrap:balance}h1{font-size:clamp(2rem,3.5vw,2.75rem);line-height:1.17;letter-spacing:-.035em;margin-bottom:18px;font-weight:650}h1 [lang]{white-space:nowrap}h2{font-size:1.35rem;letter-spacing:-.02em;font-weight:650;margin-bottom:8px}.topbar{height:84px;max-width:1280px;margin:auto;padding:0 44px;display:flex;align-items:center;justify-content:space-between;border-bottom:1px solid var(--line)}.wordmark{display:flex;align-items:center;gap:11px;font-size:12px;letter-spacing:.13em;font-weight:700;text-decoration:none;color:var(--ink)}.brand-square{display:grid;place-items:center;width:29px;height:29px;border:1px solid var(--primary);border-radius:5px;color:var(--primary);letter-spacing:0}.trial-tag{font-size:12px;color:var(--muted)}.workspace{max-width:1180px;margin:52px auto 0;display:grid;grid-template-columns:minmax(240px,330px) minmax(0,1fr);column-gap:76px;padding:0 40px}.lesson-info{padding-top:10px}.eyebrow,.section-label{font-size:10px;font-weight:700;letter-spacing:.13em;color:var(--muted);margin-bottom:15px}.eyebrow span{padding:0 9px}.intro{font-size:15px;color:var(--muted);max-width:32ch;margin-bottom:25px}.word-example{display:flex;gap:16px;align-items:center;border-top:1px solid var(--line);border-bottom:1px solid var(--line);padding:20px 0;margin-bottom:26px}.bus-icon{display:block;width:56px;flex-shrink:0}.bus-icon svg{width:100%;stroke:var(--primary);fill:none;stroke-width:2.5}.example-hanzi{font-size:28px;letter-spacing:.13em;font-family:"Kaiti SC","STKaiti",serif}.example-pinyin{margin-left:12px;font-size:14px;color:var(--muted)}.example-meaning{display:block;font-size:12px;color:var(--muted);margin-top:5px}.lesson-route{display:flex;flex-direction:column;gap:5px}.stage{display:flex;align-items:center;text-align:left;gap:13px;background:none;border:0;border-radius:8px;padding:12px 10px;width:100%;color:var(--muted)}.step-num{width:29px;height:29px;display:grid;place-items:center;border:1px solid var(--line);border-radius:50%;font-size:12px;flex-shrink:0}.stage strong{display:block;font-size:14px;color:var(--ink);font-weight:600}.stage small{font-size:11px;font-weight:400;margin-left:6px;color:var(--muted)}.stage span span{font-size:12px;display:block;margin-top:5px}.stage.active{background:var(--tint)}.stage.active .step-num{background:var(--primary);border-color:var(--primary);color:white}.stage:hover:not(.active){background:var(--surface)}.local-note{font-size:11px;color:var(--muted);max-width:33ch;margin:24px 10px 0}.practice-heading{display:flex;justify-content:space-between;align-items:center;gap:12px}.section-label{margin-bottom:7px}.mode-switch{display:flex;border:1px solid var(--line);border-radius:8px;padding:3px;flex-shrink:0}.mode-switch button{font-size:11px;background:none;border:0;color:var(--muted);padding:0 9px;border-radius:5px;min-height:34px}.mode-switch button[aria-pressed=true]{background:var(--ink);color:var(--bg)}.instruction{font-size:13px;color:var(--muted);min-height:41px;margin:13px 0 16px;max-width:62ch}.board-frame{position:relative;width:100%;max-width:500px;margin:auto;border:1px solid var(--line);border-radius:var(--radius);overflow:hidden;aspect-ratio:1;isolation:isolate;background:var(--bg)}#board{display:block;width:100%;height:100%;touch-action:none;user-select:none;-webkit-user-select:none;cursor:crosshair}.board-corner{position:absolute;top:14px;left:16px;color:var(--primary);font-size:20px;pointer-events:none}.board-status{position:absolute;bottom:12px;right:14px;font-size:11px;color:var(--muted);background:var(--bg);padding:3px 5px;pointer-events:none}.toolbar{display:flex;justify-content:space-between;align-items:center;min-height:53px;gap:6px;max-width:500px;margin:auto}.tool-left,.watch-controls{display:flex;gap:10px}.text-button{border:0;background:none;color:var(--muted);font-size:12px;padding:5px 2px;white-space:nowrap}.text-button:hover:not(:disabled){color:var(--primary)}.feedback{display:flex;align-items:flex-start;gap:10px;border-top:1px solid var(--line);padding:17px 0 8px;min-height:91px}.feedback-dot{width:7px;height:7px;background:var(--primary);border-radius:50%;flex-shrink:0;margin-top:5px}.feedback strong{font-size:13px;font-weight:650}.feedback p{font-size:12px;color:var(--muted);margin:5px 0 0;max-width:62ch}.feedback[data-kind=error] .feedback-dot{background:var(--error)}.feedback[data-kind=success] .feedback-dot{background:var(--success)}.feedback[data-kind=error] strong{color:var(--error)}.feedback[data-kind=success] strong{color:var(--success)}.action-row{display:flex;justify-content:space-between;gap:15px;align-items:center;padding-top:9px}.action-row>span{font-size:11px;color:var(--muted);max-width:28ch;line-height:1.5}.primary{border:1px solid var(--primary);border-radius:8px;background:var(--primary);color:white;font-size:13px;font-weight:600;padding:0 22px;min-height:46px;white-space:nowrap}.primary:hover:not(:disabled){background:oklch(.39 .09 80)}.session{grid-column:1/-1;display:flex;align-items:center;justify-content:space-between;border-top:1px solid var(--line);margin-top:48px;padding:27px 0;gap:20px}.session h2{font-size:13px;letter-spacing:0;margin-bottom:7px}.session p{font-size:11px;color:var(--muted);max-width:39ch;margin-bottom:0}.session dl{display:flex;gap:25px;margin:0}.session dl div{display:flex;flex-direction:column-reverse;gap:5px}.session dt{font-size:10px;line-height:1.5;color:var(--muted);max-width:12ch}.session dd{margin:0;font-size:24px;font-variant-numeric:tabular-nums}.session>button{font-size:10px}footer{max-width:1180px;margin:auto;padding:12px 40px 30px;display:flex;align-items:flex-start;gap:30px;justify-content:space-between}footer p,footer a{font-size:10px;line-height:1.65;color:var(--muted);margin:0;max-width:90ch}footer a{white-space:nowrap}[hidden]{display:none!important}.loading #board{cursor:wait}
@media(min-width:1200px){.workspace{column-gap:92px}.board-frame,.toolbar{max-width:510px}}
@media(max-width:900px){.topbar{padding:0 24px;height:68px}.workspace{padding:0 24px;column-gap:30px;margin-top:30px;grid-template-columns:minmax(200px,260px) minmax(0,1fr)}h1{font-size:2rem}.practice-heading{align-items:flex-start;flex-wrap:wrap}.mode-switch button{min-height:36px}.instruction{min-height:40px}.session{flex-wrap:wrap}.session dl{gap:22px}.session>div{flex-basis:100%}footer{padding:12px 24px 26px}.toolbar{flex-wrap:wrap}}
@media(max-width:650px){.topbar{height:60px;padding:0 18px}.wordmark{font-size:10px;letter-spacing:.1em}.trial-tag{font-size:9px;max-width:125px;text-align:right;line-height:1.5}.workspace{display:block;margin-top:25px;padding:0 18px}.lesson-info{padding:0}.eyebrow{margin-bottom:9px;font-size:9px}h1{font-size:1.9rem;margin-bottom:10px}.intro{font-size:13px;max-width:52ch;margin-bottom:15px}.word-example{padding:11px 0;margin-bottom:15px;gap:14px}.bus-icon{width:40px}.example-hanzi{font-size:23px}.example-meaning{font-size:11px;margin-top:1px}.lesson-route{flex-direction:row;gap:4px;margin-bottom:24px}.stage{padding:10px 7px;gap:7px;flex:1;min-width:0}.step-num{width:22px;height:22px;font-size:10px}.stage strong{font-size:11px}.stage small{display:block;margin:3px 0 0;font-size:9px}.stage span span{display:none}.local-note{display:none}.practice-heading{flex-wrap:nowrap;align-items:center}.practice-heading h2{font-size:1.1rem}.section-label{font-size:8px;letter-spacing:.09em}.mode-switch button{padding:0 6px;font-size:9px;min-height:38px}.instruction{font-size:12px;min-height:0;margin:11px 0 12px}.board-frame{max-width:none}.board-corner{font-size:18px;top:10px;left:12px}.board-status{font-size:10px;right:8px;bottom:8px}.toolbar{min-height:50px}.text-button{font-size:11px;min-height:44px}.tool-left,.watch-controls{gap:8px}.feedback{min-height:94px;padding-top:14px}.action-row{padding-top:3px}.primary{padding:0 17px;font-size:12px}.session{margin-top:28px;padding:22px 0 15px;gap:15px}.session h2{font-size:12px}.session dl{flex:1;justify-content:space-between;gap:10px}.session dt{font-size:9px}.session dd{font-size:21px}.session>button{margin-left:auto}footer{padding:12px 18px 25px;display:block}footer p{font-size:9px}footer a{display:inline-block;margin-top:12px;font-size:10px}.recall-stage .lesson-info h1{margin-bottom:10px}.recall-stage .intro{margin-bottom:14px}.recall-stage .lesson-route{margin-bottom:24px}}
@media(prefers-reduced-motion:reduce){button{transition:none}}
.mode-switch button{min-height:44px}
@media(max-width:650px){.practice{scroll-margin-top:14px}.lesson-info .intro{max-width:48ch}}
.pronunciation{margin:21px 0 18px}.pronunciation-top{display:flex;align-items:center;justify-content:space-between;gap:10px}.sound-pinyin{font-size:30px;font-weight:550;letter-spacing:-.02em;display:block;color:var(--primary)}.tone-label{display:block;font-size:8px;font-weight:650;letter-spacing:.07em;color:var(--muted);margin-top:5px}.sound-button{display:inline-flex;align-items:center;justify-content:center;gap:8px;min-height:44px;border:1px solid var(--line);border-radius:8px;background:var(--bg);color:var(--primary);padding:7px 12px;text-align:left;font-size:12px;white-space:nowrap}.sound-button svg{width:20px;height:20px;fill:none;stroke:currentColor;stroke-width:1.6;stroke-linecap:round;stroke-linejoin:round;flex-shrink:0}.sound-button small{display:block;font-size:9px;color:var(--muted);margin-top:2px}.sound-button:hover{background:var(--tint);border-color:var(--primary)}.sound-button[aria-pressed=true]{background:var(--tint);border-color:var(--primary)}.tone-hint{display:flex;align-items:center;gap:9px;margin-top:12px}.tone-hint>svg{width:62px;height:24px;flex-shrink:0;fill:none;stroke:var(--primary);stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round}.tone-hint p{font-size:11px;color:var(--muted);margin:0;line-height:1.6}.tone-hint p span{display:block;font-size:10px}.word-example{display:block;margin:0 0 12px;padding:17px 0 15px}.word-image{display:block;width:100%;height:auto;aspect-ratio:16/10;object-fit:cover;border-radius:8px;background:var(--surface)}.word-example figcaption{padding-top:13px}.word-caption{display:flex;align-items:center;justify-content:space-between;gap:10px}.word-translation{font-size:15px;color:var(--ink);font-weight:550}.word-sound{margin-top:10px;width:100%;justify-content:flex-start}.example-meaning{font-size:10px;line-height:1.6;margin-top:8px}.audio-status{font-size:11px;color:var(--muted);min-height:17px;margin:0 0 12px;line-height:1.55}.audio-status[data-error=true]{color:var(--error)}
@media(max-width:650px){.pronunciation{margin:15px 0 13px}.pronunciation-top{gap:14px}.sound-pinyin{font-size:26px}.tone-label{font-size:8px}.tone-hint{margin-top:8px}.tone-hint p{font-size:11px}.word-example{display:flex;align-items:center;gap:14px;padding:13px 0;margin-bottom:8px}.word-image{width:42%;height:auto;aspect-ratio:4/3;object-fit:cover;flex-shrink:0}.word-example figcaption{padding-top:0;flex:1;min-width:0}.word-caption{align-items:baseline;gap:5px}.example-pinyin{display:block;margin:3px 0 0;font-size:12px}.example-hanzi{font-size:24px}.word-translation{font-size:13px}.word-sound{padding:5px 8px;gap:6px;min-height:44px;margin-top:8px;font-size:11px}.word-sound svg{width:17px;height:17px}.word-sound small{display:inline;margin-left:4px;font-size:9px}.word-example .example-meaning{font-size:9px;margin-top:7px}.audio-status{font-size:10px;margin-bottom:12px}.recall-stage .pronunciation{margin-bottom:10px}.recall-stage .audio-status{margin-bottom:16px}}
.board-listen{pointer-events:auto;border:0;background:var(--bg);min-height:44px;padding:3px 7px;border-radius:6px;display:flex;align-items:center;gap:5px;top:7px;left:9px}.board-listen svg{width:16px;height:16px;fill:none;stroke:currentColor;stroke-width:1.7;stroke-linecap:round;stroke-linejoin:round}.board-listen:hover,.board-listen[aria-pressed=true]{background:var(--tint)}.tone-label{font-size:9px}
@media(max-width:650px){.word-image{aspect-ratio:16/10;object-fit:contain}}
.learning-nav{position:sticky;top:0;z-index:10;display:flex;justify-content:center;gap:24px;padding:7px 24px;border-bottom:1px solid var(--line);background:var(--bg)}.learning-nav a{min-height:44px;display:flex;align-items:center;justify-content:center;gap:8px;padding:0 18px;color:var(--ink);text-decoration:none;font-size:13px;border-radius:7px}.learning-nav small{font-size:11px;color:var(--muted)}.learning-nav a:hover{background:var(--surface);color:var(--primary)}.syllabus-mini{display:flex;gap:6px;flex-wrap:wrap;margin:-4px 0 18px}.syllabus-mini>span{border:1px solid var(--line);border-radius:4px;padding:5px 7px;font-size:10px;color:var(--muted)}.syllabus-mini small{flex-basis:100%;font-size:10px;line-height:1.5;color:var(--muted);margin-top:3px}.practice,.learning-block,.word-detail{scroll-margin-top:84px}.learning-root{grid-column:1/-1;min-width:0;margin-top:54px;border-top:1px solid var(--line);padding-top:34px}.learning-intro{max-width:72ch;margin-bottom:23px}.learning-intro h2{font-size:25px;line-height:1.4;letter-spacing:0;margin-bottom:12px}.learning-intro>p:last-child{font-size:14px;color:var(--muted);margin:0}.syllabus-source{margin:0 0 32px;padding:0 0 17px;border-bottom:1px solid var(--line)}.syllabus-source summary,.entry-source summary{cursor:pointer;font-size:12px;line-height:1.6;color:var(--primary);padding:12px 0;min-height:44px}.syllabus-source p,.entry-source p{font-size:12px;line-height:1.8;color:var(--muted);max-width:90ch;margin:5px 0 10px}.learning-block{padding:12px 0 36px;margin-bottom:22px;border-bottom:1px solid var(--line)}.module-heading{display:flex;justify-content:space-between;gap:35px;align-items:flex-end;margin-bottom:22px}.module-heading h2{font-size:23px;letter-spacing:0;margin:0;line-height:1.4}.module-heading .section-label{margin-bottom:8px}.module-description{max-width:48ch;font-size:13px;line-height:1.8;color:var(--muted);margin:0}.module-tools{display:flex;align-items:center;justify-content:space-between;gap:18px;margin-bottom:18px}.module-note{font-size:12px;color:var(--muted);margin:0;line-height:1.7}.level-filter{display:flex;align-items:center;gap:10px;flex-shrink:0}.level-filter>span{font-size:11px;color:var(--muted)}.level-filter select{font:inherit;font-size:12px;min-height:44px;min-width:184px;border:1px solid var(--line);background:var(--bg);color:var(--ink);border-radius:7px;padding:8px 28px 8px 10px}.family-list{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:11px}.family-card{display:flex;flex-direction:column;align-items:flex-start;justify-content:center;gap:6px;padding:16px;border:1px solid var(--line);border-radius:8px;min-width:0;min-height:154px;background:var(--bg);color:var(--ink);text-align:left}.family-card:hover,.word-chip:hover{background:var(--surface)}.family-card.is-selected,.word-chip.is-selected{border-color:var(--primary);background:var(--tint)}.family-glyph{font-size:39px;line-height:1.1;font-family:"Kaiti SC","STKaiti",serif}.family-pinyin{font-size:13px;color:var(--primary);margin:3px 0 5px}.family-level{font-size:11px;color:var(--muted);line-height:1.5}.family-detail{padding:22px 0 0;margin-top:23px;border-top:1px solid var(--line)}.family-detail-top{display:flex;align-items:baseline;gap:20px;flex-wrap:wrap}.family-detail h3{font-size:22px;margin:0;line-height:1.5;font-weight:600}.detail-meaning{font-size:15px;color:var(--muted)}.composition{display:flex;align-items:center;gap:14px;flex-wrap:wrap;margin:17px 0}.component,.component-shared,.component-result{font-size:34px;font-family:"Kaiti SC","STKaiti",serif;line-height:1.5}.component-shared{color:var(--primary);background:var(--tint);padding:0 12px;border-radius:5px}.component-result{padding-left:4px}.composition-symbol{font-size:18px;color:var(--muted)}.detail-note{font-size:13px;line-height:1.8;margin-bottom:7px;max-width:90ch}.english-copy{color:var(--muted);font-size:13px;line-height:1.8;max-width:78ch}.entry-source{margin:9px 0 0}.entry-source summary{padding:8px 0;font-size:11px}.entry-source p{font-size:11px;margin:2px 0 8px}.related-word-button{padding:0;background:none;color:var(--primary);border:0;font-size:12px;min-height:44px;margin-top:5px;text-align:left}.related-word-button:hover{text-decoration:underline;text-underline-offset:4px}.module-footnote{font-size:11px;line-height:1.8;color:var(--muted);margin:18px 0 0;max-width:100ch}.origin-layout{display:grid;grid-template-columns:220px minmax(0,1fr);gap:40px;align-items:start}.origin-figure{margin:0;max-width:220px}.origin-figure svg{width:100%;height:auto;display:block;border:1px solid var(--line);border-radius:8px;background:var(--bg)}.origin-figure path{fill:var(--ink)}.origin-figure path.memory-stroke{fill:var(--primary)}.origin-figure figcaption{font-size:11px;text-align:center;color:var(--muted);margin-top:12px;line-height:1.6}.origin-fallback{display:block;text-align:center;font-size:110px;font-family:serif}.origin-copy h3{font-size:17px;font-weight:600;margin:0 0 12px;line-height:1.6}.origin-copy>p:not(.section-label){font-size:13px;line-height:1.9;margin-bottom:12px}.origin-quote{border-left:2px solid var(--primary);margin:20px 0 23px;padding:4px 0 4px 17px;font-size:17px;line-height:1.8}.origin-quote cite{display:block;font-size:11px;font-style:normal;color:var(--muted);margin-top:6px}.origin-links{display:flex;flex-wrap:wrap;gap:18px;margin-top:17px}.origin-links a{font-size:11px;line-height:1.8}.word-list{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:9px}.word-chip{display:grid;grid-template-columns:1fr auto;gap:6px 10px;align-items:center;border:1px solid var(--line);border-radius:7px;background:var(--bg);color:var(--ink);min-height:80px;padding:13px;text-align:left;min-width:0}.word-chip strong{font-size:21px;font-weight:550;line-height:1.3}.word-chip>span{grid-column:1;font-size:12px;color:var(--muted)}.word-chip small{grid-column:2;grid-row:1/3;font-size:10px;color:var(--muted);max-width:8ch;line-height:1.6;text-align:right}.word-detail{border-top:1px solid var(--line);padding-top:24px;margin-top:25px}.word-detail-top{display:flex;flex-wrap:wrap;align-items:baseline;gap:13px}.word-detail-title{font-size:34px;font-weight:600;line-height:1.5;margin:0}.word-detail-pinyin{font-size:18px;color:var(--primary)}.requirement-badge{font-size:11px;color:var(--muted);border:1px solid var(--line);border-radius:4px;padding:5px 8px;line-height:1.5}.requirement-badge.extension{background:var(--surface)}.word-meaning{font-size:16px;line-height:1.7;margin:7px 0 12px}.example-label{font-size:10px;font-weight:600;color:var(--muted);margin:21px 0 10px;letter-spacing:.03em}.example-sentence{font-size:25px;line-height:1.8;letter-spacing:.02em;margin:0 0 7px}.sentence-word{background:var(--tint);color:var(--primary);padding:2px 3px}.sentence-pinyin{font-size:15px;line-height:1.8;color:var(--primary);margin:0 0 6px}.sentence-english{font-size:14px;line-height:1.8;color:var(--muted);margin-bottom:13px}.learning-loading,.module-load-error{font-size:13px;color:var(--muted);line-height:1.8}.learning-root+.session{margin-top:0}
@media(max-width:900px){.module-heading{align-items:flex-start;gap:20px}.module-tools{flex-wrap:wrap}.module-tools .level-filter{margin-left:auto}.origin-layout{grid-template-columns:180px minmax(0,1fr);gap:26px}.word-list{grid-template-columns:repeat(3,minmax(0,1fr))}}
@media(max-width:650px){.learning-nav{padding:5px 14px;gap:3px}.learning-nav a{flex:1;padding:0 5px;gap:5px;font-size:12px}.learning-nav small{font-size:10px}.syllabus-mini{margin:0 0 14px}.syllabus-mini>span{font-size:9px;padding:4px 6px}.syllabus-mini small{font-size:9px}.learning-root{margin-top:35px;padding-top:27px}.learning-intro h2{font-size:22px}.learning-intro>p:last-child{font-size:12px}.syllabus-source{margin-bottom:22px}.syllabus-source summary{font-size:11px}.syllabus-source p{font-size:11px}.learning-block{padding-top:12px;margin-bottom:17px;padding-bottom:29px}.module-heading{display:block;margin-bottom:16px}.module-heading h2{font-size:22px}.module-description{font-size:12px;margin-top:13px;max-width:none}.module-tools{display:block}.module-note{font-size:11px;margin-bottom:12px}.level-filter{justify-content:space-between;gap:8px;min-width:0}.level-filter>span{font-size:10px}.level-filter select{font-size:11px;min-width:0;max-width:54%;padding-right:23px}.family-list{grid-template-columns:repeat(2,minmax(0,1fr));gap:9px}.family-card{padding:13px;min-height:150px}.family-glyph{font-size:38px}.family-pinyin{font-size:12px}.family-level{font-size:10px}.family-detail{margin-top:18px;padding-top:18px}.family-detail-top{gap:8px 14px}.family-detail h3{font-size:21px}.detail-meaning{font-size:13px}.detail-note,.english-copy{font-size:12px}.composition{gap:10px;margin:14px 0}.component,.component-shared,.component-result{font-size:32px}.component-shared{padding:0 9px}.module-footnote{font-size:10px}.origin-layout{grid-template-columns:1fr;gap:24px}.origin-figure{width:164px;margin:0 auto}.origin-copy h3{font-size:16px}.origin-copy>p:not(.section-label){font-size:12px}.origin-quote{font-size:16px;margin:18px 0}.origin-links{gap:10px 18px}.word-list{grid-template-columns:repeat(2,minmax(0,1fr));gap:8px}.word-chip{padding:11px;gap:5px 7px;min-height:78px}.word-chip strong{font-size:21px}.word-chip>span{font-size:11px}.word-chip small{font-size:9px}.word-detail{padding-top:20px;margin-top:20px}.word-detail-title{font-size:30px}.word-detail-pinyin{font-size:16px}.requirement-badge{font-size:10px}.word-meaning{font-size:14px}.example-sentence{font-size:22px}.sentence-pinyin{font-size:13px}.sentence-english{font-size:12px}.practice,.learning-block,.word-detail{scroll-margin-top:76px}}
.family-detail{scroll-margin-top:84px}@media(max-width:650px){.family-detail{scroll-margin-top:76px}}
/* Ten-character course: same writing workspace, separate local records. */
[hidden]{display:none!important}
.topbar{height:74px}.course-overview{max-width:1180px;margin:40px auto 29px;padding:0 40px}.course-heading{display:flex;align-items:center;justify-content:space-between;gap:36px;margin-bottom:29px}.course-heading .eyebrow{margin-bottom:12px;font-size:10px}.course-heading h1{font-size:32px;line-height:1.28;letter-spacing:-.035em;margin:0 0 12px;font-weight:620}.course-heading h1 span{display:block}.course-heading p:not(.eyebrow){font-size:13px;color:var(--muted);margin:0;line-height:1.8}.course-heading p>span{display:block;font-size:12px}.course-progress{min-width:175px;align-self:flex-end;padding-bottom:5px}.course-progress>strong{display:block;font-size:35px;font-weight:550;letter-spacing:-.035em;line-height:1.2}.course-progress strong span{font-size:18px;color:var(--muted);font-weight:400}.course-progress>span{display:block;color:var(--muted);font-size:10px;margin:10px 0 13px}.course-progress-track{height:3px;background:var(--line);width:100%}.course-progress-track>div{height:100%;width:0;background:var(--primary);transition:width .2s}
.lesson-picker{display:grid;grid-template-columns:repeat(10,minmax(0,1fr));gap:8px}.lesson-tile{position:relative;display:flex;flex-direction:column;align-items:center;gap:7px;min-height:137px;border:1px solid var(--line);border-radius:8px;background:var(--bg);color:var(--ink);padding:11px 5px 10px;min-width:0}.lesson-tile:hover{background:var(--surface)}.lesson-tile[aria-pressed=true]{background:var(--tint);border-color:var(--primary)}.tile-order{font-size:9px;color:var(--muted);align-self:flex-start;margin-left:7px;line-height:1}.tile-glyph{font-family:"Kaiti SC","STKaiti",serif;font-size:34px;line-height:1.2}.tile-pinyin{font-size:12px;color:var(--primary)}.lesson-state{font-size:8px;color:var(--muted);margin-top:2px;line-height:1.5}.has-practice .lesson-state{color:var(--success)}.has-practice:after{content:'✓';position:absolute;top:7px;right:7px;color:var(--success);font-size:10px}.course-source{display:flex;justify-content:space-between;gap:12px;margin-top:13px;font-size:10px;color:var(--muted);line-height:1.7}.course-source a{font-size:10px;flex-shrink:0}.workspace{margin-top:39px;column-gap:72px}.lesson-title-row{display:flex;align-items:flex-start;justify-content:space-between;gap:16px}.lesson-title-row h2{font-size:30px;letter-spacing:-.035em;line-height:1.3;margin-bottom:11px}.lesson-title-row h2>span{font-size:41px;display:inline-block;line-height:1;font-family:"Kaiti SC","STKaiti",serif;letter-spacing:0;margin-left:3px}.lesson-number{font-size:44px;line-height:1;letter-spacing:-.04em;color:var(--line);font-weight:450}.lesson-info .intro{font-size:14px;margin-bottom:18px}.pronunciation{margin:19px 0 15px}.tone-hint{padding-left:10px;border-left:2px solid var(--line);margin-top:14px}.tone-hint p{max-width:42ch}.tone-hint p span{margin-top:5px}.word-example.text-example{padding:17px 0}.text-example .example-hanzi{font-size:29px;letter-spacing:.04em}.text-example .word-caption{align-items:center}.text-example .word-translation{font-size:13px;max-width:16ch;line-height:1.5}.text-example .word-sound{width:auto;min-width:145px}.writing-tip{font-size:11px;color:var(--muted);line-height:1.8;padding:3px 0 0;margin-bottom:16px}.lesson-paging{display:flex;justify-content:space-between;gap:10px;border-top:1px solid var(--line);margin-top:17px;padding-top:5px}.lesson-paging button{font-size:11px}.lesson-info,.lesson-title-row{scroll-margin-top:86px}.stroke-key{display:flex;flex-wrap:wrap;justify-content:center;gap:5px 7px;max-width:500px;margin:12px auto 0}.stroke-key span{font-size:9px;color:var(--muted);border-radius:4px;padding:4px 6px;line-height:1.4;background:var(--surface)}.stroke-key .current{background:var(--tint);color:var(--primary)}.recall-stage .workspace{margin-top:40px}.recall-stage .lesson-title-row h2{font-size:29px}.practice[aria-busy=true] .board-frame{opacity:.5}.session{flex-wrap:wrap}.session>div{max-width:290px}.lesson-info .word-example .example-pinyin{display:block;margin:4px 0 0}.lesson-info .word-example .example-hanzi{letter-spacing:.06em}.learning-nav a{padding:0 17px}
@media(max-width:1000px) and (min-width:651px){.course-overview{padding:0 32px}.lesson-picker{gap:6px}.lesson-tile{min-height:127px}.tile-glyph{font-size:30px}.lesson-state{font-size:7px}.workspace{column-gap:35px;grid-template-columns:minmax(220px,280px) minmax(0,1fr);padding:0 32px}.practice-heading{align-items:flex-start;flex-wrap:wrap}.mode-switch{margin-left:auto}.course-source{font-size:9px}}
@media(max-width:650px){.topbar{height:64px;padding:0 18px}.trial-tag{font-size:10px}.wordmark{font-size:10px;gap:8px;letter-spacing:.09em}.brand-square{width:26px;height:26px}.course-overview{margin:26px auto 20px;padding:0 18px}.course-heading{align-items:flex-start;gap:15px;margin-bottom:20px}.course-heading .eyebrow{font-size:8px;letter-spacing:.07em;margin-bottom:10px}.course-heading h1{font-size:24px;line-height:1.3;margin-bottom:10px;letter-spacing:-.03em}.course-heading p:not(.eyebrow){font-size:11px}.course-heading p>span{font-size:10px}.course-progress{min-width:65px;max-width:74px;padding:0 0 3px;align-self:flex-end}.course-progress>strong{font-size:25px}.course-progress strong span{font-size:12px}.course-progress>span{font-size:8px;line-height:1.7;margin:7px 0 9px}.course-progress-track{height:2px}.lesson-picker{grid-template-columns:repeat(5,minmax(0,1fr));gap:7px}.lesson-tile{min-height:112px;padding:8px 3px;gap:5px;border-radius:7px}.tile-order{font-size:8px;margin-left:5px}.tile-glyph{font-size:30px}.tile-pinyin{font-size:11px}.lesson-state{font-size:7px;margin:2px 0 0}.course-source{font-size:8px;margin-top:11px;gap:13px;align-items:flex-start}.course-source>span{max-width:27ch}.course-source a{font-size:9px}.workspace{margin-top:25px;padding:0 18px}.lesson-title-row h2{font-size:25px;margin-bottom:9px}.lesson-title-row h2>span{font-size:34px}.lesson-number{font-size:36px}.lesson-info .intro{font-size:12px;max-width:none;margin-bottom:13px}.pronunciation{margin:15px 0 13px}.tone-hint p{max-width:none;font-size:11px}.tone-hint p span{font-size:10px}.tone-hint{padding-left:9px}.writing-tip{font-size:10px;margin-bottom:10px}.text-example .word-caption{gap:14px}.text-example .example-hanzi{font-size:26px}.text-example .word-translation{font-size:12px;max-width:22ch}.word-example.text-example{display:block;padding:12px 0}.text-example .word-caption>div{display:flex;align-items:baseline;gap:13px}.text-example .example-pinyin{display:inline!important;margin:0!important}.text-example .word-sound{min-width:130px;width:auto;margin-top:10px}.lesson-info .word-example:not(.text-example) .word-translation{font-size:11px}.lesson-info .word-example:not(.text-example) .word-caption{align-items:flex-start;flex-direction:column;gap:4px}.lesson-info .word-example .word-sound{font-size:10px}.lesson-paging{margin:0 0 20px;padding-top:3px}.lesson-paging button{font-size:10px}.lesson-route{margin-bottom:9px}.practice-heading{align-items:center}.practice-heading h2{font-size:17px}.stroke-key{margin-top:10px;gap:4px}.stroke-key span{font-size:8px;padding:4px 5px}.recall-stage .workspace{margin-top:25px}.recall-stage .lesson-route{margin-bottom:24px}.recall-stage .lesson-title-row h2{font-size:25px}.learning-nav a{font-size:11px;padding:0 4px}.learning-nav small{font-size:9px}.session>div{max-width:none;width:100%}.practice,.lesson-info,.lesson-title-row{scroll-margin-top:74px}}
@media(prefers-reduced-motion:reduce){.course-progress-track>div{transition:none}html{scroll-behavior:auto}}
.alternate-sound{font-size:11px;margin-top:13px;min-height:44px;padding:7px 10px}
#courseOverview{scroll-margin-top:74px}@media(max-width:650px){.learning-nav{padding-left:10px;padding-right:10px;gap:1px}.learning-nav a{gap:3px;font-size:10px;padding:0 3px}.learning-nav small{font-size:8px}}