/* General Sans (Indian Type Foundry, ITF Free Font License): self-hosting on
   our own site is allowed; the Fontshare CDN sends no CORS header, so a
   stylesheet link to it silently falls back to Lato. */
@font-face { font-family:'General Sans'; src:url('fonts/custom/general-sans/GeneralSans-Medium.woff2') format('woff2'); font-weight:500; font-display:swap; }
@font-face { font-family:'General Sans'; src:url('fonts/custom/general-sans/GeneralSans-Semibold.woff2') format('woff2'); font-weight:600; font-display:swap; }

*, *::before, *::after { box-sizing:border-box; margin:0; padding:0; }

button, [role="button"], [role="tab"], summary, .rs-chip, .rs-tag, .rs-hover, .rs-close, .rs-scale,
.rs-map svg, .rs-hist svg, .rs-card-meta, .rs-part-n, .rs-group-label, .rs-kind {
  user-select:none;
  -webkit-user-select:none;
  -webkit-touch-callout:none;
}

/* The score ramp is read by the JS from here.
   The ramp is one lightness run, purple to peach. */
:root {
  color-scheme:dark;
  --paper:#16131B;
  --card:#211C29;
  --card-2:#2B2535;
  --ink:#F3EEE8;
  --ink-2:#B9B1C1;
  --line:#3B3446;
  --score-0:#74309A;
  --score-1:#A6337F;
  --score-2:#D34A55;
  --score-3:#F2843A;
  --score-4:#FFCB8A;
  /* 60-30-10: the near-black ground is the 60, the map's colours the 30, and
     the accent the 10, only for what you can act on or have chosen: links,
     selection, focus. */
  --secondary:var(--score-4);
  --accent:#B58AE6;
  --tip-bg:#FFFFFF;
  --tip-ink:#16131B;
}

html { -webkit-text-size-adjust:100%; }
body { background:var(--paper); color:var(--ink); font:16px/1.55 Lato, system-ui, sans-serif; }
a { color:var(--ink); text-decoration-color:var(--accent); text-decoration-thickness:1.5px; text-underline-offset:3px; }
a:hover { color:var(--accent); }
main { width:min(1280px, 100% - 48px); margin-inline:auto; padding:12px 0 64px; }
.rs-muted { color:var(--ink-2); }
.rs-date { color:var(--ink-2); font-size:14px; }

/* Hero: a full-bleed band, the one place the page is not the page colour. */
.rs-wrap { width:min(1280px, 100% - 48px); margin-inline:auto; }
.rs-hero-grid { padding:36px 0 8px; }
.rs-title { font:500 clamp(34px, 1.2rem + 2.4vw, 52px)/1.08 'General Sans', Lato, sans-serif; letter-spacing:-.01em; color:var(--ink); }
.rs-hero-body { margin-top:16px; }
.rs-dek { font-size:18px; line-height:1.5; max-width:64ch; }
.rs-meta { color:var(--ink-2); font-size:14px; margin-top:8px; }

/* Tabs */
.rs-tabs { display:flex; gap:28px; border-bottom:1px solid var(--line); margin-bottom:20px; }
.rs-tabs [role="tab"] {
  font:inherit; font-size:16px; font-weight:700; color:var(--ink-2);
  background:none; border:0; border-bottom:3px solid transparent; padding:12px 0 10px; margin-bottom:-1px; cursor:pointer;
}
.rs-tabs [role="tab"]:hover { color:var(--ink); }
.rs-tabs [role="tab"][aria-selected="true"] { color:var(--ink); border-bottom-color:var(--accent); }
.rs-tabs [role="tab"]:focus-visible { outline:2px solid var(--accent); outline-offset:2px; }

/* Map + state panel */
.rs-map-wrap { display:grid; grid-template-columns:minmax(0,1.25fr) minmax(340px,1fr); gap:24px; align-items:start; }
.rs-map-col { display:grid; gap:10px; }
.rs-map-hint { display:flex; align-items:center; gap:10px; flex-wrap:wrap; color:var(--ink-2); font-size:16px; }
.rs-map { width:100%; }
.rs-map svg { width:100%; height:auto; display:block; }
.rs-map .st { stroke:var(--card); stroke-width:1; cursor:pointer; }
.rs-map .st:focus { outline:none; }
.rs-map .st:focus-visible { stroke:var(--accent); stroke-width:3; }
.rs-map circle.st.is-on { stroke:var(--accent); stroke-width:3; }
.rs-map .outline { fill:none; pointer-events:none; stroke-linejoin:round; }
.rs-map .outline.is-hover { stroke:var(--accent); stroke-width:2; }
.rs-map .outline.is-on { stroke:var(--accent); stroke-width:3.5; }
.rs-map .dc-label { font-size:14px; fill:var(--ink-2); }
.rs-scale { display:flex; flex-wrap:wrap; gap:4px 14px; font-size:14px; color:var(--ink-2); padding-top:10px; }
.rs-step { display:inline-flex; align-items:center; gap:6px; }
.rs-scale-note { font-size:14px; color:var(--ink-2); margin-top:6px; max-width:70ch; }
.rs-sw { display:inline-block; width:12px; height:12px; border-radius:2px; flex:none; }

.rs-state {
  padding:0 4px 24px 0;
  position:sticky; top:16px; max-height:calc(100vh - 32px); overflow:auto; overscroll-behavior:contain;
}
.rs-empty { color:var(--ink-2); }
.rs-state h2 { font:500 30px/1.15 'General Sans', Lato, sans-serif; letter-spacing:-.01em; }
.rs-headline { font:400 20px/1.5 Lato, sans-serif; margin-top:8px; }
.rs-state h3 { font-size:14px; font-weight:700; color:var(--ink-2); margin:22px 0 8px; }
.rs-state > p { font-size:16px; }

.rs-parts { display:grid; gap:14px; margin-top:16px; }
.rs-parts > div { display:grid; grid-template-columns:minmax(0,1fr) auto; gap:4px 12px; align-items:baseline; }
.rs-parts dt { color:var(--ink-2); font-size:14px; }
.rs-parts dd { display:contents; }
.rs-bar { grid-column:1 / -1; grid-row:2; height:6px; background:var(--line); border-radius:3px; overflow:hidden; }
.rs-bar span { display:block; height:100%; background:var(--score-3); border-radius:3px; }
.rs-part-n { grid-column:2; grid-row:1; font-size:14px; color:var(--ink); font-variant-numeric:tabular-nums; }
.rs-part-why { grid-column:1 / -1; grid-row:3; color:var(--ink-2); font-size:14px; }
.rs-total { padding-bottom:14px; border-bottom:1px solid var(--line); }
.rs-total dt, .rs-total .rs-part-n { color:var(--ink); font-weight:700; }

/* Person cards */
.rs-cards { list-style:none; border-bottom:1px solid var(--line); }
.rs-cards li { border-top:1px solid var(--line); }
.rs-card {
  font:inherit; text-align:left; width:100%; display:grid; grid-template-columns:56px minmax(0,1fr); gap:12px;
  background:none; border:0; padding:14px 0; cursor:pointer; color:var(--ink);
}
.rs-card:hover .rs-card-name { text-decoration:underline; text-decoration-color:var(--accent); text-underline-offset:3px; }
.rs-card:focus-visible { outline:2px solid var(--accent); outline-offset:-2px; }
.rs-card-body { display:grid; gap:3px; min-width:0; }
.rs-card-name { font-weight:700; }
.rs-card-office { font-size:14px; color:var(--ink-2); }
.rs-card-said { font-size:14px; display:-webkit-box; -webkit-line-clamp:3; -webkit-box-orient:vertical; overflow:hidden; }
.rs-card-meta { display:flex; flex-wrap:wrap; gap:4px 10px; font-size:12px; color:var(--ink-2); margin-top:2px; }

.rs-face { width:56px; height:56px; border-radius:4px; object-fit:cover; object-position:50% 20%; background:var(--card-2); display:block; }
.rs-face-none { display:grid; place-items:center; font-size:16px; font-weight:700; color:var(--ink-2); }
.rs-face.sm { width:28px; height:28px; font-size:12px; display:inline-grid; vertical-align:middle; margin-right:8px; }
img.rs-face.sm { display:inline-block; }
.rs-face.lg { width:112px; height:112px; font-size:28px; flex:none; }

.rs-items { list-style:none; display:grid; gap:10px; font-size:14px; }
.rs-items li { display:grid; grid-template-columns:92px minmax(0,1fr); gap:10px; }
.rs-sec { border-top:1px solid var(--line); }
.rs-sec:first-of-type { margin-top:24px; }
.rs-sec:last-of-type { border-bottom:1px solid var(--line); }
/* The browser's own disclosure triangle is removed in both engines; the
   open/closed sign is the + / − drawn after the label. */
.rs-sec summary {
  list-style:none; cursor:pointer; font-weight:700; font-size:16px;
  display:flex; justify-content:space-between; align-items:center; gap:16px;
  min-height:44px; padding:8px 0;
}
.rs-sec summary::-webkit-details-marker { display:none; }
.rs-sec summary::after { content:'+'; font-size:20px; font-weight:400; color:var(--ink-2); line-height:1; }
.rs-sec[open] summary::after { content:'\2212'; }
.rs-sec summary:focus-visible { outline:2px solid var(--accent); outline-offset:2px; }
.rs-sec p { font-size:16px; padding-bottom:14px; }
.rs-archive { font-size:14px; margin-top:16px; }

.rs-chip {
  font:inherit; font-size:16px; font-weight:400; line-height:1.2;
  display:inline-flex; align-items:center; gap:8px;
  min-height:44px; padding:0; border:0; border-bottom:2px solid transparent; border-radius:0;
  background:none; color:var(--ink-2); cursor:pointer;
}
.rs-chip:hover { color:var(--ink); }
.rs-chip[aria-pressed="true"] { color:var(--accent); border-bottom-color:var(--accent); font-weight:700; }
.rs-chip:focus-visible, .rs-close:focus-visible, .rs-name:focus-visible { outline:2px solid var(--accent); outline-offset:2px; }
.rs-tag { display:inline-flex; align-items:center; gap:6px; font-size:12px; font-weight:700; color:var(--ink-2); white-space:nowrap; }

/* Timeline */
.rs-hist { position:relative; margin-bottom:20px; }
.rs-hist svg { width:100%; height:auto; display:block; }
.rs-hist .grid line { stroke:var(--line); }
.rs-hist .axis text { font-size:12px; fill:var(--ink-2); }
.rs-hist .bar { cursor:pointer; }
.rs-hist .hit { fill:transparent; }
.rs-hist .line { fill:none; stroke:var(--secondary); stroke-width:2px; stroke-linejoin:round; stroke-linecap:round; }
.rs-hist .rule, .rs-hist .dot { visibility:hidden; pointer-events:none; }
.rs-hist .rule { stroke:var(--ink-2); stroke-width:1px; }
.rs-hist .dot { fill:var(--accent); stroke:var(--paper); stroke-width:2px; }
.rs-hist .bar.is-hover :is(.rule, .dot), .rs-hist .bar:focus-visible :is(.rule, .dot) { visibility:visible; }
.rs-hist .bar:focus { outline:none; }
.rs-hover {
  position:absolute; pointer-events:none; max-width:280px; z-index:3;
  background:var(--tip-bg); color:var(--tip-ink); box-shadow:0 6px 20px rgba(0,0,0,.4); font-size:14px; line-height:1.4; padding:7px 10px; border-radius:4px;
}
.rs-hover b { display:block; font-weight:700; }
.rs-controls { display:flex; flex-wrap:wrap; align-items:center; gap:8px 56px; margin-bottom:24px; }
.rs-group { display:flex; flex-wrap:wrap; align-items:center; gap:4px 24px; }
.rs-month { margin-top:48px; }
.rs-month h3 { font:500 24px/1.2 'General Sans', Lato, sans-serif; margin-bottom:10px; position:sticky; top:0; background:var(--paper); padding:6px 0; z-index:1; }
.rs-group-label { color:var(--ink-2); font-size:14px; margin-right:-8px; }
.rs-day {
  display:grid; grid-template-columns:120px minmax(0,1fr); gap:8px 16px; padding:20px 0;
}
.rs-day > .rs-date { font-weight:700; color:var(--ink); font-size:16px; padding-top:12px; }
.rs-speaker { display:grid; grid-template-columns:48px minmax(0,1fr); gap:14px; }
.rs-speaker + .rs-speaker { margin-top:20px; }
.rs-speaker > .rs-face { width:48px; height:48px; font-size:14px; }
.rs-said { list-style:none; }
.rs-said li { display:grid; grid-template-columns:52px minmax(0,1fr); gap:8px; padding:5px 0; }
.rs-said p { font-size:16px; }
.rs-kind { font-size:14px; color:var(--ink-2); padding-top:2px; }
.rs-who { display:flex; flex-wrap:wrap; align-items:center; gap:4px 12px; margin-bottom:4px; }
.rs-who .rs-muted { font-size:14px; }
.rs-name {
  font:inherit; font-weight:700; background:none; border:0; padding:0; color:var(--ink); cursor:pointer;
  display:inline-flex; align-items:center;
}
.rs-name:hover { text-decoration:underline; }
q { quotes:'\201C' '\201D'; }

/* Person dialog */
.rs-person {
  margin:auto; width:min(780px, calc(100vw - 32px)); max-height:calc(100vh - 48px);
  border:0; border-radius:4px; background:var(--card); color:var(--ink); padding:28px 28px 32px;
}
.rs-person::backdrop { background:rgba(8,6,12,.7); }
.rs-close {
  position:sticky; top:0; float:right; margin:-12px -12px 0 0; width:44px; height:44px; font-size:28px; line-height:1;
  background:var(--card); border:0; border-radius:0; color:var(--ink-2); cursor:pointer;
}
.rs-close:hover { color:var(--ink); }
.rs-person:focus { outline:none; }
.rs-p-top { display:flex; gap:18px; align-items:center; padding-right:40px; }
.rs-person h2 { font:500 30px/1.15 'General Sans', Lato, sans-serif; letter-spacing:-.01em; }
.rs-credit { font-size:12px; color:var(--ink-2); margin-top:6px; }
.rs-stance { font-size:20px; line-height:1.4; margin:16px 0 4px; }
.rs-person h3 { font-size:16px; font-weight:700; margin:22px 0 8px; display:flex; align-items:center; gap:8px; }
.rs-levers { padding-left:20px; display:grid; gap:4px; }
.rs-levers li::marker { color:var(--ink-2); }
.rs-seats { font-size:14px; margin-top:8px; }
.rs-split { display:grid; grid-template-columns:1fr 1fr; gap:20px; }
.rs-stmts { list-style:none; display:grid; gap:14px; font-size:14px; }
.rs-stmts .rs-date { display:block; font-size:14px; }
.rs-joint { list-style:none; display:grid; gap:12px; font-size:14px; }
.rs-mini { display:flex; flex-wrap:wrap; gap:5px; margin-top:6px; }
.rs-mini { gap:4px 18px; }
.rs-mini .rs-chip { font-size:14px; min-height:32px; color:var(--ink); text-decoration:underline; text-decoration-color:var(--accent); text-underline-offset:3px; }

.rs-foot { margin-top:80px; color:var(--ink-2); font-size:14px; max-width:80ch; }
.rs-foot p + p { margin-top:8px; }
.rs-foot p:empty { display:none; }

@media (max-width: 900px) {
  .rs-map-wrap { grid-template-columns:1fr; }
  .rs-state { position:static; max-height:none; }
  .rs-split { grid-template-columns:1fr; }
}
@media (max-width: 560px) {
  .rs-day, .rs-items li { grid-template-columns:1fr; }
  .rs-day > .rs-date { padding-top:0; }
  .rs-group-label { flex-basis:100%; margin:0; }
  .rs-person { padding:22px 18px 26px; }
  .rs-p-top { flex-direction:column; align-items:flex-start; }
}

/* Map notes: a square marker and a label for each state that acted, hidden on
   phones where the label has no room, since a bare marker explains nothing. They sit
   on the state's centre, so they must let clicks through to it. */
.rs-map .note { pointer-events:none; }
.rs-map .note rect { fill:var(--accent); stroke:none; }
.rs-map .note line { stroke:var(--ink); stroke-width:1.2; }
.rs-map .note text {
  font-family:Lato, system-ui, sans-serif; font-size:20px; font-weight:700; fill:var(--ink);
  paint-order:stroke; stroke:var(--paper); stroke-width:4px; stroke-linejoin:round; pointer-events:none;
}
.rs-map { position:relative; }
.rs-map .rs-hover b { margin-bottom:4px; }
.rs-hover ul { list-style:disc; padding-left:18px; }
@media (max-width: 600px) {
  .rs-map .note { display:none; }
}

/* The lead sentence reads as plain lead text. */
.rs-headline mark {
  color:var(--ink); background:none; padding:0;
}
@media (max-width: 560px) {
  .rs-hero-grid { padding:28px 0 4px; }
  .rs-dek { font-size:17px; }
  .rs-meta { display:none; }
}
@media (max-width: 560px) {
  .rs-wrap, main { width:calc(100% - 32px); }
}

/* The place picker sits inside the headline, set as the headline's own words;
   the underline is the only sign it can be changed. */
.rs-place {
  font:inherit; letter-spacing:inherit; color:inherit; background:none; border:0; padding:0; margin:0;
  border-bottom:3px solid var(--accent); cursor:pointer; text-align:left;
}
.rs-place:hover { border-bottom-width:4px; }
.rs-place:focus-visible { outline:2px solid var(--accent); outline-offset:4px; }

/* Place picker: a small panel under the headline word, holding a tile map. */
.rs-pick {
  position:fixed; margin:0; inset:auto; width:min(480px, calc(100vw - 24px)); max-height:none;
  border:0; border-radius:4px; padding:20px 20px 24px; background:var(--card); color:var(--ink);
  box-shadow:0 18px 48px rgba(0,0,0,.5);
}
.rs-pick::backdrop { background:rgba(8,6,12,.45); }
#rs-pick-find {
  display:block; width:100%; font:16px Lato, sans-serif; color:var(--ink); background:none;
  border:0; border-bottom:2px solid var(--line); border-radius:0; padding:8px 0; height:44px;
}
#rs-pick-find::placeholder { color:var(--ink-2); }
#rs-pick-find:focus { outline:none; border-bottom-color:var(--accent); }
.rs-pick-wide { display:flex; flex-wrap:wrap; gap:4px 24px; margin:12px 0 16px; }
.rs-pick-wide button { font:inherit; font-size:16px; color:var(--ink-2); background:none; border:0; border-bottom:2px solid transparent; padding:0; min-height:40px; cursor:pointer; }
.rs-pick-wide button:hover { color:var(--ink); }
.rs-pick-wide button[aria-current="true"] { color:var(--accent); border-bottom-color:var(--accent); font-weight:700; }
.rs-tiles { display:grid; grid-template-columns:repeat(11, minmax(0,1fr)); gap:3px; }
.rs-tiles button {
  aspect-ratio:1; border:0; border-radius:2px; padding:0; cursor:pointer;
  font:700 12px Lato, sans-serif; color:#16131B;
}
.rs-tiles button[data-tier="none"], .rs-tiles button[data-tier="adjacent"] { color:#FFFFFF; }
.rs-tiles button:hover { filter:brightness(1.15); }
.rs-tiles button[aria-current="true"] { box-shadow:inset 0 -4px 0 var(--ink); }
.rs-pick button.is-out { opacity:.18; }
.rs-pick button:focus-visible { outline:2px solid var(--ink); outline-offset:1px; }

/* Ranking: grouped by what each state did; one dot per state on a shared 0-100 line. */
.rs-tier { display:flex; justify-content:space-between; gap:12px; margin-top:28px !important; }
.rs-dotline { position:relative; height:12px; }
.rs-dotline::before { content:''; position:absolute; left:0; right:0; top:50%; height:1px; background:var(--line); }
.rs-dot { position:absolute; top:50%; width:10px; height:10px; border-radius:50%; transform:translate(-50%, -50%); }

/* Opening view: every state ranked by its score. Rows are separated by rules, not boxed. */
.rs-rank { list-style:none; border-bottom:1px solid var(--line); margin-top:12px; }
.rs-rank li { border-top:1px solid var(--line); }
.rs-rank button {
  font:inherit; color:var(--ink); background:none; border:0; width:100%; cursor:pointer; text-align:left;
  display:grid; grid-template-columns:minmax(0,1fr) minmax(90px,180px) 32px; gap:16px; align-items:center;
  min-height:40px; padding:6px 0;
}
.rs-rank button:hover .rs-rank-name { text-decoration:underline; text-decoration-color:var(--accent); text-underline-offset:3px; }
.rs-rank button:focus-visible { outline:2px solid var(--accent); outline-offset:2px; }
.rs-rank-n, .rs-rank-score { color:var(--ink-2); font-size:14px; font-variant-numeric:tabular-nums; }
.rs-rank-score { text-align:right; color:var(--ink); }

/* A button that reads as a link: text colour, accent underline, no box. */
.rs-link {
  font:inherit; color:var(--ink); background:none; border:0; padding:0; cursor:pointer;
  text-decoration:underline; text-decoration-color:var(--accent); text-decoration-thickness:1.5px; text-underline-offset:3px;
}
.rs-link:hover { color:var(--accent); }
.rs-link:focus-visible { outline:2px solid var(--accent); outline-offset:2px; }
.rs-fedlink { color:var(--ink-2); font-size:16px; margin-top:8px; }

/* Overview table: four raw counts per state, sortable, grouped by tier by default. */
.rs-table { width:100%; border-collapse:collapse; margin-top:16px; font-variant-numeric:tabular-nums; }
.rs-table th, .rs-table td { text-align:right; padding:8px 0 8px 12px; border-bottom:1px solid var(--line); font-size:14px; }
.rs-table th:first-child { text-align:left; padding-left:0; }
.rs-table thead th { vertical-align:bottom; color:var(--ink-2); font-weight:700; }
.rs-table thead button { font:inherit; color:inherit; background:none; border:0; padding:0; cursor:pointer; text-align:inherit; border-bottom:2px solid transparent; }
.rs-table thead th[aria-sort="ascending"] button, .rs-table thead th[aria-sort="descending"] button { color:var(--accent); border-bottom-color:var(--accent); }
.rs-table tbody th button { font:inherit; font-size:16px; font-weight:400; color:var(--ink); background:none; border:0; padding:0; cursor:pointer; text-align:left; }
.rs-table tbody th button:hover { text-decoration:underline; text-decoration-color:var(--accent); text-underline-offset:3px; }
.rs-table td { color:var(--ink); }
.rs-table .rs-tier-row th { text-align:left; color:var(--ink-2); font-size:14px; font-weight:700; padding-top:20px; }
.rs-table button:focus-visible { outline:2px solid var(--accent); outline-offset:2px; }
.rs-defs { display:grid; gap:8px; margin-top:20px; font-size:14px; }
.rs-defs dt { font-weight:700; }
.rs-defs dd { color:var(--ink-2); }
.rs-state .rs-tierline { font-size:16px; margin-top:12px; }
.rs-counts { display:grid; gap:12px; margin-top:12px; }
.rs-counts dt { font-size:14px; color:var(--ink-2); }
.rs-counts dd { display:grid; grid-template-columns:3ch minmax(0,1fr); gap:12px; align-items:baseline; }
.rs-counts dd b { font:500 24px/1 'General Sans', Lato, sans-serif; font-variant-numeric:tabular-nums; }
.rs-counts dd span { font-size:14px; color:var(--ink-2); }