/* Reading-first child surface; existing curriculum and parent tools remain accessible. */
html { scrollbar-width:thin; scrollbar-color:#a6b7a0 transparent; scrollbar-gutter:stable; }
*::-webkit-scrollbar { width:6px; height:6px; } *::-webkit-scrollbar-track { background:transparent; } *::-webkit-scrollbar-thumb { border-radius:20px; background:#a6b7a0; } *::-webkit-scrollbar-thumb:hover { background:#748b70; }
body:has(dialog[open]) { overflow:hidden; }
.learn-dialog { overflow:hidden; max-height:92dvh; }
.learn-dialog-shell { padding:0; max-height:92dvh; display:flex; flex-direction:column; overflow:hidden; }
.learn-dialog-header,.family-modal-heading { flex:none; position:relative; margin:0; min-height:70px; padding:18px 78px 16px 26px; background:#fcfcf7; border-bottom:1px solid #e1e8d9; z-index:3; display:flex; align-items:center; }
.learn-dialog-header>[data-lesson-action="close"],.family-modal-heading>[data-family="close"] { position:absolute; right:16px; top:12px; width:46px; height:46px; min-width:46px; border-radius:50%; font-size:30px; line-height:1; display:grid; place-items:center; border:1px solid #d3dfca; background:#f1f5e8; color:#365b45; }
.family-modal-heading h2 { font-size:24px; line-height:1.5; overflow-wrap:anywhere; }
.child-dialog-scroll { flex:1 1 auto; min-height:0; overflow:auto; overscroll-behavior:contain; padding:22px 26px; scrollbar-width:thin; scrollbar-color:#a6b7a0 transparent; }
.learn-dialog-footer { flex:none; padding:16px 26px; background:#fcfcf7; border-top:1px solid #dce5d4; }
.learn-dialog-footer .learn-primary { min-width:140px; font-size:19px; min-height:52px; }
.learn-dialog-footer .learn-secondary { font-size:17px; min-height:48px; }
.learn-dialog-header>span { font-size:15px; }
body:not([data-section="parents"]) .learn-eyebrow,body:not([data-section="parents"]) .learn-brand small,body:not([data-section="parents"]) .learn-footer { display:none; }
.learn-header { padding:16px 0; }.learn-profile>span { display:none; }.learn-brand { font-size:20px; }
.child-welcome { display:flex; align-items:center; justify-content:space-between; gap:18px; padding:30px 0 22px; }.child-welcome h1 { font-size:clamp(25px,5vw,36px); line-height:1.6; }.child-welcome p { font-size:16px; color:#708069; }.child-welcome img { width:120px; height:120px; object-fit:contain; margin-top:-30px; }
.child-today { margin-top:0; }.child-today .learn-today-card { margin-top:16px; padding:24px; grid-template-columns:auto minmax(0,1fr) auto; }.child-today h3 { font-size:25px; }.child-today p { font-size:19px; }.child-today small { font-size:15px; }.child-today .learn-primary { font-size:21px; min-height:58px; }.child-today .learn-rest-toggle { font-size:16px; padding:14px 0; }
.child-subjects { margin-top:28px; }.child-subjects .learn-subject-grid { grid-template-columns:repeat(3,minmax(0,1fr)); }.child-subject-button { min-height:120px; padding:22px; grid-template-columns:auto minmax(0,1fr); gap:16px; }.child-subject-button strong { font-size:24px; }.child-subject-button small { font-size:15px; line-height:1.8; margin-top:7px; }
.learn-shell h2 { font-size:25px; }.learn-shell .learn-text-button { font-size:16px; }
.learn-nav button { font-size:14px; min-height:58px; }.learn-nav { width:min(540px,calc(100% - 20px)); }
.child-dialog-scroll p { font-size:19px; line-height:1.9; }.child-dialog-scroll .family-meta { font-size:13px; }.child-dialog-scroll .family-meta p { font-size:13px; }
.learn-reading>p { font-size:23px; line-height:2; }.learn-reading .learn-secondary { font-size:20px; min-height:52px; }.learn-lesson-title h2 { font-size:27px; line-height:1.6; }.learn-lesson-title small { font-size:14px; }.learn-question h3,.learn-puzzle-title { font-size:23px; line-height:1.9; }.learn-answers button { font-size:21px; min-height:64px; line-height:1.8; }.learn-lesson-steps span { font-size:17px; }.learn-phase-note { display:none; }.learn-feedback { font-size:18px; }.learn-command-buttons button { font-size:17px; min-height:48px; }.learn-listen-button small { font-size:15px; }
.child-extra { margin-top:22px; border-top:1px solid #e1e7da; padding-top:14px; }.child-extra summary { cursor:pointer; font-size:17px; color:#5e7854; padding:8px 0; }
.child-reading-settings { padding:24px; margin:22px 0; border:1px solid #dce6d5; border-radius:22px; background:#fffef8; }.child-reading-settings h2 { margin:0 0 16px; }.child-reading-settings p { font-size:15px; line-height:1.8; }.child-reading-settings .family-switch { font-size:18px; }.child-reading-settings button { font-size:16px; }
.child-voice-grid { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:12px; margin:20px 0; }.child-voice-option { border:1px solid #d9e3d1; border-radius:16px; padding:17px; }.child-voice-option:has(input:checked) { background:#edf4e3; border-color:#7d9e66; }.child-voice-option label { display:flex; align-items:center; gap:10px; font-size:18px; }.child-voice-option input { width:20px; height:20px; }.child-voice-option small { display:block; font-size:13px; color:#6c7c63; margin:8px 0; }.child-voice-option button { font-size:15px; }
.child-pinyin { ruby-align:center; ruby-position:over; display:inline ruby; margin-inline:.09em; }.child-pinyin rt { font-size:.54em; color:#6e805e; font-weight:500; letter-spacing:0; text-transform:none; line-height:1.15; user-select:none; }.child-pinyin rp { display:none; }
body[data-pinyin="on"] .learn-reading p,body[data-pinyin="on"] .learn-question h3,body[data-pinyin="on"] .learn-answers button { line-height:2.5; }
body[data-pinyin="on"] .learn-primary rt { color:#ebf4dd; }body[data-pinyin="on"] .learn-nav button { padding-top:12px; line-height:1.7; }
@media(max-width:600px) { .child-welcome { padding:24px 0 18px; }.child-welcome img { width:75px; height:75px; margin-top:-16px; }.child-welcome h1 { font-size:25px; }.child-subjects .learn-subject-grid { grid-template-columns:repeat(2,minmax(0,1fr)); }.child-subject-button { min-height:115px; padding:16px; gap:10px; }.child-subject-button .learn-subject-icon { width:40px; height:44px; font-size:22px; }.child-subject-button strong { font-size:22px; }.child-subject-button small { font-size:14px; }.child-today .learn-today-card { grid-template-columns:auto minmax(0,1fr); padding:20px; }.child-today .learn-today-card>.learn-primary { grid-column:1/-1; width:100%; }.child-dialog-scroll { padding:18px; }.learn-dialog-header,.family-modal-heading { padding-left:18px; }.learn-dialog-footer { padding:14px 18px; }.learn-dialog-footer .learn-primary { min-width:130px; }.learn-reading { padding:17px; }.child-voice-grid { gap:8px; }.child-voice-option { padding:13px; }.learn-nav button { font-size:13px; }.child-reading-settings { padding:20px; } }
@media(prefers-reduced-motion:reduce) { .learn-dialog[open] { animation:none; } }
.child-reading-stop { position:static!important; width:auto!important; height:36px!important; min-width:58px!important; margin-left:12px; flex:none; border-radius:18px; border:1px solid #d3dfca; background:#f1f5e8; color:#365b45; font-size:14px!important; padding:6px 10px; }
.child-listen-task { margin:8px 0 14px; min-height:44px; }
body:not([data-section="parents"]) .learn-page-intro { padding:30px 0 20px; }body:not([data-section="parents"]) .learn-page-intro h1 { font-size:clamp(28px,5vw,38px); }body:not([data-section="parents"]) .learn-page-intro p { font-size:19px; }
.family-entry-grid button { min-height:122px; }.family-entry-grid strong { font-size:23px; }.family-entry-grid small { font-size:16px; }.explore-list h2 { font-size:23px; }.learn-plan-day-copy h3 { font-size:24px; }
.child-today .learn-today-card,.learn-subject-card.child-subject-button { display:grid; }
.child-today .learn-today-card .learn-primary { margin-left:0; }
.child-subject-button .learn-subject-icon { margin-bottom:0; }
.learn-dialog-header>span,.family-modal-heading h2 { min-width:0; }
