/* Results-page scorecard (top-of-page module, approved from the 2026-09-25
   design canvas). Reads feed.scorecard; rendered by js/scorecard.js.
   Shade ramp per party: pale = not up this cycle, brand = incumbent
   re-elected, light = new member same party, deep + hatch = seat flipped.
   Gray = still counting. Flips sit nearest the center majority line. */
:root {
  /* Shade = degree of change, four evenly spaced steps per party (pale -> dark):
     not up, incumbent re-elected, new member (same party), flipped. */
  --sc-d-hold: #e6f0f6; --sc-d-inc: #82bdd8; --sc-d-new: #3b8fb8; --sc-d-flip: #1c5674;
  --sc-r-hold: #fce8ef; --sc-r-inc: #f08fb2; --sc-r-new: var(--ms-rep-red, #e50963); --sc-r-flip: #8f0540;
  /* Brand mid tones for the thin before-bar, rings, and the live dot (not a change step). */
  --sc-d-mid: var(--ms-dem-blue, #6cb3d2); --sc-r-mid: var(--ms-rep-red, #e50963);
  --sc-o: #978f84; --sc-count: #d9d9d9; --sc-ink: var(--ms-navy, #043858); --sc-muted: #4a5d6b;
  --sc-line: #d6dfe1; --sc-gold: var(--ms-gold, #d0ac60); --sc-gold-bg: #fdf7e7; --sc-gold-ink: #7a5a0e;
  --sc-split: #8b567f;
}
.sc { font-family: 'Work Sans', system-ui, sans-serif; color: var(--sc-ink); margin: 8px 0 28px; }
.sc__head { display: flex; align-items: flex-end; justify-content: space-between; gap: 16px; flex-wrap: wrap; margin-bottom: 14px; }
.sc__title { margin: 0; font-size: 22px; font-weight: 800; letter-spacing: -0.01em; }
.sc__sub { margin: 2px 0 0; font-family: Merriweather, Georgia, serif; font-size: 14px; color: var(--sc-muted); }
.sc__asof { font-size: 12px; font-weight: 600; color: var(--sc-muted); text-align: right; line-height: 1.4; }
.sc__live { display: inline-flex; align-items: center; gap: 6px; font-size: 12px; font-weight: 700; color: var(--sc-gold-ink); background: var(--sc-gold-bg); border: 1.5px solid var(--sc-gold); border-radius: 999px; padding: 3px 10px; margin-bottom: 4px; }
.sc__live::before { content: ''; width: 8px; height: 8px; border-radius: 50%; background: var(--sc-r-mid); }

.sc-nat { background: #f2f2f2; border-radius: 8px; padding: 14px 18px; display: flex; flex-direction: column; gap: 8px; }
.sc-nat__row { display: flex; justify-content: space-between; align-items: baseline; gap: 12px; flex-wrap: wrap; font-size: 12px; }
.sc-nat__kicker { font-size: 12px; font-weight: 700; text-transform: uppercase; letter-spacing: 0.06em; }
.sc-nat__meta { color: var(--sc-muted); }
.sc-nat__bar { display: flex; height: 28px; gap: 2px; }
.sc-nat__bar .sc-seg { border-radius: 2px; min-width: 2px; }
.sc-nat__totals { display: flex; justify-content: space-between; gap: 16px; flex-wrap: wrap; font-size: 12px; line-height: 1.4; }
.sc-nat__totals .num { font-weight: 800; font-size: 16px; }
.sc-nat__totals .num--d { color: var(--sc-d-flip); } .sc-nat__totals .num--r { color: var(--sc-r-flip); }
.sc-nat__tri { display: flex; align-items: center; gap: 14px; flex-wrap: wrap; font-size: 12px; padding-top: 6px; border-top: 1px solid var(--sc-line); }
.sc-nat__tri .num { font-weight: 800; font-size: 15px; }
.sc-nat__tri .num--x { color: var(--sc-split); }
.sc-legend { display: flex; gap: 10px; flex-wrap: wrap; align-items: center; font-size: 10.5px; color: var(--sc-muted); padding-top: 2px; white-space: nowrap; }
.sc-legend > span { display: inline-flex; align-items: center; gap: 5px; }
.sc-sw { display: inline-block; width: 12px; height: 12px; border-radius: 2px; }
.sc-legend .sc-tick { display: inline-block; width: 0; height: 12px; }
.sc-tick--maj { border-left: 1px solid var(--sc-ink); }
.sc-tick--sm { border-left: 2px dotted var(--sc-ink); }

.sc-seg--d-hold { background: var(--sc-d-hold); } .sc-seg--d-inc { background: var(--sc-d-inc); } .sc-seg--d-new { background: var(--sc-d-new); }
.sc-seg--r-hold { background: var(--sc-r-hold); } .sc-seg--r-inc { background: var(--sc-r-inc); } .sc-seg--r-new { background: var(--sc-r-new); }
.sc-seg--o { background: var(--sc-o); } .sc-seg--count { background: var(--sc-count); }
.sc-seg--d-before { background: var(--sc-d-mid); } .sc-seg--r-before { background: var(--sc-r-mid); }
.sc-seg--d-flip { background: repeating-linear-gradient(135deg, var(--sc-d-flip) 0 3px, rgba(255,255,255,0.5) 3px 5px); }
.sc-seg--r-flip { background: repeating-linear-gradient(135deg, var(--sc-r-flip) 0 3px, rgba(255,255,255,0.5) 3px 5px); }

.sc-changes { display: flex; flex-direction: column; gap: 6px; margin: 14px 0; }
.sc-changes__kicker { font-size: 12px; font-weight: 700; text-transform: uppercase; letter-spacing: 0.06em; margin-bottom: 2px; }
.sc-changes__row { display: flex; align-items: flex-start; gap: 10px; }
.sc-changes__label { flex: none; width: 150px; padding-top: 6px; font-size: 11px; font-weight: 700; color: var(--sc-muted); text-transform: uppercase; letter-spacing: 0.04em; }
.sc-changes__chips { display: flex; align-items: center; gap: 6px; flex-wrap: wrap; }
@media (max-width: 640px) { .sc-changes__row { flex-direction: column; gap: 4px; } .sc-changes__label { width: auto; padding-top: 0; } }
.sc-chip { display: inline-flex; align-items: center; gap: 6px; padding: 4px 10px; border-radius: 999px; font-size: 12px; font-weight: 600; border: 1.5px solid var(--sc-gold); background: var(--sc-gold-bg); color: var(--sc-ink); }
.sc-chip b { font-weight: 800; }
.sc-chip .arr { color: var(--sc-o); }
.sc-chip--tri { background: var(--sc-ink); border-color: var(--sc-ink); color: #fff; font-weight: 700; }
.sc-chip--tri .arr { color: rgba(255,255,255,0.6); }
.sc-chip--sm { border-style: dashed; background: #fff; font-size: 11px; }
.sc-chip--open { border: 1.5px dashed var(--sc-o); background: #fff; color: var(--sc-muted); }
.sc-chip .d { color: var(--sc-d-flip); } .sc-chip .r { color: var(--sc-r-flip); } .sc-chip .x { color: var(--sc-split); }
.sc-chip--tri .d { color: #9fd4ea; } .sc-chip--tri .r { color: #ff8fb8; } .sc-chip--tri .x { color: #d9b8d1; }

.sc-controls { display: flex; align-items: center; justify-content: space-between; gap: 16px; flex-wrap: wrap; padding: 8px 0 12px; border-top: 1px solid var(--sc-line); }
.sc-controls__group { display: flex; align-items: center; gap: 8px; flex-wrap: wrap; }
.sc-controls__label { font-size: 11px; font-weight: 700; text-transform: uppercase; letter-spacing: 0.06em; color: var(--sc-muted); }
.sc-seg-ctl { display: inline-flex; border: 1px solid var(--sc-ink); border-radius: 999px; overflow: hidden; }
.sc-seg-ctl button { border: 0; padding: 6px 14px; font: inherit; font-size: 12px; font-weight: 700; background: #fff; color: var(--sc-ink); cursor: pointer; min-height: 32px; }
.sc-seg-ctl button[aria-pressed="true"] { background: var(--sc-ink); color: #fff; }

.sc-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(230px, 1fr)); gap: 12px; }
.sc-cell { display: flex; flex-direction: column; gap: 4px; padding: 10px; border-radius: 6px; background: #fff; border: 1px solid var(--sc-line); }
.sc-cell--hot { background: var(--sc-gold-bg); border: 2px solid var(--sc-gold); padding: 9px; }
.sc-cell--count { background: #fafafa; border-style: dashed; border-color: #b5b5b5; }
.sc-cell__head { display: flex; align-items: baseline; justify-content: space-between; gap: 6px; min-height: 18px; }
.sc-cell__st { font-size: 14px; font-weight: 800; }
.sc-cell__name { font-size: 10px; color: var(--sc-muted); margin-left: 5px; }
.sc-cell__badges { display: flex; align-items: center; gap: 4px; flex-wrap: wrap; justify-content: flex-end; }
.sc-pill { font-size: 9px; font-weight: 800; letter-spacing: 0.04em; padding: 2px 6px; border-radius: 999px; white-space: nowrap; }
.sc-pill--ctl { text-transform: uppercase; color: var(--sc-gold-ink); background: #f0dca0; }
.sc-pill--tri { text-transform: uppercase; color: #fff; background: var(--sc-ink); }
.sc-pill--sm { background: #eef2f5; }
.sc-pill--count { text-transform: uppercase; color: var(--sc-muted); background: #e8e8e8; font-weight: 700; }
.sc-row { display: flex; align-items: center; gap: 6px; height: 30px; }
.sc-row__label { width: 16px; flex: none; font-size: 9px; font-weight: 800; color: var(--sc-muted); }
.sc-bars { flex: 1 1 auto; min-width: 0; position: relative; display: flex; flex-direction: column; gap: 3px; }
.sc-bar { display: flex; border-radius: 2px; overflow: hidden; }
.sc-bar--before { height: 5px; opacity: 0.9; }
.sc-bar--after { height: 12px; }
.sc-bar .sc-seg { flex: 0 0 auto; }
.sc-maj { position: absolute; left: 50%; top: -2px; width: 1px; height: 24px; background: var(--sc-ink); opacity: 0.6; pointer-events: none; }
.sc-smtick { position: absolute; top: 6px; width: 0; height: 16px; border-left: 2px dotted var(--sc-ink); opacity: 0.85; pointer-events: none; }
.sc-nums { flex: none; width: 40px; display: flex; flex-direction: column; align-items: flex-end; line-height: 1.15; }
.sc-nums__before { font-size: 8.5px; color: var(--sc-o); }
.sc-nums__after { font-size: 10px; font-weight: 800; white-space: nowrap; }
.sc-nums__left { font-size: 8px; font-weight: 600; color: var(--sc-o); }
.sc-offices { display: flex; align-items: center; gap: 3px; flex-wrap: wrap; min-height: 20px; }
.sc-off { width: 17px; height: 17px; border-radius: 50%; display: inline-flex; align-items: center; justify-content: center; font-size: 7px; font-weight: 800; color: #fff; box-sizing: border-box; }
.sc-off--d-inc { background: var(--sc-d-inc); color: var(--sc-ink); } .sc-off--d-new { background: var(--sc-d-new); } .sc-off--d-flip { background: var(--sc-d-flip); }
.sc-off--r-inc { background: var(--sc-r-inc); color: var(--sc-ink); } .sc-off--r-new { background: var(--sc-r-new); } .sc-off--r-flip { background: var(--sc-r-flip); }
.sc-off--o { background: var(--sc-o); }
.sc-off--count { background: #fff; color: var(--sc-o); border: 1.5px dashed var(--sc-o); }
.sc-off--ring-d { box-shadow: 0 0 0 2.5px var(--sc-d-mid); } .sc-off--ring-r { box-shadow: 0 0 0 2.5px var(--sc-r-mid); }

.sc-table-wrap { overflow-x: auto; }
.sc-table { min-width: 860px; display: flex; flex-direction: column; }
.sc-trow { display: grid; grid-template-columns: 118px minmax(190px, 2fr) minmax(190px, 2fr) minmax(130px, 1.3fr) 82px minmax(100px, 1fr); gap: 0 12px; align-items: center; padding: 3px 8px; border-bottom: 1px solid #e6ebee; background: #fff; }
.sc-trow--head { padding: 6px 10px; border-bottom: 2px solid var(--sc-ink); font-size: 10px; font-weight: 800; text-transform: uppercase; letter-spacing: 0.06em; color: var(--sc-muted); }
.sc-trow--hot { background: var(--sc-gold-bg); }
.sc-trow .sc-row { height: 26px; gap: 8px; }
.sc-trow .sc-bars { flex: 1 1 auto; min-width: 110px; }
.sc-trow .sc-bar--before { height: 4px; } .sc-trow .sc-bar--after { height: 12px; }
.sc-trow .sc-maj { height: 22px; } .sc-trow .sc-smtick { top: 4px; }
.sc-trow .sc-nums { width: 34px; }
.sc-trow__st { font-size: 13px; font-weight: 800; }
.sc-trow__none { font-size: 10px; color: #b5b5b5; }
.sc-trow__gain { display: flex; gap: 8px; font-size: 11px; font-weight: 700; }
.sc-trow__gain .d { color: var(--sc-d-flip); } .sc-trow__gain .r { color: var(--sc-r-flip); }
.sc-trow__change { display: flex; flex-direction: column; gap: 1px; line-height: 1.2; font-size: 10px; font-weight: 700; }
.sc-trow__change .tri { color: var(--sc-ink); font-weight: 800; } .sc-trow__change .ctl { color: var(--sc-gold-ink); } .sc-trow__change .sm { color: var(--sc-muted); }

@media (max-width: 640px) {
  .sc-nat__bar { height: 22px; }
  .sc-legend { gap: 10px; }
  .sc-seg-ctl button { padding: 6px 10px; font-size: 11px; }
}

/* Cards and rows are links to the state's full results further down the page. */
.sc-cell[data-st], .sc-trow[data-st] { cursor: pointer; }
.sc-cell[data-st]:hover { border-color: var(--sc-ink); box-shadow: 0 1px 4px rgba(4, 56, 88, 0.12); }
.sc-trow[data-st]:hover { background: #f4f8fb; }
.sc-cell[data-st]:focus-visible, .sc-trow[data-st]:focus-visible { outline: 2px solid var(--sc-ink); outline-offset: 2px; }
.sc a.sc-cell__st, .sc a.sc-trow__st { color: var(--sc-ink); text-decoration: none; }
.sc a.sc-cell__st:hover, .sc a.sc-trow__st:hover { color: var(--sc-ink); text-decoration: underline; }
.sc-map { margin: 4px 0 8px; }

/* Post-election analysis panel (collapsed by default) above the scorecard. */
.analysis-panel { margin: 8px 0 20px; border: 1px solid var(--sc-line); border-left: 4px solid var(--sc-gold); border-radius: 8px; background: #fff; }
.analysis-panel > summary { display: flex; align-items: baseline; gap: 10px 14px; flex-wrap: wrap; padding: 14px 18px; cursor: pointer; list-style: none; font-family: 'Work Sans', system-ui, sans-serif; }
.analysis-panel > summary::-webkit-details-marker { display: none; }
.analysis-panel > summary::before { content: '\25B8'; color: var(--sc-ink); font-size: 14px; transition: transform .15s; }
.analysis-panel[open] > summary::before { transform: rotate(90deg); }
.analysis-panel__kicker { font-size: 11px; font-weight: 700; text-transform: uppercase; letter-spacing: 0.08em; color: var(--sc-gold-ink); }
.analysis-panel__title { font-size: 18px; font-weight: 800; color: var(--sc-ink); }
.analysis-panel__byline { font-size: 12px; color: var(--sc-muted); }
.analysis-panel__hint { margin-left: auto; font-size: 12px; font-weight: 700; color: var(--sc-ink); text-decoration: underline; }
.analysis-panel__body { padding: 4px 26px 22px; }
.analysis-panel__body .analysis-note { font-family: 'Work Sans', system-ui, sans-serif; font-size: 13px; color: var(--sc-muted); border-bottom: 1px solid var(--sc-line); padding-bottom: 12px; margin-bottom: 16px; }
.analysis-panel__body h3 { margin: 26px 0 10px; }
.analysis-map { margin: 6px 0 14px; }
.analysis-map img { width: 100%; height: auto; display: block; border: 1px solid var(--sc-line); border-radius: 6px; }
@media (max-width: 640px) { .analysis-panel__body { padding: 4px 16px 18px; } .analysis-panel__hint { margin-left: 0; } }

/* Hover highlight on bar segments, office circles and supermajority ticks (tooltip = the site's .tooltip). */
.sc-seg[data-tip] { cursor: default; transition: filter .1s; }
.sc-seg[data-tip]:hover, .sc-seg.is-hover { box-shadow: inset 0 0 0 2px var(--sc-ink); filter: brightness(0.92); }
.sc-nat__bar .sc-seg[data-tip]:hover, .sc-nat__bar .sc-seg.is-hover { box-shadow: inset 0 0 0 3px var(--sc-ink); }
.sc-off[data-tip] { cursor: default; transition: transform .1s; }
.sc-off[data-tip]:hover, .sc-off.is-hover { transform: scale(1.25); box-shadow: 0 0 0 2px var(--sc-ink); z-index: 1; position: relative; }
.sc-off--ring-d:hover, .sc-off--ring-r:hover { box-shadow: 0 0 0 2.5px var(--sc-ink); }
.sc-smtick[data-tip] { pointer-events: auto; cursor: default; padding: 0 3px; margin-left: -3px; }
.sc-smtick[data-tip]:hover, .sc-smtick.is-hover { border-left-color: var(--sc-gold-ink); border-left-style: solid; }
.sc-tooltip { padding: 8px 12px; font-size: 12px; max-width: 260px; }
.sc-chip[data-tip] { cursor: default; }
.sc-chip[data-tip]:hover, .sc-chip.is-hover { box-shadow: 0 0 0 2px var(--sc-ink); }
.sc-chip--tri[data-tip]:hover, .sc-chip--tri.is-hover { box-shadow: 0 0 0 2px var(--sc-gold); }
.sc-legend__bars { display: inline-flex; flex-direction: column; gap: 2px; width: 22px; }
.sc-legend__thin { display: block; height: 3px; border-radius: 1px; background: linear-gradient(90deg, var(--sc-d-mid) 50%, var(--sc-r-mid) 50%); }
.sc-legend__thick { display: block; height: 7px; border-radius: 1px; background: linear-gradient(90deg, var(--sc-d-mid) 50%, var(--sc-r-mid) 50%); }
.sc-bar--before .sc-seg[data-tip]:hover, .sc-bar--before .sc-seg.is-hover { box-shadow: inset 0 0 0 1px var(--sc-ink); }

/* Zoomed state block at the top of a state's section (same language as the card, larger). */
.ev-leg--scorecard { display: block; }
.sc-zoom { margin: 6px 0 14px; padding: 14px 16px; border: 1px solid var(--sc-line); border-radius: 8px; background: #fff; }
.sc-zoom__badges { display: flex; gap: 6px; flex-wrap: wrap; margin-bottom: 10px; }
.sc-zoom .sc-pill { font-size: 11px; padding: 3px 9px; }
.sc-zoom__row { display: grid; grid-template-columns: 150px 1fr; gap: 14px; align-items: center; padding: 8px 0; border-top: 1px solid #eef2f5; }
.sc-zoom__row:first-of-type { border-top: 0; }
.sc-zoom__label { display: flex; flex-direction: column; line-height: 1.2; }
.sc-zoom__ch { font-size: 14px; font-weight: 800; }
.sc-zoom__sub { font-size: 11px; color: var(--sc-muted); }
.sc-zoom .sc-row { height: auto; gap: 12px; }
.sc-zoom .sc-bars { gap: 5px; }
.sc-zoom .sc-bar--before { height: 9px; }
.sc-zoom .sc-bar--after { height: 24px; }
.sc-zoom .sc-maj { height: 42px; top: -2px; }
.sc-zoom .sc-smtick { top: 12px; height: 28px; }
.sc-zoom .sc-nums { width: 70px; }
.sc-zoom .sc-nums__before { font-size: 12px; }
.sc-zoom .sc-nums__after { font-size: 17px; }
.sc-zoom .sc-nums__left { font-size: 11px; }
.sc-zoom .sc-offices { gap: 8px; }
.sc-zoom .sc-off { width: 34px; height: 34px; font-size: 11px; }
.sc-zoom__legend { margin-top: 10px; padding-top: 10px; border-top: 1px solid #eef2f5; }
@media (max-width: 640px) { .sc-zoom__row { grid-template-columns: 1fr; gap: 6px; } }

/* Supermajority tick carries its party: deep blue for a Democratic line, deep red for a Republican one. */
.sc-smtick[data-tip]:hover, .sc-smtick.is-hover { border-left-style: dotted; border-left-color: var(--sc-ink); }
/* Zoomed state block: taller tick, no label (the hover carries the fraction). */
.sc-zoom .sc-smtick { top: 14px; height: 30px; }

.sc-num-d { color: var(--sc-d-flip); }
.sc-num-r { color: var(--sc-r-flip); }
