/* Reading preferences are choices, not a claim that one layout suits everyone. */
.detail-content { --reading-size:16px; --reading-leading:1.75; --reading-width:65ch; }
:is(.portal-detail,.lesson-page) main.detail-content { padding:32px 4vw 100px!important; }
:is(.portal-detail,.lesson-page) .detail-toolbar { padding-inline:4vw; }
.detail-content :is(p,li,dd) { color:var(--ink); }
:is(.detail-content,.lesson-reader) :is(p,li,dd) { font-size:var(--reading-size); line-height:var(--reading-leading); max-width:var(--reading-width); text-align:left; }
:is(.detail-content,.lesson-reader) p { margin-block:1em; }
:is(.detail-content,.lesson-reader) li + li { margin-top:.65em; }
:is(.detail-content,.lesson-reader) :is(ul,ol) { padding-left:1.6em; margin-block:1.2em; }
:is(.detail-content,.lesson-reader) h2 { margin-top:2.3em; padding-top:.7em; border-top:1px solid var(--line); }
:is(.detail-content,.lesson-reader) h3 { margin-top:1.5em; }
.worked-steps > li { padding-left:.3em; }
.worked-steps code { white-space:nowrap; }
.study-recap { border-left:3px solid var(--ink); padding:4px 0 4px 20px; margin:28px 0; }
.study-recap h3 { margin-top:0; }
:is(.detail-content,.lesson-reader) dt { margin-top:1.1em; }
:is(.detail-content,.lesson-reader) dd { margin: .3em 0 1em; }
.lesson-reader .reader-grid { grid-template-columns:1fr; }
.lesson-reader #deep-notes-content > p { padding:16px 0; border-bottom:1px solid var(--line); }
/* Articles use a continuous reading surface, not nested cards. */
:is(.portal-detail .detail-content, main:not(.lesson-reader)) > section,
:is(.portal-detail .detail-content, main:not(.lesson-reader)) :is(.card,.callout,.reading-guide,.reading-route,.terms>div),
.lesson-reader :is(.example-box,.reader-grid-secondary>div) {
  background:transparent!important; box-shadow:none!important; border:0!important; border-radius:0!important; padding:12px 0!important;
}
.detail-content .terms { gap:16px; }
.detail-content .terms>div { border-bottom:1px solid var(--line)!important; }
.detail-content h1 { font:700 clamp(32px,4vw,48px)/1.15 Georgia,serif; letter-spacing:-.035em; margin:0 0 22px; }
.detail-content h2 { font:600 27px/1.3 Georgia,serif; }
.detail-content h3 { font:600 21px/1.4 Georgia,serif; }
.detail-content .lesson-opening { margin:24px 0 32px; padding:0 0 24px; border-bottom:1px solid var(--line); }
.detail-content .lesson-opening h2 { margin:0 0 12px; }
.detail-content .lesson-objectives { margin:20px 0; }
.detail-content .lesson-objectives dt { margin-top:16px; font:600 16px/1.65 system-ui,sans-serif; color:var(--ink); }
.detail-content .lesson-objectives dd { margin:4px 0 0; }
.detail-content .lesson-objectives dd p { margin:0; }
.detail-content .lesson-opening h3 { margin:20px 0 10px; }
.detail-content .lesson-opening ol { padding-left:24px; }
.detail-content .lesson-opening li { margin:6px 0; }
.detail-content h4,.lesson-reader h4 { font:600 18px/1.5 Georgia,serif; color:var(--ink); margin:1.5em 0 .75em; }
:is(.detail-content,.lesson-reader) :is(h1,h2,h3,h4) { overflow-wrap:anywhere; }
/* Visualization controls wrap within the article instead of widening the page. */
.detail-content .viz .controls { min-width:0; }
.detail-content .viz .controls label { flex-wrap:wrap; min-width:0; max-width:100%; }
.detail-content .viz .controls :is(select,input) { min-width:0; max-width:100%; }
.detail-content .viz .controls input[type="range"] { flex:1 1 100px; min-width:0; width:100px; }
.detail-content .viz .readout { overflow-wrap:anywhere; }
.detail-content .viz .readout > * { min-width:0; max-width:100%; }
.lesson-reader .reader-section { padding-top:20px; }
.detail-content .course-context { padding:12px 0; margin:20px 0; }
.detail-content .course-context p,.detail-content .course-context a { font-size:16px!important; line-height:1.65; }
.course-context summary { cursor:pointer; font:500 15px/1.6 system-ui,sans-serif; padding:6px 0; }
.detail-content :is(.lead,.reader-lead) { font-size:18px!important; line-height:1.65; color:var(--ink); margin:22px 0; }
.detail-content .eyebrow { font:700 13px/1.55 Inter,system-ui,sans-serif; color:var(--muted); letter-spacing:.06em; margin:0 0 12px; }
#inactive-topics { display:none!important; }
.nav-topic-group { margin-left:12px; border-left:1px solid var(--line); }
@media(max-width:850px) { :is(.portal-detail,.lesson-page) main.detail-content { padding:24px 18px 70px!important; } .lesson-page .detail-toolbar { margin-left:36px; height:72px; padding:0 18px; } }