/* COYNTOSS · Senate forecast tracker.
   Homepage module (.fh-home) and the full readout on analysis.html (.fh-page).
   Hairlines, direct labels and type do the work; no boxes or tiles. */

.fh-home, .fh-page {
  --fh-grid: #2a2d31;
  --fh-ref: #5b6067;
  --fh-dem-wash: rgba(82, 165, 223, .07);
  --fh-rep-wash: rgba(223, 106, 100, .06);
  --fh-dem-band: rgba(82, 165, 223, .16);
}

/* ---------- shared type ---------- */

.fh-kicker {
  margin: 0 0 10px;
  color: var(--ink-soft);
  font: 700 13px/1.2 var(--sans);
  letter-spacing: .01em;
}
.fh-kicker a { color: inherit; text-decoration: none; }
.fh-kicker a:hover { text-decoration: underline; text-underline-offset: 3px; }
.fh-figure-title {
  margin: 0 0 6px;
  color: var(--ink);
  font: 700 14px/1.3 var(--sans);
}
.fh-note {
  margin: 10px 0 0;
  color: var(--muted);
  font: 400 12.5px/1.45 var(--sans);
}
.fh-dem { color: var(--blue); }
.fh-rep { color: var(--red); }
.fh-even { color: var(--ink-soft); }
.fh-num { text-align: right; font-variant-numeric: tabular-nums; white-space: nowrap; }

/* ---------- charts ---------- */

.fh-chart-wrap { position: relative; outline: none; }
.fh-chart-wrap:focus-visible { outline: 2px solid var(--focus); outline-offset: 6px; }
.fh-chart { display: block; width: 100%; height: auto; overflow: visible; font-family: var(--sans); }
.fh-grid { stroke: var(--fh-grid); stroke-width: 1; shape-rendering: crispEdges; }
.fh-grid--ref { stroke: var(--fh-ref); stroke-dasharray: 3 3; }
.fh-baseline { stroke: var(--fh-ref); stroke-width: 1; shape-rendering: crispEdges; }
.fh-axis { fill: var(--muted); font-size: 12px; font-variant-numeric: tabular-nums; }
.fh-axis--ref { fill: var(--ink-soft); font-size: 11.5px; }
.fh-xtick { stroke: var(--fh-ref); stroke-width: 1; }
.fh-gap { fill: none; }
.fh-gap-label { fill: var(--muted-light); font-size: 11.5px; font-style: italic; }
.fh-line { fill: none; stroke-width: 2.5; stroke-linecap: round; stroke-linejoin: round; }
.fh-line--dem { stroke: var(--blue); }
.fh-line--rep { stroke: var(--red); }
.fh-line--gap { stroke-width: 1.6; stroke-dasharray: 2 5; opacity: .85; }
.fh-tick { stroke: none; }
.fh-tick--dem { fill: var(--blue); }
.fh-tick--rep { fill: var(--red); }
.fh-end { stroke: var(--paper); stroke-width: 2; }
.fh-end--dem { fill: var(--blue); }
.fh-end--rep { fill: var(--red); }
.fh-end--even { fill: var(--neutral); }
.fh-endlabel__value { font-size: 17px; font-weight: 700; font-variant-numeric: tabular-nums; }
.fh-endlabel__name { font-size: 12px; }
.fh-endlabel--dem text { fill: var(--blue); }
.fh-endlabel--rep text { fill: var(--red); }
.fh-band--dem { fill: var(--fh-dem-band); }
.fh-band-label { fill: var(--muted); font-size: 11.5px; font-variant-numeric: tabular-nums; }
.fh-hit { fill: transparent; cursor: crosshair; }
.fh-cursor__rule { stroke: var(--ink-soft); stroke-width: 1; shape-rendering: crispEdges; }

.fh-readout {
  position: absolute;
  z-index: 3;
  min-width: 150px;
  padding: 9px 11px 8px;
  border: 1px solid var(--rule);
  background: #191b1e;
  box-shadow: 0 6px 18px rgba(0, 0, 0, .35);
  pointer-events: none;
  font-family: var(--sans);
}
.fh-readout p { margin: 0; }
.fh-readout__date { margin-bottom: 5px !important; color: var(--ink); font-size: 12.5px; font-weight: 700; }
.fh-readout__row { display: flex; justify-content: space-between; gap: 18px; font-size: 13px; line-height: 1.5; }
.fh-readout__row strong { font-variant-numeric: tabular-nums; }
.fh-readout__row--dem { color: var(--blue); }
.fh-readout__row--rep { color: var(--red); }
.fh-readout__note { margin-top: 5px !important; color: var(--muted); font-size: 11.5px; }

/* ---------- race shift rows ---------- */

.fh-shift-list { font-family: var(--sans); }
.fh-shift-head, .fh-shift-axis, .fh-shift-row {
  display: grid;
  grid-template-columns: minmax(150px, 210px) minmax(220px, 1fr) 62px 66px 128px 70px;
  align-items: center;
  column-gap: 16px;
}
.fh-shift-head {
  padding-bottom: 6px;
  border-bottom: 1px solid var(--ink);
  color: var(--muted);
  font-size: 11.5px;
  font-weight: 700;
}
.fh-shift-head .fh-c2, .fh-shift-head .fh-c3, .fh-shift-head .fh-c5 { text-align: right; }
.fh-shift-axis { height: 26px; }
.fh-shift-axis__spacer { grid-column: 1; }
.fh-shift-axis__scale { position: relative; grid-column: 2; height: 100%; }
.fh-shift-axis__tick {
  position: absolute;
  bottom: 5px;
  transform: translateX(-50%);
  color: var(--muted);
  font-size: 11px;
  font-variant-numeric: tabular-nums;
  white-space: nowrap;
}
.fh-shift-axis__tick:first-child { transform: none; }
.fh-shift-axis__tick:last-child { transform: translateX(-100%); }

.fh-shift-row {
  min-height: 36px;
  border-bottom: 1px solid var(--rule-faint);
  color: var(--ink);
  text-decoration: none;
  font-size: 14px;
}
.fh-shift-row:hover, .fh-shift-row:focus-visible { background: rgba(255, 255, 255, .035); }
.fh-shift-row:focus-visible { outline: 2px solid var(--focus); outline-offset: -2px; }
.fh-shift-row__name { display: flex; flex-direction: column; min-width: 0; padding: 5px 0; font-weight: 600; line-height: 1.2; }
.fh-shift-row__name small { overflow: hidden; color: var(--muted); font-size: 11.5px; font-weight: 400; text-overflow: ellipsis; white-space: nowrap; }
.fh-shift-row__value, .fh-shift-row__delta, .fh-shift-row__prob { text-align: right; font-variant-numeric: tabular-nums; white-space: nowrap; }
.fh-shift-row__value { font-weight: 700; }
.fh-shift-row__delta { font-size: 13px; }
.fh-shift-row__delta.fh-even { color: var(--muted); }
.fh-shift-row__prob { color: var(--ink-soft); font-size: 13px; }
.fh-shift-row__rating { font-size: 13px; white-space: nowrap; }
.fh-shift-row__rating.fh-strength-4, .fh-shift-row__rating.fh-strength-3 { opacity: .78; }
.fh-shift-row__rating s { margin-right: 2px; color: var(--muted); text-decoration-thickness: 1px; }
.fh-shift-row.is-rerated .fh-shift-row__rating { font-weight: 700; }
.fh-shift-divider {
  padding: 18px 0 6px;
  border-bottom: 1px solid var(--rule);
  color: var(--muted);
  font-size: 11.5px;
  font-weight: 700;
}

.fh-track { position: relative; display: block; height: 22px; }
.fh-track i { position: absolute; display: block; }
.fh-track__zero { top: 0; bottom: 0; left: 50%; width: 1px; background: var(--fh-ref); }
.fh-track__bar { top: 50%; height: 3px; margin-top: -1.5px; border-radius: 2px; opacity: .55; }
.fh-track__bar--dem { background: var(--blue); }
.fh-track__bar--rep { background: var(--red); }
.fh-track__from, .fh-track__to { top: 50%; width: 11px; height: 11px; margin: -5.5px 0 0 -5.5px; border-radius: 50%; }
.fh-track__from { border: 1.5px solid var(--ink-soft); background: var(--paper); }
.fh-track__to { border: 2px solid var(--paper); width: 13px; height: 13px; margin: -6.5px 0 0 -6.5px; }
.fh-track__to--dem { background: var(--blue); }
.fh-track__to--rep { background: var(--red); }
.fh-track__to--even { background: var(--neutral); }

/* compact variant (homepage rail) */
.fh-shift-axis--compact, .fh-shift-row--compact { grid-template-columns: 112px minmax(120px, 1fr) 56px; column-gap: 12px; }
.fh-shift-list--compact { border-top: 1px solid var(--ink); }
.fh-shift-row--compact { min-height: 31px; font-size: 13.5px; }
.fh-shift-row--compact .fh-shift-row__name { font-weight: 600; }

/* ---------- toggles ---------- */

.fh-controls { display: flex; flex-wrap: wrap; gap: 10px 26px; align-items: center; justify-content: flex-end; }
.fh-toggle { display: flex; flex-wrap: wrap; align-items: baseline; gap: 4px 12px; font-family: var(--sans); }
.fh-toggle__label { color: var(--muted); font-size: 12px; }
.fh-toggle__buttons { display: inline-flex; flex-wrap: wrap; gap: 4px 14px; }
.fh-toggle button {
  min-height: 32px;
  padding: 4px 0;
  border: 0;
  border-bottom: 2px solid transparent;
  background: none;
  color: var(--ink-soft);
  cursor: pointer;
  font-size: 13px;
  font-weight: 600;
}
.fh-toggle button:hover { color: var(--ink); }
.fh-toggle button[aria-pressed="true"] { border-bottom-color: var(--ink); color: var(--ink); }

/* ================= Homepage module ================= */

.fh-home { margin-top: 56px; padding-top: 22px; border-top: 2px solid var(--ink); }
.fh-home__head { max-width: 760px; }
.fh-home__head h2 { margin: 0; font-family: var(--serif) !important; font-size: clamp(1.75rem, 2.8vw, 2.35rem); line-height: 1.08; }
.fh-home__head h2 a { color: inherit; text-decoration: none; }
.fh-home__head h2 a:hover { text-decoration: underline; text-decoration-thickness: 2px; text-underline-offset: 5px; }
.fh-home__dek { margin: 12px 0 0; color: var(--ink-soft); font-family: var(--serif) !important; font-size: 1.08rem; line-height: 1.5; }
.fh-home__body {
  display: grid;
  grid-template-columns: minmax(0, 1.5fr) minmax(320px, 1fr);
  gap: 48px;
  margin-top: 26px;
}
.fh-home__figure { min-width: 0; margin: 0; }
.fh-home__figure .fh-figure-title { padding-bottom: 10px; border-bottom: 1px solid var(--ink); margin-bottom: 14px; }
.fh-home__rail { min-width: 0; }
.fh-home__rail .fh-figure-title { margin-bottom: 0; padding-bottom: 10px; }
.fh-home__foot {
  display: flex;
  flex-wrap: wrap;
  align-items: baseline;
  justify-content: space-between;
  gap: 8px 24px;
  margin-top: 22px;
  padding-top: 12px;
  border-top: 1px solid var(--rule);
}
.fh-home__foot .fh-note { margin: 0; }
.fh-more { color: var(--ink); font: 700 14px/1.3 var(--sans); text-decoration: underline; text-decoration-thickness: 1px; text-underline-offset: 4px; }
.fh-more:hover { text-decoration-thickness: 2px; }

/* ================= Analysis page readout ================= */

.fh-page { padding-bottom: 72px; }
.fh-masthead { max-width: 820px; padding: 52px 0 30px; text-align: center; }
.fh-masthead .fh-kicker { color: var(--blue); }
.fh-masthead h1 { margin: 0; font-size: clamp(2.3rem, 5.2vw, 3.7rem); line-height: 1.04; }
.fh-dek {
  max-width: 680px;
  margin: 18px auto 0;
  color: var(--ink-soft);
  font-family: var(--serif) !important;
  font-size: clamp(1.1rem, 1.6vw, 1.28rem);
  line-height: 1.5;
}
.fh-byline { margin: 20px 0 0; color: var(--muted); font: 400 13.5px/1.4 var(--sans); }
.fh-byline a { color: var(--ink); font-weight: 700; text-decoration: none; }
.fh-byline a:hover { text-decoration: underline; }
.fh-status { margin: 12px 0 0; color: var(--muted); font: 400 13px/1.4 var(--sans); }

.fh-now { border-top: 1px solid var(--ink); border-bottom: 1px solid var(--rule); }
.fh-now__grid { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); margin: 0; }
.fh-now__item { min-width: 0; margin: 0; padding: 16px 20px 18px; }
.fh-now__item:first-child { padding-left: 0; }
.fh-now__item + .fh-now__item { border-left: 1px solid var(--rule); }
.fh-now__item dt { color: var(--muted); font: 400 12.5px/1.3 var(--sans); }
.fh-now__item dd { margin: 0; }
.fh-now__item dd:not(.fh-now__note) {
  margin-top: 4px;
  font-family: var(--serif);
  font-size: clamp(1.9rem, 3.2vw, 2.6rem);
  font-weight: 700;
  font-variant-numeric: tabular-nums;
  line-height: 1.05;
}
.fh-now__note { margin-top: 6px !important; color: var(--muted); font: 400 12px/1.35 var(--sans); }

.fh-section { margin-top: 64px; }
.fh-section__head { max-width: 760px; margin-bottom: 18px; }
.fh-section__head--split { display: flex; max-width: none; flex-wrap: wrap; align-items: flex-end; justify-content: space-between; gap: 14px 32px; }
.fh-section__head--split > div:first-child { max-width: 640px; }
.fh-section__head h2 { margin: 0; font-size: clamp(1.45rem, 2.4vw, 1.95rem); }
.fh-section__dek { margin: 8px 0 0; color: var(--ink-soft); font-family: var(--serif) !important; font-size: 1.02rem; line-height: 1.5; }
.fh-chart-wrap--large { padding-top: 14px; border-top: 1px solid var(--ink); }

.fh-split {
  display: grid;
  grid-template-columns: minmax(0, 1.7fr) minmax(280px, 1fr);
  gap: 56px;
  margin-top: 64px;
}
.fh-section--flush { margin-top: 0; }

.fh-multiples {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(190px, 1fr));
  gap: 26px 22px;
  padding-top: 14px;
  border-top: 1px solid var(--ink);
}
.fh-multiple { display: block; min-width: 0; color: var(--ink); text-decoration: none; }
.fh-multiple:focus-visible { outline: 2px solid var(--focus); outline-offset: 4px; }
.fh-multiple:hover .fh-multiple__state { text-decoration: underline; text-underline-offset: 3px; }
.fh-multiple__head { display: flex; align-items: baseline; justify-content: space-between; gap: 8px; font-family: var(--sans); }
.fh-multiple__state { font-size: 14.5px; font-weight: 700; }
.fh-multiple__value { font-size: 14px; font-weight: 700; font-variant-numeric: tabular-nums; }
.fh-multiple__sub { margin: 1px 0 4px; color: var(--muted); font: 400 12px/1.3 var(--sans); }
.fh-multiple__chart { display: block; width: 100%; height: auto; overflow: visible; }
.fh-multiple__guide { stroke: var(--fh-grid); stroke-width: 1; stroke-dasharray: 2 3; }
.fh-multiple__axis.fh-dem { fill: var(--blue); opacity: .7; }
.fh-multiple__axis.fh-rep { fill: var(--red); opacity: .7; }
.fh-multiple__zero { stroke: var(--fh-ref); stroke-width: 1; shape-rendering: crispEdges; }
.fh-multiple__line { fill: none; stroke: var(--ink); stroke-width: 2; stroke-linejoin: round; stroke-linecap: round; }
.fh-multiple__axis { fill: var(--muted); font-family: var(--sans); font-size: 11px; }

.fh-log { padding-top: 4px; border-top: 1px solid var(--ink); font-family: var(--sans); }
.fh-log__group { padding: 12px 0; border-bottom: 1px solid var(--rule-faint); }
.fh-log__date { margin: 0 0 6px; color: var(--ink); font-size: 12.5px; font-weight: 700; }
.fh-log__list { margin: 0; padding: 0; list-style: none; }
.fh-log__item { display: grid; grid-template-columns: minmax(0, 1fr) auto; gap: 0 12px; padding: 4px 0 4px 12px; border-left: 3px solid var(--rule); font-size: 13.5px; }
.fh-log__item + .fh-log__item { margin-top: 6px; }
.fh-log__item--dem { border-left-color: var(--blue); }
.fh-log__item--rep { border-left-color: var(--red); }
.fh-log__state { color: var(--ink); font-weight: 700; text-decoration: none; }
.fh-log__state:hover { text-decoration: underline; }
.fh-log__change { grid-column: 1 / -1; font-size: 13px; }
.fh-log__arrow { color: var(--muted); }
.fh-log__margin { grid-row: 1; grid-column: 2; color: var(--muted); font-size: 12px; font-variant-numeric: tabular-nums; white-space: nowrap; }
.fh-empty { color: var(--muted); font-size: 14px; }

.fh-table-wrap { overflow-x: auto; border-top: 1px solid var(--ink); }
.fh-table { width: 100%; min-width: 760px; border-collapse: collapse; font-family: var(--sans); font-size: 13.5px; }
.fh-page .fh-table thead th { padding: 10px 10px 8px; background: none; text-transform: none; letter-spacing: 0; border-bottom: 1px solid var(--rule); color: var(--muted); font-size: 11.5px; font-weight: 700; text-align: left; white-space: nowrap; }
.fh-page .fh-table thead th.fh-num { text-align: right; }
.fh-page .fh-table tbody th, .fh-page .fh-table tbody td { padding: 10px; background: none; border-bottom: 1px solid var(--rule-faint); vertical-align: top; text-align: left; }
.fh-page .fh-table tbody td.fh-num { text-align: right; }
.fh-page .fh-table thead th:first-child, .fh-page .fh-table tbody th { padding-left: 0; }
.fh-table tbody tr.is-current th, .fh-table tbody tr.is-current td.fh-num { font-weight: 700; }
.fh-release__date { display: block; color: var(--ink); font-weight: 600; white-space: nowrap; }
.fh-release__id { display: block; color: var(--muted); font-size: 11.5px; font-weight: 400; }
.fh-release__delta { font-size: 12.5px; }
.fh-release__notes { max-width: 420px; color: var(--muted); font-size: 12.5px; }
.fh-release__notes summary { cursor: pointer; color: var(--ink-soft); }
.fh-release__notes summary:hover { color: var(--ink); }
.fh-release__notes details p { margin: 6px 0 0; line-height: 1.45; }

/* Release notes: the archived update write-ups, set as a dated log. */
.fh-notes.analysis-list { display: block; }
.fh-notes .analysis-card.panel {
  display: grid;
  grid-template-columns: 200px minmax(0, 1fr);
  column-gap: 40px;
  margin: 0;
  padding: 26px 0;
  border-top: 0;
  border-bottom: 1px solid var(--rule);
  background: none;
}
.fh-notes .analysis-card.panel:first-of-type { border-top: 1px solid var(--ink); }
.fh-notes .analysis-card > * { grid-column: 2; }
.fh-notes .analysis-card > .analysis-card__header { display: block; grid-column: 1; grid-row: 1 / span 12; align-self: start; }
.fh-notes .analysis-card__header .eyebrow { display: block; margin: 0; color: var(--ink); font: 700 12px/1.4 var(--sans); letter-spacing: .03em; }
.fh-notes .analysis-tag { display: block; margin-top: 6px; color: var(--muted); font-size: 11.5px; letter-spacing: 0; line-height: 1.4; text-transform: none; }
.fh-notes .analysis-card h3 { margin: 0 0 6px; font-family: var(--serif) !important; font-size: 1.32rem; line-height: 1.2; }
.fh-notes .analysis-card h4 { margin: 18px 0 6px; font-size: 13px; }
.fh-notes .analysis-summary { margin: 0 0 12px; font-size: 1.04rem; line-height: 1.55; }
.fh-notes .analysis-detail-grid { gap: 10px 28px; border-top: 1px solid var(--rule-faint); }
.fh-notes .analysis-footnote { font-family: var(--sans) !important; font-size: 12.5px !important; color: var(--muted) !important; }

/* ================= responsive ================= */

@media (max-width: 1100px) {
  .fh-shift-head, .fh-shift-axis, .fh-shift-row { grid-template-columns: minmax(130px, 170px) minmax(160px, 1fr) 58px 62px 112px; }
  .fh-shift-head .fh-c5, .fh-shift-row__prob { display: none; }
  .fh-split { grid-template-columns: minmax(0, 1fr); gap: 64px; }
}

@media (max-width: 900px) {
  .fh-home__body { grid-template-columns: minmax(0, 1fr); gap: 36px; }
  .fh-now__grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .fh-now__item:nth-child(3) { padding-left: 0; border-left: 0; }
  .fh-now__item:nth-child(n + 3) { border-top: 1px solid var(--rule); }
  .fh-notes .analysis-card.panel { grid-template-columns: minmax(0, 1fr); }
  .fh-notes .analysis-card > .analysis-card__header { grid-column: 1; grid-row: auto; margin-bottom: 10px; }
  .fh-notes .analysis-card > * { grid-column: 1; }
}

@media (max-width: 640px) {
  .fh-masthead { padding-top: 34px; text-align: left; }
  .fh-dek { margin-left: 0; }
  .fh-section, .fh-split { margin-top: 48px; }
  .fh-controls { justify-content: flex-start; }
  .fh-shift-head { display: none; }
  .fh-shift-axis, .fh-shift-row { grid-template-columns: minmax(96px, 120px) minmax(90px, 1fr) 54px; column-gap: 10px; }
  .fh-shift-row__delta, .fh-shift-row__rating, .fh-shift-row__prob { display: none; }
  .fh-shift-row__name small { display: none; }
  .fh-shift-axis__tick:not(.is-key) { display: none; }
  .fh-shift-axis--compact, .fh-shift-row--compact { grid-template-columns: minmax(92px, 112px) minmax(90px, 1fr) 54px; }
  .fh-now__item { padding: 12px 12px 14px; }
  .fh-now__item:nth-child(odd) { padding-left: 0; }
  .fh-multiples { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 22px 16px; }
  .fh-home { margin-top: 44px; }
}

/* ================= Analysis page, round two ================= */

.fh-page { --fh-ind: var(--purple); --fh-rep-band: rgba(223, 106, 100, .15); }
.fh-ind { color: var(--purple); }
.fh-band--rep { fill: var(--fh-rep-band); }
.fh-track__to--ind { background: var(--purple); }
.fh-end--ind { fill: var(--purple); }

/* Jump links: a quiet sticky rail under the masthead. */
.fh-jump {
  position: sticky;
  top: 56px;
  z-index: 20;
  display: flex;
  gap: 4px 22px;
  overflow-x: auto;
  padding: 10px 0;
  border-top: 1px solid var(--rule);
  border-bottom: 1px solid var(--rule);
  background: color-mix(in srgb, var(--paper) 92%, transparent);
  backdrop-filter: blur(6px);
  scrollbar-width: none;
  font-family: var(--sans);
}
.fh-jump::-webkit-scrollbar { display: none; }
.fh-jump a { flex: 0 0 auto; color: var(--muted); font-size: 13px; font-weight: 600; text-decoration: none; }
.fh-jump a:hover, .fh-jump a.is-active { color: var(--ink); }
.fh-jump a.is-active { text-decoration: underline; text-decoration-thickness: 2px; text-underline-offset: 6px; }
.fh-section, .fh-split, .fh-recent { scroll-margin-top: 110px; }
.fh-section h2, .fh-recent h2 { scroll-margin-top: 110px; }

/* Scoreboard: Democrats and Republicans as mirror images. */
.fh-board {
  display: grid;
  grid-template-columns: minmax(150px, 1fr) minmax(0, 2.2fr) minmax(150px, 1fr);
  align-items: center;
  gap: 28px;
  padding: 30px 0 26px;
  border-bottom: 1px solid var(--rule);
  font-family: var(--sans);
}
.fh-board p { margin: 0; }
.fh-board__side--rep { text-align: right; }
.fh-board__party { font-size: 14px; font-weight: 700; }
.fh-board__side--dem .fh-board__party, .fh-board__side--dem .fh-board__odds { color: var(--blue); }
.fh-board__side--rep .fh-board__party, .fh-board__side--rep .fh-board__odds { color: var(--red); }
.fh-board__odds { margin-top: 2px !important; font-family: var(--serif); font-size: clamp(2.6rem, 5vw, 3.9rem); font-weight: 700; font-variant-numeric: tabular-nums; line-height: 1; }
.fh-board__label { margin-top: 6px !important; color: var(--ink-soft); font-size: 13px; }
.fh-board__delta { margin-top: 3px !important; color: var(--muted); font-size: 12px; }
.fh-board__bar { position: relative; display: flex; height: 18px; overflow: hidden; border-radius: 2px; background: var(--rule); }
.fh-board__bar::after { position: absolute; top: -4px; bottom: -4px; left: 50%; width: 2px; margin-left: -1px; background: var(--paper); content: ""; }
.fh-board__bar-dem { background: var(--blue); }
.fh-board__bar-rep { background: var(--red); }
.fh-board__seats { display: grid; grid-template-columns: 1fr auto 1fr; align-items: end; margin: 14px 0 0; }
.fh-board__seat { margin: 0; }
.fh-board__seat dt { color: var(--muted); font-size: 12px; }
.fh-board__seat dd { display: flex; flex-direction: column; margin: 2px 0 0; }
.fh-board__seat strong { font-family: var(--serif); font-size: 1.7rem; font-variant-numeric: tabular-nums; line-height: 1.1; }
.fh-board__seat span { color: var(--muted); font-size: 12px; }
.fh-board__seat--dem strong { color: var(--blue); }
.fh-board__seat--rep { text-align: right; }
.fh-board__seat--rep strong { color: var(--red); }
.fh-board__mid { padding-bottom: 4px; color: var(--muted); font-size: 11.5px; text-align: center; }
.fh-board__mid dd { margin: 0; }
.fh-board__meta { margin-top: 12px !important; color: var(--muted); font-size: 11.5px; text-align: center; }

/* Latest rating changes, near the top. */
.fh-recent { padding: 22px 0 6px; }
.fh-recent__head { display: flex; align-items: baseline; justify-content: space-between; gap: 16px; margin-bottom: 10px; }
.fh-recent__head h2 { margin: 0; font-family: var(--sans) !important; font-size: 15px; font-weight: 700; letter-spacing: 0; }
.fh-more--small { font-size: 12.5px; }
.fh-recent__list {
  display: grid;
  grid-auto-flow: column;
  grid-auto-columns: minmax(200px, 1fr);
  gap: 0;
  margin: 0;
  padding: 0;
  overflow-x: auto;
  list-style: none;
  scrollbar-width: thin;
  font-family: var(--sans);
}
.fh-recent__item { border-left: 1px solid var(--rule); }
.fh-recent__item:first-child { border-left: 0; }
.fh-recent__link { display: grid; gap: 3px; height: 100%; padding: 4px 16px 10px; border-top: 3px solid var(--rule); color: var(--ink); text-decoration: none; }
.fh-recent__item:first-child .fh-recent__link { padding-left: 0; }
.fh-recent__item--dem .fh-recent__link { border-top-color: var(--blue); }
.fh-recent__item--rep .fh-recent__link { border-top-color: var(--red); }
.fh-recent__item--ind .fh-recent__link { border-top-color: var(--purple); }
.fh-recent__link:hover .fh-recent__state { text-decoration: underline; text-underline-offset: 3px; }
.fh-recent__when { margin-top: 6px; color: var(--muted); font-size: 11.5px; }
.fh-recent__state { font-family: var(--serif); font-size: 1.15rem; font-weight: 700; }
.fh-recent__change { font-size: 13px; font-weight: 600; }
.fh-recent__margin { color: var(--muted); font-size: 12px; font-variant-numeric: tabular-nums; }

/* Party tabs for the seats chart. */
.fh-tab[aria-pressed="true"].fh-tab--dem { border-bottom-color: var(--blue); color: var(--blue); }
.fh-tab[aria-pressed="true"].fh-tab--rep { border-bottom-color: var(--red); color: var(--red); }

/* Movers: two mirrored columns. */
.fh-movers { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 0 48px; margin: 6px 0 28px; font-family: var(--sans); }
.fh-movers__col { padding-top: 10px; border-top: 2px solid var(--rule); }
.fh-movers__col--dem { border-top-color: var(--blue); }
.fh-movers__col--rep { border-top-color: var(--red); }
.fh-movers__title { margin: 0 0 6px; font-size: 13.5px; font-weight: 700; }
.fh-movers__list { margin: 0; padding: 0; list-style: none; counter-reset: mover; }
.fh-movers__list li { counter-increment: mover; border-bottom: 1px solid var(--rule-faint); }
.fh-movers__list a { display: grid; grid-template-columns: 22px minmax(0, 1fr) auto auto; align-items: baseline; gap: 12px; padding: 7px 0; color: var(--ink); text-decoration: none; font-size: 14px; }
.fh-movers__list a::before { color: var(--muted); font-size: 12px; content: counter(mover); }
.fh-movers__list a:hover .fh-movers__state { text-decoration: underline; text-underline-offset: 3px; }
.fh-movers__state { font-weight: 600; }
.fh-movers__delta { font-weight: 700; font-variant-numeric: tabular-nums; }
.fh-movers__now { color: var(--muted); font-size: 12.5px; font-variant-numeric: tabular-nums; }
.fh-movers__since { grid-column: 1 / -1; margin: 8px 0 0; color: var(--muted); font-size: 12px; }

/* Table toolbar. */
.fh-tablebar { display: flex; flex-wrap: wrap; align-items: center; gap: 10px 28px; padding: 8px 0 10px; font-family: var(--sans); }
.fh-search { margin-left: auto; }
.fh-search input {
  width: 230px;
  max-width: 100%;
  min-height: 34px;
  padding: 6px 10px;
  border: 1px solid var(--rule);
  border-radius: 2px;
  background: transparent;
  color: var(--ink);
  font: 400 13px/1.2 var(--sans);
}
.fh-search input::placeholder { color: var(--muted-light); }
.fh-search input:focus { border-color: var(--ink-soft); outline: none; }

/* Sortable headers. */
.fh-sort {
  display: inline-flex;
  align-items: center;
  gap: 5px;
  padding: 0;
  border: 0;
  background: none;
  color: inherit;
  cursor: pointer;
  font: inherit;
  font-weight: 700;
  white-space: nowrap;
}
.fh-sort:hover, .fh-sort.is-active { color: var(--ink); }
.fh-sort__arrow { color: var(--muted-light); font-size: 9px; }
.fh-sort.is-active .fh-sort__arrow { color: var(--ink); }

/* The race table. */
.fh-race-table-wrap { overflow-x: auto; border-top: 1px solid var(--ink); }
.fh-race-table { width: 100%; min-width: 860px; border-collapse: collapse; font-family: var(--sans); font-size: 14px; }
.fh-page .fh-race-table thead th {
  padding: 10px 10px 8px;
  border-bottom: 1px solid var(--rule);
  background: none;
  color: var(--muted);
  font-size: 12px;
  font-weight: 700;
  letter-spacing: 0;
  text-align: left;
  text-transform: none;
  white-space: nowrap;
}
.fh-page .fh-race-table thead th:first-child { padding-left: 0; }
.fh-page .fh-race-table thead th.fh-rt-num { text-align: right; }
.fh-page .fh-race-table thead th.fh-rt-num .fh-sort { flex-direction: row-reverse; }
.fh-page .fh-race-table tbody th,
.fh-page .fh-race-table tbody td { padding: 7px 10px; border-bottom: 1px solid var(--rule-faint); background: none; vertical-align: middle; text-align: left; }
.fh-page .fh-race-table tbody th { padding-left: 0; }
.fh-race-table tbody tr:not(.fh-rt-axis):hover { background: rgba(255, 255, 255, .03); }
.fh-rt-state { width: 210px; }
.fh-rt-state a { color: var(--ink); font-weight: 700; text-decoration: none; }
.fh-rt-state a:hover { text-decoration: underline; text-underline-offset: 3px; }
.fh-rt-state small { display: block; max-width: 230px; overflow: hidden; color: var(--muted); font-size: 11.5px; font-weight: 400; text-overflow: ellipsis; white-space: nowrap; }
.fh-rt-track { min-width: 240px; }
.fh-page .fh-race-table td.fh-rt-num, .fh-page .fh-race-table th.fh-rt-num { width: 72px; }
.fh-rt-rating { width: 150px; }
.fh-page .fh-race-table td.fh-rt-num { text-align: right; font-variant-numeric: tabular-nums; white-space: nowrap; }
.fh-rt-value { font-weight: 700; }
.fh-rt-delta { font-size: 13px; }
.fh-rt-rating { white-space: nowrap; font-size: 13px; font-weight: 600; }
.fh-rt-rating s { margin-right: 2px; color: var(--muted); font-weight: 400; text-decoration-thickness: 1px; }
.fh-rt-win { width: 230px; }
.fh-race-table tr.fh-rt-axis td { padding-top: 4px; padding-bottom: 0; border-bottom: 0; }
.fh-race-table tr.fh-rt-axis .fh-shift-axis__scale { position: relative; display: block; height: 18px; }
.fh-race-table tr.fh-rt-axis .fh-shift-axis__tick { bottom: 2px; }

/* Win-probability split bar. */
.fh-winbar { display: grid; grid-template-columns: 48px minmax(60px, 1fr) 48px; align-items: center; gap: 8px; font-size: 12.5px; font-variant-numeric: tabular-nums; font-weight: 700; }
.fh-winbar__n:last-child { text-align: right; }
.fh-winbar__track { display: flex; height: 8px; overflow: hidden; border-radius: 1px; background: var(--rule); }
.fh-winbar__d--dem { background: var(--blue); }
.fh-winbar__d--ind { background: var(--purple); }
.fh-winbar__r { background: var(--red); }
.fh-winbar__na { grid-column: 1 / -1; color: var(--muted-light); font-size: 12px; font-weight: 400; }

/* Ratings mix over time. */
.fh-mix { padding-top: 12px; border-top: 1px solid var(--ink); font-family: var(--sans); }
.fh-mix__legend { display: flex; flex-wrap: wrap; gap: 6px 14px; margin-bottom: 14px; color: var(--ink-soft); font-size: 12px; }
.fh-mix__legend span { display: inline-flex; align-items: center; gap: 6px; }
.fh-mix__swatch { display: inline-block; width: 12px; height: 12px; }
.fh-mix__row { display: grid; grid-template-columns: 150px minmax(0, 1fr) 130px; align-items: center; gap: 16px; padding: 4px 0; }
.fh-mix__row--head { padding-bottom: 6px; color: var(--muted); font-size: 12px; font-weight: 700; }
.fh-mix__row.is-current .fh-mix__date { color: var(--ink); font-weight: 700; }
.fh-mix__date { color: var(--ink-soft); font-size: 13px; white-space: nowrap; }
.fh-mix__bar { position: relative; display: flex; height: 22px; gap: 1px; }
.fh-mix__bar::after { position: absolute; top: -3px; bottom: -3px; left: 50%; width: 1px; background: var(--ink-soft); opacity: .5; content: ""; }
.fh-mix__seg { display: grid; min-width: 0; place-items: center; overflow: hidden; color: rgba(255, 255, 255, .92); font-size: 11px; font-style: normal; font-weight: 700; }
.fh-mix__seg--dem-4 { background: #247fb8; }
.fh-mix__seg--dem-3 { background: #3f96c9; }
.fh-mix__seg--dem-2 { background: #62acd7; color: #0f1a22; }
.fh-mix__seg--dem-1 { background: #8bc5e4; color: #0f1a22; }
.fh-mix__seg--toss { background: #7f858b; color: #111; }
.fh-mix__seg--rep-1 { background: #e7a09b; color: #241210; }
.fh-mix__seg--rep-2 { background: #dc7771; color: #241210; }
.fh-mix__seg--rep-3 { background: #ca554f; }
.fh-mix__seg--rep-4 { background: #b83c37; }
.fh-mix__tally { color: var(--muted); font-size: 12.5px; font-variant-numeric: tabular-nums; text-align: right; }
.fh-mix__tally b { font-size: 13.5px; }
.fh-mix__bar-head { text-align: center; }

/* Small multiples: odds under each chart. */
.fh-multiple__odds { margin-top: 4px; }
.fh-multiple__odds .fh-winbar { grid-template-columns: 44px minmax(40px, 1fr) 44px; font-size: 12px; }

@media (max-width: 900px) {
  .fh-board { grid-template-columns: 1fr 1fr; gap: 16px; }
  .fh-board__center { grid-column: 1 / -1; grid-row: 2; }
  .fh-movers { grid-template-columns: 1fr; gap: 20px; }
  .fh-mix__row { grid-template-columns: 110px minmax(0, 1fr) 84px; gap: 10px; }
}
@media (max-width: 640px) {
  .fh-jump { top: 56px; }
  .fh-board__odds { font-size: 2.4rem; }
  .fh-search { width: 100%; margin-left: 0; }
  .fh-search input { width: 100%; }
  .fh-recent__list { grid-auto-columns: minmax(180px, 72%); }
  .fh-mix__row { grid-template-columns: 88px minmax(0, 1fr); }
  .fh-mix__tally { display: none; }
  .fh-mix__seg { font-size: 10px; }
  .fh-mix__date { font-size: 12px; }
  .fh-movers__list a { grid-template-columns: 18px minmax(0, 1fr) auto; }
  .fh-movers__now { display: none; }
}
@media (max-width: 700px) {
  .fh-race-table { min-width: 0; }
  .fh-race-table .fh-rt-track, .fh-race-table .fh-rt-delta, .fh-race-table .fh-rt-rating, .fh-race-table tr.fh-rt-axis { display: none; }
  .fh-rt-state { width: auto; }
  .fh-rt-state small { max-width: 150px; }
  .fh-rt-win { width: 150px; }
  .fh-winbar { grid-template-columns: 40px minmax(30px, 1fr) 40px; gap: 5px; font-size: 11.5px; }
  .fh-page .fh-race-table thead th, .fh-page .fh-race-table tbody td { padding-inline: 6px; }
}
.fh-mix__date { overflow: hidden; text-overflow: ellipsis; }

/* Wide screens: the rating log is far longer than the small multiples beside
   it. Let it fill that column's height and scroll inside it instead of
   stretching the row and leaving a tall empty gap under the charts. */
@media (min-width: 1101px) {
  .fh-split > .fh-ratings { display: flex; flex-direction: column; height: 0; min-height: 100%; }
  .fh-split > .fh-ratings .fh-log { flex: 1 1 auto; min-height: 0; overflow-y: auto; overscroll-behavior: contain; padding-right: 10px; scrollbar-gutter: stable; }
  .fh-split > .fh-ratings .fh-log:focus-visible { outline: 2px solid var(--focus); outline-offset: 2px; }
}