/* Contributions Pagination */
/* --- Pagination --- */
.paginator {
  max-width: 1200px;
  margin: 0 auto;
  height: 5vh;
}

.pagination-container {
  width: 100%;
}

.pagination {
  display: flex;
  flex: 0 1 100%;
  justify-content: center;
  line-height: 1.6rem;
  font-weight: 400;
  font-size: 1.4rem;
  list-style: none;
  padding: 0.5rem 0;
}

.pagination hr {
  margin-bottom: 0.5rem;
}

.pagination-link--previous,
.pagination-link--next {
  font-weight: 700;
}

.pagination a {
  color: black;
}

.pagination a:hover {
  color: white;
  background-color: var(--colour-secondary);
  transition: 0.2s;
  cursor: pointer;
}

.pagination a.page_label:hover {
  background-color: white;
}

.pagination li.active,
.pagination a.live {
  height: 2.5rem;
  text-align: center;
  margin: 0 0.2em;
}

.pagination svg {
  width: 1.5em;
  height: 1.66em;
  margin: 0 0.25em;
}

.pagination .enabled {
  fill: var(--colour-secondary);
}

.pagination .number_box {
  width: 2.5rem;
  height: 2.5rem;
  padding: 0.5rem 0;
  text-align: center;
  background-color: #cdc;
  text-decoration: none;
  float: left;
  margin: 0 0.25rem;
  border: 0;
  border-radius: var(--radius);
  overflow: hidden;
  transition: 0.4s;
}

.pagination .number_box:hover {
  background-color: var(--colour-secondary);
}

.pagination .number_box:hover a {
  color: white;
}

.pagination .active_number_box {
  width: 2.5rem;
  padding: 0.5rem 0;
  color: white;
  text-align: center;
  background-color: var(--colour-secondary);
  float: left;
  margin-right: 1.25rem;
  border-radius: var(--radius);
  transition: 0.4s;
}

.pagination .active {
  background-color: var(--colour-secondary);
}

.pagination li.active_ellipses a {
  text-decoration: none;
}

.pagination .disabled {
  display: none;
}

/* Chevron page controls (replaces the old VCR-style play-triangle SVGs) */
.pagination .page_chevron {
  display: inline-grid;
  place-items: center;
  width: 2.5rem;
  height: 2.5rem;
  font-size: 1.5rem;
  line-height: 1;
  font-weight: 700;
  color: var(--colour-primary);
  text-decoration: none;
}
.pagination .page_chevron:hover {
  background-color: var(--colour-primary);
  color: #fff;
  border-radius: var(--radius);
}
.pagination .page_chevron.is-disabled {
  color: var(--colour-light);
  pointer-events: none;
}

@media screen and (max-width: 480px) {
  .contributions-pagination .page-link {
    min-width: 2rem;
    height: 2rem;
    font-size: 0.75rem;
  }
}

/* Topical Contributions Styling */
.topical-contribution-item {
  border: 1px solid #e0e0e0;
  border-radius: var(--radius);
  margin-bottom: 1rem;
  transition: box-shadow 0.2s;
}

.topical-contribution-item:hover {
  box-shadow: 0 2px 8px rgba(0, 0, 0, 0.1);
}

/* Conversation Context Header */
.contribution-conversation-header {
  display: flex;
  justify-content: space-between;
  align-items: flex-start;
  margin-bottom: 0.75rem;
  padding-bottom: 0.5rem;
  border-bottom: 2px solid #f0f0f0;
}

.conversation-info {
  flex: 1;
  display: flex;
  align-items: center;
  gap: 0.5rem;
  flex-wrap: wrap;
}

.conversation-type-badge {
  display: inline-block;
  padding: 0.25rem 0.75rem;
  background-color: #467e7a;
  color: white;
  font-size: 0.75rem;
  font-weight: 600;
  text-transform: uppercase;
  border-radius: var(--radius);
  letter-spacing: 0.5px;
}

.conversation-title {
  font-weight: 600;
  color: #2d3748;
  text-decoration: none;
  font-size: 0.95rem;
  line-height: 1.4;
}

.conversation-title:hover {
  color: var(--colour-secondary);
  text-decoration: underline;
}

.contribution-meta-header {
  font-size: 0.85rem;
  color: #718096;
  white-space: nowrap;
}

/* Role, Intent, and Stance Indicators */
.contribution-indicators {
  display: flex;
  gap: 0.5rem;
  margin-bottom: 0.75rem;
  flex-wrap: wrap;
}

.role-badge,
.intent-badge,
.stance-badge {
  display: inline-block;
  padding: 0.5rem 0.75rem 0.35rem;
  font-size: 0.8rem;
  font-weight: 500;
  border-radius: var(--radius);
  line-height: 1;
}

/* Role Badge Colors */
.badge-primary {
  color: #4299e1;
}

.badge-success {
  background-color: #48bb78;
  color: white;
}

.badge-info {
  background-color: #38b2ac;
  color: white;
}

.badge-warning {
  background-color: #ed8936;
  color: white;
}

.badge-danger {
  background-color: #f56565;
  color: white;
}

.badge-secondary {
  background-color: #613046;
  color: white;
}

.badge-light {
  background-color: #e2e8f0;
  color: #4a5568;
}

/* Contributions List */
.contributions-holder {
  margin: 0.25rem 0 1rem;
}

div.activity-section p {
  margin-bottom: 0.5rem;
}

.contributions-info {
  margin-left: 0.5rem;
  color: var(--colour-secondary-dark);
  font-size: 0.95rem;
  line-height: 1.5;
  background: #e9f9e9;
  padding: 0.75rem 1rem;
  border-radius: 0.5rem;
  border: 1px solid var(--colour-secondary-light);
}

.contributions-list {
  display: flex;
  flex-direction: column;
  gap: 0.5rem;
}

.contributions--list-icon {
  font-size: 1.6em;
  margin-left: 1em;
  transition: transform 0.1s;
  cursor: pointer;
  color: var(--colour-primary);
}

.contributions--list-heading {
  display: flex;
  align-items: center;
  justify-content: flex-end;
  font-weight: 700;
  cursor: pointer;
  border-bottom: 1px solid var(--colour-secondary);
  text-transform: uppercase;
  color: var(--colour-secondary);
}

.contributions--list-icon.open {
  transform: rotate(45deg);
  color: var(--colour-secondary);
}

.contribution-text-link .contribution-text:hover {
  color: var(--colour-secondary);
}

.contributions--list-text {
  max-height: 26rem;
  overflow: hidden;
  transition:
    max-height 0.4s ease-out,
    padding 0.4s ease-out;
  padding-top: 0;
}

.contributions--list-text.active {
  /* max-height set dynamically via JavaScript based on actual content height */
  padding-top: 0.5em;
  transition:
    max-height 0.5s ease-in,
    padding 0.3s ease-in;
}

.contribution-item {
  background: white;
  border-radius: 0.5rem;
  padding: 0 0.5rem;
  transition: all 0.2s ease;
  box-shadow: 0 0px 3px rgba(0, 0, 0, 0.1);
}

.contribution-item:hover {
  box-shadow: 0 0px 5px rgba(0, 0, 0, 0.2);
  border: 1px solid var(--colour-secondary);
}

/* Presiding-officer speech: shown for the record but not counted in the
   metrics. De-emphasised, with a left rule and an "As Speaker / Chair" badge so
   it reads as set-apart from the member's own contributions. */
.contribution-item--presiding {
  background: var(--colour-surface-2, #f7f7f9);
  border-left: 3px solid var(--colour-border, #d6d6db);
  opacity: 0.85;
}
.presiding-badge {
  background-color: var(--colour-surface-2, #ececed);
  color: var(--colour-text-muted, #6b6b72);
  border: 1px solid var(--colour-border, #d9d9de);
  font-style: italic;
}

.contribution-meta {
  display: flex;
  flex-wrap: wrap;
  gap: 0.75rem;
  align-items: center;
  font-size: 0.875rem;
}

.contribution-date {
  font-weight: 600;
  color: hsl(210, 9%, 15%);
}

.contribution-doc {
  color: hsl(210, 9%, 15%);
  flex: 1;
  font-style: italic;
  font-weight: 500;
}

.contribution-text {
  color: var(--colour-secondary-dark);
  line-height: 1.6;
  margin: 0;
  font-size: 0.95rem;
  transition: color 0.2s ease;
}

.contribution-text-link {
  text-decoration: none;
  color: inherit;
  display: block;
}

@media screen and (max-width: 768px) {
  .contribution-item {
    padding: 0.875rem;
  }

  .contribution-meta {
    font-size: 0.8rem;
    gap: 0.5rem;
  }

  .contribution-text {
    font-size: 0.9rem;
  }
}

/* Topic Tags */
.contribution-topics {
  display: flex;
  gap: 0.5rem;
  margin-bottom: 0.75rem;
  flex-wrap: wrap;
}

.topic-badge {
  display: inline-block;
  padding: 0.35rem 0.75rem;
  font-size: 0.8rem;
  font-weight: 500;
  border-radius: var(--radius);
  border: 1.5px solid #cbd5e0;
  background-color: #f7fafc;
  color: #2d3748;
  line-height: 1;
  transition: all 0.2s;
}

.topic-badge:hover {
  transform: translateY(-1px);
  box-shadow: 0 2px 4px rgba(0, 0, 0, 0.1);
}

/* Contribution Text */
.contribution-text-link {
  text-decoration: none;
  color: inherit;
  display: block;
}

.contribution-text {
  margin: 0.75rem 0;
  line-height: 1.6;
  color: #2d3748;
  font-size: 0.95rem;
}

.contribution-text-link:hover .contribution-text {
  color: #1a202c;
  background-color: #f7fafc;
  border-radius: var(--radius);
  transition: all 0.2s;
}

/* Novel Elements and Asks */
.contribution-novel-elements,
.contribution-asks {
  margin-top: 0.75rem;
  padding: 0.75rem;
  background-color: #f7fafc;
  border-left: 3px solid #4299e1;
  border-radius: var(--radius);
  font-size: 0.9rem;
}

.contribution-asks {
  border-left-color: #ed8936;
}

.contribution-novel-elements strong,
.contribution-asks strong {
  display: block;
  margin-bottom: 0.5rem;
  color: #2d3748;
  font-size: 0.85rem;
}

.contribution-novel-elements ul,
.contribution-asks ul {
  margin: 0;
  padding-left: 1.5rem;
}

.contribution-novel-elements li,
.contribution-asks li {
  margin-bottom: 0.35rem;
  color: #4a5568;
  line-height: 1.5;
}

/* Responsive Design */
@media screen and (max-width: 768px) {
  .contribution-conversation-header {
    flex-direction: column;
    gap: 0.5rem;
  }

  .contribution-meta-header {
    align-self: flex-start;
  }

  .conversation-type-badge {
    font-size: 0.7rem;
    padding: 0.2rem 0.6rem;
  }

  .contribution-indicators {
    gap: 0.35rem;
  }

  .role-badge,
  .intent-badge,
  .stance-badge {
    font-size: 0.75rem;
    padding: 0.3rem 0.6rem;
  }

  .topic-badge {
    font-size: 0.75rem;
    padding: 0.3rem 0.6rem;
  }
}

@media screen and (max-width: 480px) {
  .topical-contribution-item {
    padding: 0.75rem;
  }

  .conversation-title {
    font-size: 0.9rem;
  }

  .contribution-text {
    font-size: 0.9rem;
  }

  .contribution-novel-elements,
  .contribution-asks {
    padding: 0.5rem;
    font-size: 0.85rem;
  }
}

/* Grouped Contributions Styling */
.contribution-group {
  border: 2px solid #e2e8f0;
  border-radius: var(--radius);
  padding: 0.5rem;
  background-color: #ffffff;
  box-shadow: 0 1px 3px rgba(0, 0, 0, 0.05);
  transition: box-shadow 0.2s;
}

.contribution-group:hover {
  box-shadow: 0 4px 12px rgba(0, 0, 0, 0.08);
}

/* Group Header (Date + Topic) */
.contribution-group-header {
  display: flex;
  justify-content: space-between;
  align-items: center;
  padding-bottom: 1rem;
  border-bottom: 3px solid #edf2f7;
}

.group-date-topic {
  display: flex;
  align-items: center;
  gap: 1rem;
  flex-wrap: wrap;
}

.group-date {
  font-size: 1.1rem;
  font-weight: 700;
  color: #2d3748;
  letter-spacing: 0.3px;
}

.topic-badge-large {
  padding: 0.5rem 1rem;
  font-size: 0.95rem;
  font-weight: 600;
  border-radius: var(--radius);
}

.group-count {
  font-size: 0.85rem;
  color: #819E8D;
  font-weight: 500;
  background-color: var(--colour-secondary-alpha-10);
  padding: 0.35rem 0.75rem;
  border-radius: var(--radius);
  white-space: nowrap;
}



/* Grouped contribution items (nested within group) */
.grouped-contribution {
  margin-bottom: 1.25rem;
  border: 1px solid #e2e8f0;
  border-radius: var(--radius);
  background-color: #fafafa;
}

.grouped-contribution:last-child {
  margin-bottom: 0;
}

.grouped-contribution:hover {
  background-color: #f7fafc;
  border-color: #cbd5e0;
}

/* Remove date from individual contribution headers in groups */
.grouped-contribution .contribution-meta-header {
  display: none;
}

/* Responsive adjustments for grouped contributions */
@media screen and (max-width: 768px) {
  .contribution-group {
    padding: 1rem;
    margin-bottom: 1.5rem;
  }

  .contribution-group-header {
    flex-direction: column;
    align-items: flex-start;
    gap: 0.75rem;
  }

  .group-date-topic {
    gap: 0.75rem;
  }

  .group-date {
    font-size: 1rem;
  }

  .topic-badge-large {
    font-size: 0.85rem;
    padding: 0.4rem 0.8rem;
  }

  .group-count {
    align-self: flex-start;
  }

  .grouped-contribution {
    padding: 0.75rem;
  }
}

@media screen and (max-width: 480px) {
  .contribution-group {
    padding: 0.75rem;
  }

  .group-date {
    font-size: 0.95rem;
  }

  .topic-badge-large {
    font-size: 0.8rem;
    padding: 0.35rem 0.7rem;
  }

  .group-count {
    font-size: 0.8rem;
  }

  .grouped-contribution {
    padding: 0.5rem;
    margin-bottom: 1rem;
  }
}

/* Conversation Sub-groups (within date+topic groups) */
.conversation-subgroup {
  padding: 1rem 0;
  background-color: #f9fafb;
  border-radius: var(--radius);
}

.conversation-subgroup:last-child {
  margin-bottom: 0;
}

/* Conversation Sub-group Header */
.conversation-subgroup-header {
  display: flex;
  justify-content: space-between;
  align-items: center;
  margin-bottom: 1rem;
  padding-bottom: 0.75rem;
  border-bottom: 2px solid #e2e8f0;
}

.conversation-subgroup-header .conversation-info {
  flex: 1;
}

.conversation-subgroup-header .conversation-title {
  font-size: 1rem;
  font-weight: 600;
  color: #1a202c;
}

.conversation-contrib-count {
  font-size: 0.8rem;
  color: #718096;
  font-weight: 500;
  background-color: #e2e8f0;
  padding: 0.25rem 0.6rem;
  border-radius: var(--radius);
  white-space: nowrap;
}

/* Contributions within conversation subgroups */
.conversation-subgroup .grouped-contribution {
  background-color: #ffffff;
  border: 1px solid #e2e8f0;
  margin-bottom: 0.75rem;
}

.conversation-subgroup .grouped-contribution:last-child {
  margin-bottom: 0;
}

.conversation-subgroup .grouped-contribution:hover {
  background-color: #fafafa;
  border-color: #cbd5e0;
}

/* Responsive adjustments for conversation subgroups */
@media screen and (max-width: 768px) {
  .conversation-subgroup {
    padding: 0.75rem;
  }

  .conversation-subgroup-header {
    flex-direction: column;
    align-items: flex-start;
    gap: 0.5rem;
  }

  .conversation-subgroup-header .conversation-title {
    font-size: 0.95rem;
  }

  .conversation-contrib-count {
    align-self: flex-start;
  }
}

@media screen and (max-width: 480px) {
  .conversation-subgroup {
    padding: 0.5rem;
    margin-bottom: 1rem;
  }

  .conversation-subgroup-header .conversation-title {
    font-size: 0.9rem;
  }

  .conversation-contrib-count {
    font-size: 0.75rem;
  }
}

/* Legislative Bills Section */
.legislative-bills {
  margin: 2rem 0;
}

.bills-summary {
  font-size: 1.1rem;
  color: #333;
}

.bills-container {
  margin: 0.25rem 0 1rem;
}

.bills-list {
  display: flex;
  flex-direction: column;
  gap: 1rem;
}

.bill-item {
  padding: 0.5rem;
  border-radius: var(--radius);
  border: 1px solid #e2e8f0;
  transition: box-shadow 0.3s ease;
}

.bill-item:hover {
  box-shadow: 0 2px 8px rgba(0, 0, 0, 0.1);
}

.bill-header {
  display: flex;
  justify-content: space-between;
  align-items: flex-start;
  gap: 1rem;
}

.bill-name {
  font-size: 1.2rem;
  font-weight: 600;
  color: #467e7a;
  margin: 0;
  flex: 1;
  line-height: 1.4;
}

.bill-year {
  background: #467e7a;
  color: white;
  padding: 0.25rem 0.75rem;
  border-radius: var(--radius);
  font-size: 0.9rem;
  font-weight: 600;
  white-space: nowrap;
  flex-shrink: 0;
}

.bill-stage,
.bill-notes {
  font-size: 0.95rem;
  line-height: 1.6;
  color: #555;
}

.bill-stage strong,
.bill-notes strong {
  color: #333;
  font-weight: 600;
}

.bill-meta {
  display: flex;
  justify-content: space-between;
  align-items: center;
  margin-top: 1rem;
  padding-top: 1rem;
  border-top: 1px solid #dee2e6;
  font-size: 0.875rem;
  color: #6c757d;
  gap: 1rem;
  flex-wrap: wrap;
}

.bill-period {
  font-weight: 500;
  color: #495057;
}

.bill-updated {
  font-style: italic;
}

/* Responsive Design */
@media screen and (max-width: 768px) {
  .bill-header {
    flex-direction: column;
    align-items: flex-start;
  }

  .bill-year {
    align-self: flex-start;
  }

  .bill-name {
    font-size: 1.1rem;
  }

  .bill-meta {
    flex-direction: column;
    align-items: flex-start;
    gap: 0.5rem;
  }
}

@media screen and (max-width: 480px) {
  .bill-item {
    padding: 1rem;
  }

  .bill-name {
    font-size: 1rem;
  }

  .bills-summary {
    font-size: 1rem;
  }
}

/* ── Member performance scorecard widget (computed) ── */
.member-scorecard { border: 1px solid var(--colour-border); border-radius: 8px; padding: 1rem 1.25rem; margin: 0 0 1.5rem; background: #fff; }
.member-scorecard__head { display: flex; align-items: center; gap: 1rem; margin-bottom: .9rem; }
.member-scorecard__grade { font-size: 2.4rem; font-weight: 800; line-height: 1; color: var(--colour-primary); border: 3px solid currentColor; border-radius: 8px; padding: .2rem .6rem; }
/* Grade colour reflects performance — a low score should not read as a brand-red
   "error". A/B green, C amber, D/E/F red. */
.member-scorecard__grade--a,
.member-scorecard__grade--b { color: var(--colour-secondary); }
.member-scorecard__grade--c { color: #B8860B; }
.member-scorecard__grade--d,
.member-scorecard__grade--e,
.member-scorecard__grade--f { color: var(--colour-primary); }
.member-scorecard__head a { color: var(--colour-primary); }
.member-scorecard__row { margin-bottom: .7rem; }
.member-scorecard__label { display: flex; justify-content: space-between; font-size: .85rem; margin-bottom: .25rem; color: var(--colour-text); font-weight: 600; }
.member-scorecard__bar { height: 12px; background: #ececec; border-radius: 6px; overflow: hidden; }
.member-scorecard__bar > span { display: block; height: 100%; background: var(--colour-secondary); border-radius: 6px; }

/* Accountability panels — Declarations of Interest + Kenya Gazette mentions.
   See data-pull audit (workflow wmubc0idq) Conflict-of-Interest Graph pattern. */
.accountability-panel { margin: var(--space-5, 24px) 0; padding: var(--space-4, 16px);
  background: #fff; border: 1px solid var(--colour-line, #e7e0d5); border-radius: 8px;
  border-top: 4px solid var(--colour-primary, #A51E27); }
.accountability-panel__head { margin-bottom: var(--space-3, 12px); }
.accountability-panel__head h2 { margin: 0 0 .25rem; font-size: 1.15rem; }
.accountability-panel__sub { margin: 0; font-size: .85rem; color: var(--colour-text-mute, #6b6157); }
.accountability-panel__list { list-style: none; padding: 0; margin: 0; display: flex; flex-direction: column; gap: var(--space-3, 12px); }
.accountability-panel__item { padding: .65rem .85rem; background: #fafaf5; border: 1px solid var(--colour-line, #e7e0d5); border-radius: 6px; }
.accountability-panel__row { display: flex; flex-wrap: wrap; gap: .55rem; align-items: baseline; font-size: .85rem; margin-bottom: .35rem; }
.accountability-panel__badge { display: inline-block; padding: .15rem .55rem; background: var(--colour-primary-alpha-10, #fbeaec);
  color: var(--colour-primary, #A51E27); border-radius: 12px; font-size: .68rem; font-weight: 700;
  letter-spacing: .04em; text-transform: uppercase; }
.accountability-panel__when { color: var(--colour-text-mute, #6b6157); }
.accountability-panel__amt { font-weight: 700; }
.accountability-panel__ref { color: var(--colour-text-mute, #6b6157); font-family: monospace; font-size: .8rem; }
.accountability-panel__desc { margin: 0 0 .35rem; line-height: 1.45; }
.accountability-panel__note { margin: 0; font-size: .9rem; color: var(--colour-text-mute, #6b6157); }
.provenance { margin: .5rem 0 0; font-size: .75rem; color: var(--colour-text-mute, #6b6157); }
.provenance__verb, .provenance__against { opacity: .85; }
.provenance__when { font-weight: 600; }
.provenance__source { color: var(--colour-primary, #A51E27); text-decoration: underline; }

.empty-state { padding: var(--space-3, 12px) var(--space-4, 16px);
  background: #fafaf5; border: 1px dashed var(--colour-line, #e7e0d5); border-radius: 6px;
  color: var(--colour-text-mute, #6b6157); }
.empty-state__title { margin: 0 0 .35rem; font-size: 1rem; color: var(--colour-text, #272525); }
.empty-state__body { margin: 0 0 .55rem; font-size: .9rem; line-height: 1.45; }
.empty-state__cta { font-weight: 600; color: var(--colour-primary, #A51E27); }
.accountability-panel__role { margin: 0 0 .35rem; font-size: .85rem; color: var(--colour-text, #272525); }
.accountability-panel__excerpt { margin: .5rem 0; padding: .55rem .8rem;
  background: #fff; border-left: 3px solid var(--colour-primary, #A51E27);
  font-style: italic; font-size: .9rem; line-height: 1.5;
  color: var(--colour-text, #272525); }

/* === WS-A: Tabbed MP/Senator profiles === */
/* Reuse components.css .tabs / .tabs a / .tabs a.is-active for the bar; drive
   panel visibility with :target (works JS-off), JS only syncs .is-active. */
.profile-tabs .tabs { overflow-x: auto; -webkit-overflow-scrolling: touch; }
.tab-panel { display: none; }
.tab-panel:target { display: block; }
.tab-panel#tab-overview { display: block; }
.profile-tabs:has(.tab-panel:target) .tab-panel#tab-overview:not(:target) { display: none; }
.tabs .count { font-size: var(--text-xs); color: var(--colour-text-muted); }

/* Right-rail widgets (activity sparkline + policy focus). */
.rail-widget { margin-top: 0; margin-bottom: var(--space-5); }
.rail-widget__title { font-size: var(--text-sm); text-transform: uppercase; letter-spacing: .03em; color: var(--colour-text-muted); margin: 0 0 var(--space-2); }

/* Activity + Policy Focus: a full-width 2-column summary row (was a slim rail
   where the two widgets stacked and looked cramped). */
.member-rail-row { margin: var(--space-4) auto var(--space-2); }
.rail-widgets {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: var(--space-5);
  align-items: stretch;
}
.rail-widgets .rail-widget {
  margin: 0;
  background: var(--colour-bg-subtle, #f8f8f8);
  border: 1px solid var(--colour-border, #e3e3e3);
  border-radius: var(--radius-lg, 12px);
  padding: var(--space-4) var(--space-5);
}
main.member-info--full { flex: 1 1 100%; width: 100%; min-width: 0; }
@media (max-width: 700px) {
  .rail-widgets { grid-template-columns: 1fr; }
}
.sparkbars { display: flex; align-items: flex-end; gap: 2px; height: 48px; }
.sparkbars__bar { flex: 1; min-height: 2px; background: var(--colour-primary); border-radius: 2px 2px 0 0; opacity: .85; }
.policy-focus { list-style: none; padding: 0; margin: 0; }
.policy-focus li { margin-bottom: var(--space-3); }
.policy-focus__row { display: flex; justify-content: space-between; font-size: var(--text-sm); }

/* ==========================================================================
   DECLUTTER REDESIGN — member / senator profile (Phase: spacious, organized)
   On-brand tokens only (var(--colour-primary) #d21218, --colour-secondary
   #009f57, Montserrat). Goal: generous whitespace, one card system, one
   heading style, a clean scrollable tab bar, and a tidy identity header.
   ========================================================================== */

/* ---- Consistent card system ------------------------------------------- */
.profile-card {
  background: var(--colour-bg, #fff);
  border: 1px solid var(--colour-border, #e3e3e3);
  border-radius: 12px;
  box-shadow: var(--shadow-sm);
  padding: var(--space-5) var(--space-5);
  margin: 0 0 var(--space-5);
}
.profile-card:last-child { margin-bottom: 0; }

/* ---- One section-heading style (Title Case, no UPPERCASE shouting) ----- */
.section-heading {
  font-size: var(--text-lg);
  font-weight: 700;
  color: var(--colour-text, #272525);
  margin: 0 0 var(--space-4);
  padding-bottom: var(--space-3);
  border-bottom: 1px solid var(--colour-border, #e3e3e3);
  text-transform: none;
  letter-spacing: 0;
  line-height: 1.3;
}

/* ---- Identity / profile header ("hero") card -------------------------- */
.profile-hero {
  display: grid;
  grid-template-columns: 168px 1fr;
  gap: var(--space-6);
  align-items: start;
  background: var(--colour-bg, #fff);
  border: 1px solid var(--colour-border, #e3e3e3);
  border-radius: 12px;
  border-top: 4px solid var(--colour-primary);
  box-shadow: var(--shadow-sm);
  padding: var(--space-5) var(--space-6);
  margin: var(--space-4) 0 var(--space-6);
}
.profile-hero__photo img {
  display: block;
  width: 100%;
  aspect-ratio: 4 / 5;
  object-fit: cover;
  object-position: center top;
  border-radius: 10px;
  background: var(--colour-bg-subtle, #f6f6f6);
}
.profile-hero__body { min-width: 0; }
.profile-hero__eyebrow {
  margin: 0 0 var(--space-1);
  font-size: var(--text-xs);
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: .06em;
  color: var(--colour-primary);
}
.profile-hero__name {
  margin: 0 0 var(--space-4);
  font-size: var(--text-2xl);
  font-weight: 800;
  line-height: 1.15;
  color: var(--colour-text, #272525);
}

/* Key facts as a tidy labelled grid */
.profile-hero__facts {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(150px, 1fr));
  gap: var(--space-3) var(--space-5);
  margin: 0 0 var(--space-5);
  padding: 0 0 var(--space-5);
  border-bottom: 1px solid var(--colour-border, #e3e3e3);
}
.fact { display: flex; flex-direction: column; gap: 2px; min-width: 0; }
.fact__label {
  font-size: var(--text-xs);
  text-transform: uppercase;
  letter-spacing: .04em;
  font-weight: 600;
  color: var(--colour-text-muted, #6b6157);
}
.fact__value {
  font-size: var(--text-base);
  font-weight: 600;
  color: var(--colour-text, #272525);
  overflow-wrap: anywhere;
}
.status-chip {
  display: inline-block;
  padding: .2rem .65rem;
  border-radius: var(--radius-pill, 999px);
  background: var(--colour-secondary-alpha-10, #e9f9f0);
  color: var(--colour-secondary-dark, #047a44);
  font-size: var(--text-sm);
  font-weight: 700;
  line-height: 1.4;
}
/* Speaker / presiding officer treatment (not an ordinary member). */
.status-chip--speaker {
  background: var(--colour-surface-2, #eef0f3);
  color: var(--colour-text-muted, #555);
}
.profile-hero__role {
  margin: calc(-1 * var(--space-3)) 0 var(--space-4);
  font-size: var(--text-md, 1rem);
  font-weight: 700;
  color: var(--colour-text-muted, #555);
}
.profile-note {
  margin: 0;
  color: var(--colour-text-muted, #555);
  font-size: var(--text-sm);
  line-height: 1.5;
}

/* Headline stat row */
.profile-hero__stats {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: var(--space-3);
  margin: 0 0 var(--space-4);
}
.hero-stat {
  margin: 0;
  text-align: center;
  padding: var(--space-3) var(--space-2);
  background: var(--colour-bg-subtle, #f8f8f8);
  border: 1px solid var(--colour-border, #e3e3e3);
  border-radius: 10px;
  /* now a clickable drill-down trigger: reset button chrome + affordance */
  width: 100%;
  font: inherit;
  cursor: pointer;
  transition: transform var(--motion-fast, .12s) var(--ease-standard, ease),
              box-shadow var(--motion-fast, .12s) var(--ease-standard, ease),
              border-color var(--motion-fast, .12s) var(--ease-standard, ease);
}
.hero-stat:hover {
  border-color: var(--colour-primary);
  box-shadow: var(--shadow-sm, 0 1px 2px rgba(0, 0, 0, .06));
  transform: translateY(-2px);
}
.hero-stat:hover .hero-stat__label { color: var(--colour-primary); }
.hero-stat__num {
  display: block;
  margin: 0;
  font-size: var(--text-xl);
  font-weight: 800;
  line-height: 1.1;
  color: var(--colour-primary);
}
.hero-stat__label {
  font-size: var(--text-xs);
  text-transform: uppercase;
  letter-spacing: .03em;
  color: var(--colour-text-muted, #6b6157);
  font-weight: 600;
}
.profile-hero__link {
  display: inline-block;
  font-weight: 700;
  color: var(--colour-primary);
  text-decoration: none;
}
.profile-hero__link:hover { text-decoration: underline; }

/* ---- Two-column layout with generous gap; sidebar trimmed ------------- */
.member-container,
.senator-detail-container { gap: var(--space-6); align-items: start; }
.member-container.container,
.senator-detail-container.container { margin-bottom: var(--space-7); }
aside.member-essentials { padding-right: 0; }

/* ---- Clean, horizontally-scrollable tab bar (never ugly-wraps) -------- */
.profile-tabs { position: relative; }
.profile-tabs .tabs {
  flex-wrap: nowrap;
  gap: var(--space-2);
  overflow-x: auto;
  overflow-y: hidden;
  -webkit-overflow-scrolling: touch;
  scrollbar-width: thin;
  scrollbar-color: var(--colour-border-strong, #ccc) transparent;
  border-bottom: 2px solid var(--colour-border, #e3e3e3);
  margin: 0 0 var(--space-5);
  padding-bottom: 0;
  position: sticky;
  top: 0;
  z-index: 5;
  background: var(--colour-bg, #fff);
}
/* On narrow screens the horizontal-scroll tab strip hid Motions/Petitions/
   Questions/Statements/Papers behind a near-invisible 6px scrollbar — wrap the
   tabs onto multiple rows so every section is visible, and drop the sticky. */
@media (max-width: 768px) {
  .profile-tabs .tabs {
    flex-wrap: wrap;
    overflow-x: visible;
    row-gap: .25rem;
    position: static;
  }
}
.profile-tabs .tabs::-webkit-scrollbar { height: 6px; }
.profile-tabs .tabs::-webkit-scrollbar-thumb {
  background: var(--colour-border-strong, #ccc); border-radius: 3px;
}
.profile-tabs .tabs a {
  flex: 0 0 auto;
  white-space: nowrap;
  padding: var(--space-3) var(--space-3);
  font-weight: 600;
  border-bottom: 3px solid transparent;
  color: var(--colour-text-muted, #6b6157);
}
.profile-tabs .tabs a:hover { color: var(--colour-primary); }
.profile-tabs .tabs a.is-active {
  color: var(--colour-primary);
  border-bottom-color: var(--colour-primary);
}
.profile-tabs .tabs a .count {
  display: inline-block;
  margin-left: 4px;
  padding: 0 .45rem;
  border-radius: var(--radius-pill, 999px);
  background: var(--colour-bg-subtle, #f1f1f1);
  font-size: var(--text-xs);
  font-weight: 700;
  color: var(--colour-text-muted, #6b6157);
}
.profile-tabs .tabs a.is-active .count {
  background: var(--colour-primary-alpha-10, #fbeaec);
  color: var(--colour-primary);
}

/* ---- Overview cards: bio gets air, term reads cleanly ---------------- */
.member-biography.profile-card .biography-content p {
  font-size: var(--text-base);
  line-height: 1.7;
  margin: 0 0 var(--space-3);
}
/* Background card: Career / Education / Previous Parties as clean accent blocks */
.member-background { display: flex; flex-direction: column; gap: var(--space-5); }
.member-background > .section-heading { margin-bottom: var(--space-2); }
.bg-block {
  border-left: 3px solid var(--colour-primary);
  padding: var(--space-1) 0 var(--space-1) var(--space-4);
}
.bg-block__heading {
  margin: 0 0 var(--space-2);
  font-size: var(--text-lg);
  font-weight: var(--fw-bold);
  letter-spacing: -0.01em;
  color: var(--colour-text, #272525);
  text-transform: none;
}
.bg-block__body { color: var(--colour-text, #272525); }
.bg-block__body p { line-height: 1.7; margin: 0 0 var(--space-3); }
.bg-block__body p:last-child { margin-bottom: 0; }
.bg-block__body ul,
.bg-block__body ol { margin: var(--space-2) 0 var(--space-3); padding-left: var(--space-5); }
.bg-block__body li { line-height: 1.6; margin: 0 0 var(--space-2); }
.bg-block__body a { color: var(--colour-primary); font-weight: 600; }
.bg-block__body a:hover { text-decoration: underline; }
/* legacy fallback if the old heading class lingers anywhere */
.member-background--heading {
  font-size: var(--text-lg); font-weight: var(--fw-bold);
  margin: var(--space-5) 0 var(--space-3);
}
.member-background--heading:first-child { margin-top: 0; }
.profile-card .position-section p,
.profile-card .position-section { line-height: 1.7; }
.profile-card .highlight { font-weight: 600; color: var(--colour-text, #272525); }
.profile-card .emphasis { color: var(--colour-primary); font-weight: 600; }

/* Give the server-rendered scorecard breathing room inside its card */
.profile-card .member-scorecard { border: none; box-shadow: none; padding: 0; margin: 0; }

/* ---- Committee + legislative lists: row spacing, dividers, hover ------ */
.committee-list {
  list-style: none;
  margin: 0;
  padding: 0;
  display: flex;
  flex-direction: column;
}
.committee-list .committee-item {
  padding: var(--space-3) var(--space-2);
  border-bottom: 1px solid var(--colour-border, #ececec);
  line-height: 1.6;
  border-radius: 6px;
  transition: background-color .15s ease;
}
.committee-list .committee-item:last-child { border-bottom: none; }
.committee-list .committee-item:hover { background: var(--colour-bg-subtle, #f8f8f8); }
.committee-list .committee-role {
  display: inline-block;
  font-weight: 700;
  color: var(--colour-secondary-dark, #047a44);
}
.committee-list .committee-dates {
  display: inline-block;
  margin-left: .4rem;
  font-size: var(--text-sm);
  color: var(--colour-text-muted, #6b6157);
}
/* Legislative-business lists (motions/petitions/questions/…): airier rows */
.leg-list .committee-item {
  display: flex;
  flex-wrap: wrap;
  align-items: baseline;
  gap: var(--space-2) var(--space-3);
}
.leg-list .committee-item > a { font-weight: 600; }
.leg-list .role-badge {
  background: var(--colour-bg-subtle, #f1f1f1);
  color: var(--colour-text-muted, #6b6157);
  font-size: var(--text-xs);
  font-weight: 700;
  padding: .2rem .55rem;
  border-radius: var(--radius-pill, 999px);
  text-transform: none;
  letter-spacing: 0;
}

/* ---- Bills + voting + contributions inside cards: tidy margins -------- */
.profile-card .legislative-bills { margin: var(--space-4) 0 0; }
.profile-card .bills-summary { font-size: var(--text-base); color: var(--colour-text-muted, #6b6157); margin: 0 0 var(--space-4); }
.profile-card .bill-item { padding: var(--space-4); }
.profile-card .contributions-holder { margin: 0; }
.profile-card .stat-grid { margin-bottom: var(--space-4); }
.profile-card .voting-summary { padding: 0; margin: var(--space-4) 0 var(--space-3); }
.profile-card .voting-summary h4 { margin: 0; }

/* ---- Contributions list: give the dense stack room to breathe -------- */
.contributions-list { gap: var(--space-4); }
.contribution-group { padding: var(--space-4); }
.conversation-subgroup { padding: var(--space-3) 0; }
.contribution-item { padding: var(--space-3) var(--space-4); }
.grouped-contribution { padding: var(--space-3) var(--space-4); }

/* ==========================================================================
   RESPONSIVE — sidebar stacks above main at ≤768px; nothing overflows at 360px
   ========================================================================== */
@media (max-width: 768px) {
  .member-container,
  .senator-detail-container { flex-direction: column; }
  .senator-header { display: flex; flex-direction: column; }
  aside.member-essentials,
  main.member-info { flex: 0 1 100% !important; width: 100%; }
  aside.member-essentials { order: 1; }
  main.member-info { order: 2; }

  .profile-hero { grid-template-columns: 120px 1fr; gap: var(--space-4); padding: var(--space-4); }
  .profile-hero__name { font-size: var(--text-xl); }
}

@media (max-width: 560px) {
  .profile-hero { grid-template-columns: 1fr; }
  .profile-hero__photo { max-width: 160px; }
  .profile-hero__stats { grid-template-columns: repeat(2, 1fr); }
  .profile-card { padding: var(--space-4); }
  .profile-hero { padding: var(--space-4); }
}

@media (max-width: 360px) {
  .profile-hero__facts { grid-template-columns: 1fr; }
}