/* Comparative-spectrum reports. Every content rule is rooted at .csr; the one
 * page-level declaration uses the body class selected by this renderer.
 *
 * One reading measure, centred, with figures allowed to break out wider than
 * it. Title-left/prose-right fills a wide page but gives the reader three left
 * edges to track; one measure has one edge, and the figures use the width the
 * text should not. */
body.comparative-spectrum-shell { overflow-x: hidden; background: #171613; }

.csr { --csr-bg:#171613; --csr-panel:#1d2025; --csr-ink:#ece9e1; --csr-muted:#a9adb4; --csr-line:#343840; --csr-gold:#dcb34a; --csr-warm:#c86e45; --csr-cool:#5daab8; --csr-max:1360px; --csr-measure:74ch; --csr-column:min(var(--csr-measure),100%); min-height:100vh; margin:0; background:var(--csr-bg); color:var(--csr-ink); font:17px/1.62 Inter,ui-sans-serif,system-ui,-apple-system,sans-serif; }
.csr *, .csr *::before, .csr *::after { box-sizing:border-box; }
.csr p { margin:0 0 1em; }
.csr p:last-child { margin-bottom:0; }
.csr ul { list-style:disc; padding-left:1.35em; margin:0 0 1em; }
.csr li { margin:0 0 .4em; }
.csr .csr-wrap { width:min(var(--csr-max),calc(100% - 72px)); margin-inline:auto; }
.csr a:focus-visible, .csr .csr-scroller:focus-visible { outline:2px solid var(--csr-gold); outline-offset:3px; }

/* ---- hero ---- */
.csr .csr-hero { padding:84px 0 58px; }
.csr .csr-eyebrow { margin:0 0 12px; color:var(--csr-gold); font:700 12px/1.3 ui-monospace,SFMono-Regular,monospace; letter-spacing:.12em; text-transform:uppercase; }
.csr .csr-hero h1 { max-width:1000px; margin:0; font:500 clamp(48px,6.6vw,102px)/.95 Georgia,serif; letter-spacing:-.045em; }
.csr .csr-standfirst { max-width:1050px; margin:32px 0 42px; color:#d3d1cb; font:clamp(22px,2.5vw,34px)/1.35 Georgia,serif; }
.csr .csr-hero-grid { display:grid; grid-template-columns:minmax(0,1.65fr) minmax(280px,.8fr); gap:72px; align-items:start; max-width:1180px; }
.csr .csr-hero-grid p { max-width:66ch; }
.csr .csr-caveat { border-left:2px solid var(--csr-warm); padding:4px 0 4px 24px; color:var(--csr-muted); }
.csr .csr-caveat strong { color:var(--csr-ink); }
.csr .csr-caveat h3 { margin:0 0 10px; color:var(--csr-ink); font:600 11px ui-monospace,monospace; text-transform:uppercase; letter-spacing:.07em; }
.csr .csr-provenance { display:grid; grid-template-columns:repeat(4,1fr); gap:1px; margin:52px 0 0; background:var(--csr-line); border:1px solid var(--csr-line); }
.csr .csr-provenance div { background:var(--csr-panel); padding:18px 20px; }
.csr .csr-provenance dt { color:var(--csr-muted); font-size:12px; text-transform:uppercase; letter-spacing:.08em; }
.csr .csr-provenance dd { margin:4px 0 0; }

/* ---- findings index ---- */
.csr .csr-findings { padding:64px 0; border-top:1px solid var(--csr-line); background:#141317; }
.csr .csr-findings h2 { margin:0 0 30px; font:500 clamp(26px,2.4vw,38px)/1.1 Georgia,serif; letter-spacing:-.02em; }
.csr .csr-findings-list { margin:0; padding:0; list-style:none; counter-reset:csr-finding; border-top:1px solid var(--csr-line); }
.csr .csr-findings-list li { display:flex; gap:24px; align-items:center; justify-content:space-between; padding:14px 0; border-bottom:1px solid var(--csr-line); }
.csr .csr-findings-list .csr-verdict { flex:none; }
.csr .csr-findings-list li::before { counter-increment:csr-finding; content:counter(csr-finding); color:var(--csr-muted); font:600 12px ui-monospace,monospace; min-width:22px; }
.csr .csr-findings-list a { flex:1; color:var(--csr-ink); text-decoration:none; font:400 19px/1.35 Georgia,serif; }
.csr .csr-findings-list a:hover, .csr .csr-findings-list a:focus-visible { color:var(--csr-gold); text-decoration:underline; }
.csr .csr-verdict-legend { display:grid; grid-template-columns:auto 1fr; gap:10px 18px; margin:32px 0 0; align-items:baseline; }
.csr .csr-verdict-legend dt { margin:0; }
.csr .csr-verdict-legend dd { margin:0; color:var(--csr-muted); font-size:14px; }

/* ---- verdicts: contract terms, rendered as words ---- */
.csr .csr-verdict { display:inline-block; padding:8px 12px; border:1px solid var(--csr-line); border-radius:100px; font:600 11px ui-monospace,monospace; text-transform:uppercase; letter-spacing:.06em; background:var(--csr-panel); white-space:nowrap; }
.csr .v-same { border-color:#477c69; color:#8fd0b6; }
.csr .v-different { border-color:#9b514b; color:#e2988f; }
.csr .v-limited { border-color:#6a6a72; color:var(--csr-muted); }
.csr .v-partial { border-color:#a07635; color:#e2c184; }

/* ---- one reading measure ---- */
.csr .csr-section { padding:72px 0; border-top:1px solid var(--csr-line); scroll-margin-top:24px; }
.csr .csr-question { padding:86px 0; border-top:1px solid var(--csr-line); scroll-margin-top:24px; }
.csr .csr-findings, .csr .csr-footer { scroll-margin-top:24px; }
.csr .csr-heading, .csr .csr-offset, .csr .csr-prose, .csr .csr-table-note { width:var(--csr-column); margin-inline:auto; }
.csr .csr-heading h2 { margin:0 0 22px; font:500 clamp(32px,3.2vw,52px)/1.04 Georgia,serif; letter-spacing:-.025em; }

/* ---- the answer to the question ----
 * The verdict used to be an inline-block with a bottom margin, immediately
 * before the headline. Vertical margins on an inline-level box do not affect
 * the line box, so that margin moved nothing and the pill sat welded to a
 * 52px serif heading — the one element on the page with no rhythm around it.
 * It now reads after the question, in a block that can carry the space. */
.csr .csr-answer { margin:0 0 30px; }
.csr .csr-question .csr-eyebrow { margin-bottom:14px; }

/* ---- onward: the next act from the bottom of a long question ---- */
.csr .csr-onward { display:grid; grid-template-columns:1fr auto 1fr; gap:16px 24px; align-items:baseline; width:var(--csr-column); margin:52px auto 0; padding-top:20px; border-top:1px solid var(--csr-line); font-size:14px; }
.csr .csr-onward a { color:var(--csr-muted); text-decoration:none; }
.csr .csr-onward a:hover, .csr .csr-onward a:focus-visible { color:var(--csr-gold); text-decoration:underline; }
.csr .csr-onward-back::before { content:"\2190\00a0"; }
.csr .csr-onward-next { text-align:right; }
.csr .csr-onward-next::after { content:"\00a0\2192"; }
.csr .csr-onward-index { color:var(--csr-ink); font:600 11px ui-monospace,monospace; text-transform:uppercase; letter-spacing:.06em; text-align:center; }
.csr .csr-heading p:first-child, .csr .csr-offset p:first-child { margin-top:0; }
.csr .csr-offset { margin-top:40px; }
.csr h3 { font:500 27px/1.2 Georgia,serif; }

/* ---- figures ---- */
.csr .csr-figure { width:100%; margin:44px 0 0; background:var(--csr-panel); border:1px solid var(--csr-line); }
.csr .csr-figure > figcaption { padding:14px 18px; color:var(--csr-muted); font-size:14px; border-top:1px solid var(--csr-line); }
.csr .csr-figure figcaption b { color:var(--csr-ink); }
.csr .csr-chart { padding:22px 18px 8px; }
.csr .csr-chart:empty { display:none; }
.csr .csr-chart svg { display:block; width:100%; height:auto; overflow:visible; }
.csr .csr-pair { display:grid; grid-template-columns:1fr 1fr; gap:1px; background:var(--csr-line); }
.csr .csr-pair > figure { margin:0; background:#0a0a0a; display:flex; flex-direction:column; }
.csr .csr-pair img { display:block; width:100%; height:auto; }
.csr .csr-pair figcaption { flex:1; padding:12px 14px; background:var(--csr-panel); color:var(--csr-muted); font-size:13px; border-top:1px solid var(--csr-line); }
.csr .csr-pair figcaption b { display:block; color:var(--csr-ink); font-size:14px; margin-bottom:4px; }
.csr .csr-swatches { display:flex; gap:1px; margin-top:10px; }
.csr .csr-swatches i { display:block; height:26px; flex:1; border:1px solid #00000055; }

/* ---- readouts ---- */
.csr .csr-readout { display:grid; grid-template-columns:repeat(auto-fit,minmax(128px,1fr)); gap:1px; background:var(--csr-line); border:1px solid var(--csr-line); margin-top:26px; }
.csr .csr-readout div { background:var(--csr-panel); padding:14px 16px; }
.csr .csr-readout dt { color:var(--csr-muted); font-size:11px; text-transform:uppercase; letter-spacing:.07em; }
.csr .csr-readout dd { margin:5px 0 0; font:500 23px Georgia,serif; }
.csr .csr-readout dd small { display:block; font:400 12px/1.4 ui-monospace,monospace; color:var(--csr-muted); }

/* ---- cards ---- */
.csr .csr-grid2 { display:grid; grid-template-columns:1fr 1fr; gap:18px; margin-top:38px; }
.csr .csr-card { padding:26px; border:1px solid var(--csr-line); background:var(--csr-panel); }
.csr .csr-card h3 { margin:0 0 14px; }
.csr .csr-card ul { padding-left:20px; margin:0; }
.csr .csr-card li { margin:7px 0; }

/* ---- tables: numeric columns get numeric headers, first column sticky ---- */
.csr .csr-scroller { overflow-x:auto; max-width:100%; margin-top:26px; }
.csr table { width:100%; border-collapse:collapse; font-size:14px; }
.csr th, .csr td { padding:10px 14px; border-bottom:1px solid var(--csr-line); text-align:left; vertical-align:baseline; }
.csr thead th { background:#1a1d22; color:var(--csr-muted); font:600 11px ui-monospace,monospace; text-transform:uppercase; letter-spacing:.07em; white-space:nowrap; }
.csr th:first-child, .csr td:first-child { position:sticky; left:0; z-index:1; background:#1a1d22; }
.csr tbody th { font:400 14px/1.5 Inter,ui-sans-serif,system-ui,sans-serif; color:var(--csr-ink); background:var(--csr-panel); }
.csr tbody tr:nth-child(even) th, .csr tbody tr:nth-child(even) td { background:#1c1f25; }
.csr tbody tr:hover th, .csr tbody tr:hover td { background:#262a31; }
.csr tr.csr-mark th, .csr tr.csr-mark td { background:#242b25; }
.csr tr.csr-mark th:first-child { box-shadow:inset 3px 0 0 var(--csr-gold); }
.csr th.csr-num, .csr td.csr-num { text-align:right; font-variant-numeric:tabular-nums; }
.csr td.csr-num { font-family:ui-monospace,monospace; white-space:nowrap; }
.csr th + th, .csr td + td { border-left:1px solid #272b32; }
.csr .csr-table-note { margin:14px auto 0; color:var(--csr-muted); font-size:13px; max-width:80ch; }

/* ---- footer ---- */
.csr .csr-footer { padding:72px 0 100px; border-top:1px solid var(--csr-line); }
.csr .csr-source-note { color:var(--csr-muted); font-size:14px; }

@media (max-width:980px) {
  .csr .csr-hero-grid, .csr .csr-grid2 { grid-template-columns:1fr; }
  .csr .csr-verdict { white-space:normal; border-radius:14px; }
  .csr .csr-findings-list li { flex-direction:column; align-items:flex-start; gap:10px; }
  .csr .csr-findings-list li::before { min-width:0; }
  .csr .csr-verdict-legend { grid-template-columns:1fr; gap:4px 0; }
  .csr .csr-verdict-legend dd { margin-bottom:12px; }
  .csr .csr-provenance { grid-template-columns:repeat(2,1fr); }
  .csr .csr-pair { grid-template-columns:1fr; }
  .csr .csr-onward { grid-template-columns:1fr; gap:12px; }
  .csr .csr-onward-next { text-align:left; }
  .csr .csr-onward-index { text-align:left; }
}
@media (max-width:620px) {
  .csr { font-size:16px; }
  .csr .csr-wrap { width:min(100% - 32px,var(--csr-max)); }
  .csr .csr-hero { padding-top:48px; }
  .csr .csr-hero h1 { font-size:42px; }
  .csr .csr-hero-grid { gap:28px; }
  .csr .csr-provenance { grid-template-columns:1fr; }
  .csr .csr-question { padding:56px 0; }
}