/* 延续大师码课程主题：课堂投屏大字号，长课文保持单列阅读。 */
.fa-map,.fa-layout { max-width:1680px; margin:0 auto; }
.fa-map-header { display:flex; align-items:center; justify-content:space-between; gap:28px; padding:32px; border:1px solid var(--line-strong); border-radius:18px; background:var(--surface); }
.fa-map h1,.fa-lesson h1 { font-size:clamp(28px,2.4vw,42px); line-height:1.35; margin:8px 0 16px; }
.fa-map-header p { font-size:19px; color:var(--ink-soft); line-height:1.8; }
.fa-meta { color:var(--brand); font-size:15px; font-weight:700; }
.fa-stage-line { display:flex; flex-wrap:wrap; gap:10px; margin:24px 0 14px; }
.fa-stage-line>* { padding:10px 16px; border:1px solid var(--line-strong); border-radius:10px; background:var(--surface); font-size:16px; }
.fa-stage-line>b { color:var(--on-brand); background:var(--brand); }
.fa-stage-line>span { color:var(--ink-soft); }
.fa-map-group { margin:32px 0; }
.fa-course-grid { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:16px; }
.fa-course-card { display:flex; flex-direction:column; padding:22px; border:1px solid var(--line-strong); border-radius:14px; background:var(--surface); text-decoration:none; transition:border-color .15s,box-shadow .15s; }
.fa-course-card:hover { border-color:var(--brand); box-shadow:var(--shadow-sm); }
.fa-course-card>div { display:flex; justify-content:space-between; gap:8px; color:var(--brand); font-size:14px; }
.fa-course-card h3 { font-size:21px; line-height:1.5; margin:16px 0 12px; color:var(--ink); }
.fa-course-card p { font-size:15px; color:var(--ink-soft); margin-bottom:18px; }
.fa-card-go { margin-top:auto; color:var(--brand); font-size:16px; font-weight:700; }
.fa-layout { display:grid; grid-template-columns:minmax(0,1fr) 190px; gap:24px; align-items:start; }
.fa-lesson { min-width:0; font-size:19px; line-height:1.85; }
.fa-lesson p { margin:12px 0; overflow-wrap:anywhere; }
.fa-lesson li { margin:7px 0; }
.fa-lesson ul,.fa-lesson ol { padding-left:26px; }
.fa-lesson h2 { font-size:28px; line-height:1.45; }
.fa-lesson h3 { font-size:22px; line-height:1.5; margin:18px 0 10px; }
.fa-lesson-header { padding:22px 0 30px; border-bottom:2px solid var(--line-strong); }
.fa-lesson-header>p { max-width:1000px; font-size:22px; color:var(--ink-soft); }
.fa-lesson-header>p.fa-muted { font-size:16px; line-height:1.7; }
.fa-pills { display:flex; flex-wrap:wrap; gap:10px; }
.fa-pills span { font-size:15px; padding:6px 12px; border-radius:7px; color:var(--brand-ink); background:var(--brand-soft); }
.fa-section { margin:26px 0; padding:28px; border:1px solid var(--line-strong); border-radius:16px; background:var(--surface); scroll-margin-top:92px; }
.fa-section-heading { display:flex; align-items:center; gap:12px; margin:0 0 22px; }
.fa-section-heading>span { display:grid; flex:none; min-width:38px; height:38px; padding:0 8px; place-items:center; border-radius:9px; background:var(--brand-soft); color:var(--brand); font-size:16px; font-weight:800; }
.fa-section-heading h2 { margin:0; }
.fa-goal { padding:16px 20px; border-left:4px solid var(--brand); background:var(--brand-soft); font-size:21px; }
.fa-two { display:grid; grid-template-columns:1fr 1fr; gap:24px; }
.fa-note { padding:14px 18px; border:1px solid var(--line-strong); border-radius:9px; background:var(--surface-2); color:var(--ink-soft); font-size:16px; line-height:1.8; }
.fa-muted { color:var(--ink-soft); font-size:15px; }
.fa-concept { padding:16px 0 22px; border-bottom:1px solid var(--line); }
.fa-concept:last-child { border:0; padding-bottom:0; }
.fa-concept h3 { display:flex; align-items:baseline; gap:12px; }
.fa-concept h3 span { color:var(--brand); font:700 16px var(--font-code); }
.fa-example-line { border-radius:9px; padding:12px 18px; background:var(--surface-2); }
.fa-example-line b { color:var(--brand); font-size:16px; }
.fa-example-line p { margin:5px 0; white-space:pre-wrap; }
.fa-boundary { font-size:17px; color:var(--ink-soft); }
.fa-sample { display:grid; grid-template-columns:1fr 1fr; gap:14px; margin:18px 0; }
.fa-sample>div { min-width:0; background:var(--surface-2); border:1px solid var(--line); border-radius:9px; padding:14px; }
.fa-sample b { display:block; font-size:15px; color:var(--brand); margin-bottom:8px; }
.fa-sample pre { font:17px/1.7 var(--font-code); white-space:pre-wrap; overflow-wrap:anywhere; margin:0; }
.fa-steps li { padding:5px 0; }
.fa-table-scroll { overflow:auto; border:1px solid var(--line-strong); border-radius:10px; margin:18px 0; }
.fa-table-scroll table { width:100%; border-collapse:collapse; font-size:17px; }
.fa-table-scroll th,.fa-table-scroll td { text-align:left; padding:14px 16px; border-bottom:1px solid var(--line); vertical-align:top; white-space:pre-wrap; min-width:100px; }
.fa-table-scroll th { color:var(--brand-ink); background:var(--brand-soft); }
.fa-table-scroll tr:last-child td { border:0; }
.fa-codeblock { position:relative; margin:18px 0; background:var(--code-bg); border-radius:12px; overflow:hidden; }
.fa-codeblock pre { padding:48px 22px 24px; margin:0; overflow:auto; color:var(--code-ink); font:17px/1.85 var(--font-code); tab-size:4; }
.fa-codeblock .code-copy { position:absolute; top:10px; right:12px; color:var(--code-ink); background:var(--code-bg-2); border:1px solid var(--code-line); }
.fa-code-notes { font-size:17px; }
.fa-lesson .code-box { margin:20px 0; min-width:0; --code-gutter:#a4bcb1; --tok-cmt:#a4bcb1; }
.fa-lesson .code-head { padding:12px 16px; }
.fa-lesson .code-lang,.fa-lesson .code-copy { font-size:15px; }
.fa-lesson .code-copy { color:var(--code-ink); border:1px solid #607a6f; }
.fa-lesson .code-copy.is-done { color:#a6e8c0; }
.fa-lesson .code-body { font:17px/1.85 var(--font-code); white-space:pre; overflow-x:auto; overflow-wrap:normal; padding:18px 14px; }
.fa-lesson .code-body .cl { white-space:pre; min-width:max-content; scroll-margin-top:110px; }
.fa-lesson .code-body .cl::before { opacity:1; }
.fa-lesson .code-body .cl.is-highlighted { background:#244c43; box-shadow:inset 3px 0 #ffd27c; }
.fa-code-notes button { color:var(--brand); font-weight:700; padding:4px 8px; border:1px solid var(--line-strong); border-radius:6px; }
.fa-prerequisite { font-size:17px; color:var(--ink-soft); border-top:1px solid var(--line); padding:16px 0; }
.fa-lesson .fa-pacing { margin-top:14px; border-top:1px solid var(--line-strong); }
.fa-workspace { border-top:2px solid var(--line-strong); margin-top:30px; padding-top:18px; scroll-margin-top:95px; }
.fa-task-picker { width:100%; padding:12px; color:var(--ink); background:var(--surface); border:1px solid var(--line-strong); border-radius:8px; font-size:17px; margin:10px 0 18px; }
.fa-editor-wrap { display:grid; grid-template-columns:52px minmax(0,1fr); background:var(--code-bg); border:1px solid var(--line-strong); border-radius:10px; overflow:hidden; }
.fa-editor-wrap .fa-editor { border:0; border-radius:0; margin:0; height:400px; resize:none; }
.fa-edit-lines { color:#a4bcb1; font:17px/1.8 var(--font-code); padding:20px 10px; text-align:right; white-space:pre; overflow:hidden; user-select:none; max-height:400px; }
.fa-lab { margin:24px 0; padding:22px; border:2px solid var(--brand); border-radius:14px; background:var(--surface-2); }
.fa-lab>pre { padding:16px; overflow:auto; border-radius:9px; background:var(--code-bg); color:var(--code-ink); font:16px/1.7 var(--font-code); }
.fa-lab-display { margin:20px 0; min-height:180px; }
.fa-variable { display:grid; grid-template-columns:1fr auto; align-items:center; gap:12px; padding:18px; background:var(--surface); border:2px solid var(--brand); border-radius:12px; }
.fa-variable>b { font-size:42px; color:var(--brand); }
.fa-variable>p { grid-column:1/-1; margin:0; }
.fa-tokens { display:flex; flex-wrap:wrap; gap:14px; margin:18px 0; }
.fa-tokens>span { display:grid; place-items:center; width:64px; height:64px; background:var(--surface); border:2px solid var(--line-strong); border-radius:12px; font:700 27px var(--font-code); }
.fa-tokens>span.is-written,.fa-tokens>span.is-new { border-color:var(--brand); background:var(--brand-soft); }
.fa-tokens>span.is-current,.fa-grid-output>.is-current { outline:3px solid var(--accent); outline-offset:3px; }
.fa-lab-values { display:flex; flex-wrap:wrap; gap:22px; }
.fa-lab-values b { font-size:30px; color:var(--brand); }
.fa-grid-output { display:grid; grid-template-columns:repeat(3,1fr); gap:12px; margin:18px 0; }
.fa-grid-output>div { display:flex; flex-direction:column; padding:12px; border:1px solid var(--line-strong); border-radius:9px; text-align:center; background:var(--surface); }
.fa-grid-output small { font-size:15px; color:var(--ink-soft); }
.fa-grid-output b { font-size:30px; color:var(--brand); }
.fa-grid-output .is-written { background:var(--brand-soft); }
.fa-flow { text-align:center; }.fa-flow>div { padding:12px; margin:8px auto; border:1px solid var(--line-strong); background:var(--surface); border-radius:8px; }.fa-flow .fa-decision { max-width:240px; border:2px solid var(--brand); border-radius:40%; }.fa-flow-branches { display:flex; justify-content:space-around; gap:20px; }.fa-flow-branches>div { padding:10px; }.fa-flow .is-current { background:var(--brand-soft); outline:2px solid var(--brand); }.fa-flow .is-muted { opacity:.5; }
.fa-code-notes b { color:var(--brand); margin-right:10px; }
.fa-task { margin:20px 0; padding:22px; border:1px solid var(--line-strong); border-radius:12px; }
.fa-lesson details { padding:10px 0; }
.fa-lesson summary,.fa-library summary { cursor:pointer; font-weight:700; color:var(--brand); font-size:17px; }
.fa-editor { width:100%; min-height:370px; padding:20px; resize:vertical; border:1px solid var(--line-strong); border-radius:10px; background:var(--code-bg); color:var(--code-ink); font:17px/1.8 var(--font-code); tab-size:4; white-space:pre; overflow:auto; }
.fa-editor-controls { display:flex; flex-wrap:wrap; gap:10px; margin:12px 0; }
.fa-input { width:100%; min-height:85px; display:block; padding:14px; border:1px solid var(--line-strong); border-radius:9px; background:var(--surface-2); color:var(--ink); font:17px/1.6 var(--font-code); }
.fa-output { padding:16px; min-height:65px; white-space:pre-wrap; overflow-wrap:anywhere; background:var(--surface-2); border:1px solid var(--line); border-radius:9px; font:17px/1.6 var(--font-code); }
.fa-quiz fieldset { min-width:0; padding:18px; border:1px solid var(--line-strong); border-radius:10px; margin:24px 0; }
.fa-quiz legend { font-weight:700; padding:0 8px; white-space:pre-wrap; }
.fa-option { display:flex; align-items:baseline; gap:9px; padding:10px 12px; margin:6px 0; border:1px solid var(--line); border-radius:8px; cursor:pointer; font-size:18px; white-space:pre-wrap; }
.fa-option.is-selected { border-color:var(--brand); background:var(--brand-soft); }
.fa-option input { accent-color:var(--brand); width:17px; height:17px; flex:none; }
.fa-feedback { padding:12px 16px; background:var(--warn-soft); border-radius:8px; color:var(--ink); font-size:17px; }
.fa-feedback.is-correct { background:var(--brand-soft); }
.fa-rail { position:sticky; top:88px; max-height:calc(100vh - 110px); overflow-y:auto; padding:18px 14px; border:1px solid var(--line-strong); border-radius:12px; background:var(--surface); }
.fa-rail b { display:block; font-size:16px; margin:0 0 16px; color:var(--brand); }
.fa-rail button,.fa-rail a { display:block; width:100%; padding:10px 6px; text-align:left; font-size:15px; color:var(--ink-soft); border-bottom:1px solid var(--line); line-height:1.5; }
.fa-rail button:hover,.fa-rail a:hover { color:var(--brand); background:var(--brand-soft); }
.fa-pager { display:flex; flex-wrap:wrap; justify-content:space-between; gap:16px; margin:28px 0; font-size:17px; }
.fa-pager a { max-width:100%; padding:12px 16px; border:1px solid var(--line-strong); border-radius:10px; background:var(--surface); }
.fa-library { margin:24px 0; padding:22px; border:1px solid var(--line-strong); border-radius:12px; background:var(--surface); }
.fa-library-grid { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:25px; }
.fa-library-grid a { display:block; padding:8px 0; font-size:17px; }
.fa-lesson a,.fa-map a:not(.btn):not(.fa-course-card) { color:var(--brand); }
.fa-lesson :focus-visible,.fa-map :focus-visible { outline:3px solid var(--brand); outline-offset:3px; }
@media(max-width:1200px) { .fa-layout { grid-template-columns:minmax(0,1fr); } .fa-rail { display:none; } .fa-course-grid { grid-template-columns:repeat(2,minmax(0,1fr)); } }
@media(max-width:700px) { .fa-section { padding:20px 16px; } .fa-course-grid,.fa-two,.fa-sample,.fa-library-grid { grid-template-columns:1fr; } .fa-map-header { flex-direction:column; align-items:flex-start; padding:22px; } .fa-lesson { font-size:18px; } .fa-lesson h2 { font-size:24px; } .fa-lesson-header>p.fa-goal { font-size:19px; line-height:1.75; } .fa-task { padding:16px; } }
@media print { .sidebar,.topbar,.fa-rail,.fa-editor-controls,.fa-stage-line { display:none!important; } .app-shell,.fa-layout { display:block; } .fa-section { break-inside:avoid; } }