/* A quiet, paper-like reading surface for long-form articles. */
body.reading-page { color-scheme:inherit; background:var(--bg); color:var(--ink); }

body.reading-page::before { display: none; }
body.reading-page .site-header {
  border-color: var(--line);
  background: var(--panel);
  backdrop-filter: blur(0.75rem);
}
body.reading-page .site-nav { color: var(--muted); }
body.reading-page .site-nav a:hover { color: var(--accent-strong); }
body.reading-page .nav-cta { border-color: var(--line); }
body.reading-page .eyebrow,
body.reading-page .turn-copy h3,
body.reading-page .eval-copy h3 { color: var(--accent-strong); }
body.reading-page :where(.turn-hero, .eval-hero, .jev-hero) {
  border-color: var(--line);
  background: var(--tint);
}
body.reading-page :where(.turn-lede, .eval-lede, .jev-hero > div > p:not(.micro-label), .turn-meta, .eval-meta, .jev-meta) { color: var(--muted); }
body.reading-page :where(.turn-shell, .eval-shell, .jev-shell) { width: min(calc(100% - 2rem), 43rem); }
body.reading-page :where(.turn-copy, .eval-copy, .jev-article, .prose) {
  color: var(--ink);
  font-family: Inter, ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
  font-size: 1.125rem;
  line-height: 1.78;
  text-wrap: pretty;
}
body.reading-page :where(.turn-copy, .eval-copy, .jev-article, .prose) p,
body.reading-page :where(.turn-copy, .eval-copy, .jev-article, .prose) li { max-width: 68ch; }
body.reading-page :where(.turn-copy, .eval-copy, .jev-article, .prose) > p:first-child {
  color: var(--ink);
  font-size: 1.125rem;
  line-height: 1.75;
}
body.reading-page :where(.turn-copy, .eval-copy, .jev-article, .prose) :where(h2, h3) {
  color: var(--ink);
  font-family: Inter, ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
  font-weight: 700;
  letter-spacing: -0.025em;
  text-wrap: balance;
}
body.reading-page :where(.turn-copy, .eval-copy, .jev-article) a,
body.reading-page .prose a { color: var(--accent); text-decoration: underline; text-underline-offset: 0.16em; }
body.reading-page :where(.turn-copy, .eval-copy, .jev-article) strong,
body.reading-page .prose strong { color: var(--ink); }
body.reading-page :where(.turn-callout, .eval-callout, .jev-callout, .card-gradient) {
  border-color: var(--line);
  background: var(--tint);
  color: var(--ink);
  box-shadow: none;
  backdrop-filter: none;
}
body.reading-page .turn-callout,
body.reading-page .eval-callout,
body.reading-page .jev-callout { border-inline-start-color: var(--accent); }
body.reading-page :where(.token-region, .comparison-wrap) { border-color: var(--line); background: var(--panel); }
body.reading-page :where(.token-table, .comparison-table) { color: var(--ink); }
body.reading-page :where(.token-table thead th, .comparison-table thead th) { background: var(--tint); color: var(--ink); }
body.reading-page :where(.token-table th, .token-table td, .comparison-table th, .comparison-table td) { border-color: var(--line); }
body.reading-page .turn-figure img { border-color: var(--line); box-shadow: 0 0.5rem 2rem rgb(0 0 0 / 7%); }
/* The older posts use Tailwind utilities; normalize their dark surfaces to the same paper theme. */
body.reading-page.gradient-bg { min-height: 100vh; background: var(--panel); color: var(--ink); }
body.reading-page.gradient-bg > nav.fixed { background: var(--panel); border-bottom: 1px solid var(--line); }
body.reading-page.gradient-bg > nav a { color: var(--ink); }
body.reading-page.gradient-bg > nav a:hover { color: var(--accent); }
body.reading-page.gradient-bg article > header h1 { background: none; color: var(--ink); -webkit-text-fill-color: currentColor; }
body.reading-page.gradient-bg .text-gray-100,
body.reading-page.gradient-bg .text-gray-300,
body.reading-page.gradient-bg .text-gray-400 { color: var(--muted); }
body.reading-page.gradient-bg .prose { max-width: 43rem; margin-inline: auto; }
body.reading-page.gradient-bg .prose h2 { margin-block: 3.4rem 1rem; color: var(--ink); font-size: clamp(1.65rem, 4vw, 2.2rem); line-height: 1.2; }
body.reading-page.gradient-bg .prose h3 { color: var(--ink); }
body.reading-page.gradient-bg .prose p { margin-block-end: 1.6rem; }
body.reading-page.gradient-bg .prose :where(ul, ol) { margin-block: 1rem 1.6rem; }
body.reading-page.gradient-bg .prose img { border-radius: 0.25rem; }
body.reading-page.gradient-bg .prose iframe { border: 0; }
body.reading-page.gradient-bg .prose code { color: var(--accent); }
@media (max-width: 42rem) {
  body.reading-page :where(.turn-copy, .eval-copy, .jev-article, .prose) { font-size: 1.125rem; line-height: 1.75; }
  body.reading-page :where(.turn-copy, .eval-copy, .jev-article, .prose) > p:first-child { font-size: 1.125rem; }
}
@media print {
  body.reading-page .site-header { background: var(--panel); }
}

/* Older articles share the same reading gutter and responsive media sizing. */
body.reading-page.gradient-bg > :is(main, article, div).pt-32 {
  padding-block: clamp(2rem, 6vw, 4rem) 4rem;
}
body.reading-page.gradient-bg #torque-clustering { padding: 0; border: 0; }
body.reading-page.gradient-bg article > header { max-width: 43rem; margin-inline: auto; }
body.reading-page.gradient-bg .prose iframe {
  display: block;
  width: 100%;
  height: auto;
  aspect-ratio: 16 / 9;
}
body.reading-page .prose pre { font-size: .875rem; }
@media (max-width: 42rem) {
  body.reading-page :is(.turn-hero, .eval-hero, .jev-hero) { padding-block: 2rem; }
  body.reading-page :is(.turn-hero, .eval-hero, .jev-hero) h1,
  body.reading-page.gradient-bg article > header h1 {
    font-size: clamp(2rem, 1rem + 5vw, 3rem);
    line-height: 1.12;
  }
  body.reading-page.gradient-bg article > header { margin-bottom: 2rem; }
  body.reading-page.gradient-bg .prose .grid { grid-template-columns: minmax(0, 1fr); }
  body.reading-page .jev-hero { padding-inline: 0; }
}