/* A dated forecast page (scripts/forecast-page.mjs) in Object Atlas, as the Breakage Calendar it belongs
 * to. The calendar draws each break day as a steel frame; this page is the 1 November frame opened: the
 * forecast number stands in the frame in the one pale blue on the graphite field, the claim under it, the
 * headline facts beside it. On the reading sheet one ink line falls toward the date and the frozen forecast
 * stands on the date as a pale-blue range with a blue-deep bar at its point, against the dashed level of
 * "no change", the comparator we score ourselves against. */
.fc-page { padding: 0 0 var(--wp-24); }
.fc-page :where(p) { margin: 0; }
.fc-sample { background: var(--oa-blue); color: var(--oa-ground); font: 500 var(--wp-text-meta)/1.4 var(--wp-font-mono); margin: 0; padding: var(--wp-2) var(--wp-4); position: relative; z-index: 1; }

/* ---------- intro: the field and the frame ---------- */
.fc-intro {
  --steel: linear-gradient(118deg, #f1f2f0 0%, #aeb6c6 17%, #3b3e47 33%, #8f98aa 50%, #dfe5f0 62%, #5d616c 80%, #c4c9d3 100%);
  background: var(--oa-ground); box-shadow: 0 0 0 100vmax var(--oa-ground); clip-path: inset(0 -100vmax); color: var(--oa-paper);
  display: grid; gap: var(--wp-6) var(--wp-16); grid-template-columns: minmax(0, 7fr) minmax(0, 5fr); padding: var(--wp-12) 0 var(--wp-16);
}
.fc-intro :focus-visible { outline-color: var(--oa-blue); }
.fc-intro .label { color: var(--oa-muted); }
.fc-intro > .label { grid-column: 1 / -1; }
/* The kicker breaks only between its parts, never inside a date. */
.fc-seg { white-space: nowrap; }
.fc-head { display: grid; gap: var(--wp-4); min-width: 0; }
.fc-intro h1 {
  background: linear-gradient(var(--oa-ground-2), var(--oa-ground-2)) padding-box, var(--steel) border-box;
  border: 14px solid transparent; border-radius: 30px; margin: 0; padding: var(--wp-6) var(--wp-8) var(--wp-8);
}
.fc-num { display: block; font: 500 clamp(6rem, 12vw, 11rem)/.86 var(--oa-font-display); font-variant-numeric: tabular-nums; letter-spacing: -.06em; }
.fc-point { color: var(--oa-blue); }
.fc-claim { color: var(--oa-paper); display: block; font: 600 clamp(1.375rem, 2.1vw, 1.75rem)/1.25 var(--oa-font-body); letter-spacing: -.01em; margin-top: var(--wp-6); max-width: 24em; text-wrap: balance; }
.fc-frame { color: var(--oa-muted); font-size: var(--wp-text-meta); line-height: 1.5; max-width: 46em; padding-inline: var(--wp-2); }
.fc-frame .label { color: var(--oa-paper); margin-right: var(--wp-2); }
/* Scored: what we said beside what it was, the same size so the gap reads true; the frozen claim
 * stays word for word under the number it now describes. */
.fc-intro h1.fc-scored { align-items: end; display: flex; flex-wrap: wrap; gap: var(--wp-4) clamp(1.5rem, 4vw, 4rem); }
.fc-said, .fc-was { display: grid; gap: var(--wp-3); }
.fc-scored .fc-claim { flex: 1 0 100%; }
.fc-said .fc-num { color: var(--oa-muted); }
.fc-scored .fc-num { font-size: clamp(5rem, 9vw, 8.5rem); }
.fc-said .label, .fc-was .label { color: var(--oa-paper); }
.fc-facts { align-self: end; display: grid; gap: 0; }
.fc-facts p { align-items: baseline; border-top: 1px solid var(--oa-line); display: grid; gap: var(--wp-1) var(--wp-4); grid-template-columns: minmax(0, 1fr) auto; padding: var(--wp-3) 0; }
.fc-facts p:first-child { border-top-color: var(--oa-paper); }
.fc-facts .label { grid-column: 1 / -1; }
.fc-fact { font: 500 2.75rem/1 var(--oa-font-display); font-variant-numeric: tabular-nums; letter-spacing: -.045em; }
.fc-fact-note { color: var(--oa-muted); font-size: var(--wp-text-meta); text-align: right; }
/* Research's scope for the maintained number: a full-width note under the number, read left to right. */
.fc-fact-qual { color: var(--oa-muted); font-size: var(--wp-text-meta); grid-column: 1 / -1; line-height: 1.5; max-width: 60ch; text-wrap: pretty; }
.fc-facts p:last-child:nth-child(odd) { grid-column: 1 / -1; }
/* The follow line sits under the facts in their column: the score lands on this page; the link is the way to follow. */
.fc-follow { border-top: 1px solid var(--oa-line); color: var(--oa-muted); font-size: var(--wp-text-meta); grid-column: 2; line-height: 1.5; margin-top: calc(-1 * var(--wp-6)) !important; padding-top: var(--wp-3); text-wrap: balance; }
.fc-follow a { color: var(--oa-paper); font-weight: 600; text-decoration-color: var(--oa-blue); text-decoration-thickness: 2px; text-underline-offset: .2em; }
.fc-follow a:hover { text-decoration-thickness: 3px; }
.fc-email { scroll-margin-top: var(--wp-6); }

/* ---------- the scored result, above the unchanged forecast ---------- */
.fc-outcome { border-left: 6px solid var(--oa-blue-deep); display: grid; gap: var(--wp-3); margin-top: var(--wp-12); padding: var(--wp-2) 0 var(--wp-2) var(--wp-6); }
.fc-outcome h2 { margin: 0; }
.fc-verdict { display: block; font: 500 clamp(2.5rem, 5vw, 4rem)/1 var(--oa-font-display); letter-spacing: -.045em; }
.fc-turn { display: block; font: 600 clamp(1.375rem, 2.2vw, 1.875rem)/1.2 var(--oa-font-body); letter-spacing: -.01em; margin-top: var(--wp-2); }
.fc-outcome-line { font-size: var(--wp-text-lede); max-width: 40em; }
.fc-score { max-width: 44rem; }
.fc-score caption { color: var(--wp-muted); caption-side: bottom; font-size: var(--wp-text-meta); padding-top: var(--wp-2); text-align: left; text-wrap: pretty; }
.fc-score td.is-better { font-weight: 700; white-space: nowrap; }
.fc-score td.is-better::after { color: var(--oa-blue-deep); content: " ← better"; font: 500 var(--wp-text-cite) var(--wp-font-mono); }
.fc-cell-note { display: block; font: 500 var(--wp-text-cite) var(--wp-font-mono); }
.fc-misses-title { margin: var(--wp-4) 0 0; }
/* A miss is an open square, the calendar's mark for "no fix". */
.fc-misses { list-style: none; margin: 0; max-width: 48rem; padding: 0; }
.fc-misses li { border-bottom: 1px solid var(--wp-hair); padding: var(--wp-2) 0 var(--wp-2) var(--wp-6); position: relative; }
.fc-misses li::before { border: 2px solid var(--wp-ink); content: ""; height: .75rem; left: 0; position: absolute; top: calc(var(--wp-2) + .4em); width: .75rem; }
.fc-misses .fc-repo { font-size: inherit; font-weight: 700; }
.fc-notes { max-width: 44em; }
.fc-next { border-top: 2px solid var(--wp-ink); max-width: 48rem; padding-top: var(--wp-3); }
.fc-next .label { display: block; margin-bottom: var(--wp-1); }
.fc-mark { border: 1.5px solid var(--wp-ink); display: inline-block; font: 500 var(--wp-text-cite)/1 var(--wp-font-mono); letter-spacing: .04em; margin-left: var(--wp-2); padding: 2px 6px; text-transform: uppercase; vertical-align: 1px; white-space: nowrap; }
.fc-mark--wrong { background: var(--wp-ink); color: var(--wp-paper); }

/* ---------- sections on the sheet ---------- */
.fc-section { border-top: var(--wp-rule-strong) solid var(--wp-ink); margin-top: var(--wp-16); padding-top: var(--wp-6); }
.fc-section h2 { font: 500 var(--wp-text-title)/1.02 var(--oa-font-display); letter-spacing: -.04em; margin: 0 0 var(--wp-4); text-wrap: balance; }
.fc-section > p { max-width: 44em; }
.fc-pair { align-items: start; display: grid; gap: 0 var(--wp-16); grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); }

/* The chart: recessive grid and axes in muted ink, one 2.5px ink line, 9px points, the forecast in blue. */
.fc-figure { margin: var(--wp-4) 0 0; }
.fc-chart { display: block; height: auto; max-width: 100%; overflow: visible; width: 100%; }
.fc-grid { stroke: var(--wp-hair); stroke-width: 1; }
.fc-date { stroke: var(--wp-ink); stroke-dasharray: 3 5; stroke-width: 1; }
.fc-axis { fill: var(--wp-muted); font: 500 13px var(--wp-font-mono); }
.fc-line { fill: none; stroke: var(--wp-ink); stroke-linejoin: round; stroke-width: 2.5; }
.fc-dot { fill: var(--wp-ink); stroke: var(--wp-paper); stroke-width: 2; }
.fc-dot:hover { r: 7; }
.fc-band { fill: var(--wp-cited); stroke: var(--oa-blue-deep); stroke-width: 1.5; }
.fc-key { fill: var(--oa-blue-deep); }
.fc-obs { fill: var(--wp-paper); stroke: var(--wp-ink); stroke-width: 3; }
.fc-label { fill: var(--wp-ink); font: 600 16px var(--oa-font-body); }
.fc-label--fc { fill: var(--oa-blue-deep); }
.fc-axis--ink { fill: var(--wp-ink); }
.fc-nochange { stroke: var(--wp-ink); stroke-dasharray: 8 6; stroke-width: 1.5; }
.fc-case { stroke: var(--wp-ink); stroke-width: 2; }
.fc-freeze { stroke: var(--wp-ink); stroke-width: 3; }
/* The floor: images that cannot be fixed in time, drawn as hatched ground under the line. The hatch
   comes from the pattern's fill attribute, so .fc-floor sets no fill. */
.fc-floor-tint { fill: var(--wp-hair); opacity: .45; }
.fc-hatch { stroke: var(--wp-ink); stroke-opacity: .28; stroke-width: 1.5; }
.fc-floor-top { stroke: var(--wp-ink); stroke-width: 2.5; }
.fc-floor-text { paint-order: stroke; stroke: var(--wp-paper); stroke-linejoin: round; stroke-width: 6px; }
.fc-chart--n { display: none; }
.fc-chart--n .fc-axis { font-size: 19px; }
.fc-chart--n .fc-label { font-size: 23px; }
.fc-figure figcaption { color: var(--wp-muted); font-size: var(--wp-text-meta); margin-top: var(--wp-3); max-width: 60em; }

/* The cases: chance as a bar on the sheet, the count in display figures. Signals: a square per dated
 * event, outlined while we wait, filled in blue-deep once it has happened (the calendar's tested mark). */
.fc-cases { display: grid; gap: var(--wp-4); list-style: none; margin: var(--wp-6) 0 0; max-width: 60rem; padding: 0; }
.fc-cases li { align-items: baseline; display: grid; gap: var(--wp-2) var(--wp-4); grid-template-columns: 4.5rem minmax(0, 1fr) auto; }
.fc-case-p, .fc-case-n { font: 500 2rem/1 var(--oa-font-display); letter-spacing: -.04em; }
.fc-case-n { color: var(--oa-blue-deep); }
.fc-case-bar { display: block; fill: var(--wp-ink); grid-column: 2 / -1; height: 6px; width: 100%; }
.fc-case-track { fill: var(--wp-hair); }
.fc-watch-title { margin: var(--wp-8) 0 var(--wp-3); }
.fc-watch { list-style: none; margin: 0; max-width: 60rem; padding: 0; }
.fc-watch li { align-items: baseline; border-bottom: 1px solid var(--wp-hair); display: grid; gap: 2px var(--wp-3); grid-template-columns: 1rem minmax(0, 1fr) auto; padding: var(--wp-2) 0; }
.fc-stone { align-self: center; border: 2px solid var(--wp-ink); height: .75rem; width: .75rem; }
.fc-watch .is-done .fc-stone { background: var(--oa-blue-deep); border-color: var(--oa-blue-deep); }
.fc-watch-state { color: var(--wp-muted); font: 500 var(--wp-text-meta) var(--wp-font-mono); }
.fc-watch .is-done .fc-watch-state { color: var(--wp-ink); }

/* Who fixed it: a dated ledger, newest first, naming the people who acted. Deliberate fixes lead, on the
   calendar's tested-fix ground; each kind is headed once, so rows carry no tag. */
.fc-ledger-h { align-items: baseline; border-bottom: var(--wp-rule-strong) solid var(--wp-ink); display: flex; font: 500 var(--wp-text-cite)/1 var(--wp-font-mono); gap: var(--wp-2); letter-spacing: .06em; margin: var(--wp-6) 0 0; padding: 0 0 var(--wp-2); text-transform: uppercase; }
.fc-ledger-h span { font: 500 1.5rem/1 var(--oa-font-display); letter-spacing: -.03em; }
.fc-ledger-h.fc-kind--deliberate { background: var(--wp-cited); border-bottom-color: var(--oa-blue-deep); box-shadow: inset 4px 0 0 var(--oa-blue-deep); padding: var(--wp-2) var(--wp-3) var(--wp-2) var(--wp-4); }
.fc-ledger { list-style: none; margin: 0; padding: 0; }
.fc-ledger li { border-bottom: 1px solid var(--wp-hair); display: grid; gap: 2px var(--wp-4); grid-template-columns: 4.5rem minmax(0, 1fr) auto; padding: var(--wp-3) 0; position: relative; }
.fc-ledger time { font: 500 1.375rem/1 var(--oa-font-display); grid-column: 1; grid-row: 1 / span 3; letter-spacing: -.03em; }
/* Same day as the row above: still read out, not drawn again. */
.fc-ledger time.fc-again { clip-path: inset(50%); height: 1px; overflow: hidden; position: absolute; white-space: nowrap; width: 1px; }
.fc-repo { font: 500 var(--wp-text-ledger)/1.4 var(--wp-font-mono); grid-column: 2; overflow-wrap: anywhere; }
.fc-who { font-weight: 600; grid-column: 2; }
.fc-how { color: var(--wp-muted); font-size: var(--wp-text-meta); grid-column: 2; margin: 0; overflow-wrap: anywhere; }
.fc-how summary { cursor: pointer; font: 500 var(--wp-text-cite)/1.6 var(--wp-font-mono); letter-spacing: .04em; text-transform: uppercase; width: fit-content; }
.fc-how p { margin: var(--wp-1) 0 0; }
.fc-ledger a { align-self: start; grid-column: 3; grid-row: 1; font-size: var(--wp-text-meta); }
.fc-ledger--rebuild li { padding: var(--wp-2) 0; }
.fc-ledger--rebuild .fc-who { font-weight: 400; }
.fc-earlier > summary { border-bottom: 1px solid var(--wp-hair); cursor: pointer; font: 500 var(--wp-text-cite)/1.6 var(--wp-font-mono); letter-spacing: .04em; padding: var(--wp-3) 0; text-transform: uppercase; }
.fc-earlier[open] > summary { border-bottom-color: var(--wp-ink); }
/* A rebuild row keeps Evidence beside the name on phones too, down to 375 px; narrower, it drops below. */
@media (min-width: 375px) and (max-width: 600px) { .fc-ledger.fc-ledger--rebuild a { grid-column: 3; grid-row: 1; } }
.fc-empty { color: var(--wp-muted); }

/* Check your own images: where the wrong copies sit in the images wrong at freeze. Ink is what the OS
 * check cannot see, blue-deep what it flags but its fix leaves behind, hair what the package update fixes;
 * the bracket spans the first two, the number above it. */
.fc-split { margin: var(--wp-6) 0 var(--wp-6); max-width: 60rem; }
.fc-split-out { font: 600 var(--wp-text-lede)/1.35 var(--wp-font-body); max-width: 40em; }
.fc-split-out .fc-fact { color: var(--oa-blue-deep); margin-right: var(--wp-1); }
.fc-split-bar { display: block; height: 40px; margin-top: var(--wp-2); width: 100%; }
.fc-split-bar rect { stroke: var(--wp-paper); stroke-width: 3px; vector-effect: non-scaling-stroke; }
.fc-split-brace { fill: none; stroke: var(--wp-ink); stroke-width: 2px; vector-effect: non-scaling-stroke; }
.fc-split--none { background: var(--wp-ink); fill: var(--wp-ink); }
.fc-split--mixed { background: var(--oa-blue-deep); fill: var(--oa-blue-deep); }
.fc-split--os { background: var(--wp-hair); fill: var(--wp-hair); }
.fc-split-key { display: grid; gap: var(--wp-2) var(--wp-6); grid-template-columns: repeat(3, minmax(0, 1fr)); list-style: none; margin: var(--wp-3) 0 0; padding: 0; }
.fc-split-key li { font-size: var(--wp-text-meta); line-height: 1.45; padding-left: calc(.875rem + var(--wp-2)); position: relative; text-wrap: pretty; }
.fc-split-swatch { height: .875rem; left: 0; position: absolute; top: .2em; width: .875rem; }
.fc-split-swatch.fc-split--os { box-shadow: inset 0 0 0 1.5px var(--wp-ink); }
.fc-split-n { font: 500 1.25rem/1 var(--oa-font-display); letter-spacing: -.03em; margin-right: 2px; }
.fc-check-body { max-width: 44em; }
.fc-check-body code { overflow-wrap: anywhere; }
.fc-aside { border-left: 3px solid var(--oa-blue-deep); color: var(--wp-muted); font-size: var(--wp-text-meta); margin-top: var(--wp-3) !important; padding-left: var(--wp-3); }

.fc-page table.fc-table { border: 0; min-width: 0; }
.fc-table { border-collapse: collapse; font-size: var(--wp-text-ledger); margin-top: var(--wp-4); width: 100%; }
.fc-table th, .fc-table td { border-bottom: 1px solid var(--wp-hair); padding: var(--wp-2) var(--wp-4) var(--wp-2) 0; text-align: left; vertical-align: top; }
.fc-table thead th { border-bottom: var(--wp-rule-strong) solid var(--wp-ink); color: var(--wp-muted); font: 500 var(--wp-text-cite)/1.3 var(--wp-font-mono); letter-spacing: .06em; text-transform: uppercase; }
.fc-table tbody th { font-family: var(--wp-font-mono); font-weight: 500; }
.fc-table td { font-variant-numeric: tabular-nums; }
.fc-table :is(th, td):last-child { padding-right: 0; }
.fc-table td.is-fixed { font-weight: 700; }
.fc-table td.is-fixed::before { background: var(--oa-blue-deep); content: ""; display: inline-block; height: .75rem; margin-right: var(--wp-2); vertical-align: -1px; width: .75rem; }
.fc-daily { max-width: 48rem; }
/* "Not fixed" and "Fixed 27 Oct" stay on one line from 375 px; the right/wrong mark may drop below them. */
@media (min-width: 375px) { .fc-calls-t .fc-nw, .fc-calls-t td:last-child { white-space: nowrap; } }

/* The weekly email on the sheet: a panel under the method, as in the guides; one field, the button beside it
 * on wide screens and under it on phones (scripts/value-capture.mjs signupForm). */
.fc-method .mq-signup { background: var(--wp-panel); border: var(--wp-rule) solid var(--wp-ink); display: grid; gap: var(--wp-3); margin-top: var(--wp-6); max-width: 40rem; padding: var(--wp-6); }
.fc-method .mq-signup p { margin: 0; max-width: 50ch; }
.fc-method .mq-signup-title { font: 500 1.625rem/1.1 var(--oa-font-display); letter-spacing: -.035em; text-wrap: balance; }
.fc-method .mq-signup-label { font-weight: 600; line-height: 1.25; margin-bottom: -.25rem; }
.fc-method .mq-signup-row { display: flex; flex-wrap: wrap; gap: var(--wp-2); }
.fc-method .mq-signup-row input { background: var(--wp-paper); border: 2px solid var(--wp-ink); border-radius: var(--wp-pill); color: var(--wp-ink); flex: 1 1 14rem; font: inherit; min-height: var(--wp-tap); min-width: 0; padding: 0 1.125rem; }
.fc-method form.mq-signup .mq-signup-row button { background: var(--wp-bio); border: 2px solid var(--wp-bio); border-radius: var(--wp-pill); color: var(--wp-on-bio); cursor: pointer; flex: 0 0 auto; font: 600 1rem/1.3 var(--wp-font-body); min-height: var(--wp-tap); padding: 0 1.25rem; }
.fc-method form.mq-signup .mq-signup-row button:hover { background: var(--oa-blue-deep); border-color: var(--oa-blue-deep); }
.fc-method .mq-signup-copy, .fc-method .mq-signup-fine { color: var(--wp-muted); }
.fc-method .mq-signup-fine { font-size: .9375rem; line-height: 1.5; overflow-wrap: anywhere; }
.fc-method .mq-signup-fine a { color: inherit; }

/* ---------- the frozen method (scripts/forecast-method.mjs): a document, set for reading ----------
 * The graphite field holds the title and the document's own front lines; on the sheet a sections list sits
 * beside one reading column at desktop and above it on a phone. Numbered steps hang their numbers
 * in the margin in mono, so a reader can cite "step 3" at a glance. */
.fm-intro { background: var(--oa-ground); box-shadow: 0 0 0 100vmax var(--oa-ground); clip-path: inset(0 -100vmax); color: var(--oa-paper); display: grid; gap: var(--wp-4) var(--wp-16); grid-template-columns: minmax(0, 7fr) minmax(0, 5fr); padding: var(--wp-16) 0; }
.fm-intro > .label { color: var(--oa-muted); grid-column: 1 / -1; }
.fm-intro h1 { font: 500 clamp(2.75rem, 5.6vw, 5.25rem)/.98 var(--oa-font-display); letter-spacing: -.05em; margin: 0; text-wrap: balance; }
.fm-front { align-self: end; color: var(--oa-muted); display: grid; font-size: var(--wp-text-meta); gap: var(--wp-3); line-height: 1.5; }
.fm-front code { font-size: .95em; }
.fm-back { grid-column: 1; }
.fm-intro a { color: var(--oa-paper); text-decoration-color: var(--oa-blue); text-decoration-thickness: 2px; text-underline-offset: 5px; }
.fm-intro :focus-visible { outline-color: var(--oa-blue); }
.fm-intro code { background: var(--oa-ground-2); border: 1px solid var(--oa-line); color: var(--oa-paper); padding: 0 4px; }
.fm-body { display: grid; gap: 0 var(--wp-16); grid-template-columns: 15rem minmax(0, 42rem); }
.fm-toc { align-self: start; margin-top: var(--wp-12); padding-top: var(--wp-8); position: sticky; top: var(--wp-4); }
.fm-toc ol { counter-reset: fm; display: grid; list-style: none; margin: var(--wp-3) 0 0; padding: 0; }
.fm-toc li { border-top: 1px solid var(--wp-hair); counter-increment: fm; }
.fm-toc li:last-child { border-bottom: 1px solid var(--wp-hair); }
.fm-toc a { align-items: baseline; color: var(--wp-ink); display: grid; gap: var(--wp-2); grid-template-columns: 1.5rem minmax(0, 1fr); line-height: 1.3; min-height: 48px; padding: var(--wp-2) 0; text-decoration: none; }
.fm-toc a::before { color: var(--wp-muted); content: counter(fm, decimal-leading-zero); font: 500 var(--wp-text-cite) var(--wp-font-mono); }
.fm-toc a:hover { text-decoration: underline; text-decoration-color: var(--oa-blue-deep); text-decoration-thickness: 2px; }
.fm-section h2 { scroll-margin-top: calc(var(--wp-8) + var(--wp-6)); }
.fm-text :where(p, li) { line-height: 1.6; text-wrap: pretty; }
.fm-text p + p, .fm-text p + .fm-list, .fm-text .fm-list + p { margin-top: var(--wp-4); }
.fm-list { display: grid; gap: var(--wp-3); margin: var(--wp-4) 0 0; padding: 0 0 0 var(--wp-8); }
ol.fm-list { counter-reset: fm-step; list-style: none; }
ol.fm-list > li { counter-increment: fm-step; position: relative; }
ol.fm-list > li::before { color: var(--oa-blue-deep); content: counter(fm-step); font: 500 .8125em/calc(1.6em / .8125) var(--wp-font-mono); top: 0; left: calc(-1 * var(--wp-8)); position: absolute; }
ul.fm-list { list-style: square; }
ul.fm-list > li::marker { color: var(--oa-blue-deep); }
.fm-text code { overflow-wrap: anywhere; }
.fm-end { margin-top: var(--wp-12) !important; }
@media (max-width: 900px) {
  .fm-intro, .fm-body { grid-template-columns: minmax(0, 1fr); }
  .fm-toc { position: static; }
  .fm-toc ol { grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); column-gap: var(--wp-6); }
  .fm-toc li:nth-last-child(2):nth-child(odd) { border-bottom: 1px solid var(--wp-hair); }
}
@media (max-width: 600px) {
  .fm-intro { padding: var(--wp-8) 0 var(--wp-12); }
  .fm-toc ol { grid-template-columns: minmax(0, 1fr); }
  .fm-toc li:nth-last-child(2):nth-child(odd) { border-bottom: 0; }
  .fm-list { padding-left: var(--wp-6); }
  ol.fm-list > li::before { left: calc(-1 * var(--wp-6)); }
}

@media (max-width: 900px) {
  .fc-intro, .fc-pair { grid-template-columns: minmax(0, 1fr); }
  .fc-follow { grid-column: 1; margin-top: 0 !important; }
  .fc-facts { grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); column-gap: var(--wp-6); }
  /* With its scope note the maintained number needs a full row; the range above it takes one too, so the
     four facts after them still pair up. */
  .fc-facts--qual p:nth-child(-n+2) { grid-column: 1 / -1; }
}
@media (max-width: 600px) {
  .fc-table { font-size: var(--wp-text-meta); }
  .fc-table th, .fc-table td { padding-right: var(--wp-2); }
  .fc-daily th, .fc-daily td { padding-right: 6px; }
  .fc-daily thead th { letter-spacing: 0; }
  .fc-daily tbody th { white-space: nowrap; }
  .fc-chart--w { display: none; }
  .fc-chart--n { display: block; }
  .fc-intro { padding: var(--wp-8) 0 var(--wp-12); }
  .fc-intro h1 { border-width: 10px; border-radius: 22px; padding: var(--wp-4) var(--wp-6) var(--wp-6); }
  .fc-point { font-size: min(34vw, 8rem); }
  /* Said and was stay side by side, the comparison the page is for; three digits each fit down to 320. */
  .fc-scored .fc-num { font-size: min(17vw, 5.5rem); }
  .fc-claim { font-size: 1.25rem; margin-top: var(--wp-4); }
  .fc-mark { margin: var(--wp-1) 0 0; }
  .fc-fact { font-size: 2.25rem; }
  .fc-fact-note { grid-column: 1 / -1; text-align: left; }
  .fc-ledger li { grid-template-columns: 3.5rem minmax(0, 1fr); }
  .fc-ledger a { grid-column: 2; grid-row: auto; }
  .fc-cases li { grid-template-columns: 3.5rem minmax(0, 1fr) auto; }
  .fc-case-p, .fc-case-n { font-size: 1.75rem; }
  .fc-case-name { font-size: var(--wp-text-meta); }
  .fc-watch li { grid-template-columns: 1rem minmax(0, 1fr); }
  .fc-watch-state { grid-column: 2; }
  .fc-split-key { grid-template-columns: minmax(0, 1fr); }
  .fc-method .mq-signup { padding: var(--wp-4); }
  .fc-method .mq-signup-row input, .fc-method form.mq-signup .mq-signup-row button { flex-basis: 100%; }
}
@media (forced-colors: active) { .fc-intro h1 { border-color: CanvasText; } }
