/* Per-state endorsement page styles (/endorsements/state/<code>/) */
.state-hero {
      text-align: center;
      padding: 48px 24px 32px;
      background: linear-gradient(135deg, var(--color-navy) 0%, var(--color-accent) 100%);
      color: #fff;
    }
    .state-hero h1 { font-size: 2rem; font-weight: 800; color: #fff; margin-bottom: 8px; }
    .state-hero .tagline {
      color: rgba(255,255,255,0.85); font-size: 1rem;
      max-width: 600px; margin: 0 auto 16px;
    }
    .state-hero .meta {
      display: inline-flex; gap: 16px; flex-wrap: wrap; justify-content: center;
      color: rgba(255,255,255,0.85); font-size: 0.88rem;
    }
    .state-hero .meta strong { color: #fff; font-weight: 700; }

    .breadcrumb {
      font-size: 0.82rem; color: var(--color-muted);
      padding: 14px 24px 0; max-width: 1080px; margin: 0 auto;
    }
    .breadcrumb a { color: var(--color-accent); text-decoration: none; }
    .breadcrumb a:hover { color: var(--color-red); }
    .breadcrumb .sep { margin: 0 6px; color: var(--color-faint); }

    .filters-row {
      max-width: 1080px; margin: 24px auto 0; padding: 0 24px;
      display: flex; flex-wrap: wrap; gap: 12px; align-items: center;
    }
    .filters-row input, .filters-row select {
      padding: 10px 14px; border: 1px solid var(--color-border);
      border-radius: var(--radius); font-family: var(--font-sans);
      font-size: 0.9rem; background: var(--color-surface);
    }
    .filters-row input { flex: 1; min-width: 220px; }
    .filters-row .count {
      margin-left: auto; font-size: 0.88rem; color: var(--color-muted);
    }

    #orgs-container {
      max-width: 1080px; margin: 24px auto 0; padding: 0 24px 64px;
    }

    .empty-state, .loading-state {
      text-align: center; padding: 80px 24px; color: var(--color-muted);
    }
    .empty-state h3 {
      font-size: 1.1rem; color: var(--color-navy); margin-bottom: 8px;
    }

    .footer-cta {
      background: var(--color-bg); padding: 40px 24px; text-align: center;
    }
    .footer-cta h3 {
      font-size: 1.2rem; color: var(--color-navy); margin-bottom: 8px;
    }
    .footer-cta p {
      color: var(--color-muted); max-width: 540px;
      margin: 0 auto 18px; font-size: 0.92rem;
    }
    .footer-cta .cta-btn {
      display: inline-block; padding: 12px 28px; border-radius: var(--radius);
      background: var(--color-navy); color: #fff;
      font-size: 0.9rem; font-weight: 600; text-decoration: none;
      transition: all 0.15s;
    }
    .footer-cta .cta-btn:hover { background: var(--color-accent); }

    /* ── Org detail (slug mode) ── */
    .org-detail-header {
      max-width: 1080px; margin: 0 auto; padding: 32px 24px 16px;
      display: flex; gap: 24px; align-items: flex-start;
    }
    @media (max-width: 700px) { .org-detail-header { flex-direction: column; gap: 12px; } }
    .org-detail-header .od-logo {
      width: 96px; height: 96px; border-radius: var(--radius-lg);
      object-fit: contain; background: var(--color-bg);
      border: 1px solid var(--color-border); flex-shrink: 0;
    }
    .org-detail-header .od-info { flex: 1; }
    .org-detail-header h1 {
      font-size: 1.7rem; font-weight: 800; color: var(--color-navy);
      margin-bottom: 4px;
    }
    .org-detail-header h1 .fav-star {
      vertical-align: 4px; font-size: 1.4rem; margin-left: 4px;
    }
    .org-detail-header .od-meta {
      display: flex; gap: 8px; flex-wrap: wrap;
      font-size: 0.85rem; color: var(--color-muted);
      margin-bottom: 10px;
    }
    .od-meta .badge {
      background: var(--color-bg); color: var(--color-navy);
      padding: 3px 10px; border-radius: 100px; font-weight: 600;
    }
    .org-detail-header .od-desc {
      font-size: 0.92rem; color: var(--color-body); line-height: 1.55;
      margin-bottom: 8px;
    }
    .org-detail-header .od-links {
      display: flex; gap: 14px; font-size: 0.85rem;
    }
    .org-detail-header .od-links a {
      color: var(--color-accent); text-decoration: none; font-weight: 600;
    }

    .ballot-notice {
      max-width: 1080px; margin: 16px auto 0; padding: 0 24px;
    }
    .ballot-notice-inner {
      background: var(--color-bg); border: 1px solid var(--color-border);
      border-left: 4px solid var(--color-navy); border-radius: var(--radius);
      padding: 14px 18px; font-size: 0.88rem; color: var(--color-body);
      display: flex; gap: 12px; align-items: center; flex-wrap: wrap;
    }
    .ballot-notice-inner.on { border-left-color: #16a34a; }
    .ballot-notice-inner a { color: var(--color-accent); font-weight: 600; text-decoration: none; }
    .ballot-notice-inner .icon { font-size: 1.1rem; }

    .level-section {
      max-width: 1080px; margin: 32px auto 0; padding: 0 24px;
    }
    .level-header {
      display: flex; align-items: baseline; gap: 12px;
      padding-bottom: 8px; margin-bottom: 16px;
      border-bottom: 2px solid var(--color-navy);
    }
    .level-header h2 {
      font-size: 1.25rem; font-weight: 800; color: var(--color-navy);
      margin: 0;
    }
    .level-header .level-count {
      font-size: 0.82rem; color: var(--color-muted);
    }

    .endorsement-card {
      background: var(--color-surface); border: 1px solid var(--color-border);
      border-radius: var(--radius-lg); padding: 16px;
      display: flex; gap: 16px; align-items: center;
      margin-bottom: 10px;
      transition: box-shadow 0.15s;
    }
    .endorsement-card:hover { box-shadow: var(--shadow-sm); }
    .endorsement-card .ec-photo {
      width: 56px; height: 56px; border-radius: 50%;
      object-fit: cover; background: var(--color-bg);
      flex-shrink: 0;
    }
    .endorsement-card .ec-photo.placeholder {
      display: flex; align-items: center; justify-content: center;
      font-weight: 700; color: var(--color-muted); font-size: 1rem;
    }
    .endorsement-card .ec-info { flex: 1; min-width: 0; }
    .endorsement-card .ec-race {
      font-size: 0.75rem; text-transform: uppercase; letter-spacing: 0.5px;
      color: var(--color-muted); font-weight: 600; margin-bottom: 2px;
    }
    .endorsement-card .ec-name {
      font-size: 1.02rem; font-weight: 700; color: var(--color-heading);
      margin-bottom: 2px;
    }
    .endorsement-card .ec-name a {
      color: inherit; text-decoration: none;
    }
    .endorsement-card .ec-name a:hover { color: var(--color-accent); }
    .endorsement-card .ec-sub {
      font-size: 0.82rem; color: var(--color-muted);
    }
    .endorsement-card .ec-sub .party-pill {
      display: inline-block; padding: 1px 8px; border-radius: 100px;
      font-size: 0.7rem; font-weight: 700; margin-right: 6px;
    }
    .endorsement-card .ec-action { flex-shrink: 0; }

    /* Ballot check button (mirrors ballot.js styles) */
    .ballot-check {
      width: 36px; height: 36px; border-radius: 50%;
      border: 2px solid var(--color-border); background: var(--color-surface);
      cursor: pointer; display: flex; align-items: center; justify-content: center;
      transition: all 0.15s; padding: 0;
    }
    .ballot-check:hover { border-color: #16a34a; }
    .ballot-check .check-icon {
      width: 18px; height: 18px; stroke: transparent;
    }
    .ballot-check.checked {
      background: #16a34a; border-color: #16a34a;
    }
    .ballot-check.checked .check-icon { stroke: #fff; }

    .sentiment-btns {
      display: inline-flex; gap: 6px;
    }
    .sentiment-btn {
      width: 36px; height: 36px; border-radius: 50%;
      border: 1px solid var(--color-border); background: var(--color-surface);
      cursor: pointer; font-size: 1rem; transition: all 0.15s;
    }
    .sentiment-btn:hover { background: var(--color-bg); }
    .sentiment-btn.active { background: var(--color-navy); border-color: var(--color-navy); }

    .party-pill.dem { background: #dbeafe; color: #1e3a8a; }
    .party-pill.rep { background: #fee2e2; color: #991b1b; }
    .party-pill.ind, .party-pill.np { background: var(--color-bg); color: var(--color-navy); }

    .period-bar {
      max-width: 1080px; margin: 20px auto 0; padding: 0 24px;
    }
    .period-bar .period-switcher { margin: 0; }
    .share-bar {
      max-width: 1080px; margin: 20px auto 0; padding: 0 24px;
      display: flex; gap: 10px; flex-wrap: wrap;
    }
    .share-bar a, .share-bar button {
      padding: 8px 14px; border-radius: 100px;
      font-size: 0.82rem; font-weight: 600; text-decoration: none;
      border: 1px solid var(--color-navy); background: var(--color-surface);
      color: var(--color-navy); cursor: pointer;
      font-family: var(--font-sans);
      transition: background 0.15s, color 0.15s;
    }
    .share-bar a:hover, .share-bar button:hover {
      background: var(--color-navy); color: #fff;
    }

    .endorsement-race-card { margin-bottom: 14px; }

    /* Aggregate endorser banner */
    .op-aggregate-wrap {
      max-width: 1080px; margin: 8px auto 20px; padding: 0 24px;
    }
    .op-aggregate-banner {
      padding: 18px 22px;
      background: linear-gradient(135deg, var(--color-navy) 0%, var(--color-accent) 100%);
      color: #fff; border-radius: var(--radius-lg);
    }
    .op-aggregate-banner .op-ab-head { display: flex; gap: 8px; margin-bottom: 8px; }
    .op-aggregate-banner .op-ab-pill {
      font-size: 0.66rem; font-weight: 800;
      text-transform: uppercase; letter-spacing: 1px;
      padding: 3px 9px; border-radius: 100px;
      background: rgba(255,255,255,0.2); color: #fff;
    }
    .op-aggregate-banner .op-ab-text {
      margin: 0 0 12px; font-size: 0.92rem; line-height: 1.5;
      color: rgba(255,255,255,0.95);
    }
    .op-aggregate-banner .op-ab-text strong { color: #fff; }
    .op-aggregate-banner .op-ab-orgs { display: flex; gap: 10px; flex-wrap: wrap; }
    .op-aggregate-banner .op-ab-org {
      display: inline-flex; align-items: center; gap: 8px;
      padding: 6px 12px 6px 6px; border-radius: 100px;
      background: rgba(255,255,255,0.16); color: #fff;
      text-decoration: none; font-size: 0.85rem; font-weight: 600;
    }
    .op-aggregate-banner .op-ab-org:hover { background: rgba(255,255,255,0.28); }
    .op-aggregate-banner .op-ab-org img {
      width: 28px; height: 28px; border-radius: 50%;
      object-fit: contain; background: #fff;
    }
    .op-aggregate-banner .op-ab-org-letter {
      width: 28px; height: 28px; border-radius: 50%;
      background: #fff; color: var(--color-navy);
      display: flex; align-items: center; justify-content: center;
      font-weight: 800;
    }

    /* Source-org logo stack on candidate cards (aggregate mode) */
    .ec-sources {
      display: inline-flex; align-items: center;
      margin-left: auto;
    }
    .ec-source-logo {
      display: inline-block; line-height: 0;
      width: 28px; height: 28px; border-radius: 50%;
      overflow: hidden; background: #fff;
      border: 2px solid var(--color-surface);
      box-shadow: 0 0 0 1px var(--color-border);
      margin-left: -6px;
      transition: transform 0.15s, box-shadow 0.15s;
      position: relative;
    }
    .ec-source-logo:first-child { margin-left: 0; }
    .ec-source-logo:hover {
      transform: scale(1.15) translateY(-1px);
      z-index: 2;
      box-shadow: 0 0 0 1px var(--color-accent);
    }
    .ec-source-logo img {
      width: 100%; height: 100%; object-fit: contain; display: block;
    }
    .candidate-row .ec-sources + .fav-star { margin-left: 8px; }
    .candidate-action {
      margin-left: auto; display: inline-flex; align-items: center;
    }
    .candidate-action + .fav-star { margin-left: 6px; }
    .candidate-row .fav-star { margin-left: auto; }
    .candidate-row .candidate-action + .fav-star { margin-left: 6px; }
    .district-summary {
      max-width: 1080px; margin: 12px auto 0; padding: 0;
      background: var(--color-surface); border: 1px solid var(--color-border);
      border-radius: var(--radius-lg);
    }
    .district-summary .ds-header {
      display: flex; justify-content: space-between; align-items: center;
      padding: 12px 18px; font-size: 0.9rem;
      border-bottom: 1px solid var(--color-border);
    }
    .district-summary .ds-header strong { color: var(--color-navy); font-weight: 700; }
    .district-summary .ds-addr { color: var(--color-muted); font-weight: 400; }
    .district-summary .ds-header a {
      color: var(--color-accent); text-decoration: none; font-weight: 600; font-size: 0.85rem;
    }
    .district-summary .ds-panel { padding: 14px 18px 18px; }
    .district-summary .ds-disclaimer {
      font-size: 0.82rem; color: var(--color-muted); font-style: italic;
      margin: 0 0 12px;
    }
    .district-summary .ds-grid {
      display: grid; grid-template-columns: repeat(auto-fill, minmax(220px, 1fr));
      gap: 10px 16px;
    }
    .district-summary .ds-item {
      font-size: 0.85rem;
    }
    .district-summary .ds-label {
      font-size: 0.72rem; font-weight: 700; text-transform: uppercase;
      letter-spacing: 0.5px; color: var(--color-muted); margin-bottom: 4px;
    }
    .district-summary .ds-values { list-style: none; padding: 0; margin: 0; }
    .district-summary .ds-values li { color: var(--color-body); padding: 1px 0; }
    .district-summary .ds-code { color: var(--color-muted); font-size: 0.78rem; }