.notes-concept{--notes-page:#112738;--notes-card:#1a3040;--notes-line:#3b5060;--notes-ink:#f0f4f6;--notes-muted:#b3c2cc;--notes-soft:#213a4b;background:var(--notes-page);color:var(--notes-ink)}
html[data-theme=light] .notes-concept{--notes-page:#f6f7f5;--notes-card:#fff;--notes-line:#dbe1e2;--notes-ink:#233c50;--notes-muted:#667b88;--notes-soft:#eaf0f1}
.notes-concept .site-header{position:relative;background:var(--notes-page);border-bottom:1px solid var(--notes-line)}
.notes-main{overflow:clip}.notes-intro{display:flex;align-items:center;justify-content:space-between;min-height:332px;padding-block:52px 42px;gap:60px}.notes-kicker{font-size:11px;color:var(--orange);margin-bottom:10px;line-height:1.8}.notes-intro h1{font-size:64px;line-height:1.6;font-weight:500;letter-spacing:-1.5px}.title-dot{color:var(--orange)}.notes-lead{font-size:16px;line-height:2;color:var(--notes-muted);margin-top:6px}.notes-count{font-size:11px;color:var(--notes-muted);margin-top:22px}.cover-stack{position:relative;width:360px;height:250px;flex:none;direction:ltr;isolation:isolate}.cover-stack img{position:absolute;top:0;left:104px;width:161px;height:229px;object-fit:cover;object-position:top;box-shadow:0 12px 30px #041b2a2b;border:5px solid white;border-radius:3px}.cover-stack img:first-child{left:34px;top:24px;transform:rotate(-13deg);z-index:-1}.cover-stack img:last-child{left:181px;top:17px;transform:rotate(12deg);z-index:-1}.notes-library{padding-bottom:58px}.chapter-tabs{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));border:1px solid var(--notes-line);border-radius:12px;background:var(--notes-card);padding:5px;gap:5px;margin-bottom:35px}.chapter-tabs button{display:flex;align-items:center;gap:16px;text-align:start;border:0;border-radius:8px;background:transparent;color:var(--notes-muted);padding:16px 20px;min-height:86px}.chapter-tabs button[aria-pressed=true]{background:var(--notes-soft);color:var(--notes-ink)}.chapter-tabs button[aria-pressed=true] .chapter-index{color:var(--orange)}.chapter-index{font:400 24px/1 Century,sans-serif;direction:ltr}.chapter-tabs strong{display:block;font-weight:500;font-size:14px;line-height:1.8}.chapter-tabs small{display:block;font-size:10px;margin-top:3px;color:var(--notes-muted);line-height:1.9}.chapter-tabs .icon{width:16px;margin-inline-start:auto}.notes-toolbar{display:flex;justify-content:space-between;align-items:center;gap:24px;margin-bottom:22px}.notes-toolbar .notes-kicker{margin:0;font-size:10px}.section-title{font-size:23px;line-height:1.8;font-weight:500}.notes-search{display:flex;gap:12px;align-items:center;border:1px solid var(--notes-line);background:var(--notes-card);border-radius:9px;padding:12px 16px;min-height:50px;width:min(360px,40%);color:var(--notes-muted)}.notes-search .icon{width:18px;height:18px}.notes-search input{font:inherit;font-size:11px;border:0;outline:0;background:transparent;min-width:0;flex:1;color:var(--notes-ink)}.notes-search:focus-within{outline:2px solid var(--orange);outline-offset:2px}.notes-search input::placeholder{color:var(--notes-muted)}.note-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:14px}.note-card{background:var(--notes-card);border:1px solid var(--notes-line);border-radius:11px;min-width:0;overflow:hidden;transition:border-color .18s,transform .18s}.note-card:hover{border-color:var(--orange);transform:translateY(-2px)}.note-main{display:flex;align-items:center;gap:20px;padding:23px 24px;color:var(--notes-ink)}.note-main:hover{color:var(--notes-ink)}.note-number{font:400 23px/1 Century,sans-serif;color:var(--orange);direction:ltr;flex:none}.note-copy{flex:1;min-width:0}.note-type{display:none}.note-copy h2{font-size:14px;font-weight:400;line-height:1.9}.note-open{display:flex;align-items:center;gap:8px;color:var(--notes-muted);font-size:10px;margin-top:9px}.note-open .icon{width:15px;height:15px;transform:scaleX(-1)}html[dir=ltr] .note-open .icon{transform:none}.note-cover{display:none}.note-actions{display:none}.notes-empty{padding:52px 18px;text-align:center;border:1px dashed var(--notes-line);border-radius:12px;color:var(--notes-muted);font-size:14px}.notes-mountains{height:110px;background:url('/assets/studio/mountains.webp') center/cover;opacity:.15;mix-blend-mode:luminosity;mask-image:linear-gradient(transparent,#000)}.notes-concept .site-footer{border-top:1px solid var(--notes-line)}.notes-concept [hidden]{display:none!important}
html[lang=zh-Hans] .notes-concept{font-weight:300}html[lang=zh-Hans] .notes-kicker,html[lang=zh-Hans] .notes-count{font-size:16px}html[lang=zh-Hans] .notes-intro h1{font-weight:300;letter-spacing:.02em}html[lang=zh-Hans] .notes-lead{font-size:22px}html[lang=zh-Hans] .chapter-tabs strong{font-size:22px;font-weight:300}html[lang=zh-Hans] .chapter-tabs small{font-size:15px}html[lang=zh-Hans] .section-title{font-size:28px;font-weight:300}html[lang=zh-Hans] .notes-search input{font-size:17px}html[lang=zh-Hans] .note-copy h2{font-size:21px}html[lang=zh-Hans] .note-open,html[lang=zh-Hans] .note-actions,html[lang=zh-Hans] .note-type{font-size:15px}html[lang=zh-Hans] .note-cover>span{font-size:13px}html[lang=zh-Hans] .notes-empty{font-size:20px}
.notes-intro .notes-kicker{line-height:25px}.notes-lead{line-height:44px}.notes-count{line-height:25px}.chapter-tabs button{min-height:102px}.chapter-tabs strong{line-height:32px}.chapter-tabs small{line-height:24px}.lead-phrase{display:inline-block;white-space:nowrap}.notes-content{min-width:0}.notes-concept .header-nav a[aria-current]{color:var(--orange)}
/* Lesson pages retain the approved library's quiet borders and spacing. */
.notes-breadcrumb{display:flex;align-items:center;gap:13px;flex-wrap:wrap;padding-block:32px 26px;font-size:11px;color:var(--notes-muted)}
.lesson-video-section{max-width:1120px;margin-inline:auto}.lesson-heading{margin-bottom:25px}.lesson-heading h1{font-size:clamp(23px,2.2vw,33px);line-height:1.9;font-weight:500;text-wrap:pretty}.lesson-heading .notes-kicker{font-size:11px;margin-bottom:8px}
.video-embed{aspect-ratio:16/9;border-radius:12px;overflow:hidden;background:#101b24;border:1px solid var(--notes-line)}.video-embed iframe{display:block;width:100%;height:100%;border:0}
.lesson-resources{display:flex;flex-wrap:wrap;gap:12px;align-items:center;margin-top:24px}.notes-page .primary-button{font-size:13px;min-height:48px;padding:10px 20px}.notes-page .primary-button .icon{width:19px;height:19px}.notes-button{display:inline-flex;align-items:center;justify-content:center;gap:9px;padding:10px 18px;min-height:48px;border:1px solid var(--notes-line);border-radius:9px;color:var(--notes-ink);font-size:12px;background:var(--notes-card)}.notes-button .icon{width:18px;height:18px}.notes-button:hover{border-color:var(--orange);color:var(--notes-ink)}.notes-read{display:inline-flex;gap:8px;align-items:center;font-size:11px;min-height:44px;color:var(--notes-muted)}.notes-read .icon{width:17px;height:17px}.watch-link{display:inline-flex;align-items:center;gap:8px;font-size:10px;color:var(--notes-muted);min-height:44px;margin-top:6px}.watch-link .icon{width:15px;height:15px;transform:scaleX(-1)}html[dir=ltr] .watch-link .icon{transform:none}
/* The requested questions column stays on the physical left in both locales. */
.reading-layout{display:grid;grid-template-columns:250px minmax(0,1fr);grid-template-areas:'faq reader';gap:40px;align-items:start;direction:ltr;margin-top:40px;padding-top:38px;border-top:1px solid var(--notes-line)}
.lesson-faq{grid-area:faq;position:sticky;top:24px;min-width:0}
.lesson-faq h2{font-size:17px;font-weight:500;line-height:1.9;margin-bottom:20px}.faq-item{border-bottom:1px solid var(--notes-line);padding-block:15px}.faq-item:first-of-type{border-top:1px solid var(--notes-line)}.faq-item summary{display:flex;align-items:center;justify-content:space-between;gap:12px;min-height:36px;font-size:12px;font-weight:400;line-height:2;cursor:pointer;list-style:none}.faq-item summary::-webkit-details-marker{display:none}.faq-item summary .icon{flex:none;width:15px;height:15px;transition:transform .18s}.faq-item[open] summary .icon{transform:rotate(180deg)}.faq-item p{font-size:11px;line-height:2.25;color:var(--notes-muted);padding-block:10px 3px}.faq-item summary:hover{color:var(--orange)}
.related{margin-top:38px}.related h2{font-size:13px;font-weight:500;margin-bottom:13px}.related-lessons{display:flex;flex-wrap:wrap;gap:9px}.related-lessons a{display:flex;flex-direction:column;gap:5px;padding:13px 16px;border:1px solid var(--notes-line);border-radius:8px;font-size:11px;background:var(--notes-card)}.related-lessons a>span:first-child{font-size:9px;color:var(--notes-muted)}.related-lessons a[aria-current]{border-color:var(--orange)}
.lesson-nav{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:36px;border-top:1px solid var(--notes-line);margin-top:46px;padding-block:24px 35px}.lesson-nav a{font-size:13px;line-height:1.9;min-width:0}.lesson-nav small{display:flex;align-items:center;gap:8px;color:var(--notes-muted);font-size:10px;margin-bottom:8px}.lesson-nav .icon{width:16px;height:16px}.lesson-nav .next-lesson{text-align:end}.next-lesson small{justify-content:flex-end}.next-lesson .icon,html[dir=ltr] .previous-lesson .icon{transform:scaleX(-1)}html[dir=ltr] .next-lesson .icon{transform:none}
html[lang=zh-Hans] .notes-breadcrumb{font-size:16px}html[lang=zh-Hans] .lesson-heading h1{font-size:36px;line-height:1.55;font-weight:300}html[lang=zh-Hans] .lesson-heading .notes-kicker{font-size:16px}html[lang=zh-Hans] .notes-page .primary-button,html[lang=zh-Hans] .notes-button{font-size:19px}html[lang=zh-Hans] .notes-read,html[lang=zh-Hans] .related h2{font-size:19px;font-weight:300}html[lang=zh-Hans] .watch-link,html[lang=zh-Hans] .lesson-nav small{font-size:15px}html[lang=zh-Hans] .related-lessons a,html[lang=zh-Hans] .lesson-nav a{font-size:19px}html[lang=zh-Hans] .related-lessons a>span:first-child{font-size:14px}html[lang=zh-Hans] .faq-item summary{font-size:19px;line-height:1.7}html[lang=zh-Hans] .faq-item p{font-size:17px;line-height:1.9}
@media(max-width:1050px){.notes-intro{gap:20px}.cover-stack{width:310px}.notes-intro h1{font-size:52px}.chapter-tabs button{gap:10px;padding:15px}.chapter-index{font-size:20px}.note-main{gap:14px;padding:20px}.note-copy h2{font-size:12px}.lesson-heading h1{font-size:25px}.lesson-resources{gap:9px}.reading-layout{grid-template-columns:220px minmax(0,1fr);gap:26px}}
@media(max-width:760px){.notes-intro{min-height:230px;padding-block:32px 24px}.notes-intro h1{font-size:40px}.notes-kicker{font-size:10px}.notes-lead{font-size:12px;line-height:2}.notes-count{font-size:10px;margin-top:16px}.cover-stack{width:180px;height:190px;transform:scale(.64);transform-origin:center;flex:none;margin-inline-end:35px}.cover-stack img{left:20px}.cover-stack img:first-child{left:-50px}.cover-stack img:last-child{left:97px}.chapter-tabs{gap:2px;margin-bottom:24px}.chapter-tabs button{display:block;text-align:center;padding:12px 5px;min-height:72px}.chapter-index,.chapter-tabs .icon,.chapter-tabs small{display:none}.chapter-tabs strong{font-size:12px}.notes-toolbar{display:block}.section-title{font-size:21px}.notes-search{width:100%;margin-top:15px}.note-grid{grid-template-columns:1fr;gap:10px}.note-copy h2{font-size:13px}.note-main{padding:18px}.note-open{font-size:10px}.note-number{font-size:20px}.notes-library{padding-bottom:34px}.notes-breadcrumb{padding-block:22px;font-size:10px;gap:9px}.lesson-heading h1{font-size:25px}.lesson-heading{margin-bottom:18px}.lesson-heading .notes-kicker{font-size:10px}.lesson-resources{margin-top:18px}.reading-layout{grid-template-columns:minmax(0,1fr);grid-template-areas:'reader' 'faq';margin-top:24px;padding-top:26px;gap:32px}.lesson-faq{position:static}.lesson-nav{gap:20px;margin-top:32px}.lesson-nav a{font-size:11px}.notes-page .primary-button,.notes-button{font-size:11px;padding-inline:14px}.related-lessons{display:grid;grid-template-columns:1fr}.related-lessons a{display:grid;grid-template-columns:70px minmax(0,1fr);align-items:center;gap:12px}html[lang=zh-Hans] .chapter-tabs strong{font-size:18px}html[lang=zh-Hans] .notes-lead{font-size:18px}html[lang=zh-Hans] .note-copy h2{font-size:19px}html[lang=zh-Hans] .notes-kicker,html[lang=zh-Hans] .notes-count{font-size:14px}html[lang=zh-Hans] .lesson-heading h1{font-size:29px}html[lang=zh-Hans] .notes-breadcrumb{font-size:14px}html[lang=zh-Hans] .notes-page .primary-button,html[lang=zh-Hans] .notes-button{font-size:17px}html[lang=zh-Hans] .lesson-nav a{font-size:17px}}
@media(max-width:600px){.cover-stack{display:none}.notes-intro>div:first-child{max-width:none}.notes-lead{max-width:none}}
@media(max-width:430px){.notes-page .shell{width:calc(100% - 32px)}.notes-intro{min-height:215px;gap:0}.notes-intro h1{font-size:38px}.notes-lead{font-size:11px}.notes-count{font-size:9px}.chapter-tabs strong{font-size:11px}.notes-intro .notes-kicker{font-size:10px}.notes-page .footer-grid{padding-inline:0}.lesson-heading h1{font-size:23px}.lesson-resources{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));align-items:stretch}.lesson-resources .primary-button,.lesson-resources .notes-button{width:100%;min-width:0;padding-inline:8px}.lesson-resources .notes-read{grid-column:1/-1}html[lang=zh-Hans] .notes-intro h1{font-size:32px}html[lang=zh-Hans] .notes-lead{font-size:17px}html[lang=zh-Hans] .notes-count{font-size:12px}}
@media(prefers-reduced-motion:reduce){.note-card,.faq-item summary .icon{transition:none}.note-card:hover{transform:none}}

/* Teaching content is responsive HTML, with the original PDF only a download. */
@font-face{font-family:PhoneticArabic;src:url('/assets/fonts/ScheherazadeNew-Regular.woff2') format('woff2');font-weight:400;font-display:swap}
.reading-layout{grid-template-areas:'sidebar notes';grid-template-columns:230px minmax(0,1fr);gap:48px}.lesson-sidebar{grid-area:sidebar;position:sticky;top:28px;align-self:start;min-width:0}.lesson-sidebar .lesson-faq{position:static}.native-notes{grid-area:notes;min-width:0;scroll-margin-top:24px}html[dir=rtl] .lesson-sidebar,html[dir=rtl] .native-notes{direction:rtl}
.lesson-contents{border-bottom:1px solid var(--notes-line);padding-bottom:22px;margin-bottom:30px}.lesson-contents h2,.lesson-faq h2{font-size:15px;font-weight:500;line-height:1.9;margin-bottom:15px}.lesson-contents a{display:block;font-size:11px;line-height:2;min-height:40px;padding-block:8px;color:var(--notes-muted)}.lesson-contents a:hover{color:var(--orange)}.lesson-contents a:focus-visible,.lesson-solutions summary:focus-visible{outline:2px solid var(--orange);outline-offset:4px}
.native-notes-heading{padding-bottom:30px;border-bottom:1px solid var(--notes-line)}.native-notes-heading h2{font-size:30px;line-height:1.7;font-weight:500}.native-section{padding-block:34px 38px;border-bottom:1px solid var(--notes-line);scroll-margin-top:24px}.native-section:last-child{border:0;padding-bottom:0}.native-section h3{font-size:21px;font-weight:500;line-height:1.9;margin-bottom:14px}.native-section h4{font-size:14px;font-weight:500;line-height:2;margin-block:22px 12px}.native-section p{font-size:13px;line-height:2.25;color:var(--notes-muted)}.native-section .notes-kicker{color:var(--orange);font-size:10px;line-height:1.8;margin-bottom:8px}.native-section .native-note{font-size:11px;line-height:2.1;margin-top:20px;padding-inline-start:15px;border-inline-start:2px solid var(--notes-line)}
.course-path{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:12px;margin-top:24px}.course-path>div{padding:20px 18px;background:var(--notes-soft);border-radius:9px}.course-path h4{color:var(--orange);margin:0 0 8px;font-size:12px}.course-path p{font-size:11px;line-height:2.1}
.pinyin-definition{display:flex;align-items:center;justify-content:center;gap:24px;padding:22px 18px;background:var(--notes-soft);border-radius:10px;margin-block:24px 30px;direction:ltr}.lesson-hanzi{font-family:Yuanti,sans-serif;font-weight:300;font-size:40px;line-height:1.4;color:var(--notes-ink)}.lesson-pinyin{display:inline-block;font:400 25px/1.25 Century,sans-serif;color:var(--orange);white-space:nowrap;direction:ltr}.lesson-vowel{display:inline-block;position:relative}.lesson-accent{position:absolute;left:50%;transform:translateX(-50%);top:.006em;width:.46em;height:auto;fill:none;stroke:currentColor;stroke-width:7.5;stroke-linecap:round;stroke-linejoin:round;overflow:visible}.lesson-accent[data-tone="1"]{top:.225em}.lesson-accent[data-tone="3"]{width:.55em;top:.07em}
.syllable-examples{display:grid;gap:12px}.syllable-example{display:flex;align-items:center;gap:24px;padding:22px 24px;border:1px solid var(--notes-line);border-radius:9px}.syllable-word{display:grid;justify-items:center;gap:7px;min-width:68px}.syllable-parts{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:15px;flex:1;text-align:center;min-width:0}.syllable-parts dt{font-size:11px;color:var(--notes-muted);margin-bottom:12px}.syllable-parts dd{font:400 26px/1.25 Century,sans-serif;color:var(--notes-ink)}
.lesson-greeting{display:flex;align-items:center;justify-content:center;gap:44px;margin-block:30px;direction:ltr}.lesson-greeting>div{display:grid;grid-template-columns:auto auto;align-items:center;justify-items:center;gap:8px 0}.lesson-greeting .greeting-pinyin{grid-column:1;grid-row:2}.lesson-greeting .lesson-pinyin{font-size:22px}.lesson-greeting .greeting-punctuation{font-family:Yuanti,sans-serif;font-size:40px;grid-column:2;grid-row:1}.lesson-arabic-greeting{font:400 34px/1.8 Kufi,sans-serif;color:var(--notes-ink)}
.sound-cards{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:12px;margin-top:23px}.sound-card{border:1px solid var(--notes-line);border-radius:10px;padding:23px 16px;text-align:center;display:flex;flex-direction:column;align-items:center;gap:10px}.sound-letter{font:400 42px/1.3 Century,sans-serif;color:var(--orange)}.sound-cue{font:400 28px/1.55 PhoneticArabic,serif;color:var(--notes-ink)}.sound-card p{font-size:11px;line-height:2.05}.sound-group-heading{margin-top:32px}.sound-group-heading h3{font-size:18px}.airflow-compare{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:16px;margin-block:24px}.airflow-compare>div{background:var(--notes-soft);border-radius:10px;text-align:center;padding:24px 18px}.airflow-compare p{margin-top:12px;font-size:12px}.native-section .sound-sequence{font:400 27px/1.8 Century,sans-serif;word-spacing:.32em;text-align:center;color:var(--orange);margin-block:22px;overflow-wrap:normal}.sound-sequence>span{margin-inline:8px;color:var(--notes-muted)}
.lesson-exercise{padding:5px 0 24px}.lesson-exercise+.lesson-exercise{border-top:1px solid var(--notes-line)}.exercise-syllable{display:flex;align-items:center;gap:20px;margin-block:22px;justify-content:center;direction:ltr}.answer-fields{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:14px}.lesson-answer-field{display:flex;flex-direction:column;gap:10px;min-width:0;font-size:11px;line-height:2;color:var(--notes-muted)}.lesson-answer-field input{font:400 17px/1.5 Century,Kufi,sans-serif;background:var(--notes-card);border:1px solid var(--notes-line);border-radius:7px;min-width:0;width:100%;min-height:48px;padding:10px 12px;color:var(--notes-ink)}.lesson-answer-field input:focus{outline:2px solid var(--orange);outline-offset:2px}.classification-fields{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:18px}.reading-sequences{padding:1px 12px;background:var(--notes-soft);border-radius:9px}.reading-sequences .sound-sequence{margin-block:14px}.lesson-solutions{border:1px solid var(--notes-line);border-radius:10px;overflow:hidden;margin-top:10px}.lesson-solutions summary{display:flex;align-items:center;justify-content:space-between;gap:18px;list-style:none;font-size:13px;min-height:60px;padding:16px 22px;cursor:pointer;background:var(--notes-soft)}.lesson-solutions summary::-webkit-details-marker{display:none}.lesson-solutions summary .icon{width:18px;height:18px;flex:none}.lesson-solutions[open] summary .icon{transform:rotate(180deg)}.solution-content{padding:0 24px 24px}.solution-content .syllable-parts{padding-block:12px}.group-answers>div{display:flex;justify-content:space-between;align-items:center;gap:20px;padding-block:10px}.group-answers dt{font-size:11px;line-height:2}.group-answers dd{font:400 22px/1.5 Century,sans-serif;white-space:nowrap;word-spacing:.18em;color:var(--orange)}.solution-content>p{margin-top:18px}
html[lang=zh-Hans] .lesson-contents h2,html[lang=zh-Hans] .lesson-faq h2{font-size:23px;font-weight:300}html[lang=zh-Hans] .lesson-contents a{font-size:17px;line-height:1.6}html[lang=zh-Hans] .native-notes-heading h2{font-size:36px;font-weight:300}html[lang=zh-Hans] .native-section h3{font-size:28px;font-weight:300;line-height:1.6}html[lang=zh-Hans] .native-section h4{font-size:21px;font-weight:300}html[lang=zh-Hans] .native-section p{font-size:20px;line-height:1.9}html[lang=zh-Hans] .native-section .notes-kicker{font-size:15px}html[lang=zh-Hans] .native-section .native-note{font-size:17px}html[lang=zh-Hans] .course-path h4{font-size:20px}html[lang=zh-Hans] .course-path p,html[lang=zh-Hans] .sound-card p{font-size:17px}html[lang=zh-Hans] .syllable-parts dt,html[lang=zh-Hans] .lesson-answer-field,html[lang=zh-Hans] .group-answers dt{font-size:17px}html[lang=zh-Hans] .airflow-compare p{font-size:18px}html[lang=zh-Hans] .native-section .sound-sequence{font:400 27px/1.8 Century,sans-serif}html[lang=zh-Hans] .lesson-solutions summary{font-size:20px}
@media(max-width:1100px){.reading-layout{grid-template-columns:210px minmax(0,1fr);gap:32px}.course-path{grid-template-columns:1fr;gap:9px}.course-path>div{padding:16px 20px}.course-path h4{margin-bottom:4px}.sound-cards{grid-template-columns:repeat(2,minmax(0,1fr))}.syllable-example{padding:20px 14px;gap:18px}}
@media(max-width:760px){.reading-layout{grid-template-columns:minmax(0,1fr);grid-template-areas:'notes' 'sidebar';gap:32px}.lesson-sidebar{position:static}.lesson-contents{display:none}.native-notes-heading h2{font-size:26px}.native-section{padding-block:28px}.native-section h3{font-size:20px}.native-section p{font-size:12px}.native-section h4{font-size:13px}.native-notes-heading{padding-bottom:22px}.syllable-parts{gap:12px}.syllable-parts dt{font-size:10px}.syllable-parts dd{font-size:23px}.lesson-pinyin{font-size:23px}.lesson-greeting{gap:28px}.lesson-arabic-greeting{font-size:30px}.lesson-greeting .lesson-pinyin{font-size:20px}.lesson-hanzi,.lesson-greeting .greeting-punctuation{font-size:36px}.sound-card{padding:20px 14px}.sound-letter{font-size:36px}.classification-fields{grid-template-columns:1fr;gap:16px}.lesson-answer-field{font-size:10px}.answer-fields{gap:10px}.lesson-answer-field input{padding-inline:9px}.group-answers>div{align-items:start}.solution-content{padding-inline:18px}html[lang=zh-Hans] .native-notes-heading h2{font-size:31px}html[lang=zh-Hans] .native-section h3{font-size:26px}html[lang=zh-Hans] .native-section p{font-size:19px}html[lang=zh-Hans] .sound-card p,html[lang=zh-Hans] .native-section .native-note{font-size:17px}html[lang=zh-Hans] .native-section .sound-sequence{font-size:24px}}
@media(max-width:390px){.syllable-example{gap:12px;padding:18px 12px}.syllable-word{min-width:50px}.syllable-parts{gap:8px}.syllable-parts dt{font-size:9px}.lesson-greeting{gap:24px}.lesson-greeting .lesson-pinyin{font-size:20px}.lesson-arabic-greeting{font-size:29px}.native-section .sound-sequence{font-size:23px;word-spacing:.2em}.group-answers>div{flex-direction:column;gap:4px}.airflow-compare{gap:10px}.airflow-compare>div{padding-inline:13px}html[lang=zh-Hans] .syllable-parts dt{font-size:15px}html[lang=zh-Hans] .native-section .sound-sequence{font-size:23px}}
/* Keep reading lines comfortable and align the lesson with the wide video. */
.reading-layout{max-width:1120px;margin-inline:auto}.lesson-sidebar{max-height:calc(100dvh - 56px);overflow-y:auto;scrollbar-width:thin;padding-inline-end:4px}.native-section p{font-size:14px}.native-section .notes-kicker{font-size:10px}.course-path p,.sound-card p{font-size:11px}.airflow-compare p{font-size:12px}.native-section .native-note{font-size:11px}
@media(max-width:760px){.lesson-sidebar{max-height:none;overflow:visible;padding:0}.native-section p{font-size:13px}.native-section .notes-kicker{font-size:10px}.course-path p,.sound-card p,.native-section .native-note{font-size:11px}}
/* Reset the browser's dd indentation: headings and values share one center. */
.syllable-parts dd{margin:0}.syllable-parts>div{display:grid;grid-template-rows:auto 48px;justify-items:center;align-items:center;min-width:0}.syllable-parts dt{margin:0 0 10px}.syllable-parts dd{display:flex;align-items:center;justify-content:center;min-height:48px;width:100%}
.syllable-word{border:0;background:transparent;padding:8px;border-radius:8px;color:var(--notes-ink);font:inherit}.part-sound,.greeting-sound{display:inline-flex;align-items:center;justify-content:center;min-width:44px;min-height:44px;padding:5px;border:0;border-radius:7px;background:transparent;color:inherit;font:inherit}.greeting-sound .lesson-pinyin{color:var(--orange)}.part-sound:hover,.greeting-sound:hover,.syllable-word:hover{background:var(--notes-soft)}.part-sound.is-playing,.greeting-sound.is-playing,.syllable-word.is-playing{outline:2px solid var(--orange);outline-offset:2px}.syllable-word:focus-visible,.part-sound:focus-visible,.greeting-sound:focus-visible{outline:2px solid var(--orange);outline-offset:3px}
.notes-page .sound-circle{display:inline-flex;align-items:center;justify-content:center;position:relative;flex:none;width:68px;height:68px;padding:0;border:0;border-radius:50%;background:var(--notes-turquoise);color:#fff;font:400 26px/1 Century,sans-serif;cursor:pointer;transition:background .15s,box-shadow .15s}.notes-page .sound-circle:hover{background:#118987;color:#fff}.notes-page .sound-circle:active{background:#0e7776;color:#fff}.notes-page .sound-circle:focus-visible{outline:3px solid var(--notes-ink);outline-offset:5px}.notes-page .sound-circle.is-playing{box-shadow:0 0 0 4px var(--notes-page),0 0 0 6px var(--notes-turquoise);color:#fff}.sound-card .sound-circle{width:78px;height:78px;font-size:30px}.notes-page .sound-circle .icon{width:26px;height:26px;color:#fff}.native-section .sound-sequence{display:flex;flex-wrap:wrap;justify-content:center;gap:18px;margin:0;padding:12px 0;word-spacing:normal}.sound-practice{display:flex;flex-wrap:wrap;justify-content:center;gap:12px 32px;margin-block:24px}.sound-practice .sound-sequence{gap:14px}.reading-sequences{padding:14px;border-radius:10px;background:var(--notes-soft)}.reading-sequences .sound-sequence{margin:0;gap:18px;padding:12px 0}.airflow-compare .sound-circle{margin-inline:auto}
.lesson-quiz-entry{display:flex;align-items:center;justify-content:space-between;gap:32px}.lesson-quiz-entry>div{max-width:570px}.lesson-quiz-entry .primary-button{flex:none;border:0;color:#fff}.lesson-quiz-entry .primary-button .icon{transform:scaleX(-1)}html[dir=ltr] .lesson-quiz-entry .primary-button .icon{transform:none}.lesson-audio-status{font-size:11px;line-height:2;color:var(--notes-ink);margin-top:12px}.lesson-audio-status:empty{display:none}
.lesson-quiz{padding:0;margin:auto;width:min(620px,calc(100% - 32px));max-width:none;max-height:calc(100dvh - 40px);overflow:auto;overscroll-behavior:contain;border:1px solid var(--notes-line);border-radius:18px;background:var(--notes-page);color:var(--notes-ink);box-shadow:0 24px 100px #05132166}.lesson-quiz::backdrop{background:#071521b8;backdrop-filter:blur(4px)}.lesson-quiz-open{overflow:hidden}.quiz-topbar{display:flex;align-items:center;justify-content:space-between;gap:18px;padding:18px 24px;border-bottom:1px solid var(--notes-line)}.quiz-label{font-size:12px;color:var(--notes-muted)}.quiz-close{display:flex;align-items:center;justify-content:center;flex:none;width:44px;height:44px;border:0;border-radius:8px;background:transparent;color:var(--notes-ink)}.quiz-close:hover{background:var(--notes-soft)}.quiz-close .icon{width:20px;height:20px}.quiz-stage{padding:24px 38px 32px;min-height:420px}.quiz-progress-label{font-size:10px;color:var(--notes-muted);text-align:start;line-height:2}.quiz-progress{display:block;width:100%;height:4px;margin-block:12px 28px;border:0;appearance:none;background:var(--notes-line);color:var(--orange);border-radius:8px;overflow:hidden}.quiz-progress::-webkit-progress-bar{background:var(--notes-line)}.quiz-progress::-webkit-progress-value{background:var(--orange)}.quiz-progress::-moz-progress-bar{background:var(--orange)}.quiz-stage h2{font-size:23px;font-weight:500;line-height:1.9;text-align:center;margin:0;outline:none}.quiz-choices{display:flex;flex-wrap:wrap;justify-content:center;gap:24px;margin:28px 0}.notes-page .quiz-choice{width:74px;height:74px;font-size:26px}.quiz-choice[aria-checked=true]{box-shadow:0 0 0 4px var(--notes-page),0 0 0 6px var(--notes-turquoise)}.notes-page .quiz-choice:disabled{opacity:1;cursor:default;background:var(--notes-turquoise);color:#fff}.choice-check{position:absolute;right:-5px;top:-5px;width:22px;height:22px;background:var(--notes-ink);color:var(--notes-page);border-radius:50%;padding:3px}.quiz-latin{font-family:Century,sans-serif;font-weight:400}.quiz-listen{display:flex!important;margin:24px auto 12px}.quiz-listen-hint{text-align:center;font-size:11px;line-height:2;color:var(--notes-muted)}.quiz-feedback{min-height:26px;text-align:center;line-height:2;font-size:12px}.quiz-feedback:has(strong){padding:16px;border-radius:10px;background:var(--notes-soft)}.quiz-feedback strong{display:block;font-size:14px;font-weight:500}.quiz-correct-answer{display:block;color:var(--notes-muted);margin-top:5px}.quiz-correct-answer .quiz-latin{font-size:23px;color:var(--notes-ink);margin-inline-start:8px}.quiz-feedback p{font-size:12px;line-height:2.2;margin-top:8px;color:var(--notes-muted)}.quiz-feedback .lesson-pinyin{font-size:18px}.quiz-actions{display:flex;justify-content:center;margin-top:22px}.lesson-quiz .primary-button{border:0;min-width:160px;color:#fff}.lesson-quiz .primary-button:disabled{opacity:.45;cursor:default;box-shadow:none}.lesson-quiz .primary-button:disabled:hover{transform:none}.quiz-result{text-align:center}.quiz-result .notes-kicker{margin:6px 0 16px}.quiz-stage .quiz-score{font:400 84px/1.25 Century,sans-serif;color:var(--orange);margin-block:10px}.quiz-score>span{font-size:34px;margin-inline-start:4px}.quiz-score-caption{font-size:15px;line-height:2}.quiz-result-message{font-size:12px;line-height:2.2;color:var(--notes-muted);margin-top:20px}.quiz-review{border-top:1px solid var(--notes-line);padding-top:20px;margin-top:22px;text-align:start}.quiz-review h3{font-size:12px;font-weight:500;margin-bottom:10px}.quiz-review a{display:flex;align-items:center;justify-content:space-between;gap:15px;font-size:12px;line-height:2;min-height:44px;color:var(--notes-ink)}html[dir=ltr] .quiz-review a>span{transform:scaleX(-1)}.quiz-result-actions{display:flex;flex-wrap:wrap;justify-content:center;gap:12px;margin-top:28px}.lesson-quiz>.lesson-audio-status{padding:0 24px 16px;margin:0}.quiz-close:focus-visible,.quiz-review a:focus-visible{outline:2px solid var(--orange);outline-offset:3px}
html[lang=zh-Hans] .quiz-label{font-size:18px}html[lang=zh-Hans] .quiz-progress-label{font-size:15px}html[lang=zh-Hans] .quiz-stage h2:not(.quiz-score){font-size:28px;font-weight:300;line-height:1.6}html[lang=zh-Hans] .quiz-feedback,html[lang=zh-Hans] .quiz-feedback p,html[lang=zh-Hans] .quiz-result-message,html[lang=zh-Hans] .quiz-review h3,html[lang=zh-Hans] .quiz-review a,html[lang=zh-Hans] .lesson-audio-status{font-size:18px}html[lang=zh-Hans] .quiz-feedback strong,html[lang=zh-Hans] .quiz-score-caption{font-size:22px;font-weight:300}
@media(max-width:1000px){.lesson-quiz-entry{align-items:flex-start;flex-direction:column;gap:22px}.sound-practice{gap:8px 24px}}
@media(max-width:760px){.notes-page .sound-circle{width:62px;height:62px;font-size:24px}.sound-card .sound-circle{width:72px;height:72px;font-size:28px}.native-section .sound-sequence{gap:14px}.reading-sequences{padding:10px 0}.reading-sequences .sound-sequence{gap:14px}.lesson-quiz-entry .primary-button{width:100%}.lesson-quiz{max-height:calc(100dvh - 24px);border-radius:14px}.quiz-topbar{padding:12px 16px}.quiz-stage{padding:20px 22px 26px;min-height:360px}.quiz-stage h2{font-size:20px}.quiz-choices{gap:18px;margin-block:26px}.notes-page .quiz-choice{width:66px;height:66px;font-size:24px}.quiz-feedback{font-size:11px}.quiz-feedback p{font-size:11px}.quiz-progress{margin-bottom:22px}.quiz-result-actions{flex-direction:column}.quiz-result-actions button{width:100%}.quiz-stage .quiz-score{font-size:72px}.quiz-result-message{font-size:11px}.quiz-word .lesson-hanzi{font-size:48px}.quiz-word .lesson-pinyin{font-size:29px}}
@media(max-width:430px){.quiz-choices{display:grid;grid-template-columns:repeat(2,66px);gap:22px 32px}.quiz-stage{padding-inline:20px}.quiz-stage h2{font-size:18px}html[lang=zh-Hans] .quiz-stage h2:not(.quiz-score){font-size:25px}.sound-practice .sound-sequence{gap:14px}.greeting-sound{min-width:0;padding-inline:1px}}
@media(prefers-reduced-motion:reduce){.notes-page .sound-circle{transition:none}}
/* Freeze the lesson behind the modal and return to exactly the same place. */
body.lesson-quiz-open{position:fixed;inset-inline:0;top:var(--lesson-scroll-lock);width:100%;overflow:hidden}

/* Keep the question, choices and feedback comfortable on smaller phones. */
@media(max-width:430px){.quiz-stage{padding-block:16px 20px}.quiz-progress{margin-bottom:18px}.quiz-word{margin-block:16px}.quiz-choices{margin-block:20px;gap:18px 32px}.quiz-feedback:has(strong){padding:12px}.quiz-actions{margin-top:16px}}

/* Retained Alaboren secondary accent; orange remains the main action color. */
.notes-page{--notes-turquoise:#149c9a}

/* The next foundation lessons reuse the same native content and sound controls. */
.lesson-inline-latin{font-family:Century,sans-serif;font-weight:400}.lesson-inline-hanzi{font-family:Yuanti,sans-serif;font-weight:300}.foundation-cards{grid-template-columns:repeat(auto-fit,minmax(170px,1fr))}.sound-methods{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:18px;margin-top:28px}.sound-methods>div{padding:22px 12px;border-radius:10px;background:var(--notes-soft);text-align:center}.sound-methods h4{font-size:13px;min-height:50px}.mouth-steps{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:24px;margin-top:28px}.mouth-steps figure{display:flex;flex-direction:column;align-items:center;gap:20px;margin:0;padding:24px 16px;background:var(--notes-soft);border-radius:10px;text-align:center}.mouth-steps figcaption{font-size:14px}.mouth-steps img{width:min(100%,229px);height:auto;border-radius:12px}.native-notes-heading>p{font-size:14px;line-height:2.2;color:var(--notes-muted);margin-top:16px}html[lang=zh-Hans] .native-notes-heading>p{font-size:21px}html[lang=zh-Hans] .sound-methods h4,html[lang=zh-Hans] .mouth-steps figcaption{font-size:22px;font-weight:300}.lesson-sidebar .lesson-faq{position:static}
@media(max-width:1000px){.sound-methods{grid-template-columns:1fr}.sound-methods h4{min-height:0}.sound-methods>div{padding-block:16px}}
@media(max-width:760px){.foundation-cards{grid-template-columns:repeat(2,minmax(0,1fr))}.mouth-steps{gap:14px}.mouth-steps figure{padding:18px 10px;gap:16px}.mouth-steps figcaption{font-size:12px}.native-notes-heading>p{font-size:13px}html[lang=zh-Hans] .mouth-steps figcaption{font-size:19px}.foundation-cards .sound-card:last-child:nth-child(odd){grid-column:1/-1}}

/* Keep the three-letter final comfortably inside its pronunciation circle. */
.notes-page .sound-card [data-lesson-sound="ang"]{font-size:27px}

.lesson-sidebar .lesson-faq + .lesson-faq{margin-top:34px}

/* Weekly cards keep chapter two compact as the course grows. */
.week-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:14px;align-items:start}.note-grid:not([hidden])+.week-grid:not([hidden]){margin-top:22px}.week-card{min-width:0;background:var(--notes-card);border:1px solid var(--notes-line);border-radius:11px;overflow:hidden;scroll-margin-top:24px}.week-heading{display:flex;align-items:center;justify-content:space-between;gap:20px;padding:20px 24px;min-height:86px;cursor:pointer;list-style:none}.week-heading::-webkit-details-marker{display:none}.week-heading strong{display:block;font-size:15px;line-height:1.8;font-weight:500}.week-heading small{display:block;margin-top:5px;font-size:10px;line-height:1.8;color:var(--notes-muted)}.week-heading>.icon{width:18px;height:18px;flex:none;color:var(--notes-muted);transition:transform .18s}.week-heading:hover{background:var(--notes-soft)}.week-card[open]>.week-heading{background:var(--notes-soft)}.week-card[open]>.week-heading>.icon{transform:rotate(180deg)}.week-body{padding:0 20px}.week-lesson{border:0;border-bottom:1px solid var(--notes-line);border-radius:0;background:transparent}.week-lesson:hover{transform:none;border-color:var(--notes-line)}.week-lesson .note-main{min-height:64px;padding:12px 4px;gap:18px}.week-lesson .note-number{font-size:17px;color:var(--notes-muted)}.week-lesson h3{font-size:13px;line-height:1.8;font-weight:400}.week-lesson .note-main>.icon{width:16px;height:16px;color:var(--notes-muted);flex:none}html[dir=rtl] .week-lesson .note-main>.icon{transform:scaleX(-1)}.week-lesson .note-main:hover h3{color:var(--orange)}.week-downloads{display:flex;flex-wrap:wrap;gap:4px 20px;padding:10px 0}.week-downloads a{display:flex;align-items:center;gap:8px;min-height:42px;color:var(--notes-muted);font-size:10px}.week-downloads a:hover{color:var(--notes-ink)}.week-downloads .icon{width:16px;height:16px;flex:none}html[lang=zh-Hans] .week-heading strong{font-size:23px;font-weight:300}html[lang=zh-Hans] .week-heading small{font-size:16px}html[lang=zh-Hans] .week-lesson h3{font-size:21px}html[lang=zh-Hans] .week-downloads a{font-size:16px}
@media(max-width:760px){.week-grid{grid-template-columns:1fr;gap:10px}.week-heading{padding:16px 18px;min-height:78px}.week-heading strong{font-size:14px}.week-body{padding-inline:16px}.week-downloads{gap:4px 14px}}
@media(prefers-reduced-motion:reduce){.week-heading>.icon{transition:none}}