/* Reading pages share the homepage's quiet hierarchy. Load after page styles.
   All rules require the non-home body hook; charts and tool internals keep their own layout. */
body.subpage-clean { background: var(--paper); font-family: var(--font-ui); }
body.subpage-clean :is(.article-top, .pdf-restored, .simple-path) { background: var(--paper); }
body.subpage-clean .article-top { max-width: 62rem; padding-top: var(--s5); }
body.subpage-clean .article-grid { display: block; }
body.subpage-clean .article-main { max-width: 48rem; margin-inline: auto; }
body.subpage-clean .article-top > .crumbs { max-width: 48rem; margin-inline: auto; }
body.subpage-clean .article-main > h1 { max-width: 25ch; margin-bottom: var(--s4); font-size: var(--fs-h1); line-height: 1.15; }
body.subpage-clean .standfirst { max-width: 59ch; margin-bottom: var(--s4); font: 400 var(--fs-ui-lg)/1.65 var(--font-ui); }
body.subpage-clean .crumbs { margin-bottom: var(--s4); font-size: var(--fs-small); }
body.subpage-clean :is(.path-pill, .own-badge, .topic-dot)::before { content: none; }
body.subpage-clean .path-pill { gap: 0; letter-spacing: normal; text-transform: none; }
body.subpage-clean .byline { gap: var(--s1) var(--s4); padding-block: var(--s3); margin-bottom: var(--s5); border-top: 0; font: 400 var(--fs-small)/1.6 var(--font-ui); }
body.subpage-clean .byline > span:first-child { flex-basis: 100%; }
body.subpage-clean .byline a { text-underline-offset: 3px; }
body.subpage-clean .article-hero { margin: 0 auto var(--s6); padding: 0; background: var(--paper); }
body.subpage-clean .article-hero picture { display: block; }
body.subpage-clean .article-hero img { display: block; width: 100%; max-height: 24rem; height: auto; object-fit: contain; object-position: center; background: var(--paper); }
body.subpage-clean .original-etoro .article-main { max-width: 52rem; }
body.subpage-clean .original-etoro-body .article-hero img { max-height: none; }

/* Body copy is compact enough to scan, with a comfortable 60–70 character measure.
   Direct editorial children are targeted so numeric readouts and chart text are untouched. */
body.subpage-clean :is(.prose, .article-content, .original-etoro-body) { max-width: 44rem; font-family: var(--font-ui); }
body.subpage-clean .original-etoro-body { max-width: 52rem; }
body.subpage-clean :is(.prose > p, .prose > ul > li, .prose > ol > li,
  .prose > section > p, .prose > section > ul > li, .prose > section > ol > li) {
  font-size: var(--fs-ui-lg); line-height: 1.7;
}
body.subpage-clean .prose > p { margin-bottom: var(--s5); }
body.subpage-clean :is(.prose > h2, .prose > section > h2) { margin-top: var(--s7); margin-bottom: var(--s4); font-size: var(--fs-h2); line-height: 1.25; }
body.subpage-clean :is(.prose > h3, .prose > section > h3) { margin-top: var(--s6); margin-bottom: var(--s3); font-size: var(--fs-h3); line-height: 1.35; }
body.subpage-clean .prose > :first-child { margin-top: 0; }
body.subpage-clean .article-main > .prose + .prose { margin-top: var(--s7); }
body.subpage-clean :is(.prose > figure, .prose > section > figure) { margin-block: var(--s6); }
body.subpage-clean .prose figure img { background: var(--paper); }
body.subpage-clean :is(.prose > blockquote, .prose .callout) { padding-inline: 0; border-inline: 0; background: transparent; border-radius: 0; box-shadow: none; }
body.subpage-clean :is(.article-main .lesson-summary, .article-main .comparison-note) { max-width: 65ch; font: 400 var(--fs-ui)/1.65 var(--font-ui); }
body.subpage-clean :is(.article-main .notice, .article-main .risk-note, .article-main .article-note, .article-main .warning) { padding-inline: 0; border-inline: 0; border-radius: 0; background: transparent; box-shadow: none; }
body.subpage-clean .key-points { border-top: var(--rule); }
body.subpage-clean .key-points li { padding-left: 0; }
body.subpage-clean .key-points li::before { content: none; }

/* The native disclosure sits in the reading flow when supplied by the template.
   The legacy rail remains readable after the article instead of taking a second column. */
body.subpage-clean .rail { display: block; max-width: 48rem; margin: var(--s6) auto 0; }
body.subpage-clean .rail-inner { position: static; display: block; max-height: none; overflow: visible; }
body.subpage-clean .rail-card { padding-top: var(--s3); border-top: var(--rule); }
body.subpage-clean .rail-card h2 { font: 700 var(--fs-small)/1.5 var(--font-ui); letter-spacing: normal; text-transform: none; }
body.subpage-clean :is(.reading-toc, .article-toc) { max-width: 48rem; margin-block: var(--s5) var(--s6); padding: 0; border-block: var(--rule); background: transparent; border-radius: 0; }
body.subpage-clean :is(.reading-toc, .article-toc) > summary { min-height: var(--tap); font: 700 var(--fs-small)/1.5 var(--font-ui); }
body.subpage-clean :is(.rail-toc, .reading-toc ul, .article-toc ul) { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); column-gap: var(--s5); list-style: none; margin: 0; padding: 0 0 var(--s3); }
body.subpage-clean :is(.rail-toc, .reading-toc, .article-toc) li { min-width: 0; padding: 0; margin: 0; }
body.subpage-clean :is(.rail-toc, .reading-toc, .article-toc) a { display: flex; align-items: center; min-height: var(--tap); padding: var(--s2) 0; border: 0; font: 400 var(--fs-small)/1.5 var(--font-ui); text-decoration: underline; text-decoration-color: var(--line-strong); text-underline-offset: 3px; overflow-wrap: anywhere; }
body.subpage-clean :is(.rail-toc, .reading-toc, .article-toc) a:hover { color: var(--brand-ink); text-decoration-color: var(--brand); }

/* Commercial options keep their original order and actions. */
body.subpage-clean .comparison-start { margin-block: 0 var(--s2); font-size: var(--fs-ui); }
body.subpage-clean .comparison-index { margin-bottom: var(--s5); }
body.subpage-clean .pick { margin-block: var(--s6); padding-top: var(--s5); }
body.subpage-clean .pick-head h3 { font-size: var(--fs-h2); line-height: 1.25; }
body.subpage-clean .pick .pick-for { font-weight: 400; }
body.subpage-clean .pick > p { font-size: var(--fs-ui-lg); line-height: 1.65; }
body.subpage-clean .pick-facts { font-size: var(--fs-ui); line-height: 1.6; }
body.subpage-clean :is(.pick-actions, .practice-actions) { gap: var(--s3) var(--s4); }
body.subpage-clean :is(.pick-actions .btn, .practice-actions .btn) { border-radius: var(--r-md); }
body.subpage-clean :is(.table-wrap, .article-content table) { max-width: 100%; }
body.subpage-clean .table-wrap { border-top: var(--rule); }
body.subpage-clean .original-etoro-table { max-width: 100%; }
body.subpage-clean .original-etoro-table .original-etoro-trader { min-width: 0; }
body.subpage-clean :is(.pick-details, .comparison-index, .sources, .article-source-list, .pdf-reader-notes) > summary { min-height: var(--tap); font-family: var(--font-ui); }

/* One contained exercise. No changes to the layouts inside its stage. */
body.subpage-clean :is(.article-main, .path-activity) .aha { margin: var(--s7) 0; padding: var(--s6) 0; border: 0; border-block: var(--rule); background: var(--paper); }
body.subpage-clean .article-main .aha-inner { max-width: none; }
body.subpage-clean .article-main .aha-head { max-width: 42rem; }
body.subpage-clean .article-main .aha-badge { padding: 0; background: transparent; color: var(--ink-2); letter-spacing: normal; text-transform: none; }
body.subpage-clean .article-main .aha-bulb { display: none; }
body.subpage-clean .article-main .aha-title { font-size: var(--fs-h2); }
body.subpage-clean .article-main .aha-task { font: 400 var(--fs-ui)/1.6 var(--font-ui); }
body.subpage-clean .article-main .aha-stage { border: var(--rule); border-radius: var(--r-md); }
body.subpage-clean :is(.faq-card, .faq-choice) { border-radius: var(--r-md); }
body.subpage-clean .faq-card-question { font-size: var(--fs-h3); }
body.subpage-clean :is(.faq-choice, .faq-card-feedback) { font-size: var(--fs-ui); line-height: 1.6; }
body.subpage-clean :is(.faq-choice, .faq-next, .faq-read, .article-practice button, .chapter-activity button) { min-height: var(--tap); }
body.subpage-clean .practice-card { gap: var(--s3); margin-block: var(--s7); padding-block: var(--s5); border-top: var(--rule); }
body.subpage-clean .practice-card h2 { font-size: var(--fs-h3); line-height: 1.35; }
body.subpage-clean .practice-card .disclosure { font-size: var(--fs-small); }
body.subpage-clean .next-up { gap: var(--s4); margin-block: var(--s6); }
body.subpage-clean .next-card { gap: var(--s2); padding: var(--s5) 0; border-top: var(--rule); border-bottom: var(--rule); background: var(--paper); color: var(--ink); }
body.subpage-clean .next-card span { font-size: var(--fs-small); letter-spacing: normal; text-transform: none; color: var(--ink-2); }
body.subpage-clean .next-card strong { font: 700 var(--fs-h3)/1.35 var(--font-ui); }
body.subpage-clean .next-card:hover { background: var(--paper); }
body.subpage-clean .next-card:hover strong { color: var(--brand-ink); text-decoration: underline; text-underline-offset: 4px; }
body.subpage-clean .choose-next { margin-block: var(--s6); border-top: var(--rule); }
body.subpage-clean .choose-next h2 { font-size: var(--fs-h3); }
body.subpage-clean .choose-next li a { display: inline-flex; align-items: center; min-height: var(--tap); font: 700 var(--fs-ui-lg)/1.4 var(--font-ui); }
body.subpage-clean .related { margin-top: var(--s7); padding-block: var(--s6); border-top: var(--rule); }
body.subpage-clean .related > .wrap { max-width: calc(48rem + 2 * var(--gutter)); }
body.subpage-clean .related h2 { font-size: var(--fs-h2); margin-bottom: var(--s5); }
body.subpage-clean .related .card-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: var(--s6); }
body.subpage-clean .related .card-title { font: 700 var(--fs-ui-lg)/1.4 var(--font-ui); }
body.subpage-clean .related .card-text { font-size: var(--fs-ui); }

/* Original-book landing pages: cover, useful description, download, then depth. */
body.subpage-clean .pdf-restored { padding-top: var(--s5); }
body.subpage-clean .pdf-restored .breadcrumb { max-width: 60rem; margin: 0 auto var(--s5); align-items: center; }
body.subpage-clean .pdf-restored .breadcrumb a { display: inline-flex; align-items: center; min-height: var(--tap); }
body.subpage-clean .pdf-restored .article-lead-grid { max-width: 60rem; grid-template-columns: minmax(0, .85fr) minmax(0, 1.15fr); gap: var(--s5) clamp(1.5rem, 4vw, 3rem); align-items: start; }
body.subpage-clean .pdf-restored .article-lead-copy { grid-column: 2; grid-row: 1; }
body.subpage-clean .pdf-restored h1 { margin-bottom: var(--s4); font-family: var(--font-head); font-size: clamp(1.875rem, 1.45rem + 1.45vw, 2.5rem); line-height: 1.15; text-wrap: balance; }
body.subpage-clean .pdf-restored .article-deck { max-width: 45ch; margin: 0; font: 400 var(--fs-ui-lg)/1.6 var(--font-ui); }
body.subpage-clean .pdf-restored .pdf-book-cover { grid-column: 1; grid-row: 1; align-self: start; width: 100%; max-width: 26rem; margin: 0; }
body.subpage-clean .pdf-restored .pdf-book-cover img { height: auto; max-height: none; }
body.subpage-clean .pdf-restored .pdf-book-cover figcaption { max-width: 36ch; margin-top: var(--s3); font-size: var(--fs-small); line-height: 1.5; }
/* Explicit flex gaps keep the secondary action separate when it wraps. */
body.subpage-clean .pdf-restored .pdf-download { display: flex; flex-wrap: wrap; align-items: center; gap: var(--s2) var(--s4); margin-top: var(--s5); }
body.subpage-clean .pdf-restored .pdf-download > p { flex-basis: 100%; margin: 0 0 var(--s1); }
body.subpage-clean .pdf-restored .pdf-download .button { min-height: 48px; max-width: 100%; border-radius: var(--r-md); }
body.subpage-clean .pdf-restored .pdf-note-link { display: inline-flex; width: fit-content; max-width: 100%; align-items: center; min-height: var(--tap); padding-block: var(--s2); margin: 0; }
/* Metadata belongs to the copy column, immediately after the actions. */
body.subpage-clean .pdf-restored .article-details { display: flex; flex-wrap: wrap; align-items: baseline; gap: var(--s1) var(--s4); grid-column: auto; grid-row: auto; margin: var(--s5) 0 0; padding-top: var(--s3); font-size: var(--fs-small); }
body.subpage-clean .pdf-restored .article-details .meta { margin: 0; }
body.subpage-clean .pdf-restored .article-byline { flex-basis: 100%; margin: 0; font-size: var(--fs-small); line-height: 1.6; }
body.subpage-clean .pdf-restored .pdf-reading { margin-top: var(--s7); }
body.subpage-clean .pdf-restored .article-content { max-width: 44rem; }
body.subpage-clean .pdf-restored .article-content :is(h2, h3) { font-family: var(--font-head); }

/* The three paths retain an obvious start and a compact, ordered lesson map. */
body.subpage-clean .simple-path .wrap { max-width: 50rem; }
body.subpage-clean .simple-path .path-hero { padding-block: var(--s5) var(--s6); }
body.subpage-clean .simple-path h1 { font-family: var(--font-head); font-size: var(--fs-h1); line-height: 1.15; max-width: 23ch; }
body.subpage-clean .simple-path .path-hero .lead { max-width: 60ch; font-size: var(--fs-ui-lg); line-height: 1.65; }
body.subpage-clean .simple-path .path-cta { margin-top: var(--s5); }
body.subpage-clean .simple-path .btn--path { border-radius: var(--r-md); }
body.subpage-clean .simple-path .path-save-note { margin-top: var(--s5); }
body.subpage-clean .simple-path .unit { margin-top: var(--s6); }
body.subpage-clean .simple-path .unit h2 { font-size: var(--fs-h3); line-height: 1.35; }
body.subpage-clean .simple-path .stop { margin-left: 0; }
body.subpage-clean .simple-path .stop a { padding-block: var(--s4); min-height: var(--tap); }
body.subpage-clean .simple-path .stop-title { font-size: var(--fs-ui-lg); line-height: 1.4; }
body.subpage-clean .simple-path .stop-meta { max-width: 60ch; line-height: 1.5; }
body.subpage-clean .simple-path .stop-reading { margin-top: var(--s1); }
body.subpage-clean .simple-path .path-resources { margin-top: var(--s6); padding-top: var(--s6); }
body.subpage-clean .simple-path .path-resources li a { min-height: var(--tap); }
body.subpage-clean .simple-path .path-library a { min-height: var(--tap); }

@media (max-width: 44rem) {
  body.subpage-clean .article-top { padding-top: var(--s4); }
  body.subpage-clean .article-main > h1 { max-width: none; }
  body.subpage-clean .article-hero img { max-height: 19rem; }
  body.subpage-clean :is(.rail-toc, .reading-toc ul, .article-toc ul) { grid-template-columns: minmax(0, 1fr); }
  body.subpage-clean .article-main .aha { padding-block: var(--s5); }
  body.subpage-clean .related .card-grid { gap: var(--s5); }
  body.subpage-clean .pdf-restored .article-lead-grid { grid-template-columns: minmax(0, 1fr); gap: var(--s5); }
  body.subpage-clean .pdf-restored .pdf-book-cover { grid-column: 1; grid-row: 1; justify-self: center; max-width: 20rem; }
  body.subpage-clean .pdf-restored .article-lead-copy { grid-column: 1; grid-row: 2; }
  body.subpage-clean .pdf-restored .article-details { width: 100%; }
  body.subpage-clean .pdf-restored .pdf-download .button { width: 100%; }
  body.subpage-clean .simple-path .path-hero .lead { font-size: var(--fs-ui-lg); }
}
@media (max-width: 28rem) {
  body.subpage-clean .related .card-grid { grid-template-columns: minmax(0, 1fr); }
  body.subpage-clean .byline { gap: var(--s1) var(--s3); }
  body.subpage-clean :is(.pick-actions, .practice-actions) .btn { width: 100%; }
  body.subpage-clean .original-etoro-body .original-etoro-table :is(td, tbody th) { grid-template-columns: minmax(6rem, .8fr) minmax(0, 1.2fr); }
}
@media (prefers-reduced-motion: reduce) {
  body.subpage-clean .aha-reveal[data-state="open"] { animation: none; }
  body.subpage-clean :is(.btn, .next-card, .lesson-done):active { transform: none; }
}
@media print {
  body.subpage-clean :is(.article-main, .prose, .article-content, .original-etoro-body) { max-width: none; }
  body.subpage-clean .pdf-restored .article-lead-grid { display: block; }
  body.subpage-clean .pdf-restored .pdf-book-cover img { max-height: 12rem; }
}

/* Owner, 22 Oct 2026: articles, book pages, About and the glossary use the same page width as the category pages,
   starting under the logo. Text keeps its comfortable line length; on wide screens the contents list sits in a
   sticky column on the right. Phones and tablets keep one column with the fold-out contents list. */
body.subpage-clean .article-top { max-width: var(--page); }
body.subpage-clean .article-top > .crumbs { max-width: none; margin-inline: 0; }
body.subpage-clean :is(.article-main, .original-etoro .article-main) { max-width: none; margin-inline: 0; }
body.subpage-clean :is(.reading-toc, .article-toc) { max-width: none; }
body.subpage-clean .related > .wrap { max-width: var(--page); }
body.subpage-clean .related .card-grid { grid-template-columns: repeat(auto-fill, minmax(min(100%, 20rem), 1fr)); }
body.subpage-clean :is(.clean-about, .clean-glossary) { max-width: var(--page); }
body.subpage-clean .clean-glossary .gloss-list dd { max-width: 70ch; }
body.subpage-clean .pdf-restored :is(.breadcrumb, .article-lead-grid) { max-width: none; margin-inline: 0; }
body.subpage-clean .pdf-restored .article-content { margin-inline: 0; }
body.subpage-clean .article-side { display: none; }
@media (min-width: 70rem) {
  body.subpage-clean .article-grid.has-side { display: grid; grid-template-columns: minmax(0, 1fr) 16rem; gap: var(--s8); align-items: start; }
  body.subpage-clean .article-grid.has-side .reading-toc { display: none; }
  body.subpage-clean .article-side { display: block; position: sticky; top: calc(var(--header-h) + var(--s5)); max-height: calc(100vh - var(--header-h) - var(--s7)); overflow-y: auto; overscroll-behavior: contain; scrollbar-width: thin; padding-top: var(--s3); border-top: var(--rule); }
  body.subpage-clean .article-side .side-title { margin: 0 0 var(--s2); font: 700 var(--fs-small)/1.5 var(--font-ui); color: var(--ink); }
  body.subpage-clean .article-side .rail-toc { display: block; margin: 0; padding: 0; list-style: none; }
  body.subpage-clean .article-side .rail-toc a { display: flex; align-items: center; min-height: var(--tap); padding: 6px var(--s2) 6px var(--s3); border-left: 2px solid var(--line, #e5e2da); color: var(--ink-2); text-decoration: none; font: 400 var(--fs-small)/1.4 var(--font-ui); }
  body.subpage-clean .article-side .rail-toc a:hover { color: var(--ink); text-decoration: underline; text-underline-offset: 3px; }
  body.subpage-clean .article-side .rail-toc a[aria-current="true"] { color: var(--ink); font-weight: 700; border-left-color: var(--brand); }
}