/* Reading layout only. Shared colours and type come from the design package. */
.article-page { max-width:850px; margin:auto; padding:clamp(2rem,4vw,3.625rem) clamp(1.125rem,4vw,2.25rem) clamp(3rem,6vw,6rem); }
.article-back { display:inline-block; margin-bottom:36px; font-size:17px; }
.article-header { padding-bottom:30px; margin-bottom:32px; border-bottom:1px solid var(--border-mid); }
.article-header h1 { font-size:clamp(2.125rem,1.45rem + 2.4vw,3.5rem); margin-bottom:24px; }
.article-meta { color:var(--ink-mute); font-size:16px; margin-bottom:18px; }
.article-meta time { white-space:normal; }
.article-lead { font-size:22px; line-height:1.6; color:var(--neel-deep); }
.article-body { font-size:19px; line-height:1.8; }
html[lang="hi"] .labs-site .article-body[data-hi] { display:block; }
.article-body p { margin-bottom:24px; }
.article-body h2 { font-size:31px; margin:44px 0 20px; line-height:1.3; letter-spacing:-.01em; }
.article-body h3 { font-size:25px; margin:32px 0 16px; line-height:1.35; }
.article-body ul,.article-body ol { padding-left:26px; margin:18px 0 28px; }
.article-body li { margin-bottom:12px; }
.article-body a { overflow-wrap:anywhere; }
.article-note { border-left:3px solid var(--terra); background:var(--deep); padding:24px 28px; margin:32px 0; }
.article-note p:last-child { margin-bottom:0; }
.article-table-wrap { overflow-x:auto; margin:28px 0; }
.article-body table { width:100%; border-collapse:collapse; font-size:17px; line-height:1.6; }
.article-body th,.article-body td { padding:16px; border:1px solid var(--border-mid); text-align:left; vertical-align:top; }
.article-body th { color:var(--neel-deep); background:var(--deep); font-weight:600; }
.article-body th[scope="row"] { min-width:110px; }
.article-body th a { overflow-wrap:normal; }
.article-body caption { text-align:left; margin-bottom:14px; color:var(--ink-mute); }
.article-sources { margin-top:48px; padding-top:8px; border-top:1px solid var(--border-mid); font-size:17px; }
.article-sources h2 { margin-top:26px; }
@media(max-width:40rem) {
  .article-back { margin-bottom:1.5rem; min-height:44px; }
  .article-header { margin-bottom:1.5rem; }
  .article-lead { font-size:1.25rem; }
  .article-body { font-size:1.125rem; }
  .article-body h2 { font-size:1.75rem; margin-top:2.25rem; }
  .article-note { padding:1.25rem; }
}
/* On a phone, each comparison reads as a labelled record with full-size text. */
@media(max-width:34rem) {
  .article-table-wrap { overflow:visible; }
  .article-body table,.article-body caption,.article-body tbody { display:block; width:100%; }
  .article-body thead { position:absolute; width:1px; height:1px; padding:0; overflow:hidden; clip-path:inset(50%); white-space:nowrap; }
  .article-body tbody tr { display:block; border:1px solid var(--border-mid); margin-bottom:1rem; }
  .article-body th[scope="row"] { display:block; width:auto; min-width:0; border:0; border-bottom:1px solid var(--border-mid); padding:.875rem 1rem; font-size:1.125rem; }
  .article-body td { display:grid; grid-template-columns:minmax(0,1fr); gap:.25rem; border:0; padding:.875rem 1rem; }
  .article-body td::before { content:attr(data-label); color:var(--ink-mute); font-size:1rem; }
  html[lang="hi"] .article-body td::before { content:attr(data-label-hi); }
  .article-body td+td { border-top:1px solid var(--border-mid); }
  .article-body th a { overflow-wrap:normal; }
}