:root { --font-sans: ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif; }
body { font-family: var(--font-sans); }
button, input, select, textarea { font-family: inherit; }
.app-shell, .app-shell > section, .party-view, .party-dashboard, .party-candidate-table, .explore-view, #explore-result { min-width: 0; max-width: 100%; }
.party-view, .party-dashboard { grid-template-columns: minmax(0, 1fr); }
.party-filters, .candidate-filters { grid-template-columns: repeat(auto-fit, minmax(min(100%, 190px), 1fr)); }
.period-range { grid-column: 1 / -1; }
.party-metrics { grid-template-columns: repeat(auto-fit, minmax(min(100%, 220px), 1fr)); }
.party-chart-grid, .party-detail-grid, .party-detail-metrics { min-width: 0; }
.party-dashboard-head { flex-wrap: wrap; }
.party-metrics strong, .party-detail-metrics strong { font-size: clamp(1.25rem, 2vw, 1.7rem); font-variant-numeric: tabular-nums; }
.party-table-wrap, .party-state-matrix, .dialog-table-wrap { width: 100%; max-width: 100%; min-width: 0; overflow: auto; overscroll-behavior-x: contain; scrollbar-color: #526e8c #e6edf4; scrollbar-width: auto; }
.party-table-wrap table { min-width: 1080px; }
.party-table-wrap tbody td:first-child, .party-table-wrap thead th:first-child { position: sticky; left: 0; background: #fff; z-index: 2; box-shadow: 2px 0 0 #cfdae5; max-width: 250px; min-width: 130px; }
.party-table-wrap thead th:first-child { background: #edf2f7; z-index: 4; }
.table-guide { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: .5rem; margin: .6rem 0; color: #415872; font-size: .875rem; }
.table-guide p { flex: 1 1 260px; margin: 0; line-height: 1.5; }
.scroll-actions { display: flex; align-items: center; gap: .35rem; }
.scroll-actions button { min-width: 40px; min-height: 36px; border: 1px solid #a7b9ca; border-radius: 6px; background: #edf3fa; color: #163756; cursor: pointer; }
.scroll-actions button:disabled { opacity: .4; cursor: default; }
.scope-summary { max-width: min(100%, 700px); min-width: 0; }
.scope-summary > p { font-size: .875rem; color: #435970; margin: 0 0 .4rem; font-weight: 700; text-align: right; }
.scope-pills span { font-size: .875rem; text-transform: none; letter-spacing: 0; font-weight: 600; background: #e8eff7; border-color: transparent; border-radius: 5px; overflow-wrap: anywhere; }
.filter-heading { grid-column: 1 / -1; }
.filter-heading h2 { font-size: 1rem; letter-spacing: 0; line-height: 1.4; }
.filter-heading p { margin: .3rem 0; font-size: .9375rem; line-height: 1.55; color: #465c73; }
.filter-heading [role="status"] { color: #536980; font-size: .875rem; }
.filter-heading [data-pending="true"] { color: #805013; font-weight: 700; }
.apply-filters, .explore-controls > button { min-height: 44px; border: 1px solid #163756; border-radius: 8px; background: #163756; color: white; font-size: .9375rem; font-weight: 700; padding: .65rem 1rem; cursor: pointer; }
.apply-filters:disabled { opacity: .65; cursor: wait; }
.multi-filter, .multi-filter-options label, .clear-party-filters, .dashboard-bar span, .dashboard-bar strong, .party-metrics span, .party-metrics small, .party-candidate-table table, .party-candidate-table td small, .party-candidate-table button { font-size: .875rem; }
.candidate-source-links > a, .candidate-source-links > div { display: flex; flex-direction: column; gap: .5rem; }
.candidate-source-links > a > strong, .candidate-source-links > div > strong { font-size: 1rem; line-height: 1.5; }
.candidate-source-links > a > span, .candidate-source-links > div > span, .research-guide p, .research-guide small, .research-guide a { font-size: .9375rem; line-height: 1.6; }
.candidate-source-links .amendment-overview { background: #eef4fa; }
.amendment-mini-totals { display: grid; grid-template-columns: repeat(auto-fit, minmax(140px, 1fr)); gap: .6rem; margin: .3rem 0; }
.amendment-mini-totals > div { display: grid; gap: .2rem; }
.amendment-mini-totals dt { font-size: .875rem; color: #52677b; }
.amendment-mini-totals dd { margin: 0; font-size: 1.05rem; font-weight: 700; font-variant-numeric: tabular-nums; }
.amendment-overview button { align-self: flex-start; border: 0; border-bottom: 1px solid; padding: .25rem 0; background: transparent; color: #225c94; font: inherit; cursor: pointer; }
.help-trigger { display: inline-flex !important; align-items: center; justify-content: center; vertical-align: super; min-height: 0 !important; width: 1.15rem; height: 1.15rem; margin-left: .3rem; border: 1px solid #7590aa; border-radius: 50%; background: #eaf2fb; color: #183f63 !important; font: 700 .8rem/1 var(--font-sans) !important; cursor: help; text-transform: none; letter-spacing: 0; }
.help-trigger:focus-visible { outline: 3px solid #eabf46; outline-offset: 2px; }
.term-tooltip { position: fixed; z-index: 10000; width: min(340px, calc(100vw - 24px)); padding: .8rem 1rem; border: 1px solid #476783; border-radius: 9px; background: #102d47; color: #fff; font-size: .9375rem; line-height: 1.6; box-shadow: 0 8px 28px #0c233433; }
.guide-tabs { display: flex; flex-wrap: wrap; gap: .5rem; margin: 1rem 0 1.5rem; }
.guide-tabs button, .explore-presets button { padding: .7rem 1rem; border: 1px solid #b3c3d4; border-radius: 8px; background: white; color: #254762; font: 600 .9375rem var(--font-sans); cursor: pointer; }
.guide-tabs [aria-selected="true"] { color: white; background: #143854; border-color: #143854; }
.story-intro { display: grid; gap: .5rem; margin-bottom: 1rem; }
.story-intro h3 { font-size: 1.5rem; margin: 0; }
.story-intro p { margin: 0; line-height: 1.65; }
.story-steps { list-style: none; display: grid; gap: 1.2rem; padding: 0; margin: 0; }
.story-steps > li, .story-card { min-width: 0; border: 1px solid #d2dfea; border-radius: 12px; padding: clamp(1rem, 2vw, 1.6rem); background: #f6f9fc; }
.story-steps h3 { display: flex; align-items: center; gap: .7rem; margin: 0 0 1rem; font-size: 1.25rem; }
.story-step-number { flex-shrink: 0; display: grid; place-items: center; width: 2rem; height: 2rem; background: #153b5b; color: #fff; border-radius: 50%; font-size: 1rem; }
.story-line { display: flex; flex-wrap: wrap; align-items: center; gap: 1rem; }
.story-number { display: grid; gap: .3rem; min-width: 90px; }
.story-number b { font-size: clamp(1.7rem, 3.6vw, 2.65rem); line-height: 1.2; color: #163e61; }
.story-number span { font-size: .9375rem; color: #4b6279; }
.story-symbol { font-size: 1.7rem; font-weight: 600; color: #405d76; }
.story-callout { padding: .75rem 1rem; margin: 1rem 0 0; border-left: 3px solid #2e658b; background: #e9f1f8; font-size: 1rem; line-height: 1.65; }
.story-steps details, .story-card details { margin-top: 1rem; }
.story-steps summary, .story-card summary { cursor: pointer; font-weight: 650; color: #315a7d; font-size: .9375rem; }
.story-steps details p, .story-card p { font-size: 1rem; line-height: 1.7; }
.story-group { display: grid; grid-template-columns: 70px minmax(100px, 1fr) minmax(80px, .7fr); gap: .8rem; align-items: center; margin: .7rem 0; }
.story-vote-bar { display: block; height: 2.1rem; width: var(--size); min-width: 0; background: var(--group-color, #245d87); border-radius: 5px; }
.story-group strong { font-size: 1rem; }
.story-group small { display: block; font-size: .875rem; color: #506982; }
.story-group .winner { color: #155845; }
.story-results { display: grid; grid-template-columns: repeat(auto-fit, minmax(200px, 1fr)); gap: 1rem; }
.story-results h3 { margin: 0; font-size: 1.1rem; }
.story-card > .story-number { margin: 1rem 0; }
.story-senate-winners { display: flex; flex-wrap: wrap; gap: .7rem; margin-top: 1rem; }
.story-senate-winners span { border: 1px solid #1b6653; background: #e4f3ed; color: #18503f; border-radius: 8px; padding: .8rem 1.1rem; font-weight: 700; }
.explore-view { display: grid; gap: 1.2rem; }
.explore-view > header p { line-height: 1.65; }
.explore-presets { display: flex; flex-wrap: wrap; gap: .5rem; }
.explore-presets button[aria-pressed="true"] { border-color: #1d526f; background: #e6f0f8; }
.explore-controls { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)) auto; gap: .75rem; align-items: end; padding: 1rem; background: #eaf1f8; border-radius: 10px; }
.explore-controls label { display: grid; gap: .4rem; color: #37516a; font-size: .9375rem; }
.explore-controls select { min-width: 0; width: 100%; min-height: 44px; background: white; border: 1px solid #a5b9cc; border-radius: 6px; padding: .5rem; font: inherit; }
.explore-controls > p { grid-column: 1 / -1; margin: 0; font-size: .875rem; color: #4a6279; }
.explore-result-head h3 { font-size: 1.25rem; margin: 0; }
.explore-result-head p { font-size: .9375rem; line-height: 1.65; }
.heat-legend { display: flex; align-items: center; flex-wrap: wrap; gap: .5rem; margin: 1rem 0; color: #36516b; font-size: .875rem; }
.heat-legend > i { display: block; width: 180px; height: 16px; border: 1px solid #627a91; border-radius: 4px; background: linear-gradient(90deg,#edf4fa,#cadeef,#80afd5,#245f90,#164673,#062b4d); }
.heat-table { border-collapse: separate !important; border-spacing: 2px !important; width: 100%; min-width: 650px; }
.party-state-matrix .heat-table { font-size: .875rem; width: 100%; min-width: 650px; }
.party-state-matrix .heat-table td { background: var(--heat-bg); color: var(--heat-ink); min-width: 92px; padding: .7rem .5rem; border: 1px solid #627a91; font-variant-numeric: tabular-nums; }
.party-state-matrix .heat-table td small { display: block; font-size: .75rem; margin-top: .2rem; color: inherit; }
.party-state-matrix .heat-table td.is-missing { background: repeating-linear-gradient(135deg,#eef1f4,#eef1f4 5px,#e1e7ed 5px,#e1e7ed 7px); color: #43596d; }
.party-state-matrix .heat-table th { min-width: 95px; padding: .7rem .5rem; white-space: normal; }
.party-state-matrix .heat-table thead th:first-child { left: 0; z-index: 5; }
.party-state-matrix .heat-table tbody th { min-width: 140px; max-width: 240px; background: #f8fafc; box-shadow: 2px 0 #bdcbd9; z-index: 3; }
.heat-sort { border: 0; background: transparent; color: inherit; font: inherit; font-weight: 700; cursor: pointer; }
.heat-sort:hover { text-decoration: underline; }
.explore-note { font-size: .9375rem; line-height: 1.65; color: #3d566f; padding: 1rem; background: #edf3f8; }
@media (max-width: 900px) { .explore-controls { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
@media (max-width: 720px) { .scope-summary > p { text-align: left; } .party-filters, .candidate-filters, .explore-controls { grid-template-columns: minmax(0, 1fr); } .party-metrics { grid-template-columns: repeat(2, minmax(0, 1fr)); } .party-chart-grid { grid-template-columns: minmax(0, 1fr); } .story-group { grid-template-columns: 55px minmax(70px, 1fr) 95px; gap: .4rem; } }
@media (max-width: 430px) { .party-metrics { grid-template-columns: minmax(0, 1fr); } }

/* Responsibilities and a practical, non-partisan party-list ballot guide. */
.powers-grid, .legend-vote-steps { display: grid; grid-template-columns: repeat(3,minmax(0,1fr)); gap: 1rem; }
.powers-grid article { padding: 1.25rem; border: 1px solid #c6d6e5; border-top: 4px solid #31739d; border-radius: 10px; background: #f7fafc; }
.powers-grid article:nth-child(2) { border-top-color: #786295; }
.powers-grid article:nth-child(3) { border-top-color: #98803a; }
.powers-grid p, .role-guide p, .legend-vote-steps p, .promise-check p, .legend-outcome p { line-height: 1.7; font-size: .9375rem; }
.power-verb { font-size: .75rem; letter-spacing: .06em; font-weight: 700; color: #52677c; }
.powers-grid h3 { margin: .5rem 0; }
.powers-grid strong { font-size: .875rem; }
.role-guide-grid { display: grid; grid-template-columns: repeat(2,minmax(0,1fr)); gap: .75rem; align-items: start; }
.role-guide { min-width: 0; border: 1px solid #c6d6e5; border-radius: 8px; background: white; }
.role-guide summary { display: flex; justify-content: space-between; align-items: center; gap: .75rem; padding: 1rem; cursor: pointer; }
.role-guide summary strong { font-size: 1rem; }
.role-guide summary small { display: block; color: #506781; font-size: .8125rem; margin-top: .25rem; }
.role-guide summary > span:last-child { font-size: 1.3rem; }
.role-guide[open] summary { background: #eaf2f8; }
.role-guide[open] summary > span:last-child { transform: rotate(45deg); }
.role-guide > div { padding: 0 1rem 1rem; }
.role-guide p b { display: block; color: #25465f; }
.promise-check { margin-top: 1.25rem; padding: 1rem 1.25rem; background: #edf3f8; border-radius: 8px; }
.promise-check ol { display: grid; grid-template-columns: repeat(3,minmax(0,1fr)); gap: 1.5rem; padding-left: 1.3rem; }
.promise-check li span { display: block; margin-top: .35rem; font-size: .875rem; line-height: 1.6; }
.legend-vote-steps { padding: 0; list-style: none; }
.legend-vote-steps li { padding: 1.2rem; background: #f4f7fa; border: 1px solid #cad8e5; border-radius: 9px; }
.legend-vote-steps h3 { font-size: 1rem; }
.legend-digits { display: flex; gap: .3rem; margin: 1rem 0; }
.legend-digits > * { display: grid; place-items: center; width: 40px; height: 46px; border: 2px solid #456783; border-radius: 3px; font-style: normal; background: #ddebf6; font-weight: 700; }
.legend-digits i { border-style: dashed; border-color: #9cabb9; background: white; }
.confirm-label { background: #21603d; color: white; padding: .2rem .4rem; border-radius: 3px; white-space: nowrap; }
.legend-outcome { padding: 1.1rem 1.25rem; border-left: 4px solid #3a749c; background: #eaf2f8; }
.legend-outcome p { margin-bottom: 0; }
.heat-candidate { border: 0; background: transparent; color: #155786; font: inherit; font-weight: 700; text-align: left; text-decoration: underline; cursor: pointer; padding: 0; }
.heat-candidate-meta { display: block; margin-top: .3rem; font-size: .75rem; font-weight: 400; line-height: 1.5; }
.explore-pagination { display: flex; flex-wrap: wrap; gap: .7rem; align-items: center; margin: 1rem 0; font-size: .875rem; }
.explore-pagination button { border: 1px solid #9eafbf; border-radius: 5px; padding: .5rem .8rem; background: white; color: #264b69; cursor: pointer; font: inherit; }
.explore-pagination button:disabled { opacity: .45; cursor: default; }
@media(max-width:800px) { .powers-grid, .legend-vote-steps, .promise-check ol { grid-template-columns: minmax(0,1fr); } }
@media(max-width:560px) { .role-guide-grid { grid-template-columns: minmax(0,1fr); } }
.plan-summary-label { display: grid; gap: .35rem; }
.plan-summary-label > span { font-size: .8125rem; color: #4b637b; }
.plan-summary { padding-left: 1.2rem; margin: 1rem 0; }
.plan-summary li { margin-bottom: 1.1rem; padding-left: .25rem; }
.plan-summary li > strong { font-size: .875rem; color: #285674; }
.plan-summary li p { margin: .25rem 0; line-height: 1.65; font-size: .9375rem; }
.plan-summary li small { display: block; color: #526b83; font-size: .75rem; overflow-wrap: anywhere; }

.plan-provenance { margin-top: .9rem; font-size: .8125rem; color: #4b637b; overflow-wrap: anywhere; }
.plan-provenance summary { cursor: pointer; min-height: 28px; }

/* Keep the detailed voting instructions next to the proportional-vote explanation. */
.context-explainer { margin: .75rem 0 1.25rem; border-block: 1px solid var(--line); color: var(--ink); }
.context-explainer > summary { padding: .8rem 0; font-size: .9375rem; font-weight: 600; color: #254762; cursor: pointer; }
.context-explainer > summary:focus-visible { outline: 3px solid #245f90; outline-offset: 3px; }
.context-explainer-body { padding-bottom: 1rem; }
.context-explainer-body > p { font-size: 1rem; line-height: 1.65; }
.context-explainer .legend-vote-steps li { background: #fff; }
.context-explainer .legend-outcome { padding: .25rem 0; border: 0; background: transparent; }

/* Solid fills and explicit foregrounds remain readable on narrow screens. */
.bar, .category-track, .dashboard-bar > i, .amendment-progress i { outline: 1px solid #74889c; outline-offset: 0; }
.story-vote-bar, .elected-seats span { box-shadow: inset 0 0 0 1px #09182c55; }
.home-section, .story-steps > li, .story-card, .data-card, .party-card, .candidate-detail, .presence-card { color: var(--ink); }
.party-dashboard-head .eyebrow, .glossary-head .eyebrow { color: #cdd8e5; }
.system-explainer article > span { color: #405d76; }
.dashboard-bar > div, .category-row > div:first-child, .money-row { flex-wrap: wrap; column-gap: .75rem; row-gap: .15rem; }
.dashboard-bar strong, .category-row strong, .money-row strong { overflow-wrap: anywhere; }
.bar-label, .category-row span, .category-row strong, .money-row, .amendment-progress > div,
.section-title span, .consolidated-presence span, .finance-highlights span,
.performance-metrics span, .presence-breakdown span, .election-flow b, .election-flow p,
.system-explainer p, .system-explainer strong { font-size: .875rem; }
.category-row small, .presence-breakdown small, .consolidated-presence small,
.party-state-matrix .heat-table td small, .home-source-line { font-size: .8125rem; }
.party-metrics small, .asset-comparison small { color: #46596f; }

@media (max-width: 720px) {
  .bar, .category-track, .dashboard-bar > i, .amendment-progress i { height: 14px; }
  .dashboard-bars { gap: .9rem; }
  .story-group { grid-template-columns: minmax(0,1fr) auto; gap: .3rem .5rem; padding-block: .4rem; }
  .story-group > strong:first-child { grid-column: 1; grid-row: 1; }
  .story-group > strong:last-child { grid-column: 2; grid-row: 1; }
  .story-group > div { grid-column: 1 / -1; grid-row: 2; min-width: 0; }
  .story-group small { margin-top: .35rem; color: #344d65; }
  .story-line { gap: .8rem; }
  .story-number span { color: #344d65; }
  .elected-seats { grid-template-columns: repeat(5,minmax(0,1fr)); gap: .4rem; margin-bottom: 1rem; }
  .elected-seats span { min-height: 2.8rem; font-size: 1rem; }
  .performance-metrics { grid-template-columns: repeat(auto-fit,minmax(min(100%,150px),1fr)); }
  .finance-highlights { grid-template-columns: minmax(0,1fr); }
  .heat-legend > i { height: 20px; }
  .role-guide > div, .legend-vote-steps li { overflow-wrap: anywhere; }
  .home-section, .story-card, .story-steps > li, .party-card, .data-card { border-color: #9baec0; }
  .record-dialog { color: var(--ink); background: #fff; }
  input, select { font-size: 1rem; }
}

@media (forced-colors: active) {
  .bar, .category-track, .dashboard-bar > i, .amendment-progress i { outline: 1px solid CanvasText; background: Canvas; }
  .bar i, .category-track i, .dashboard-bar b, .amendment-progress b, .story-vote-bar { forced-color-adjust: none; background: Highlight; }
  .elected-seats span { border: 1px solid CanvasText; }
  .party-state-matrix .heat-table td, .party-state-matrix .heat-table td.is-missing { background: Canvas; color: CanvasText; border: 1px solid CanvasText; }
}