/* Nira /learn: static article pages, no JavaScript needed to read them.
   Look matched to the live site (nira.praxeumai.com): design tokens v4 (ds/tokens.json), chrome from
   SiteLayout + site.css (header, footer, buttons, hero wash, closing band). Light first; dark follows the
   reader's saved choice (localStorage "nira.theme", shared with the app); the OS setting is ignored, as in the app. */

:root {
  /* colour: light */
  --ground: #ffffff; --surface: #f6f7f9; --surface-2: #eef0f3; --line: #e3e6ea; --line-strong: #d9dde3;
  --ink: #14181f; --ink-2: #4a5260; --ink-3: #636d7c;
  --for: #2743c7; --for-text: #2743c7; --on-for: #ffffff; --for-tint: #f3f5fd; --for-line: #c9d1f5;
  --against: #b4531e; --against-tint: #fbf1ea;
  --navy: #121a3d; --on-navy: #ffffff; --for-on-navy: #5b74ff;
  --on-ink: var(--ground);
  --mark-beam: var(--for); --mark-fulcrum: var(--ink);

  /* type */
  --font-sans: "Schibsted Grotesk", system-ui, -apple-system, "Segoe UI", sans-serif;
  --font-serif: "Source Serif 4", "Source Serif Pro", Georgia, serif;
  --font-mono: "JetBrains Mono", ui-monospace, "SF Mono", Menlo, monospace;

  /* spacing, radii, sizes */
  --space-1: 4px; --space-2: 8px; --space-3: 12px; --space-4: 16px; --space-5: 20px; --space-6: 24px;
  --space-7: 28px; --space-8: 32px; --space-12: 48px; --space-16: 64px; --space-24: 96px;
  --radius-sm: 8px; --radius-md: 10px; --radius-lg: 12px; --radius-xl: 14px; --radius-pill: 999px;
  --control: 44px; --lean: 16px;
  --measure-reading: 680px; --measure-site: 1080px;

  /* shadows (the only three) */
  --shadow-overlay: 0 24px 64px #14181f38;
  --shadow-card: 0 1px 1px #14181f14;
  --shadow-focus: 0 0 0 2px #ffffff, 0 0 0 4px #2743c7;

  --duration-fast: 160ms;
  --ease-standard: cubic-bezier(0.2, 0.7, 0.2, 1);
  color-scheme: light;
}
:root[data-theme="dark"] {
  --ground: #0e1116; --surface: #161a21; --surface-2: #1e232c; --line: #2a303a; --line-strong: #343b47;
  --ink: #eceef2; --ink-2: #a9b0bc; --ink-3: #8a92a0;
  --for: #5b74ff; --for-text: #7a8fff; --on-for: #0e1116; --for-tint: #182040; --for-line: #2e3c7a;
  --against: #e08a5c; --against-tint: #2c1f17; --on-navy: #eceef2;
  --shadow-overlay: 0 24px 64px #00000099; --shadow-card: 0 1px 1px #00000066;
  --shadow-focus: 0 0 0 2px #0e1116, 0 0 0 4px #5b74ff;
  color-scheme: dark;
}

/* ---------- base ---------- */
*, *::before, *::after { box-sizing: border-box; }
html { -webkit-text-size-adjust: 100%; text-size-adjust: 100%; }
html, body { background: var(--ground); }
body { margin: 0; min-height: 100vh; display: flex; flex-direction: column; color: var(--ink-2); font-family: var(--font-sans); font-size: 16px; line-height: 1.5; overflow-wrap: break-word; -webkit-font-smoothing: antialiased; }
main { flex: 1 0 auto; }
img, svg { max-width: 100%; }
a { color: var(--for-text); text-decoration: underline; text-underline-offset: 3px; text-decoration-thickness: 1px; }
a:hover { text-decoration-thickness: 2px; }
a:focus-visible, button:focus-visible, summary:focus-visible, input:focus-visible, select:focus-visible, [tabindex="0"]:focus-visible { outline: none; box-shadow: var(--shadow-focus); border-radius: 4px; }
.skip { position: absolute; left: -9999px; top: 0; }
.skip:focus { left: var(--space-4); top: var(--space-2); z-index: 60; padding: var(--space-2) var(--space-3); background: var(--ground); color: var(--ink); border: 1px solid var(--line-strong); border-radius: var(--radius-sm); }
.mono, .cite { font-family: var(--font-mono); font-variant-numeric: tabular-nums; }
.vh, .nst-sr { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; }

/* ---------- draft banner ---------- */
.draft-banner { display: flex; align-items: center; justify-content: center; min-height: 32px; padding: 6px var(--space-4); background: var(--surface-2); color: var(--ink-2); border-bottom: 1px solid var(--line); font: 500 11px/1.3 var(--font-mono); letter-spacing: .06em; text-transform: uppercase; text-align: center; }

/* ---------- site chrome (the live header, buttons, footer) ---------- */
.nst-wrap { width: 100%; max-width: var(--measure-site); margin: 0 auto; padding: 0 24px; }
.nst-head { position: relative; z-index: 30; border-bottom: 1px solid var(--line); background: var(--ground); }
.nst-nav { display: flex; justify-content: space-between; align-items: center; gap: 16px; padding-top: 12px; padding-bottom: 12px; }
.nst-mark { display: inline-flex; align-items: center; gap: 11px; min-height: 44px; text-decoration: none; color: var(--for-text); }
.nst-mark:hover { text-decoration: none; }
.nr-beam { display: inline-block; width: 38px; height: 38px; flex: none; vertical-align: middle; }
.nr-beam svg { display: block; width: 100%; height: 100%; overflow: visible; animation: nr-float 7000ms cubic-bezier(0.45, 0, 0.55, 1) infinite; }
.nr-beam .nr-beam-bar { stroke: var(--for); stroke-width: 4.5; stroke-linecap: round; }
.nr-beam .nr-beam-dot { fill: var(--ink); }
@keyframes nr-float { 0%, 100% { transform: translateY(0); } 50% { transform: translateY(-1px); } }
.nr-wordmark-text { font: 600 28px/1 var(--font-sans); letter-spacing: -0.03em; }
.nst-links { display: flex; align-items: center; gap: 22px; }
.nst-links > a:not(.nst-btn) { min-height: 44px; display: inline-flex; align-items: center; font: 400 14.5px/1 var(--font-sans); color: var(--ink-2); text-decoration: none; }
.nst-links > a:not(.nst-btn):hover { color: var(--ink); }
.nst-links > a[aria-current="page"] { color: var(--ink); font-weight: 500; }
.nst-btn { height: 46px; padding: 0 20px; border-radius: var(--radius-sm); border: 1px solid var(--line-strong); background: var(--ground); color: var(--ink) !important; font: 600 15px/1 var(--font-sans); display: inline-flex; align-items: center; justify-content: center; gap: 8px; white-space: nowrap; text-decoration: none !important; cursor: pointer; }
.nst-btn:hover { background: var(--surface); }
.nst-btn.primary { background: var(--for); border-color: var(--for); color: #fff !important; }
.nst-btn.primary:hover { filter: brightness(0.9); background: var(--for); }
.nst-btn.sm { height: 38px; padding: 0 14px; font-size: 13.5px; }
.nst-links .nst-btn { height: 40px; font-size: 14px; }
.nst-btn.on-navy { background: var(--on-navy); border-color: var(--on-navy); color: var(--navy) !important; }
.nst-btn.on-navy:hover { background: var(--on-navy); filter: brightness(.94); }
.nst-btn.ghost-navy { background: transparent; border-color: color-mix(in srgb, var(--on-navy) 40%, transparent); color: var(--on-navy) !important; }
.nst-btn.ghost-navy:hover { background: color-mix(in srgb, var(--on-navy) 10%, transparent); }
.nst-theme { display: inline-grid; place-items: center; width: 38px; height: 38px; padding: 0; border-radius: 999px; border: 1px solid var(--line-strong); background: transparent; color: var(--ink-2); cursor: pointer; }
.nst-theme[hidden] { display: none; }
.nst-theme:hover { color: var(--ink); background: var(--surface); }
.nst-theme svg { width: 17px; height: 17px; }
.nst-theme .i-sun { display: none; }
:root[data-theme="dark"] .nst-theme .i-sun { display: block; }
:root[data-theme="dark"] .nst-theme .i-moon { display: none; }
/* a phone's nav is one 56px row: wordmark, theme, menu; the menu is a <details>, so it opens without JavaScript */
.nst-phone { display: none; align-items: center; gap: 6px; }
.nst-menu > summary { list-style: none; width: 44px; height: 44px; display: inline-flex; align-items: center; justify-content: center; border-radius: 10px; color: var(--ink); cursor: pointer; }
.nst-menu > summary::-webkit-details-marker { display: none; }
.nst-menu .i-close { display: none; }
.nst-menu[open] .i-close { display: block; }
.nst-menu[open] .i-open { display: none; }
.nst-sheet { position: absolute; left: 0; right: 0; top: 100%; z-index: 40; display: flex; flex-direction: column; gap: 4px; padding: 8px 24px 20px; border-top: 1px solid var(--line); border-bottom: 1px solid var(--line); background: var(--ground); }
.nst-sheet > a:not(.nst-btn) { min-height: 48px; display: flex; align-items: center; border-bottom: 1px solid var(--line); font: 400 16px/1 var(--font-sans); color: var(--ink); text-decoration: none; }
.nst-sheet .nst-btn { margin-top: 14px; }
@media (max-width: 840px) {
  .nst-nav { min-height: 56px; padding-top: 6px; padding-bottom: 6px; }
  .nr-beam { width: 32px; height: 32px; }
  .nr-wordmark-text { font-size: 24px; }
  .nst-links { display: none; }
  .nst-phone { display: inline-flex; }
}
@media (min-width: 841px) { .nst-menu { display: none; } }
@media (max-width: 760px) { .nst-wrap { padding: 0 16px; } .nst-sheet { padding-left: 16px; padding-right: 16px; } }

.nst-foot { padding: 28px 0; border-top: 1px solid var(--line); }
.nst-foot-row { display: flex; justify-content: space-between; gap: 16px; flex-wrap: wrap; font: 400 13px/1.5 var(--font-sans); color: var(--ink-3); }
.nst-foot-row > div:first-child { flex: 1 1 320px; max-width: 460px; }
.nst-foot-links { display: flex; gap: 18px; flex-wrap: wrap; }
.nst-foot-links a { color: var(--ink-3); text-decoration: none; }
.nst-foot-links a:hover { color: var(--ink); text-decoration: underline; }

/* the beam and fulcrum, small, for drawn product mocks inside articles */
.logo { display: inline-flex; align-items: center; gap: .45em; color: var(--ink); text-decoration: none; font: 600 16px/1 var(--font-sans); letter-spacing: -.03em; }
.logo svg { width: 25px; height: 12px; overflow: visible; }
.logo .beam { stroke: var(--mark-beam); }
.logo .fulcrum { fill: var(--mark-fulcrum); }

/* ---------- page head (the live site's slim hero: a cobalt wash, then a hairline) ---------- */
.lx-hero { padding: 40px 0 32px; border-bottom: 1px solid var(--line); background:
  radial-gradient(900px 520px at 12% 0%, color-mix(in srgb, var(--for) 9%, transparent), transparent 62%),
  radial-gradient(640px 420px at 92% 100%, color-mix(in srgb, var(--for) 6%, transparent), transparent 60%); }
.lx-hero__in { max-width: 820px; }
.crumbs { margin: 0 0 var(--space-6); padding: 0; list-style: none; display: flex; flex-wrap: nowrap; gap: var(--space-2); font: 500 13px/1.4 var(--font-sans); color: var(--ink-3); min-width: 0; }
.crumbs li { margin: 0; white-space: nowrap; }
.crumbs li:last-child { min-width: 0; overflow: hidden; text-overflow: ellipsis; }
.crumbs li + li::before { content: "/"; margin-right: var(--space-2); color: var(--line-strong); }
.crumbs a { color: var(--ink-3); text-decoration: none; }
.crumbs a:hover { color: var(--ink); text-decoration: underline; }
.eyebrow { margin: 0 0 var(--space-3); font: 600 11px/1.3 var(--font-sans); letter-spacing: .06em; text-transform: uppercase; color: var(--for-text); }
.lx-hero h1 { margin: 0 0 var(--space-5); font: 500 clamp(31px, 4.4vw, 50px)/1.1 var(--font-serif); letter-spacing: -.02em; color: var(--ink); text-wrap: balance; }
.byline { display: flex; flex-wrap: wrap; gap: var(--space-1) var(--space-5); margin: 0; font: 400 13px/1.5 var(--font-sans); color: var(--ink-3); }
.byline time { color: var(--ink-2); }

/* ---------- page body: one reading column; a contents rail from 1100px ---------- */
.lx-body { padding: 40px 0 72px; }
.lx-grid { display: block; }
.lx-rail { display: none; }
.lx-toc-inline { margin: 0 0 var(--space-8); border: 1px solid var(--line); border-radius: var(--radius-lg); background: var(--surface); }
.lx-toc-inline summary { cursor: pointer; padding: var(--space-3) var(--space-4); font: 600 11px/1.3 var(--font-sans); letter-spacing: .06em; text-transform: uppercase; color: var(--ink-3); list-style: none; }
.lx-toc-inline summary::-webkit-details-marker { display: none; }
.lx-toc-inline summary::after { content: "+"; float: right; font: 400 18px/1 var(--font-sans); color: var(--ink-3); }
.lx-toc-inline[open] summary::after { content: "\2013"; }
.lx-toc-inline ol { margin: 0; padding: 0 var(--space-4) var(--space-4) 40px; }
.lx-toc-inline li { margin: 0 0 6px; font: 400 15px/1.4 var(--font-sans); color: var(--ink-3); }
.lx-toc-inline a { text-decoration: none; }
@media (min-width: 1100px) {
  .lx-grid { display: grid; grid-template-columns: minmax(0, var(--measure-reading)) 264px; column-gap: 72px; align-items: start; }
  .lx-rail { display: block; position: sticky; top: 24px; max-height: calc(100vh - 48px); overflow: auto; padding: 4px 0 4px 1px; }
  .lx-toc-inline { display: none; }
}
.rail__h { margin: 0 0 var(--space-3); font: 600 11px/1.3 var(--font-sans); letter-spacing: .06em; text-transform: uppercase; color: var(--ink-3); }
.lx-rail ol { list-style: none; margin: 0; padding: 0; border-left: 1px solid var(--line); }
.lx-rail li { margin: 0; }
.lx-rail ol a { display: block; padding: 6px 0 6px var(--space-3); margin-left: -1px; border-left: 2px solid transparent; color: var(--ink-2); font: 400 13.5px/1.4 var(--font-sans); text-decoration: none; }
.lx-rail ol a:hover { color: var(--ink); border-left-color: var(--for-line); }
.lx-rail ol a[aria-current="true"] { color: var(--ink); border-left-color: var(--for); font-weight: 500; }
.rail__ask { margin-top: var(--space-8); padding: var(--space-4); border: 1px solid var(--for-line); border-radius: var(--radius-md); background: var(--for-tint); }
.rail__ask p { margin: 0 0 var(--space-3); font: 400 13.5px/1.5 var(--font-sans); color: var(--ink-2); }
.rail__meta { margin: var(--space-6) 0 0; font: 400 12px/1.5 var(--font-mono); color: var(--ink-3); }

/* ---------- article text ---------- */
.article { max-width: var(--measure-reading); min-width: 0; }
.article .lede { margin: 0 0 var(--space-8); font: 400 20px/1.55 var(--font-serif); color: var(--ink); }
.article p, .article li { font: 400 17px/1.68 var(--font-serif); color: var(--ink-2); }
@media (min-width: 900px) { .article p, .article li { font-size: 18px; } }
.article p { margin: 0 0 var(--space-4); }
.article strong, .article b { font-weight: 600; color: var(--ink); }
.article em { font-style: italic; }
.article h2 { margin: var(--space-12) 0 var(--space-4); padding-top: var(--space-6); border-top: 1px solid var(--line); font: 500 26px/1.25 var(--font-serif); letter-spacing: -.01em; color: var(--ink); scroll-margin-top: var(--space-6); text-wrap: balance; }
.article h3 { margin: var(--space-8) 0 var(--space-2); font: 600 16px/1.4 var(--font-sans); color: var(--ink); scroll-margin-top: var(--space-6); }
.article ul, .article ol { margin: 0 0 var(--space-6); padding-left: 22px; }
.article li { margin-bottom: var(--space-2); }
.article li::marker { color: var(--ink-3); }
.article .cite { font-size: 13px; font-weight: 500; color: var(--ink); white-space: nowrap; }
.article a.cite { color: var(--for-text); text-decoration: none; border-radius: 4px; padding: 0 2px; }
.article a.cite:hover { background: var(--for-tint); }
.article .rupee { font-family: var(--font-mono); font-size: .88em; font-weight: 500; color: var(--ink); white-space: nowrap; font-variant-numeric: tabular-nums; }
.article hr { border: 0; border-top: 1px solid var(--line); margin: var(--space-8) 0; }
.article code { font: 500 .88em var(--font-mono); padding: 1px 5px; border-radius: 4px; background: var(--surface-2); color: var(--ink); }
.article img { height: auto; border-radius: var(--radius-md); }
@media (max-width: 720px) { .article .lede { font-size: 19px; } .article h2 { font-size: 23px; } }


/* ---------- article components (from the draft design system, unchanged in meaning) ---------- */
/* callouts */
.callout { margin: var(--space-8) 0; padding: var(--space-6); background: var(--surface); border-radius: var(--radius-lg); }
.callout__k { display: flex; align-items: center; gap: var(--space-2); margin: 0 0 var(--space-3) !important; font: 600 11px/1.3 var(--font-sans) !important; letter-spacing: .06em; text-transform: uppercase; color: var(--ink-3) !important; }
.callout ul, .callout ol { margin-bottom: 0; }
.callout p.callout__k { font-size: 11px !important; line-height: 1.3 !important; }
.callout li, .callout p { font-size: 16px !important; line-height: 1.6 !important; }
.callout > :last-child { margin-bottom: 0; }
.callout--example { background: var(--ground); border: 1px solid var(--line); }
.callout--checklist ul, .callout--checklist ol { list-style: none; padding-left: 0; }
.callout--checklist li { position: relative; padding-left: 26px; }
.callout--checklist li::before { content: ""; position: absolute; left: 0; top: 7px; width: 13px; height: 13px; border: 1.5px solid var(--ink-3); border-radius: 3px; }
.callout--now { background: var(--for-tint); border: 1px solid var(--for-line); }
.callout--disclaimer { background: none; padding: var(--space-4) 0 0; border-top: 1px solid var(--line); border-radius: 0; margin-top: var(--space-12); }
.callout--disclaimer p { font: 400 13px/1.55 var(--font-sans) !important; color: var(--ink-3) !important; }

/* steps */
.steps { list-style: none; counter-reset: step; padding: 0 !important; margin: var(--space-6) 0 var(--space-8) !important; }
.steps > li { counter-increment: step; position: relative; margin: 0 !important; padding: var(--space-4) 0 var(--space-4) 48px; border-top: 1px solid var(--line); }
.steps > li:last-child { border-bottom: 1px solid var(--line); }
.steps > li::before { content: counter(step, decimal-leading-zero); position: absolute; left: 0; top: var(--space-4); font: 500 13px/28px var(--font-mono); color: var(--ink-3); }
.steps > li > b:first-child, .steps > li > strong:first-child { color: var(--ink); }

/* the court's own words */
.quote { margin: var(--space-6) 0; padding: var(--space-4) var(--space-6); background: var(--surface); border: 1px solid var(--line); border-radius: var(--radius-md); }
.quote p { margin: 0 0 var(--space-2) !important; font: italic 400 17px/1.55 var(--font-serif) !important; color: var(--ink) !important; }
.quote cite { display: block; font: 400 12px/1.5 var(--font-mono); font-style: normal; color: var(--ink-2); }
.quote cite a { color: var(--for-text); }

/* status chips (words first, a dot beside) */
.chip { display: inline-flex; align-items: center; gap: 6px; padding: 1px 8px; border-radius: 4px; background: var(--surface); font: 600 12px/20px var(--font-sans); color: var(--ink); white-space: nowrap; vertical-align: 1px; }
.chip::before { content: ""; width: 6px; height: 6px; border-radius: 50%; background: var(--ink-3); }
.chip--ok::before { background: var(--for); }
.chip--flag { color: var(--against); }
.chip--flag::before { background: var(--against); }
.chip--grey { color: var(--ink-3); }
.pro { display: inline-flex; align-items: center; padding: 1px 7px; border-radius: 5px; background: var(--for-tint); color: var(--for-text); font: 600 11px/1.5 var(--font-sans); letter-spacing: .04em; vertical-align: 2px; }
.free { display: inline-flex; align-items: center; padding: 1px 7px; border-radius: 5px; background: var(--surface-2); color: var(--ink); font: 600 11px/1.5 var(--font-sans); letter-spacing: .04em; vertical-align: 2px; }

/* figures: drawn, not decorated */
.figure { margin: var(--space-8) 0; padding: var(--space-6); border: 1px solid var(--line); border-radius: var(--radius-lg); background: var(--ground); }
.figure--plain { padding: 0; border: 0; }
.figure > svg { display: block; width: 100%; height: auto; }
.figure figcaption { margin-top: var(--space-4); font: 400 12.5px/1.5 var(--font-sans); color: var(--ink-3); }
.figure__k { margin: 0 0 var(--space-4) !important; font: 600 11px/1.3 var(--font-sans) !important; letter-spacing: .06em; text-transform: uppercase; color: var(--ink-3) !important; }
@media (max-width: 560px) { .figure { padding: var(--space-4); } }

/* SVG text and strokes, themed */
.svg-line { stroke: var(--line-strong); stroke-width: 2; fill: none; }
.svg-hair { stroke: var(--line); stroke-width: 1; fill: none; }
.svg-for { stroke: var(--for); stroke-width: 4; stroke-linecap: round; fill: none; }
.svg-against { stroke: var(--against); stroke-width: 4; stroke-linecap: round; fill: none; }
.svg-grey { stroke: var(--ink-3); stroke-width: 4; stroke-linecap: round; fill: none; }
.svg-dash { stroke: var(--ink-3); stroke-width: 1.5; stroke-dasharray: 4 4; fill: none; }
.svg-dot { fill: var(--ink); }
.svg-dot-for { fill: var(--for); }
.svg-dot-against { fill: var(--against); }
.svg-ring { fill: var(--ground); stroke: var(--ink); stroke-width: 2; }
.svg-box { fill: var(--surface); stroke: var(--line); stroke-width: 1; }
.svg-box-now { fill: var(--for-tint); stroke: var(--for-line); stroke-width: 1; }
.svg-box-ink { fill: var(--ground); stroke: var(--ink); stroke-width: 1; }
.svg-t { font: 500 12px var(--font-mono); fill: var(--ink-2); }
.svg-t-ink { font: 500 12px var(--font-mono); fill: var(--ink); }
.svg-k { font: 600 11px var(--font-sans); letter-spacing: .06em; fill: var(--ink-3); }
.svg-w { font: 600 13px var(--font-sans); fill: var(--ink); }
.svg-w-for { font: 600 13px var(--font-sans); fill: var(--for-text); }
.svg-w-against { font: 600 13px var(--font-sans); fill: var(--against); }
.svg-s { font: 400 12px var(--font-sans); fill: var(--ink-2); }
.svg-serif { font: 400 15px var(--font-serif); fill: var(--ink); }
.svg-arrow { fill: var(--line-strong); }

/* lean glyph: the small beam and fulcrum, tilted 14 degrees toward its side */
.lean { display: inline-flex; align-items: center; gap: var(--space-1); font: 500 13.5px/1 var(--font-sans); white-space: nowrap; }
.glyph { width: var(--lean); height: var(--lean); display: block; overflow: visible; flex: none; }
.glyph line { stroke-width: 7; stroke-linecap: round; transform-origin: 28px 26px; transform-box: view-box; }
.glyph circle { fill: var(--mark-fulcrum); }
.glyph--for line { stroke: var(--for); transform: rotate(-14deg); }
.glyph--against line { stroke: var(--against); transform: rotate(14deg); }
.glyph--mixed line { stroke: var(--ink-3); }
.glyph--mixed circle { fill: var(--ink-3); }
.glyph--big { width: 36px; height: 36px; }
.glyph--big line { stroke-width: 4.5; }
.glyph--big.glyph--for line { transform: rotate(-10deg); }
.glyph--big.glyph--against line { transform: rotate(10deg); }
.lean--for { color: var(--for-text); }
.lean--against { color: var(--against); }
.lean--mixed { color: var(--ink-2); }
.lean--lg { font-size: 14.5px; font-weight: 600; }
.lean--lg .glyph { width: 18px; height: 18px; }

/* answer anatomy (a drawn answer, built from the product's parts) */
.mock { border: 1px solid var(--line); border-radius: var(--radius-lg); background: var(--ground); overflow: hidden; }
.mock__bar { display: flex; align-items: center; justify-content: space-between; gap: var(--space-3); min-height: 44px; padding: 0 var(--space-4); border-bottom: 1px solid var(--line); font: 500 12.5px/1.3 var(--font-sans); color: var(--ink-3); }
.mock__bar .logo { font-size: 16px; min-height: 0; }
.mock__body { padding: var(--space-6); display: flex; flex-direction: column; gap: 18px; }
.mock__q { margin: 0 !important; font: italic 400 16px/1.5 var(--font-serif) !important; color: var(--ink-2) !important; }
.mock__lean { display: flex; align-items: center; gap: var(--space-3); }
.mock__lean p { margin: 0 !important; font: 400 13.5px/1.5 var(--font-sans) !important; color: var(--ink-2) !important; }
.mock__lean strong { color: var(--ink); }
.mock__verdict { margin: 0 !important; font: 500 28px/1.2 var(--font-serif) !important; letter-spacing: -.015em; color: var(--ink) !important; }
.mock__lead { margin: 0 !important; font: 400 17px/1.5 var(--font-serif) !important; color: var(--ink-2) !important; }
.mock__meta { margin: 0 !important; font: 400 13px/1.4 var(--font-sans) !important; color: var(--ink-3) !important; }
.vchips { display: flex; flex-wrap: wrap; gap: 6px; }
.vchip { display: inline-flex; align-items: center; min-height: 28px; padding: 3px 10px; border: 1px solid var(--line-strong); border-radius: 6px; background: var(--ground); font: 400 12px/1.4 var(--font-mono); color: var(--ink-2); }
.vchip--assumed { border-style: dashed; color: var(--ink-3); }
@media (max-width: 560px) { .mock__body { padding: var(--space-4); } .mock__verdict { font-size: 24px !important; } }

/* numbered callouts on a drawn figure */
.pin { display: inline-grid; place-items: center; width: 20px; height: 20px; flex: none; border-radius: 50%; background: var(--for); color: var(--on-for); font: 600 11px/1 var(--font-mono); vertical-align: 2px; }
.pinned { position: relative; }
.pinned > .pin { position: absolute; left: -10px; top: -10px; }
.legend { list-style: none; padding: 0 !important; margin: var(--space-6) 0 0 !important; }
.legend li { display: grid; grid-template-columns: 28px 1fr; gap: var(--space-2); margin: 0 0 var(--space-3) !important; font: 400 15px/1.55 var(--font-serif) !important; }

/* glance: four facts */
.glance { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); border-top: 1px solid var(--line); border-bottom: 1px solid var(--line); }
.glance__c { display: flex; flex-direction: column; gap: 6px; padding: 14px 14px 14px 0; min-width: 0; }
.glance__c + .glance__c { padding-left: 14px; border-left: 1px solid var(--line); }
.glance__l { font: 600 11px/1.3 var(--font-sans); letter-spacing: .06em; text-transform: uppercase; color: var(--ink-3); }
.glance__v { font: 500 14px/1.35 var(--font-sans); color: var(--ink); }
.glance__v.mono { font: 500 15px/1.3 var(--font-mono); }
.glance__s { font: 400 12px/1.4 var(--font-sans); color: var(--ink-3); }
@media (max-width: 720px) { .glance { grid-template-columns: 1fr 1fr; } .glance__c:nth-child(odd) { padding-left: 0; border-left: 0; } .glance__c:nth-child(n+3) { border-top: 1px solid var(--line); } }

/* decisions: helps and hurts, side by side from 720px */
.dec-pair { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); column-gap: 32px; align-items: start; }
@media (max-width: 720px) { .dec-pair { grid-template-columns: 1fr; row-gap: 18px; } }
.dec-group { display: flex; flex-direction: column; min-width: 0; }
.dec-group__h { display: flex; align-items: center; justify-content: space-between; gap: var(--space-3); padding: var(--space-2) 0 var(--space-3); }
.dec-group__aside { font: 400 11.5px/1.4 var(--font-mono); color: var(--ink-3); }
.dec { display: grid; grid-template-columns: 1fr auto; gap: var(--space-1) var(--space-4); padding: var(--space-3) 0; border-top: 1px solid var(--line); }
.dec__name { font: 600 15px/1.3 var(--font-sans); color: var(--ink); text-decoration: none; }
a.dec__name:hover { color: var(--for-text); text-decoration: underline; }
.dec__binds { grid-column: 2; grid-row: 1; font: 600 10.5px/1.4 var(--font-sans); letter-spacing: .06em; text-transform: uppercase; white-space: nowrap; color: var(--for-text); }
.dec--against .dec__binds { color: var(--against); }
.dec__binds.is-persuasive { color: var(--ink-3); }
.dec__scope { grid-column: 1 / -1; font: 600 11.5px/1.4 var(--font-sans); letter-spacing: .04em; text-transform: uppercase; color: var(--ink-3); }
.dec__hold { grid-column: 1 / -1; margin: 0 !important; font: 400 15px/1.5 var(--font-serif) !important; color: var(--ink) !important; }
.dec__status { grid-column: 1 / -1; }
@media (max-width: 420px) { .dec { grid-template-columns: 1fr; } .dec__binds { grid-column: 1; grid-row: auto; } }

/* the court's words inside an answer */
.aquote { display: grid; gap: var(--space-2); padding: 14px var(--space-4); border: 1px solid var(--line); border-radius: var(--radius-md); background: var(--surface); }
.aquote__h { display: flex; flex-wrap: wrap; gap: 4px var(--space-3); font: 400 11px/1.4 var(--font-mono); letter-spacing: .04em; text-transform: uppercase; color: var(--ink-2); }
.aquote__ok { color: var(--for-text); }
.aquote__t { margin: 0 !important; font: 400 16px/1.55 var(--font-serif) !important; color: var(--ink) !important; }
.aquote__relied { text-decoration: underline; text-decoration-color: var(--for-line); text-decoration-thickness: 3px; text-underline-offset: 3px; }

/* limits */
.limits { display: flex; flex-direction: column; gap: var(--space-3); padding: var(--space-5) 0 0; border-top: 1px solid var(--line); }
.limits__t { margin: 0 !important; font: 500 17px/1.3 var(--font-serif) !important; color: var(--ink) !important; }
.limits ul { margin: 0 !important; padding-left: 18px !important; }
.limits li { font: 400 15px/1.6 var(--font-serif) !important; margin-bottom: 2px !important; }
.limits__foot { margin: 0 !important; font: 400 12.5px/1.5 var(--font-sans) !important; color: var(--ink-3) !important; }

/* simulator cards */
.sim-banner { display: flex; align-items: center; justify-content: center; min-height: 28px; background: var(--surface-2); font: 500 11px/1 var(--font-mono); letter-spacing: .06em; text-transform: uppercase; color: var(--ink-2); }
.ask { display: flex; flex-direction: column; gap: 10px; padding: 14px 18px; border-radius: var(--radius-lg); background: var(--surface); color: var(--ink); }
.ask--question, .ask--checkpoint { border: 1px solid var(--ink); }
.ask--document { border: 1px solid var(--line); }
.ask__e { margin: 0 !important; font: 600 11.5px/1.3 var(--font-sans) !important; letter-spacing: .06em; text-transform: uppercase; color: var(--ink-3) !important; }
.ask__t { margin: 0 !important; font: 600 15.5px/1.4 var(--font-sans) !important; color: var(--ink) !important; }
.ask__why { margin: 0 !important; font: 400 13.5px/1.5 var(--font-sans) !important; color: var(--ink-2) !important; }
.ask__input { width: 100%; min-height: 44px; padding: 9px 12px; border: 1px solid var(--line-strong); border-radius: var(--radius-sm); background: var(--ground); color: var(--ink-3); font: 400 14.5px/1.45 var(--font-sans); }
.ask__acts { display: flex; flex-wrap: wrap; gap: var(--space-2); align-items: center; }
.ask__note { margin: 0 !important; font: 400 12px/1.4 var(--font-sans) !important; color: var(--ink-3) !important; }
.btn { display: inline-flex; align-items: center; justify-content: center; gap: var(--space-2); height: 36px; padding: 0 var(--space-3); border-radius: var(--radius-sm); border: 1px solid var(--line-strong); background: var(--ground); color: var(--ink); font: 600 13.5px/1 var(--font-sans); white-space: nowrap; text-decoration: none; }
.btn--primary { background: var(--for); border-color: var(--for); color: var(--on-for); }
.btn--ink { background: var(--ink); border-color: var(--ink); color: var(--on-ink); }
.btn--quiet { border-color: transparent; background: transparent; color: var(--ink-2); }
.btn[aria-disabled="true"] { opacity: .45; }
.draftcard { display: flex; flex-direction: column; gap: 10px; padding: var(--space-4) 18px; border: 1px solid var(--for); border-radius: var(--radius-lg); background: var(--for-tint); }
.draftcard__h { display: flex; flex-wrap: wrap; justify-content: space-between; align-items: center; gap: var(--space-3); font: 600 15px/1.35 var(--font-sans); color: var(--ink); }
.draftcard p { margin: 0 !important; font: 400 13.5px/1.5 var(--font-sans) !important; color: var(--ink-2) !important; }
.meter { display: flex; gap: 4px; }
.meter span { flex: 1; height: 4px; border-radius: var(--radius-pill); background: var(--for-line); }
.meter span.is-done { background: var(--for); }
.stack { display: flex; flex-direction: column; gap: var(--space-4); }
.ladder { margin: 0 !important; padding: 0 !important; list-style: none; border: 1px solid var(--line); border-radius: var(--radius-lg); overflow: hidden; }
.ladder li { display: grid; grid-template-columns: 28px minmax(0, 1fr) auto; gap: var(--space-3); align-items: center; padding: var(--space-3) var(--space-4); border-top: 1px solid var(--line); margin: 0 !important; }
.ladder li:first-child { border-top: 0; }
.ladder__dot { width: 10px; height: 10px; border-radius: 50%; background: var(--line-strong); justify-self: center; }
.ladder li.is-done .ladder__dot { background: var(--for); }
.ladder li.is-now { background: var(--for-tint); }
.ladder li.is-now .ladder__dot { background: var(--for); box-shadow: 0 0 0 4px color-mix(in srgb, var(--for) 25%, transparent); }
.ladder__t { display: flex; flex-direction: column; gap: 2px; min-width: 0; }
.ladder__t b { font: 600 14px/1.3 var(--font-sans); color: var(--ink); }
.ladder__t span { font: 400 12.5px/1.4 var(--font-sans); color: var(--ink-3); }
.ladder li.is-wait .ladder__t b { color: var(--ink-3); }
.ladder__k { font: 400 11.5px/1.4 var(--font-mono); color: var(--ink-3); }
.twocol { display: grid; grid-template-columns: 1fr; gap: var(--space-6); }
@media (min-width: 640px) { .twocol { grid-template-columns: repeat(2, minmax(0, 1fr)); } }

/* s.75 checklist graphic */
.reqs { list-style: none; margin: 0 !important; padding: 0 !important; display: grid; gap: 0; }
.reqs li { display: grid; grid-template-columns: 88px 1fr; gap: var(--space-4); padding: var(--space-3) 0; border-top: 1px solid var(--line); margin: 0 !important; }
.reqs li:last-child { border-bottom: 1px solid var(--line); }
.reqs .cite { white-space: normal; }
.reqs__t { font: 400 15.5px/1.5 var(--font-serif); color: var(--ink); }
.reqs__s { display: block; font: 400 13px/1.5 var(--font-sans); color: var(--ink-3); margin-top: 2px; }
@media (max-width: 420px) { .reqs li { grid-template-columns: 1fr; gap: 2px; } }

/* calculator */
.calc { margin: var(--space-8) 0; padding: var(--space-6); border: 1px solid var(--ink); border-radius: var(--radius-lg); background: var(--ground); }
.calc__row { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: var(--space-4); }
@media (max-width: 640px) { .calc__row { grid-template-columns: 1fr; } }
.calc label { display: flex; flex-direction: column; gap: 6px; font: 600 13px/1.3 var(--font-sans); color: var(--ink); }
.calc label span { font-weight: 400; color: var(--ink-3); font-size: 12px; }
.calc select, .calc input { height: var(--control); padding: 0 12px; border: 1px solid var(--line-strong); border-radius: var(--radius-sm); background: var(--ground); color: var(--ink); font: 400 15px/1 var(--font-sans); width: 100%; min-width: 0; }
.calc input[type="date"] { font-family: var(--font-mono); font-size: 14px; }
.calc__out { margin-top: var(--space-6); }
.calc__out .glance { margin: 0 0 var(--space-4); }
.calc__verdict { margin: 0 0 var(--space-3) !important; font: 500 22px/1.35 var(--font-serif) !important; color: var(--ink) !important; }
.calc__why { margin: 0 0 var(--space-3) !important; font-size: 15.5px !important; }
.calc__note { margin: 0 !important; font: 400 12.5px/1.5 var(--font-sans) !important; color: var(--ink-3) !important; }
.calc noscript p { font: 400 14px/1.5 var(--font-sans) !important; }

/* FAQ */
.faq { margin: var(--space-6) 0; border-top: 1px solid var(--line); }
.faq details { border-bottom: 1px solid var(--line); }
.faq summary { cursor: pointer; list-style: none; position: relative; padding: var(--space-4) 32px var(--space-4) 0; font: 400 18px/1.45 var(--font-serif); color: var(--ink); }
.faq summary::-webkit-details-marker { display: none; }
.faq summary::after { content: "+"; position: absolute; right: 0; top: var(--space-4); font: 400 20px/26px var(--font-sans); color: var(--ink-3); }
.faq details[open] summary::after { content: "\2013"; }
.faq details > div > p:last-child { margin-bottom: var(--space-4); }

/* sources */
.sources { margin: var(--space-6) 0 0; padding: 0 !important; list-style: none; }
.sources li { padding: var(--space-2) 0; margin: 0 !important; border-top: 1px solid var(--line); font: 400 14px/1.55 var(--font-sans) !important; color: var(--ink-2); }
.sources li:last-child { border-bottom: 1px solid var(--line); }
.sources .k { display: inline-block; min-width: 76px; font: 600 10.5px/1.4 var(--font-sans); letter-spacing: .06em; text-transform: uppercase; color: var(--ink-3); }

/* responsive figure variants: a wide drawing for desktop, a narrow one for phones */
.only-narrow { display: none !important; }
@media (max-width: 600px) { .only-wide { display: none !important; } .only-narrow { display: block !important; } }
.svg-narrow { max-width: 520px; margin: 0 auto; }

/* vertical timeline, in real text */
.tl { list-style: none; margin: 0 !important; padding: 0 !important; position: relative; }
.tl::before { content: ""; position: absolute; left: 5px; top: 8px; bottom: 8px; width: 2px; background: var(--line-strong); }
.tl li { position: relative; margin: 0 !important; padding: 0 0 var(--space-5) 28px; }
.tl li:last-child { padding-bottom: 0; }
.tl li::before { content: ""; position: absolute; left: 0; top: 6px; width: 12px; height: 12px; border-radius: 50%; background: var(--ground); border: 2px solid var(--ink); }
.tl li.is-key::before { background: var(--for); border-color: var(--for); }
.tl li.is-future::before { border-style: dashed; border-color: var(--ink-3); }
.tl__d { display: block; font: 500 12px/1.5 var(--font-mono); color: var(--ink-3); }
.tl__t { display: block; font: 400 16px/1.5 var(--font-serif); color: var(--ink); }
.tl__s { display: block; font: 400 13.5px/1.5 var(--font-sans); color: var(--ink-2); margin-top: 2px; }

/* "recommended, not yet law" card */
.rec { border: 1px solid var(--ink); border-radius: var(--radius-lg); overflow: hidden; }
.rec__h { display: flex; flex-wrap: wrap; align-items: baseline; justify-content: space-between; gap: var(--space-2); padding: var(--space-4) var(--space-5); border-bottom: 1px solid var(--line); background: var(--surface); }
.rec__h b { font: 600 15px/1.3 var(--font-sans); color: var(--ink); }
.rec__h span { font: 500 11.5px/1.3 var(--font-mono); color: var(--ink-3); }
.rec ol { list-style: none; margin: 0 !important; padding: 0 !important; counter-reset: rec; }
.rec li { counter-increment: rec; display: grid; grid-template-columns: 32px 1fr auto; gap: var(--space-3); align-items: baseline; padding: var(--space-3) var(--space-5); border-top: 1px solid var(--line); margin: 0 !important; font: 400 15.5px/1.5 var(--font-serif) !important; color: var(--ink) !important; }
.rec li:first-child { border-top: 0; }
.rec li::before { content: counter(rec, decimal-leading-zero); font: 500 12px/1.9 var(--font-mono); color: var(--ink-3); }
.rec li .cite { font-size: 11.5px; color: var(--ink-3); }
@media (max-width: 560px) { .rec li { grid-template-columns: 28px 1fr; } .rec li .cite { grid-column: 2; } .rec__h, .rec li { padding-left: var(--space-4); padding-right: var(--space-4); } }

/* numbered pins sit in the figure's left margin, never over the text */
.mock__body { padding-left: 44px; }
.pinned > .pin { left: -30px; top: 0; }
@media (max-width: 560px) { .mock__body { padding-left: 38px; } .pinned > .pin { left: -28px; } }


/* ---------- tables: the live site's box. Wide tables scroll inside it, never the page ---------- */
.tbl { margin: var(--space-6) 0 var(--space-8); overflow-x: auto; border: 1px solid var(--line); border-radius: var(--radius-lg); background: var(--ground); -webkit-overflow-scrolling: touch; }
.tbl table { width: 100%; min-width: 520px; border-collapse: collapse; font: 400 14px/1.55 var(--font-sans); color: var(--ink-2); }
.tbl + .tbl__cap { margin: -20px 0 var(--space-8); font: 400 12.5px/1.5 var(--font-sans); color: var(--ink-3); }
.tbl th, .tbl td { padding: 10px 14px; text-align: left; vertical-align: top; border-top: 1px solid var(--line); }
.tbl thead tr:first-child > th, .tbl thead tr:first-child > td, .tbl > table > tbody:first-child > tr:first-child > th, .tbl > table > tbody:first-child > tr:first-child > td { border-top: 0; }
.tbl thead th { font-weight: 600; color: var(--ink); background: var(--for-tint); vertical-align: bottom; }
.tbl tbody th { font-weight: 600; color: var(--ink); }
.tbl td b, .tbl td strong { color: var(--ink); font-weight: 600; }
.tbl .nw { white-space: nowrap; }
.tbl td.num, .tbl th.num { text-align: right; font-family: var(--font-mono); font-variant-numeric: tabular-nums; white-space: nowrap; }
.tbl .mono { font-size: 13px; color: var(--ink); white-space: nowrap; }
.tbl--wide table { min-width: 680px; }
.tbl--cols table { min-width: calc(var(--cols) * 150px); }

/* ---------- the way back: the live site's closing navy band, in the column ---------- */
.cta { margin: var(--space-12) 0 0; padding: var(--space-8); background: var(--navy); border-radius: var(--radius-lg); }
.cta h2 { margin: 0 0 var(--space-3) !important; padding: 0 !important; border: 0 !important; font: 500 clamp(24px, 3vw, 30px)/1.15 var(--font-serif) !important; letter-spacing: -.015em; color: var(--on-navy) !important; }
.cta p { margin: 0 0 var(--space-6) !important; font: 400 16.5px/1.6 var(--font-sans) !important; color: color-mix(in srgb, var(--on-navy) 78%, transparent) !important; }
.cta__acts { display: flex; flex-wrap: wrap; gap: 10px; }
.cta__btn { display: inline-flex; align-items: center; justify-content: center; height: 46px; padding: 0 20px; border: 1px solid var(--on-navy); border-radius: var(--radius-sm); background: var(--on-navy); color: var(--navy) !important; font: 600 15px/1 var(--font-sans); text-decoration: none !important; white-space: nowrap; }
.cta__btn:hover { filter: brightness(.94); }
.cta__btn--ghost { background: transparent; color: var(--on-navy) !important; border-color: color-mix(in srgb, var(--on-navy) 40%, transparent); }
.cta__btn--ghost:hover { filter: none; background: color-mix(in srgb, var(--on-navy) 10%, transparent); }
.cta a:focus-visible { box-shadow: 0 0 0 2px var(--navy), 0 0 0 4px var(--on-navy); }
@media (max-width: 560px) { .cta { padding: var(--space-6); } .cta__acts .cta__btn { flex: 1 1 100%; } }

/* ---------- related ---------- */
.related { margin-top: var(--space-12); padding-top: var(--space-6); border-top: 1px solid var(--line); }
.related h2 { margin: 0 0 var(--space-4) !important; padding: 0 !important; border: 0 !important; font: 600 11px/1.3 var(--font-sans) !important; letter-spacing: .06em; text-transform: uppercase; color: var(--ink-3) !important; }
.related ul { list-style: none; padding: 0 !important; margin: 0 !important; }
.related li { margin: 0 0 var(--space-4) !important; }
.related a { font: 500 20px/1.35 var(--font-serif); color: var(--ink); text-decoration: none; }
.related a:hover { text-decoration: underline; text-decoration-color: var(--for); }
.related span { display: block; margin-top: 2px; font: 400 14px/1.5 var(--font-sans); color: var(--ink-3); }

/* ---------- /learn/ index and the 404 page ---------- */
.lx-hero__lede { margin: 0; max-width: 620px; font: 400 19px/1.6 var(--font-sans); color: var(--ink-2); text-wrap: pretty; }
.lx-hero__acts { display: flex; flex-wrap: wrap; gap: 10px; margin-top: var(--space-6); }
.lx-jump { display: flex; flex-wrap: wrap; gap: 8px; margin: var(--space-6) 0 0; padding: 0; list-style: none; }
.lx-jump a { display: inline-flex; align-items: center; min-height: 36px; padding: 0 14px; border: 1px solid var(--line-strong); border-radius: var(--radius-pill); font: 500 13.5px/1 var(--font-sans); color: var(--ink-2); text-decoration: none; }
.lx-jump a:hover { background: var(--surface); color: var(--ink); }
.lx-sec { padding: 56px 0 0; scroll-margin-top: 16px; }
.lx-sec:first-child { padding-top: 8px; }
.lx-sec__h { display: flex; align-items: baseline; gap: var(--space-3); margin: 0 0 var(--space-6); }
.lx-sec__h h2 { margin: 0; font: 500 clamp(24px, 2.6vw, 32px)/1.12 var(--font-serif); letter-spacing: -.015em; color: var(--ink); }
.lx-sec__n { font: 400 12px/1.4 var(--font-mono); color: var(--ink-3); }
.lx-cards { display: grid; grid-template-columns: repeat(auto-fill, minmax(min(100%, 320px), 1fr)); gap: 20px; list-style: none; margin: 0; padding: 0; }
.lx-card { position: relative; display: flex; flex-direction: column; gap: 10px; height: 100%; padding: 22px 24px; border: 1px solid var(--line); border-radius: var(--radius-lg); background: var(--ground); }
.lx-card:hover, .lx-card:focus-within { border-color: var(--for-line); background: var(--for-tint); }
.lx-card__e { margin: 0; font: 600 11px/1.3 var(--font-sans); letter-spacing: .06em; text-transform: uppercase; color: var(--for-text); }
.lx-card__t { margin: 0; font: 500 22px/1.25 var(--font-serif); letter-spacing: -.01em; }
.lx-card__t a { color: var(--ink); text-decoration: none; }
.lx-card__t a::after { content: ""; position: absolute; inset: 0; border-radius: var(--radius-lg); }
.lx-card__t a:focus-visible { box-shadow: none; }
.lx-card:has(.lx-card__t a:focus-visible) { box-shadow: var(--shadow-focus); }
.lx-card__d { margin: 0; font: 400 14.5px/1.55 var(--font-sans); color: var(--ink-2); }
.lx-card__m { margin: auto 0 0; padding-top: var(--space-2); font: 400 12px/1.5 var(--font-mono); color: var(--ink-3); }
.lx-tag { display: inline-block; margin-left: 8px; padding: 0 6px; border-radius: 4px; background: var(--surface-2); font: 600 10.5px/1.7 var(--font-sans); letter-spacing: .04em; color: var(--ink-2); text-transform: uppercase; vertical-align: 1px; }
.lx-empty { margin: 0; padding: var(--space-8); border: 1px dashed var(--line-strong); border-radius: var(--radius-lg); background: var(--surface); }
.lx-empty h2 { margin: 0 0 var(--space-2); font: 500 24px/1.25 var(--font-serif); color: var(--ink); }
.lx-empty p { margin: 0 0 var(--space-5); max-width: 560px; font: 400 16px/1.6 var(--font-sans); color: var(--ink-2); }

@media print { .nst-head, .lx-rail, .lx-toc-inline, .cta, .related, .draft-banner, .nst-foot, .lx-hero__acts { display: none; } .lx-hero { background: none; padding: 0 0 16px; } .lx-body { padding: 0; } }
@media (prefers-reduced-motion: reduce) { * { transition: none !important; animation: none !important; } }