/* Presentation tokens belong to sections, independent of syntax/quiz state colours. */
[data-palette]{--section-ink:#34668e;--section-soft:#edf5fc;--section-edge:#cbddea;--section-wash:#f1f6fa}
[data-palette=teal]{--section-ink:#26736c;--section-soft:#e9f6f2;--section-edge:#c4e1d9;--section-wash:#eff8f4}
[data-palette=amber]{--section-ink:#8b621a;--section-soft:#fcf4e5;--section-edge:#ead9b5;--section-wash:#faf6ed}
[data-palette=gold]{--section-ink:#7b701f;--section-soft:#f8f6df;--section-edge:#e1ddb0;--section-wash:#f8f7ed}
[data-palette=violet]{--section-ink:#78549d;--section-soft:#f3edfa;--section-edge:#ddcfec;--section-wash:#f6f2fa}
[data-palette=rose]{--section-ink:#a05370;--section-soft:#fbedf2;--section-edge:#edcfda;--section-wash:#faf2f5}
[data-palette=green]{--section-ink:#3c764e;--section-soft:#edf6ec;--section-edge:#cde1cc;--section-wash:#f2f7ef}
:root[data-theme=dark] [data-palette]{--section-ink:#a4cbee;--section-soft:#20313e;--section-edge:#354d60;--section-wash:#17232a}
:root[data-theme=dark] [data-palette=teal]{--section-ink:#93d7ca;--section-soft:#203931;--section-edge:#345c50;--section-wash:#172821}
:root[data-theme=dark] [data-palette=amber]{--section-ink:#e6c58d;--section-soft:#3b3323;--section-edge:#5b4e32;--section-wash:#28241b}
:root[data-theme=dark] [data-palette=gold]{--section-ink:#d8ce8d;--section-soft:#373521;--section-edge:#565330;--section-wash:#26261a}
:root[data-theme=dark] [data-palette=violet]{--section-ink:#d0b0f1;--section-soft:#33293e;--section-edge:#51415f;--section-wash:#241e2c}
:root[data-theme=dark] [data-palette=rose]{--section-ink:#e9b1c6;--section-soft:#3e2831;--section-edge:#61424e;--section-wash:#2a1e24}
:root[data-theme=dark] [data-palette=green]{--section-ink:#b3d9a8;--section-soft:#2c3927;--section-edge:#485c3e;--section-wash:#20271d}
.lesson-workspace[data-palette]{background:var(--lesson-surface);min-height:calc(100dvh - var(--header-height))}
.lesson-section[data-palette]>h2{color:var(--section-ink)}
.lesson-section[data-layout=orientation]>h2{font-size:var(--text-heading);line-height:1.2;margin-bottom:28px}
.lesson-goals{list-style:none;display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:16px;padding:0;margin:0}
.lesson-goals li{display:flex;align-items:flex-start;gap:14px;background:var(--panel);border:1px solid var(--section-edge);border-radius:16px;padding:24px;min-width:0}
.lesson-goals li:first-child{grid-column:1/-1;padding:28px;border-radius:18px;box-shadow:0 4px 16px #00000004}
.goal-number{display:grid;place-items:center;flex:0 0 32px;width:32px;height:32px;border-radius:50%;background:var(--section-soft);color:var(--section-ink);font-size:var(--text-label);font-weight:700}
.lesson-goals li:first-child .goal-number{background:var(--section-ink);color:var(--panel)}
.lesson-goals h3{font-size:var(--text-subheading);margin:0 0 10px;color:var(--section-ink)}.lesson-goals p{font-size:var(--text-body);line-height:var(--leading-body);margin:0;color:var(--muted)}
.lesson-goals li:first-child p{font-size:var(--text-body);line-height:var(--leading-body);font-weight:550;color:var(--text);max-width:55ch}
.lesson-section.short-reading[data-layout=fact]{max-width:none}
.short-reading[data-layout=fact]>h2{font-size:var(--text-heading);line-height:1.25;margin-bottom:26px;max-width:28ch}
.short-reading[data-layout=fact]>h2::before{content:'';display:block;width:30px;height:5px;background:var(--section-ink);border-radius:5px;margin-bottom:20px}
.short-reading[data-layout=fact] .section-prose{font-size:var(--text-body);line-height:var(--leading-body);max-width:64ch}
.short-reading[data-layout=fact] .section-prose>p{margin-bottom:22px}
.short-reading[data-layout=fact] .section-prose>p:last-child{margin-bottom:0}
.short-reading[data-layout=fact] .reading-key-fact{font-size:var(--text-subheading);line-height:1.15;font-weight:750;margin-bottom:18px}
.short-reading[data-layout=fact] .section-prose strong{color:var(--section-ink)}
.short-reading[data-layout=fact] .section-prose ul>li{padding-top:14px;padding-bottom:14px;border-color:var(--section-edge)}
.short-reading[data-layout=fact] .section-prose ul>li::before{top:29px}
.short-reading[data-layout=fact] .reading-timeline{gap:18px;margin-top:30px}
.short-reading[data-layout=fact] .reading-timeline li{background:var(--section-soft);border:1px solid var(--section-edge);border-radius:14px;padding:22px 20px;gap:8px}
.short-reading[data-layout=fact] .reading-timeline li::before{top:0;left:20px;transform:translateY(-50%)}
.short-reading[data-layout=fact] .reading-timeline strong{font-size:var(--text-subheading);line-height:1.3}
.short-reading[data-layout=fact] .reading-timeline span{font-size:var(--text-body);line-height:var(--leading-body)}
.lesson-section[data-layout=fact] .reading-key-fact{color:var(--section-ink)}
.lesson-section[data-layout=fact] .reading-timeline li::before,.lesson-section[data-layout=fact] .section-prose ul>li::before{background:var(--section-ink)}
.lesson-section[data-layout=reflection]{--caution-ink:#795313;--caution-soft:#fbf3e2;--caution-edge:#ebdbb9}
.lesson-section[data-layout=reflection]>h2{font-size:var(--text-heading);margin-bottom:16px}
.lesson-section[data-layout=reflection]>.section-prose{font-size:var(--text-body);color:var(--muted);max-width:62ch}
:root[data-theme=dark] .lesson-section[data-layout=reflection]{--caution-ink:#e6c58d;--caution-soft:#3b3323;--caution-edge:#5b4e32}
.learning-visual{margin:28px 0 0;border:1px solid var(--section-edge);border-radius:16px;padding:22px;background:var(--section-soft);min-width:0}
.learning-visual .visual-image{display:block;width:100%;height:auto;border:1px solid var(--section-edge);border-radius:12px;margin:0 0 16px}
.visual-heading{display:flex;align-items:center;gap:10px;margin-bottom:16px}.visual-heading h3{font-size:var(--text-subheading);margin:0;color:var(--section-ink)}.visual-symbol{display:grid;place-items:center;width:28px;height:28px;background:var(--panel);border-radius:8px;color:var(--section-ink)}
.interactive-course pre.visual-sketch{font-size:var(--text-code);line-height:1.8;padding:22px;margin:0 0 16px;white-space:pre;overflow:auto;color:#d8e8df;border:1px solid #35483c;border-radius:12px;text-align:left}
.learning-visual figcaption{font-size:var(--text-body);line-height:var(--leading-body);color:var(--text);max-width:70ch}
.visual-brief{border-top:1px solid var(--section-edge);padding-top:12px;margin-top:16px;color:var(--muted);font-size:var(--text-label)}.visual-brief dl{margin-bottom:0}.visual-brief dt{font-weight:650;margin-top:12px}.visual-brief dd{margin:6px 0 0;line-height:1.75;overflow-wrap:anywhere}.visual-prompt{white-space:pre-wrap;font-family:ui-monospace,SFMono-Regular,Consolas,monospace}
.recap-comparison{display:grid;grid-template-columns:minmax(0,1.3fr) minmax(0,1fr);gap:18px;margin:28px 0}.recap-comparison article{padding:26px;background:var(--caution-soft,var(--panel));border:1px solid var(--caution-edge,var(--section-edge));border-radius:16px;min-width:0}.recap-comparison article:first-child{background:var(--panel);border-color:var(--section-edge)}.recap-comparison h3{font-size:var(--text-subheading);margin:0 0 16px;color:var(--caution-ink,var(--section-ink))}.recap-comparison article:first-child h3{color:var(--section-ink)}.recap-comparison p{font-size:var(--text-body);margin:0;line-height:var(--leading-body)}.recap-comparison article:first-child p{font-size:var(--text-body);line-height:var(--leading-body);font-weight:550}.comparison-note{display:block;font-size:var(--text-label);font-weight:650;color:var(--caution-ink,var(--muted));border-top:1px solid var(--caution-edge,var(--section-edge));padding-top:14px;margin-top:18px}
.lesson-section[data-layout=reflection] .recap-status{font-size:var(--text-body);line-height:var(--leading-body);border-top:1px solid var(--section-edge);padding-top:20px;margin:0 0 18px}
.lesson-section[data-layout=reflection] .unfinished-quizzes{display:grid;gap:8px;list-style:none;padding:0;margin:18px 0}
.lesson-section[data-layout=reflection] .unfinished-quizzes a{display:block;background:var(--panel);border:1px solid var(--section-edge);border-radius:10px;padding:12px 14px;font-size:var(--text-label);font-weight:550;line-height:1.7;text-decoration:none}
.lesson-section[data-layout=reflection] .unfinished-quizzes a:hover{text-decoration:underline;border-color:var(--section-ink)}
.lesson-section[data-layout=reflection] .unfinished-quizzes:empty{display:none}
.lesson-section[data-layout=reflection] .next-lesson{display:inline-flex;align-items:center;justify-content:center;min-height:48px;font-size:var(--text-label);padding:12px 20px;max-width:100%;line-height:1.6;text-align:center}
@media(max-width:900px){.lesson-goals,.recap-comparison{grid-template-columns:1fr}.lesson-goals li:first-child{grid-column:auto}}
@media(max-width:650px){.learning-visual{padding:16px;margin-top:24px}.interactive-course pre.visual-sketch{font-size:var(--text-code);padding:16px}.visual-heading h3{font-size:var(--text-subheading)}.lesson-goals li,.lesson-goals li:first-child,.recap-comparison article{padding:20px}.short-reading[data-layout=fact] .section-prose{font-size:var(--text-body)}.short-reading[data-layout=fact] .reading-timeline{grid-template-columns:1fr;gap:16px}.short-reading[data-layout=fact] .reading-timeline li{padding:18px}.lesson-section[data-layout=reflection] .next-lesson{width:100%}.lesson-goals li{gap:12px}.lesson-goals li:first-child p{font-size:var(--text-body)}}

.lesson-section>h2+.learning-visual{margin-top:0;margin-bottom:28px}
.section-prose .recap-links { margin: 28px 0; }
.section-prose .recap-links h3 { margin: 0 0 14px; }
.section-prose .recap-links ul { display: grid; gap: 10px; list-style: none; padding: 0; margin: 0; }
.section-prose .recap-links li { padding: 0; margin: 0; border: 0; background: none; }
.section-prose .recap-links li::before { display: none; }
.section-prose .recap-links a { display: flex; align-items: center; justify-content: space-between; gap: 16px; min-height: 48px; padding: 12px 16px; border: 1px solid var(--border); border-radius: 12px; background: var(--panel); text-decoration: none; }
.section-prose .recap-links a:hover { background: var(--accent-soft); text-decoration: underline; }
.section-prose .recap-links a:focus-visible { outline: 3px solid var(--focus); outline-offset: 3px; }
.python-intro-flow { margin: 24px 0; }
.python-comment-map { display: grid; gap: 18px; }
.python-comment-row, .python-comment-result { min-width: 0; border: 1px solid var(--border); border-radius: 16px; padding: 18px; border-inline-start: 4px solid #8b5cf6; }
.python-comment-instruction { border-inline-start-color: #0d9488; }
.python-comment-result { border-inline-start-color: #d97706; }
.python-comment-label { display: block; font-weight: 700; margin-bottom: 12px; }
.python-comment-row p { margin-bottom: 0; }
.python-comment-map pre { margin: 12px 0; white-space: pre-wrap; overflow-wrap: anywhere; }
.python-intro-panel { padding: 16px; border: 1px solid var(--border); border-radius: 12px; }
.python-intro-panel h4 { margin: 0 0 14px; }
.python-intro-panel pre { margin: 0; }
.python-intro-panel pre, .python-intro-panel pre code { white-space: pre-wrap; overflow-wrap: anywhere; }
.python-intro-connector { margin: 16px 0; color: var(--muted); }
.python-runtime-block { --runtime-accent: #536ec2; padding: 20px; border: 1px solid var(--border); border-top: 3px solid var(--runtime-accent); border-radius: 14px; }
.python-runtime-block[data-runtime-role="interpreter"] { --runtime-accent: #9567bc; }
.python-runtime-block[data-runtime-role="output"] { --runtime-accent: #27815b; }
.python-runtime-heading { display: flex; align-items: center; gap: 14px; }
.python-runtime-icon { display: grid; place-items: center; flex: 0 0 44px; width: 44px; height: 44px; color: var(--runtime-accent); border: 1px solid var(--border); border-radius: 12px; }
.python-runtime-icon svg { width: 26px; height: 26px; }
.python-runtime-heading h4 { margin: 3px 0 0; }
.python-runtime-label { color: var(--muted); font-size: .875rem; }
.python-runtime-connector { display: flex; justify-content: center; align-items: center; gap: 12px; margin: 18px 0; color: var(--muted); }
.python-runtime-connector > span { font-size: 1.5rem; }
.python-runtime-state { display: flex; flex-wrap: wrap; align-items: center; gap: 12px; padding: 14px; border: 1px dashed var(--border); border-radius: 10px; }
.python-runtime-block pre, .python-runtime-block pre code { white-space: pre-wrap; overflow-wrap: anywhere; }
.python-runtime-block > :last-child { margin-bottom: 0; }
:root[data-theme=dark] .python-runtime-block { --runtime-accent: #99b4ef; }
:root[data-theme=dark] .python-runtime-block[data-runtime-role="interpreter"] { --runtime-accent: #c6a0e8; }
:root[data-theme=dark] .python-runtime-block[data-runtime-role="output"] { --runtime-accent: #7ad7aa; }
@media (max-width: 650px) { .python-runtime-block { padding: 14px; } }