/* NC Ballot Tracker (/ballot-tracker). Colors follow the site palette:
   cream #F9F3E3, ink #1B1714, blue #0160A6, red #E43730, green #2E7D32. */
.bt { --ink: #1B1714; --ink2: #484542; --mute: #787776; --mute2: #93908E; --blue: #0160A6;
  --red: #E43730; --green: #2E7D32; --cream: #F9F3E3; --line: #E0E0E0; --edge: #E7DFCB;
  padding-top: 8px; font-family: PolymathText, sans-serif; color: var(--ink); }
.bt [hidden] { display: none !important; }
.bt-wrap { max-width: 1240px; margin: 0 auto; padding-left: clamp(16px, 4vw, 32px); padding-right: clamp(16px, 4vw, 32px); }
.bt-nowrap { white-space: nowrap; }

/* Hero */
.bt-hero { padding-top: clamp(40px, 6vw, 72px); }
.bt-title { font: 800 clamp(34px, 7vw, 68px) / 1.1 PolymathDisp, serif; letter-spacing: 0.2px; word-spacing: 0.12em; margin: 0 0 18px; text-wrap: balance; }
.bt-dek { font: 400 clamp(17px, 2vw, 21px) / 1.5 PolymathText, sans-serif; color: var(--ink2); max-width: 60ch; margin: 0 0 20px; text-wrap: pretty; }
.bt-status { display: flex; flex-wrap: wrap; align-items: center; gap: 6px 10px; font: 400 13px / 1.4 PolymathText, sans-serif; color: var(--mute); }
.bt-status b { font-weight: 600; color: var(--ink2); }
.bt-dot { color: #CCC6B5; }
.bt-live { display: inline-flex; align-items: center; gap: 8px; height: 26px; padding: 0 11px 0 9px; border-radius: 100px; background: #E8F3E8; color: #1B5E20; font: 600 12.5px / 1 PolymathText, sans-serif; white-space: nowrap; }
.bt-live-dot { width: 8px; height: 8px; border-radius: 50%; background: var(--green); box-shadow: 0 0 0 3px rgba(46, 125, 50, 0.2); }
.bt-live.stale { background: #FFF4E0; color: #8A5A00; }
.bt-live.stale .bt-live-dot { background: #E0A100; box-shadow: 0 0 0 3px rgba(224, 161, 0, 0.2); }
.bt-cta-row { display: flex; align-items: center; gap: 12px; flex-wrap: wrap; margin-top: 24px; }
.bt-cta { height: 50px; padding: 0 28px 0 22px; border-radius: 100px; background: var(--blue); color: #fff; font: 600 16px / 1 PolymathText, sans-serif; display: inline-flex; align-items: center; gap: 10px; text-decoration: none; }
.bt-cta-note { font: 400 14px / 1.45 PolymathText, sans-serif; color: var(--mute); }

/* White band + cards */
.bt-band { margin-top: clamp(32px, 4vw, 48px); background: #fff; border-top: 1px solid var(--edge); border-bottom: 1px solid var(--edge); }
.bt-stack { padding-top: clamp(28px, 4vw, 40px); padding-bottom: clamp(28px, 4vw, 40px); display: flex; flex-direction: column; gap: 16px; }
.bt-paper { background: #fff; border-radius: 16px; box-shadow: rgba(12, 12, 13, 0.06) 0 1px 2px, rgba(12, 12, 13, 0.07) 0 6px 20px; min-width: 0; }

/* Summary */
.bt-summary { padding: 26px 30px; }
.bt-eyebrow { display: flex; align-items: center; gap: 8px; font: 700 12.5px / 1.2 PolymathDisp, serif; letter-spacing: 1.4px; text-transform: uppercase; color: var(--blue); }
.bt-eyebrow-sm { font-size: 13px; letter-spacing: 1.2px; margin-bottom: 14px; }
.bt-summary-text { font: 600 17px / 1.55 PolymathText, sans-serif; color: var(--ink2); margin: 14px 0 0; max-width: 80ch; text-wrap: pretty; min-height: 3.1em; }
.bt-summary-text .t-bad { color: var(--red); }
.bt-summary-text .t-good { color: var(--green); }
.bt-summary-text .t-place { color: var(--ink); }
.bt-drivers { margin-top: 18px; padding-top: 16px; border-top: 1px solid var(--line); max-width: 80ch; }
.bt-drivers[hidden] { display: none; }
.bt-drivers-label { font: 700 12px / 1 PolymathText, sans-serif; letter-spacing: .08em; text-transform: uppercase; color: var(--mute2); }
.bt-drivers-list { list-style: none; margin: 10px 0 0; padding: 0; display: grid; gap: 8px; }
.bt-drivers-list li { position: relative; padding-left: 20px; font: 500 15.5px / 1.5 PolymathText, sans-serif; color: var(--ink2); text-wrap: pretty; }
.bt-drivers-list li::before { content: ""; position: absolute; left: 3px; top: .62em; width: 7px; height: 7px; border-radius: 50%; background: var(--ink2); opacity: .45; }
.bt-drivers-list .t-bad { color: var(--red); }
.bt-drivers-list .t-good { color: var(--green); }
.bt-drivers-list .t-place { color: var(--ink); font-weight: 600; }
.bt-rule { height: 4px; border-radius: 100px; background: var(--red); margin: 20px 0 18px; }
.bt-tiles { display: grid; grid-template-columns: repeat(5, minmax(0, 1fr)); gap: 10px; }
.bt-tile { min-width: 0; padding: 12px 14px; border-radius: 10px; border: 1.5px solid var(--edge); background: var(--cream); }
.bt-tile-top { display: flex; align-items: baseline; gap: 7px; white-space: nowrap; flex-wrap: wrap; }
.bt-tile-num { font: 800 24px / 1.1 PolymathDisp, serif; font-variant-numeric: tabular-nums; color: var(--ink); }
.bt-tile-chg { font: 600 12.5px / 1 PolymathText, sans-serif; color: var(--ink2); }
.bt-tile-label { font: 600 12.5px / 1.35 PolymathText, sans-serif; color: var(--ink); margin-top: 4px; }
.bt-tile-sub { font: 400 12px / 1.35 PolymathText, sans-serif; color: var(--mute); margin-top: 2px; }
.c-good { color: var(--green) !important; }
.c-bad { color: var(--red) !important; }
.c-dem { color: var(--blue) !important; }
.c-rep { color: var(--red) !important; }
.c-mute { color: var(--mute2) !important; }

/* Chart */
.bt-chart-card { padding: 20px 24px 16px; }
.bt-chart-head { display: flex; flex-wrap: wrap; align-items: flex-start; justify-content: space-between; gap: 12px 20px; margin-bottom: 14px; }
.bt-chart-titles { display: flex; flex-direction: column; gap: 6px; min-width: 0; }
.bt-chart-title { font: 700 16px / 1.3 PolymathText, sans-serif; }
.bt-chart-title small { font-weight: 500; color: var(--mute); font-size: 13px; }
.bt-legend { display: flex; flex-wrap: wrap; gap: 6px 16px; font: 500 12.5px / 1 PolymathText, sans-serif; color: var(--ink2); }
.bt-legend span { display: inline-flex; align-items: center; gap: 6px; white-space: nowrap; }
.bt-legend i { width: 20px; display: inline-block; }
.bt-seg { display: flex; padding: 3px; border-radius: 100px; border: 1px solid var(--blue); background: #fff; flex-shrink: 0; }
.bt-seg button { height: 30px; padding: 0 14px; border: none; border-radius: 100px; background: transparent; color: var(--blue); font: 600 13px / 1 PolymathText, sans-serif; cursor: pointer; white-space: nowrap; }
.bt-seg button[aria-selected="true"] { background: var(--blue); color: #fff; }
.bt-chart { position: relative; height: 220px; }
.bt-key { display: inline-flex; align-items: center; gap: 6px; height: 26px; padding: 0 10px 0 8px; margin: 0 0 0 -8px; border: 1px solid transparent; border-radius: 100px; background: none; font: 500 12.5px / 1 PolymathText, sans-serif; color: var(--ink2); cursor: pointer; white-space: nowrap; }
.bt-key + .bt-key { margin-left: -4px; }
.bt-key:hover { background: #F4F1EA; }
.bt-key[aria-pressed="true"] { border-color: #CCC6B5; background: #fff; color: var(--ink); font-weight: 600; }
.bt-key.off { opacity: 0.45; }
.bt-key:focus-visible { outline: 2px solid var(--blue); outline-offset: 1px; }
.bt-key-note { display: inline-flex; align-items: center; gap: 6px; color: var(--mute); white-space: nowrap; }
.bt-chart .hit { cursor: pointer; pointer-events: stroke; }
.bt-chart .xhair { position: absolute; top: 0; bottom: 26px; width: 0; border-left: 1px solid rgba(27, 23, 20, 0.28); pointer-events: none; }
.bt-chart .tip { position: absolute; top: 18px; z-index: 5; min-width: 190px; padding: 10px 12px; border-radius: 10px; background: #fff; border: 1px solid var(--edge); box-shadow: rgba(12, 12, 13, 0.1) 0 4px 14px; transform: translateX(12px); pointer-events: none; font: 400 12.5px / 1.35 PolymathText, sans-serif; color: var(--ink2); }
.bt-chart .tip.left { transform: translateX(calc(-100% - 12px)); }
.bt-chart .tip-head { font-weight: 600; color: var(--ink); margin-bottom: 6px; white-space: nowrap; }
.bt-chart .tip-row { display: flex; align-items: center; gap: 8px; white-space: nowrap; padding: 1px 0; }
.bt-chart .tip-row i { width: 8px; height: 8px; border-radius: 50%; flex: none; }
.bt-chart .tip-row span { flex: 1; }
.bt-chart .tip-row b { font-weight: 600; color: var(--ink); font-variant-numeric: tabular-nums; }
.bt-chart .tip-mute { font-weight: 400; color: var(--mute); }
.bt-chart .tip-foot { margin-top: 6px; font-size: 11.5px; color: var(--mute2); white-space: nowrap; }
.bt-chart svg { position: absolute; inset: 0; width: 100%; height: 100%; overflow: visible; }
.bt-chart .ax { position: absolute; font: 500 11px / 1 PolymathText, sans-serif; color: var(--mute2); white-space: nowrap; }
.bt-chart { margin-bottom: 16px; }
.bt-chart .ax-ev { bottom: -15px; transform: translateX(-50%); text-align: center; line-height: 1.35; color: #6E6A63; font-weight: 600; }
.bt-chart .ax-ev span { display: block; font-weight: 500; }
.bt-defs { display: flex; flex-wrap: wrap; gap: 4px 16px; margin-bottom: 6px; color: #484542; }
.bt-defs b { color: #1B1714; font-weight: 600; }
.bt-chart .mk { position: absolute; top: 2px; font: 600 11px / 1.3 PolymathText, sans-serif; color: #6E6A63; max-width: 130px; }
.bt-chart .today { position: absolute; top: 2px; font: 600 11px / 1 PolymathText, sans-serif; color: var(--blue); transform: translateX(-100%) translateX(-6px); white-space: nowrap; }
.bt-chart .pt { position: absolute; width: 10px; height: 10px; margin: -5px 0 0 -5px; border-radius: 50%; box-shadow: 0 0 0 2px #fff; }
.bt-chart .lbl { position: absolute; font: 700 12px / 1 PolymathText, sans-serif; color: var(--ink); white-space: nowrap; transform: translate(10px, -50%); pointer-events: none; }
.bt-chart .lbl.flip { transform: translate(calc(-100% - 10px), -50%); }
.bt-chart .future { position: absolute; top: 0; right: 0; bottom: 26px; background: #FBF8F1; border-radius: 0 8px 8px 0; }
.bt-chart-empty { position: absolute; inset: 0 0 26px; display: grid; place-items: center; font: 500 14px / 1.4 PolymathText, sans-serif; color: var(--mute); text-align: center; padding: 0 20px; }

/* Map */
.bt-display button { display: inline-flex; align-items: center; gap: 5px; }
.bt-display .material-icons-round { font-size: 17px; }
.bt-map-pane { padding: 4px 0 12px; }
.bt-map-bar { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 10px 16px; margin-bottom: 12px; }
.bt-seg-wrap { flex-wrap: wrap; }
.bt-map { position: relative; }
.bt-map svg { display: block; width: 100%; height: auto; }
.bt-map .regions path { stroke: #fff; stroke-width: 0.6; vector-effect: non-scaling-stroke; cursor: pointer; }
.bt-map path.hl { fill: none; stroke: var(--ink); stroke-width: 1.8; vector-effect: non-scaling-stroke; pointer-events: none; }
.bt-map .geo-district .regions path { stroke: none; }
.bt-map .counties-outline path { fill: none; stroke: rgba(255, 255, 255, 0.75); stroke-width: 0.6; vector-effect: non-scaling-stroke; pointer-events: none; }
.bt-map .district-lines path { fill: none; stroke: rgba(27, 23, 20, 0.72); stroke-width: 1.1; stroke-linejoin: round; vector-effect: non-scaling-stroke; pointer-events: none; }
.bt-map .district-labels text { font: 800 15px PolymathDisp, sans-serif; fill: var(--ink); text-anchor: middle; dominant-baseline: central; paint-order: stroke; stroke: rgba(255, 255, 255, 0.9); stroke-width: 3.5px; stroke-linejoin: round; pointer-events: none; }
.bt-map-swipe { display: none; }
.bt-map-detail { display: none; margin-top: 12px; padding: 12px 14px; border-radius: 12px; background: var(--cream); border: 1px solid var(--edge); font: 400 13.5px / 1.45 PolymathText, sans-serif; color: var(--ink2); }
.bt-map-detail .h { font-weight: 700; color: var(--ink); margin-bottom: 6px; }
.bt-map-detail .hint { font-weight: 400; color: var(--mute); }
.bt-map-detail .r, .bt-row-detail .r { display: flex; justify-content: space-between; gap: 14px; }
.bt-map-detail b, .bt-row-detail b { font-weight: 600; color: var(--ink); font-variant-numeric: tabular-nums; }
.bt-map-detail em, .bt-row-detail em { font-style: normal; font-weight: 400; color: var(--mute); }
@media (hover: none) { .bt-map-detail { display: block; } .bt-map-tip { display: none !important; } }
.bt-map-empty { position: absolute; inset: 0; display: grid; place-items: center; font: 500 14px / 1.4 PolymathText, sans-serif; color: var(--mute); background: rgba(255, 255, 255, 0.6); min-height: 120px; }
.bt-map-legend { display: flex; flex-wrap: wrap; align-items: center; gap: 4px 10px; font: 500 12px / 1.2 PolymathText, sans-serif; color: var(--ink2); }
.bt-map-ramp { display: inline-block; width: 180px; height: 10px; border-radius: 3px; }
.bt-map-end { white-space: nowrap; }
.bt-map-scale { display: inline-flex; flex-direction: column; gap: 3px; padding-top: 14px; }
.bt-map-ticks { display: flex; justify-content: space-between; gap: 6px; font: 500 11px / 1 PolymathText, sans-serif; color: var(--mute); font-variant-numeric: tabular-nums; white-space: nowrap; }
.bt-map-nodata { display: inline-flex; align-items: center; gap: 6px; color: var(--mute); white-space: nowrap; }
.bt-map-nodata i { width: 12px; height: 10px; border-radius: 2px; background: #E4E0D8; }
.bt-map-tip { position: absolute; z-index: 5; min-width: 200px; padding: 10px 12px; border-radius: 10px; background: #fff; border: 1px solid var(--edge); box-shadow: rgba(12, 12, 13, 0.1) 0 4px 14px; transform: translate(14px, -50%); pointer-events: none; font: 400 12.5px / 1.4 PolymathText, sans-serif; color: var(--ink2); }
.bt-map-tip.left { transform: translate(calc(-100% - 14px), -50%); }
.bt-map-tip .h { font-weight: 700; color: var(--ink); margin-bottom: 4px; }
/* The metric the map is colored by leads the tooltip and the tap card. */
.bt-map-tip .lead, .bt-map-detail .lead { display: flex; flex-direction: column; gap: 2px; padding-bottom: 8px; margin-bottom: 6px; border-bottom: 1px solid var(--edge); }
.bt-map-tip .lead > span, .bt-map-detail .lead > span { font: 700 11px / 1.2 PolymathText, sans-serif; letter-spacing: .06em; text-transform: uppercase; color: var(--mute); }
.bt-map-tip .lead b, .bt-map-detail .lead b { font: 800 26px / 1.1 PolymathDisp, serif; color: var(--ink); font-variant-numeric: tabular-nums; }
.bt-map-tip .lead em, .bt-map-detail .lead em { font-style: normal; color: var(--mute); }
.bt-map-tip .r { display: flex; justify-content: space-between; gap: 14px; white-space: nowrap; }
.bt-map-tip b { font-weight: 600; color: var(--ink); font-variant-numeric: tabular-nums; }
.bt-map-tip em { font-style: normal; font-weight: 400; color: var(--mute); }
.bt-map-note { margin-top: 8px; font: 400 12px / 1.4 PolymathText, sans-serif; color: var(--mute2); }
@media (max-width: 640px) {
  .bt-display { order: 4; }
  /* Map: twice the screen width, swipe to pan */
  .bt-map { overflow-x: auto; overscroll-behavior-x: contain; scrollbar-width: none; margin: 0 -12px; padding: 0 12px; }
  .bt-map svg { width: 210%; max-width: none; }
  .bt-map-swipe { display: block; margin-top: 6px; font: 500 12px / 1.3 PolymathText, sans-serif; color: var(--mute); }
  .bt-map-detail { display: block; }
  .bt-map-note { display: none; }
  /* Table: a four-column list; tap a row for the rest */
  .bt-table-card .bt-table { min-width: 0; }
  .bt-table-card .bt-table .c-m, .bt-table-card .bt-table .c-ip, .bt-table-card .bt-table .c-mail, .bt-table-card .bt-table .c-cure { display: none; }
  .bt-table-card .bt-table th, .bt-table-card .bt-table td { padding: 9px 5px; font-size: 13.5px; }
  .bt-table-card .bt-table th { white-space: normal; vertical-align: bottom; }
  .bt-table-card .bt-table th .hint { display: none; }
  .bt-table-card .bt-table td.c-name { white-space: normal; }
  .bt-table-card .bt-table td.c-share .sub { display: block; font-size: 12px; line-height: 1.2; }
  .bt-table-card .bt-table th .srt { display: none; }
  .bt-table-card .bt-table th.sorted .srt { display: inline; }
  .bt-table-card .bt-table tr[data-k] { cursor: pointer; }
  .bt-table-card .bt-table tr.expanded td { background: #FBF8F1; border-bottom-color: transparent; }
  .bt-row-detail td { background: #FBF8F1 !important; padding: 2px 10px 12px !important; position: static !important; font-size: 13px !important; text-align: left !important; }
  .bt-map-ramp { width: 110px; }
  .bt-seg-wrap { max-width: 100%; }
  .bt-seg-wrap button { padding: 0 9px; font-size: 12.5px; }
}

/* Table card */
.bt-table-card { padding: 0 16px 6px; position: relative; }
.bt-breakdown-head { padding: 30px 8px 4px; }
.bt-toolbar { display: flex; align-items: center; gap: 12px; flex-wrap: wrap; padding: 16px 0 12px; }
.bt-filter-btn { height: 40px; padding: 0 14px 0 10px; border: none; border-radius: 16px; background: #F5F5F5; box-shadow: rgba(0, 0, 0, 0.3) 0 1px 3px, rgba(0, 0, 0, 0.12) 0 1px 4px 1px; display: inline-flex; align-items: center; gap: 10px; cursor: pointer; font: 600 14px / 20px PolymathText, sans-serif; letter-spacing: 0.1px; color: #001C37; white-space: nowrap; }
.bt-filter-count { min-width: 20px; height: 20px; padding: 0 6px; border-radius: 100px; background: var(--blue); color: #fff; font: 700 11.5px / 20px PolymathText, sans-serif; text-align: center; }
.bt-viewby { position: relative; display: flex; }
/* Two tiers. Row 1 is who counts: Filters plus the active filters as chips.
   Row 2, under a hairline, is how it's shown: View By, then Map/Table and CSV. */
.bt-toolbar.bt-scope { padding-bottom: 14px; }
.bt-toolbar.bt-viewrow { border-top: 1px solid var(--line); border-bottom: 1px solid var(--line); padding: 14px 0 16px; margin-bottom: 18px; }
.bt-active-filters { display: flex; align-items: center; gap: 8px; flex-wrap: wrap; min-width: 0; }
.bt-af-chip { display: inline-flex; align-items: center; gap: 4px; height: 30px; padding: 0 7px 0 12px; border: 0; border-radius: 100px; background: rgba(1, 96, 166, 0.1); color: var(--blue); font: 600 13px / 1 PolymathText, sans-serif; cursor: pointer; white-space: nowrap; }
.bt-af-chip .material-icons-round { font-size: 16px; opacity: .8; }
.bt-af-chip:hover { background: rgba(1, 96, 166, 0.16); }
.bt-af-clear { border: 0; background: none; padding: 4px 2px; font: 600 13px / 1 PolymathText, sans-serif; color: var(--blue); cursor: pointer; }
.bt-af-clear:hover { text-decoration: underline; text-underline-offset: 3px; }
.bt-af-none { font: 500 14px / 1 PolymathText, sans-serif; color: var(--mute); }
.bt-viewrow .bt-row-spacer { flex: 1 1 0; }
.bt-viewrow .bt-display { margin-left: 0; }
.bt-viewrow .bt-search input { width: 170px; }
.bt-viewgroup { display: flex; align-items: center; gap: 8px; flex-wrap: wrap; }
.bt-viewgroup-label { font: 600 13px / 1 PolymathText, sans-serif; color: var(--mute); white-space: nowrap; }
.bt-viewhint { font: 500 12.5px / 1.3 PolymathText, sans-serif; color: var(--mute2); white-space: nowrap; }
.bt-seg.bt-viewmode { border-color: #C9BFA6; }
.bt-viewmode button { color: var(--ink2); font-weight: 500; }
.bt-viewmode button[aria-selected="true"] { background: rgba(1, 96, 166, 0.1); color: var(--blue); font-weight: 600; }
.bt-viewflat { max-width: 100%; overflow-x: auto; scrollbar-width: none; }
.bt-viewflat::-webkit-scrollbar { display: none; }
.bt-viewby-label { position: absolute; top: -7px; left: 10px; z-index: 1; padding: 0 4px; background: #fff; font: 600 11px / 1 PolymathText, sans-serif; color: #1E1D17; pointer-events: none; }
.bt-viewby select { appearance: none; -webkit-appearance: none; height: 40px; min-width: 200px; padding: 0 36px 0 14px; border-radius: 12px; border: 1px solid #7B7768; background: #fff; font: 400 14px / 1 PolymathText, sans-serif; color: var(--ink); cursor: pointer; }
.bt-viewby-caret { position: absolute; right: 8px; top: 8px; font-size: 24px; color: rgba(0, 0, 0, 0.54); pointer-events: none; }
.bt-toolbar .bt-display { margin-left: auto; }
.bt-table-head { display: flex; align-items: center; gap: 12px; flex-wrap: wrap; padding: 0 0 14px; }
.bt-table-title { font: 700 20px / 1.3 PolymathText, sans-serif; color: var(--ink); min-width: 0; flex: 1 1 auto; }
.bt-search { display: inline-flex; align-items: center; gap: 6px; height: 40px; padding: 0 14px; border: 1px solid #7B7768; border-radius: 12px; background: #fff; }
.bt-search[hidden] { display: none; }
.bt-search .material-icons-round { font-size: 20px; color: var(--mute); }
.bt-search input { border: 0; outline: 0; background: none; font: 400 14px / 1 PolymathText, sans-serif; color: var(--ink); width: 200px; }
.bt-search:focus-within { border-color: var(--blue); box-shadow: 0 0 0 1px var(--blue); }
.bt-text-btn { height: 36px; padding: 0 12px; border: none; border-radius: 100px; background: transparent; color: var(--blue); font: 600 14px / 1 PolymathText, sans-serif; cursor: pointer; display: inline-flex; align-items: center; gap: 6px; }
.bt-text-btn:hover { background: rgba(1, 96, 166, 0.08); }

/* Filters popover (bottom sheet on phones) */
.bt-filters { position: absolute; top: var(--bt-filters-top, 64px); left: 16px; width: 400px; max-width: calc(100% - 32px); z-index: 20; background: #fff; border-radius: 16px; box-shadow: rgba(0, 0, 0, 0.15) 0 4px 8px 3px, rgba(0, 0, 0, 0.3) 0 1px 3px 0; overflow: hidden; display: flex; flex-direction: column; }
.bt-filters-head { padding: 14px 12px 4px 20px; display: flex; align-items: center; gap: 12px; }
.bt-filters-title { font: 600 14px / 20px PolymathText, sans-serif; color: #001C37; flex: 1; }
.bt-icon-btn { width: 36px; height: 36px; border: none; border-radius: 100px; background: transparent; display: grid; place-items: center; cursor: pointer; color: rgba(0, 0, 0, 0.54); }
.bt-filters-body { padding: 10px 20px 0; overflow-y: auto; }
.bt-filters-label { font: 600 11px / 1 PolymathText, sans-serif; letter-spacing: 0.5px; color: var(--mute2); margin-bottom: 8px; }
.bt-fg-head { min-height: 40px; padding: 0 8px; margin: 0 -8px; display: flex; align-items: center; gap: 12px; cursor: pointer; user-select: none; border-radius: 8px; border: none; background: none; width: calc(100% + 16px); text-align: left; color: inherit; }
.bt-fg-head:hover { background: #F5F5F5; }
.bt-fg-icon { font-size: 20px; color: var(--blue); }
.bt-fg-name { flex: 1; font: 500 14px / 1.3 PolymathText, sans-serif; }
.bt-fg-sel { font-size: 11.5px; color: var(--ink2); margin-left: 6px; }
.bt-fg-chev { font-size: 22px; color: rgba(0, 0, 0, 0.54); }
.bt-fg-chips { display: flex; flex-wrap: wrap; gap: 6px; padding: 0 0 10px 32px; }
.bt-chip { height: 28px; padding: 0 10px; border-radius: 4px; border: 1px solid var(--line); background: transparent; color: #000; font: 400 11.2px / 1 PolymathText, sans-serif; cursor: pointer; white-space: nowrap; }
.bt-chip[aria-pressed="true"] { background: #E3EEF8; border-color: var(--blue); color: #01497E; font-weight: 600; }
.bt-filters-foot { padding: 8px 20px 16px; }
.bt-filters-rule { height: 1px; background: var(--line); margin-bottom: 12px; }
.bt-filters-actions { display: flex; align-items: center; }
.bt-reset { height: 36px; padding: 0 12px; border: none; border-radius: 100px; background: transparent; color: var(--blue); font: 600 14px / 1 PolymathText, sans-serif; cursor: pointer; display: inline-flex; align-items: center; gap: 6px; }
.bt-done { margin-left: auto; height: 40px; min-width: 88px; padding: 0 20px; border: none; border-radius: 100px; background: var(--blue); color: #fff; font: 600 14px / 1 PolymathText, sans-serif; cursor: pointer; }
.bt-sheet-backdrop { display: none; }

/* Table */
.bt-scroll { overflow-x: auto; max-width: 100%; }
.bt-table { width: 100%; min-width: 600px; border-collapse: separate; border-spacing: 0; }
.bt-table th { background: #fff; text-align: right; padding: 10px; border-bottom: 1px solid var(--line); font: 500 13px / 1.4 PolymathText, sans-serif; color: rgba(0, 0, 0, 0.87); white-space: nowrap; cursor: pointer; user-select: none; }
.bt-table th:first-child { position: sticky; left: 0; z-index: 2; text-align: left; }
.bt-table th .srt { font-size: 16px; vertical-align: -3px; margin-right: 2px; color: rgba(0, 0, 0, 0.54); opacity: 0; }
.bt-table th:first-child .srt { margin: 0 0 0 2px; }
.bt-table th.sorted .srt, .bt-table th:hover .srt { opacity: 1; }
.bt-table th:hover .srt { opacity: 0.5; }
.bt-table th.sorted .srt { opacity: 1; }
.bt-table th .hint { color: var(--mute2); font-weight: 500; }
.bt-table td { padding: 9px 10px; border-bottom: 1px solid var(--line); text-align: right; font: 400 14px / 1.43 PolymathText, sans-serif; font-variant-numeric: tabular-nums; white-space: nowrap; background: #fff; }
.bt-table td:first-child { position: sticky; left: 0; z-index: 1; text-align: left; font-weight: 600; }
.bt-table .sep { border-left: 1px solid var(--line); }
.bt-table tr.total td { background: var(--cream); font-weight: 600; padding: 10px; }
.bt-table tr.total td:first-child, .bt-table tr.total td:nth-child(2) { font-weight: 700; }
.bt-table td .sub { font-weight: 400; }
.bt-table td.warn span.n { display: inline-block; min-width: 28px; padding: 1px 7px; border-radius: 100px; background: #FDECEA; color: #A42A24; font-weight: 600; }
.bt-table td.bt-empty { text-align: center; padding: 42px 10px; color: var(--mute); font-weight: 500; position: static; }
.bt-table tbody tr:not(.total):hover td { background: #FBF8F1; }
.bt-pager { display: flex; align-items: center; justify-content: flex-end; gap: 24px; min-height: 52px; font: 400 14px / 1.43 PolymathText, sans-serif; color: rgba(0, 0, 0, 0.87); flex-wrap: wrap; }
.bt-pager label { display: inline-flex; align-items: center; gap: 6px; }
.bt-pager select { border: none; background: transparent; font: inherit; cursor: pointer; }
.bt-pager button { border: none; background: none; padding: 0; cursor: pointer; color: rgba(0, 0, 0, 0.54); display: grid; place-items: center; }
.bt-pager button:disabled { color: rgba(0, 0, 0, 0.26); cursor: default; }

/* Notes */
.bt-notes { font: 400 14px / 1.55 PolymathText, sans-serif; color: var(--ink2); padding: 4px 4px 0; }
.bt-notes summary { cursor: pointer; font: 600 14px / 1.4 PolymathText, sans-serif; color: var(--blue); width: max-content; }
.bt-notes ul { margin: 12px 0 0; padding-left: 20px; max-width: 90ch; display: grid; gap: 6px; }
.bt-notes a { color: var(--blue); }

/* Loading shimmer */
.bt-skel { display: block; height: 0.9em; margin: 0.35em 0; border-radius: 6px; background: linear-gradient(90deg, #F1ECDF 25%, #F8F4EA 50%, #F1ECDF 75%); background-size: 200% 100%; animation: bt-shimmer 1.3s infinite linear; }
@keyframes bt-shimmer { to { background-position: -200% 0; } }

@media (max-width: 900px) {
  .bt-tiles { grid-template-columns: repeat(3, minmax(0, 1fr)); }
}
@media (max-width: 640px) {
  .bt-summary { padding: 20px 18px; }
  .bt-chart-card { padding: 18px 16px 14px; }
  .bt-tiles { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .bt-tile-num { font-size: 22px; }
  .bt-status [data-hide-sm] { display: none; }
  .bt-viewby select { min-width: 0; width: 100%; }
  .bt-viewby { flex: 1 1 160px; }
  .bt-viewgroup { flex: 1 1 100%; }
  .bt-table-title { flex: 1 1 100%; font-size: 18px; }
  .bt-search { flex: 1 1 100%; }
  .bt-search input, .bt-viewrow .bt-search input { width: 100%; }
  .bt-viewrow .bt-row-spacer { display: none; }
  .bt-text-btn { order: 5; margin-left: auto; }
  .bt-chart .ax-minor { display: none; }
  body.bt-sheet-open #to-top { display: none; }
  .bt-chart { height: 200px; }
  .bt-chart .mk { max-width: 96px; }
  /* Filters become a bottom sheet */
  .bt-filters { position: fixed; top: auto; left: 0; right: 0; bottom: 0; width: auto; max-width: none; max-height: 82vh; border-radius: 20px 20px 0 0; z-index: 70; }
  .bt-sheet-backdrop { display: block; position: fixed; inset: 0; z-index: 69; background: rgba(27, 23, 20, 0.36); }
  .bt-pager { gap: 14px; justify-content: space-between; }
}

/* ---------------------------------------------------------------- county pages (ballot-tracker-county.html) */
/* Back to the statewide page: a small pill; hover tints it and nudges the arrow (no underline). */
.bt-back { display: inline-flex; align-items: center; gap: 6px; height: 34px; padding: 0 14px 0 10px; margin-bottom: 14px; border: 1px solid var(--edge); border-radius: 100px; background: #fff; font: 600 14px / 1 PolymathText, sans-serif; color: var(--blue); text-decoration: none; transition: background-color .15s, border-color .15s; }
.bt-back svg { flex: none; display: block; transition: transform .15s; }
.bt-back:hover, .bt-back:focus-visible { background: rgba(1, 96, 166, 0.08); border-color: rgba(1, 96, 166, 0.35); }
.bt-back:hover svg, .bt-back:focus-visible svg { transform: translateX(-3px); }
.bt-back:focus-visible { outline: 2px solid var(--blue); outline-offset: 2px; }
/* Jump links to the page's sections */
.bt-jumps { display: grid; grid-auto-flow: column; grid-auto-columns: minmax(0, 1fr); margin-top: 28px; border-top: 1.5px solid var(--ink); }
.bt-jump { display: flex; flex-direction: column; gap: 6px; padding: 14px 16px 6px; color: var(--ink); text-decoration: none; }
.bt-jump + .bt-jump { border-left: 1px solid var(--edge); }
.bt-jump:first-child { padding-left: 0; }
.bt-jump-num { font: 600 13px / 1 PolymathText, sans-serif; color: var(--blue); }
.bt-jump-title { font: 700 20px / 1.15 PolymathDisp, serif; letter-spacing: 0.2px; }
.bt-jump-desc { flex: 1; font: 400 14px / 1.4 PolymathText, sans-serif; color: var(--mute); }
.bt-jump-go { display: flex; align-items: center; gap: 4px; margin-top: 8px; font: 600 13.5px / 1 PolymathText, sans-serif; color: var(--blue); }
.bt-jump-go .material-icons-round { font-size: 17px; }
.bt-jump { position: relative; transition: color .15s; }
/* Hover: a blue bar grows over the section's top rule, the title turns blue, the arrow drops. */
.bt-jump::before { content: ""; position: absolute; left: 0; right: 0; top: -1.5px; height: 4px; background: var(--blue); transform: scaleX(0); transform-origin: left; transition: transform .2s ease; }
.bt-jump .bt-jump-go .material-icons-round { transition: transform .2s ease; }
.bt-jump:hover, .bt-jump:focus-visible { color: var(--blue); }
.bt-jump:hover::before, .bt-jump:focus-visible::before { transform: scaleX(1); }
.bt-jump:hover .bt-jump-go .material-icons-round, .bt-jump:focus-visible .bt-jump-go .material-icons-round { transform: translateY(3px); }
.bt-jump:focus-visible { outline: 2px solid var(--blue); outline-offset: 2px; border-radius: 4px; }
.bt-jump-target { scroll-margin-top: 90px; }
@media (max-width: 640px) {
  .bt-jumps { grid-auto-flow: row; grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .bt-jump { padding: 14px 12px 10px; }
  .bt-jump:nth-child(odd) { padding-left: 0; border-left: none; }
  .bt-jump:nth-child(n+3) { border-top: 1px solid var(--edge); }
}
/* Voter-list previews: counts, and what the full list holds (never names or rows) */
.bt-lists-head { margin: 8px 0 18px; }
.bt-lists-head h2.bt-sec-h { margin: 0; }
.bt-lists-sub { margin: 6px 0 0; font: 500 15px / 1.4 PolymathText, sans-serif; color: var(--mute); }
.bt-lists-grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(min(100%, 440px), 1fr)); gap: 20px; }
.bt-list { padding: 26px 28px; display: flex; flex-direction: column; }
.bt-list-kicker { font: 700 12px / 1 PolymathText, sans-serif; letter-spacing: .08em; text-transform: uppercase; color: var(--red); }
.bt-list h3 { font: 600 17px / 1.3 PolymathText, sans-serif; color: var(--ink2); margin: 8px 0 12px; }
.bt-list-num { display: flex; align-items: baseline; gap: 10px; }
.bt-list-num b { font: 800 52px / 1 PolymathDisp, serif; letter-spacing: -.5px; }
.bt-list-num span { font: 600 17px / 1 PolymathText, sans-serif; color: var(--blue); }
.bt-redacted { position: relative; margin: 20px 0 18px; border: 1px solid var(--line); border-radius: 12px; overflow: hidden; }
.bt-redacted table { width: 100%; border-collapse: collapse; }
.bt-redacted th { text-align: left; font: 600 11.5px / 1 PolymathText, sans-serif; letter-spacing: .06em; text-transform: uppercase; color: var(--mute2); background: #FBF8F0; padding: 10px 12px; }
.bt-redacted td { padding: 11px 12px; border-top: 1px solid #F0EBDD; }
.bt-redacted td i { display: block; height: 10px; border-radius: 5px; background: #E9E3D3; }
.bt-lock { position: absolute; inset: 34px 0 0; display: flex; align-items: center; justify-content: center; gap: 8px; text-align: center; padding: 0 16px;
  background: linear-gradient(180deg, rgba(255, 255, 255, .35), rgba(255, 255, 255, .92)); font: 600 14px / 1.35 PolymathText, sans-serif; color: var(--ink2); }
.bt-lock .material-icons-round { font-size: 18px; color: var(--blue); }
.bt-list-foot { margin-top: auto; padding-top: 4px; }
.bt-list-cta { align-self: flex-start; }

/* ---------------------------------------------------------------- statewide page: links to county pages */
html { scroll-behavior: smooth; }
#contact { scroll-margin-top: 90px; }
.bt-find { position: relative; margin-top: 22px; max-width: 420px; }
.bt-find[hidden] { display: none; }
.bt-find-box { display: flex; align-items: center; gap: 8px; height: 48px; padding: 0 6px 0 14px; border: 1.5px solid var(--edge); border-radius: 999px; background: #fff; }
.bt-find-box:focus-within { border-color: var(--blue); box-shadow: 0 0 0 1px var(--blue); }
.bt-find-box > .material-icons-round { font-size: 21px; color: var(--blue); }
.bt-find-box input { flex: 1; min-width: 0; border: 0; outline: 0; background: none; font: 500 16px / 1 PolymathText, sans-serif; color: var(--ink); }
.bt-find-box button { width: 36px; height: 36px; border: 0; border-radius: 50%; background: var(--blue); color: #fff; display: grid; place-items: center; cursor: pointer; }
.bt-find-box button .material-icons-round { font-size: 20px; }
.bt-county-link { color: var(--ink); text-decoration: none; display: inline-flex; align-items: center; gap: 2px; }
.bt-county-link .material-icons-round { font-size: 18px; color: var(--mute2); transition: transform .12s; }
.bt-county-link:hover { color: var(--blue); text-decoration: underline; text-underline-offset: 3px; }
.bt-county-link:hover .material-icons-round { color: var(--blue); transform: translateX(2px); }
.bt-go { display: inline-flex; align-items: center; gap: 4px; margin-top: 10px; font: 600 14px / 1 PolymathText, sans-serif; color: var(--blue); text-decoration: none; }
.bt-go .material-icons-round { font-size: 17px; }
.bt-go:hover { text-decoration: underline; text-underline-offset: 3px; }
.bt-map-tip .go { margin-top: 6px; padding-top: 6px; border-top: 1px solid var(--edge); font-weight: 600; color: var(--blue); }
.bt-find-list { position: absolute; z-index: 30; top: calc(100% + 6px); left: 0; right: 0; max-height: 360px; overflow-y: auto; padding: 6px;
  background: #fff; border: 1px solid var(--edge); border-radius: 18px; box-shadow: rgba(12, 12, 13, 0.06) 0 4px 6px, rgba(12, 12, 13, 0.12) 0 16px 32px; }
.bt-find-list[hidden] { display: none; }
.bt-find-head { padding: 10px 12px 6px; font: 700 11.5px / 1 PolymathText, sans-serif; letter-spacing: .08em; text-transform: uppercase; color: var(--mute2); }
.bt-find-opt { display: flex; align-items: baseline; justify-content: space-between; gap: 12px; padding: 11px 12px; border-radius: 12px; cursor: pointer; }
.bt-find-opt[aria-selected="true"], .bt-find-opt:hover { background: #F6F1E4; }
.bt-find-opt .n { display: flex; align-items: center; gap: 8px; min-width: 0; font: 600 15.5px / 1.2 PolymathText, sans-serif; color: var(--ink); }
.bt-find-opt .t { flex: none; padding: 3px 7px; border-radius: 6px; background: #E8F0F7; color: var(--blue); font: 700 11.5px / 1 PolymathText, sans-serif; letter-spacing: .04em; }
@media (max-width: 520px) { .bt-find-opt { flex-direction: column; align-items: flex-start; gap: 5px; } }
.bt-find-opt .m { font: 500 13px / 1.2 PolymathText, sans-serif; color: var(--mute); white-space: nowrap; font-variant-numeric: tabular-nums; }
.bt-find-none { padding: 14px 12px; font: 500 14px / 1.4 PolymathText, sans-serif; color: var(--mute); }

/* One heading style for each section's title (Summary, Trend, Breakdown). */
.bt-eyebrow.bt-sec-h, .bt-chart-title.bt-sec-h { font: 700 20px / 1.3 PolymathText, sans-serif; letter-spacing: 0; text-transform: none; color: var(--ink); }
.bt-eyebrow.bt-sec-h .material-icons-round { font-size: 22px !important; color: var(--blue); }
@media (max-width: 640px) { .bt-eyebrow.bt-sec-h, .bt-chart-title.bt-sec-h { font-size: 18px; } }

/* ---------------------------------------------------------------- turnout rates */
/* Key metrics: three cards (Turnout, Party share, Need a cure), each a total over a party table. */
.km-grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(260px, 1fr)); gap: 12px; }
.kc { background: var(--cream); border: 1px solid rgba(204, 198, 181, 0.6); border-radius: 12px; padding: 18px 20px; display: grid; grid-template-rows: subgrid; grid-row: span 3; row-gap: 14px; align-content: start; min-width: 0; }
.kc-t { font: 700 12px / 1.2 PolymathText, sans-serif; letter-spacing: .08em; text-transform: uppercase; color: var(--ink2); }
.kc-tot { display: flex; flex-direction: column; gap: 8px; }
.kc-l1, .kc-l2 { display: flex; flex-wrap: wrap; gap: 4px 10px; align-items: baseline; }
.kc-num { font: 800 40px / .9 PolymathDisp, serif; letter-spacing: -.01em; font-variant-numeric: tabular-nums; color: var(--ink); }
.kc-lbl { font: 600 14px / 1.2 PolymathText, sans-serif; color: var(--ink2); }
.kc-rate { display: flex; gap: 6px; align-items: baseline; }
.kc-rate b { font: 800 18px / 1 PolymathDisp, serif; color: var(--ink); }
.kc-det { font: 500 13px / 1.2 PolymathText, sans-serif; color: var(--ink2); }
.kc-chg { font: 600 14px / 1 PolymathText, sans-serif; white-space: nowrap; cursor: default; }
.kc-tbl { display: grid; grid-template-columns: minmax(40px, .7fr) minmax(0, 1fr) minmax(0, 1fr); column-gap: 12px; align-items: baseline; align-content: start; background: #fff; border-radius: 8px; padding: 12px 14px 6px; margin: 0 -6px -6px; }
.kc-th { font: 700 11px / 1 PolymathText, sans-serif; letter-spacing: .08em; text-transform: uppercase; color: var(--mute); padding: 0 0 8px; }
.kc-th.l { grid-column: 1 / 3; }
.kc-th.r { text-align: right; }
.kc-rule { grid-column: 1 / -1; height: 1px; background: rgba(204, 198, 181, 0.8); margin-bottom: 4px; }
.kc-p { font: 700 13px / 1 PolymathText, sans-serif; letter-spacing: .06em; padding: 8px 0; }
.kc-v { font: 800 22px / 1 PolymathDisp, serif; padding: 6px 0; text-align: right; font-variant-numeric: tabular-nums; }
.kc-c { font: 600 14px / 1 PolymathText, sans-serif; white-space: nowrap; padding: 8px 0; text-align: right; }
.kc-c.muted { font-weight: 500; color: var(--mute); }
.k-up { color: var(--green); } .k-dn { color: var(--red); } .k-dem { color: var(--blue); } .k-rep { color: var(--red); } .k-una { color: #7A4CC2; }
@media (max-width: 640px) { .kc { padding: 16px; } .kc-num { font-size: 34px; } }

/* Chart: what to show, and 2026 or the change vs 2022 */
.bt-chart-ctrls { display: flex; flex-wrap: wrap; gap: 8px; justify-content: flex-end; }
.bt-seg button:disabled { color: var(--mute2); cursor: default; }
.bt-chart-note { margin: 10px 0 0; }

/* Map: switches above, legend under the map */
.bt-map-legend { margin-top: 12px; }
.bt-map-nodata.hatch i { background: repeating-linear-gradient(45deg, #EFEBE2 0 2px, #D9D2C2 2px 4px); }

/* How we count: a hero link and a panel of plain-language answers */
.bt-how-link { font: 600 13px / 1 PolymathText, sans-serif; color: var(--blue); text-decoration: underline; text-underline-offset: 3px; }
.bt-how { padding: 24px 30px 22px; }
.bt-how h2.bt-sec-h { margin: 0; }
.bt-how-body { display: flex; flex-direction: column; margin-top: 12px; }
.bt-how .qa { padding: 14px 0; border-top: 1px solid rgba(204, 198, 181, 0.6); }
.bt-how .qa:first-child { border-top: 0; padding-top: 4px; }
.bt-how .qa h3 { margin: 0 0 6px; font: 700 15px / 1.3 PolymathText, sans-serif; color: var(--ink); }
.bt-how .qa p { margin: 0; font: 400 14.5px / 1.5 PolymathText, sans-serif; color: var(--ink2); }
.bt-how-src { margin: 14px 0 0; font: 400 12.5px / 1.4 PolymathText, sans-serif; color: var(--mute); }
@media (max-width: 640px) {
  .bt-how { padding: 18px 16px; }
  .bt-chart-ctrls { justify-content: flex-start; }
  /* Phones: name, ballots, turnout rate and its change; tap a row for the rest */
  .bt-table-card .bt-table.has-rate .c-share { display: none; }
}

/* ---------------------------------------------------------------- statewide page: tonight's county numbers */
/* One line under the status, in the evening only: links to /ballot-tracker/today. */
.bt-tonight { margin-top: 18px; display: inline-flex; align-items: center; gap: 8px 14px; flex-wrap: wrap; padding: 10px 14px 10px 12px; border-radius: 14px; background: #fff; border: 1px solid var(--edge); border-left: 4px solid var(--blue); text-decoration: none; color: var(--ink2); font: 500 15px / 1.3 PolymathText, sans-serif; max-width: 100%; box-sizing: border-box; }
.bt-tonight[hidden] { display: none; }
.bt-tonight b { font-weight: 700; color: var(--ink); }
.bt-tonight-tag { display: inline-flex; align-items: center; gap: 7px; font: 700 12.5px / 1 PolymathText, sans-serif; letter-spacing: .06em; text-transform: uppercase; color: var(--blue); white-space: nowrap; }
.bt-tonight-tag i { width: 8px; height: 8px; border-radius: 50%; background: var(--blue); box-shadow: 0 0 0 3px rgba(1, 96, 166, 0.2); }
.bt-tonight-go { display: inline-flex; align-items: center; gap: 4px; font: 600 15px / 1 PolymathText, sans-serif; color: var(--blue); white-space: nowrap; }
.bt-tonight-go .material-icons-round { font-size: 18px; }
.bt-tonight:hover { border-color: rgba(1, 96, 166, 0.35); }

/* Chart header: lines-by picker in the legend row, Compare to 2022 switch. */
.bt-legend-row { display: flex; flex-wrap: wrap; align-items: center; gap: 8px 14px; }
.bt-by { display: inline-flex; align-items: center; gap: 6px; font: 600 12.5px / 1 PolymathText, sans-serif; color: var(--mute2, #6E6A63); }
.bt-by select { appearance: none; -webkit-appearance: none; height: 28px; padding: 0 28px 0 12px; border: 1px solid #CCC6B5; border-radius: 100px;
  background: #fff url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath fill='%230160A6' d='M7.4 8.6 12 13.2l4.6-4.6L18 10l-6 6-6-6z'/%3E%3C/svg%3E") no-repeat right 6px center / 18px;
  font: 600 12.5px / 1 PolymathText, sans-serif; color: #1B1714; cursor: pointer; }
.bt-by select:focus-visible { outline: 2px solid var(--blue, #0160A6); outline-offset: 2px; }
.bt-by.off { opacity: .45; }
.bt-by.off select { cursor: default; }
.bt-switch { display: inline-flex; align-items: center; gap: 8px; height: 36px; padding: 0 4px; border: 0; background: none;
  font: 600 13.5px / 1 PolymathText, sans-serif; color: #1B1714; cursor: pointer; white-space: nowrap; }
.bt-switch-track { position: relative; width: 36px; height: 20px; border-radius: 100px; background: #CCC6B5; transition: background .15s; flex: none; }
.bt-switch-knob { position: absolute; top: 2px; left: 2px; width: 16px; height: 16px; border-radius: 50%; background: #fff; box-shadow: 0 1px 2px rgba(0,0,0,.25); transition: transform .15s; }
.bt-switch[aria-checked="true"] .bt-switch-track { background: var(--blue, #0160A6); }
.bt-switch[aria-checked="true"] .bt-switch-knob { transform: translateX(16px); }
.bt-switch:focus-visible { outline: 2px solid var(--blue, #0160A6); outline-offset: 2px; border-radius: 6px; }
@media (prefers-reduced-motion: reduce) { .bt-switch-track, .bt-switch-knob { transition: none; } }
.bt-chart-ctrls { align-items: center; }

/* Who's voting card */
.bt-who-sub { margin: 4px 0 0; font: 400 13.5px / 1.4 PolymathText, sans-serif; color: #6E6A63; }
.bt-who-grid { display: grid; grid-template-columns: minmax(0, 5fr) minmax(0, 7fr); gap: 24px; }
@media (max-width: 900px) { .bt-who-grid { grid-template-columns: minmax(0, 1fr); } }
.bt-who-h { display: flex; flex-wrap: wrap; align-items: baseline; justify-content: space-between; gap: 4px 12px; margin-bottom: 10px;
  font: 700 12px / 1 PolymathText, sans-serif; letter-spacing: .06em; text-transform: uppercase; color: #484542; }
.bt-who-key { display: inline-flex; align-items: center; gap: 6px; font: 500 12px / 1 PolymathText, sans-serif; letter-spacing: 0; text-transform: none; color: #6E6A63; }
.bt-who-key i { display: inline-block; }
.bt-who-key .k22 { width: 10px; height: 10px; border-radius: 50%; border: 2px solid #93908E; background: #fff; }
.bt-who-key .k26 { width: 10px; height: 10px; border-radius: 50%; background: #1B1714; margin-left: 6px; }
.bt-who-key .l26 { width: 18px; border-top: 3px solid #1B1714; }
.bt-who-key .l22 { width: 18px; border-top: 2px dashed #93908E; margin-left: 6px; }
.bt-bell { display: grid; grid-template-columns: 112px minmax(0, 1fr); grid-template-rows: auto auto; column-gap: 12px; row-gap: 2px; padding: 9px 0; border-bottom: 1px solid #F1EEE9; }
.bt-bell-name { grid-row: span 2; align-self: center; font: 500 13.5px / 1.25 PolymathText, sans-serif; color: #1B1714; }
.bt-bell-track { position: relative; height: 14px; margin: 0 6px; background: linear-gradient(#EFECE5, #EFECE5) center / 100% 2px no-repeat; }
.bt-bell-bar { position: absolute; top: 4px; height: 6px; border-radius: 3px; }
.bt-bell-dot { position: absolute; top: 1px; width: 12px; height: 12px; margin-left: -6px; border-radius: 50%; }
.bt-bell-dot.k22 { border: 2px solid #93908E; background: #fff; box-sizing: border-box; }
.bt-bell-val { font: 500 12.5px / 1.3 PolymathText, sans-serif; color: #6E6A63; font-variant-numeric: tabular-nums; }
.bt-bell-val b { font-size: 14px; }
.bt-bell-axis { display: flex; justify-content: space-between; margin: 4px 6px 0 130px; font: 500 11px / 1 PolymathText, sans-serif; color: #93908E; }
.bt-who-chg { font: 700 12px / 1 PolymathText, sans-serif; }
.bt-who-chg.up { color: #1F7A3A; } .bt-who-chg.down { color: #C52E28; }
.bt-who-small { display: grid; gap: 12px; }
@media (max-width: 640px) { .bt-who-small { grid-template-columns: repeat(2, minmax(0, 1fr)) !important; } }
.bt-sm { margin: 0; min-width: 0; }
.bt-sm figcaption { display: flex; align-items: baseline; justify-content: space-between; gap: 6px; font: 500 13px / 1.2 PolymathText, sans-serif; color: #1B1714; margin-bottom: 6px; }
.bt-sm svg { display: block; width: 100%; height: 96px; background: #FBFAF7; border-radius: 6px; }
.bt-sm-ax { position: relative; display: flex; justify-content: space-between; margin-top: 4px; font: 500 10.5px / 1 PolymathText, sans-serif; color: #93908E; }
.bt-sm-val { margin-top: 4px; font: 500 12px / 1.3 PolymathText, sans-serif; color: #6E6A63; font-variant-numeric: tabular-nums; }
.bt-who-map { display: flex; flex-wrap: wrap; align-items: center; gap: 8px; margin-top: 12px; padding-top: 12px; border-top: 1px solid #F1EEE9;
  font: 600 13px / 1 PolymathText, sans-serif; color: #484542; }
.bt-who-mapbtn { display: inline-flex; align-items: center; gap: 4px; height: 30px; padding: 0 10px 0 12px; border: 1px solid #CCC6B5; border-radius: 100px;
  background: #fff; font: 600 12.5px / 1 PolymathText, sans-serif; color: #0160A6; cursor: pointer; }
.bt-who-mapbtn .material-icons-round { font-size: 16px; }
.bt-who-mapbtn:hover { border-color: #0160A6; }
.bt-who-mapbtn:focus-visible { outline: 2px solid #0160A6; outline-offset: 2px; }
.bt-sm-ax .ev { position: absolute; top: 0; transform: translateX(-50%); }

/* Trend column + pop-up */
/* The trend sits under Key Metrics, closed until asked for. */
.bt-km-scope { font-weight: 500; letter-spacing: 0; text-transform: none; color: var(--mute, #93908E); }
.bt-trend-toggle { display: inline-flex; align-items: center; gap: 8px; margin-top: 18px; height: 38px; padding: 0 12px 0 14px; border: 1px solid #CCC6B5; border-radius: 100px;
  background: #fff; color: var(--blue, #0160A6); font: 600 14px / 1 PolymathText, sans-serif; cursor: pointer; }
.bt-trend-toggle:hover { border-color: var(--blue, #0160A6); }
.bt-trend-toggle:focus-visible { outline: 2px solid var(--blue, #0160A6); outline-offset: 2px; }
.bt-trend-toggle .material-icons-round { font-size: 19px; }
.bt-trend-toggle .bt-tt-chev { transition: transform .15s; }
.bt-trend-toggle[aria-expanded="true"] .bt-tt-chev { transform: rotate(180deg); }
.bt-trend { margin-top: 16px; padding-top: 18px; border-top: 1px solid var(--line, #EFECE5); }
.bt-trend[hidden] { display: none; }
.bt-trend .bt-chart-title { font-size: 18px; }

/* One sentence says which voters the breakdown counts and how it's split. */
.bt-sentence { display: flex; align-items: center; flex-wrap: wrap; gap: 8px; min-width: 0; }
.bt-sw { font: 500 15px / 1 PolymathText, sans-serif; color: var(--ink2, #484542); }
.bt-sentence .bt-active-filters { display: contents; }
.bt-sentence .bt-af-none { font: 700 15px / 1 PolymathText, sans-serif; color: var(--ink, #1B1714); }
.bt-af-chip.bt-af-new { animation: bt-af-pop 1.4s ease-out; }
@keyframes bt-af-pop { 0% { box-shadow: 0 0 0 0 rgba(1, 96, 166, .55); } 100% { box-shadow: 0 0 0 10px rgba(1, 96, 166, 0); } }
.bt-add-filter { display: inline-flex; align-items: center; gap: 2px; height: 30px; padding: 0 12px 0 7px; border: 1px dashed #A9C4DD; border-radius: 100px;
  background: none; color: var(--blue, #0160A6); font: 600 13px / 1 PolymathText, sans-serif; cursor: pointer; white-space: nowrap; }
.bt-add-filter:hover, .bt-add-filter[aria-expanded="true"] { border-style: solid; background: rgba(1, 96, 166, .06); }
.bt-add-filter .material-icons-round { font-size: 18px; }
.bt-add-filter .bt-filter-count { display: none; }
.bt-sentence .bt-viewby { flex: 0 0 auto; }
.bt-sentence .bt-viewby select { height: 32px; min-width: 0; width: auto; padding: 0 30px 0 12px; border-radius: 100px; border: 1px solid #A9C4DD;
  background: rgba(1, 96, 166, .06); font: 700 14px / 1 PolymathText, sans-serif; color: var(--blue, #0160A6); }
.bt-sentence .bt-viewby select:hover { border-color: var(--blue, #0160A6); }
.bt-sentence .bt-viewby-caret { top: 4px; right: 6px; color: var(--blue, #0160A6); }
.bt-switch:disabled { opacity: .45; cursor: default; }
/* The sentence is the section's title. */
.bt-sentence.bt-sec-h { margin: 0; }
.bt-sentence .bt-sw { font: 800 20px / 1.2 PolymathDisp, serif; letter-spacing: .2px; color: var(--ink, #1B1714); }
.bt-sentence .bt-af-none { font: 800 20px / 1.2 PolymathDisp, serif; color: var(--blue, #0160A6); }
.bt-sentence .bt-viewby select { height: 34px; font-size: 15px; }
.bt-sentence .bt-viewby-caret { top: 5px; }
.bt-table-card > .bt-toolbar.bt-viewrow:first-child { border-top: 0; padding-top: 0; }
@media (max-width: 640px) { .bt-sentence .bt-sw, .bt-sentence .bt-af-none { font-size: 18px; } }
.bt-sentence .bt-af-chip { height: 34px; font-size: 15px; padding: 0 9px 0 14px; }
.bt-sentence .bt-add-filter { height: 34px; font-size: 14px; }
.bt-trend-sentence { display: flex; align-items: center; flex-wrap: wrap; gap: 8px; }
.bt-trend-sentence .bt-by-wrap { display: inline-flex; align-items: center; gap: 8px; }
.bt-trend-sentence .bt-by-wrap[hidden] { display: none; }
.bt-trend-sentence .bt-sw { font-size: 18px; }
.bt-trend-sentence small { font: 500 13px / 1.2 PolymathText, sans-serif; color: var(--mute, #93908E); }
.bt-table th.hl { color: var(--blue, #0160A6); box-shadow: inset 0 -2px 0 var(--blue, #0160A6); }

/* Title v3: plain words, the choices are blue underlined text, not pills. */
.bt-sentence { gap: 4px 6px; }
.bt-sentence .bt-sw, .bt-trend-sentence .bt-sw { font: 600 19px / 1.3 PolymathText, sans-serif; color: var(--ink, #1B1714); letter-spacing: 0; }
.bt-sentence .bt-viewby select { height: auto; padding: 0 20px 1px 0; border: 0; border-bottom: 2px dotted #8FB3D4; border-radius: 0; background: none;
  font: 700 19px / 1.3 PolymathText, sans-serif; color: var(--blue, #0160A6); }
.bt-sentence .bt-viewby select:hover, .bt-sentence .bt-viewby select:focus-visible { border-bottom-color: var(--blue, #0160A6); outline: none; }
.bt-sentence .bt-viewby-caret { top: 1px; right: -4px; font-size: 22px; }
.bt-pick { display: inline-flex; align-items: center; gap: 0; padding: 0 0 1px; border: 0; border-bottom: 2px dotted #8FB3D4; background: none; cursor: pointer;
  font: 700 19px / 1.3 PolymathText, sans-serif; color: var(--blue, #0160A6); white-space: nowrap; }
.bt-pick:hover, .bt-pick[aria-expanded="true"], .bt-pick:focus-visible { border-bottom-color: var(--blue, #0160A6); outline: none; }
.bt-pick .material-icons-round { font-size: 22px; margin-right: -4px; }
.bt-pick .bt-filter-count { display: none; }
.bt-trend-sentence small { margin-left: 4px; }
.bt-af-row { display: flex; align-items: center; flex-wrap: wrap; gap: 6px 8px; margin: -4px 0 14px; }
.bt-af-row[hidden] { display: none; }
.bt-af-label { font: 600 12px / 1 PolymathText, sans-serif; letter-spacing: .4px; text-transform: uppercase; color: var(--mute, #93908E); }
.bt-af-row .bt-af-chip { height: 28px; font-size: 13px; }
@media (max-width: 640px) {
  .bt-sentence .bt-sw, .bt-sentence .bt-viewby select, .bt-pick, .bt-trend-sentence .bt-sw { font-size: 17px; }
}
/* Compare to [year]: the year sits right after the switch's label. */
.bt-cmp { display: inline-flex; align-items: center; gap: 2px; }
.bt-cmp-year { appearance: none; -webkit-appearance: none; border: 0; border-bottom: 2px dotted #8FB3D4; background: none; padding: 0 2px 1px;
  font: 600 14px / 1.2 PolymathText, sans-serif; color: var(--blue, #0160A6); cursor: pointer; }
.bt-cmp-year:disabled { opacity: .45; cursor: default; }
.bt-cmp-year:focus-visible { outline: 2px solid var(--blue, #0160A6); outline-offset: 2px; }
.kc-vs { display: inline-flex; align-items: baseline; gap: 4px; margin-left: 10px; }
.kc-vs small { font: 500 11.5px / 1 PolymathText, sans-serif; color: var(--mute, #93908E); }
@media (max-width: 640px) {
  .bt-table-card .bt-table.by-metric .c-m, .bt-table-card .bt-table.by-metric .c-cure, .bt-table-card .bt-table.by-metric.has-rate .c-share { display: table-cell; }
  .bt-table-card .bt-table.by-metric .c-cast, .bt-table-card .bt-table.by-metric .c-mailin { display: none; }
}
/* "Turnout by County for …": the voters come last and trail off when long. */
.bt-viewrow .bt-sentence { flex: 1 1 360px; min-width: 0; flex-wrap: wrap; }
.bt-for { display: inline-flex; align-items: center; gap: 6px; flex: 1 1 0; min-width: 14ch; }
.bt-for .bt-pick { min-width: 0; max-width: 100%; }
.bt-for #bt-voters-text { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; min-width: 0; }
/* Title gets the whole first line; filter chips and the view controls share the second. */
.bt-viewrow .bt-sentence { flex: 1 1 100%; }
.bt-viewrow .bt-af-row { margin: 0; flex: 0 1 auto; min-width: 0; }
/* Suggested filters (no filters on): Popular and Notable today, each with its number. */
.bt-af-row.is-sugg .bt-af-label { display: inline-flex; align-items: center; gap: 4px; color: #6E6A63; }
.bt-af-row.is-sugg .bt-af-label .material-icons-round { font-size: 15px; color: #9C6ADE; }
.bt-sugg { display: inline-flex; align-items: center; gap: 5px; height: 28px; padding: 0 11px 0 8px; border: 1px solid #DCD5C4; border-radius: 100px;
  background: #fff; color: var(--ink2, #484542); font: 600 13px / 1 PolymathText, sans-serif; cursor: pointer; white-space: nowrap; }
.bt-sugg:hover { border-color: var(--blue, #0160A6); color: var(--blue, #0160A6); }
.bt-sugg:focus-visible { outline: 2px solid var(--blue, #0160A6); outline-offset: 2px; }
.bt-sugg .material-icons-round { font-size: 15px; }
.bt-sugg.popular .material-icons-round { color: var(--blue, #0160A6); }
.bt-sugg.notable .material-icons-round { color: #9C6ADE; }
.bt-sugg b { font-weight: 700; }
/* The compare year reads as a dropdown: outlined pill with a caret. */
.bt-cmp { gap: 6px; }
.bt-cmp-sel { position: relative; display: inline-flex; align-items: center; }
.bt-cmp-sel .bt-cmp-year { height: 28px; padding: 0 24px 0 10px; border: 1px solid #A9C4DD; border-radius: 100px; background: rgba(1, 96, 166, .06);
  font: 700 13.5px / 1 PolymathText, sans-serif; color: var(--blue, #0160A6); }
.bt-cmp-sel .bt-cmp-year:hover:not(:disabled) { border-color: var(--blue, #0160A6); }
.bt-cmp-sel .material-icons-round { position: absolute; right: 3px; font-size: 20px; color: var(--blue, #0160A6); pointer-events: none; }
.bt-cmp-sel:has(.bt-cmp-year:disabled) { opacity: .45; }
.bt-sugg { padding: 0 12px; }
.bt-pick.previewing #bt-voters-text { font-style: italic; opacity: .7; }
.bt-pick.previewing { border-bottom-style: solid; }
.bt-fp-sugg { display: flex; flex-wrap: wrap; gap: 8px; padding: 4px 0 14px; margin-bottom: 6px; border-bottom: 1px solid #EFECE5; }
.bt-fp-sugg-h { flex: 1 1 100%; display: flex; align-items: center; gap: 4px; font: 600 12px / 1 PolymathText, sans-serif; letter-spacing: .4px;
  text-transform: uppercase; color: #6E6A63; }
.bt-fp-sugg-h .material-icons-round { font-size: 15px; color: #9C6ADE; }
@media (max-width: 640px) { .bt-table-card .bt-table.by-metric .c-rdem { display: none; } }
.bt-table td.c-pr { color: #6E6A63; }
@media (max-width: 640px) { .bt-table-card .bt-table.by-metric .c-dr, .bt-table-card .bt-table.by-metric .c-rr { display: none; } }
/* The title says which voters; no chip row. Map/Table and CSV share the title's line. */
.bt-viewrow .bt-af-row { display: none !important; }
.bt-viewrow { flex-wrap: nowrap; }
.bt-viewrow .bt-sentence { flex: 1 1 0; min-width: 0; }
.bt-viewrow .bt-row-spacer { display: none; }
.bt-table-tools { display: flex; justify-content: flex-end; margin: -4px 0 10px; }
.bt-table-tools .bt-search[hidden] { display: none; }
.bt-table-tools .bt-search input { width: 200px; }
@media (max-width: 640px) {
  .bt-viewrow { flex-wrap: wrap; }
  .bt-viewrow .bt-sentence { flex: 1 1 100%; }
  .bt-table-tools .bt-search { flex: 1 1 auto; }
  .bt-table-tools .bt-search input { width: 100%; }
}
/* What to do now */
.bt-todo { padding: 22px 24px 18px; }
.bt-todo .bt-eyebrow { margin-bottom: 12px; }
.bt-todo-sentence { margin-bottom: 4px; }
.bt-todo-sub { margin: 0 0 12px; font: 400 14px / 1.4 PolymathText, sans-serif; color: #6E6A63; }
.bt-todo-table td.c-t1 b { font-weight: 700; }
.bt-todo-table th, .bt-todo-table td { text-align: right; }
.bt-todo-table th.c-name, .bt-todo-table td.c-name { text-align: left; }
.bt-todo-more { margin-top: 10px; border: 0; background: none; padding: 6px 0; font: 600 14px / 1 PolymathText, sans-serif; color: var(--blue, #0160A6); cursor: pointer; }
.bt-todo-more[hidden] { display: none; }
@media (max-width: 640px) { .bt-todo { padding: 18px 16px 14px; } .bt-todo-table .c-t0 { display: none; } }
@media (max-width: 640px) {
  .bt-todo-table { min-width: 0; }
  .bt-todo-table th, .bt-todo-table td { padding: 9px 5px; font-size: 13.5px; }
  .bt-todo-table th { white-space: normal; vertical-align: bottom; }
}
/* What to do now: map (or table) with the list card beside it */
.bt-todo-top { display: flex; align-items: center; gap: 12px; flex-wrap: wrap; }
.bt-todo-top .bt-sentence { flex: 1 1 auto; min-width: 0; }
.bt-todo-grid { display: grid; grid-template-columns: minmax(0, 1fr) 300px; gap: 24px; align-items: start; }
.bt-todo-main { min-width: 0; }
.bt-todo-map path.hl.picked { stroke: var(--ink, #1B1714); stroke-width: 2.4; }
.bt-todo-cta { position: sticky; top: 96px; padding: 20px; border-radius: 16px; background: var(--cream, #F9F3E3); border: 1px solid var(--edge, #E7DFCB); }
.bt-todo-cta-where { display: flex; align-items: center; justify-content: space-between; gap: 8px; font: 700 12px / 1.2 PolymathText, sans-serif;
  letter-spacing: .06em; text-transform: uppercase; color: #6E6A63; }
.bt-todo-clear { border: 0; background: none; padding: 0; font: 600 12.5px / 1 PolymathText, sans-serif; letter-spacing: 0; text-transform: none; color: var(--blue, #0160A6); cursor: pointer; }
.bt-todo-cta-num { margin-top: 8px; font: 800 40px / 1 PolymathDisp, serif; color: var(--ink, #1B1714); font-variant-numeric: tabular-nums; }
.bt-todo-cta-what { margin-top: 4px; font: 600 15px / 1.3 PolymathText, sans-serif; color: var(--ink, #1B1714); }
.bt-todo-cta-sub { margin-top: 2px; font: 400 13px / 1.4 PolymathText, sans-serif; color: #6E6A63; }
.bt-todo-cta-btn { margin-top: 16px; width: 100%; justify-content: center; box-sizing: border-box; height: 46px; font-size: 15px; }
.bt-todo-cta-lock { display: flex; gap: 6px; align-items: flex-start; margin-top: 10px; font: 400 12px / 1.4 PolymathText, sans-serif; color: #6E6A63; }
.bt-todo-cta-lock .material-icons-round { font-size: 15px; }
.bt-todo-cta-hint { margin-top: 12px; padding-top: 10px; border-top: 1px solid var(--edge, #E7DFCB); font: 500 12.5px / 1.4 PolymathText, sans-serif; color: var(--blue, #0160A6); }
.bt-todo-table tbody tr[data-sel] { cursor: pointer; }
.bt-todo-table tbody tr.picked td { background: rgba(1, 96, 166, .08); }
.bt-todo-table tbody tr:not(.total):hover td { background: rgba(1, 96, 166, .04); }
#bt-todo-display button:disabled { opacity: .45; cursor: default; }
@media (max-width: 900px) {
  .bt-todo-grid { grid-template-columns: minmax(0, 1fr); }
  .bt-todo-cta { position: static; }
}
/* The list card floats over the map's empty corner (below the mountain counties), so the map keeps its full width. */
.bt-todo-grid { grid-template-columns: minmax(0, 1fr); position: relative; }
.bt-todo-cta { position: absolute; left: 0; bottom: 34px; top: auto; width: 290px; padding: 16px 18px; box-shadow: rgba(12, 12, 13, 0.08) 0 6px 18px; }
.bt-todo-cta-num { font-size: 34px; margin-top: 6px; }
.bt-todo-cta-btn { margin-top: 12px; height: 42px; }
.bt-todo-cta-hint { margin-top: 10px; padding-top: 8px; }
@media (max-width: 900px) { .bt-todo-cta { position: static; width: auto; box-shadow: none; } }
/* Share: Bluesky and Facebook */
.bt-km-head { display: flex; align-items: center; justify-content: space-between; gap: 12px; flex-wrap: wrap; }
.bt-share { display: inline-flex; align-items: center; gap: 6px; }
.bt-share-l { font: 600 12.5px / 1 PolymathText, sans-serif; color: #6E6A63; margin-right: 2px; }
.bt-share-btn { width: 30px; height: 30px; display: grid; place-items: center; border: 1px solid #DCD5C4; border-radius: 50%; background: #fff; cursor: pointer; padding: 0; }
.bt-share-btn svg { width: 16px; height: 16px; }
.bt-share-btn.bluesky { color: #1185FE; } .bt-share-btn.facebook { color: #1877F2; }
.bt-share-btn:hover { border-color: currentColor; }
.bt-share-btn:focus-visible { outline: 2px solid var(--blue, #0160A6); outline-offset: 2px; }
.bt-todo-cta-share { margin-top: 10px; }
.bt-toast { position: fixed; left: 50%; bottom: 24px; transform: translate(-50%, 20px); z-index: 200; max-width: calc(100vw - 32px); padding: 10px 16px; border-radius: 10px;
  background: #1B1714; color: #fff; font: 500 14px / 1.4 PolymathText, sans-serif; opacity: 0; pointer-events: none; transition: opacity .2s, transform .2s; }
.bt-toast.on { opacity: 1; transform: translate(-50%, 0); }
/* Table view: the card sits beside the table instead of over it. */
.bt-todo-grid:not(.is-map) { grid-template-columns: minmax(0, 1fr) 290px; }
.bt-todo-grid:not(.is-map) .bt-todo-cta { position: sticky; top: 96px; bottom: auto; width: auto; box-shadow: none; }
@media (max-width: 900px) { .bt-todo-grid:not(.is-map) { grid-template-columns: minmax(0, 1fr); } .bt-todo-grid:not(.is-map) .bt-todo-cta { position: static; } }
/* Trend section: open, labeled statewide */
section.bt-trend { margin-top: 0; padding-top: 20px; border-top: 0; }
section.bt-trend .bt-eyebrow { margin-bottom: 10px; }
/* Compact list card: fits the empty corner below the mountain counties */
.bt-todo-cta { width: 300px; padding: 14px 16px; bottom: 30px; }
.bt-todo-cta-num { font-size: 30px; margin-top: 4px; }
.bt-todo-cta-what { font-size: 14px; }
.bt-todo-cta-sub { font-size: 12.5px; }
.bt-todo-cta-row { display: flex; align-items: center; gap: 6px; margin-top: 10px; }
.bt-todo-cta-row .bt-todo-cta-btn { margin-top: 0; flex: 1 1 auto; width: auto; height: 38px; padding: 0 14px; font-size: 14px; gap: 6px; }
.bt-todo-cta-row .bt-share-l { display: none; }
.bt-todo-cta-lock { margin-top: 8px; font-size: 11.5px; }
.bt-todo-cta-lock .material-icons-round { font-size: 13px; }
/* The corner is only big enough on wide screens; narrower, the card sits under the map. */
@media (max-width: 1199px) { .bt-todo-grid.is-map .bt-todo-cta { position: static; width: auto; max-width: 420px; box-shadow: none; } }
#bt-bd-share .bt-share-l { display: none; }
#bt-bd-share { display: inline-flex; }
/* Both lists in the card */
.bt-todo-cta-where { display: flex; align-items: center; justify-content: space-between; }
.bt-todo-cta-where .bt-share-l { display: none; }
.bt-todo-cta-where .bt-share-btn { width: 26px; height: 26px; }
.bt-todo-cta-where .bt-share-btn svg { width: 14px; height: 14px; }
.bt-todo-list { display: flex; align-items: center; justify-content: space-between; gap: 10px; padding: 9px 0; border-top: 1px solid var(--edge, #E7DFCB); }
.bt-todo-list.first { border-top: 0; padding-top: 6px; }
.bt-todo-list-n { display: flex; flex-direction: column; min-width: 0; }
.bt-todo-list-n b { font: 800 24px / 1.05 PolymathDisp, serif; color: var(--ink, #1B1714); font-variant-numeric: tabular-nums; }
.bt-todo-list-n span { font: 500 12.5px / 1.3 PolymathText, sans-serif; color: #484542; }
.bt-todo-list .bt-todo-cta-btn { margin: 0; width: auto; flex: none; height: 34px; padding: 0 12px; font-size: 13px; gap: 5px; }
.bt-todo-list .bt-todo-cta-btn.alt { background: #fff; color: var(--blue, #0160A6); box-shadow: inset 0 0 0 1.5px var(--blue, #0160A6); }
.bt-todo-cta-lock { margin-top: 4px; }
.bt-todo-cta-lock .bt-todo-clear { font-size: 11.5px; }
.bt-todo-cta { width: 320px; }
.bt-todo-cta-where .bt-todo-clear { margin-left: 6px; }
.bt-todo-cta-where .bt-todo-clear::before { content: '← '; }
.bt-todo-list-n span { white-space: nowrap; }
.bt-todo-cta { width: 330px; }
.bt-todo-list-n { flex: 1 1 auto; }
.bt-todo-list-n span { white-space: normal; }
.bt-km-tools { display: inline-flex; align-items: center; gap: 14px; flex-wrap: wrap; }
.bt-km-vs { font: 600 12.5px / 1 PolymathText, sans-serif; color: #6E6A63; }
.bt-km-tools .bt-cmp-sel .bt-cmp-year, #bt-km-cmp { appearance: none; -webkit-appearance: none; height: 28px; padding: 0 24px 0 10px; border: 1px solid #A9C4DD;
  border-radius: 100px; background: rgba(1, 96, 166, .06); font: 700 13.5px / 1 PolymathText, sans-serif; color: var(--blue, #0160A6); cursor: pointer; }
/* The list strip sits above the map (or table), full width; the map keeps its size. */
.bt-todo-grid, .bt-todo-grid:not(.is-map) { display: block; }
.bt-todo-grid .bt-todo-cta, .bt-todo-grid.is-map .bt-todo-cta, .bt-todo-grid:not(.is-map) .bt-todo-cta {
  position: static; width: auto; max-width: none; box-shadow: none; margin: 0 0 14px;
  display: grid; grid-template-columns: minmax(170px, 1.1fr) minmax(0, 1.4fr) minmax(0, 1.4fr) auto; align-items: center; gap: 0;
  padding: 12px 16px; border-radius: 14px; }
.bt-todo-cta-head { display: flex; flex-direction: column; gap: 3px; padding-right: 16px; min-width: 0; }
.bt-todo-cta-where { display: block; }
.bt-todo-cta-head .bt-todo-cta-lock { margin: 0; }
.bt-todo-cta-pick { font: 500 12px / 1.3 PolymathText, sans-serif; color: var(--blue, #0160A6); }
.bt-todo-cta-pick:empty { display: none; }
.bt-todo-cta .bt-todo-list, .bt-todo-cta .bt-todo-list.first { border-top: 0; border-left: 1px solid var(--edge, #E7DFCB); padding: 2px 16px; }
.bt-todo-cta-share { padding-left: 14px; border-left: 1px solid var(--edge, #E7DFCB); }
.bt-todo-cta-share .bt-share-l { display: none; }
@media (max-width: 1000px) {
  .bt-todo-grid .bt-todo-cta, .bt-todo-grid.is-map .bt-todo-cta, .bt-todo-grid:not(.is-map) .bt-todo-cta { grid-template-columns: minmax(0, 1fr) auto; row-gap: 8px; }
  .bt-todo-cta-head { grid-column: 1; }
  .bt-todo-cta-share { grid-column: 2; grid-row: 1; border-left: 0; }
  .bt-todo-cta .bt-todo-list, .bt-todo-cta .bt-todo-list.first { grid-column: 1 / -1; border-left: 0; border-top: 1px solid var(--edge, #E7DFCB); padding: 8px 0 0; }
}
/* Guidance: question shortcuts, definition line, summary links, dead ends, "New" */
.bt-asks { display: flex; flex-wrap: wrap; align-items: center; gap: 8px; margin: 0 0 16px; padding-bottom: 14px; border-bottom: 1px solid var(--line, #EFECE5); }
.bt-asks-l { flex: 1 1 100%; font: 600 12px / 1 PolymathText, sans-serif; letter-spacing: .4px; text-transform: uppercase; color: #6E6A63; }
.bt-ask { height: 32px; padding: 0 14px; border: 1px solid #DCD5C4; border-radius: 100px; background: #fff; color: var(--ink2, #484542);
  font: 600 13.5px / 1 PolymathText, sans-serif; cursor: pointer; white-space: nowrap; }
.bt-ask:hover { border-color: var(--blue, #0160A6); color: var(--blue, #0160A6); }
.bt-ask.on { border-color: var(--blue, #0160A6); background: rgba(1, 96, 166, .08); color: var(--blue, #0160A6); }
.bt-ask:focus-visible { outline: 2px solid var(--blue, #0160A6); outline-offset: 2px; }
@media (max-width: 640px) { .bt-ask { white-space: normal; height: auto; min-height: 32px; padding: 7px 12px; text-align: left; line-height: 1.25; } }
.bt-def { margin: -4px 0 12px; font: 400 13px / 1.45 PolymathText, sans-serif; color: #6E6A63; }
.bt-def:empty { display: none; }
.bt-sum-link { color: inherit; text-decoration: underline; text-decoration-color: rgba(1, 96, 166, .45); text-decoration-thickness: 2px; text-underline-offset: 3px; cursor: pointer; }
.bt-sum-link:hover { color: var(--blue, #0160A6); text-decoration-color: var(--blue, #0160A6); }
.bt-sum-go { display: inline-flex; align-items: center; gap: 2px; margin-left: 4px; font-weight: 600; color: var(--blue, #0160A6); cursor: pointer; white-space: nowrap; }
.bt-sum-go .material-icons-round { font-size: 16px; }
.bt-dead { display: flex; flex-direction: column; align-items: center; gap: 10px; }
.bt-dead button { height: 34px; padding: 0 16px; border: 0; border-radius: 100px; background: var(--blue, #0160A6); color: #fff; font: 600 13.5px / 1 PolymathText, sans-serif; cursor: pointer; }
.bt-new { display: inline-flex; align-items: center; height: 20px; padding: 0 8px; margin-right: 4px; border-radius: 100px; background: #9C6ADE; color: #fff;
  font: 700 11px / 1 PolymathText, sans-serif; letter-spacing: .2px; white-space: nowrap; }
.bt-new[hidden] { display: none; }
.bt-dead { justify-content: center; }
.bt-asks { border-bottom: 0; padding-bottom: 0; margin-bottom: 14px; }
/* Year toggle: 2022 | 2018 */
.bt-yr { display: inline-flex; border: 1px solid #A9C4DD; border-radius: 100px; overflow: hidden; background: #fff; }
.bt-yr button { height: 28px; padding: 0 11px; border: 0; background: none; font: 600 13px / 1 PolymathText, sans-serif; color: var(--blue, #0160A6); cursor: pointer; }
.bt-yr button + button { border-left: 1px solid #A9C4DD; }
.bt-yr button[aria-pressed="true"] { background: var(--blue, #0160A6); color: #fff; }
.bt-yr button:disabled { opacity: .45; cursor: default; }
.bt-yr button:focus-visible { outline: 2px solid var(--blue, #0160A6); outline-offset: -2px; }
/* Questions sit right under the title they change, as quick settings for it. */
.bt-asks { margin: -6px 0 10px; padding: 0; border: 0; gap: 6px; }
.bt-asks-l { flex: none; font: 600 13px / 1 PolymathText, sans-serif; letter-spacing: 0; text-transform: none; color: #6E6A63; margin-right: 2px; }
.bt-ask { height: 28px; padding: 0 12px; font-size: 13px; background: #FBF8F1; }
.bt-ask.on { background: rgba(1, 96, 166, .1); }
/* Title, questions and definition read as one header block; the rule comes after it. */
.bt-toolbar.bt-viewrow { border-bottom: 0; padding-bottom: 8px; margin-bottom: 4px; }
.bt-asks { margin: 0 0 8px; }
.bt-def { margin: 0 0 14px; padding-bottom: 12px; border-bottom: 1px solid var(--line, #EFECE5); }
/* The title row is the card's header bar, like a table header; suggestions sit under it. */
.bt-table-card > .bt-toolbar.bt-viewrow:first-child, .bt-table-card > .bt-toolbar.bt-viewrow {
  margin: 0 -16px 12px; padding: 14px 16px; background: #EEF4FA; border-bottom: 1px solid #D6E4F1; border-radius: 16px 16px 0 0; }
.bt-viewrow .bt-display { background: #fff; }
.bt-viewrow .bt-share-btn { background: #fff; }
.bt-asks-l { display: inline-flex; align-items: center; gap: 4px; }
.bt-asks-l .material-icons-round { font-size: 15px; color: #9C6ADE; }
.bt-ask { font-weight: 500; color: var(--ink2, #484542); }
.bt-ask b { font-weight: 700; color: var(--blue, #0160A6); }
.bt-ask.on b { color: var(--blue, #0160A6); }
@media (max-width: 640px) { .bt-ask { white-space: nowrap; height: 28px; min-height: 0; padding: 0 11px; } }
#trend .bt-chart-title small { margin-left: 6px; }
.bt-cmp-l { font: 600 13px / 1 PolymathText, sans-serif; color: var(--ink2, #484542); margin-right: 4px; }
.bt-def { display: none; }
.bt-hd-cmp { display: inline-flex; align-items: center; }
.bt-hd-cmp[hidden] { display: none; }
.tip-cols { display: grid; grid-template-columns: 10px 34px 1fr 1fr; align-items: center; gap: 0 8px; }
.tip-cols b, .tip-cols em { text-align: right; font-variant-numeric: tabular-nums; }
.tip-cols em { font-style: normal; color: #6E6A63; }
.tip-th b, .tip-th em { font: 600 11px / 1 PolymathText, sans-serif; color: #93908E; }
/* Header bar = the view's settings (metric, by, voters, vs year). Map/Table, share and CSV sit
   below it, on the suggestions row, since they only change how it's shown. */
.bt-cmp-in { display: inline-flex; align-items: center; gap: 6px; }
.bt-cmp-in[hidden] { display: none; }
.bt-viewtools-row { display: flex; align-items: center; justify-content: space-between; gap: 10px 16px; flex-wrap: wrap; margin: 0 0 12px; }
.bt-viewtools-row .bt-asks { margin: 0; flex: 1 1 auto; }
.bt-viewtools { display: inline-flex; align-items: center; gap: 8px; flex: none; }
.tip-vs { font-weight: 500; color: #6E6A63; }
/* Trend controls: the main switch (Dem–Rep Turnout · Dem–Rep Margin · Turnout), and for Turnout a second
   row of quieter chips for whose turnout (All voters · DEM · REP · UNA). */
.bt-tctl { display: flex; flex-wrap: wrap; align-items: center; gap: 8px 10px; margin-top: 8px; }
.bt-tmain button { font-size: 13px; }
.bt-tview { display: inline-flex; gap: 6px; }
.bt-tview[hidden] { display: none; }
.bt-tview button { height: 28px; padding: 0 12px; border-radius: 100px; border: 1px solid #C9D7E6; background: #fff; color: var(--ink2); font: 600 12.5px / 1 PolymathText, sans-serif; cursor: pointer; white-space: nowrap; }
.bt-tview button[aria-selected="true"] { border-color: var(--blue); background: #EAF2FB; color: var(--blue); }
.bt-tview button.rep[aria-selected="true"] { border-color: var(--red); background: #FDECEA; color: var(--red); }
.bt-tview button.una[aria-selected="true"] { border-color: #9C6ADE; background: #F3EDFB; color: #7A4CC2; }
/* Phones: five tabs (the last "Dem–Rep") share the row instead of running past the edge. */
@media (max-width: 640px) {
  .bt-tmain { width: 100%; box-sizing: border-box; }
  .bt-tmain button { flex: 1 1 auto; padding: 0 6px; font-size: 12.5px; }
  .bt-tview { width: 100%; }
  .bt-tview button { flex: 1 1 auto; }
}
#trend .bt-cmp[hidden] { display: none; }
#trend .bt-chart-title { font-size: 20px; }
/* "vs [year]" follows the voters directly instead of being pushed to the far end. */
.bt-for { flex: 0 1 auto; min-width: 0; }
.bt-cmp-in { flex: none; }
.bt-map-total { position: absolute; left: 0; top: 4px; z-index: 2; pointer-events: none; display: inline-flex; align-items: baseline; gap: 8px; margin: 0; padding: 8px 12px; border-radius: 10px; background: #F4F1EA;
  font: 500 13px / 1.2 PolymathText, sans-serif; color: #484542; }
.bt-map-total b { font: 800 20px / 1 PolymathDisp, serif; color: var(--ink, #1B1714); }
.bt-trend .bt-chart-ctrls { align-self: flex-end; }
.kc-vsl { margin-left: 4px; font: 500 11.5px / 1 PolymathText, sans-serif; color: #93908E; }

.bt-km-head { margin-bottom: 16px; }

/* Option A: Map | Table as tabs on the picture, share + CSV at the right of the strip */
.bt-vstrip { display: flex; align-items: flex-end; justify-content: space-between; gap: 8px; border-bottom: 1px solid #E4DED3; margin: 4px 0 14px; }
.bt-vtabs { display: inline-flex; gap: 2px; }
.bt-vtabs button { display: inline-flex; align-items: center; gap: 6px; padding: 9px 14px 10px; border: 0; border-bottom: 3px solid transparent; margin-bottom: -1px;
  background: none; font: 600 14px / 1 PolymathText, sans-serif; color: #6E6A66; cursor: pointer; }
.bt-vtabs button .material-icons-round { font-size: 19px; }
.bt-vtabs button[aria-selected="true"] { color: #001C37; border-bottom-color: #0160A6; }
.bt-vtabs button:hover { color: #001C37; }
.bt-viewtools-row { margin-bottom: 8px; }
.bt-vtabs button[hidden] { display: none; }
.bt-bd-head { margin: 0 0 14px; }
.bt-bd-head .bt-chart-title { font-size: 20px; }
.bt-bd-sub { margin: 4px 0 0; font: 400 14px / 1.4 PolymathText, sans-serif; color: #6E6A66; }
/* Breakdown title: card padding like the trend title; the header bar below is a straight band, not a rounded top. */
.bt-bd-head { padding: 20px 0 0; margin: 0 0 16px; }
.bt-table-card > .bt-bd-head + .bt-toolbar.bt-viewrow { border-radius: 0; border-top: 1px solid #D6E4F1; }
.bt-drv-pts { color: #6E6A66; font-size: .92em; }
.bt-bd-head .bt-asks { margin: 12px 0 0; }
.bt-table-card > .bt-bd-head + .bt-toolbar.bt-viewrow { margin-bottom: 4px; }
/* County/district pages: no map yet, so no Map | Table tabs (share + CSV stay) */
.bt-scoped .bt-vtabs { visibility: hidden; }
.bt-bd-top { display: flex; align-items: center; justify-content: space-between; gap: 12px; }
.bt-bd-tools { display: inline-flex; align-items: center; gap: 4px; flex: none; }
.bt-scoped .bt-vstrip { display: none; }
.bt-km-tools .bt-cmp[hidden] { display: none; }
/* Share: four sites + a "more" menu (share/download image, LinkedIn, WhatsApp, email, copy link) */
.bt-share-btn.threads, .bt-share-btn.x, .bt-share-btn.more { color: #1B1714; }
.bt-share-btn.more .material-icons-round { font-size: 18px; }
.bt-share-more { position: relative; display: inline-flex; }
.bt-share-menu { position: absolute; right: 0; top: calc(100% + 6px); z-index: 60; min-width: 196px; padding: 6px; border-radius: 12px; background: #fff;
  border: 1px solid #E1D6BE; box-shadow: 0 8px 28px rgba(12, 12, 13, .14); display: flex; flex-direction: column; }
.bt-share-menu[hidden] { display: none; }
.bt-share-item { display: flex; align-items: center; gap: 10px; padding: 9px 10px; border: 0; border-radius: 8px; background: none; cursor: pointer;
  font: 600 14px / 1.2 PolymathText, sans-serif; color: #1B1714; text-align: left; white-space: nowrap; }
.bt-share-item:hover, .bt-share-item:focus-visible { background: #F4F1EA; outline: none; }
.bt-share-item svg { width: 18px; height: 18px; flex: none; } .bt-share-item .material-icons-round { font-size: 19px; color: #484542; }
.bt-share-item.linkedin { color: #0A66C2; } .bt-share-item.whatsapp { color: #1DA851; }
.bt-share-item.linkedin span, .bt-share-item.whatsapp span { color: #1B1714; }
.bt-share-item.image, .bt-share-item.download { font-weight: 700; }
.bt-share-btn.linkedin { color: #0A66C2; }
.bt-share-img { display: inline-flex; align-items: center; gap: 5px; height: 30px; padding: 0 11px 0 9px; border: 1px solid #DCD5C4; border-radius: 999px; background: #fff;
  cursor: pointer; font: 700 13px / 1 PolymathText, sans-serif; color: #1B1714; }
.bt-share-img .material-icons-round { font-size: 17px; }
.bt-share-img:hover { border-color: #1B1714; }
.bt-share-img:focus-visible { outline: 2px solid var(--blue, #0160A6); outline-offset: 2px; }
/* One Share button + panel */
.bt-share-open { display: inline-flex; align-items: center; gap: 6px; height: 32px; padding: 0 13px 0 10px; border: 1px solid #DCD5C4; border-radius: 999px; background: #fff;
  cursor: pointer; font: 700 13.5px / 1 PolymathText, sans-serif; color: #1B1714; }
.bt-share-open .material-icons-round { font-size: 17px; color: var(--blue, #0160A6); }
.bt-share-open:hover, .bt-share-open[aria-expanded="true"] { border-color: #1B1714; }
.bt-share-open:focus-visible { outline: 2px solid var(--blue, #0160A6); outline-offset: 2px; }
.bt-share .bt-share-menu { width: 300px; padding: 12px; gap: 6px; }
.bt-share-h { font: 700 11.5px / 1 PolymathText, sans-serif; letter-spacing: 1.5px; text-transform: uppercase; color: #787776; padding: 4px 4px 2px; }
.bt-share-menu .bt-share-img { justify-content: center; height: 40px; width: 100%; border-radius: 10px; background: var(--blue, #0160A6); border-color: var(--blue, #0160A6); color: #fff; font-size: 14px; margin-bottom: 6px; }
.bt-share-menu .bt-share-img .material-icons-round { color: #fff; }
.bt-share-menu .bt-share-img:hover { background: #014C85; }
.bt-share-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 2px; }
.bt-share-grid .bt-share-item { padding: 8px; font-size: 13.5px; }
.bt-share-item.bluesky svg { color: #1185FE; } .bt-share-item.facebook svg { color: #1877F2; }
.bt-share-item.threads svg, .bt-share-item.x svg { color: #1B1714; } .bt-share-item.linkedin svg { color: #0A66C2; }
#trend .bt-chart-ctrls { align-items: center; gap: 10px 16px; }

/* Breakdown table groups: size | parts | each year | change. Rules split the groups, the two key
   columns (today's value, change vs 2022) are tinted, earlier years are grey. */
.bt-table tr.bt-grp th { text-align: center; cursor: default; padding: 8px 10px 4px; border-bottom: 1px solid var(--line); font: 700 11px / 1.2 PolymathText, sans-serif; letter-spacing: .06em; text-transform: uppercase; color: var(--ink2, #4A4744); }
.bt-table tr.bt-grp th:first-child { border-bottom-color: transparent; }
.bt-table.grouped .sep { border-left: 1.5px solid #CFC8BA; }
.bt-table td.bt-kc { background: #F0F5FA; font-weight: 700; }
.bt-table th.bt-kc { background: #F0F5FA; color: #0B3C6E; }
.bt-table tr.total td.bt-kc { background: #E3EDF7; }
.bt-table td.c-old { color: #8A857D; }
.bt-table th .sm { display: none; }
.bt-table .bt-few { font-size: 12px; color: var(--mute, #93908E); font-weight: 500; }
@media (max-width: 640px) {
  /* Phones: place, today's value, vs 2022, vs 2018. Tap a row for the rest. */
  .bt-table-card .bt-table.grouped tr.bt-grp { display: none; }
  .bt-table-card .bt-table.grouped thead tr:last-child th:not(.ph), .bt-table-card .bt-table.grouped tbody tr[data-k] td:not(.ph) { display: none; }
  .bt-table-card .bt-table.grouped th .lg { display: none; }
  .bt-table-card .bt-table.grouped th .sm { display: inline; }
  .bt-table-card .bt-table.grouped .sep { border-left: 0; }
}

/* Key metrics: vs 2022 and vs 2018 side by side (no year toggle). */
.kc-l3 { display: flex; flex-wrap: wrap; gap: 4px 8px; align-items: baseline; margin-top: 4px; }
.kc-vs { display: inline-flex; align-items: baseline; white-space: nowrap; }
.kc-tbl.kc-2 { grid-template-columns: minmax(40px, .6fr) minmax(0, 1fr) minmax(0, .9fr) minmax(0, .9fr); }
.kc-tbl.kc-2 .kc-th.l { grid-column: 1 / 3; }
.kc-l3 .kc-vs { margin-left: 0; }
.kc-dot { color: #B5AFA4; }
/* 2018 is context: same arrow and number, quieter. */
.kc-vs18 .kc-chg { font-weight: 500; font-size: 13px; opacity: .75; }
.kc-c.kc-c18 { font-weight: 500; font-size: 13px; opacity: .75; }
.kc-th.kc-th18 { opacity: .7; }
.kc-t { display: flex; justify-content: space-between; align-items: baseline; gap: 8px; }
.kc-t-r { font: 500 12.5px / 1.2 PolymathText, sans-serif; letter-spacing: 0; text-transform: none; color: var(--mute, #93908E); white-space: nowrap; }
.bt-km-head .bt-eyebrow-sm { font-size: 15px; letter-spacing: 1.3px; }

/* ---- Small screens (laptops, tablets, phones) ---- */
/* 1: short laptop screens: a tighter hero. 9: phones: the jump links as pills (laptops keep the full jump cards). */
@media (max-height: 860px) and (min-width: 641px) {
  .bt-hero { padding-top: 28px; }
  .bt-title { font-size: clamp(34px, 5vw, 52px); margin-bottom: 10px; }
  .bt-dek { margin-bottom: 10px; }
}
@media (max-width: 640px) {
  .bt-jumps .bt-jump:first-child { padding-left: 16px; }
  .bt-jumps { display: flex; flex-wrap: nowrap; overflow-x: auto; scrollbar-width: none; gap: 10px; margin-top: 18px; padding-top: 14px; border-top: 1px solid var(--edge); }
  .bt-jumps::-webkit-scrollbar { display: none; }
  .bt-jump, .bt-jump + .bt-jump { flex: none; flex-direction: row; align-items: baseline; gap: 7px; padding: 10px 16px; border: 1px solid var(--edge); border-radius: 100px; background: #fff; }
  .bt-jump-desc, .bt-jump-go { display: none; }
  .bt-jump-num { font-size: 11px; }
  .bt-jump-title { font: 600 14px / 1.2 PolymathText, sans-serif; letter-spacing: 0; }
}
/* 2: short laptop screens: the map fits with its legend. */
@media (max-height: 860px) and (min-width: 641px) {
  .bt-map svg { max-height: calc(100vh - 400px); min-height: 300px; width: 100%; }
}
/* 3: tablets in landscape: key-metric headers stay on one line. */
@media (max-width: 1100px) and (min-width: 641px) {
  .kc-th { white-space: nowrap; letter-spacing: .04em; font-size: 10.5px; }
  .kc { padding: 16px; }
}
/* 4: two cards per row: Need a cure takes the full row, number left and table right. */
@media (min-width: 641px) and (max-width: 900px) {
  .km-grid .kc:nth-child(3) { grid-column: 1 / -1; grid-row: auto; grid-template-rows: none; grid-template-columns: minmax(0, 1fr) minmax(0, 1.3fr); column-gap: 20px; align-items: center; }
  .km-grid .kc:nth-child(3) .kc-t { grid-column: 1 / -1; }
}
/* 6: phones: the trend's Share sits in the title row. */
@media (max-width: 640px) {
  #trend { position: relative; }
  #trend .bt-chart-title { padding-right: 96px; }
  #bt-tr-share { position: absolute; top: 18px; right: 16px; }
  .bt-chart .today { top: -14px; }
}
/* 7: phones: the map scrolls sideways, so the statewide number lives in the card under it. */
@media (max-width: 640px) { .bt-map-total { display: none; } }
/* 8: phones: suggested views in one row that scrolls sideways. */
@media (max-width: 640px) {
  .bt-bd-head .bt-asks { flex-wrap: nowrap; overflow-x: auto; scrollbar-width: none; margin-right: -16px; padding-right: 16px; }
  .bt-bd-head .bt-asks::-webkit-scrollbar { display: none; }
  .bt-bd-head .bt-asks > * { flex: none; }
}
/* 11: small phones: the list's party label goes under its number. */
@media (max-width: 400px) { .bt-list-num { flex-wrap: wrap; row-gap: 4px; } .bt-list-num b { font-size: 44px; } }
/* 9: phones: the jump links as a 2×2 grid of roomier pills. */
@media (max-width: 640px) {
  .bt-jumps { display: grid; grid-auto-flow: row; grid-template-columns: repeat(2, minmax(0, 1fr)); overflow: visible; gap: 10px; }
  .bt-jump, .bt-jump + .bt-jump, .bt-jumps .bt-jump:first-child { padding: 12px 16px; }
}
/* Phones: the update time moves from the hero to the Summary header (the jump links stay, as a 2×2 grid). */
.bt-upd-sm { display: none; }
@media (max-width: 640px) {
  .bt-hero .bt-status { display: none; }
  .bt-upd-sm { display: inline; margin-left: auto; font: 500 12px / 1.2 PolymathText, sans-serif; letter-spacing: 0; text-transform: none; color: var(--mute, #93908E); white-space: nowrap; }
}
@media (max-width: 640px) { #bt-summary-label { flex-wrap: nowrap; white-space: nowrap; } }
/* Long place names on small phones: the date alone. */
@media (max-width: 380px) { .bt-upd-sm .w { display: none; } }
/* Suggested views: buttons on wider screens, one dropdown on phones (the sparkle icon stays). */
.bt-asks-pick { display: none; position: relative; align-items: center; }
.bt-asks-pick select { appearance: none; -webkit-appearance: none; height: 34px; padding: 0 30px 0 12px; border: 1px solid #DCD5C4; border-radius: 999px; background: #fff;
  font: 600 13.5px / 1 PolymathText, sans-serif; color: var(--blue, #0160A6); max-width: 100%; }
.bt-asks-pick .bt-viewby-caret { position: absolute; right: 8px; pointer-events: none; color: var(--blue, #0160A6); }
@media (max-width: 640px) {
  .bt-bd-head .bt-asks { flex-wrap: nowrap; overflow: visible; margin-right: 0; padding-right: 0; }
  .bt-bd-head .bt-asks .bt-ask { display: none; }
  .bt-asks-pick { display: inline-flex; flex: 1 1 auto; min-width: 0; }
  .bt-asks-pick select { width: 100%; }
}
/* Phones: Share is a round icon button, so section titles keep their line. */
@media (max-width: 640px) {
  .bt-share-open { width: 30px; height: 30px; padding: 0; justify-content: center; }
  .bt-share-open > span:not(.material-icons-round) { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; }
  .bt-share-open .material-icons-round { font-size: 16px; }
  #trend .bt-chart-title { padding-right: 52px; }
}
/* Phones: the whole state fits the screen (no sideways swiping); tap a county for its numbers, or use Table. */
@media (max-width: 640px) {
  .bt-map { overflow-x: visible; margin: 0; padding: 0; }
  .bt-map svg { width: 100%; }
  .bt-map-swipe { display: none; }
}
/* Phones: less text before the first numbers. No tagline; key drivers without "ballots" or the points detail ("See it" has the detail). */
@media (max-width: 640px) {
  .bt-hero .bt-dek { display: none; }
  .bt-drv-w, .bt-drv-pts { display: none; }
}
/* Map hover / card: each comparison year as a small table (year, that year's value, change). */
.bt-map-tip .yrs, .bt-map-detail .yrs, .bt-row-detail .yrs { display: grid; grid-template-columns: auto auto auto; column-gap: 16px; row-gap: 3px; align-items: baseline; margin: 2px 0 6px; font-variant-numeric: tabular-nums; }
.yrs i { font: 600 10.5px / 1.2 PolymathText, sans-serif; font-style: normal; letter-spacing: .06em; text-transform: uppercase; color: var(--mute, #93908E); }
.yrs i:not(:first-child), .yrs em, .yrs b { text-align: right; }
.yrs span { color: var(--ink2, #4A4744); }
.yrs em { font-style: normal; color: var(--ink2, #4A4744); }
.yrs b { font-weight: 700; }
/* Key drivers. Wider screens: one sentence per group ("Buncombe County · 1,974 ballots ahead of pace (…) See it").
   Phones: three aligned columns (group, ahead/behind, See it) instead of a wrapping sentence. */
.bt-drv-m.t-good, .bt-drv-m.t-bad { color: inherit; }
.bt-drv-dem { display: none; }
@media (max-width: 640px) {
  .bt-drv-among { display: none; }
  .bt-drv-dem { display: inline; }
  .bt-drivers-list li { display: grid; grid-template-columns: minmax(0, 1fr) auto auto; column-gap: 12px; align-items: baseline; }
  .bt-drv-sep { display: none; }
  .bt-drv-m { text-align: right; white-space: nowrap; font-weight: 600; }
  .bt-drv-m.t-good { color: var(--green); } .bt-drv-m.t-bad { color: var(--red); }
  .bt-drivers-list .bt-sum-go { margin-left: 0; }
}
.w-sm { display: none; }
/* Phones: the summary uses DEM / REP and sits flush on both edges. */
@media (max-width: 640px) {
  .w-lg { display: none; } .w-sm { display: inline; }

}
@media (max-width: 640px) { .bt-drivers-list .bt-see-w { display: none; } .bt-drivers-list .bt-sum-go .material-icons-round { font-size: 20px; } }
/* Map hover / card: the active voter filter, under the place name. */
.bt-tip-who { display: inline-block; margin: -2px 0 8px; padding: 2px 8px; border-radius: 6px; background: #EAF1F8; color: #0B3C6E; font: 600 12px / 1.4 PolymathText, sans-serif; }
/* Grouped table: the dividers start at the column headers, not the group labels above them. */
.bt-table.grouped tr.bt-grp th.sep { border-left: 0; }
/* Search: an icon by Share and CSV that opens into a box. */
.bt-bd-tools .bt-search.bt-search-ic { height: 36px; padding: 0; gap: 0; border-color: transparent; border-radius: 999px; background: none; transition: border-color .15s; }
.bt-bd-tools .bt-search.bt-search-ic[hidden] { display: none; }
.bt-search-btn { display: grid; place-items: center; width: 36px; height: 36px; border: 0; background: none; cursor: pointer; color: var(--ink2); border-radius: 999px; }
.bt-search-btn:hover { background: #F2EEE5; }
.bt-search-btn .material-icons-round { font-size: 21px; color: inherit; }
.bt-bd-tools .bt-search.bt-search-ic input { width: 0; padding: 0; transition: width .2s ease; }
.bt-bd-tools .bt-search.bt-search-ic.open { border-color: #7B7768; background: #fff; }
.bt-bd-tools .bt-search.bt-search-ic.open input { width: 170px; padding-right: 12px; }
@media (max-width: 640px) { .bt-bd-tools .bt-search.bt-search-ic.open input { width: 120px; } .bt-bd-tools .bt-search.bt-search-ic { flex: none; } }
@media (prefers-reduced-motion: reduce) { .bt-bd-tools .bt-search.bt-search-ic input { transition: none; } }
@media (max-width: 640px) {
  .bt-bd-top { flex-wrap: wrap; }
  .bt-bd-top:has(.bt-search.open) .bt-bd-tools { flex: 1 1 100%; order: 2; }
  .bt-bd-tools .bt-search.bt-search-ic.open { flex: 1 1 auto; }
  .bt-bd-tools .bt-search.bt-search-ic.open input { width: 100%; }
}
/* The summary's three points (turnout, spread, cures) as bullets, on every screen. */
.bt-summary-text { display: grid; gap: 8px; }
.bt-summary-text > span { position: relative; padding-left: 20px; }
.bt-summary-text > span::before { content: ""; position: absolute; left: 3px; top: .62em; width: 7px; height: 7px; border-radius: 50%; background: var(--ink2); opacity: .45; }
/* Search reads as a button, styled like Share: a bordered pill with "Find" (just the icon on phones). */
.bt-bd-tools .bt-search.bt-search-ic { height: 32px; border: 1px solid #DCD5C4; background: #fff; }
.bt-search-btn { width: auto; height: 30px; padding: 0 12px 0 9px; gap: 6px; display: inline-flex; align-items: center; font: 600 13px / 1 PolymathText, sans-serif; color: var(--ink, #1B1714); }
.bt-search-btn .material-icons-round { font-size: 18px; color: var(--blue, #0160A6); }
.bt-bd-tools .bt-search.bt-search-ic:hover { border-color: #1B1714; }
.bt-bd-tools .bt-search.bt-search-ic.open .bt-search-lbl { display: none; }
.bt-bd-tools .bt-search.bt-search-ic.open .bt-search-btn { padding: 0 4px 0 9px; }
@media (max-width: 640px) {
  .bt-bd-tools .bt-search.bt-search-ic { height: 36px; }
  .bt-search-btn { width: 34px; height: 34px; padding: 0; justify-content: center; }
  .bt-search-lbl { display: none; }
  .bt-search-btn .material-icons-round { font-size: 19px; }
}
/* Search sits with the table: right end of the Map | Table row (county and district pages show that row just for it). */
.bt-vstrip .bt-search.bt-search-ic { margin: 0 0 6px auto; }
.bt-scoped .bt-vstrip:has(.bt-search:not([hidden])) { display: flex; justify-content: flex-end; }
.bt-scoped .bt-vstrip .bt-display { display: none; }
@media (max-width: 640px) {
  .bt-vstrip .bt-search.bt-search-ic.open { flex: 1 1 auto; margin-left: 8px; }
  .bt-vstrip .bt-search.bt-search-ic.open input { width: 100%; }
}
/* Search in the table: just the magnifier, in the empty cell above the place column; it opens into a box. */
.bt-search-lbl { display: none; }
.bt-table tr.bt-grp th:first-child { text-align: left; vertical-align: bottom; padding: 4px 6px 2px; cursor: default; }
.bt-table tr.bt-grp .bt-search.bt-search-ic { height: 32px; margin: 0; }
.bt-table tr.bt-grp .bt-search-btn { width: 30px; height: 30px; padding: 0; justify-content: center; }
.bt-table tr.bt-grp .bt-search.bt-search-ic.open .bt-search-btn { padding: 0; }
.bt-table tr.bt-grp .bt-search.bt-search-ic.open input { width: 150px; }
.bt-vstrip .bt-search-btn { width: 32px; padding: 0; justify-content: center; }
.bt-table tr.bt-grp .bt-search input { font: 400 13.5px / 1 PolymathText, sans-serif; text-transform: none; letter-spacing: 0; }
/* Collapsed until clicked, wherever the search sits. */
.bt-search.bt-search-ic { height: 32px; padding: 0; gap: 0; border: 1px solid #DCD5C4; border-radius: 999px; background: #fff; }
.bt-search.bt-search-ic[hidden] { display: none; }
.bt-search.bt-search-ic input { width: 0; padding: 0; transition: width .2s ease; }
.bt-search.bt-search-ic.open { border-color: #7B7768; }
.bt-search.bt-search-ic.open input { width: 150px; padding-right: 10px; }
.bt-search.bt-search-ic .bt-search-btn { width: 30px; height: 30px; padding: 0; justify-content: center; }
@media (prefers-reduced-motion: reduce) { .bt-search.bt-search-ic input { transition: none; } }
/* Voter lists: Share sits at the right of the section heading. */
/* Each list card's Share sits on its kicker line, top right */
.bt-list-top { display: flex; align-items: center; justify-content: space-between; gap: 12px; min-height: 34px; }
.bt-list-share:empty { display: none; }
/* Grouped table, take 2: spanner headers instead of shading and dividers. Each group's label sits over its
   columns with a thin rule under it; groups are set apart by space; today's value and vs 2022 are bold. */
.bt-table.grouped .sep { border-left: 0; padding-left: 26px; }
.bt-table td.bt-kc, .bt-table tr.total td.bt-kc { background: none; }
.bt-table th.bt-kc { background: none; color: var(--ink, #1B1714); }
.bt-table td.bt-kc { font-weight: 700; color: var(--ink, #1B1714); }
.bt-table tr.total td.bt-kc { background: var(--cream); }
.bt-table tr.bt-grp th { padding: 10px 0 0; border-bottom: 0; text-align: center; }
.bt-table tr.bt-grp th.sep { padding-left: 16px; }
.bt-table tr.bt-grp .bt-grp-l { display: block; padding-bottom: 6px; border-bottom: 1.5px solid #1B1714; margin-right: 4px; }
.bt-table tr.bt-grp th:first-child { border-bottom: 0; }
.bt-table thead tr:last-child th { padding-top: 8px; }

/* Dropdowns, after VoterHub's Early Voting "Showing" menu: a light-blue pill with the pick in bold
   blue and a chevron, opening a white menu with a check on the current pick (ddEnhance). */
.bt-dd-native { position: absolute !important; width: 1px !important; height: 1px !important; padding: 0 !important; margin: -1px !important; overflow: hidden !important; clip: rect(0 0 0 0) !important; border: 0 !important; opacity: 0; pointer-events: none; }
.bt-dd-native ~ .bt-viewby-caret { display: none; }
.bt-dd { display: inline-flex; align-items: center; gap: 4px; height: 36px; padding: 0 8px 0 14px; border-radius: 100px; border: 1px solid #BCD4EA; background: #F3F8FD;
  font: 700 16px / 1 PolymathText, sans-serif; color: var(--blue, #0160A6); cursor: pointer; white-space: nowrap; max-width: 100%; }
/* The label clips long picks with an ellipsis; its line box must clear descenders (g, y, p) or they're cut off. */
.bt-dd .bt-dd-v { overflow: hidden; text-overflow: ellipsis; line-height: 1.35; }
.bt-dd .material-icons-round { font-size: 20px; color: var(--blue, #0160A6); transition: transform .15s; }
.bt-dd[aria-expanded="true"] .material-icons-round { transform: rotate(180deg); }
.bt-dd:hover, .bt-dd[aria-expanded="true"] { border-color: var(--blue, #0160A6); }
.bt-dd:focus-visible { outline: 2px solid var(--blue, #0160A6); outline-offset: 2px; }
.bt-dd:disabled { opacity: .45; cursor: default; border-color: #BCD4EA; }
/* "all voters" (the filters button) matches the pills in the sentence. */
.bt-sentence .bt-pick { height: 36px; padding: 0 8px 0 14px; border-radius: 100px; border: 1px solid #BCD4EA; background: #F3F8FD; font-size: 16px; }
.bt-sentence .bt-pick:hover, .bt-sentence .bt-pick[aria-expanded="true"] { border-color: var(--blue, #0160A6); }
.bt-sentence .bt-pick .material-icons-round { font-size: 20px; margin-right: 0; }
.bt-sentence .bt-pick.previewing { border-style: dashed; }
.bt-sentence { row-gap: 8px; }
/* Smaller pills where the dropdown sits in a toolbar rather than the title sentence. */
.bt-pager .bt-dd, .bt-by .bt-dd { display: inline-flex; height: 30px; padding: 0 6px 0 12px; border: 1px solid #BCD4EA; background: #F3F8FD; color: var(--blue, #0160A6); font-size: 13.5px; }
.bt-pager .bt-dd:hover { border-color: var(--blue, #0160A6); }
.bt-cmp .bt-dd { height: 26px; padding: 0 4px 0 10px; font-size: 13px; }
.bt-cmp .bt-dd .material-icons-round { font-size: 17px; }
.bt-asks-pick .bt-dd { width: 100%; justify-content: space-between; font-size: 14px; }

.bt-dd-menu { position: fixed; z-index: 1000; max-width: calc(100vw - 32px); overflow-y: auto; padding: 6px 0; background: #fff; border-radius: 8px;
  box-shadow: 0 5px 5px -3px rgba(0, 0, 0, .2), 0 8px 10px 1px rgba(0, 0, 0, .14), 0 3px 14px 2px rgba(0, 0, 0, .12); }
.bt-dd-group { padding: 12px 16px 4px; font: 700 11.5px / 1 PolymathText, sans-serif; letter-spacing: .06em; text-transform: uppercase; color: var(--mute, #93908E); }
.bt-dd-group:first-child { padding-top: 8px; }
.bt-dd-opt { display: flex; align-items: center; justify-content: space-between; gap: 16px; width: 100%; min-height: 40px; padding: 8px 16px; border: 0; background: none;
  font: 500 15px / 1.3 PolymathText, sans-serif; color: #1B1714; text-align: left; cursor: pointer; white-space: nowrap; }
.bt-dd-opt:hover, .bt-dd-opt:focus-visible { background: rgba(1, 96, 166, .04); outline: none; }
.bt-dd-opt.on { background: rgba(1, 96, 166, .08); color: var(--blue, #0160A6); font-weight: 700; }
.bt-dd-opt .material-icons-round { font-size: 18px; }
.bt-dd-opt:disabled { opacity: .4; cursor: default; }
@media (max-width: 640px) {
  .bt-dd, .bt-sentence .bt-pick { height: 34px; font-size: 15px; }
  .bt-dd-opt { min-height: 44px; font-size: 15.5px; }
}
/* A vs-year lead's change is as big as a plain lead; the years table's 2026 row is bold */
.bt-map-tip .lead b span, .bt-map-detail .lead b span { font: inherit; }
.bt-map-tip .yrs strong, .bt-map-detail .yrs strong, .bt-row-detail .yrs strong { font-weight: 700; color: var(--ink); }
/* Phones: a key driver's name stays on one line, cut off with "…" when it's long ("Mecklenburg County"),
   and there's no CSV download (a spreadsheet isn't something people open on a phone). */
@media (max-width: 640px) {
  .bt-drivers-list li > b { min-width: 0; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
  #bt-csv { display: none; }
}

/* Voting history: what the groups mean, under the table or map */
.bt-hist-note { margin-top: 14px; }
.bt-hist-note p { display: flex; gap: 8px; align-items: flex-start; margin: 0 0 6px; font: 400 13px / 1.5 PolymathText, sans-serif; color: var(--ink2); }
.bt-hist-note p .material-icons-round { font-size: 17px; line-height: 1.3; color: var(--mute2); flex: none; }
.bt-hist-note p b { font-weight: 700; color: var(--ink); }
.bt-rowdef { display: block; font: 400 12px / 1.3 PolymathText, sans-serif; color: var(--mute); white-space: normal; }
.bt-pager:empty { min-height: 0; }

/* Suggested views: two at a time, under the filters, in the Map/Table row, after a label; More swaps
   in the next two. Phones and narrow screens: their own row above the tabs, wrapping. */
.bt-vstrip .bt-asks { display: flex; flex-wrap: nowrap; align-items: center; gap: 8px; min-width: 0; margin: 0 0 8px auto; padding: 0; border: 0;
  overflow-x: auto; scrollbar-width: none; }
.bt-vstrip .bt-asks::-webkit-scrollbar { display: none; }
.bt-vstrip .bt-asks-l { flex: none; margin-right: 6px; font: 600 12px / 1 PolymathText, sans-serif; letter-spacing: .12em; text-transform: uppercase; color: #6E6A63; white-space: nowrap; }
.bt-vstrip .bt-ask { flex: none; display: inline-block; height: 32px; line-height: 30px; padding: 0 14px; font-size: 14px; white-space: nowrap; }
.bt-vstrip .bt-asks:empty { display: none; }
/* County and district pages hide the Map/Table tabs; the row still shows for the suggestions. */
.bt-scoped .bt-vstrip:has(.bt-ask) { display: flex; }
/* Laptops and tablets: no room beside the tabs, so their own row above them, wrapping (no swiping with a mouse). */
@media (min-width: 641px) and (max-width: 1240px) {
  .bt-vstrip { flex-wrap: wrap; }
  .bt-vstrip .bt-asks { order: -1; flex: 1 1 100%; flex-wrap: wrap; overflow: visible; margin: 4px 0 12px; }
}
@media (max-width: 640px) {
  .bt-vstrip { flex-wrap: wrap; }
  .bt-vstrip .bt-asks { order: -1; flex: 1 1 100%; flex-wrap: wrap; overflow: visible; margin: 4px 0 10px; padding-right: 0; }
  .bt-vstrip .bt-asks-l { font-size: 11px; letter-spacing: .1em; }
  .bt-vstrip .bt-ask { height: 28px; line-height: 26px; padding: 0 11px; font-size: 13px; }
}

/* Report: a button in the Summary header with Download PDF and the pages as images. */
.bt-rep { margin-left: auto; }
.bt-rep[hidden] { display: none; }
.bt-rep-open[aria-busy="true"] { cursor: progress; opacity: .75; }
.bt-rep-menu { width: 240px; }
.bt-rep-item { display: flex; align-items: center; gap: 10px; padding: 9px 10px; border: 0; border-radius: 8px; background: none; cursor: pointer;
  font: 600 14px / 1.2 PolymathText, sans-serif; color: #1B1714; text-align: left; white-space: nowrap; letter-spacing: 0; text-transform: none; }
.bt-rep-item:hover, .bt-rep-item:focus-visible { background: #F4F1EA; outline: none; }
.bt-rep-item .material-icons-round { font-size: 19px !important; color: #484542 !important; }
.bt-rep .bt-share-h { white-space: nowrap; }
@media (max-width: 640px) {
  /* Phones: the update time already sits at the right; the report is an icon beside it. */
  .bt-rep { margin-left: 8px; }
  .bt-rep-open { width: 32px; padding: 0; justify-content: center; }
  .bt-rep-t { display: none; }
  .bt-rep-ready .bt-rep-open { width: auto; padding: 0 12px 0 10px; }
  .bt-rep-ready .bt-rep-t { display: inline; }
  /* County and district pages: the page title already names the place, so the header just says Summary. */
  #bt-summary-label [data-place-name] { display: none; }
}

/* The metric tables on desktop (.bt-3a, Claude Design's "3a"): every row shares one column grid (a
   <colgroup> the table writes), with fixed gutters, an operator column for − and =, and one flexible
   gutter before Registered / Ballots cast so those sit at the card's right edge. Phones keep their
   four columns. */
.bt-table tr.bt-grp th.bt-grp-blank { border-bottom-color: transparent; }
.bt-table th.c-sp, .bt-table td.c-sp { padding: 0; }
@media (max-width: 640px) { .bt-table col { width: auto !important; } }
@media (min-width: 641px) {
  .bt-table.bt-3a { table-layout: fixed; width: 100%; min-width: 0; }
  .bt-table.bt-3a th, .bt-table.bt-3a td { padding: 0 10px 0 0; border-left: 0; }
  .bt-table.bt-3a th:first-child, .bt-table.bt-3a td:first-child { padding-left: 24px; }
  .bt-table.bt-3a td { height: 46px; border-bottom: 0; border-top: 1px solid #EEE8D8; font-size: 14px; color: #484542; }
  .bt-table.bt-3a tbody tr:not(.total):hover td { background: #F7FAFC; }
  .bt-table.bt-3a td:first-child { font-size: 14.5px; font-weight: 600; color: #1B1714; }
  .bt-table.bt-3a tr.total td { background: #F9F3E3; font-weight: 600; }
  .bt-table.bt-3a tr.total td:first-child { font-weight: 700; }
  /* group headers: sentence case, a rule under just that group's columns */
  .bt-table.bt-3a tr.bt-grp th { padding: 12px 10px 0 18px; border-bottom: 0; text-transform: none; letter-spacing: 0; font: 600 12.5px / 1.2 PolymathText, sans-serif; color: #484542; text-align: center; }
  .bt-table.bt-3a tr.bt-grp th:first-child { padding: 4px 6px 2px 24px; text-align: left; }
  .bt-table.bt-3a tr.bt-grp th.g-ch { padding-left: 12px; }
  .bt-table.bt-3a tr.bt-grp .bt-grp-l { display: block; padding-bottom: 6px; border-bottom: 1px solid #CCC6B5; white-space: nowrap; }
  .bt-table.bt-3a tr.bt-grp th.g-key .bt-grp-l { border-bottom: 2px solid var(--blue, #0160A6); }
  .bt-table.bt-3a tr.bt-grp th.g-quiet .bt-grp-l { border-bottom-color: #E0E0E0; color: #93908E; font-weight: 500; }
  .bt-table.bt-3a .g-dem { color: var(--blue, #0160A6); font-weight: 800; }
  .bt-table.bt-3a .g-rep { color: #E43730; font-weight: 800; }
  /* column headers */
  .bt-table.bt-3a thead tr:last-child th { padding: 9px 10px 9px 0; border-bottom: 0; font: 600 12.5px / 1.4 PolymathText, sans-serif; color: #484542; background: #fff; vertical-align: bottom; }
  .bt-table.bt-3a thead tr:last-child th:first-child { padding-left: 24px; }
  .bt-table.bt-3a thead tr:last-child th.c-key1 { color: var(--blue, #0160A6); font-weight: 700; }
  .bt-table.bt-3a thead tr:last-child th.c-dr, .bt-table.bt-3a thead tr:last-child th.c-dpct { color: var(--blue, #0160A6); font-weight: 700; }
  .bt-table.bt-3a thead tr:last-child th.c-rr, .bt-table.bt-3a thead tr:last-child th.c-rpct { color: #E43730; font-weight: 700; }
  .bt-table.bt-3a thead tr:last-child th.c-op { text-align: center; font-size: 16px; font-weight: 500; cursor: default; }
  .bt-table.bt-3a thead tr:last-child th.c-ctx { color: #93908E; font-weight: 500; }
  .bt-table.bt-3a th .srt { opacity: 0; font-size: 12px; vertical-align: -1px; margin: 0 3px 0 0; color: var(--blue, #0160A6); }
  .bt-table.bt-3a th:first-child .srt { margin: 0 0 0 3px; }
  .bt-table.bt-3a th.sorted .srt { opacity: 1; }
  .bt-table.bt-3a th:not(.sorted):hover .srt { opacity: .45; }
  /* cells */
  .bt-table.bt-3a td.c-key1 { font-weight: 700; color: var(--blue, #0160A6); }
  .bt-table.bt-3a td.c-key1.c-rep { color: #E43730; }
  .bt-table.bt-3a td.c-old { color: #787776; }
  .bt-table.bt-3a td.c-ctx { font-size: 13px; color: #787776; }
  .bt-table.bt-3a td.c-vs22 { font-weight: 600; }
  .bt-table.bt-3a td.c-vs18 { font-weight: 400; }
  .bt-table.bt-3a td.c-good { color: #2E7D32; } .bt-table.bt-3a td.c-bad { color: #C62828; }
  .bt-table.bt-3a td.bt-kc { background: #fff; }
  .bt-table.bt-3a tr.total td, .bt-table.bt-3a tr.total td.bt-kc { background: #F9F3E3; }
  .bt-table.bt-3a tbody tr:not(.total):hover td.bt-kc { background: #F7FAFC; }
}
/* Change cells: ▲ / ▼ in their own slot, the number right-aligned in a box as wide as the column's widest. */
.bt-tri { display: inline-block; width: 11px; font-size: 10px; text-align: left; transform: translateY(-1px); }
.bt-chn { display: inline-block; text-align: right; }
@media (max-width: 640px) { .bt-tri { width: 12px; font-size: 9px; } }
.bt-table-foot { padding: 12px 24px 14px; border-top: 1px solid #EEE8D8; font: 400 12.5px / 1.5 PolymathText, sans-serif; color: #787776; text-wrap: pretty; }
.bt-table-foot[hidden] { display: none; }
.bt-sr { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; }

/* Try: two suggestions at a time; More swaps in the next two. */
.bt-asks-more { display: inline-flex; align-items: center; gap: 4px; height: 28px; padding: 0 11px 0 8px; border: 1px dashed #CCC6B5; border-radius: 100px; background: none;
  font: 600 13px / 1 PolymathText, sans-serif; color: var(--blue, #0160A6); cursor: pointer; white-space: nowrap; }
.bt-asks-more .material-icons-round { font-size: 16px; }
.bt-asks-more:hover { border-color: var(--blue, #0160A6); border-style: solid; }
.bt-asks-more:focus-visible { outline: 2px solid var(--blue, #0160A6); outline-offset: 2px; }


/* Suggested views sit with the filters they set: a line of their own in the filter band, under the
   sentence, left-aligned. */
.bt-viewrow { flex-wrap: wrap; }
.bt-viewrow .bt-asks { order: 3; flex: 1 1 100%; display: flex; flex-wrap: wrap; justify-content: flex-start; align-items: center; gap: 8px; margin: 12px 0 0; padding: 0; border: 0; }
.bt-viewrow .bt-asks:empty { display: none; }
.bt-viewrow .bt-asks-l { flex: none; margin-right: 2px; font: 600 12px / 1 PolymathText, sans-serif; letter-spacing: .12em; text-transform: uppercase; color: #6E6A63; white-space: nowrap; }
.bt-viewrow .bt-ask { flex: none; display: inline-block; height: 30px; line-height: 28px; padding: 0 13px; font-size: 13.5px; white-space: nowrap; background: #fff; }
@media (max-width: 640px) { .bt-viewrow .bt-ask { height: 28px; line-height: 26px; padding: 0 11px; font-size: 13px; } }
/* Try these: quiet text links under the filters (not pills), so the dropdowns stay the thing to use. */
.bt-viewrow .bt-asks { gap: 4px 14px; margin-top: 10px; }
.bt-viewrow .bt-asks-l { letter-spacing: 0; text-transform: none; font: 500 13px / 1.3 PolymathText, sans-serif; color: #787776; }
.bt-viewrow .bt-ask { height: auto; line-height: 1.3; padding: 0; border: 0; border-radius: 0; background: none; font-size: 13px; color: #484542; text-decoration: underline; text-decoration-color: #A9C4DD; text-underline-offset: 3px; }
.bt-viewrow .bt-ask b { font-weight: 600; color: var(--blue, #0160A6); }
.bt-viewrow .bt-ask:hover { text-decoration-color: var(--blue, #0160A6); }
.bt-viewrow .bt-asks-more { height: auto; padding: 0; border: 0; font-size: 13px; color: #787776; }
.bt-viewrow .bt-asks-more:hover { color: var(--blue, #0160A6); }

/* Phones: the sentence stays a sentence, its picks as underlined text, so it fits on a line or two. */
@media (max-width: 640px) {
  .bt-viewrow .bt-sentence { display: flex; flex-wrap: wrap; align-items: baseline; gap: 2px 6px; }
  .bt-viewrow .bt-sentence .bt-sw { font: 600 17px / 1.55 PolymathText, sans-serif; }
  .bt-viewrow .bt-sentence > label.bt-viewby, .bt-viewrow .bt-sentence > .bt-cmp-in { display: inline-flex; align-items: baseline; gap: 6px; flex: 0 0 auto; min-width: 0; }
  .bt-viewrow .bt-sentence > .bt-cmp-in[hidden] { display: none; }
  .bt-viewrow .bt-sentence .bt-dd { height: auto; padding: 0; gap: 0; border: 0; border-bottom: 2px solid #9CC3EA; border-radius: 0; background: none; font: 600 17px / 1.4 PolymathText, sans-serif; }
  .bt-viewrow .bt-sentence .bt-dd .material-icons-round { font-size: 18px; }
}

/* What's moving the Dem share (#moving, renderUT in ballot-tracker.js). Desktop and phone
   layouts are both drawn; .ut-dk shows above 720px, .ut-ph at or below. */
.ut { --uk: #1B1714; --ub: #484542; --um: #787776; --uf: #93908E; --ur: #EEE8D8; --ue: #E7DFCB; --ue2: #CCC6B5; --usoft: #EAF2FB; --utrack: #F6F2E8;
  padding: 28px 32px 26px; display: flex; flex-direction: column; gap: 24px; font-variant-numeric: tabular-nums; }
.ut .ut-ph { display: none; }
.ut b { font-weight: inherit; }
.ut small { font-size: inherit; }
.ut-head { display: flex; align-items: center; gap: 16px; flex-wrap: wrap; }
.ut-head .ut-title { margin: 0; }
.ut-cmp { margin-left: auto; display: flex; align-items: center; gap: 10px; }
.ut-cmp-l { font: 500 13px / 1 PolymathText, sans-serif; color: var(--ub); }
.ut-yr { display: inline-flex; gap: 2px; border: 1px solid var(--blue); border-radius: 100px; padding: 3px; }
.ut-yr button { height: 30px; padding: 0 15px; border: 0; border-radius: 100px; background: transparent; color: var(--blue); font: 600 13px / 1 PolymathText, sans-serif; cursor: pointer; }
.ut-yr button[aria-pressed="true"] { background: var(--blue); color: #fff; }
.ut-yr button:disabled { opacity: .4; cursor: default; }
.ut-yr button:focus-visible, .ut-cell:focus-visible, .ut-back:focus-visible, .ut-fl:focus-visible, .ut-cl2:focus-visible, .ut-tabs button:focus-visible, .ut-sibt tr[data-ut-f]:focus-visible { outline: 2px solid var(--blue); outline-offset: 2px; }
.ut-eb { font: 700 12.5px / 1.2 PolymathDisp, serif; letter-spacing: 1.4px; text-transform: uppercase; color: var(--blue); }

/* 1 · Share of ballots */
.ut-s1 { display: flex; flex-direction: column; gap: 12px; }
.ut-bar { display: flex; align-items: center; height: 58px; gap: 3px; }
.ut-seg { flex: none; height: 40px; display: flex; align-items: center; gap: 8px; box-sizing: border-box; min-width: 0; overflow: hidden; white-space: nowrap; }
.ut-seg b { font: 700 12px / 1 PolymathText, sans-serif; }
.ut-seg i { font: 800 20px / 1 PolymathDisp, serif; font-style: normal; }
.ut-seg.d { height: 58px; border-radius: 8px 4px 4px 8px; background: var(--blue); color: #fff; padding-left: 16px; box-shadow: 0 6px 16px rgba(1, 96, 166, .32); position: relative; z-index: 1; }
.ut-seg.u { background: #C9B6EC; color: #3D2A66; padding-left: 14px; }
.ut-seg.u i { font: 700 17px / 1 PolymathText, sans-serif; }
.ut-seg.o { background: #B5AE9C; }
.ut-seg.r { background: #E43730; color: #fff; justify-content: flex-end; padding-right: 14px; border-radius: 0 8px 8px 0; }
.ut-seg.sm b, .ut-seg.sm i { display: none; }

/* What moved DEM share */
.ut-panel { position: relative; margin-top: -12px; background: var(--usoft); border-radius: 12px; padding: 18px 22px 4px; }
.ut-panel::before { content: ""; position: absolute; top: -9px; left: var(--ptr, 20%); width: 18px; height: 18px; margin-left: -9px; background: var(--usoft); transform: rotate(45deg); border-radius: 3px; }
.ut-panel > .ut-eb { position: relative; }
.ut-eq { display: grid; grid-template-columns: 200px repeat(3, minmax(0, 1fr)) 64px repeat(3, minmax(0, 1fr)); align-items: end; padding: 14px 0 16px; }
.ut-tot { align-self: start; display: grid; grid-template-columns: auto 1fr; gap: 6px 8px; padding-bottom: 10px; }
.ut-tot > span { font: 600 14px / 1 PolymathText, sans-serif; color: var(--ub); }
.ut-tot > span b, .ut-part > b { font: 800 26px / 1 PolymathDisp, serif; margin-right: 2px; }
.ut-tot small { grid-column: 1; font: 400 12px / 1 PolymathText, sans-serif; color: var(--um); }
.ut-tot em { grid-column: 2; grid-row: 1; justify-self: end; padding-right: 16px; font: 700 20px / 26px PolymathText, sans-serif; font-style: normal; color: var(--uf); }
.ut-part { align-self: start; grid-column: span 3; display: flex; align-items: baseline; gap: 8px; flex-wrap: wrap; padding: 0 0 10px 12px; border-bottom: 2px solid var(--uk); font: 600 14px / 1 PolymathText, sans-serif; color: var(--ub); }
.ut-part strong { font-weight: 600; color: var(--uk); }
.ut-part small { font: 400 12px / 1 PolymathText, sans-serif; color: var(--um); }
.ut-op { align-self: start; text-align: center; font: 700 20px / 26px PolymathText, sans-serif; color: var(--uf); }
.ut-th { text-align: right; padding: 10px 0 6px; font: 600 11.5px / 1.2 PolymathText, sans-serif; color: var(--uf); }
.ut-pn { display: flex; align-items: center; gap: 8px; height: 38px; padding-left: 6px; border-top: 1px solid var(--ur); font: 500 14px / 1 PolymathText, sans-serif; }
.ut-pn.dem { font-weight: 700; }
.ut-chip { width: 10px; height: 10px; border-radius: 3px; flex: none; }
.ut-chip.dem { background: #0160A6; } .ut-chip.rep { background: #E43730; } .ut-chip.una { background: #9C6ADE; }
.ut-eq .ut-n { text-align: right; border-top: 1px solid var(--ur); font: 600 14px / 38px PolymathText, sans-serif; }
.ut-n.ut-m0, .ut .ut-m0 { font-weight: 400; color: var(--um); }
.ut-eq .ut-chg { font-weight: 700; }
.ut-div { height: 38px; background: linear-gradient(var(--ue2), var(--ue2)) center / 1px 100% no-repeat; }

/* 2 · Groups */
.ut-s2 { display: flex; flex-direction: column; gap: 18px; padding-top: 30px; }
.ut-s2h { position: relative; display: flex; align-items: center; gap: 10px; width: calc(286px + (100% - 308px) * 0.75); }
.ut-s2h .ut-eb { flex: none; }
.ut-arrow { flex: 1; height: 3px; position: relative; margin-left: 4px; }
/* The connector: a line with a rounded elbow from under the turnout part to the heading, a ring where it starts and a chevron head. */
.ut-arrow::after { content: ""; position: absolute; left: 6px; right: 0; bottom: 0; height: 84px; border: solid var(--blue); border-width: 0 3px 3px 0; border-bottom-right-radius: 24px; }
.ut-arrow::before { content: ""; position: absolute; left: 2px; bottom: -5.5px; width: 11px; height: 11px; border: solid var(--blue); border-width: 0 0 3px 3px; transform: rotate(45deg); }
.ut-arrow i { position: absolute; right: -4.5px; bottom: 78px; width: 12px; height: 12px; border-radius: 50%; background: var(--usoft); border: 3px solid var(--blue); box-sizing: border-box; }
.ut-key { margin: 0; font: 400 13px / 1.35 PolymathText, sans-serif; color: var(--ub); }
.ut-key b { font-weight: 700; color: var(--uk); }
.ut-grey { color: var(--uf); font-weight: 500; }
.ut-grid { display: grid; grid-template-columns: 160px repeat(4, minmax(0, 1fr)); gap: 6px; }
.ut-fl { display: flex; flex-direction: column; justify-content: center; align-items: flex-start; gap: 5px; padding: 0; border: 0; background: none; text-align: left; cursor: pointer; font: 700 13px / 1.2 PolymathDisp, serif; letter-spacing: 1.3px; text-transform: uppercase; color: var(--ub); }
.ut-fl:hover span { text-decoration: underline; }
.ut-cell { height: 52px; border: 1px solid var(--ue); border-radius: 8px; background: #fff; display: flex; align-items: center; gap: 10px; padding: 0 14px; text-align: left; cursor: pointer; font-family: inherit; color: var(--uk); min-width: 0; }
.ut-cell:hover:not(:disabled) { border-color: var(--uk); }
.ut-cell:disabled { cursor: default; opacity: .55; }
.ut-cl { flex: 1; display: flex; align-items: center; gap: 7px; min-width: 0; font: 600 14px / 1 PolymathText, sans-serif; white-space: nowrap; overflow: hidden; }
.ut-cell > b, .ut-cv b { font: 800 18px / 1 PolymathDisp, serif; }
.ut-cell > small { width: 34px; text-align: right; font: 500 12px / 1 PolymathText, sans-serif; color: var(--uf); }
.ut-dot { width: 8px; height: 8px; border-radius: 8px; background: var(--uk); flex: none; display: inline-block; }
.h-g2 { background: #DDEFDE !important; border-color: #9FCFA3 !important; } .h-g2 > b, .h-g2 .ut-cv b, em.h-g2 { color: #1F6B24; }
.h-g1 { background: #EFF7EF !important; border-color: #CFE8D1 !important; } .h-g1 > b, .h-g1 .ut-cv b, em.h-g1 { color: #2E7D32; }
.h-g0, .h-na { background: #fff; border-color: var(--ue); } .h-g0 > b, .h-g0 .ut-cv b, .h-na > b { color: var(--um); }
.h-b1 { background: #FCEDEC !important; border-color: #F4C7C3 !important; } .h-b1 > b, .h-b1 .ut-cv b, em.h-b1 { color: #C62828; }
.h-b2 { background: #F9DCD9 !important; border-color: #EBA39C !important; } .h-b2 > b, .h-b2 .ut-cv b, em.h-b2 { color: #A61F1F; }
.ut-cell:hover:not(:disabled) { border-color: var(--uk) !important; }
.ut-legend { display: flex; flex-wrap: wrap; gap: 8px 14px; align-items: center; font: 400 12px / 1 PolymathText, sans-serif; color: var(--um); }
.ut-legend > span { display: flex; align-items: center; gap: 6px; }
.ut-legend i:not(.ut-dot) { width: 14px; height: 14px; border-radius: 4px; border: 1px solid; }

/* 2b · Group detail */
.ut-detail { display: flex; flex-direction: column; gap: 20px; }
.ut-back { align-self: flex-start; height: 34px; padding: 0 14px; border-radius: 100px; border: 1px solid var(--blue); background: #fff; color: var(--blue); font: 600 13px / 1 PolymathText, sans-serif; cursor: pointer; }
.ut-sl { font: 600 10.5px / 1.2 PolymathText, sans-serif; letter-spacing: .6px; text-transform: uppercase; color: var(--uf); }
.ut .ut-q { opacity: .72; }
.ut-lead { margin: 0; font: 700 20px / 1.3 PolymathText, sans-serif; text-wrap: pretty; }

@media (max-width: 720px) {
  .ut .ut-dk { display: none; }
  .ut .ut-ph { display: revert; }
  .ut { padding: 18px 16px 20px; gap: 18px; }
  .ut-head { flex-direction: column; align-items: stretch; gap: 10px; }
  .ut-cmp { margin-left: 0; justify-content: space-between; }
  .ut-yr { padding: 2px; } .ut-yr button { height: 28px; padding: 0 12px; font-size: 12px; }
  .ut-eb { font-size: 11px; letter-spacing: 1.2px; line-height: 1.3; }
  .ut-s1 { gap: 10px; }
  .ut-bar { height: 48px; gap: 2px; }
  .ut-seg { height: 34px; gap: 4px; }
  .ut-seg.d { height: 48px; flex-direction: column; justify-content: center; align-items: flex-start; gap: 3px; padding-left: 10px; border-radius: 7px 3px 3px 7px; box-shadow: 0 4px 12px rgba(1, 96, 166, .3); }
  .ut-seg.d b { font-size: 10px; } .ut-seg.d i { font-size: 17px; }
  .ut-seg.u, .ut-seg.r { font-size: 12.5px; } .ut-seg.u { padding-left: 8px; } .ut-seg.r { padding-right: 8px; border-radius: 0 7px 7px 0; }
  .ut-seg.u b, .ut-seg.r b { font-size: 9.5px; } .ut-seg.u i, .ut-seg.r i { font: 700 12.5px / 1 PolymathText, sans-serif; }
  .ut-panel { margin-top: 0; padding: 14px 14px 6px; }
  .ut-panel::before { display: none; }
  .ut-ph.ut-panel > div, .ut-panel > .ut-ph { display: flex; flex-direction: column; gap: 10px; margin-top: 10px; }
  .ut-eqm { display: grid; grid-template-columns: auto auto minmax(0, 1fr) auto minmax(0, 1fr); gap: 6px; align-items: center; }
  .ut-eqm > span { display: flex; flex-direction: column; gap: 3px; align-items: center; }
  .ut-eqm > span:first-child { align-items: flex-start; }
  .ut-eqm b { font: 800 18px / 1 PolymathDisp, serif; } .ut-eqm > span:first-child b { font-size: 22px; }
  .ut-eqm small { font: 400 10.5px / 1 PolymathText, sans-serif; color: var(--um); }
  .ut-eqm em { font: 700 16px / 1 PolymathText, sans-serif; font-style: normal; color: var(--uf); }
  .ut-tm { display: grid; grid-template-columns: 52px repeat(2, minmax(0, 1fr)) 8px repeat(2, minmax(0, 1fr)); align-items: center; }
  .ut-tmh { grid-column: span 2; font: 600 10.5px / 1 PolymathText, sans-serif; color: var(--ub); padding-bottom: 5px; border-bottom: 1.5px solid var(--uk); }
  .ut-tm .ut-pn { height: 34px; gap: 5px; padding-left: 0; border-top: 0; border-bottom: 1px solid rgba(27, 23, 20, .08); font-size: 12.5px; }
  .ut-tm .ut-chip { width: 8px; height: 8px; border-radius: 2px; }
  .ut-tm .ut-n { text-align: right; font: 600 12.5px / 34px PolymathText, sans-serif; border-bottom: 1px solid rgba(27, 23, 20, .08); white-space: nowrap; }
  .ut-tm .ut-chg { font-size: 11px; font-weight: 700; }
  .ut-tm > span:empty { align-self: stretch; }
  .ut-s2 { gap: 12px; padding-top: 4px; }
  .ut-s2h { width: auto; }
  .ut-arrow { display: none; }
  .ut-key { font-size: 12px; }
  .ut-gridm { display: flex !important; flex-direction: column; gap: 14px; }
  .ut-legend { gap: 6px 12px; font-size: 11px; } .ut-legend i:not(.ut-dot) { width: 11px; height: 11px; border-radius: 3px; }
  .ut-detail { gap: 14px; }
  .ut-back { height: 32px; padding: 0 12px; font-size: 12.5px; }
  .ut-lead { font-size: 16px; }
}

/* Continuous heat-grid shading (utTint): the fill comes inline; these set the number's color. */
.ut-cell.t-0 > b, .ut-cell.t-0 .ut-cv b { color: var(--um); }
.ut-cell.t-g > b, .ut-cell.t-g .ut-cv b { color: #2E7D32; } .ut-cell.t-g2 > b, .ut-cell.t-g2 .ut-cv b { color: #1F6B24; }
.ut-cell.t-b > b, .ut-cell.t-b .ut-cv b { color: #C62828; } .ut-cell.t-b2 > b, .ut-cell.t-b2 .ut-cv b { color: #A61F1F; }
.ut-ramp { display: inline-flex; align-items: center; gap: 8px; }
.ut-legend i.ut-grad { display: inline-flex; align-items: center; justify-content: center; width: 140px !important; height: 18px !important; flex: none; border-radius: 5px; border: 1px solid #E7DFCB;
  background: linear-gradient(90deg, rgb(246,200,195), rgb(252,238,236) 32%, #fff 50%, rgb(236,246,237) 68%, rgb(198,230,201)); }
/* All Democrats' growth sits in the white middle of the ramp. */
.ut-legend i.ut-grad b { font: 600 12px / 1 PolymathText, sans-serif; font-style: normal; color: #484542; white-space: nowrap; }
@media (max-width: 720px) { .ut-legend i.ut-grad { width: 120px !important; height: 18px !important; } .ut-legend i.ut-grad b { font-size: 11px; font-weight: 600; } }
.ut-sibt { width: 100%; border-collapse: separate; border-spacing: 0; font: 400 14px / 1 PolymathText, sans-serif; font-variant-numeric: tabular-nums; margin-bottom: 8px; }
.ut-sibt th, .ut-sibt td { padding: 9px 12px; text-align: right; border-top: 1px solid #EEE8D8; white-space: nowrap; }
.ut-sibt thead th { border-top: 0; font: 600 11.5px / 1.2 PolymathText, sans-serif; color: #93908E; padding-bottom: 6px; }
.ut-sibt th:first-child { text-align: left; } .ut-sibt thead th:first-child { text-transform: uppercase; letter-spacing: 1px; font-weight: 700; }
.ut-sibt tbody th { font-weight: 600; color: #1B1714; }
.ut-sibt td.b { font-weight: 700; } .ut-sibt td b { font-weight: 700; }
.ut-sibt td.ut-cc { border-radius: 6px; border: 1px solid transparent; }
.ut-sibt td.ut-cc.t-0 b { color: #787776; } .ut-sibt td.ut-cc.t-g b { color: #2E7D32; } .ut-sibt td.ut-cc.t-g2 b { color: #1F6B24; } .ut-sibt td.ut-cc.t-b b { color: #C62828; } .ut-sibt td.ut-cc.t-b2 b { color: #A61F1F; }
.ut-sibt .ut-q b { opacity: .8; font-weight: 600; }
.ut-sibt tr[data-ut-f] { cursor: pointer; } .ut-sibt tr[data-ut-f]:hover th, .ut-sibt tr[data-ut-f]:focus-visible th { color: #0160A6; text-decoration: underline; }
.ut-sibt tr.on th, .ut-sibt tr.on td:not(.ut-cc) { background: #EAF2FB; } .ut-sibt tr.on th { box-shadow: inset 3px 0 0 #0160A6; }
.ut-sibt tr.off { opacity: .55; }
.ut-sibt tr.tot th, .ut-sibt tr.tot td { background: #F9F3E3; border-top: 1px solid #CCC6B5; }
@media (max-width: 640px) { .ut-sibt th, .ut-sibt td { padding: 9px 6px; } .ut-sibt { font-size: 13.5px; } }

/* Headings: the section reads as three steps (share of ballots, what moved it, which groups). */
/* The two report card findings (Dem share, Unaffiliated turnout) in the display face, so they
   outrank the line under them and the heatgrid heading. */
.bt-chart-title.bt-sec-h.ut-title { font: 800 30px / 1.15 PolymathDisp, sans-serif; letter-spacing: 0; }
/* Tablets: smaller, so the Compare-to toggle and Share button stay on the title's line. */
@media (min-width: 721px) and (max-width: 1000px) { .bt-chart-title.bt-sec-h.ut-title { font-size: 24px; } }
@media (min-width: 721px) and (max-width: 860px) { .bt-chart-title.bt-sec-h.ut-title { font-size: 22px; } }
.ut-h { margin: 0; font: 700 18px / 1.25 PolymathText, sans-serif; color: var(--uk, #1B1714); }
.ut-h2 { font-size: 16px; }
.ut-key { font-size: 14px; }

/* Factor table and group view */
.ut-crumb { display: flex; align-items: center; flex-wrap: wrap; gap: 8px; font: 600 14px / 1 PolymathText, sans-serif; color: #1B1714; }
.ut-cs { color: #CCC6B5; }
.ut-cl2 { border: 0; background: none; padding: 4px 2px; font: inherit; color: #0160A6; cursor: pointer; }
.ut-cl2:hover { text-decoration: underline; }
.ut-fname { margin: 4px 0 0; font: 800 32px / 1 PolymathDisp, serif; color: #1B1714; }
.ut-sibt { font-size: 15px; }
.ut-sibt th, .ut-sibt td { padding: 11px 14px; }
.ut-sibt thead th { font-size: 12px; }
.ut-sibt th.ut-q { opacity: .72; }
.ut-go { margin-left: 6px; color: #0160A6; }
.ut-sibt tbody th .ut-dot { margin-left: 7px; vertical-align: 1px; }
.ut-card { border: 1.5px solid #E7DFCB; border-radius: 16px; overflow: hidden; box-shadow: rgba(12, 12, 13, .04) 0 1px 2px, rgba(12, 12, 13, .05) 0 6px 18px; }
.ut-band { background: #EAF2FB; border-bottom: 1px solid #CFE1F4; padding: 20px 24px; display: flex; align-items: center; flex-wrap: wrap; gap: 16px 28px; }
.ut-bn { display: flex; flex-direction: column; gap: 6px; }
.ut-bn > b { font: 800 34px / 1 PolymathDisp, serif; color: #1B1714; }
.ut-bn > span { font: 400 14px / 1 PolymathText, sans-serif; color: #484542; } .ut-bn strong { font-weight: 700; color: #1B1714; }
.ut-kcs { display: flex; flex-wrap: wrap; gap: 10px; margin-left: auto; }
.ut-kc { background: #fff; border-radius: 10px; padding: 11px 16px; display: grid; grid-template-columns: auto auto; align-items: baseline; gap: 6px 12px; }
.ut-kc .ut-sl { grid-column: 1 / -1; }
.ut-kc > b { font: 700 22px / 1 PolymathText, sans-serif; color: #1B1714; } .ut-kc > b.c-bad { color: #C62828; } .ut-kc > b.c-good { color: #2E7D32; }
.ut-kc small { font: 400 13px / 1 PolymathText, sans-serif; color: #787776; }
.ut-cb { padding: 22px 24px 18px; display: flex; flex-direction: column; gap: 16px; }
.ut-cb .ut-lead { font-size: 21px; }
.ut-tabs { display: flex; gap: 4px; border-bottom: 1px solid #EEE8D8; overflow-x: auto; scrollbar-width: none; }
.ut-tabs button { flex: none; display: flex; flex-direction: column; align-items: flex-start; gap: 4px; padding: 8px 16px 10px; border: 0; border-bottom: 3px solid transparent; margin-bottom: -1px; background: none; cursor: pointer; font: 600 15px / 1.1 PolymathText, sans-serif; color: #484542; }
.ut-tabs button small { font: 600 12px / 1 PolymathText, sans-serif; color: #C62828; }
.ut-tabs button[aria-selected="true"] { color: #0160A6; border-bottom-color: #0160A6; }
.ut-tabs button:hover { color: #0160A6; }
.ut-bt { margin: 0; }
.ut-sibt tr.lag th, .ut-sibt tr.lag td:not(.ut-cc) { background: #FCEDEC; } .ut-sibt tr.lag th { font-weight: 800; box-shadow: inset 3px 0 0 #C62828; }
@media (max-width: 720px) {
  .bt-chart-title.bt-sec-h.ut-title { font-size: 23px; }
  .ut-h { font-size: 16px; } .ut-h2 { font-size: 14.5px; }
  .ut-key { font-size: 12.5px; }
  .ut-fname { font-size: 26px; }
  .ut-sibt { font-size: 13.5px; } .ut-sibt th, .ut-sibt td { padding: 10px 6px; } .ut-sibt thead th { font-size: 11px; white-space: normal; }
  .ut-sibt .ut-hp { display: none; }
  .ut-band { padding: 14px; gap: 12px; }
  .ut-bn { flex-direction: row; align-items: baseline; justify-content: space-between; width: 100%; } .ut-bn > b { font-size: 26px; }
  .ut-kcs { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 6px; width: 100%; margin: 0; }
  .ut-kc { padding: 9px 10px; grid-template-columns: 1fr; gap: 4px; }
  .ut-kc .ut-sl { font-size: 9.5px; } .ut-kc > b { font-size: 17px; } .ut-kc small { font-size: 11px; }
  .ut-cb { padding: 14px 12px 12px; gap: 12px; }
  .ut-cb .ut-lead { font-size: 16.5px; }
  .ut-tabs button { padding: 8px 10px 9px; font-size: 13.5px; } .ut-tabs button small { font-size: 11px; }
}
.ut-nw { white-space: nowrap; }

/* Phones: party bar labels stack; the equation is three even columns; the factor grid is a card per factor. */
@media (max-width: 720px) {
  .ut-seg.u, .ut-seg.r { flex-direction: column; justify-content: center; align-items: flex-start; gap: 2px; }
  .ut-seg.r { align-items: flex-end; }
  .ut-seg.u b, .ut-seg.r b { font-size: 9px; } .ut-seg.u i, .ut-seg.r i { font-size: 12.5px; }
  .ut-eqm { grid-template-columns: minmax(0, 1fr) 14px minmax(0, 1fr) 14px minmax(0, 1fr); gap: 0; align-items: start; }
  .ut-eqm > span, .ut-eqm > span:first-child { align-items: center; text-align: center; gap: 4px; }
  .ut-eqm b, .ut-eqm > span:first-child b { font: 800 20px / 22px PolymathDisp, serif; white-space: nowrap; }
  .ut-eqm em { font: 700 16px / 22px PolymathText, sans-serif; text-align: center; }
  .ut-eqm small { font-size: 11px; }
  .ut-tmh { text-align: center; }
  .ut-gridm { gap: 10px; }
  .ut-fcard { display: flex; flex-direction: column; border: 1px solid #E7DFCB; border-radius: 12px; background: #fff; padding: 10px 12px 4px; }
  .ut-fcard:nth-child(odd) { background: #FBF8F1; }
  .ut-gridm .ut-fl { flex-direction: row; justify-content: space-between; align-items: baseline; width: 100%; padding: 2px 0 6px; font-size: 12px; letter-spacing: 1.2px; color: #1B1714; }
  .ut-prow { display: flex; align-items: center; gap: 10px; width: 100%; height: 40px; padding: 0; border: 0; border-top: 1px solid #EEE8D8; background: none; cursor: pointer; font-family: inherit; color: #1B1714; text-align: left; }
  .ut-prow:disabled { opacity: .55; cursor: default; }
  .ut-prow .ut-cl { font-size: 14px; }
  .ut-prow small { font: 500 12px / 1 PolymathText, sans-serif; color: #93908E; }
  .ut-pill { min-width: 52px; padding: 5px 8px; border-radius: 6px; border: 1px solid transparent; text-align: right; font: 800 15px / 1 PolymathDisp, serif; }
  .ut-pill.t-0 { color: #787776; } .ut-pill.t-g { color: #2E7D32; } .ut-pill.t-g2 { color: #1F6B24; } .ut-pill.t-b { color: #C62828; } .ut-pill.t-b2 { color: #A61F1F; }
  .ut-prow .ut-dot { width: 7px; height: 7px; }
  .ut-pgo { width: 14px; margin-left: -2px; font: 500 30px / 1 PolymathText, sans-serif; color: #0160A6; text-align: right; }
}

/* Group band: name, factor and share on one line; the three comparisons as strips beneath. */
.ut-band { flex-direction: column; align-items: flex-start; gap: 14px; }
.ut-bn { flex-direction: row; align-items: baseline; flex-wrap: wrap; gap: 6px 14px; }
.ut-kcs { margin-left: 0; gap: 8px; }
.ut-kc { display: flex; align-items: baseline; gap: 10px; padding: 10px 14px; }
.ut-kc > b { font-size: 19px; }
@media (max-width: 720px) {
  .ut-bn { width: auto; justify-content: flex-start; gap: 4px 10px; }
  .ut-kcs { display: flex; flex-direction: column; width: 100%; gap: 6px; }
  .ut-kc { padding: 8px 12px; gap: 8px; }
  .ut-kc .ut-sl { flex: 1; font-size: 10px; } .ut-kc > b { font-size: 16px; } .ut-kc small { font-size: 11.5px; }
}
/* Labels over the two halves of the "What moved" table: what each one measures. */
.ut-tg { grid-column: span 3; padding: 8px 0 0 12px; font: 700 12.5px / 1.2 PolymathText, sans-serif; color: #1B1714; }
/* Desktop: the top of the section (party bar and "What moved") uses the room it has. */
@media (min-width: 721px) {
  .ut-bar { height: 64px; } .ut-seg { height: 46px; } .ut-seg.d { height: 64px; }
  .ut-seg b { font-size: 14px; } .ut-seg i { font-size: 24px; } .ut-seg.u i { font-size: 20px; }
  .ut-h2 { font-size: 18px; }
  .ut-eq { grid-template-columns: 230px repeat(3, minmax(0, 1fr)) 64px repeat(3, minmax(0, 1fr)); }
  .ut-tot > span, .ut-part { font-size: 16px; }
  .ut-tot > span b, .ut-part > b { font-size: 32px; }
  .ut-tot small { font-size: 13.5px; }
  .ut-tot em, .ut-op { font-size: 24px; line-height: 32px; }
  .ut-tg { font-size: 14.5px; padding-top: 12px; }
  .ut-th { font-size: 13px; }
  .ut-pn { height: 46px; font-size: 16px; } .ut-chip { width: 11px; height: 11px; }
  .ut-eq .ut-n { font-size: 16px; line-height: 46px; }
  .ut-div { height: 46px; }
}

/* Group drill-down v2: sibling tabs joined to the card, a band with the gap in ballots, the segments
   furthest behind, and the factor breakdown on request. */
.ut-sibs2 { display: flex; align-items: flex-end; gap: 6px; margin: 4px 0 -16px; padding-left: 2px; position: relative; z-index: 1; overflow-x: auto; scrollbar-width: none; }
.ut-sibs2 > .ut-sl { align-self: center; margin-right: 8px; font-size: 11px; color: #787776; }
.ut-sb { flex: none; height: 42px; display: inline-flex; align-items: center; gap: 10px; padding: 0 18px; border: 1px solid #EEE8D8; border-bottom: 0; border-radius: 10px 10px 0 0; background: #F9F7F2; cursor: pointer; font: 500 15px / 1 PolymathText, sans-serif; color: #1B1714; }
.ut-sb b { font: 800 15px / 1 PolymathDisp, serif; }
.ut-sb b.t-0 { color: #787776; } .ut-sb b.t-g { color: #2E7D32; } .ut-sb b.t-g2 { color: #1F6B24; } .ut-sb b.t-b { color: #C62828; } .ut-sb b.t-b2 { color: #A61F1F; }
.ut-sb.on { height: 50px; background: #EAF2FB; border: 1.5px solid #E7DFCB; border-bottom: 0; margin-bottom: -1.5px; font-weight: 700; cursor: default; }
.ut-sb:not(.on):not(:disabled):hover { background: #fff; }
.ut-sb:disabled { opacity: .55; cursor: default; }
.ut-band2 { background: #EAF2FB; border-bottom: 1px solid #CFE1F4; padding: 20px 24px; display: flex; align-items: center; gap: 20px; }
.ut-bl { flex: 1; display: flex; flex-direction: column; gap: 10px; min-width: 0; }
.ut-gaph { display: flex; align-items: baseline; justify-content: space-between; flex-wrap: wrap; gap: 8px 16px; }
.ut-gaph h4 { margin: 0; font: 800 22px / 1.1 PolymathDisp, serif; color: #1B1714; }
.ut-maplink { border: 0; background: none; padding: 4px 0; cursor: pointer; font: 600 14px / 1 PolymathText, sans-serif; color: #0160A6; }
.ut-maplink:hover { text-decoration: underline; }
.ut-gaps { margin: -8px 0 0; font: 400 13.5px / 1.3 PolymathText, sans-serif; color: #787776; }
.ut-segs { display: flex; flex-direction: column; }
.ut-seg2 { display: grid; grid-template-columns: 28px minmax(0, 2fr) repeat(3, minmax(0, 1fr)); align-items: center; column-gap: 16px; padding: 14px 0; border-top: 1px solid #EEE8D8; }
.ut-rk2 { width: 24px; height: 24px; border-radius: 50%; background: #0160A6; color: #fff; display: inline-flex; align-items: center; justify-content: center; font: 800 12px / 1 PolymathText, sans-serif; }
.ut-sgn { display: flex; flex-direction: column; gap: 5px; min-width: 0; }
.ut-sgn b { font: 700 16px / 1.2 PolymathText, sans-serif; color: #1B1714; }
.ut-sgn small { font: 400 12.5px / 1 PolymathText, sans-serif; color: #787776; }
.ut-sgv { display: flex; flex-direction: column; align-items: flex-end; gap: 5px; }
.ut-sgv .ut-sl { white-space: nowrap; }
.ut-sgv b { font: 700 16px / 1 PolymathText, sans-serif; color: #1B1714; } .ut-sgv b.c-bad { color: #C62828; }
.ut-sgv b.ut-bs { font: 800 20px / 1 PolymathDisp, serif; color: #C62828; }
.ut-more { display: flex; align-items: center; gap: 14px; width: 100%; border: 0; background: none; padding: 6px 0; cursor: pointer; font: 600 13.5px / 1 PolymathText, sans-serif; color: #0160A6; }
.ut-more::before, .ut-more::after { content: ""; flex: 1; height: 1px; background: #E7DFCB; }
.ut-more:focus-visible, .ut-maplink:focus-visible, .ut-sb:focus-visible { outline: 2px solid #0160A6; outline-offset: 2px; }
@media (max-width: 720px) {
  .ut-sibs2 { margin-bottom: -12px; } .ut-sibs2 > .ut-sl { display: none; }
  .ut-sb { height: 38px; padding: 0 12px; gap: 7px; font-size: 13.5px; } .ut-sb.on { height: 44px; } .ut-sb b { font-size: 13.5px; }
  .ut-band2 { flex-direction: column; align-items: stretch; padding: 14px; gap: 12px; }
  .ut-gaph h4 { font-size: 18px; } .ut-maplink { font-size: 13px; }
  .ut-gaps { font-size: 12.5px; }
  .ut-seg2 { grid-template-columns: 24px repeat(3, minmax(0, 1fr)); row-gap: 10px; column-gap: 8px; padding: 12px 0; }
  .ut-seg2 .ut-sgn { grid-column: 2 / -1; }
  .ut-seg2 .ut-sgv { grid-row: 2; align-items: flex-start; } .ut-seg2 .ut-sgv:nth-child(3) { grid-column: 2; } .ut-seg2 .ut-sgv:nth-child(4) { grid-column: 3; } .ut-seg2 .ut-sgv:nth-child(5) { grid-column: 4; }
  .ut-rk2 { width: 22px; height: 22px; font-size: 11px; }
  .ut-sgn b { font-size: 14.5px; } .ut-sgn small { font-size: 11.5px; }
  .ut-sgv b { font-size: 14.5px; } .ut-sgv b.ut-bs { font-size: 17px; }
}
@media (max-width: 720px) { .ut-sgv .ut-sl { white-space: normal; } }
/* The open group as a small pill before each segment, so the row reads "26–40 · Black · Infrequent voters". */
.ut-gp { display: inline-block; vertical-align: 2px; margin-right: 8px; padding: 3px 8px; border-radius: 100px; background: #EAF2FB; color: #0160A6; font: 600 11.5px / 1.2 PolymathText, sans-serif; font-style: normal; white-space: nowrap; }
/* "See all factors": an outlined button on the divider, easy to spot. */
.ut-more span { flex: none; height: 40px; display: inline-flex; align-items: center; padding: 0 20px; border: 1.5px solid #0160A6; border-radius: 100px; background: #fff; font: 700 14px / 1 PolymathText, sans-serif; color: #0160A6; }
.ut-more:hover span { background: #0160A6; color: #fff; }
.ut-more[aria-expanded="true"] span { border-color: #CCC6B5; color: #484542; }

/* Ballots short in the factor table; counts go compact on phones (utCnt). */
.ut-bsc b { font: 800 16px / 1 PolymathDisp, serif; color: #C62828; }
.ut .ut-nm { display: none; }
@media (max-width: 720px) { .ut .ut-nd { display: none; } .ut .ut-nm { display: inline; } .ut-bsc b { font-size: 14.5px; } }

/* Five jump links: on phones (2 columns) the last one spans the row; a hidden section's link is hidden too. */
@media (max-width: 640px) { .bt-jumps .bt-jump:last-child:nth-child(odd) { grid-column: 1 / -1; } }
.bt-jump[hidden] { display: none !important; }

/* Condensed: less air so the share bar, panel and grid fit on one laptop screen. */
.ut-keyrow { display: flex; align-items: center; justify-content: space-between; flex-wrap: wrap; gap: 6px 20px; }
@media (min-width: 721px) {
  .ut { padding: 22px 28px 22px; gap: 14px; }
  .ut-s1 { gap: 8px; }
  .ut-bar { height: 54px; } .ut-seg { height: 40px; } .ut-seg.d { height: 54px; }
  .ut-panel { margin-top: 0; padding: 12px 22px 2px; }   /* clear of the DEM bar; the pointer still reaches up to it */
  .ut-eq { padding: 6px 0 6px; }
  .ut-tot, .ut-part { padding-bottom: 6px; }
  .ut-tg { padding-top: 6px; }
  .ut-th { padding: 4px 0 4px; }
  .ut-pn, .ut-div { height: 38px; } .ut-eq .ut-n { line-height: 38px; }
  .ut-s2 { gap: 12px; padding-top: 16px; }
  .ut-arrow::after { height: 50px; } .ut-arrow i { bottom: 44px; }
  .ut-grid { gap: 5px; } .ut-cell { height: 44px; }
  .ut-fl { gap: 3px; }
}
@media (max-width: 720px) {
  .ut { gap: 14px; }
  .ut-keyrow { gap: 6px 12px; }
  .ut-prow { height: 36px; }
  .ut-fcard { padding: 8px 12px 2px; }
  .ut-gridm { gap: 8px; }
}

/* The move in the section title, underlined in red. */
.ut-tmv { text-decoration: underline; text-decoration-color: #E43730; text-decoration-thickness: 3px; text-underline-offset: 5px; }

/* No panel heading: the room goes back to spacing (desktop). */
@media (min-width: 721px) {
  .ut { gap: 18px; }
  .ut-panel { padding: 18px 22px 6px; }
  .ut-eq { padding: 4px 0 8px; }
  .ut-tg { padding-top: 10px; }
  .ut-pn, .ut-div { height: 42px; } .ut-eq .ut-n { line-height: 42px; }
  .ut-s2 { gap: 14px; padding-top: 22px; }
  .ut-arrow::after { height: 58px; } .ut-arrow i { bottom: 52px; }
  .ut-cell { height: 46px; } .ut-grid { gap: 6px; }
}
/* Party bar values: Polymath Text 700 with a little tracking (the heavy display face crowded "43.8%"). */
.ut-seg i, .ut-seg.u i { font: 700 22px / 1 PolymathText, sans-serif; letter-spacing: .3px; }
.ut-seg b { letter-spacing: .4px; }
@media (max-width: 720px) { .ut-seg.d i { font-size: 18px; } .ut-seg.u i, .ut-seg.r i { font-size: 13.5px; } }
/* Flat party bar: the segments aren't clickable, so DEM isn't raised; the pointer still ties it to the panel. */
.ut-seg.d { box-shadow: none; border-radius: 8px 0 0 8px; }
.ut-seg.r { border-radius: 0 8px 8px 0; }
@media (min-width: 721px) { .ut-bar, .ut-seg, .ut-seg.d { height: 48px; } }
@media (max-width: 720px) { .ut-bar, .ut-seg, .ut-seg.d { height: 44px; } .ut-seg.d { border-radius: 7px 0 0 7px; } .ut-seg.r { border-radius: 0 7px 7px 0; } }

/* Group band: the name and size, then two big numbers (turnout, gain) with all Democrats' small beneath. */
@media (max-width: 720px) {
}

/* The section's Share button sits after the compare toggle. */
.ut-share { display: inline-flex; }
@media (max-width: 720px) { .ut-head { position: relative; } .ut-share { position: absolute; top: -4px; right: 0; } .ut-head .ut-title { padding-right: 46px; } }

/* Factor table ("See all"): a compact table, not stretched across the card; All DEMs first; numbers right-aligned
   in even columns; the share's bar sits beside its number; changes are colored text, the other year grey. */
.ut-fac { max-width: 860px; table-layout: fixed; }
.ut-fac th:first-child { width: 28%; }
.ut-fac thead th { white-space: normal; vertical-align: bottom; }
.ut-sibt td.ut-oy { color: #93908E; font-weight: 400; }
.ut-fac tr.tot th, .ut-fac tr.tot td { border-top: 0; border-bottom: 1.5px solid #CCC6B5; }
.ut-bsc .ut-m0 { color: #CCC6B5; }
/* Factor table, full card width with set columns. */
.ut-fac { max-width: none; }
.ut-fac th:first-child { width: 26%; }
.ut-sibt .ut-oy, .ut-sibt th.ut-q { opacity: 1; }
.ut-sibt thead th.ut-q { color: #B5AFA4; }

/* No share bars: the share is a plain right-aligned number like the rest. */
.ut-fac thead th:nth-child(2) { text-align: right; width: auto; }


/* A factor's plain-language definition under its title (precinct lean, area type). */
.ut-fnote { margin: -4px 0 4px; font: 400 14px / 1.45 PolymathText, sans-serif; color: #484542; max-width: 720px; }
@media (max-width: 720px) { .ut-fnote { font-size: 12.5px; } }

/* The gain's comparison with all Democrats, as a pill: red behind, green ahead, grey on pace. */
.ut-pace.b { background: #FCEDEC; color: #C62828; } .ut-pace.g { background: #EFF7EF; color: #2E7D32; } .ut-pace.n { background: #F6F2E8; color: #787776; }

@media (max-width: 720px) {
}
/* Group band v3: name and share, then three equal stat blocks (label on top, number, DEM comparison). */
.ut-band2 .ut-bl { gap: 14px; }
.ut-stats { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 10px; }
.ut-st2 { background: #fff; border-radius: 12px; padding: 14px 18px; display: flex; flex-direction: column; align-items: flex-start; gap: 7px; }
.ut-st2 .ut-sl { font-size: 11px; color: #787776; }
.ut-st2 b { font: 700 32px / 1 PolymathText, sans-serif; color: #1B1714; white-space: nowrap; }
.ut-st2 b i { font: 600 15px / 1 PolymathText, sans-serif; font-style: normal; color: #484542; }
.ut-st2 b.c-bad { color: #C62828; } .ut-st2 b.c-good { color: #2E7D32; }
.ut-st2 small { font: 400 13px / 1.2 PolymathText, sans-serif; color: #787776; }
.ut-st2 small.ut-pace { padding: 4px 9px; border-radius: 100px; font: 600 12.5px / 1.1 PolymathText, sans-serif; }
@media (max-width: 720px) {
  .ut-stats { gap: 6px; }
  .ut-st2 { padding: 10px 10px; gap: 5px; }
  .ut-st2 .ut-sl { font-size: 9.5px; letter-spacing: .4px; }
  .ut-st2 b { font-size: 20px; } .ut-st2 b i { font-size: 11px; }
  .ut-st2 small { font-size: 11px; } .ut-st2 small.ut-pace { padding: 3px 6px; font-size: 10.5px; white-space: normal; }
}
/* Group band name row (name, then share of DEMs). */
.ut-band2 .ut-bn { display: flex; flex-direction: row; align-items: baseline; flex-wrap: wrap; gap: 6px 14px; }
.ut-band2 .ut-bn > b { font: 800 34px / 1 PolymathDisp, serif; color: #1B1714; }
.ut-band2 .ut-bn > span { font: 400 14px / 1 PolymathText, sans-serif; color: #787776; } .ut-band2 .ut-bn strong { font-weight: 700; color: #1B1714; }
@media (max-width: 720px) { .ut-band2 .ut-bn > b { font-size: 26px; } .ut-band2 .ut-bn > span { font-size: 12.5px; } }

/* Segment ballots short: the text face, like the band's numbers (the display face crowds digits). */
.ut-sgv b.ut-bs { font: 700 20px / 1 PolymathText, sans-serif; }
@media (max-width: 720px) { .ut-sgv b.ut-bs { font-size: 16px; } }
/* Group band v4: no boxes inside the band; three stats in a row split by thin rules. */
.ut-st2 { background: none; border-radius: 0; padding: 2px 22px; border-left: 1px solid #CFE1F4; }
.ut-st2:first-child { padding-left: 0; border-left: 0; }
.ut-stats { gap: 0; margin-top: 4px; }
.ut-band2 .ut-bl { gap: 16px; }
.ut-st2 b { font-size: 34px; }
/* Phones: every sibling tab fits across (label over number), nothing scrolls off; band stats stay three across. */
@media (max-width: 720px) {
  .ut-sibs2 { display: grid; grid-auto-flow: column; grid-auto-columns: minmax(0, 1fr); gap: 4px; overflow: visible; margin-bottom: -12px; }
  .ut-sb, .ut-sb.on { height: auto; min-height: 50px; flex-direction: column; justify-content: center; align-items: center; gap: 3px; padding: 6px 4px; font-size: 13px; text-align: center; }
  .ut-sb.on { min-height: 56px; }
  .ut-sb b { font-size: 13px; }
  .ut-st2 { padding: 2px 10px; }
  .ut-st2 b { font-size: 22px; }
}
.ut-sb b { font: 700 15px / 1 PolymathText, sans-serif; } @media (max-width: 720px) { .ut-sb b { font-size: 13.5px; } }

.ut-st2 small .c-bad { color: #C62828; font-weight: 600; } .ut-st2 small .c-good { color: #2E7D32; font-weight: 600; }
.ut-st2 b.c-bad i { color: #C62828; }

/* Phones: turnout and ballots short only (each sibling tab above shows the growth). */
@media (max-width: 720px) { .ut-st2 b { font-size: 26px; } }

.ut-st2 small.ut-gl b { font: 700 13px / 1 PolymathText, sans-serif; color: #1B1714; } .ut-st2 small.ut-gl b.c-bad { color: #C62828; } .ut-st2 small.ut-gl b.c-good { color: #2E7D32; }

.ut-tg2 { display: grid; grid-template-columns: max-content max-content max-content; gap: 9px 12px; align-items: baseline; }
.ut .ut-tg2 > span { font: 600 12px / 1.15 PolymathText, sans-serif; color: #484542; white-space: nowrap; }
/* The group's and all Democrats' turnout read alike; the row label tells them apart. */
.ut .ut-tg2 > b { font: 700 14px / 1 PolymathText, sans-serif; color: #1B1714; }

/* Turnout rows, then ballots short. */
.ut-stats { grid-template-columns: minmax(0, 1fr) minmax(0, 2fr); }
.ut .ut-tg2 > b, .ut .ut-tg2 > i { font-size: 17px; } .ut .ut-tg2 > span { font-size: 13px; }
.ut-stats > .ut-st2 + .ut-st2 { padding-left: 28px; }
@media (max-width: 720px) { .ut-stats { grid-template-columns: minmax(0, 1.7fr) minmax(0, 1fr); } .ut-stats > .ut-st2 + .ut-st2 { padding-left: 14px; } .ut .ut-tg2 > b, .ut .ut-tg2 > i { font-size: 14px; } .ut .ut-tg2 > span { font-size: 12px; } }
/* Both growth numbers the same size, right-aligned, so the column scans (a flat 0.0 has no arrow). */
.ut-tg2 > i { justify-self: end; }
.ut .ut-tg2 > i { font-family: PolymathText, sans-serif; font-weight: 700; line-height: 1; font-style: normal; color: #484542; }

/* Under the segments: their Democrats who haven't voted, and the chase list button. */
.ut-chase { display: flex; align-items: center; justify-content: space-between; gap: 14px 20px; flex-wrap: wrap; margin-top: 6px; padding: 18px 22px; border-radius: 12px; background: #F2F7FC; }
/* The count leads: big, with what it is beside it. */
.ut-chase-n { display: flex; align-items: baseline; gap: 12px; min-width: 0; }
.ut-chase-n > b { font: 700 34px / 1 PolymathText, sans-serif; color: #0160A6; white-space: nowrap; }
.ut-chase p { margin: 0; font: 600 15px / 1.3 PolymathText, sans-serif; color: #1B1714; }
.ut-chase-a { display: flex; }
.ut-chase-btn { display: inline-flex; align-items: center; gap: 6px; height: 44px; padding: 0 22px; border-radius: 100px; background: #0160A6; color: #fff; font: 600 14px / 1 PolymathText, sans-serif; text-decoration: none; white-space: nowrap; }
.ut-chase-btn:hover { background: #014E88; }
.ut-chase-btn:focus-visible { outline: 2px solid var(--blue); outline-offset: 2px; }
.ut-chase-btn .material-icons-round { font-size: 18px; }
@media (max-width: 720px) { .ut-chase { padding: 16px; } .ut-chase-a { width: 100%; } .ut-chase-n { gap: 10px; } .ut-chase-n > b { font-size: 28px; } .ut-chase p { font-size: 14px; } .ut-chase-btn { width: 100%; justify-content: center; } }

/* Where to Focus rows: the calculation as a 5-column grid (labels / values with × and = / growth comparison). */
.ut-seg2 { grid-template-columns: 28px minmax(0, 1.6fr) minmax(0, 2.4fr); }
.ut-calc { display: grid; grid-template-columns: minmax(0, 1fr) 20px minmax(0, 1.2fr) 20px minmax(0, 1fr); gap: 5px 12px; align-items: baseline; justify-items: end; }
.ut-calc > i { font-style: normal; }
.ut-calc > b { font: 700 16px / 1 PolymathText, sans-serif; color: #1B1714; white-space: nowrap; } .ut-calc > b.c-bad { color: #C62828; }
.ut-calc > b.ut-bs { font-size: 20px; color: #C62828; }
.ut-calc .ut-op { justify-self: center; align-self: center; font: 500 18px / 1 PolymathText, sans-serif; color: #93908E; }
.ut-calc > small { font: 400 11.5px / 1.2 PolymathText, sans-serif; color: #93908E; white-space: nowrap; }
@media (max-width: 720px) {
  .ut-seg2 { grid-template-columns: 24px minmax(0, 1fr); }
  .ut-seg2 .ut-calc { grid-column: 2; grid-template-columns: minmax(0, 1fr) 14px minmax(0, 1.15fr) 14px minmax(0, 0.9fr); column-gap: 8px; justify-items: start; }
  .ut-calc > b { font-size: 15px; } .ut-calc > b.ut-bs { font-size: 16px; }
  .ut-calc .ut-op { font-size: 16px; }
}

/* Tablets and small laptops (721–940px): the registration/turnout panel is too tight for its wide layout, so it
   uses the phone one (the stacked equation and the two compact tables). */
@media (min-width: 721px) and (max-width: 940px) {
  .ut-panel > .ut-dk { display: none; }
  .ut-panel::before { display: none; }
  .ut-panel { margin-top: 0; padding: 16px 20px 8px; }
  .ut-panel > .ut-ph { display: flex; flex-direction: column; gap: 12px; margin-top: 4px; }
  .ut-eqm { display: grid; grid-template-columns: minmax(0, 1fr) 18px minmax(0, 1fr) 18px minmax(0, 1fr); align-items: start; }
  .ut-eqm > span { display: flex; flex-direction: column; gap: 5px; align-items: center; text-align: center; }
  .ut-eqm b { font: 800 24px / 26px PolymathDisp, serif; white-space: nowrap; }
  .ut-eqm small { font: 400 12.5px / 1.2 PolymathText, sans-serif; color: var(--um); }
  .ut-eqm em { font: 700 18px / 26px PolymathText, sans-serif; font-style: normal; text-align: center; color: var(--uf); }
  .ut-tm { display: grid; grid-template-columns: 70px repeat(2, minmax(0, 1fr)) 20px repeat(2, minmax(0, 1fr)); align-items: center; }
  .ut-tmh { grid-column: span 2; text-align: center; font: 600 12px / 1 PolymathText, sans-serif; color: var(--ub); padding-bottom: 6px; border-bottom: 1.5px solid var(--uk); }
  .ut-tm .ut-pn { height: 38px; gap: 6px; padding-left: 0; border-top: 0; border-bottom: 1px solid rgba(27, 23, 20, .08); font-size: 14px; }
  .ut-tm .ut-n { text-align: right; font: 600 14px / 38px PolymathText, sans-serif; border-bottom: 1px solid rgba(27, 23, 20, .08); white-space: nowrap; }
  .ut-tm .ut-chg { font-size: 12.5px; font-weight: 700; }
  .ut-tm > span:empty { align-self: stretch; }
  /* Where to Focus: the segment name on its own line, the calculation full width under it. */
  .ut-seg2 { grid-template-columns: 28px minmax(0, 1fr); row-gap: 10px; }
  .ut-seg2 .ut-calc { grid-column: 2; grid-template-columns: minmax(0, 1fr) 20px minmax(0, 1.2fr) 20px minmax(0, 1fr); justify-items: start; }
  .ut-calc .ut-sl { white-space: nowrap; }
}
/* Up to 1100px the grid cells are too narrow for name, number and share on one line: the name goes on top. */
@media (min-width: 721px) and (max-width: 1100px) {
  .ut-grid { grid-template-columns: 128px repeat(4, minmax(0, 1fr)); }
  .ut-cell { height: auto; min-height: 58px; flex-wrap: wrap; align-content: center; gap: 5px 8px; padding: 8px 12px; }
  .ut-cell > .ut-cl { flex: 1 0 100%; font-size: 13.5px; }
  .ut-cell > b { font-size: 17px; }
  .ut-cell > small { width: auto; margin-left: auto; }
}

/* Title: the measure is a menu (Dem share or Dem–Rep margin), set in the title's own type. */
.ut-vw { position: relative; display: inline; }
.ut-vsel { display: inline; padding: 0; margin: 0; border: 0; background: none; -webkit-appearance: none; appearance: none; cursor: pointer;
  font: inherit; letter-spacing: inherit; line-height: inherit; color: var(--blue); vertical-align: baseline;
  text-decoration: underline dashed 2px; text-decoration-color: var(--blue); text-underline-offset: 6px; }
.ut-vsel i { display: inline-block; width: 0; height: 0; margin: 0 .3em 0 0; vertical-align: .18em; border-left: .28em solid transparent; border-right: .28em solid transparent; border-top: .34em solid var(--blue); }
.ut-vsel:focus-visible { outline: 2px solid var(--blue); outline-offset: 3px; border-radius: 4px; }
.ut-vmenu { position: absolute; left: 0; top: calc(100% + 10px); z-index: 20; display: flex; flex-direction: column; min-width: 210px; padding: 6px; border-radius: 12px; background: #fff; box-shadow: 0 8px 24px rgba(12, 12, 13, .16), 0 0 0 1px #E7DFCB; }
.ut-vmenu[hidden] { display: none; }
.ut-vmenu button { text-align: left; padding: 10px 12px; border: 0; border-radius: 8px; background: none; cursor: pointer; font: 600 15px / 1 PolymathText, sans-serif; color: #1B1714; }
.ut-vmenu button:hover, .ut-vmenu button:focus-visible { background: #F4F1E8; outline: none; }
.ut-vmenu button[aria-checked="true"] { background: #EAF2FB; color: var(--blue); }

/* Margin view: the Dem–Rep margin now and at the same point in the compare year. */
.ut-mbars { display: grid; grid-template-columns: 52px minmax(0, 620px) auto; justify-content: start; gap: 10px 14px; align-items: center; }
.ut-cy { font: 700 14px / 1 PolymathText, sans-serif; color: #484542; }
.ut-track { height: 34px; border-radius: 8px; background: #EEE8D8; overflow: hidden; }
.ut-fill { display: block; height: 100%; border-radius: 8px; background: #0160A6; } .ut-fill.old { background: #9EC3E6; }
.ut-fill.r { background: #E43730; } .ut-fill.old.r { background: #F2A9A5; }
.ut-cv { font: 700 22px / 1 PolymathText, sans-serif; color: #0160A6; } .ut-cv.r { color: #C62828; } .ut-cv.old { font-size: 16px; color: #787776; }

/* The equation as the top row of a table whose party rows add up the same way. */
.ut-eqs { display: grid; grid-template-columns: 130px minmax(0, 1fr) 64px minmax(0, 1fr) 64px minmax(0, 1fr); align-items: center; padding: 12px 0 16px; }
.ut-big { align-self: stretch; display: flex; flex-direction: column; align-items: flex-end; justify-content: flex-end; gap: 8px; padding-bottom: 12px; border-bottom: 2px solid var(--uk); }
.ut-big b { font: 800 32px / 1 PolymathDisp, serif; } .ut-big small { font: 600 16px / 1.1 PolymathText, sans-serif; color: var(--uk); }
/* The labels head their columns, over the big numbers, so they read for every row below. */
.ut-big small { order: -1; font-size: 14px; color: var(--ub); }
.ut-bop { align-self: end; padding-bottom: 34px; text-align: center; font: 700 24px / 1 PolymathText, sans-serif; color: var(--uf); }
.ut-eqs .ut-pn, .ut-spl .ut-pn { height: 46px; padding-left: 0; border-top: 0; border-bottom: 1px solid rgba(27, 23, 20, .08); font-size: 16px; }
/* The big equation's own label (DEM, or Margin), sitting on its rule like the labels under the numbers. */
.ut-eqs > .ut-pn:first-child, .ut-eqs > .ut-pn.ut-mrow:first-child { border-top: 0; height: auto; align-self: stretch; align-items: flex-end; padding-bottom: 12px; border-bottom: 2px solid var(--uk); font-weight: 700; }
.ut-eqs .ut-n { text-align: right; font: 700 16px / 46px PolymathText, sans-serif; border-bottom: 1px solid rgba(27, 23, 20, .08); }
.ut-op2 { align-self: stretch; text-align: center; font: 600 16px / 46px PolymathText, sans-serif; color: var(--uf); }
.ut .ut-ink { color: #484542; }
.ut-pn.ut-mrow { display: flex; align-items: center; font: 800 14px / 1 PolymathText, sans-serif; letter-spacing: .3px; }
.ut-n.ut-mrow, .ut-pn.ut-mrow, .ut-op2.ut-mrow { border-top: 1.5px solid var(--uk); border-bottom: 0; font-weight: 800; }
.ut-unit { grid-column: 2 / -1; padding-top: 8px; text-align: right; font: 400 13px / 1.2 PolymathText, sans-serif; color: var(--um); }
.ut-behind { margin-top: 6px; padding-top: 4px; border-top: 1px solid rgba(27, 23, 20, .08); }
.ut-bhc { display: inline-flex; align-items: center; gap: 4px; margin: 10px 0 0; cursor: pointer; list-style: none; font: 600 13px / 1 PolymathText, sans-serif; color: var(--blue, #0160A6); }
.ut-bhc::-webkit-details-marker { display: none; }
.ut-bhc::after { content: '▾'; font-size: 11px; transition: transform .15s; }
.ut-behind[open] .ut-bhc::after { transform: rotate(180deg); }
.ut-bhc:focus-visible { outline: 2px solid var(--blue, #0160A6); outline-offset: 2px; }
.ut-behind .ut-eq { padding-top: 4px; }

/* Phones and tablets: the equation, then the party rows as changes only. */
.ut-spl { display: grid; grid-template-columns: 62px minmax(0, 1fr) 16px minmax(0, 1fr) 16px minmax(0, 1fr); align-items: center; margin-top: 4px; }
.ut-sh { align-self: stretch; display: flex; align-items: flex-end; justify-content: center; text-align: center; padding-bottom: 6px; border-bottom: 1.5px solid var(--uk); font: 600 12px / 1.2 PolymathText, sans-serif; color: var(--ub); }
.ut-spl .ut-n { text-align: center; font: 700 14px / 40px PolymathText, sans-serif; border-bottom: 1px solid rgba(27, 23, 20, .08); white-space: nowrap; }
.ut-spl .ut-pn { height: 40px; font-size: 13px; gap: 5px; } .ut-spl .ut-chip { width: 8px; height: 8px; border-radius: 2px; }
.ut-spl .ut-op2 { line-height: 40px; font-size: 13px; }
.ut-spl .ut-pn.ut-mrow { font-size: 13px; }
.ut-spl .ut-unit { text-align: center; font-size: 11.5px; }
@media (max-width: 720px) {
  .ut-mbars { grid-template-columns: 42px minmax(0, 1fr) 64px; gap: 8px 10px; } .ut-track { height: 28px; } .ut-cv { font-size: 18px; } .ut-cv.old { font-size: 15px; }
  .ut-vmenu { min-width: 190px; } .ut-vmenu button { font-size: 14px; }
  .ut-spl { grid-template-columns: 54px minmax(0, 1fr) 14px minmax(0, 1fr) 14px minmax(0, 1fr); }
}

/* Filter chips under the sentence: one per filter, each opening a checklist. */
.bt-toolbar.bt-viewrow { flex-wrap: wrap; row-gap: 12px; }
.bt-fchips { flex: 1 1 100%; display: flex; flex-wrap: wrap; align-items: center; gap: 8px; min-width: 0; }
.bt-fchips:empty { display: none; }
.bt-fc { position: relative; display: inline-flex; align-items: center; height: 36px; border-radius: 100px; background: #fff; border: 1.5px solid #CFE1F4; }
.bt-fc:hover:not(.off), .bt-fc.open { border-color: var(--blue, #0160A6); }
.bt-fc-b { display: inline-flex; align-items: center; gap: 1px; height: 100%; padding: 0 8px 0 14px; border: 0; background: none; border-radius: 100px; cursor: pointer;
  font: 600 14px / 1 PolymathText, sans-serif; color: var(--ink, #1B1714); white-space: nowrap; }
.bt-fc-b .material-icons-round { font-size: 20px; color: var(--blue, #0160A6); }
.bt-fc-b:focus-visible, .bt-fc-x:focus-visible, .bt-fc-clear:focus-visible { outline: 2px solid var(--blue, #0160A6); outline-offset: 2px; }
.bt-fc.on { background: var(--blue, #0160A6); border-color: var(--blue, #0160A6); }
.bt-fc.on .bt-fc-b { color: #fff; padding-right: 2px; }
.bt-fc-x { display: grid; place-items: center; width: 30px; height: 100%; padding: 0 4px 0 0; border: 0; background: none; border-radius: 0 100px 100px 0; cursor: pointer; color: #fff; }
.bt-fc-x .material-icons-round { font-size: 17px; }
.bt-fc.off { opacity: .45; }
.bt-fc.off .bt-fc-b { cursor: default; }
.bt-fc-menu { position: absolute; top: calc(100% + 6px); left: 0; z-index: 60; min-width: 200px; padding: 6px; background: #fff; border-radius: 12px; box-shadow: 0 8px 28px rgba(0, 0, 0, .18); }
.bt-fc-menu.right { left: auto; right: 0; }
.bt-fc-menu label { display: flex; align-items: center; gap: 10px; padding: 9px 10px; border-radius: 8px; cursor: pointer; font: 500 14.5px / 1.2 PolymathText, sans-serif; color: var(--ink, #1B1714); white-space: nowrap; }
.bt-fc-menu label:hover { background: rgba(1, 96, 166, .05); }
.bt-fc-menu label.all { color: var(--blue, #0160A6); font-weight: 600; border-bottom: 1px solid #EEF0F2; border-radius: 8px 8px 0 0; margin-bottom: 2px; }
.bt-fc-menu input { width: 18px; height: 18px; margin: 0; accent-color: var(--blue, #0160A6); }
.bt-fc-done { display: none; width: calc(100% - 8px); height: 36px; margin: 6px 4px 2px; border: 0; border-radius: 100px; background: var(--blue, #0160A6); color: #fff; cursor: pointer; font: 600 14px / 1 PolymathText, sans-serif; }
.bt-fc-clear { border: 0; background: none; padding: 0 4px; cursor: pointer; font: 600 13px / 1 PolymathText, sans-serif; color: var(--blue, #0160A6); }
/* Which voters the map and table count, in words, with what's shown under it. */
.bt-who { margin: 2px 0 12px; font: 700 17px / 1.3 PolymathText, sans-serif; color: var(--ink, #1B1714); }
.bt-who[hidden] { display: none; }
.bt-scoped .bt-who { margin-top: 16px; }   /* no Map | Table row above it on county and district pages */
@media (max-width: 640px) {
  .bt-fchips { gap: 6px; }
  .bt-fc { height: 30px; }
  .bt-fc-b { padding: 0 6px 0 11px; font-size: 12.5px; }
  .bt-fc-b .material-icons-round { font-size: 17px; }
  .bt-fc-x { width: 26px; }
  .bt-fc-x .material-icons-round { font-size: 15px; }
  .bt-fc-done { display: block; }
  .bt-fc-clear { display: none; }
  .bt-who { font-size: 16px; }
  /* Search stays a button at the end of the Map | Table row until it's opened. */
  .bt-vstrip .bt-search.bt-search-ic:not(.open) { flex: none; }
}

/* Change columns: the arrow and the number sit in fixed boxes so ▲/▼ and the digits line up down a column. */
.ut-ar { display: inline-block; width: 1.1em; text-align: center; font-style: normal; font-size: .8em; }
.ut-nv { display: inline-block; min-width: 2.2em; text-align: right; font-style: normal; font-variant-numeric: tabular-nums; }

/* Another party's change (REP, UNA) is plain ink: green and red are for Democrats. */
.kc-c.kc-ink, .kc-chg.kc-ink { color: var(--ink, #1B1714) !important; }
.c-ink, .bt-table td.c-ink { color: var(--ink, #1B1714); }
#bt-cure-list { scroll-margin-top: 16px; }

/* Unaffiliated voters: turnout, how they lean (coming), and who cast their ballots. Purple marks UNA. */
.un .un-em { font-style: normal; color: #6A3FB0; }
.un-lead { margin: -8px 0 0; font: 500 18px / 1.4 PolymathText, sans-serif; color: var(--uk); }
.un-ls { display: none; }
.un-blk { border-radius: 14px; background: #F6F2FB; padding: 18px 20px; }
.un-lh { display: flex; align-items: center; gap: 10px; }
.un-lh h3, .un-gh h3 { margin: 0; font: 700 15px / 1.2 PolymathText, sans-serif; color: var(--uk); }
.un-soon { font: 700 11px / 1 PolymathText, sans-serif; letter-spacing: .06em; text-transform: uppercase; color: #6A3FB0; background: #fff; border: 1px solid #D9C8F2; border-radius: 100px; padding: 5px 9px; }
.un-ln { margin: 6px 0 0; font: 400 14px / 1.4 PolymathText, sans-serif; color: var(--ub); }
.un-lh { flex-wrap: wrap; }
.un-sig { position: relative; margin-left: auto; }
.un-ss { display: none; }
.un-sigb { display: inline-flex; align-items: center; gap: 6px; height: 32px; padding: 0 8px 0 12px; border: 1px solid #D9C8F2; border-radius: 100px; background: #fff; color: var(--uk); font: 600 13px / 1 PolymathText, sans-serif; cursor: pointer; white-space: nowrap; }
.un-sigb .un-sl { font-weight: 500; color: var(--um); }
.un-sigb .material-icons-round { font-size: 18px; color: #6A3FB0; }
.un-sigb:focus-visible, .un-menu button:focus-visible { outline: 2px solid var(--blue); outline-offset: 2px; }
.un-menu { position: absolute; right: 0; top: calc(100% + 6px); z-index: 5; display: flex; flex-direction: column; min-width: 190px; padding: 6px; border-radius: 12px; background: #fff; box-shadow: rgba(12, 12, 13, 0.08) 0 2px 4px, rgba(12, 12, 13, 0.14) 0 10px 28px; }
.un-menu[hidden] { display: none; }
.un-menu button { display: flex; align-items: center; gap: 10px; padding: 9px 10px; border: 0; border-radius: 8px; background: none; color: var(--uk); font: 500 14px / 1 PolymathText, sans-serif; text-align: left; cursor: pointer; }
.un-menu button:hover { background: #F6F2FB; }
.un-menu button[data-un-all] { font-weight: 700; border-bottom: 1px solid var(--ur); border-radius: 8px 8px 0 0; margin-bottom: 2px; }
.un-menu i { width: 16px; height: 16px; border: 1.5px solid #B99BE6; border-radius: 4px; flex: none; }
.un-menu [aria-checked="true"] i { background: #6A3FB0 url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16'%3E%3Cpath d='M3.5 8.5l3 3 6-7' fill='none' stroke='%23fff' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E") center / 12px no-repeat; border-color: #6A3FB0; }
.un-lb { display: grid; grid-template-columns: 44px minmax(0, 1fr) 92px; gap: 8px 12px; align-items: center; margin-top: 16px; }
.un-nh { margin-bottom: -4px; font: 700 12px / 1 PolymathText, sans-serif; letter-spacing: 1.2px; text-transform: uppercase; color: var(--um); text-align: right; }
.un-lb .un-net { font: 800 28px / 1 PolymathDisp, serif; text-align: right; color: var(--uk); white-space: nowrap; }
.un-lb .un-net.d { color: var(--blue, #0160A6); } .un-lb .un-net.r { color: #C9372F; }
.un-lb .un-net.old { font-size: 19px; opacity: .62; }
.un-y { font: 700 13px / 1 PolymathText, sans-serif; color: var(--ub); }
.un-bar { display: flex; height: 36px; border-radius: 8px; overflow: hidden; gap: 2px; }
.un-bar.old { height: 22px; opacity: .62; }
.un-s { display: flex; align-items: center; justify-content: center; gap: 5px; min-width: 0; padding: 0 8px; font: 700 13px / 1 PolymathText, sans-serif; color: #fff; white-space: nowrap; overflow: hidden; }
.un-bar.old .un-s { font-size: 11.5px; }
.un-s i { font-style: normal; }
.un-s.d { background: #0160A6; justify-content: flex-start; }
.un-s.o { background: #CFC8B8; color: var(--uk); }
.un-s.r { background: #E43730; }
.un-s.n { background: repeating-linear-gradient(135deg, #EEE8DC 0 6px, #E3DCCD 6px 12px); color: var(--ub); justify-content: flex-end; }
.un-legend { display: none; }
.un-key { margin: 8px 0 0 56px; font: 400 12.5px / 1.4 PolymathText, sans-serif; color: var(--um); }
.un-chase { margin-top: 14px; background: #fff; }
.un-chase .ut-chase-a { flex-direction: column; align-items: center; gap: 6px; }
.un-lock { display: inline-flex; align-items: center; gap: 4px; font: 500 12px / 1 PolymathText, sans-serif; color: var(--um); }
.un-lock .material-icons-round { font-size: 14px; color: #0160A6; }
.un-gh { display: flex; align-items: center; justify-content: space-between; gap: 10px; flex-wrap: wrap; margin: 0 0 12px; }
.un-gh h3 span { font-weight: 500; color: var(--um); margin-left: 8px; }
.un-grid { display: grid; grid-template-columns: 120px repeat(4, minmax(0, 1fr)); gap: 8px; }
.un-f { align-self: center; font: 700 11.5px / 1.2 PolymathText, sans-serif; letter-spacing: .06em; text-transform: uppercase; color: var(--um); }
.un-c { display: flex; align-items: center; gap: 8px; height: 42px; padding: 0 12px; border-radius: 9px; border: 1px solid var(--ue); background: #fff; }
.un-c i { flex: 1; min-width: 0; font: 500 13.5px / 1 PolymathText, sans-serif; font-style: normal; color: var(--uk); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.un-c b { font: 700 15px / 1 PolymathText, sans-serif; color: var(--uk); }
.un-c em { min-width: 26px; text-align: right; font: 700 12px / 1 PolymathText, sans-serif; font-style: normal; color: var(--um); }
.un-c.t-g { background: #F1EAFB; border-color: #D9C8F2; } .un-c.t-g em { color: #5B3696; }
.un-c.t-g2 { background: #E2D3F7; border-color: #B99BE6; } .un-c.t-g2 em { color: #4A2A80; }
.ut-who { margin-left: 8px; font: 600 12.5px / 1 PolymathText, sans-serif; color: var(--blue); text-decoration: none; white-space: nowrap; }
.ut-who:hover, .ut-who:focus-visible { text-decoration: underline; }
.ut-ph .ut-who { display: none; }
/* Tablets: four columns, each cell stacked (name over number), the factor name as a row heading. */
@media (min-width: 721px) and (max-width: 980px) {
  .un-grid { grid-template-columns: repeat(4, minmax(0, 1fr)); }
  .un-f { grid-column: 1 / -1; margin-top: 6px; }
  .un-grid > span:empty { display: none; }
  .un-c { height: auto; padding: 8px 12px; display: grid; grid-template-columns: 1fr auto; gap: 4px 6px; }
  .un-c i { grid-column: 1 / -1; font-size: 13px; color: var(--ub); }
}
@media (max-width: 720px) {
  .un-lead { font-size: 16px; }
  .un-ll { display: none; } .un-ls { display: inline; }
  .un-blk { padding: 16px; }
  .un-sigb { height: 30px; font-size: 12.5px; }
  .un-sigb .un-sl, .un-sn { display: none; }
  .un-ss { display: inline; }
  .un-lh { flex-wrap: nowrap; }
  .un-lw { display: none; }
  .un-legend { display: flex; flex-wrap: wrap; gap: 6px 14px; margin: 10px 0 0 42px; font: 500 12.5px / 1 PolymathText, sans-serif; color: var(--ub); }
  .un-legend span { display: inline-flex; align-items: center; gap: 6px; }
  .un-legend .un-s { width: 12px; height: 12px; padding: 0; border-radius: 3px; }
  .un-lb { grid-template-columns: 28px minmax(0, 1fr) 50px; gap: 8px; }
  .un-lb .un-net { font-size: 18px; } .un-lb .un-net.old { font-size: 14px; }
  .un-key { margin-left: 42px; }
  .un-gh { flex-direction: column; align-items: flex-start; }
  .un-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .un-f { grid-column: 1 / -1; margin-top: 6px; }
  .un-grid > span:empty { display: none; }
  .un-c { height: auto; padding: 8px 10px; display: grid; grid-template-columns: 1fr auto; gap: 4px 6px; }
  .un-c i { grid-column: 1 / -1; font-size: 12.5px; color: var(--ub); }
}
/* Group header turnout: DEM and REP rows for the group, a rule, then all Democrats in quieter ink. */
.ut-tgr { grid-column: 1 / -1; width: 100%; margin: 0; border: 0; border-top: 1px solid rgba(27, 23, 20, 0.12); }
.ut .ut-tg2 > span .ut-chip { display: inline-block; width: 8px; height: 8px; border-radius: 2px; margin-right: 6px; vertical-align: 1px; }
.ut .ut-tg2 > .ut-ad { color: #787776; font-weight: 500; }
/* Report card, Frequent: the midterm-skipper share and their chase box, above Where to Focus. */
.ut-fq { margin: 0 0 22px; padding-bottom: 22px; border-bottom: 1px solid var(--ue, #E7DFCB); }
.ut-fq > p { margin: 0 0 12px; font: 600 17px / 1.35 PolymathText, sans-serif; color: #1B1714; }
.ut-fq > p b { font: 700 24px / 1 PolymathText, sans-serif; color: #0160A6; margin-right: 4px; }
/* Report card: definitions for the derived factors (voting history, area). */
.ut-flw { position: relative; display: flex; align-items: center; gap: 4px; min-width: 0; }
.ut-info { position: relative; display: inline-grid; place-items: center; width: 22px; height: 22px; padding: 0; border: 0; border-radius: 50%; background: none; color: #93908E; cursor: help; flex: none; }
.ut-info .material-icons-round { font-size: 16px; }
.ut-info:hover, .ut-info:focus-visible { color: #0160A6; outline: none; }
.ut-tip { display: none; position: absolute; left: -8px; top: calc(100% + 6px); z-index: 20; width: 260px; padding: 10px 12px; border-radius: 10px; background: #1B1714; color: #fff;
  font: 500 13px / 1.4 PolymathText, sans-serif; letter-spacing: 0; text-transform: none; text-align: left; box-shadow: 0 6px 20px rgba(12, 12, 13, .2); pointer-events: none; }
.ut-info:hover .ut-tip, .ut-info:focus .ut-tip { display: block; }
.ut-bn .ut-def { flex-basis: 100%; font: 500 14px / 1.35 PolymathText, sans-serif; font-style: normal; color: #484542; }
@media (max-width: 720px) {
  .ut-gridm .ut-flw { width: 100%; } .ut-gridm .ut-flw .ut-fl { flex: 1; }
  .ut-gridm .ut-tip { left: auto; right: -4px; }
}

/* Summary: a headline and the numbers behind it, then working / lagging / act as bullets. */
.bt-summary-text > .bt-sum-h, .bt-summary-text > .bt-sum-sub { padding-left: 0; }
.bt-summary-text > .bt-sum-h::before, .bt-summary-text > .bt-sum-sub::before { display: none; }
.bt-summary-text > [hidden] { display: none; }
.bt-sum-h { font: 800 clamp(24px, 2.6vw, 30px) / 1.15 PolymathDisp, serif; color: var(--ink); letter-spacing: .1px; text-wrap: pretty; }
.bt-sum-h .bt-sum-l { display: block; }
.bt-sum-h .t-good, .bt-sum-h .t-bad, .bt-sum-h em { white-space: nowrap; }
.bt-sum-h em { font-style: normal; color: var(--blue, #0160A6); }
.bt-sum-h em.t-bad { color: var(--red); }
.bt-sum-sub { font-weight: 500; color: var(--ink2); margin: -2px 0 6px; }
.bt-sum-sub b { color: var(--ink); }
.bt-summary-text > span:not(.bt-sum-h):not(.bt-sum-sub) { font-weight: 500; }
.bt-summary-text > span b { font-weight: 700; color: var(--ink); }
.bt-summary .bt-rule { height: 1px; background: var(--line); }
@media (max-width: 640px) {
  .bt-sum-h { font-size: 23px; }
  .bt-summary-text { font-size: 15.5px; }
}
.bt-summary-text > .bt-sum-lab { padding-left: 0; margin-top: 8px; font: 700 12px / 1 PolymathText, sans-serif; letter-spacing: .08em; text-transform: uppercase; color: var(--mute2); }
.bt-summary-text > .bt-sum-lab::before { display: none; }
.bt-sum-h .t-good { color: var(--green); }
.bt-sum-h .t-bad { color: var(--red); }

/* ---------------------------------------------------------------- page sections
   Four sections (Overview, Dem report card, Explore, Voter lists), each a full-width band:
   white and sand in turn under the sand hero, each led by its title and a line (the pinned bar names the place).
   Cards on white bands get an edge so they don't melt into it. */
.bt-band { margin-top: 0; border-top: 1px solid var(--edge); border-bottom: 0; scroll-margin-top: var(--bt-pin-h, 64px); }
.bt-band:first-of-type, .bt-hero + .bt-band { margin-top: clamp(24px, 3vw, 36px); }
.bt-band-w { background: #fff; }
.bt-band-s { background: var(--cream); }
.bt-band-w .bt-paper { border: 1px solid var(--edge); box-shadow: 0 1px 2px rgba(12, 12, 13, .04); }
.bt-band[hidden] { display: none; }
.bt-band .bt-stack { padding-top: clamp(32px, 4vw, 48px); padding-bottom: clamp(36px, 4.5vw, 56px); gap: 20px; }
.bt-bh { display: flex; flex-direction: column; gap: 6px; margin-bottom: 4px; }
.bt-bh-t { margin: 0; font: 800 clamp(28px, 3.2vw, 38px) / 1.1 PolymathDisp, serif; letter-spacing: .2px; color: var(--ink); }
.bt-bh-d { margin: 2px 0 0; font: 500 16px / 1.4 PolymathText, sans-serif; color: #6E6A66; }
.bt-jump-target { scroll-margin-top: calc(var(--bt-pin-h, 64px) + 12px); }
@media (max-width: 640px) {
  .bt-band .bt-stack { padding-top: 28px; padding-bottom: 32px; gap: 16px; }
  .bt-bh-t { font-size: 28px; }
  .bt-bh-d { font-size: 15px; }
}

/* The pinned bar: the place (tap to change it) and the four sections; on narrow screens the
   current section is a menu. Shown once the hero has scrolled away (ballot-tracker.js bindPin). */
.bt-pin { position: fixed; left: 0; right: 0; top: 0; z-index: 49; background: rgba(255, 255, 255, .96); backdrop-filter: blur(10px); border-bottom: 1px solid var(--edge); box-shadow: 0 4px 14px rgba(0, 0, 0, .05); }
.bt-pin[hidden] { display: none; }
.bt-pin-in { max-width: 1240px; margin: 0 auto; padding: 9px clamp(16px, 4vw, 32px); display: flex; align-items: center; gap: 16px; }
.bt-pin-pl { display: flex; align-items: center; gap: 6px; min-width: 0; text-decoration: none; color: var(--ink); }
.bt-pin-pl b { font: 800 18px / 1.2 PolymathDisp, serif; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.bt-pin-pl .material-icons-round { font-size: 20px; color: var(--blue, #0160A6); }
.bt-pin-ch { margin-left: 6px; font: 600 13px / 1 PolymathText, sans-serif; color: var(--blue, #0160A6); border: 1px solid #C9D9EA; border-radius: 999px; padding: 6px 10px; white-space: nowrap; }
.bt-pin-nav { display: flex; gap: 4px; margin-left: auto; }
.bt-pin-nav a { font: 600 15px / 1 PolymathText, sans-serif; color: var(--ink2); text-decoration: none; padding: 9px 12px; border-radius: 999px; white-space: nowrap; }
.bt-pin-nav a:hover { background: var(--cream); }
.bt-pin-nav a.on { background: var(--blue, #0160A6); color: #fff; }
.bt-pin-nav a[hidden] { display: none; }
.bt-pin-cur { display: none; position: relative; margin-left: auto; flex: none; }
.bt-pin-cur select { appearance: none; -webkit-appearance: none; border: 0; border-radius: 999px; background: var(--blue, #0160A6); color: #fff; font: 700 14px / 1 PolymathText, sans-serif; padding: 9px 32px 9px 14px; cursor: pointer; }
.bt-pin-cur .material-icons-round { position: absolute; right: 9px; top: 50%; transform: translateY(-50%); color: #fff; font-size: 18px; pointer-events: none; }
.bt-vh { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; }
@media (max-width: 900px) {
  .bt-pin-nav { display: none; }
  .bt-pin-cur { display: block; }
  .bt-pin-pl b { font-size: 17px; }
  .bt-pin-ch { border: 0; padding: 0; margin-left: 4px; }
  .bt-pin-ch::before { content: "· "; }
}
/* Phones: the place gets the room; the place itself is the "change" link (its pin is blue). */
@media (max-width: 480px) {
  .bt-pin-in { gap: 10px; }
  .bt-pin-ch { display: none; }
  .bt-pin-cur select { font-size: 13px; padding: 8px 28px 8px 12px; }
  .bt-pin-cur .material-icons-round { right: 7px; font-size: 17px; }
}
/* Phones: the summary reads as short lines, not a bulleted list, in a tighter size. */
@media (max-width: 640px) {
  .bt-sum-h { font-size: 21px; line-height: 1.18; }
  .bt-summary-text { font-size: 14.5px; line-height: 1.45; gap: 9px; }
  .bt-sum-h .bt-sum-l { display: inline; }
  .bt-summary-text > span::before { display: none; }
  .bt-summary-text > span:not(.bt-sum-h):not(.bt-sum-sub):not(.bt-sum-lab) { padding-left: 12px; border-left: 3px solid var(--edge); }
  .bt-summary-text > .bt-sum-lab { margin-top: 10px; font-size: 11px; }
}