/* Texas Paths to Victory scenario explorer. Builds on styles.css tokens. */
.txsim-intro { padding: var(--s-6) 0 var(--s-4); border-bottom: 1px solid var(--rule); }
.txsim-intro h1 { margin: var(--s-2) 0; font-size: clamp(32px, 5.4vw, 52px); line-height: 1.04; letter-spacing: -.015em; }
.txsim-vs { color: var(--muted); font-size: .62em; font-style: italic; font-weight: 400; }
.txsim-intro .txsim-dek { margin: 0 0 var(--s-3); max-width: var(--measure); color: var(--ink-soft); font-family: var(--serif); font-size: 19px; line-height: 1.45; }
.txsim-kicker { margin: 0; color: var(--amber); font-size: 12px; font-weight: 700; letter-spacing: .11em; text-transform: uppercase; }
.txsim-notice { max-width: var(--measure); margin: var(--s-3) 0 0; padding: var(--s-3) var(--s-4); border-left: 3px solid var(--amber); background: var(--amber-pale); color: var(--ink); font-size: 14px; line-height: 1.5; }
.txsim-notice a { color: var(--ink); }
.txsim-error { margin: var(--s-4) 0; padding: var(--s-3) var(--s-4); border: 1px solid var(--red); background: var(--red-pale); }

.txsim-section { margin-top: var(--s-6); }
.txsim-section > h2 { margin: 0 0 var(--s-1); font-size: 22px; }
.txsim-help { margin: 0 0 var(--s-3); max-width: var(--measure); color: var(--muted); font-size: 13.5px; line-height: 1.5; }
.txsim-help strong { color: var(--ink-soft); }
.dem-margin { color: var(--blue); }
.rep-margin { color: var(--red); }
.even-margin { color: var(--ink); }
.dem-text { color: var(--blue); }
.rep-text { color: var(--red); }

/* Statewide tally. */
.txsim-tally { padding: var(--s-3) var(--s-4); border: 1px solid var(--rule); border-radius: 6px; background: rgba(23, 25, 27, .97); backdrop-filter: blur(6px); }
.txsim-tally-label { margin: 0 0 var(--s-2); color: var(--amber); font-size: 11px; font-weight: 700; letter-spacing: .11em; text-transform: uppercase; }
.txsim-tally-grid { display: grid; grid-template-columns: 1fr auto 1fr; align-items: end; gap: var(--s-3); }
.txsim-cand { min-width: 0; }
.txsim-cand--rep { text-align: right; }
.txsim-cand-name { display: block; overflow: hidden; color: var(--ink-soft); font-size: 13px; text-overflow: ellipsis; white-space: nowrap; }
.txsim-cand-votes { display: block; font-size: clamp(18px, 3.4vw, 24px); font-weight: 700; font-variant-numeric: tabular-nums; }
.txsim-cand--dem .txsim-cand-votes { color: var(--blue); }
.txsim-cand--rep .txsim-cand-votes { color: var(--red); }
.txsim-cand-share { color: var(--muted); font-size: 13px; font-variant-numeric: tabular-nums; }
.txsim-center { text-align: center; }
.txsim-leader { display: block; margin-bottom: 2px; color: var(--muted); font-size: 11px; font-weight: 700; letter-spacing: .1em; text-transform: uppercase; }
.txsim-margin { display: block; font-family: var(--serif); font-size: clamp(26px, 5vw, 36px); font-weight: 700; line-height: 1; font-variant-numeric: tabular-nums; }
.txsim-net { display: block; margin-top: 4px; color: var(--muted); font-size: 12.5px; font-variant-numeric: tabular-nums; }
.txsim-bar { position: relative; height: 8px; margin-top: var(--s-3); overflow: visible; border-radius: 4px; background: var(--red); --dem-share: 50%; }
.txsim-bar::before { content: ""; position: absolute; inset: 0 auto 0 0; width: var(--dem-share); border-radius: 4px 0 0 4px; background: var(--blue); transition: width .18s ease-out; }
.txsim-bar::after { content: ""; position: absolute; top: -4px; bottom: -4px; left: 50%; width: 2px; background: var(--ink); }
.txsim-change { margin: var(--s-2) 0 0; color: var(--ink-soft); font-size: 13px; font-variant-numeric: tabular-nums; }
.txsim-flip { margin: 2px 0 0; color: var(--muted); font-size: 12.5px; line-height: 1.4; }

/* Map color mode and legend. */
.txsim-maptools { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: var(--s-2) var(--s-4); margin-top: var(--s-3); }
.txsim-colormode { display: flex; align-items: center; gap: var(--s-2); }
.txsim-colormode label { color: var(--muted); font-size: 12px; font-weight: 700; letter-spacing: .06em; text-transform: uppercase; white-space: nowrap; }
.txsim-colormode select { max-width: 100%; padding: 6px 10px; border: 1px solid var(--rule); border-radius: 4px; background: var(--masthead); color: var(--ink); font: inherit; font-size: 14px; }
.txsim-legend { display: flex; align-items: center; gap: var(--s-2); color: var(--muted); font-size: 12px; font-variant-numeric: tabular-nums; }
.txsim-legend-bar { display: block; width: 160px; height: 9px; border-radius: 5px; }
.txsim-legend-end { white-space: nowrap; }
.txsim-start-label { margin: var(--s-1) 0 0; color: var(--muted-light); font-size: 12px; }

/* Control panel blocks. */
.txsim-block { padding: var(--s-4) 0; border-bottom: 1px solid var(--rule); }
.txsim-block:first-child { padding-top: 0; }
.txsim-block h2 { display: flex; align-items: center; gap: 10px; margin: 0 0 var(--s-1); font-size: 19px; }
.txsim-block .txsim-subhead { color: var(--muted); font-size: 12px; font-weight: 700; letter-spacing: .08em; text-transform: uppercase; }
.txsim-block-head { display: flex; align-items: center; justify-content: space-between; gap: var(--s-3); }
.txsim-step { display: inline-grid; place-items: center; width: 24px; height: 24px; border: 1px solid var(--amber); border-radius: 50%; color: var(--amber); font-family: var(--sans); font-size: 13px; font-weight: 700; }
.txsim-reset { padding: 6px 12px; font-size: 13px; }
.txsim-reset[disabled] { opacity: .45; cursor: default; }

.txsim-starts { display: grid; gap: 6px; }
.txsim-start { display: grid; grid-template-columns: auto minmax(0, 1fr) auto; align-items: center; gap: 10px; padding: 9px 12px; border: 1px solid var(--rule); border-radius: 6px; background: var(--masthead); cursor: pointer; transition: border-color .12s, background .12s; }
.txsim-start:hover { border-color: #565b61; }
.txsim-start:has(input:checked) { border-color: var(--amber); background: #1f1c14; }
.txsim-start input { margin: 0; accent-color: var(--amber); }
.txsim-start input:focus-visible { outline: 2px solid var(--focus); outline-offset: 2px; }
.txsim-start-text { min-width: 0; }
.txsim-start-text strong { display: block; color: var(--ink); font-size: 14.5px; }
.txsim-start-detail { display: block; overflow: hidden; color: var(--muted); font-size: 12px; text-overflow: ellipsis; white-space: nowrap; }
.txsim-start-margin { font-size: 14px; font-weight: 700; font-variant-numeric: tabular-nums; white-space: nowrap; }
.txsim-start-note { min-height: 1.3em; margin: var(--s-2) 0 0; color: var(--muted); font-size: 12.5px; }

.txsim-paths { display: grid; grid-template-columns: 1fr 1fr; gap: var(--s-3); }
.txsim-paths-label { margin: 0 0 6px; font-size: 12px; font-weight: 700; letter-spacing: .08em; text-transform: uppercase; }
.txsim-path-list { display: grid; gap: 6px; }
.txsim-path { display: block; width: 100%; padding: 9px 11px 10px; border: 1px solid var(--rule); border-left: 3px solid var(--path-color); border-radius: 0 6px 6px 0; background: var(--masthead); color: var(--ink); font: inherit; text-align: left; cursor: pointer; transition: background .12s, border-color .12s; }
.txsim-path--dem { --path-color: var(--blue); }
.txsim-path--rep { --path-color: var(--red); }
.txsim-path:hover { background: #1e2023; }
.txsim-path:focus-visible { outline: 2px solid var(--focus); outline-offset: 2px; }
.txsim-path[aria-pressed="true"] { border-color: var(--path-color); background: color-mix(in srgb, var(--path-color) 14%, var(--masthead)); }
.txsim-path-head { display: flex; align-items: baseline; justify-content: space-between; gap: 8px; }
.txsim-path-head strong { font-size: 14px; line-height: 1.25; }
.txsim-path-result { font-size: 13px; font-weight: 700; font-variant-numeric: tabular-nums; white-space: nowrap; }
.txsim-path-summary { display: block; margin-top: 4px; color: var(--muted); font-size: 12px; line-height: 1.4; }

.txsim-changes { margin: 0; padding-left: 18px; font-size: 13.5px; line-height: 1.5; }
.txsim-changes-empty { margin: 0; color: var(--muted); font-size: 13.5px; }

.txsim-controls-section { border-bottom: 0; }
.txsim-controls { display: grid; grid-template-columns: repeat(auto-fill, minmax(260px, 1fr)); gap: var(--s-3); }
.txsim-region { min-width: 0; margin: 0; padding: var(--s-3); border: 1px solid var(--rule); border-radius: 6px; background: var(--masthead); }
.txsim-region.is-changed { border-color: var(--amber); }
.txsim-region legend { padding: 0 4px; font-weight: 700; }
.txsim-region-summary { margin: 0 0 var(--s-2); color: var(--muted); font-size: 12px; font-variant-numeric: tabular-nums; }
.txsim-slider + .txsim-slider { margin-top: var(--s-2); }
.txsim-slider-head { display: flex; justify-content: space-between; gap: var(--s-2); font-size: 13px; }
.txsim-slider-head label { color: var(--ink-soft); }
.txsim-slider-head output { color: var(--ink); font-variant-numeric: tabular-nums; white-space: nowrap; }
.txsim-slider input[type="range"] { width: 100%; height: 26px; margin: 2px 0 0; accent-color: var(--amber); }
.txsim-slider input[type="range"]:focus-visible { outline: 2px solid var(--focus); outline-offset: 2px; }
.txsim-slider-scale { display: flex; justify-content: space-between; margin-top: -3px; color: var(--muted-light); font-size: 10.5px; font-variant-numeric: tabular-nums; }

.txsim-map .localized-layout { margin-top: var(--s-2); }
.txsim-detail-extra:empty { display: none; }

/* Workspace: controls on the left, a large sticky map and tally on the right,
   following the race page's side-by-side layout. */
.txsim-workspace { margin-top: var(--s-5); }
@media (min-width: 1001px) {
  .txsim-workspace { display: grid; grid-template-columns: minmax(320px, 1fr) minmax(0, 2.05fr); gap: var(--s-6); align-items: start; }
  .txsim-panel { grid-column: 1; grid-row: 1; min-width: 0; }
  .txsim-stage { grid-column: 2; grid-row: 1; position: sticky; top: calc(56px + var(--s-3)); min-width: 0; }
  .txsim-stage .localized-detail { display: none; }
  .txsim-stage .localized-panel { margin-top: 0; }
  .txsim-stage .localized-layout { display: block; min-height: 0; margin-top: 0; }
  .txsim-stage .localized-map-wrap { padding: var(--s-1) 0 0; }
  .txsim-stage .localized-map { width: 100%; height: calc(100vh - 56px - 290px); min-height: 380px; max-height: none; }
  .txsim-stage .txsim-tally { padding: var(--s-2) var(--s-4) var(--s-3); }
  .txsim-stage .txsim-tally-label { display: none; }
  .txsim-stage .txsim-cand-votes { font-size: 22px; }
  .txsim-stage .txsim-bar { margin-top: var(--s-2); }
  .txsim-stage .txsim-maptools { margin-top: var(--s-2); }
  .txsim-panel .txsim-controls { grid-template-columns: 1fr; }
}
@media (min-width: 1001px) and (max-width: 1180px) {
  .txsim-paths { grid-template-columns: 1fr; }
}
@media (max-width: 1000px) {
  .txsim-workspace { display: flex; flex-direction: column; }
  .txsim-stage, .txsim-panel { display: contents; }
  .txsim-starts-block { order: 1; }
  .txsim-tally { order: 2; position: sticky; top: 56px; z-index: 5; margin-top: var(--s-3); }
  .txsim-maptools { order: 3; }
  .txsim-map, .localized-unavailable { order: 4; }
  .txsim-start-label { order: 5; }
  .txsim-paths-block { order: 6; }
  .txsim-changes-block { order: 7; }
  .txsim-controls-section { order: 8; }
  .txsim-block { padding: var(--s-4) 0; }
}

.txsim-table-wrap { overflow-x: auto; border: 1px solid var(--rule); border-radius: 4px; }
.txsim-ledger { width: 100%; min-width: 760px; border-collapse: collapse; font-size: 14px; font-variant-numeric: tabular-nums; }
.txsim-ledger caption { padding: var(--s-2) var(--s-3); color: var(--muted); font-size: 13px; text-align: left; }
.txsim-ledger th, .txsim-ledger td { padding: 8px 10px; border-top: 1px solid var(--rule-faint); text-align: right; white-space: nowrap; }
.txsim-ledger thead th { border-top: 0; color: var(--muted); font-size: 11px; font-weight: 700; letter-spacing: .06em; text-transform: uppercase; vertical-align: bottom; }
.txsim-ledger tbody th, .txsim-ledger tfoot th, .txsim-ledger thead th:first-child { text-align: left; }
.txsim-ledger tbody tr:hover { background: #1a1c1e; }
.txsim-ledger tbody tr.is-changed th { box-shadow: inset 3px 0 0 var(--amber); }
.txsim-ledger tfoot th, .txsim-ledger tfoot td { border-top: 2px solid var(--rule); font-weight: 700; }
.txsim-demo thead th { white-space: normal; }
.txsim-demo-source { margin-top: var(--s-2); font-size: 12.5px; }
.txsim-netbar-cell { width: 140px; }
.txsim-netbar { position: relative; display: block; height: 10px; background: var(--rule-faint); }
.txsim-netbar::after { content: ""; position: absolute; top: -3px; bottom: -3px; left: 50%; width: 1px; background: var(--muted); }
.txsim-netbar-fill { position: absolute; top: 0; bottom: 0; }
.txsim-netbar-fill.is-dem { left: 50%; background: var(--blue); }
.txsim-netbar-fill.is-rep { right: 50%; background: var(--red); }

.txsim-notes { max-width: var(--measure); color: var(--ink-soft); font-size: 14px; line-height: 1.55; }
.txsim-notes h3 { margin: var(--s-4) 0 var(--s-1); color: var(--ink); font-size: 15px; }
.txsim-notes ul { padding-left: 18px; }
.txsim-notes a { color: var(--ink); }

@media (max-width: 600px) {
  .txsim-tally { padding: var(--s-2) var(--s-3); }
  .txsim-tally-grid { gap: var(--s-2); }
  .txsim-tally-label, .txsim-flip { display: none; }
  .txsim-controls { grid-template-columns: 1fr; }
  .txsim-paths { grid-template-columns: 1fr; }
  .txsim-legend-bar { width: 110px; }
}
.txsim-table-wrap { position: relative; }
@media (max-width: 600px) {
  .txsim-maptools { flex-direction: column; align-items: stretch; }
  .txsim-colormode { flex-wrap: wrap; }
  .txsim-colormode select { flex: 1 1 100%; min-width: 0; }
  .txsim-legend { justify-content: space-between; }
}
.txsim-stage .localized-header { display: none; }
.txsim-statewide-card { margin-bottom: var(--s-3); border-color: #4a4e54; background: linear-gradient(180deg, #1d1f22, var(--masthead)); }
.txsim-statewide-card legend { color: var(--amber); }