:root {
    --bg: #f3eee7;
    --panel: #ffffff;
    --panel-soft: #f8f4ee;
    --panel-tint: #efe7dc;
    --line: rgba(25, 24, 28, 0.11);
    --line-strong: rgba(25, 24, 28, 0.2);
    --text: #19181c;
    --text-dim: #5e5851;
    --accent: #285a63;
    --accent-soft: rgba(40, 90, 99, 0.08);
    --gold: #8a6830;
    --bg-ink: #13161d;
    --max: 1220px;
    --radius: 26px;
    --shadow: 0 28px 80px rgba(18, 15, 11, 0.08);
    --font-display: "Source Serif 4", Georgia, serif;
    --font-body: "IBM Plex Sans", "Helvetica Neue", Arial, sans-serif;
  }
  * { box-sizing: border-box; }
  html { scroll-behavior: smooth; }
  body {
    margin: 0;
    background:
      radial-gradient(circle at top right, rgba(138, 104, 48, 0.08), transparent 24%),
      linear-gradient(180deg, #f1ebe3 0%, #f8f4ed 38%, #f4efe7 100%);
    color: var(--text);
    font-family: var(--font-body);
  }
  body::before {
    content: "";
    position: fixed;
    inset: 0;
    pointer-events: none;
    background:
      linear-gradient(rgba(25, 24, 28, 0.025) 1px, transparent 1px),
      linear-gradient(90deg, rgba(25, 24, 28, 0.02) 1px, transparent 1px);
    background-size: 34px 34px;
    mask-image: radial-gradient(circle at center, black 36%, transparent 88%);
    opacity: 0.3;
  }
  a { color: inherit; text-decoration: none; }
  .shell { width: min(calc(100% - 2rem), var(--max)); margin: 0 auto; }
  .topbar {
    position: sticky;
    top: 0;
    z-index: 20;
    background: rgba(248, 244, 237, 0.92);
    backdrop-filter: blur(22px);
    border-bottom: 1px solid rgba(25, 24, 28, 0.08);
    box-shadow: 0 10px 24px rgba(18, 15, 11, 0.03);
  }
  .topbar__inner { width: min(calc(100% - 2rem), var(--max)); margin: 0 auto; padding: 1rem 0; display: flex; justify-content: space-between; gap: 1rem; align-items: center; flex-wrap: wrap; }
  .brand { display: flex; align-items: center; gap: 0.8rem; }
  .brand__mark { width: 2.6rem; height: 2.6rem; border-radius: 999px; display: grid; place-items: center; background: linear-gradient(135deg, #173039 0%, #285a63 100%); color: #f7f2ea; font-family: var(--font-display); font-weight: 700; box-shadow: 0 14px 30px rgba(23, 48, 57, 0.18); }
  .brand__eyebrow { display: block; font-size: 0.72rem; color: var(--gold); letter-spacing: 0.18em; text-transform: uppercase; }
  .brand__title { display: block; font-size: 1rem; font-weight: 700; color: var(--text); letter-spacing: -0.01em; }
  .topbar__links { display: flex; gap: 1rem; flex-wrap: wrap; }
  .topbar__links a { color: var(--text-dim); font-size: 0.92rem; letter-spacing: 0.02em; }
  .topbar__links a:hover { color: var(--accent); }
  .hero { padding: 4.8rem 0 2.9rem; }
  .hero__grid { display: grid; grid-template-columns: minmax(0, 1.2fr) minmax(320px, 0.8fr); gap: 1.4rem; }
  .hero__panel, .hero__aside, .section-card, .paper-card, .report-card, .signal-card { background: var(--panel); border: 1px solid var(--line); border-radius: var(--radius); box-shadow: var(--shadow); }
  .hero__panel {
    padding: 2.4rem;
    background:
      radial-gradient(circle at top right, rgba(138, 104, 48, 0.08), transparent 26%),
      linear-gradient(180deg, rgba(255,255,255,0.95), rgba(255,255,255,0.88));
  }
  .eyebrow { margin: 0 0 0.8rem; color: var(--gold); font-size: 0.78rem; letter-spacing: 0.2em; text-transform: uppercase; }
  .hero h1 { margin: 0; font-family: var(--font-display); font-size: clamp(3.1rem, 5.8vw, 4.9rem); line-height: 0.95; letter-spacing: -0.052em; }
  .hero__lede { margin: 1.25rem 0 0; max-width: 52rem; color: var(--text-dim); font-size: 1.08rem; line-height: 1.82; }
  .hero__actions { margin-top: 1.5rem; display: flex; gap: 0.8rem; flex-wrap: wrap; }
  .btn { display: inline-flex; align-items: center; justify-content: center; border-radius: 999px; padding: 0.95rem 1.28rem; font-weight: 700; transition: transform 0.18s ease, border-color 0.18s ease, background 0.18s ease; }
  .btn:hover { transform: translateY(-1px); }
  .btn--primary { background: linear-gradient(135deg, #173039 0%, #285a63 100%); color: #fff; border: 1px solid #173039; box-shadow: 0 16px 34px rgba(23, 48, 57, 0.18); }
  .btn--secondary { background: rgba(255,255,255,0.55); border: 1px solid var(--line-strong); color: var(--text); }
  .hero__aside { padding: 1.25rem; display: flex; flex-direction: column; gap: 1rem; background: linear-gradient(180deg, rgba(255,255,255,0.95), rgba(248,244,238,0.95)); }
  .hero__stat { padding: 1.1rem; border-radius: 20px; background: var(--panel-soft); border: 1px solid var(--line); }
  .hero__stat strong { display: block; font-size: 1.5rem; font-family: var(--font-display); margin-bottom: 0.2rem; }
  .section { padding: 1.8rem 0 0.9rem; }
  .section-head { display: flex; justify-content: space-between; align-items: flex-end; gap: 1rem; margin-bottom: 1rem; }
  .section-head h2 { margin: 0.25rem 0 0; font-family: var(--font-display); font-size: 2.2rem; letter-spacing: -0.04em; }
  .section-head p { margin: 0.6rem 0 0; color: var(--text-dim); line-height: 1.78; max-width: 50rem; }
  .pill { display: inline-flex; align-items: center; border-radius: 999px; padding: 0.45rem 0.82rem; background: var(--accent-soft); color: var(--accent); font-size: 0.8rem; font-weight: 700; }
  .paper-grid, .paper-catalog, .report-grid, .signal-grid { display: grid; gap: 1rem; }
  .paper-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .paper-catalog { grid-template-columns: repeat(2, minmax(0, 1fr)); margin-top: 1rem; }
  .paper-card, .report-card, .signal-card, .section-card { padding: 1.5rem; background: linear-gradient(180deg, rgba(255,255,255,0.96), rgba(251,248,242,0.9)); transition: transform 180ms ease, box-shadow 180ms ease, border-color 180ms ease; }
  .paper-card:hover, .report-card:hover, .signal-card:hover, .section-card:hover { transform: translateY(-2px); border-color: rgba(25, 24, 28, 0.18); box-shadow: 0 22px 54px rgba(18, 15, 11, 0.1); }
  .paper-card--lead { grid-column: span 2; }
  .paper-card h3, .report-card h3, .section-card h3 { margin: 0; font-family: var(--font-display); font-size: 1.6rem; letter-spacing: -0.03em; }
  .paper-card__meta, .report-card__meta { display: flex; justify-content: space-between; gap: 1rem; align-items: flex-start; flex-wrap: wrap; }
  .paper-card__body, .report-card p, .section-card p { color: var(--text-dim); line-height: 1.75; }
  .paper-card__abstract { margin-top: 0.95rem; padding: 1rem 1.05rem; border-radius: 18px; background: var(--panel-soft); border: 1px solid var(--line); }
  .paper-card__abstract strong { display: block; margin-bottom: 0.4rem; font-size: 0.78rem; letter-spacing: 0.16em; text-transform: uppercase; color: var(--gold); }
  .paper-card__links { display: flex; gap: 0.75rem; flex-wrap: wrap; margin-top: 1rem; font-size: 0.88rem; color: var(--accent); }
  .paper-card__links a:hover { text-decoration: underline; }
  .paper-card__actions, .report-card__actions { margin-top: 1.2rem; display: flex; gap: 0.8rem; flex-wrap: wrap; }
  .split { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 1rem; }
  .catalog-grid { display: grid; grid-template-columns: minmax(0, 1.7fr) minmax(280px, 0.9fr); gap: 1rem; align-items: start; }
  .catalog-stack { display: grid; gap: 1rem; }
  .catalog-aside { position: sticky; top: 5.8rem; }
  .catalog-card { background: linear-gradient(180deg, rgba(255,255,255,0.98) 0%, var(--panel-tint) 100%); border: 1px solid var(--line); border-radius: 24px; box-shadow: var(--shadow); overflow: hidden; }
  .catalog-card__top { padding: 1.3rem 1.35rem 0.78rem; border-bottom: 1px solid rgba(40,90,99,0.09); }
  .catalog-card__eyebrow { margin: 0 0 0.45rem; color: var(--gold); font-size: 0.72rem; text-transform: uppercase; letter-spacing: 0.18em; }
  .catalog-card__title { margin: 0; font-family: var(--font-display); font-size: 1.52rem; line-height: 1.08; letter-spacing: -0.03em; }
  .catalog-card__meta { display: flex; flex-wrap: wrap; gap: 0.55rem 0.9rem; margin-top: 0.8rem; color: var(--text-dim); font-size: 0.88rem; }
  .catalog-card__body { padding: 1rem 1.35rem 1.25rem; display: grid; gap: 1rem; }
  .catalog-card__abstract { margin: 0; color: var(--text-dim); line-height: 1.74; }
  .catalog-card__footer { display: flex; justify-content: space-between; align-items: flex-end; gap: 1rem; flex-wrap: wrap; }
  .catalog-card__keywords { display: flex; gap: 0.45rem; flex-wrap: wrap; }
  .catalog-chip { display: inline-flex; align-items: center; padding: 0.34rem 0.62rem; border-radius: 999px; background: rgba(40,90,99,0.08); color: var(--accent); font-size: 0.75rem; font-weight: 600; }
  .catalog-card__actions { display: flex; gap: 0.75rem; flex-wrap: wrap; }
  .catalog-card__actions a { color: var(--accent); font-weight: 700; font-size: 0.9rem; }
  .catalog-card__actions a:hover { text-decoration: underline; }
  .catalog-sidecard { padding: 1.4rem; background: linear-gradient(180deg, rgba(22, 27, 39, 0.97), rgba(28, 34, 46, 0.95)); border: 1px solid rgba(20, 25, 38, 0.08); border-radius: 24px; box-shadow: var(--shadow); display: grid; gap: 1rem; }
  .catalog-sidecard h3 { margin: 0; font-family: var(--font-display); font-size: 1.42rem; letter-spacing: -0.03em; color: #edf1f7; }
  .catalog-sidecard p, .catalog-sidecard li { margin: 0; color: rgba(237, 241, 247, 0.74); line-height: 1.7; }
  .catalog-sidecard ul { margin: 0; padding-left: 1rem; display: grid; gap: 0.5rem; }
  .catalog-sidecard .text-link { font-weight: 700; }
  .section-card ul { margin: 0.9rem 0 0 1.1rem; padding: 0; color: var(--text-dim); }
  .section-card li { margin: 0.45rem 0; }
  .text-link { color: var(--accent); font-weight: 600; }
  .text-link:hover { text-decoration: underline; }
  .signal-grid { grid-template-columns: repeat(4, minmax(0, 1fr)); }
  .signal-card h3 { margin: 0; font-size: 1.1rem; }
  .signal-card p { color: var(--text-dim); line-height: 1.65; }
  .footer { padding: 2.4rem 0 3.6rem; color: var(--text-dim); font-size: 0.9rem; }
  @media (max-width: 980px) {
    .hero__grid, .paper-grid, .paper-catalog, .split, .signal-grid, .catalog-grid { grid-template-columns: 1fr; }
    .catalog-aside { position: static; }
    .paper-card--lead { grid-column: auto; }
  }
  @media (max-width: 720px) {
    .hero { padding-top: 3.4rem; }
    .hero__panel, .hero__aside, .paper-card, .report-card, .signal-card, .section-card, .catalog-sidecard { padding: 1.15rem; }
    .catalog-card__top, .catalog-card__body { padding-left: 1rem; padding-right: 1rem; }
  }
/* ---------------------------------------------------------------------------
   Pull quote, book setting.

   A quotation of substance is set the way the book sets one: on its own line,
   with air around it, italic, marked by the gold rule, and captioned with who
   said it and when it was FIRST published.

   It deliberately reuses the .thesis-quote language already on the homepage
   (display face, italic, 3px gold left border) rather than inventing a second
   quotation style. Two visual languages for the same idea is how a site starts
   looking assembled instead of written.

   ONE DEPARTURE FROM THE BOOK, AND IT IS DELIBERATE. The book's own epigraphs
   carry no attribution, because the voice in them is the author's own, and it
   name-checks other writers inline in the prose rather than block-quoting them.
   The site adds a dated caption because the site does a different job: it is a
   priority record, and on a priority record when a thing was first said is the
   whole point. A quotation without a date is decoration here in a way it is not
   in a book.
   --------------------------------------------------------------------------- */
.pull-quote {
  margin: 2.2rem 0;
  padding: .15rem 0 .15rem 1.5rem;
  border-left: 3px solid var(--gold, #a8873f);
  max-width: 50em;
}
.pull-quote p {
  font-family: var(--font-display, Georgia, serif);
  font-style: italic;
  font-size: 1.14em;
  line-height: 1.55;
  color: var(--ink, #1c1c19);
  margin: 0;
  text-wrap: pretty;
}
.pull-quote cite {
  display: block;
  margin-top: .8rem;
  font-family: var(--font-mono, "Space Mono", ui-monospace, monospace);
  font-style: normal;
  font-size: .74rem;
  letter-spacing: .04em;
  line-height: 1.6;
  color: var(--ink-sec, #5a5a52);
}
.pull-quote cite .pq-who { color: var(--ink, #1c1c19); }
.pull-quote cite .pq-when { white-space: nowrap; }
.pull-quote cite .pq-sep { opacity: .5; padding: 0 .45em; }

@media (max-width: 640px) {
  .pull-quote { margin: 1.7rem 0; padding-left: 1.1rem; }
  .pull-quote p { font-size: 1.06em; }
}

/* ---------------------------------------------------------------------------
   QUOTATIONS ARE ITALIC. Operator directive, 8 August 2026, site-wide and
   mandatory. Every quotation on every page, not only .pull-quote blocks.

   Declared on the CONTAINER as well as the paragraph on purpose. The italic
   previously lived in one declaration on ".pull-quote p", so any future rule
   touching font-style on a paragraph inside a blockquote would have silently
   killed every quotation on the site. It would have failed quietly and looked
   deliberate, which is the worst way for a convention to die.

   cite is the exception: an attribution is a caption and stays upright, so the
   quotation is the thing that stands out rather than competing with its label.
   --------------------------------------------------------------------------- */
blockquote,
blockquote p,
.pull-quote,
.pull-quote p { font-style: italic; }
blockquote cite,
.pull-quote cite { font-style: normal; }

/* ---------------------------------------------------------------------------
   DISPLAY EQUATIONS SCROLL INSIDE THEMSELVES (12 September 2026)

   A fourth reading rendered every register page at 390 and found one that scrolled
   sideways: research/papers/paper-x-coupled-coscaling-correction.html measured 744
   against a viewport of 390, and the offender was a display equation laid out at its
   natural 685px with nothing to contain it. The other thirty-eight pages were clean,
   which is why three earlier rounds could report no horizontal scroll and still be
   wrong about the corpus: they had not rendered this page.

   The rule belongs here, once, for every paper that loads this stylesheet, rather
   than on the page that happened to be measured. An equation too wide for the screen
   scrolls within its own box; the document does not move.
   ---------------------------------------------------------------------------
   Measured rather than assumed: the container MathJax writes carries an inline
   min-width in ex units, which max-width cannot beat, so the scrollbox goes on the
   element that HOLDS the equation, which has no inline width of its own. Inline
   maths inside a proof block overflowed by the same measurement, so that block
   scrolls too.
   --------------------------------------------------------------------------- */
.keyeq,
.proof,
.MathJax_Display,
.katex-display {
    max-width: 100%;
    overflow-x: auto;
}

/* kept in its own block: a selector a browser cannot parse invalidates the whole
   list it stands in, and this one must never take the plain rules above with it */
p:has(> mjx-container[display="true"]),
div:has(> mjx-container[display="true"]) {
    max-width: 100%;
    overflow-x: auto;
}

/* The one !important on this sheet, and it is not theming. MathJax writes an inline
   min-width in ex units on the box it renders into; an inline declaration beats any
   author max-width, so on a 390-wide screen the equation kept its 685 pixels and took
   the document with it. Measured at 390: 744 before, 390 after. Nothing else on the
   sheet can reach an inline style. */
mjx-container {
    display: inline-block;
    max-width: 100%;
    min-width: 0 !important;
    overflow-x: auto;
    vertical-align: middle;
}

mjx-container[display="true"] {
    display: block;
}