/* Site tokens are aliases of the shadcn theme (src/styles/global.css), so one palette drives everything. */
:root {
  --dem: var(--viz-d); --rep: var(--viz-r); --oth: var(--viz-i);
  --close-bg: color-mix(in oklab, var(--viz-warn) 18%, var(--card));
}
a { color: inherit; text-underline-offset: 3px; text-decoration-color: color-mix(in oklab, currentColor 35%, transparent); }
a:hover { text-decoration-color: currentColor; }
main h1 { font-size: clamp(1.6rem, 2.6vw, 2.15rem); font-weight: 650; letter-spacing: -.025em; line-height: 1.15; margin: .5rem 0 .4rem; }
main h2 { font-size: 1.05rem; font-weight: 600; letter-spacing: -.01em; margin: 3.25rem 0 .9rem; }
main h2.section-heading { font-size: clamp(1.4rem, 2.2vw, 1.75rem); font-weight: 650; line-height: 1.2; letter-spacing: -.025em; }
main h3 { font-size: .95rem; font-weight: 600; margin: 2.25rem 0 .7rem; }
main h3.section-subheading { font-size: clamp(1.125rem, 1.6vw, 1.3rem); font-weight: 650; line-height: 1.25; }
.lede { color: var(--muted-foreground); max-width: 70ch; margin-bottom: 1rem; }
.empty { color: var(--muted-foreground); }
.visually-hidden { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); clip-path: inset(50%); white-space: nowrap; }
/* Tables ignore width:1px and lay out at full width, which widened the page on phones; park them off to the left instead. */
table.visually-hidden { left: -10000px; top: 0; }

/* Keep every search field large enough to avoid iPhone focus zoom. */
main input[type="search"] { font-size: 16px; }

/* Feed */
ol.feed { list-style: none; padding: 0; margin: 0; border-top: 1px solid var(--border); }
ol.feed li { border-bottom: 1px solid var(--border); padding: .6rem .25rem .6rem .75rem; border-left: 4px solid transparent; }
ol.feed li article { display: grid; grid-template-columns: 6.5rem 1fr; gap: .75rem; align-items: baseline; }
ol.feed li p { margin: 0; }
ol.feed .permalink { color: var(--muted-foreground); font-variant-numeric: tabular-nums; text-decoration: none; font-size: .9rem; }
ol.feed .meta, ol.feed .order { color: var(--muted-foreground); font-size: .85rem; }
ol.feed li.dem { border-left-color: var(--dem); }
ol.feed li.rep { border-left-color: var(--rep); }
ol.feed li.oth { border-left-color: var(--oth); }
ol.feed li.retraction, ol.feed li.winner_changed { background: var(--close-bg); }
ol.feed li.new { animation: flash 3s ease-out; }
@keyframes flash { from { background: var(--close-bg); } to { background: transparent; } }

/* Board */
.table-wrap { overflow-x: auto; border: 1px solid var(--border); border-radius: var(--radius-xl, 14px); background: var(--card); box-shadow: 0 1px 2px rgb(0 0 0 / .04); }
table.board { border-collapse: collapse; width: 100%; font-size: .9rem; }
table.board caption { text-align: left; padding: .6rem .75rem; color: var(--muted-foreground); font-size: .85rem; }
table.board th, table.board td { padding: .45rem .6rem; border-top: 1px solid var(--border); text-align: left; vertical-align: top; }
table.board thead th { border-top: 0; position: sticky; top: 0; background: var(--card); font-weight: 600; white-space: nowrap; }
table.board tbody th { white-space: nowrap; font-weight: 600; }
table.board thead th a, table.board tbody th a { text-decoration: none; }
td.cell { min-width: 9rem; }
td.cell .st { display: block; }
td.cell .when { display: block; color: var(--muted-foreground); font-size: .78rem; font-variant-numeric: tabular-nums; }
td.cell.pending .st, td.cell.too_early .st { color: var(--muted-foreground); }
td.cell.too_close { background: var(--close-bg); }
td.cell.too_close .st { color: var(--close); font-weight: 600; }
td.cell.lean .st, td.cell.likely .st { font-style: italic; }
td.cell.called.dem, td.cell.runoff.dem, td.cell.party_called.dem { background: var(--dem-bg); color: var(--dem); font-weight: 600; }
td.cell.called.rep, td.cell.runoff.rep, td.cell.party_called.rep { background: var(--rep-bg); color: var(--rep); font-weight: 600; }
td.cell.called.oth, td.cell.runoff.oth { background: var(--oth-bg); color: var(--oth); font-weight: 600; }
table.race td.cell { min-width: 16rem; }
@media (max-width: 640px) { ol.feed li article { grid-template-columns: 1fr; gap: .15rem; } h1 { font-size: 1.45rem; } }

/* ---------- Charts ----------
   Party fills: validated (dataviz validate_palette, --pairs all). Light: blue #2a78d6 / red #e34948 / green #008300
   (green↔red CVD ΔE 7.2: legal only with secondary encoding, so every tile/dot also carries a text label or tooltip).
   Dark: #3987e5 / #e66767 / #008300 — all checks pass. "Too close" uses the reserved status-warning amber, always
   with a text label. Hatching (texture) marks partial / characterization-only states. */
:root { --viz-surface: var(--card); --viz-ink: var(--foreground); --viz-ink-2: var(--muted-foreground); --viz-grid: var(--border);
  --viz-d: #2a78d6; --viz-r: #e34948; --viz-i: #008300; --viz-warn: #fab219; --viz-close: #5f5f66; --viz-none: #ecebe7; --viz-soft: #f6f5f2; }
:root[data-theme="dark"] { --viz-surface: var(--card); --viz-ink: var(--foreground); --viz-ink-2: var(--muted-foreground); --viz-grid: var(--border);
  --viz-d: #3987e5; --viz-r: #e66767; --viz-i: #008300; --viz-warn: #fab219; --viz-close: #6e6e76; --viz-none: #2a2a28; --viz-soft: #222220; }
.viz-card { margin: 2rem 0; }
.viz figcaption { color: var(--viz-ink); margin-bottom: .4rem; }
.viz-summary { color: var(--viz-ink-2); }
.viz-svg { display: block; width: 100%; height: auto; font: 12px/1 ui-sans-serif, system-ui, sans-serif; }
.viz-scroll { overflow-x: auto; }
.viz-legend { display: flex; flex-wrap: wrap; gap: .3rem 1rem; list-style: none; padding: 0; margin: 0 0 .6rem; font-size: .8rem; color: var(--viz-ink-2); }
.viz-legend li { display: flex; align-items: center; gap: .35rem; }
.viz-legend .sw { width: 14px; height: 14px; border-radius: 3px; display: inline-block; }
.viz-legend .sw.dot { border-radius: 50%; width: 11px; height: 11px; }
.viz-legend .sw.ring { background: var(--viz-surface); box-shadow: 0 0 0 2px var(--viz-ink); }
.viz-legend .sw-hatch { background: repeating-linear-gradient(45deg, var(--viz-ink-2) 0 2px, var(--viz-soft) 2px 5px); }
.viz-legend .viz-fill-none { box-shadow: inset 0 0 0 1px var(--viz-grid); }

/* fills work for both SVG (fill) and HTML swatches (background) */
.viz-fill-D { fill: var(--viz-d); background: var(--viz-d); }
.viz-fill-R { fill: var(--viz-r); background: var(--viz-r); }
.viz-fill-I { fill: var(--viz-i); background: var(--viz-i); }
.viz-fill-warn { fill: var(--viz-warn); background: var(--viz-warn); }
.viz-fill-close { fill: var(--viz-close); background: var(--viz-close); }
.viz-fill-none { fill: var(--viz-none); background: var(--viz-none); }
.viz-fill-empty { fill: transparent; stroke: var(--viz-grid); stroke-dasharray: 3 3; }
.viz-fill-soft { fill: var(--viz-soft); }
.viz-leading-D { --leading-color: var(--viz-d); }
.viz-leading-R { --leading-color: var(--viz-r); }
rect.viz-leading { fill: color-mix(in srgb, var(--leading-color) 12%, var(--viz-surface)); stroke: var(--leading-color); stroke-width: 2; stroke-dasharray: 4 3; }
.bop-two-bar .bop-segment.viz-leading { box-sizing: border-box; background: color-mix(in srgb, var(--leading-color) 12%, var(--viz-surface)); border: 1px dashed var(--leading-color); }
.bop-leading-control { text-align: right; }
.bop-leading-toggle { display: inline-flex; align-items: center; gap: .5rem; cursor: pointer; font-size: .8rem; white-space: nowrap; }
.bop-leading-toggle input { appearance: none; width: 30px; height: 18px; border: 1px solid var(--viz-grid); border-radius: 999px; background: var(--viz-none); cursor: pointer; position: relative; flex: none; }
.bop-leading-toggle input::before { content: ""; position: absolute; width: 12px; height: 12px; left: 2px; top: 2px; border-radius: 50%; background: var(--viz-ink-2); }
.bop-leading-toggle input:checked { background: var(--viz-ink); border-color: var(--viz-ink); }
.bop-leading-toggle input:checked::before { left: 14px; background: var(--viz-surface); }
.bop-leading-toggle input:focus-visible { outline: 2px solid var(--viz-d); outline-offset: 3px; }
.bop-leading-note { display: block; color: var(--viz-ink-2); font-size: .7rem; margin-top: .2rem; }
.latest-calls-header { display: flex; flex-wrap: wrap; justify-content: space-between; align-items: center; gap: 1rem; margin-bottom: 1rem; }
.latest-calls-header h2 { margin: 0; }
.latest-calls-group { display: inline-flex; flex-shrink: 0; margin-left: auto; padding: 3px; border: 1px solid var(--viz-grid); border-radius: 8px; gap: 2px; }
.latest-calls-group button { padding: .25rem .65rem; border: 0; border-radius: 5px; background: transparent; color: var(--viz-ink-2); font: inherit; font-size: .8rem; cursor: pointer; }
.latest-calls-group button[aria-pressed="true"] { background: var(--viz-ink); color: var(--viz-surface); }
.latest-calls-group button:focus-visible { outline: 2px solid var(--viz-d); outline-offset: 2px; }
@media (max-width: 600px) {
  .viz-bop .bop-header { grid-template-columns: 1fr; }
  .bop-leading-control { grid-column: 1; grid-row: auto; justify-self: end; margin-top: .4rem; }
}
.viz-outline-warn { stroke: var(--viz-ink); stroke-width: 2; stroke-dasharray: 4 2; }

/* map tiles */
.viz-map .viz-svg { max-width: 760px; }
.viz-map a rect { transition: opacity .1s; }
.viz-map a:hover rect, .viz-map a:focus rect { opacity: .8; }
.viz-tile-st { text-anchor: middle; font-weight: 700; font-size: 14px; fill: var(--viz-ink); }
.viz-tile-st.muted { fill: var(--viz-ink-2); font-weight: 400; }
.viz-tile-sub { text-anchor: middle; font-size: 10.5px; fill: var(--viz-ink); }
.viz-tile-st.on-fill, .viz-tile-sub.on-fill { fill: #fff; }

/* timeline + strip */
.viz-axis line { stroke: var(--viz-grid); stroke-width: 1; }
.viz-axis text { fill: var(--viz-ink-2); text-anchor: middle; font-size: 11px; }
.viz-row { stroke: var(--viz-grid); stroke-width: 1; }
.viz-rowlabel { text-anchor: end; fill: var(--viz-ink); font-weight: 600; font-size: 12px; }
.viz-rowlabel a { fill: inherit; }
.viz-pollclose line { stroke: var(--viz-ink-2); stroke-width: 1; stroke-dasharray: 2 3; }
.viz-note { fill: var(--viz-ink-2); font-size: 10.5px; }
.viz-now line { stroke: var(--viz-ink); stroke-width: 1.5; }
.viz-now text { fill: var(--viz-ink); font-size: 10.5px; font-weight: 600; }
.viz-timeline circle.viz-fill-D, .viz-timeline circle.viz-fill-R, .viz-timeline circle.viz-fill-I, .viz-timeline circle.viz-fill-none { stroke: var(--viz-surface); stroke-width: 2; }
.viz-timeline circle.viz-first { stroke: var(--viz-ink); stroke-width: 2; }
.viz-timeline a:hover circle:last-child { r: 7; }
.viz-strip rect.viz-fill-none { fill: var(--viz-none); }

/* filters */
.viz-filters { display: flex; flex-wrap: wrap; gap: .35rem; align-items: center; margin: .5rem 0 .75rem; font-size: .85rem; }
.viz-filters a { text-decoration: none; padding: .2rem .55rem; border: 1px solid var(--border); border-radius: 999px; color: var(--muted-foreground); }
.viz-filters a[aria-current="true"] { background: var(--foreground); color: var(--background); border-color: var(--foreground); }
.viz-filters .sep { color: var(--border); }

/* leaderboard bars: single series, neutral ink */
.leaderboard td { white-space: nowrap; }
.leaderboard th, .leaderboard td { padding: .45rem .5rem; }
.leaderboard .bar { display: inline-block; height: 8px; width: calc(56px * var(--k, 0)); background: var(--viz-ink); border-radius: 0 4px 4px 0; margin-right: .4rem; vertical-align: middle; }
.leaderboard .bar.muted { background: var(--viz-ink-2); }
.leaderboard .num { font-variant-numeric: tabular-nums; }
.two-up { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); gap: 1.25rem; align-items: start; }
@media (max-width: 900px) { .two-up { grid-template-columns: 1fr; } }

.viz-tip { position: fixed; left: 0; top: 0; z-index: 10; pointer-events: none; max-width: 320px; padding: .35rem .55rem; border-radius: 6px;
  background: var(--viz-ink); color: var(--viz-surface); font-size: .8rem; line-height: 1.3; box-shadow: 0 4px 14px rgb(0 0 0 / .18); }

/* Compact board: vertical source headers, one letter per cell, details in the hover/focus popover. */
.board-caption { color: var(--muted-foreground); font-size: .85rem; margin: 0 0 .6rem; }
.board-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(min(100%, 30rem), 1fr)); gap: 1rem; align-items: start; }
/* Fixed layout: race names get a set column, the source columns split the remaining width equally. */
table.compact-board { width: 100%; table-layout: fixed; }
table.compact-board .race-col { width: 16rem; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
table.compact-board th.vert { vertical-align: bottom; padding: .5rem 0 .4rem; }
table.compact-board th.vert a { display: block; margin: 0 auto; writing-mode: vertical-rl; transform: rotate(180deg); white-space: nowrap; font-weight: 600; text-decoration: none; }
table.compact-board td.cell.compact { min-width: 0; height: 2rem; padding: 0; text-align: center; vertical-align: middle; font-weight: 700; font-size: .85rem; border-left: 2px solid var(--card); cursor: default; }
table.compact-board td.compact.called.dem, table.compact-board td.compact.party_called.dem { background: var(--viz-d); color: #fff; }
table.compact-board td.compact.called.rep, table.compact-board td.compact.party_called.rep { background: var(--viz-r); color: #fff; }
table.compact-board td.compact.called.oth, table.compact-board td.compact.party_called.oth { background: var(--viz-i); color: #fff; }
table.compact-board td.compact.dem:is(.lean, .likely, .runoff) { background: repeating-linear-gradient(45deg, var(--viz-d) 0 3px, var(--viz-soft) 3px 6px); color: var(--viz-ink); }
table.compact-board td.compact.rep:is(.lean, .likely, .runoff) { background: repeating-linear-gradient(45deg, var(--viz-r) 0 3px, var(--viz-soft) 3px 6px); color: var(--viz-ink); }
table.compact-board td.compact.oth:is(.lean, .likely, .runoff) { background: repeating-linear-gradient(45deg, var(--viz-i) 0 3px, var(--viz-soft) 3px 6px); color: var(--viz-ink); }
table.compact-board td.compact:is(.lean, .likely, .runoff) span[aria-hidden] { background: var(--viz-surface); padding: 0 .2rem; border-radius: 3px; }
table.compact-board td.compact:is(.pending, .too_early), table.compact-board td.compact:not([class*=" called"]):not(.too_close):not(.lean):not(.likely):not(.runoff):not(.party_called) { background: var(--viz-soft); }
table.compact-board td.compact.too_close { background: var(--viz-close); color: #fff; font-size: .7rem; }
table.compact-board td.compact:focus-visible { outline: 2px solid var(--viz-ink); outline-offset: -2px; }
.board-key { display: block; font-size: .78rem; margin-top: .2rem; }

/* Balance of power */
.viz-bop rect.hold { fill-opacity: .5; }
.viz-legend .sw-hold { background: color-mix(in srgb, var(--viz-d) 50%, var(--viz-surface)); box-shadow: 7px 0 0 0 color-mix(in srgb, var(--viz-r) 50%, var(--viz-surface)); margin-right: 7px; }
.viz-mid { stroke: var(--viz-ink); stroke-width: 2; }
.viz-mid-label { text-anchor: middle; fill: var(--viz-ink-2); font-size: 11px; }
.viz-bop-num { font-size: 12px; font-weight: 700; fill: #fff; paint-order: stroke; stroke: rgb(0 0 0 / .25); stroke-width: 2px; }
.viz-bop-num.right { text-anchor: end; }
.viz-bop-num.ink { fill: var(--viz-ink); stroke: none; }

.muted-note { color: var(--muted-foreground); font-size: .85rem; margin-top: -.25rem; }
h3 { font-size: 1rem; margin: 1.25rem 0 .4rem; }

/* Call log: minute → network → calls */
ol.log { list-style: none; padding: 0; margin: 0; border-top: 1px solid var(--border); }
.log-minute { display: grid; grid-template-columns: 6.5rem 1fr; gap: .75rem; padding: .6rem 0; border-bottom: 1px solid var(--border); align-items: baseline; }
.log-time { margin: 0; font-size: 1rem; line-height: 1.45; font-weight: 700; font-variant-numeric: tabular-nums; }
.log-sources, .log-items { list-style: none; padding: 0; margin: 0; }
.log-source { display: grid; grid-template-columns: 9.5rem 1fr; gap: .5rem; padding: 0; align-items: baseline; }
.log-net { font-weight: 600; text-decoration: none; }
.log-item { padding: .1rem 0 .1rem .6rem; border-left: 3px solid transparent; }
.log-item.dem { border-left-color: var(--dem); } .log-item.rep { border-left-color: var(--rep); } .log-item.oth { border-left-color: var(--oth); }
.log-item.retraction, .log-item.winner_changed { background: var(--close-bg); }
.log-item .order, .log-meta { color: var(--muted-foreground); font-size: .85rem; text-decoration: none; }
@media (max-width: 640px) { .log-minute, .log-source { grid-template-columns: 1fr; } }
.viz-label-back { fill: var(--viz-surface); fill-opacity: .92; }

/* Site-wide key */
.site-key .sw { width: 12px; height: 12px; border-radius: 3px; display: inline-block; }
.site-key .sw-hatch { background: repeating-linear-gradient(45deg, var(--viz-ink-2) 0 2px, var(--viz-soft) 2px 5px); }
.site-key .sw.viz-fill-none { box-shadow: inset 0 0 0 1px var(--viz-grid); }
.site-key .sw.ring { background: var(--viz-surface); box-shadow: inset 0 0 0 2px var(--viz-ink); }
.site-key .sw-hold { background: linear-gradient(90deg, color-mix(in srgb, var(--viz-d) 50%, var(--viz-surface)) 50%, color-mix(in srgb, var(--viz-r) 50%, var(--viz-surface)) 50%); }
.leaderboard-wrap { max-width: 760px; }
/* Call log: separate networks within a minute */
.log-source + .log-source { border-top: 1px solid var(--border); margin-top: .3rem; padding-top: .3rem; }
.log-item.too_close { border-left-color: var(--viz-close); }

/* Board controls */
.board-controls { display: flex; flex-wrap: wrap; gap: .5rem .9rem; align-items: center; margin: 1rem 0 .6rem; font-size: .85rem; color: var(--muted-foreground); }
.board-controls input[type=search] { flex: 1 1 16rem; max-width: 22rem; font: inherit; padding: .4rem .6rem; border: 1px solid var(--border); border-radius: 6px; background: var(--card); color: var(--foreground); }
.board-controls label { display: inline-flex; gap: .35rem; align-items: center; }
.board-controls select { font: inherit; padding: .3rem .4rem; border: 1px solid var(--border); border-radius: 6px; background: var(--card); color: var(--foreground); }
.src-picker { position: relative; }
.src-picker summary { cursor: pointer; padding: .3rem .6rem; border: 1px solid var(--border); border-radius: 6px; background: var(--card); color: var(--foreground); list-style: none; }
.src-picker fieldset { position: absolute; z-index: 5; margin: .3rem 0 0; padding: .5rem .75rem; border: 1px solid var(--border); border-radius: 6px; background: var(--card); display: grid; gap: .25rem; min-width: 9rem; box-shadow: 0 6px 18px rgb(0 0 0 / .08); }
.src-picker fieldset label { color: var(--foreground); }
.board-count { margin-left: auto; }
/* State group headers on the House board */
table.compact-board tr.state-row th { background: var(--background); font-weight: 700; padding-top: .9rem; border-top: 1px solid var(--border); text-align: left; }
table.compact-board tr.state-row th span { font-weight: 400; color: var(--muted-foreground); font-size: .8rem; margin-left: .35rem; }

/* Balance of power: two-line layout for narrow screens (as on the original All the Calls) */
.bop-two { display: none; }
@media (max-width: 720px) {
  .viz-bop .bop-wide { display: none; }
  .bop-two { display: grid; gap: .85rem; position: relative; margin-top: .25rem; }
  .bop-two-maj { font-size: .72rem; color: var(--viz-ink-2); margin-left: var(--maj); transform: translateX(calc(-100% + 1px)); padding-right: .35rem; white-space: nowrap; width: max-content; }
  .bop-two-head { display: flex; flex-wrap: wrap; align-items: baseline; gap: .3rem; font-size: .85rem; margin-bottom: .25rem; font-variant-numeric: tabular-nums; }
  .bop-two-head strong { margin-right: .35rem; }
  .bop-two-head .d { color: var(--viz-d); font-weight: 700; }
  .bop-two-head .r { color: var(--viz-r); font-weight: 700; }
  .bop-two-head .i { color: var(--viz-i); font-weight: 700; }
  .bop-two-head .u, .bop-two-head .sep { color: var(--viz-ink-2); }
  .bop-two-bars { position: relative; display: grid; gap: 3px; }
  .bop-two-bar { display: flex; height: 12px; background: var(--viz-none); overflow: hidden; }
  .bop-two-bar .bop-segment { height: 100%; flex: none; }
  .bop-two-bar .bop-segment.hold { opacity: .5; }
  .bop-two-bar .hatch-D { background: repeating-linear-gradient(45deg, var(--viz-d) 0 3px, var(--viz-soft) 3px 6px); }
  .bop-two-bar .hatch-R { background: repeating-linear-gradient(45deg, var(--viz-r) 0 3px, var(--viz-soft) 3px 6px); }
  .bop-two-line { position: absolute; top: -3px; bottom: -3px; left: var(--maj); width: 2px; margin-left: -1px; background: var(--viz-ink); }
}

.tz-switch button { color: var(--muted-foreground); }
.tz-switch button[aria-pressed="true"] { background: var(--secondary); color: var(--foreground); font-weight: 600; }
main > section + section { margin-top: 3.5rem; }
main .table-card, main .table-wrap { margin-top: 1rem; }

/* Table card: controls folded into the top of the table */
.table-card { border: 1px solid var(--border); border-radius: var(--radius-xl, 14px); background: var(--card); box-shadow: 0 1px 2px rgb(0 0 0 / .04); overflow: hidden; margin-top: 2rem; }
.table-card-head { padding: .75rem .9rem; border-bottom: 1px solid var(--border); background: color-mix(in oklab, var(--muted) 45%, var(--card)); }
.table-wrap.bare { border: 0; border-radius: 0; box-shadow: none; margin: 0; }
.log-body { padding: 0 1rem; }
.log-body ol.log { border-top: 0; }
.log-body .log-minute:last-child { border-bottom: 0; }

/* Call log — race grouping (minute → race → outcome → network chips) */
.log-time { display: flex; flex-direction: column; gap: .1rem; }
.log-count { font-size: .72rem; font-weight: 500; color: var(--muted-foreground); }
.log-races, .log-outcomes { list-style: none; padding: 0; margin: 0; }
.log-race { display: grid; grid-template-columns: 14rem 1fr; gap: .5rem; align-items: baseline; padding: .2rem 0; }
.log-race + .log-race, .log-more { border-top: 1px solid var(--border); margin-top: .3rem; padding-top: .35rem; }
.log-race-name { font-weight: 600; text-decoration: none; }
.log-race-name:hover { text-decoration: underline; }
.log-outcome { display: flex; flex-wrap: wrap; align-items: baseline; gap: .35rem .6rem; padding: .05rem 0 .05rem .6rem; border-left: 3px solid transparent; }
.log-outcome + .log-outcome { margin-top: .25rem; }
.log-outcome.dem { border-left-color: var(--viz-d); } .log-outcome.rep { border-left-color: var(--viz-r); } .log-outcome.oth { border-left-color: var(--viz-i); }
.log-outcome.too_close { border-left-color: var(--viz-close); }
.log-outcome.retraction, .log-outcome.winner_changed { background: var(--close-bg); }
.log-nets { display: inline-flex; flex-wrap: wrap; gap: .25rem; }
.net-chip { display: inline-flex; align-items: center; height: 1.35rem; padding: 0 .45rem; border-radius: 999px; border: 1px solid var(--border); background: var(--card); font-size: .72rem; font-weight: 600; text-decoration: none; color: var(--foreground); }
.net-chip:hover { background: var(--muted); }
.net-chip.manual { border-style: dashed; }
.log-more summary { cursor: pointer; color: var(--muted-foreground); font-size: .85rem; padding: .2rem 0; }
.log-more .log-races { margin-top: .3rem; }
@media (max-width: 640px) { .log-race { grid-template-columns: 1fr; gap: .2rem; } }

/* Time zones: quieter than the clock time */
time .tz { font-weight: 400; font-size: .78em; color: var(--muted-foreground); letter-spacing: .01em; }

/* Header: brand, then full-height nav cells left-aligned; status cell flush right (fixed heights, so nothing shifts between pages). */
.top-stack > header { box-sizing: border-box; height: 61px; } /* 60px content + bottom border */
.site-header { display: grid; grid-template-columns: auto 1fr auto; align-items: stretch; height: 100%; }
.site-header .brand { align-self: center; justify-self: start; padding-right: 1.25rem; }
.site-header .site-nav { justify-self: start; }
.nav-cell:last-child { border-right: 1px solid var(--border); }
.site-nav { display: flex; align-items: stretch; overflow-x: auto; scrollbar-width: none; }
.nav-cell { display: flex; align-items: center; justify-content: center; padding: 0 1.15rem; border-left: 1px solid var(--border); font-size: 14px; font-weight: 500; color: var(--muted-foreground); text-decoration: none; white-space: nowrap; position: relative; transition: background-color .15s, color .15s; }
.nav-cell:hover { background: var(--muted); color: var(--foreground); }
.nav-cell[aria-current="page"] { color: var(--foreground); font-weight: 600; background: color-mix(in oklab, var(--muted) 60%, transparent); }
.nav-cell:focus-visible { outline: 2px solid var(--ring); outline-offset: -2px; }
.site-status { display: flex; align-items: center; justify-content: flex-end; gap: .4rem; padding-left: 1rem; }
.site-status .live-updated { display: inline-flex; align-items: center; gap: .45rem; flex: none; }
/* Header is a container-query component: it switches to two rows (brand + status, then full-width nav)
   whenever its own width can't fit everything on one line (~1,120px), not just on phones. */
.top-stack { container: topbar / inline-size; }
@container topbar (max-width: 1120px) {
  .top-stack > header { height: 97px; } /* 52px brand row + 44px navigation + bottom border */
  .site-header { grid-template-columns: minmax(0, 1fr) auto; grid-template-rows: 52px 44px; }
  .site-header .site-nav { grid-column: 1 / -1; grid-row: 2; border-top: 1px solid var(--border); justify-self: stretch; min-width: 0; margin: 0 -1.25rem; }
  .nav-cell { flex: 1 1 auto; min-width: 0; padding: 0 .75rem; }
  .nav-cell:first-child { border-left: 0; }
  .nav-cell:last-child { border-right: 0; }
}
/* Phones: compact spacing keeps the status labels beside the brand. */
@media (max-width: 767px) {
  .site-header { padding: 0; }
  .site-header .site-nav { margin: 0; }
  .site-header .brand { padding-left: 12px; padding-right: 4px; gap: 6px; }
  .site-header .brand span { font-size: 17px; }
  .site-status { padding: 0 12px 0 4px; gap: 6px; }
  .site-status .live-updated { min-width: 0; gap: 4px; }
  .site-status .upd-label { display: block; width: 3.5em; white-space: normal; line-height: 1.1; text-align: right; }
  .nav-cell { padding: 0 .4rem; font-size: 13px; }
}
.log-verb { color: var(--foreground); }
.log-outcome .log-nets { order: 0; }

/* New entries / changed cells after a live refresh */
@keyframes atc-arrive { from { opacity: 0; transform: translateY(-6px); } to { opacity: 1; transform: none; } }
@keyframes atc-glow { 0% { background-color: color-mix(in oklab, var(--viz-warn) 28%, transparent); } 100% { background-color: transparent; } }
@keyframes atc-pop { 0% { transform: scale(.85); } 60% { transform: scale(1.06); } 100% { transform: scale(1); } }
.log-race.is-new, .log-item.is-new, li.item.is-new { animation: atc-arrive .35s ease-out, atc-glow 2.4s ease-out; }
.net-chip.is-new { animation: atc-pop .45s ease-out; }
td.cell.is-new { animation: atc-pop .5s ease-out; }
:root[data-motion="reduce"] {
  .log-race.is-new, .log-item.is-new, li.item.is-new { animation: atc-glow 2.4s ease-out; }
  .net-chip.is-new, td.cell.is-new { animation: none; }
}

/* Sticky control rows + table headers.
   --hdr = site header height; --ctrl-h = this card's control row height (set by /sticky.js). */
:root { --hdr: 61px; }
@media (max-width: 1120px) { :root { --hdr: 97px; } }
table.compact-board thead th.race-col { vertical-align: bottom; padding-bottom: .55rem; }
.table-card { overflow: clip; }
.table-card-head { position: sticky; top: var(--hdr); z-index: 6; backdrop-filter: blur(12px); background: color-mix(in oklab, var(--muted) 55%, var(--card)); }
table.compact-board thead th { position: sticky; top: var(--hdr); z-index: 5; background: var(--card); box-shadow: inset 0 -1px 0 var(--border); }
.table-card table.compact-board thead th { top: calc(var(--hdr) + var(--ctrl-h, 0px) - 1px); }
@media (min-width: 768px) {
  /* Desktop tables fit the width, so no horizontal scroll container (which would break vertical sticky). */
  .table-wrap.board-wrap { overflow: visible; }
  .table-wrap.board-wrap:not(.bare) { overflow: clip; }
}
.viz-bin-count { text-anchor: middle; font-size: 10px; font-weight: 600; fill: var(--viz-ink-2); font-variant-numeric: tabular-nums; }
/* Timeline dot plot: one ink colour (grey means "nothing yet" elsewhere); a surface ring separates overlapping dots */
.viz-dot-mark { fill: var(--viz-ink); fill-opacity: .82; stroke: none; transition: fill-opacity .15s ease; }
.viz-dot:hover .viz-dot-mark { fill-opacity: 1; }
.viz-dot-count { text-anchor: middle; font-size: 10px; font-weight: 600; fill: var(--viz-surface); font-variant-numeric: tabular-nums; pointer-events: none; }

/* "First to call": a small corner notch instead of an outline (keeps the grid calm). White on coloured cells. */
table.compact-board td.compact { position: relative; }
table.compact-board td.compact.first::after {
  content: ""; position: absolute; top: 0; right: 0; width: 0; height: 0; border-style: solid;
  border-width: 0 9px 9px 0; border-color: transparent var(--first-mark, var(--foreground)) transparent transparent;
}
table.compact-board td.compact.first:is(.called, .party_called, .too_close) { --first-mark: #fff; }
/* In pills the first caller gets a heavy border (the corner notch is for table cells). */
.net-chip.first { border: 2px solid var(--foreground); padding: 0 calc(.45rem - 1px); }
.site-key .sw.first-mark { position: relative; background: var(--viz-none); box-shadow: inset 0 0 0 1px var(--viz-grid); overflow: hidden; }
.site-key .sw.first-mark::after { content: ""; position: absolute; top: 0; right: 0; border-style: solid; border-width: 0 7px 7px 0; border-color: transparent var(--foreground) transparent transparent; }

/* Hover affordances: anything that opens a page */
a.chev { text-decoration: none; display: inline-flex; align-items: center; } /* centre the chevron, also when the name wraps to two lines */
a.chev::after, .lb-row-name.chev::after { content: "›"; content: "›" / ""; display: inline-block; margin-left: .3em; opacity: 0; transform: translateX(-4px); transition: opacity .15s ease, transform .2s ease; color: var(--muted-foreground); }
a.chev:hover::after, a.chev:focus-visible::after, tr[data-href]:hover a.chev::after { opacity: 1; transform: none; }
a.chev:hover { text-decoration: underline; text-decoration-color: color-mix(in oklab, currentColor 35%, transparent); }
tr[data-href] { cursor: pointer; }
tr[data-href] > th, tr[data-href] > td:not(.cell) { transition: background-color .15s ease; }
tr[data-href]:hover > th, tr[data-href]:hover > td:not(.cell) { background: color-mix(in oklab, var(--muted) 70%, transparent); }
table.compact-board tr[data-href]:hover td.cell { filter: brightness(.95); }
.net-chip { transition: background-color .15s ease, transform .15s ease; }
.net-chip:hover { transform: translateY(-1px); }
.arrow-link .arrow { display: inline-block; transition: transform .2s ease; }
.arrow-link:hover .arrow { transform: translateX(3px); }
.viz-map a rect { transition: opacity .15s ease, transform .2s ease; transform-box: fill-box; transform-origin: center; }
.viz-map a:hover rect:first-child { transform: scale(1.04); }
:root[data-motion="reduce"] {
  a.chev::after, .net-chip, .arrow-link .arrow, .viz-map a rect { transition: none; }
  .net-chip:hover, .arrow-link:hover .arrow, .viz-map a:hover rect:first-child { transform: none; }
}

/* Map on the Senate/Governor boards, between the balance of power and the table */
.board-map { margin-top: 2rem; scroll-margin-top: calc(var(--hdr) + 1rem); }
#board-charts > .viz-card + .board-map { margin-top: 2rem; }
/* Map views as a sidebar inside the map card; the map centred in the remaining space */
.tilemap-body.has-side { display: grid; grid-template-columns: 9.5rem 1fr; gap: 1.5rem; align-items: start; }
.tilemap-body.has-side > svg { justify-self: center; width: 100%; max-width: 760px; }
.map-views { display: flex; flex-direction: column; align-items: stretch; gap: .125rem; }
.map-views a { justify-content: flex-start; }
.map-views-sep { margin: .6rem .6rem .2rem; font-size: 11px; font-weight: 500; text-transform: uppercase; letter-spacing: .05em; color: var(--muted-foreground); }
/* Small screens: the view list becomes a select */
.map-select-wrap { display: none; }
.map-select { width: 100%; height: 2.4rem; padding: 0 2rem 0 .8rem; border: 1px solid var(--border); border-radius: var(--radius-md, 8px); background: var(--card) url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' fill='none' stroke='%23888' stroke-width='2' stroke-linecap='round' stroke-linejoin='round' viewBox='0 0 24 24'%3E%3Cpath d='m6 9 6 6 6-6'/%3E%3C/svg%3E") no-repeat right .65rem center; appearance: none; color: var(--foreground); font: inherit; font-size: .9rem; }
@media (max-width: 767px) {
  .tilemap-body.has-side { grid-template-columns: 1fr; gap: .75rem; }
  .map-views { display: none; }
  .map-select-wrap { display: block; }
}
/* Row hover: call cells fade at the same speed as the race name cell */
table.compact-board tr[data-href] td.cell { transition: filter .15s ease; }
/* Table card footer (Call Log paging) */
.table-card-foot { display: flex; justify-content: space-between; align-items: center; padding: .7rem 1rem; border-top: 1px solid var(--border); background: color-mix(in oklab, var(--muted) 45%, var(--card)); font-size: .875rem; }
.table-pagination { display: flex; flex-wrap: wrap; align-items: center; gap: .5rem; }
.table-reset { display: inline-flex; align-items: center; gap: .5rem; margin-left: auto; }
.table-reset [role="alert"] { font-size: .8rem; }
.table-card-foot .pager { font-weight: 500; text-decoration: none; padding: .3rem .6rem; border-radius: 8px; }
.table-card-foot .pager:hover { background: var(--muted); }
.arrow-link[rel="prev"]:hover .arrow { transform: translateX(-3px); }
/* Network standings: podium + ranked list */
.lb-podium { list-style: none; margin: 0; padding: 0; display: grid; grid-template-columns: 1.15fr 1fr 1fr; gap: 1rem; }
.lb-card { border: 1px solid var(--border); border-radius: var(--radius-xl, 14px); background: var(--card); transition: border-color .15s ease, transform .15s ease, box-shadow .15s ease; }
.lb-card.lead { border: 2px solid var(--foreground); }
.lb-card:hover { transform: translateY(-2px); box-shadow: 0 6px 20px rgb(0 0 0 / .06); }
.lb-card-link { display: flex; flex-direction: column; gap: .8rem; padding: 1.1rem 1.25rem 1.2rem; color: inherit; text-decoration: none; height: 100%; }
.lb-card-top { display: flex; align-items: baseline; gap: .6rem; }
.lb-rank { font-size: .8rem; font-weight: 600; text-transform: uppercase; letter-spacing: .04em; color: var(--muted-foreground); }
.lb-card.lead .lb-rank { color: var(--foreground); }
.lb-name { font-size: 1.05rem; font-weight: 600; }
.lb-big { display: flex; align-items: baseline; gap: .6rem; flex-wrap: wrap; }
.lb-big-n { font-size: 3.25rem; line-height: 1; font-weight: 650; letter-spacing: -.03em; font-variant-numeric: tabular-nums; }
.lb-card:not(.lead) .lb-big-n { font-size: 2.6rem; }
.lb-big-l { font-size: .85rem; color: var(--muted-foreground); }
.lb-track { display: block; flex: 1; height: 8px; border-radius: 999px; background: var(--muted); overflow: hidden; }
.lb-track.lg { flex: none; height: 10px; }
.lb-track > span { display: block; height: 100%; background: var(--viz-ink); border-radius: 0 4px 4px 0; }
.lb-stats { display: grid; grid-template-columns: repeat(3, 1fr); gap: .5rem; margin: 0; padding-top: .7rem; border-top: 1px solid var(--border); }
.lb-stats dt { font-size: .7rem; text-transform: uppercase; letter-spacing: .04em; color: var(--muted-foreground); }
.lb-stats dd { margin: .1rem 0 0; font-weight: 600; font-variant-numeric: tabular-nums; }
.lb-list { list-style: none; margin: 1rem 0 0; padding: 0; border: 1px solid var(--border); border-radius: var(--radius-xl, 14px); background: var(--card); overflow: hidden; }
.lb-list li + li { border-top: 1px solid var(--border); }
.lb-row { display: grid; grid-template-columns: 2.5rem 11rem minmax(8rem, 1fr) auto; align-items: center; gap: 1rem; padding: .7rem 1.25rem; color: inherit; text-decoration: none; transition: background-color .15s ease; }
.lb-row:hover { background: color-mix(in oklab, var(--muted) 70%, transparent); }
.lb-row-rank { font-weight: 600; color: var(--muted-foreground); font-variant-numeric: tabular-nums; }
.lb-row-name { font-weight: 600; }
.lb-row:hover .lb-row-name.chev::after { opacity: 1; transform: none; }
.lb-row-bar { display: flex; align-items: center; gap: .6rem; }
.lb-row-bar b { font-variant-numeric: tabular-nums; width: 2rem; text-align: right; flex: none; }
.lb-row-meta { display: grid; grid-template-columns: 5.5rem 7rem 5.5rem 6rem; gap: .75rem; text-align: right; font-size: .8rem; color: var(--muted-foreground); font-variant-numeric: tabular-nums; white-space: nowrap; }
@media (max-width: 900px) {
  .lb-podium { grid-template-columns: 1fr; }
  .lb-row { grid-template-columns: 2rem 1fr; row-gap: .35rem; }
  .lb-row-bar, .lb-row-meta { grid-column: 2; }
  .lb-row-meta { display: flex; flex-wrap: wrap; gap: .25rem .8rem; text-align: left; }
  .lb-row-meta span:empty { display: none; }
}
:root[data-motion="reduce"] { .lb-card, .lb-card:hover { transform: none; transition: none; } }
.lb-offices { display: grid; grid-template-columns: repeat(3, 1fr); gap: 1rem; margin-top: 1rem; }
.lb-office { border: 1px solid var(--border); border-radius: var(--radius-xl, 14px); background: var(--card); padding: 1rem 1.1rem; }
.lb-office h3 { font-size: .95rem; font-weight: 600; margin: 0 0 .6rem; }
.lb-office ol { list-style: none; margin: 0; padding: 0; display: grid; gap: .45rem; }
.lb-office li { display: grid; grid-template-columns: 8.5rem 1fr 1.75rem; align-items: center; gap: .6rem; font-size: .85rem; }
.lb-office li a { text-decoration: none; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.lb-office li a:hover { text-decoration: underline; }
.lb-office li b { text-align: right; font-variant-numeric: tabular-nums; }
@media (max-width: 900px) { .lb-offices { grid-template-columns: 1fr; } }

/* Latest-call pill, pinned to the bottom of live pages */
body:has(#live-pill-wrap:not(.is-dismissed):not(.is-hidden)) { padding-bottom: 4.5rem; }
/* No calls yet: no pill (it slides in with the first call) */
.live-pill-wrap.is-hidden { transform: translateX(-50%) translateY(calc(100% + 1.5rem)); opacity: 0; pointer-events: none; visibility: hidden; }
/* Wrapper holds the pill (a link) and its close button (a button can't sit inside a link) */
.live-pill-wrap { position: fixed; z-index: 45; left: 50%; bottom: calc(1rem + env(safe-area-inset-bottom)); transform: translateX(-50%); display: inline-flex; max-width: min(46rem, calc(100vw - 1.5rem)); transition: transform .3s cubic-bezier(.2,.8,.2,1), opacity .2s ease; }
.live-pill-wrap.is-dismissed { transform: translateX(-50%) translateY(calc(100% + 1.5rem)); opacity: 0; pointer-events: none; }
.live-pill { position: relative;
  display: flex; align-items: center; gap: .55rem; max-width: 100%; height: 2.6rem; padding: 0 2.5rem 0 1rem;
  border: 1px solid var(--border); border-radius: 999px; background: var(--card); /* solid, so it reads over busy charts */
  box-shadow: 0 10px 30px rgb(0 0 0 / .16), 0 2px 6px rgb(0 0 0 / .08); color: var(--foreground); text-decoration: none; font-size: .85rem; white-space: nowrap;
  transition: box-shadow .15s ease, transform .15s ease; }
.live-pill:hover { box-shadow: 0 10px 32px rgb(0 0 0 / .14), 0 1px 2px rgb(0 0 0 / .06); transform: translateY(-1px); }
.live-pill-close { position: absolute; right: .4rem; top: 50%; transform: translateY(-50%); display: grid; place-items: center; width: 1.6rem; height: 1.6rem; border-radius: 999px; color: var(--muted-foreground); transition: background-color .15s, color .15s; }
.live-pill-close:hover { background: var(--muted); color: var(--foreground); }
.live-pill-close:focus-visible { outline: 2px solid var(--ring); outline-offset: 1px; }
.live-pill-wrap:hover .live-pill-close { transform: translateY(calc(-50% - 1px)); }
.live-pill-time { flex: none; font-variant-numeric: tabular-nums; font-weight: 600; }
.live-pill-text { min-width: 0; overflow: hidden; text-overflow: ellipsis; }
.live-pill { overflow: visible; --pill-c: color-mix(in oklab, var(--foreground) 35%, transparent); }
.live-pill.dem { --pill-c: color-mix(in oklab, var(--viz-d) 55%, transparent); } .live-pill.rep { --pill-c: color-mix(in oklab, var(--viz-r) 55%, transparent); } .live-pill.oth { --pill-c: color-mix(in oklab, var(--viz-i) 55%, transparent); }
.live-pill-inner { display: flex; align-items: center; gap: .55rem; min-width: 0; }
.live-pill-stage { position: relative; display: flex; align-items: center; align-self: stretch; min-width: 0; overflow: hidden; }
.live-pill-inner.is-leaving { position: absolute; left: 0; top: 0; bottom: 0; pointer-events: none; }
.live-pill-burst { font-weight: 600; }
.live-pill-sep { flex: none; color: var(--muted-foreground); }
.live-pill-text { color: var(--foreground); font-weight: 500; }
:root[data-theme="dark"] .live-pill { background: oklch(0.24 0 0); box-shadow: 0 10px 30px rgb(0 0 0 / .5), 0 2px 6px rgb(0 0 0 / .3); }
.live-pill:hover .live-pill.is-empty .live-pill-time { display: none; }
/* Party of the latest call as a 2px border */
.live-pill.dem, .live-pill.rep, .live-pill.oth { border-width: 2px; }
.live-pill.dem { border-color: var(--viz-d); } .live-pill.rep { border-color: var(--viz-r); } .live-pill.oth { border-color: var(--viz-i); }
@media (max-width: 640px) { .live-pill { font-size: .8rem; } }
:root[data-motion="reduce"] { .live-pill, .live-pill:hover { transition: none; }  }
.demo-banner { background: color-mix(in oklab, var(--viz-warn) 22%, var(--background)); border-bottom: 1px solid color-mix(in oklab, var(--viz-warn) 45%, transparent); text-align: center; font-size: .8rem; padding: .35rem 1rem; }
.demo-banner code { font-size: .75rem; }
.tilemap-svg { overflow: visible; }

/* Page-to-page navigation: a cross-document view transition instead of a hard repaint.
   The header and the latest-call pill are named, so they stay put while the page body crossfades.
   Browsers without support just navigate normally. */
@view-transition { navigation: auto; }
.top-stack > header { view-transition-name: site-header; }
#live-pill-wrap { view-transition-name: live-pill; }
::view-transition-old(root), ::view-transition-new(root) { animation-duration: .16s; }
::view-transition-group(site-header), ::view-transition-group(live-pill) { animation-duration: 0s; }

/* Countdown to the next check: a draining ring with the seconds ticking in the middle.
   At zero it spins while checking; if the check brought new calls, it flashes. */
.next-check { position: relative; display: inline-grid; place-items: center; flex: none; width: 28px; height: 28px; color: var(--foreground); }
.next-check svg { position: absolute; inset: 0; transform: rotate(-90deg) scaleY(-1); overflow: visible; } /* start at 12 o'clock, run anticlockwise */
.next-check-track { fill: none; stroke: var(--border); stroke-width: 2.5; }
.next-check-ring { fill: none; stroke: currentColor; stroke-width: 2.5; stroke-linecap: round; stroke-dasharray: 75.4; stroke-dashoffset: 0; animation: atc-drain linear forwards; }
@keyframes atc-drain { to { stroke-dashoffset: 75.4; } }
.next-check-spin { fill: none; stroke: currentColor; stroke-width: 2.5; stroke-linecap: round; stroke-dasharray: 18 57.4; transform-origin: 14px 14px; animation: atc-spin .6s linear infinite; }
/* -360 inside the mirrored svg: spins the same way the countdown edge travels */
@keyframes atc-spin { to { transform: rotate(-360deg); } }
.next-check-n { position: relative; font-family: ui-monospace, "SF Mono", "JetBrains Mono", Menlo, monospace; font-size: 10.5px; font-weight: 600; line-height: 1; font-variant-numeric: tabular-nums; letter-spacing: -.02em; animation: atc-tick .28s cubic-bezier(.2,.8,.2,1); }
@keyframes atc-tick { from { transform: translateY(45%); opacity: 0; } to { transform: none; opacity: 1; } }
.next-check[data-state="checking"] { animation: atc-breathe .45s ease-out; }
@keyframes atc-breathe { 50% { transform: scale(1.12); } }
.next-check-flash { position: absolute; inset: -2px; border-radius: 999px; background: color-mix(in oklab, var(--foreground) 18%, transparent); animation: atc-flash .9s ease-out forwards; pointer-events: none; }
@keyframes atc-flash { from { transform: scale(.6); opacity: 1; } to { transform: scale(1.6); opacity: 0; } }
:root[data-motion="reduce"] { .next-check-n, .next-check[data-state="checking"], .next-check-flash, .next-check-spin { animation: none; } }
@media (max-width: 767px) { .next-check { width: 24px; height: 24px; } .next-check svg { width: 24px; height: 24px; } }

/* Rotating through several calls from the newest minute: a counter, and progress traced around the pill's outline */
.live-pill-count { flex: none; display: none; font-family: ui-monospace, "SF Mono", Menlo, monospace; font-size: 10.5px; font-weight: 600; font-variant-numeric: tabular-nums;
  padding: .15rem .4rem; border-radius: 999px; background: var(--muted); color: var(--muted-foreground); }
.live-pill.is-rotating .live-pill-count, .live-pill.is-settled .live-pill-count { display: inline-block; }
.live-pill.is-paused .live-pill-count { background: var(--secondary); color: var(--foreground); }
/* The outline progress: an svg laid over the pill's 2px border, traced clockwise from the top centre in the current call's party colour */
.live-pill-ring { position: absolute; inset: -2px; width: calc(100% + 4px); height: calc(100% + 4px); pointer-events: none; overflow: visible; display: none; }
.live-pill-ring path { fill: none; stroke: var(--viz-ink); stroke-width: 2; stroke-linecap: round; stroke-dasharray: 100; stroke-dashoffset: 100; }
.live-pill.dem .live-pill-ring path { stroke: var(--viz-d); } .live-pill.rep .live-pill-ring path { stroke: var(--viz-r); } .live-pill.oth .live-pill-ring path { stroke: var(--viz-i); }
.live-pill.is-rotating .live-pill-ring, .live-pill.is-tracing .live-pill-ring { display: block; }
.live-pill.is-tracing { border-width: 2px; border-color: var(--border) !important; } /* a single new call: its party colour traces in around the outline, then stays as the border */
.live-pill.is-rotating { border-width: 2px; border-color: var(--border) !important; }
.live-pill-inner { transform-origin: 50% 50%; backface-visibility: hidden; }

/* Reduced motion chosen in the footer (or by the OS, which the inline head script folds into data-motion). */
:root[data-motion="reduce"] *, :root[data-motion="reduce"] *::before, :root[data-motion="reduce"] *::after {
  animation-duration: .001ms !important; animation-iteration-count: 1 !important; transition-duration: .001ms !important; scroll-behavior: auto !important; }
:root[data-motion="reduce"]::view-transition-group(*), :root[data-motion="reduce"]::view-transition-old(*), :root[data-motion="reduce"]::view-transition-new(*) { animation: none !important; }
:root[data-motion="reduce"] .next-check-ring { animation-duration: 10s !important; } /* the countdown still drains: it carries information */
:root[data-theme="dark"] { color-scheme: dark; } :root[data-theme="light"] { color-scheme: light; }

/* Footer display settings */
.site-prefs { display: flex; flex-wrap: wrap; gap: .75rem 1.5rem; align-items: center; margin-top: 1.25rem; padding-top: 1rem; border-top: 1px solid var(--border); font-size: .8rem; }
.pref { display: inline-flex; align-items: center; gap: .5rem; }
.pref-label { color: var(--muted-foreground); }
.seg { display: inline-flex; align-items: center; height: 1.6rem; padding: 2px; border: 1px solid color-mix(in oklab, var(--border) 70%, transparent); border-radius: 999px; }
.seg button { height: 100%; padding: 0 .65rem; border-radius: 999px; color: var(--muted-foreground); font-size: .75rem; transition: background-color .15s, color .15s; }
.seg button:hover { color: var(--foreground); }
.seg button[aria-pressed="true"] { background: var(--secondary); color: var(--foreground); font-weight: 600; }
/* Reduced motion: no traced outline while rotating; the pill keeps its plain party-colour border */
:root[data-motion="reduce"] .live-pill-ring { display: none !important; }
:root[data-motion="reduce"] .live-pill.is-rotating.dem { border-color: var(--viz-d) !important; }
:root[data-motion="reduce"] .live-pill.is-rotating.rep { border-color: var(--viz-r) !important; }
:root[data-motion="reduce"] .live-pill.is-rotating.oth { border-color: var(--viz-i) !important; }

/* Small screens: board tables now fit the width, so drop the sideways-scroll wrapper (a scroll container would
   trap the sticky header row inside the table instead of letting it stick under the site header). */
@media (max-width: 767px) {
  .table-wrap.board-wrap { overflow: visible; }
  .table-wrap.board-wrap:not(.bare) { overflow: clip; }
}
@media (max-width: 380px) {
  table.compact-board .race-col { width: 7rem; font-size: .8rem; }
  table.compact-board td.compact, table.compact-board th.vert { min-width: 1.3rem; }
}

/* Small screens: the pill gets two lines (time on top, the sentence below) instead of truncating */
@media (max-width: 640px) {
  .live-pill-wrap { left: .75rem; right: .75rem; transform: none; max-width: none; display: flex; }
  .live-pill-wrap.is-dismissed { transform: translateY(calc(100% + 1.5rem)); }
  .live-pill { width: 100%; height: auto; min-height: 3.6rem; padding: .5rem 2.6rem .55rem .9rem; border-radius: 1.1rem; white-space: normal; }
  .live-pill-inner { flex-wrap: wrap; row-gap: .1rem; column-gap: .4rem; align-content: center; }
  .live-pill-sep { display: none; }
  .live-pill-text { flex-basis: 100%; display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; line-height: 1.3; }
  .live-pill-time { font-size: .75rem; }
  body:has(#live-pill-wrap:not(.is-dismissed):not(.is-hidden)) { padding-bottom: 5.5rem; }
  .live-pill-wrap.is-hidden { transform: translateY(calc(100% + 1.5rem)); }
}

/* Small screens: a narrower, wrapping race column so all nine network columns get usable cells */
@media (max-width: 767px) {
  table.compact-board .race-col { width: 8.5rem; white-space: normal; font-size: .85rem; line-height: 1.25; }
  table.compact-board td.compact, table.compact-board th.vert { min-width: 1.55rem; }
}

@media (max-width: 640px) { /* after the base Call Log rules so these win */
  /* Phones: each minute is its own clearly separated block, with the time as a small heading and room between races */
  .log-minute, .log-source { grid-template-columns: 1fr; gap: .5rem; padding: 1.25rem 0 1.1rem; }
  .log-race { padding: .55rem 0; }
  .log-race + .log-race, .log-more { margin-top: .4rem; padding-top: .8rem; }
}
#map-section[aria-busy="true"] .viz-map svg { opacity: .55; transition: opacity .15s; }
.site-credit { margin-top: 1.25rem; font-size: .8rem; }
.site-legal { margin-top: .2rem; font-size: .7rem; color: color-mix(in oklab, var(--muted-foreground) 80%, transparent); }
.site-legal a { text-decoration: underline; text-underline-offset: 2px; }
.site-legal a:hover { color: var(--foreground); }
.legal { max-width: 46rem; }
.legal h2 { margin-top: 2rem; font-size: 1.1rem; }
.legal p, .legal li { line-height: 1.65; color: var(--foreground); }
.legal ul { list-style: disc; padding-left: 1.25rem; }
.site-credit a { text-decoration: underline; text-underline-offset: 2px; }
.site-credit a:hover { color: var(--foreground); }

/* The footer always starts below the fold: the page body fills at least the viewport under the sticky header. */
body > main { min-height: calc(100svh - var(--hdr)); }

/* Email sign-up banner: full-bleed gradient under the header on every page */
.sub-banner { background: linear-gradient(90deg, #2563eb 0%, #6d4bb3 50%, #dc2626 100%); color: #fff; scroll-margin-top: var(--hdr); }
.sub-banner[hidden] { display: none; }
.sub-inner { position: relative; max-width: 1280px; margin: 0 auto; padding: 1rem 3.25rem 1rem 1.25rem; display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 30rem); gap: .75rem 2rem; align-items: center; }
.sub-title { margin: 0; font-size: 1.15rem; font-weight: 700; letter-spacing: -.01em; }
.sub-row { display: flex; gap: .5rem; }
.sub-row input { flex: 1; min-width: 0; height: 2.6rem; padding: 0 .9rem; border: 0; border-radius: var(--radius-md, 8px); background: #fff; color: #111; font: inherit; box-shadow: 0 1px 2px rgb(0 0 0 / .15); }
.sub-row input::placeholder { color: #6b7280; }
.sub-row input:focus-visible { outline: 3px solid rgb(255 255 255 / .6); outline-offset: 1px; }
.sub-row button { flex: none; height: 2.6rem; padding: 0 1.15rem; border-radius: var(--radius-md, 8px); background: #111; color: #fff; font-weight: 700; box-shadow: 0 1px 2px rgb(0 0 0 / .2); }
.sub-row button:hover { background: #000; }
.sub-row button:disabled { opacity: .7; cursor: progress; }
.sub-detail { margin: .25rem 0 0; font-size: .875rem; line-height: 1.4; opacity: .9; }
.sub-links { margin-top: .25rem; text-align: left; line-height: 1.2; }
.sub-privacy { margin-left: 0; color: #fff; opacity: .85; font-size: .78rem; text-decoration: underline; text-underline-offset: 2px; }
.sub-msg { margin: .35rem 0 0; font-size: .85rem; font-weight: 600; min-height: 0; }
.sub-msg:empty { display: none; }
.sub-msg[data-state="error"] { color: #fff; text-decoration: underline wavy rgb(255 255 255 / .6); }
.sub-close { position: absolute; top: .75rem; right: .75rem; display: grid; place-items: center; width: 1.9rem; height: 1.9rem; border-radius: 999px; color: #fff; opacity: .85; }
.sub-close:hover { opacity: 1; background: rgb(255 255 255 / .15); }
.sub-banner[data-placement="footer"] .sub-inner { padding: 2.5rem 1.25rem; }
@media (max-width: 767px) {
  .sub-inner { grid-template-columns: minmax(0, 1fr); padding: .9rem 3rem .95rem 1.1rem; gap: .6rem; }
  .sub-title { font-size: 1rem; }
}

/* Email alerts page */
.alerts-card { margin-top: 2rem; padding: 1.5rem; border-radius: var(--radius-xl, 14px); background: linear-gradient(90deg, #2563eb 0%, #6d4bb3 50%, #dc2626 100%); color: #fff; max-width: 46rem; }
.alerts-lists { margin: 1.1rem 0 0; padding: 0; border: 0; display: grid; gap: .65rem; }
.alerts-lists legend { font-size: .8rem; font-weight: 600; text-transform: uppercase; letter-spacing: .05em; opacity: .9; margin-bottom: .5rem; }
.alerts-lists label { display: flex; gap: .6rem; align-items: flex-start; cursor: pointer; font-size: .9rem; line-height: 1.4; }
.alerts-lists input { width: 1.05rem; height: 1.05rem; margin-top: .15rem; accent-color: #111; flex: none; }
.alerts-lists strong { display: block; font-weight: 700; }
.alerts-card .sub-msg { margin-top: .8rem; }
.alerts-races { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 1rem 2rem; margin-top: 1rem; max-width: 46rem; }
.alerts-races h3 { font-size: .95rem; font-weight: 600; margin: 0 0 .4rem; }
.alerts-races ul { list-style: none; margin: 0; padding: 0; display: grid; gap: .25rem; font-size: .9rem; }
.alerts-races a { text-decoration: none; } .alerts-races a:hover { text-decoration: underline; }
@media (max-width: 640px) { .alerts-races { grid-template-columns: 1fr; } }

/* Header + email banner stick together at the top */
.top-stack { position: sticky; top: 0; z-index: 40; }
.top-stack > header { position: relative; }
@media (max-width: 767px) {
  /* Keep the sticky banner short on phones: title and the email row. */
  .sub-inner { padding-top: .7rem; padding-bottom: .75rem; gap: .45rem; }
  .sub-title { font-size: .95rem; }
  .sub-row input, .sub-row button { height: 2.3rem; }
  .sub-close { top: .45rem; right: .5rem; }
}

/* Live updates */
.updates { margin-top: 1rem; }
.update { display: grid; grid-template-columns: 7rem minmax(0, 1fr); gap: .5rem 1.25rem; padding: 1.1rem 0; border-top: 1px solid var(--border); }
.update:first-child { border-top: 0; padding-top: .25rem; }
.update-time { margin: 0; font-weight: 600; font-variant-numeric: tabular-nums; }
.update-time a { text-decoration: none; } .update-time a:hover { text-decoration: underline; }
.update-body h3 { margin: 0 0 .35rem; font-size: 1.05rem; font-weight: 650; letter-spacing: -.01em; }
.update-body p { margin: 0 0 .55rem; line-height: 1.6; max-width: 46rem; }
.updates-more { margin-top: .75rem; text-align: right; }
@media (max-width: 640px) { .update { grid-template-columns: 1fr; gap: .2rem; } }
.update-form { display: grid; gap: .75rem; max-width: 46rem; }
.update-form label { display: grid; gap: .3rem; font-size: .85rem; font-weight: 600; }
.update-form input, .update-form textarea { font: inherit; font-weight: 400; padding: .5rem .7rem; border: 1px solid var(--input); border-radius: 8px; background: var(--background); color: var(--foreground); }
.update-form button { justify-self: start; padding: .5rem 1rem; border-radius: 8px; background: var(--foreground); color: var(--background); font-weight: 600; }
.admin-updates { list-style: none; padding: 0; margin: 1rem 0 2rem; display: grid; gap: .4rem; font-size: .9rem; }
/* Empty states inside cards (Call Log etc.): breathing room */
.log-body > .empty, .table-card .empty, .table-wrap > .empty { padding: 1.5rem 1.25rem; margin: 0; }

/* Footer contact form */
.contact { margin-top: 1.25rem; padding-top: 1rem; border-top: 1px solid var(--border); }
.contact summary { cursor: pointer; font-weight: 600; color: var(--foreground); width: fit-content; }
.contact-form { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: .75rem 1rem; margin-top: .9rem; max-width: 40rem; }
.contact-form label { display: grid; gap: .3rem; font-size: .8rem; font-weight: 600; color: var(--foreground); }
.contact-form label span { font-weight: 400; color: var(--muted-foreground); }
.contact-form .wide { grid-column: 1 / -1; }
.contact-form input, .contact-form textarea { font: inherit; font-size: .9rem; font-weight: 400; padding: .5rem .7rem; border: 1px solid var(--input); border-radius: 8px; background: var(--background); color: var(--foreground); }
.contact-actions { display: flex; align-items: center; gap: 1rem; }
.contact-actions button { padding: .5rem 1rem; border-radius: 8px; background: var(--foreground); color: var(--background); font-weight: 600; }
.contact-actions button:disabled { opacity: .6; }
.contact-msg { margin: 0; font-size: .85rem; font-weight: 500; color: var(--foreground); }
@media (max-width: 640px) { .contact-form { grid-template-columns: 1fr; } }

/* Race page: candidates and live vote counts (AP) */
.race-results { margin-top: 2rem; }
.race-results-head { display: flex; flex-wrap: wrap; align-items: baseline; justify-content: space-between; gap: .25rem 1rem; }
.race-results-head h2 { margin: 0; }
.race-results-meta { margin: 0; font-size: .85rem; color: var(--muted-foreground); }
.race-results-meta strong { color: var(--foreground); }
.race-results-table { width: 100%; border-collapse: collapse; margin-top: .75rem; font-variant-numeric: tabular-nums; }
.race-results-table th, .race-results-table td { padding: .6rem .5rem; border-top: 1px solid var(--border); text-align: left; vertical-align: middle; }
.race-results-table thead th { font-size: .75rem; text-transform: uppercase; letter-spacing: .04em; color: var(--muted-foreground); font-weight: 600; border-top: 0; }
.race-results-table tbody th { font-weight: 600; border-left: 3px solid transparent; }
.race-results-table tr.dem th { border-left-color: var(--viz-d); } .race-results-table tr.rep th { border-left-color: var(--viz-r); } .race-results-table tr.oth th { border-left-color: var(--viz-i); }
.race-results-table .num { text-align: right; width: 8rem; }
.race-results-table .bar-col { width: 40%; }
.cand-name { margin-right: .5rem; }
.cand-party { font-size: .75rem; font-weight: 600; color: var(--muted-foreground); margin-right: .4rem; }
.cand-tag { display: inline-block; font-size: .68rem; font-weight: 600; padding: .05rem .4rem; border: 1px solid var(--border); border-radius: 999px; color: var(--muted-foreground); margin-right: .3rem; }
.cand-tag.win { background: var(--foreground); color: var(--background); border-color: var(--foreground); }
.cand-bar { display: inline-block; width: calc(100% - 3.5rem); height: 10px; border-radius: 999px; background: var(--muted); overflow: hidden; vertical-align: middle; }
.cand-bar > span { display: block; height: 100%; background: var(--viz-ink); border-radius: 0 4px 4px 0; }
tr.dem .cand-bar > span { background: var(--viz-d); } tr.rep .cand-bar > span { background: var(--viz-r); } tr.oth .cand-bar > span { background: var(--viz-i); }
.cand-pct { display: inline-block; width: 3.2rem; text-align: right; font-size: .85rem; }
.race-results-table tr.is-winner .cand-name { font-weight: 750; }
@media (max-width: 640px) {
  .race-results-table .bar-col { width: auto; }
  .race-results-table .num { width: 5.5rem; font-size: .85rem; }
  .cand-bar { display: none; }
}
/* Race page: candidate list (names only; no single-source vote counts) */
.cand-list { list-style: none; margin: .75rem 0 0; padding: 0; display: flex; flex-wrap: wrap; gap: .5rem; }
.cand-list li { display: inline-flex; align-items: center; gap: .1rem; padding: .4rem .75rem; border: 1px solid var(--border); border-left-width: 3px; border-radius: 8px; background: var(--card); font-weight: 600; }
.cand-list li.dem { border-left-color: var(--viz-d); } .cand-list li.rep { border-left-color: var(--viz-r); } .cand-list li.oth { border-left-color: var(--viz-i); }

/* My Races stars */
.star { display: inline-block; flex: none; width: 1.05rem; height: 1.05rem; padding: 0; border: 0; background: currentColor; color: var(--muted-foreground); opacity: .45; cursor: pointer;
  -webkit-mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2' stroke-linejoin='round'%3E%3Cpath d='m12 3 2.7 5.6 6.1.9-4.4 4.3 1 6.1L12 17l-5.4 2.9 1-6.1L3.2 9.5l6.1-.9z'/%3E%3C/svg%3E") center / contain no-repeat;
          mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2' stroke-linejoin='round'%3E%3Cpath d='m12 3 2.7 5.6 6.1.9-4.4 4.3 1 6.1L12 17l-5.4 2.9 1-6.1L3.2 9.5l6.1-.9z'/%3E%3C/svg%3E") center / contain no-repeat;
  transition: opacity .15s, color .15s, transform .15s; }
.star.is-on, .is-on > .star, .star-btn.is-on .star { opacity: 1; color: #e0a100;
  -webkit-mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='black'%3E%3Cpath d='m12 3 2.7 5.6 6.1.9-4.4 4.3 1 6.1L12 17l-5.4 2.9 1-6.1L3.2 9.5l6.1-.9z'/%3E%3C/svg%3E");
          mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='black'%3E%3Cpath d='m12 3 2.7 5.6 6.1.9-4.4 4.3 1 6.1L12 17l-5.4 2.9 1-6.1L3.2 9.5l6.1-.9z'/%3E%3C/svg%3E"); }
button.star:hover, tr:hover button.star { opacity: .9; }
button.star:focus-visible, .star-btn:focus-visible { outline: 2px solid var(--ring); outline-offset: 2px; border-radius: 4px; }
.star.pop, .star-btn.pop .star { animation: atc-pop .35s ease-out; }
table.compact-board th.race-col { white-space: nowrap; }
.race-cell { display: flex; align-items: center; gap: .45rem; }
@media (max-width: 767px) { table.compact-board th.race-col { white-space: normal; } .race-cell { gap: .35rem; } .race-cell > .star { width: .95rem; height: .95rem; } }
.race-title { display: flex; flex-wrap: wrap; align-items: center; gap: .5rem 1rem; }
.race-title h1 { margin-right: auto; }
.star-btn { display: inline-flex; align-items: center; gap: .45rem; height: 2.3rem; padding: 0 .9rem; border: 1px solid var(--border); border-radius: 999px; background: var(--card); font-weight: 600; font-size: .9rem; }
.star-btn:hover { background: var(--muted); }
.star-btn .star { opacity: .8; }
.my-races-link { display: inline-flex; align-items: center; gap: .4rem; height: 1.9rem; padding: 0 .55rem; background: transparent; border: 1px solid var(--border); border-radius: 999px; font-size: .8rem; font-weight: 600; color: var(--foreground); text-decoration: none; white-space: nowrap; }
.my-races-link:hover { border-color: color-mix(in oklab, var(--foreground) 25%, var(--border)); }
.my-races-link[aria-current="page"] { background: var(--muted); }
.my-races-link .star { opacity: 1; color: #e0a100; -webkit-mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='black'%3E%3Cpath d='m12 3 2.7 5.6 6.1.9-4.4 4.3 1 6.1L12 17l-5.4 2.9 1-6.1L3.2 9.5l6.1-.9z'/%3E%3C/svg%3E"); mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='black'%3E%3Cpath d='m12 3 2.7 5.6 6.1.9-4.4 4.3 1 6.1L12 17l-5.4 2.9 1-6.1L3.2 9.5l6.1-.9z'/%3E%3C/svg%3E"); }
.my-races-count { min-width: 1.15rem; height: 1.15rem; padding: 0 .3rem; border-radius: 999px; background: var(--foreground); color: var(--background); font-size: .68rem; line-height: 1.15rem; text-align: center; font-variant-numeric: tabular-nums; }
@media (max-width: 767px) { .my-races-label { display: inline; } .my-races-link { padding: 0 6px; gap: 4px; font-size: 12px; } }
@media (max-width: 374px) { .site-status .upd-label { display: none; } }
@media (max-width: 339px) { .my-races-label { display: none; } }


/* Phone data panels span the viewport; prose and controls keep the page gutter. */
@media (max-width: 767px) {
  main :is(.table-wrap, .table-card, .viz-card) {
    margin-inline: -1.25rem;
    border-inline: 0;
    border-radius: 0;
    box-shadow: none;
  }
  /* A table within a panel already has the full width. */
  main :is(.table-card, .viz-card) .table-wrap { margin-inline: 0; }
  main .viz-card {
    border-block: 0;
    margin-block: 3rem;
  }
  main .table-wrap { padding-right: .75rem; }
  main .viz-card > [data-slot="card-content"] { padding-inline: 1.25rem; }
  main .table-card > .log-body { padding-inline: 1.25rem; }
}

.sub-banner[data-phase="first"] .phase-major, .sub-banner[data-phase="major"] .phase-first, .sub-banner .sub-sub { display: none; }

/* Shared live-update typography in the editor and published posts. */
.rich-content { line-height: 1.6; overflow-wrap: anywhere; }
.rich-content p { margin: 0 0 .65rem; }
.rich-content .update-audio { display: block; margin: .15rem 0 .1rem; }
.rich-content .update-audio audio { display: block; width: 100%; max-width: 28rem; height: 2.5rem; margin-bottom: .3rem; }
.rich-content .update-audio a { font-size: .875rem; }
.rich-content h3, .rich-content h4 { margin: 1rem 0 .4rem; line-height: 1.3; font-weight: 650; }
.rich-content h3 { font-size: 1.15rem; }
.rich-content h4 { font-size: 1rem; }
.rich-content ul, .rich-content ol { margin: .5rem 0 .8rem; padding-left: 1.5rem; }
.rich-content ul { list-style: disc; }
.rich-content ol { list-style: decimal; }
.rich-content li > p { margin: .15rem 0; }
.rich-content blockquote { margin: .75rem 0; padding-left: 1rem; border-left: 3px solid var(--border); color: var(--muted-foreground); }
.rich-content a { color: #1749ff; text-decoration: none; text-underline-offset: .15em; }
.rich-content a:hover, .rich-content a:focus-visible { text-decoration: underline; }
.dark .rich-content a { color: #8eaeff; }
.rich-content .update-source-link { white-space: nowrap; }
.rich-content .update-source-icon { display: inline-block; width: 1em; height: 1em; margin-right: .25em; border-radius: .2em; object-fit: contain; vertical-align: -.12em; }
.rich-content code { border-radius: 3px; padding: .1rem .25rem; background: var(--muted); font-size: .9em; }
.rich-content hr { margin: 1rem 0; border-top: 1px solid var(--border); }
.update-editor { min-width: 0; }
.update-editor-label { font-size: .85rem; font-weight: 600; margin-bottom: .3rem; }
.update-editor-toolbar { display: flex; flex-wrap: wrap; gap: .2rem; padding: .4rem; border: 1px solid var(--input); border-radius: 8px 8px 0 0; background: var(--muted); }
.update-form .update-editor-toolbar button { display: grid; place-items: center; padding: .45rem; background: transparent; color: var(--foreground); border-radius: 4px; }
.update-form .update-editor-toolbar button[aria-pressed="true"], .update-form .update-editor-toolbar button:hover { background: var(--background); box-shadow: 0 1px 3px rgb(0 0 0 / .12); }
.update-editor-toolbar button:disabled { opacity: .35; }
.update-editor-toolbar select { font-size: .875rem; color: var(--foreground); background: var(--background); border: 1px solid var(--input); border-radius: 4px; padding: .2rem; }
.update-editor-content { min-height: 10rem; padding: .8rem; border: 1px solid var(--input); border-top: 0; border-radius: 0 0 8px 8px; background: var(--background); font-size: 1rem; font-weight: 400; outline: none; }
.update-editor-content:focus { box-shadow: 0 0 0 2px var(--ring); }
.update-editor-content > :first-child { margin-top: 0; }
.update-editor textarea { width: 100%; }
.update-editor-count { margin-top: .3rem; font-size: .75rem; text-align: right; color: var(--muted-foreground); }
.update-editor-error { font-size: .875rem; color: var(--destructive); margin-top: .4rem; }
.update-editor-link { display: flex; flex-wrap: wrap; align-items: center; gap: .4rem; padding: .5rem; border-inline: 1px solid var(--input); }
.update-editor-link input { min-width: 0; flex: 1; font-size: 1rem; }
.update-form .update-editor-link button { font-size: .75rem; padding: .4rem .5rem; }

/* Chamber control is derived from each network's called seats, never leading seats. */
.viz-bop:has(> .chamber-control) { padding-top: 0; }
.chamber-control { position: relative; isolation: isolate; overflow: hidden; padding: 22px 20px; border-bottom: 1px solid var(--border); background: var(--muted); }
.chamber-control-top { display: flex; align-items: center; gap: 16px; }
.chamber-control-icon { display: grid; place-items: center; flex: none; width: 46px; height: 46px; border: 1px solid var(--border); border-radius: 14px; color: var(--muted-foreground); background: var(--card); }
.chamber-control-icon svg { width: 23px; height: 23px; }
.chamber-control-copy { flex: 1; min-width: 0; }
.chamber-control-title { font-size: clamp(19px, 2.4vw, 29px); font-weight: 700; letter-spacing: -.025em; line-height: 1.15; }
.chamber-control-note { margin-top: 7px; font-size: 13px; line-height: 1.5; color: var(--muted-foreground); }
.chamber-control[data-party="D"], .nav-cell[data-control="D"] { --control-color: var(--viz-d); }
.chamber-control[data-party="R"], .nav-cell[data-control="R"] { --control-color: var(--viz-r); }
.chamber-control[data-state="split"], .nav-cell[data-control="split"] { --control-color: var(--viz-warn); }
.chamber-control[data-state="called"], .chamber-control[data-state="split"] { background: color-mix(in oklab, var(--control-color) 14%, var(--card)); }
.chamber-control[data-state="called"] { animation: chamber-control-arrive .65s cubic-bezier(.16,1,.3,1); }
.chamber-control[data-state="called"]::after { content: ""; z-index: -1; position: absolute; inset: 0; background: linear-gradient(110deg, transparent 30%, rgb(255 255 255 / .3) 50%, transparent 70%); animation: chamber-control-sheen 1.4s ease-out; transform: translateX(110%); }
.chamber-control[data-state="called"] .chamber-control-icon { background: var(--control-color); border-color: var(--control-color); color: white; }
.chamber-control-count { display: grid; gap: 2px; text-align: right; flex: none; }
.chamber-control-count b { font-size: 30px; line-height: 1; letter-spacing: -.04em; font-variant-numeric: tabular-nums; }
.chamber-control-count > span { color: var(--muted-foreground); font-size: 11px; }
.chamber-control-sources { display: flex; flex-wrap: wrap; gap: 6px; margin: 16px 0 0 62px; }
.chamber-control-sources > span { display: inline-flex; align-items: center; gap: 4px; padding: 4px 8px; border-radius: 999px; border: 1px solid var(--border); font-size: 11px; font-weight: 600; color: var(--muted-foreground); background: var(--card); }
.chamber-control-sources > span[data-party="D"] { color: var(--viz-d); border-color: color-mix(in oklab, var(--viz-d) 55%, var(--border)); }
.chamber-control-sources > span[data-party="R"] { color: var(--viz-r); border-color: color-mix(in oklab, var(--viz-r) 55%, var(--border)); }
.nav-cell[data-control] { gap: 7px; background: color-mix(in oklab, var(--control-color) 8%, var(--background)); color: var(--foreground); }
.nav-control-pill { display: inline-flex; align-items: center; justify-content: center; gap: 4px; padding: 2px 6px; border-radius: 999px; background: var(--control-color); color: white; border: 1px solid var(--control-color); font-size: 11px; line-height: 1.2; font-weight: 700; font-variant-numeric: tabular-nums; }
.site-nav:has([data-control]) .nav-cell { flex-shrink: 0; min-width: max-content; }
@keyframes chamber-control-arrive { from { opacity: .5; transform: translateY(-12px); } to { opacity: 1; transform: translateY(0); } }
@keyframes chamber-control-sheen { from { transform: translateX(-110%); } to { transform: translateX(110%); } }
@media (max-width: 640px) { .chamber-control { padding: 18px 16px; } .chamber-control-top { gap: 12px; } .chamber-control-icon { width: 38px; height: 38px; border-radius: 11px; } .chamber-control-count b { font-size: 25px; } .chamber-control-count > span { max-width: 70px; } .chamber-control-sources { margin-left: 0; } }
@media (prefers-reduced-motion: reduce) { .chamber-control[data-state="called"], .chamber-control[data-state="called"]::after { animation: none; } }
:root[data-motion="reduce"] .chamber-control[data-state="called"], :root[data-motion="reduce"] .chamber-control[data-state="called"]::after { animation: none; }

.viz-size-key text { fill: var(--viz-ink-2); font-size: 12px; }

/* Keep optional leading-seat overlays out of the mobile chart header. */
.bop-leading-control-mobile { display: none; }
@media (max-width: 600px) {
  .bop-leading-control-desktop { display: none; }
  .bop-leading-control-mobile { display: flex; align-items: center; justify-content: space-between; gap: 12px; margin-top: 18px; padding-top: 10px; border-top: 1px solid var(--border); text-align: left; }
  .bop-leading-control-mobile .bop-leading-toggle { min-height: 44px; }
  .bop-leading-control-mobile .bop-leading-note { max-width: 110px; margin: 0; text-align: right; line-height: 1.4; }
}

.nav-cell[data-control="split"] .nav-control-pill { color: #1a1a1a; }

@media (max-width: 767px) {
  .site-nav:has([data-control]) .nav-cell { flex-direction: column; justify-content: flex-start; gap: 2px; padding-top: 3px; padding-bottom: 2px; line-height: 1.1; }
  .site-nav:has([data-control]) .nav-cell:not(:has(.nav-control-pill)) { justify-content: center; padding-top: 0; padding-bottom: 0; }
}