/* Election Analysis (/electionanalysis). Builds on election-dashboard.css and election-results.css. */
.ea-page { --ea-dem: var(--party-dem, #3F66C9); --ea-rep: var(--party-rep, #B23B3B); --ea-uaf: #9CAFC9; --ea-oth: #64748B; }
.ea-page #eaStartup[hidden], .ea-page #eaRetry[hidden], .ea-page .er-live[hidden] { display: none !important; }
.ea-hero-links { display: flex; flex-wrap: wrap; gap: 8px; }
.ea-hero-links .lr-share { min-height: 44px; text-decoration: none; }
.ea-mount { display: flex; flex-direction: column; gap: 20px; }
.ea-card { display: flex; flex-direction: column; gap: 18px; }
.ea-cardhead { display: flex; flex-wrap: wrap; justify-content: space-between; align-items: center; gap: 12px; }
.ea-cardhead .lr-cap { margin-top: 4px; }
.ea-muted { color: var(--muted, #64748B); font-size: 13px; }
.ea-small { display: block; margin-top: 4px; color: var(--muted, #64748B); font-size: 12px; white-space: nowrap; }
.ea-note { margin: 0; color: var(--muted, #64748B); font-size: 13px; line-height: 1.5; }
.ea-warn { margin: 0; padding: 10px 12px; border-radius: 10px; background: var(--amber-soft, #FEF3C7); color: #78350F; font-size: 13px; line-height: 1.5; }
.ea-small--warn { color: #92400E; font-weight: 600; white-space: normal; }
.ea-subtitle { margin: -8px 0 0; }
.ea-about { margin: -10px 0 0; font-size: 13px; }
.ea-source { margin: 4px 0 0; color: var(--muted, #64748B); font-size: 13px; line-height: 1.55; }

.ea-controls { display: flex; flex-wrap: wrap; align-items: center; gap: 8px; }
.ea-controls label { font-size: 13px; font-weight: 600; color: var(--muted, #64748B); }
.ea-select { min-height: 44px; max-width: 100%; padding: 0 12px; border: 1px solid var(--border-2, #D5DBE3); border-radius: 10px; background: #fff; color: var(--purple-800); font: 600 14px var(--font-body); }
.ea-select:hover { border-color: var(--purple-400); }
.ea-select:focus-visible, .ea-chip:focus-visible, .ea-link:focus-visible, .ea-card [tabindex]:focus-visible { outline: 2px solid var(--purple-400); outline-offset: 2px; }
.ea-chip { min-height: 44px; padding: 0 14px; border-radius: 999px; border: 1px solid var(--border-2, #D5DBE3); background: #fff; color: var(--purple-800); font: 600 13px var(--font-body); cursor: pointer; }
.ea-chip[aria-pressed=true] { border-color: var(--purple-800); background: var(--purple-800); color: #fff; }

/* Pipeline */
.ea-pipe { position: relative; height: 36px; border-radius: 10px; background: var(--surface-2, #F5F6F7); border: 1px solid var(--border); overflow: hidden; }
.ea-pipe span { position: absolute; left: 0; top: 0; bottom: 0; }
.ea-pipe-returned { background: var(--purple-200, #D9C7E6); }
.ea-pipe-counted { background: var(--purple-800); }
.ea-stats { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 16px; }
.ea-stat { display: flex; flex-direction: column; gap: 2px; min-width: 0; }
.ea-stat-label { display: flex; align-items: center; gap: 6px; font-size: 12px; font-weight: 600; color: var(--muted, #64748B); }
.ea-stat strong { font: 600 24px/1.2 var(--font-display); color: var(--purple-800); font-variant-numeric: tabular-nums; }

/* Swatches and bars */
.ea-sw { display: inline-block; flex: none; width: 10px; height: 10px; border-radius: 3px; }
.ea-sw--dem, .ea-seg--dem { background: var(--ea-dem); }
.ea-sw--rep, .ea-seg--rep { background: var(--ea-rep); }
.ea-sw--uaf, .ea-seg--uaf { background: var(--ea-uaf); }
.ea-sw--oth, .ea-seg--oth { background: var(--ea-oth); }
.ea-seg--oth2 { background: var(--blue-200, #C7D4E7); }
.ea-sw--yes, .ea-seg--yes { background: var(--green-700, #15803D); }
.ea-sw--no, .ea-seg--no { background: #8093AE; }
.ea-sw--counted { background: var(--purple-800); }
.ea-sw--returned { background: var(--purple-200, #D9C7E6); }
.ea-page .ea-card .ea-results-oth { background: var(--blue-200, #C7D4E7); }
.ea-stack { display: flex; height: 14px; border-radius: 4px; overflow: hidden; background: var(--surface-2, #F5F6F7); min-width: 100px; }
.ea-stack--lg { height: 28px; border-radius: 8px; }
.ea-stack--xl { height: 36px; border-radius: 10px; }
.ea-seg { display: block; height: 100%; }
.ea-seg + .ea-seg { box-shadow: inset 1px 0 0 #fff; }

/* Compare panels */
.ea-pair { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 24px; }
.ea-panel { display: flex; flex-direction: column; gap: 14px; padding: 20px; border-radius: 12px; background: var(--surface-3, #FAFBFC); border: 1px solid var(--border); min-width: 0; }
.ea-panel h3 { margin: 0; font: 600 17px var(--font-display); color: var(--purple-800); }
.ea-panel-head { display: flex; flex-direction: column; gap: 2px; }
.ea-kicker { font-size: 12px; font-weight: 700; letter-spacing: .1em; text-transform: uppercase; color: var(--purple-400, #8B67A2); }
.ea-rows { display: flex; flex-direction: column; gap: 10px; }
.ea-row { display: grid; grid-template-columns: minmax(0, 1fr) auto 120px; gap: 12px; align-items: baseline; font-size: 14px; }
.ea-row-name { display: flex; align-items: center; gap: 8px; color: var(--purple-800); font-weight: 600; min-width: 0; }
.ea-row strong { color: var(--purple-800); font-variant-numeric: tabular-nums; }
.ea-row-note { text-align: right; font-variant-numeric: tabular-nums; }

.ea-callout { display: flex; flex-wrap: wrap; align-items: center; gap: 20px; padding: 18px 20px; border-radius: 12px; background: var(--purple-50, #F7F3FA); border: 1px solid var(--purple-100, #EDE4F3); }
.ea-callout > p { flex: 1 1 380px; margin: 0; font-size: 15px; line-height: 1.5; color: var(--purple-800); }
.ea-dumb-wrap { flex: 1 1 380px; display: flex; flex-direction: column; gap: 6px; }
.ea-dumb-scale, .ea-th-scale { display: flex; justify-content: space-between; gap: 8px; font-size: 12px; color: var(--muted, #64748B); }
.ea-dumb { position: relative; height: 28px; min-width: 160px; }
.ea-dumb--lg { height: 34px; }
.ea-dumb-axis { position: absolute; left: 0; right: 0; top: 50%; height: 2px; margin-top: -1px; background: var(--border-2, #D5DBE3); }
.ea-dumb-mid { position: absolute; left: 50%; top: 3px; bottom: 3px; width: 1px; background: #8093AE; }
.ea-dumb-link { position: absolute; top: 50%; height: 4px; margin-top: -2px; border-radius: 2px; background: var(--purple-300, #B594C8); }
.ea-dot { position: absolute; top: 50%; width: 14px; height: 14px; margin: -7px 0 0 -7px; border-radius: 50%; box-sizing: border-box; }
.ea-dumb--lg .ea-dot { width: 18px; height: 18px; margin: -9px 0 0 -9px; }
.ea-dot--edge { background: #fff; border: 3px solid var(--purple-700); }
.ea-dot--margin { background: var(--purple-700); }
.ea-key-edge, .ea-key-margin { display: inline-block; width: 12px; height: 12px; border-radius: 50%; box-sizing: border-box; }
.ea-key-edge { background: #fff; border: 3px solid var(--purple-700); }
.ea-key-margin { background: var(--purple-700); }

/* Estimate */
.ea-estimate-head { display: flex; flex-direction: column; gap: 8px; }
.ea-estimate-head h2 { margin: 0; }
.ea-estimate-head p { margin: 0; max-width: 78ch; line-height: 1.5; font-size: 14.5px; }
.ea-flag { align-self: flex-start; padding: 4px 10px; border-radius: 999px; background: var(--amber-soft, #FEF3C7); color: #92400E; font-size: 12px; font-weight: 700; letter-spacing: .06em; text-transform: uppercase; }
.ea-slider { display: flex; flex-direction: column; gap: 4px; }
.ea-slider-head { display: flex; justify-content: space-between; align-items: baseline; gap: 12px; }
.ea-slider label { font-size: 14px; font-weight: 600; color: var(--purple-800); }
.ea-slider input { width: 100%; min-height: 44px; accent-color: var(--purple-700); }
.ea-out { font: 600 20px var(--font-display); }
.ea-out--dem, .ea-c-dem { color: var(--ea-dem); }
.ea-out--rep, .ea-c-rep { color: var(--ea-rep); }
.ea-assume { margin: 0; padding: 12px 14px; border-radius: 10px; background: var(--surface-2, #F5F6F7); color: var(--muted, #64748B); font-size: 13px; line-height: 1.5; }
.ea-assume strong { color: var(--purple-800); }
.ea-est-nums { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 12px; }
.ea-est-nums div { display: flex; flex-direction: column; gap: 2px; }
.ea-est-nums strong { font: 600 28px/1.15 var(--font-display); color: var(--purple-800); font-variant-numeric: tabular-nums; }
.ea-est-nums strong.ea-c-dem { color: var(--ea-dem); }
.ea-est-nums strong.ea-c-rep { color: var(--ea-rep); }
.ea-callout-text { margin: 0; padding: 14px 16px; border-radius: 10px; background: var(--purple-50, #F7F3FA); border: 1px solid var(--purple-100, #EDE4F3); font-size: 14.5px; line-height: 1.5; color: var(--purple-800); }
.ea-sum { display: grid; grid-template-columns: minmax(0, 1fr) auto auto; gap: 6px 16px; font-size: 14px; color: var(--purple-800); font-variant-numeric: tabular-nums; }
.ea-sum > :nth-child(3n+2), .ea-sum > :nth-child(3n) { text-align: right; }

/* County table */
.ea-legend { display: flex; flex-wrap: wrap; gap: 8px 18px; font-size: 13px; color: var(--muted, #64748B); }
.ea-legend > span { display: inline-flex; align-items: center; gap: 6px; }
.ea-table-scroll { overflow-x: auto; border: 1px solid var(--border); border-radius: 12px; }
.ea-table { width: 100%; min-width: 940px; border-collapse: collapse; font-size: 14px; color: var(--purple-800); }
.ea-table--measure { min-width: 760px; }
.ea-table th, .ea-table td { padding: 12px 10px; border-bottom: 1px solid var(--border); text-align: left; vertical-align: middle; }
.ea-table thead th { font-size: 12px; font-weight: 700; letter-spacing: .05em; text-transform: uppercase; color: var(--muted, #64748B); background: var(--surface-3, #FAFBFC); }
.ea-table tbody tr:last-child > * { border-bottom: 0; }
.ea-table tbody th { font-weight: 700; }
.ea-table td { font-variant-numeric: tabular-nums; }
.ea-table .ea-num { text-align: right; white-space: nowrap; }
.ea-th-scale { min-width: 170px; text-transform: none; letter-spacing: 0; font-weight: 600; }
.ea-link { padding: 0; min-height: 32px; border: 0; background: none; color: var(--purple-800); font: 700 14px var(--font-body); text-align: left; cursor: pointer; text-decoration: underline; text-decoration-color: var(--purple-200); text-underline-offset: 3px; }
.ea-link:hover { text-decoration-color: var(--purple-500); }
.ea-mini { height: 8px; border-radius: 4px; background: var(--purple-100, #EDE4F3); overflow: hidden; min-width: 100px; }
.ea-mini span { display: block; height: 100%; background: var(--purple-800); }
.ea-more { align-self: flex-start; min-height: 44px; }

/* Ages */
.ea-ages { display: grid; grid-template-columns: repeat(6, minmax(0, 1fr)); gap: 14px; align-items: end; }
.ea-age { display: flex; flex-direction: column; gap: 4px; min-width: 0; font-size: 14px; color: var(--purple-800); }
.ea-age-bar { height: 120px; display: flex; align-items: flex-end; }
.ea-age-bar span { display: block; width: 100%; border-radius: 6px 6px 0 0; background: var(--purple-500, #72488C); }

@media (max-width: 860px) {
  .ea-pair { grid-template-columns: minmax(0, 1fr); }
  .ea-stats { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .ea-ages { grid-template-columns: repeat(3, minmax(0, 1fr)); }
}
.ea-mobile-links { display: none; }
/* Below this width the county table becomes a stack of cards, so nothing scrolls sideways. */
@media (max-width: 760px) {
  .ea-table-scroll { overflow: visible; border: 0; border-radius: 0; }
  .ea-table, .ea-table--measure, .ea-table tbody { display: block; min-width: 0; }
  .ea-table thead { position: absolute; width: 1px; height: 1px; overflow: hidden; clip-path: inset(50%); }
  .ea-table tbody tr { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 12px; margin-bottom: 10px; padding: 12px; border: 1px solid var(--border); border-radius: 12px; }
  .ea-table tbody tr:last-child { margin-bottom: 0; }
  .ea-table tbody th, .ea-table tbody td { display: block; min-width: 0; padding: 0; border: 0; }
  .ea-table .ea-wide { grid-column: 1 / -1; }
  .ea-table td[data-label]::before { content: attr(data-label); display: block; margin-bottom: 4px; color: var(--muted, #64748B); font-size: 11px; font-weight: 700; letter-spacing: .05em; text-transform: uppercase; }
  /* The gap sits beside the county name, so each card stays short. */
  .ea-table tbody th { grid-column: 1; grid-row: 1; align-self: center; }
  .ea-table--measure tbody th { grid-column: 1 / -1; }
  .ea-table .ea-num { grid-column: 2; grid-row: 1; text-align: right; white-space: normal; }
  .ea-table .ea-small { white-space: normal; }
  .ea-mini, .ea-stack, .ea-dumb { min-width: 0; }
}
@media (max-width: 600px) {
  .ea-wrap > .lr-hero .ea-hero-links { display: none; }
  .ea-mobile-links { display: flex; margin-top: 24px; }
  .ea-mobile-links .lr-share { flex: 1 1 auto; justify-content: center; }
  .ea-card.lr-card { padding: 16px; }
  .ea-panel { padding: 14px; }
  .ea-row { grid-template-columns: minmax(0, 1fr) auto; }
  .ea-row-note { grid-column: 1 / -1; margin-top: -8px; text-align: left; }
  .ea-stat strong { font-size: 20px; }
  .ea-controls { width: 100%; }
  .ea-controls .ea-select { flex: 1 1 100%; }
  .ea-est-nums strong { font-size: 22px; }
  .ea-callout { padding: 14px; }
}
