:root {
    /* Primary: Deep slate blue — authority, trust */
    --color-primary: #2B3A67;
    --color-primary-light: #3A4F8A;
    --color-primary-dark: #1E2A4A;

    /* Accent: Capitol gold — the "King Street" nod */
    --color-accent: #C5A55A;
    --color-accent-light: #D4B96E;
    --color-accent-dark: #A88B3D;

    /* Party colors */
    --color-democrat: #3B82F6;
    --color-republican: #EF4444;
    --color-independent: #8B5CF6;

    /* Text colors */
    --color-text-primary: #1F2937;
    --color-text-secondary: #374151;
    --color-text-dim: #6B7280;
    --color-text-inverse: #FFFFFF;

    /* Backgrounds */
    --color-bg-primary: #FFFFFF;
    --color-bg-surface: #F9FAFB;
    --color-bg-dark: #2B3A67;
    --color-bg-dark-alt: #1E2A4A;

    /* Borders */
    --color-border: #E5E7EB;
    --color-border-light: #F3F4F6;
    --color-border-dark: #D1D5DB;

    /* Functional */
    --color-success: #10B981;
    --color-warning: #F59E0B;
    --color-error: #EF4444;
    --color-info: #3B82F6;

    /* Typography — system fonts for speed */
    --font-body: -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif;
    --font-heading: Georgia, 'Times New Roman', serif;
    --font-mono: 'SFMono-Regular', Consolas, 'Liberation Mono', Menlo, monospace;

    --font-size-xs: 0.75rem;
    --font-size-sm: 0.875rem;
    --font-size-base: 1rem;
    --font-size-lg: 1.125rem;
    --font-size-xl: 1.25rem;
    --font-size-2xl: 1.5rem;
    --font-size-3xl: 1.875rem;
    --font-size-4xl: 2.25rem;
    --font-size-5xl: 3rem;

    --font-weight-normal: 400;
    --font-weight-semibold: 600;
    --font-weight-bold: 700;

    --line-height-tight: 1.25;
    --line-height-base: 1.6;
    --line-height-relaxed: 1.75;

    /* Spacing scale */
    --spacing-xs: 0.25rem;
    --spacing-sm: 0.5rem;
    --spacing-md: 1rem;
    --spacing-lg: 1.5rem;
    --spacing-xl: 2rem;
    --spacing-2xl: 3rem;
    --spacing-3xl: 4rem;

    /* Border Radius */
    --radius-sm: 4px;
    --radius-md: 6px;
    --radius-lg: 12px;
    --radius-full: 9999px;

    /* Shadows */
    --shadow-sm: 0 1px 2px rgba(0, 0, 0, 0.05);
    --shadow-md: 0 4px 6px rgba(0, 0, 0, 0.07);
    --shadow-lg: 0 10px 15px rgba(0, 0, 0, 0.1);

    /* Transitions */
    --transition-fast: 150ms ease;
    --transition-base: 250ms ease;

    /* Layout */
    --container-max: 1200px;
    --container-narrow: 800px;
}
*, *::before, *::after {
    box-sizing: border-box;
    margin: 0;
    padding: 0;
}

html {
    font-size: 100%;
    -webkit-text-size-adjust: 100%;
    scroll-behavior: smooth;
    overflow-x: hidden;
}

body {
    font-family: var(--font-body);
    font-size: var(--font-size-base);
    line-height: var(--line-height-base);
    color: var(--color-text-primary);
    background-color: var(--color-bg-primary);
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
    padding-left: env(safe-area-inset-left);
    padding-right: env(safe-area-inset-right);
    padding-bottom: env(safe-area-inset-bottom);
}

img, picture, video, canvas, svg {
    display: block;
    max-width: 100%;
}

input, button, textarea, select {
    font: inherit;
}

a {
    color: var(--color-primary);
    text-decoration: none;
    transition: color var(--transition-fast);
}

a:hover {
    color: var(--color-primary-dark);
    text-decoration: underline;
}

table {
    border-collapse: collapse;
    width: 100%;
}

ul, ol {
    list-style: none;
}
h1, h2, h3, h4, h5, h6 {
    font-family: var(--font-heading);
    font-weight: var(--font-weight-bold);
    line-height: var(--line-height-tight);
    color: var(--color-text-primary);
}

h1 { font-size: var(--font-size-4xl); margin-bottom: var(--spacing-lg); }
h2 { font-size: var(--font-size-3xl); margin-bottom: var(--spacing-md); }
h3 { font-size: var(--font-size-2xl); margin-bottom: var(--spacing-md); }
h4 { font-size: var(--font-size-xl); margin-bottom: var(--spacing-sm); }
h5 { font-size: var(--font-size-lg); margin-bottom: var(--spacing-sm); }
h6 { font-size: var(--font-size-base); margin-bottom: var(--spacing-sm); }

p {
    margin-bottom: var(--spacing-md);
}

strong {
    font-weight: var(--font-weight-semibold);
}

small {
    font-size: var(--font-size-sm);
}

.text-accent {
    color: var(--color-accent);
}

.text-dim {
    color: var(--color-text-dim);
}
.container {
    max-width: var(--container-max);
    margin: 0 auto;
    padding: 0 var(--spacing-md);
}

.container-narrow {
    max-width: var(--container-narrow);
    margin: 0 auto;
    padding: 0 var(--spacing-md);
}

main {
    min-height: 60vh;
    padding: var(--spacing-2xl) 0;
}

.home main {
    padding-top: 0;
}

.section-header {
    margin-bottom: var(--spacing-2xl);
}

.grid {
    display: grid;
    gap: var(--spacing-lg);
}

.grid-2 { grid-template-columns: repeat(2, 1fr); }
.grid-3 { grid-template-columns: repeat(3, 1fr); }
.grid-4 { grid-template-columns: repeat(4, 1fr); }

@media (max-width: 768px) {
    .grid-2, .grid-3, .grid-4 {
        grid-template-columns: 1fr;
    }
}

@media (min-width: 769px) and (max-width: 1024px) {
    .grid-3, .grid-4 {
        grid-template-columns: repeat(2, 1fr);
    }
}
.site-header {
    background-color: var(--color-bg-dark);
    color: var(--color-text-inverse);
    padding: var(--spacing-md) 0;
    position: sticky;
    top: 0;
    z-index: 100;
    border-bottom: 1px solid var(--color-primary-dark);
}

.site-header .container {
    display: flex;
    align-items: center;
    justify-content: space-between;
}

.site-logo {
    display: flex;
    align-items: center;
    text-decoration: none;
    gap: var(--spacing-sm);
    color: var(--color-text-inverse);
    background: #2C5F2D;
    padding: 6px 18px 6px 8px;
    border-radius: var(--radius-full);
    border: 1px solid rgba(255, 255, 255, 0.15);
    box-shadow: 0 2px 8px rgba(0, 0, 0, 0.3), inset 0 1px 0 rgba(255, 255, 255, 0.05);
    transition: all var(--transition-fast);
}

.site-logo:hover {
    text-decoration: none;
    color: var(--color-text-inverse);
    background: #245226;
    border-color: rgba(255, 255, 255, 0.25);
    box-shadow: 0 4px 12px rgba(0, 0, 0, 0.4), inset 0 1px 0 rgba(255, 255, 255, 0.08);
}

.site-logo-icon {
    width: 38px;
    height: 38px;
    flex-shrink: 0;
}

.site-logo-text {
    font-family: var(--font-heading);
    font-size: var(--font-size-xl);
    font-weight: var(--font-weight-bold);
    letter-spacing: -0.01em;
}

.site-logo-text .logo-accent {
    color: var(--color-accent);
}

.main-nav ul {
    display: flex;
    gap: var(--spacing-lg);
}

.main-nav a {
    color: rgba(255, 255, 255, 0.8);
    font-family: var(--font-body);
    font-weight: var(--font-weight-semibold);
    font-size: var(--font-size-sm);
    text-transform: uppercase;
    letter-spacing: 0.05em;
    padding: var(--spacing-xs) 0;
    border-bottom: 2px solid transparent;
    transition: all var(--transition-fast);
}

.main-nav a:hover,
.main-nav a.active {
    color: var(--color-accent);
    border-bottom-color: var(--color-accent);
    text-decoration: none;
}

/* Mobile hamburger menu */
.nav-toggle {
    display: none;
    background: none;
    border: none;
    cursor: pointer;
    padding: var(--spacing-sm);
    color: var(--color-text-inverse);
}

.nav-toggle span {
    display: block;
    width: 24px;
    height: 2px;
    background-color: currentColor;
    margin: 5px 0;
    transition: transform var(--transition-fast);
}

@media (max-width: 768px) {
    .nav-toggle {
        display: block;
    }

    .main-nav {
        display: none;
        position: absolute;
        top: 100%;
        left: 0;
        right: 0;
        background-color: var(--color-bg-dark);
        border-bottom: 1px solid var(--color-primary-dark);
        padding: var(--spacing-md);
    }

    .main-nav.is-open {
        display: block;
    }

    .main-nav ul {
        flex-direction: column;
        gap: 0;
    }

    .main-nav a {
        display: block;
        padding: var(--spacing-sm) var(--spacing-md);
        border-bottom: none;
        min-height: 44px;
        display: flex;
        align-items: center;
    }
}
.site-footer {
    background-color: var(--color-bg-dark);
    color: rgba(255, 255, 255, 0.6);
    padding: var(--spacing-2xl) 0 var(--spacing-lg);
    margin-top: var(--spacing-3xl);
    border-top: 3px solid var(--color-accent);
}

.footer-content {
    display: flex;
    justify-content: space-between;
    gap: var(--spacing-2xl);
    margin-bottom: var(--spacing-xl);
}

.footer-brand {
    max-width: 350px;
}

.footer-brand .footer-site-name {
    font-family: var(--font-heading);
    font-size: var(--font-size-lg);
    font-weight: var(--font-weight-bold);
    color: var(--color-text-inverse);
    text-decoration: none;
    display: inline-block;
    margin-bottom: var(--spacing-sm);
}

.footer-brand .footer-site-name:hover {
    color: var(--color-accent);
    text-decoration: none;
}

.footer-brand p {
    font-size: var(--font-size-sm);
    line-height: var(--line-height-relaxed);
    margin-top: var(--spacing-sm);
}

.footer-nav ul {
    display: flex;
    flex-direction: column;
    gap: var(--spacing-sm);
}

.footer-nav a {
    color: rgba(255, 255, 255, 0.6);
    font-size: var(--font-size-sm);
}

.footer-nav a:hover {
    color: var(--color-accent);
    text-decoration: none;
}

.footer-bottom {
    border-top: 1px solid rgba(255, 255, 255, 0.1);
    padding-top: var(--spacing-md);
    font-size: var(--font-size-xs);
    text-align: center;
}

.footer-bottom a {
    color: rgba(255, 255, 255, 0.6);
}

.footer-bottom a:hover {
    color: var(--color-accent);
}

.footer-credit {
    margin-top: var(--spacing-sm);
    opacity: 0.6;
    display: flex;
    align-items: center;
    justify-content: center;
    gap: var(--spacing-xs);
}

.footer-credit a {
    display: inline-flex;
    align-items: center;
}

.footer-credit-logo {
    height: 16px;
    width: auto;
    vertical-align: middle;
    transition: opacity var(--transition-fast);
}

.footer-credit:hover {
    opacity: 1;
}

@media (max-width: 768px) {
    .footer-content {
        flex-direction: column;
        gap: var(--spacing-lg);
        text-align: center;
    }

    .footer-brand {
        max-width: none;
    }

    .footer-nav ul {
        flex-direction: row;
        justify-content: center;
        flex-wrap: wrap;
        gap: var(--spacing-sm) var(--spacing-md);
    }
}
.breadcrumbs {
    padding: var(--spacing-md) 0;
    font-size: var(--font-size-sm);
    color: var(--color-text-dim);
}

.breadcrumbs a {
    color: var(--color-text-dim);
}

.breadcrumbs a:hover {
    color: var(--color-primary);
}

.breadcrumbs .separator {
    margin: 0 var(--spacing-xs);
    color: var(--color-text-dim);
}

.breadcrumbs .current {
    color: var(--color-text-secondary);
    font-weight: var(--font-weight-semibold);
}

@media (max-width: 430px) {
    .breadcrumbs {
        font-size: var(--font-size-xs);
        padding: var(--spacing-sm) 0;
        overflow-x: auto;
        white-space: nowrap;
        -webkit-overflow-scrolling: touch;
    }
}
.card {
    background-color: var(--color-bg-primary);
    border: 1px solid var(--color-border);
    border-radius: var(--radius-md);
    padding: var(--spacing-lg);
    transition: all var(--transition-base);
}

.card:hover {
    border-color: var(--color-border-dark);
    box-shadow: var(--shadow-md);
}

.card a {
    text-decoration: none;
    color: inherit;
}

.card-title {
    font-family: var(--font-heading);
    font-size: var(--font-size-lg);
    font-weight: var(--font-weight-bold);
    margin-bottom: var(--spacing-sm);
    color: var(--color-text-primary);
}

.card-meta {
    font-size: var(--font-size-sm);
    color: var(--color-text-dim);
    margin-bottom: var(--spacing-sm);
}

.card-stat {
    font-size: var(--font-size-2xl);
    font-weight: var(--font-weight-bold);
    color: var(--color-primary);
}

.card-stat-label {
    font-size: var(--font-size-xs);
    text-transform: uppercase;
    letter-spacing: 0.05em;
    color: var(--color-text-dim);
}

/* Member card — congress member cards */
.member-card {
    display: flex;
    align-items: center;
    gap: var(--spacing-md);
    padding: var(--spacing-md) var(--spacing-lg);
}

.member-card .member-photo {
    width: 72px;
    height: 72px;
    border-radius: var(--radius-full);
    object-fit: cover;
    border: 2px solid var(--color-border);
}

.member-card .member-info {
    flex: 1;
}

.member-card .member-name {
    font-weight: var(--font-weight-semibold);
    color: var(--color-text-primary);
}

.member-card .member-detail {
    font-size: var(--font-size-sm);
    color: var(--color-text-dim);
}

/* Party color indicators */
.party-democrat { border-left: 3px solid var(--color-democrat); }
.party-republican { border-left: 3px solid var(--color-republican); }
.party-independent { border-left: 3px solid var(--color-independent); }

/* State card */
.state-card {
    display: flex;
    align-items: center;
    gap: var(--spacing-md);
    padding: var(--spacing-md) var(--spacing-lg);
}

.state-card .state-info {
    flex: 1;
}

.state-card .state-name {
    font-weight: var(--font-weight-semibold);
    color: var(--color-text-primary);
}

.state-card .state-detail {
    font-size: var(--font-size-sm);
    color: var(--color-text-dim);
}
.stats-bar {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(200px, 1fr));
    gap: var(--spacing-md);
    margin-bottom: var(--spacing-2xl);
}

.stat-card {
    background: var(--color-bg-primary);
    border: 1px solid var(--color-border);
    border-radius: var(--radius-lg);
    padding: var(--spacing-lg);
    text-align: center;
    position: relative;
    overflow: hidden;
    transition: border-color var(--transition-base), box-shadow var(--transition-base), transform var(--transition-base);
}

.stat-card::before {
    content: '';
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    height: 3px;
    background: linear-gradient(90deg, var(--color-primary), var(--color-accent));
}

.stat-card:hover {
    border-color: var(--color-border-dark);
    box-shadow: var(--shadow-md);
    transform: translateY(-1px);
}

.stat-card .stat-value {
    font-size: var(--font-size-3xl);
    font-weight: var(--font-weight-bold);
    color: var(--color-primary);
    line-height: 1;
    margin-bottom: var(--spacing-xs);
}

.stat-card .stat-label {
    font-size: var(--font-size-sm);
    color: var(--color-text-dim);
    text-transform: uppercase;
    letter-spacing: 0.06em;
}

.stat-card .stat-unit {
    font-size: var(--font-size-sm);
    color: var(--color-text-dim);
}

/* Party-colored stat badges */
.stat-democrat .stat-value { color: var(--color-democrat); }
.stat-republican .stat-value { color: var(--color-republican); }
.stat-independent .stat-value { color: var(--color-independent); }

@media (max-width: 768px) {
    .stats-bar {
        grid-template-columns: repeat(2, 1fr);
    }
}
.data-table {
    width: 100%;
    border-collapse: separate;
    border-spacing: 0;
    margin-bottom: var(--spacing-xl);
    background-color: var(--color-bg-primary);
    border-radius: var(--radius-lg);
    overflow: hidden;
    border: 1px solid var(--color-border);
    box-shadow: var(--shadow-sm);
}

.data-table thead {
    background-color: var(--color-bg-surface);
}

.data-table th {
    padding: var(--spacing-sm) var(--spacing-md);
    text-align: left;
    font-size: var(--font-size-xs);
    font-family: var(--font-body);
    font-weight: var(--font-weight-bold);
    text-transform: uppercase;
    letter-spacing: 0.08em;
    color: var(--color-text-dim);
    border-bottom: 2px solid var(--color-border);
}

.data-table td {
    padding: var(--spacing-sm) var(--spacing-md);
    border-bottom: 1px solid var(--color-border-light);
    font-size: var(--font-size-sm);
    color: var(--color-text-secondary);
    transition: background-color var(--transition-fast);
}

/* Zebra striping */
.data-table tbody tr:nth-child(even) {
    background-color: var(--color-bg-surface);
}

.data-table tbody tr:nth-child(odd) {
    background-color: transparent;
}

.data-table tbody tr:hover {
    background-color: rgba(43, 58, 103, 0.04);
}

.data-table tbody tr:last-child td {
    border-bottom: none;
}

.data-table .numeric {
    text-align: right;
    font-variant-numeric: tabular-nums;
}

.data-table a {
    color: var(--color-primary);
    text-decoration: none;
    transition: color var(--transition-fast);
}

.data-table a:hover {
    color: var(--color-primary-dark);
    text-decoration: underline;
}

/* Sortable headers */
.data-table th.sortable {
    cursor: pointer;
    user-select: none;
    position: relative;
    padding-right: calc(var(--spacing-md) + 16px);
    transition: color var(--transition-fast);
}

.data-table th.sortable:hover {
    color: var(--color-text-primary);
}

.data-table th.sortable::after {
    content: '';
    position: absolute;
    right: var(--spacing-sm);
    top: 50%;
    transform: translateY(-50%);
    width: 0;
    height: 0;
    border-left: 4px solid transparent;
    border-right: 4px solid transparent;
    border-bottom: 5px solid var(--color-text-dim);
    opacity: 0.3;
    transition: opacity var(--transition-fast);
}

.data-table th.sortable:hover::after {
    opacity: 0.6;
}

.data-table th.sort-asc::after {
    border-bottom: 5px solid var(--color-primary);
    border-top: none;
    opacity: 1;
}

.data-table th.sort-desc::after {
    border-bottom: none;
    border-top: 5px solid var(--color-primary);
    opacity: 1;
}

/* Mobile horizontal scroll */
@media (max-width: 768px) {
    .data-table {
        font-size: var(--font-size-xs);
    }

    .data-table th, .data-table td {
        padding: var(--spacing-xs) var(--spacing-sm);
    }

    .data-table th {
        font-size: 0.65rem;
    }
}

@media (max-width: 430px) {
    .data-table {
        display: block;
        overflow-x: auto;
        -webkit-overflow-scrolling: touch;
        font-size: 0.72rem;
        border-radius: var(--radius-md);
    }

    .data-table th, .data-table td {
        padding: 6px 8px;
        white-space: nowrap;
    }

    .data-table th {
        font-size: 0.6rem;
    }
}
/* Home hero section */
.hero {
    background: linear-gradient(rgba(40, 50, 75, 0.5), rgba(40, 50, 75, 0.6)), url('/images/hero-bg.jpg') center 35%/cover no-repeat;
    background-color: var(--color-bg-dark);
    color: var(--color-text-inverse);
    padding: 3.5rem 0 3rem;
    text-align: left;
    border-bottom: 3px solid var(--color-accent);
    position: relative;
}

.hero h1 {
    color: var(--color-text-inverse);
    font-size: var(--font-size-4xl);
    margin-bottom: var(--spacing-sm);
    text-shadow: 0 2px 12px rgba(0, 0, 0, 0.6);
    max-width: 600px;
}

.hero p {
    font-size: var(--font-size-base);
    color: rgba(255, 255, 255, 0.85);
    max-width: 520px;
    margin: 0 0 var(--spacing-md);
    text-shadow: 0 1px 6px rgba(0, 0, 0, 0.5);
}

.hero-search {
    max-width: 420px;
    margin: 0;
    display: flex;
    gap: var(--spacing-sm);
}

.hero-search input {
    flex: 1;
    padding: 10px var(--spacing-md);
    border: 2px solid rgba(255, 255, 255, 0.2);
    border-radius: var(--radius-md);
    background: rgba(255, 255, 255, 0.1);
    color: var(--color-text-inverse);
    font-size: var(--font-size-base);
}

.hero-search input::placeholder {
    color: rgba(255, 255, 255, 0.5);
}

.hero-search input:focus {
    outline: none;
    border-color: var(--color-accent);
    background: rgba(255, 255, 255, 0.15);
    box-shadow: 0 0 0 3px rgba(197, 165, 90, 0.2);
}

.hero-search .btn {
    padding: 10px var(--spacing-lg);
    background-color: var(--color-accent);
    color: var(--color-bg-dark);
    border: none;
    border-radius: var(--radius-md);
    font-weight: var(--font-weight-bold);
    font-size: var(--font-size-sm);
    cursor: pointer;
    transition: background-color var(--transition-fast);
    white-space: nowrap;
}

.hero-search .btn:hover {
    background-color: var(--color-accent-light);
}

/* Hero error message */
.hero-error {
    max-width: 420px;
    margin: var(--spacing-sm) 0 0;
    padding: var(--spacing-xs) var(--spacing-md);
    background: rgba(239, 68, 68, 0.15);
    border: 1px solid rgba(239, 68, 68, 0.3);
    border-radius: var(--radius-md);
    color: #FCA5A5;
    font-size: var(--font-size-sm);
    text-align: center;
}

/* Stats + map section */
.home-overview {
    padding: var(--spacing-xl) 0 var(--spacing-lg);
}

.home-overview-grid {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: var(--spacing-lg);
    align-items: start;
}

.home-stats-column {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: var(--spacing-sm);
}

/* National map card */
.national-map-card {
    background: var(--color-bg-surface);
    border: 1px solid var(--color-border);
    border-radius: var(--radius-lg);
    overflow: hidden;
}

.national-map-container {
    width: 100%;
    height: 320px;
    background: #FFFFFF;
}

.national-map-container.leaflet-container {
    background: #FFFFFF !important;
}

.national-map-legend {
    padding: var(--spacing-xs) var(--spacing-md);
    display: flex;
    align-items: center;
    justify-content: center;
    gap: var(--spacing-lg);
    border-top: 1px solid var(--color-border);
    font-size: var(--font-size-xs);
    color: var(--color-text-dim);
}

/* Leaflet control overrides for national map */
.national-map-container .leaflet-control-zoom a {
    width: 28px;
    height: 28px;
    line-height: 28px;
    font-size: 14px;
    color: var(--color-text-primary);
    background: var(--color-bg-primary);
    border: 1px solid var(--color-border) !important;
}

.national-map-container .leaflet-control-zoom a:hover {
    background: var(--color-bg-surface);
}

.national-map-container .leaflet-control-zoom {
    border: none !important;
    box-shadow: var(--shadow-sm);
}

/* National map tooltips */
.nm-tooltip {
    background: rgba(17, 17, 17, 0.95) !important;
    color: #FFFFFF !important;
    border: 1px solid rgba(255, 255, 255, 0.15) !important;
    border-radius: var(--radius-md) !important;
    padding: 8px 12px !important;
    font-family: var(--font-body);
    font-size: var(--font-size-sm) !important;
    line-height: 1.4;
    box-shadow: 0 4px 12px rgba(0, 0, 0, 0.3) !important;
    max-width: 200px;
}

.nm-tooltip::before {
    border-top-color: rgba(17, 17, 17, 0.95) !important;
}

.nm-tooltip-state {
    font-weight: var(--font-weight-bold);
    font-size: var(--font-size-sm);
    margin-bottom: 2px;
}

.nm-tooltip-counts {
    font-size: var(--font-size-xs);
    display: flex;
    gap: 6px;
}

/* State card flag in grid */
.state-card__flag {
    width: 40px;
    height: 27px;
    object-fit: cover;
    border-radius: var(--radius-sm);
    border: 1px solid var(--color-border);
    flex-shrink: 0;
}

/* States section heading */
.states-section {
    padding: var(--spacing-lg) 0 var(--spacing-xl);
}

.states-section h2 {
    margin-bottom: var(--spacing-md);
}

/* State grid on homepage */
.states-grid {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(260px, 1fr));
    gap: var(--spacing-sm);
}

@media (max-width: 768px) {
    .hero {
        text-align: center;
        padding: var(--spacing-2xl) 0;
    }
    .hero h1 {
        font-size: var(--font-size-2xl);
        max-width: none;
    }
    .hero p {
        font-size: var(--font-size-sm);
        max-width: none;
        margin-left: auto;
        margin-right: auto;
    }

    .hero-search {
        flex-direction: column;
        margin: 0 auto;
    }

    .hero-error {
        margin: var(--spacing-sm) auto 0;
    }

    .home-overview-grid {
        grid-template-columns: 1fr;
    }

    .national-map-container {
        height: 260px;
    }

    .states-grid {
        grid-template-columns: repeat(2, 1fr);
        gap: var(--spacing-sm);
    }
}

@media (max-width: 430px) {
    .hero {
        padding: var(--spacing-lg) 0;
    }

    .hero h1 {
        font-size: var(--font-size-xl);
        line-height: 1.3;
    }

    .hero p {
        font-size: var(--font-size-xs);
    }

    .hero-search input {
        font-size: var(--font-size-base);
        padding: 12px var(--spacing-md);
    }

    .hero-search .btn {
        padding: 12px var(--spacing-lg);
        min-height: 44px;
    }

    .home-stats-column {
        grid-template-columns: 1fr 1fr;
    }

    .national-map-container {
        height: 220px;
    }

    .states-grid {
        grid-template-columns: repeat(2, 1fr);
        gap: var(--spacing-xs);
    }
}
/* Congress section — member grid, filters, profile */

/* Congress page header */
.congress-header {
    margin-bottom: var(--spacing-lg);
}

.congress-header h1 {
    margin-bottom: var(--spacing-xs);
}

.congress-header p {
    color: var(--color-text-dim);
    font-size: var(--font-size-base);
    margin: 0;
}

/* Congress stats row */
.congress-stats {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: var(--spacing-sm);
    margin-bottom: var(--spacing-lg);
}

/* Congress filter controls */
.congress-filters {
    background: var(--color-bg-surface);
    border: 1px solid var(--color-border);
    border-radius: var(--radius-lg);
    padding: var(--spacing-md) var(--spacing-lg);
    margin-bottom: var(--spacing-lg);
}

.filter-row {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: var(--spacing-md) var(--spacing-xl);
    margin-bottom: var(--spacing-sm);
}

.filter-row:last-of-type {
    margin-bottom: 0;
}

.filter-group {
    display: flex;
    align-items: center;
    gap: var(--spacing-sm);
}

.filter-label {
    font-size: var(--font-size-xs);
    font-weight: var(--font-weight-bold);
    text-transform: uppercase;
    letter-spacing: 0.06em;
    color: var(--color-text-dim);
    white-space: nowrap;
}

/* Pill buttons */
.pill-group {
    display: flex;
    gap: 4px;
}

.pill {
    padding: 5px 14px;
    border: 1px solid var(--color-border);
    border-radius: var(--radius-full);
    background: var(--color-bg-primary);
    color: var(--color-text-secondary);
    font-size: var(--font-size-xs);
    font-weight: var(--font-weight-semibold);
    cursor: pointer;
    transition: all var(--transition-fast);
    white-space: nowrap;
}

.pill:hover {
    border-color: var(--color-border-dark);
    background: var(--color-bg-surface);
}

.pill.active {
    background: var(--color-primary);
    color: var(--color-text-inverse);
    border-color: var(--color-primary);
}

/* Party-colored pills when active */
.pill-republican.active {
    background: var(--color-republican);
    border-color: var(--color-republican);
}

.pill-democrat.active {
    background: var(--color-democrat);
    border-color: var(--color-democrat);
}

.pill-independent.active {
    background: var(--color-independent);
    border-color: var(--color-independent);
}

/* State select and search in filter */
.filter-group--state select,
.filter-group--search input {
    padding: 5px var(--spacing-md);
    border: 1px solid var(--color-border);
    border-radius: var(--radius-full);
    background-color: var(--color-bg-primary);
    color: var(--color-text-primary);
    font-size: var(--font-size-sm);
    min-width: 140px;
}

.filter-group--search input {
    min-width: 200px;
}

.filter-group--state select:focus,
.filter-group--search input:focus {
    outline: none;
    border-color: var(--color-primary);
    box-shadow: 0 0 0 2px rgba(43, 58, 103, 0.1);
}

/* Filter status bar */
.filter-status {
    display: flex;
    align-items: center;
    gap: var(--spacing-md);
    margin-top: var(--spacing-sm);
    padding-top: var(--spacing-sm);
    border-top: 1px solid var(--color-border);
    font-size: var(--font-size-sm);
    color: var(--color-text-dim);
}

.filter-clear-btn {
    padding: 2px 10px;
    border: 1px solid var(--color-border);
    border-radius: var(--radius-full);
    background: var(--color-bg-primary);
    color: var(--color-text-dim);
    font-size: var(--font-size-xs);
    cursor: pointer;
    transition: all var(--transition-fast);
}

.filter-clear-btn:hover {
    border-color: var(--color-error);
    color: var(--color-error);
}

/* Committees link at bottom */
.congress-committees-link {
    margin-top: var(--spacing-lg);
    margin-bottom: var(--spacing-xl);
}

.congress-committees-link .card {
    text-align: center;
    text-decoration: none;
    display: block;
}

/* Member grid */
.member-grid {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(300px, 1fr));
    gap: var(--spacing-md);
    margin-bottom: var(--spacing-2xl);
}

/* Filter bar (legacy members page) */
.filter-bar {
    display: flex;
    flex-wrap: wrap;
    gap: var(--spacing-sm);
    margin-bottom: var(--spacing-xl);
    padding: var(--spacing-md);
    background-color: var(--color-bg-surface);
    border: 1px solid var(--color-border);
    border-radius: var(--radius-md);
}

.filter-bar select,
.filter-bar input {
    padding: var(--spacing-sm) var(--spacing-md);
    border: 1px solid var(--color-border);
    border-radius: var(--radius-sm);
    background-color: var(--color-bg-primary);
    color: var(--color-text-primary);
    font-size: var(--font-size-sm);
}

.filter-bar select:focus,
.filter-bar input:focus {
    outline: none;
    border-color: var(--color-primary);
    box-shadow: 0 0 0 2px rgba(43, 58, 103, 0.1);
}

/* Party badge */
.party-badge {
    display: inline-flex;
    align-items: center;
    gap: 0.3em;
    padding: var(--spacing-xs) var(--spacing-sm);
    border-radius: var(--radius-full);
    font-size: var(--font-size-xs);
    font-weight: var(--font-weight-semibold);
    text-transform: uppercase;
    letter-spacing: 0.03em;
}

.party-letter {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 1.4em;
    height: 1.4em;
    border-radius: 50%;
    background-color: currentColor;
    color: #fff;
    font-size: 0.85em;
    font-weight: 700;
    line-height: 1;
    flex-shrink: 0;
}

.party-badge--democrat .party-letter { background-color: var(--color-democrat); }
.party-badge--republican .party-letter { background-color: var(--color-republican); }
.party-badge--independent .party-letter { background-color: var(--color-independent); }

.party-badge--democrat {
    background-color: rgba(59, 130, 246, 0.1);
    color: var(--color-democrat);
    border: 1px solid rgba(59, 130, 246, 0.2);
}

.party-badge--republican {
    background-color: rgba(239, 68, 68, 0.1);
    color: var(--color-republican);
    border: 1px solid rgba(239, 68, 68, 0.2);
}

.party-badge--independent {
    background-color: rgba(139, 92, 246, 0.1);
    color: var(--color-independent);
    border: 1px solid rgba(139, 92, 246, 0.2);
}

/* Member profile page */
.member-profile-header {
    display: flex;
    align-items: flex-start;
    gap: var(--spacing-lg);
    margin-bottom: var(--spacing-lg);
    padding-bottom: var(--spacing-lg);
    border-bottom: 1px solid var(--color-border);
}

.member-profile-photo {
    width: 140px;
    height: 140px;
    border-radius: var(--radius-full);
    object-fit: cover;
    border: 3px solid var(--color-border);
    flex-shrink: 0;
}

.member-profile-info {
    flex: 1;
    min-width: 0;
}

.member-profile-info h1 {
    margin-bottom: 2px;
    font-size: var(--font-size-3xl);
}

.member-profile-info .member-title {
    font-size: var(--font-size-base);
    color: var(--color-text-dim);
    margin-bottom: var(--spacing-sm);
}

/* Quick details row (state seal, office, phone, birthday) */
.member-details-row {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: var(--spacing-sm) var(--spacing-md);
    margin-bottom: var(--spacing-sm);
    font-size: var(--font-size-sm);
    color: var(--color-text-secondary);
}

.member-detail-item {
    display: inline-flex;
    align-items: center;
    gap: 5px;
}

.member-detail-item a {
    color: var(--color-primary);
    text-decoration: none;
}

.member-detail-item a:hover {
    text-decoration: underline;
}

.detail-icon {
    flex-shrink: 0;
    color: var(--color-text-dim);
}

.member-state-seal {
    width: 32px;
    height: 32px;
    object-fit: contain;
    flex-shrink: 0;
}

/* Social + contact links row */
.member-links {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 6px;
    margin-top: var(--spacing-xs);
}

.member-link {
    display: inline-flex;
    align-items: center;
    gap: 5px;
    padding: 4px 10px;
    border: 1px solid var(--color-border);
    border-radius: var(--radius-full);
    font-size: var(--font-size-xs);
    color: var(--color-text-secondary);
    text-decoration: none;
    transition: all var(--transition-fast);
    background: var(--color-bg-primary);
}

.member-link:hover {
    border-color: var(--color-primary);
    color: var(--color-primary);
    background: rgba(43, 58, 103, 0.04);
}

.member-link svg {
    flex-shrink: 0;
}

.member-link--social {
    padding: 5px 7px;
}

.member-link--social svg {
    width: 14px;
    height: 14px;
}

/* Member page body — term details + committees */
.member-body {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: var(--spacing-lg);
    margin-bottom: var(--spacing-xl);
}

.member-section h2 {
    font-size: var(--font-size-lg);
    margin-bottom: var(--spacing-sm);
    padding-bottom: var(--spacing-xs);
    border-bottom: 2px solid var(--color-border);
}

/* Term details grid */
.term-details {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 1px;
    background: var(--color-border);
    border: 1px solid var(--color-border);
    border-radius: var(--radius-md);
    overflow: hidden;
}

.term-detail {
    display: flex;
    flex-direction: column;
    padding: var(--spacing-sm) var(--spacing-md);
    background: var(--color-bg-primary);
}

.term-detail:last-child:nth-child(odd) {
    grid-column: 1 / -1;
}

.term-label {
    font-size: var(--font-size-xs);
    font-weight: var(--font-weight-bold);
    text-transform: uppercase;
    letter-spacing: 0.06em;
    color: var(--color-text-dim);
    margin-bottom: 2px;
}

.term-value {
    font-size: var(--font-size-sm);
    color: var(--color-text-primary);
    font-weight: var(--font-weight-semibold);
}

/* Committee list */
.committee-list {
    display: flex;
    flex-direction: column;
    border: 1px solid var(--color-border);
    border-radius: var(--radius-md);
    overflow: hidden;
}

.committee-item {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: var(--spacing-sm);
    padding: var(--spacing-sm) var(--spacing-md);
    border-bottom: 1px solid var(--color-border-light);
    background: var(--color-bg-primary);
}

.committee-item:nth-child(even) {
    background: var(--color-bg-surface);
}

.committee-item:last-child {
    border-bottom: none;
}

.committee-name {
    font-size: var(--font-size-sm);
    flex: 1;
    min-width: 0;
}

.committee-name a {
    color: var(--color-primary);
    text-decoration: none;
}

.committee-name a:hover {
    text-decoration: underline;
}

.committee-role {
    font-size: var(--font-size-xs);
    color: var(--color-text-dim);
    white-space: nowrap;
    font-weight: var(--font-weight-semibold);
}

/* Twitter/X timeline embed */
.member-twitter-section {
    margin-bottom: var(--spacing-xl);
}

.twitter-embed-wrapper {
    border: 1px solid var(--color-border);
    border-radius: var(--radius-md);
    overflow: hidden;
    max-width: 600px;
}

/* District map */
.district-map-card {
    background: var(--color-bg-surface);
    border: 1px solid var(--color-border);
    border-radius: var(--radius-lg);
    overflow: hidden;
    margin-bottom: var(--spacing-xl);
}

.district-map-container {
    width: 100%;
    background: #FFFFFF;
}

.district-map-container.leaflet-container {
    background: #FFFFFF !important;
}

.district-map-container .leaflet-control-zoom {
    border: 1px solid var(--color-border) !important;
    border-radius: var(--radius-sm) !important;
    overflow: hidden;
}

.district-map-container .leaflet-control-zoom a {
    background: #FFFFFF !important;
    color: #374151 !important;
    border-color: #D1D5DB !important;
    width: 32px !important;
    height: 32px !important;
    line-height: 32px !important;
    font-size: 16px;
}

.district-map-container .leaflet-control-zoom a:hover {
    background: #F3F4F6 !important;
}

.district-map-container .leaflet-interactive {
    cursor: pointer !important;
}

.district-map-legend {
    padding: var(--spacing-sm) var(--spacing-lg);
    display: flex;
    align-items: center;
    justify-content: center;
    gap: var(--spacing-lg);
    border-top: 1px solid var(--color-border);
}

.district-legend-item {
    display: flex;
    align-items: center;
    gap: var(--spacing-xs);
    font-size: var(--font-size-sm);
    color: var(--color-text-dim);
}

.district-legend-swatch {
    width: 12px;
    height: 12px;
    border-radius: 3px;
    display: inline-block;
}

/* District map tooltip */
.dm-tooltip {
    background: rgba(17, 17, 17, 0.95) !important;
    border: 1px solid rgba(255, 255, 255, 0.15) !important;
    border-radius: var(--radius-sm) !important;
    color: #fff !important;
    padding: 10px 14px !important;
    font-size: var(--font-size-sm);
    line-height: 1.4;
    max-width: 220px;
}

.dm-tooltip .dm-tooltip-district {
    font-weight: 700;
    margin-bottom: 2px;
}

.dm-tooltip .dm-tooltip-name {
    margin-bottom: 2px;
}

.dm-tooltip .dm-tooltip-party {
    font-weight: 600;
    font-size: var(--font-size-xs);
}

.leaflet-tooltip-top::before,
.leaflet-tooltip-bottom::before,
.leaflet-tooltip-left::before,
.leaflet-tooltip-right::before {
    border: none !important;
}

/* ========== Committee page ========== */
.committee-page-header {
    margin-bottom: var(--spacing-lg);
}

.committee-page-header h1 {
    margin-bottom: var(--spacing-xs);
}

.committee-meta {
    color: var(--color-text-dim);
    font-size: var(--font-size-sm);
    margin: 0;
}

.committee-meta a {
    color: var(--color-primary);
    text-decoration: none;
}

.committee-meta a:hover {
    text-decoration: underline;
}

/* Overview: chart + stats side by side */
.committee-overview {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: var(--spacing-lg);
    margin-bottom: var(--spacing-xl);
}

.committee-chart-card,
.committee-stats-card {
    background: var(--color-bg-primary);
    border: 1px solid var(--color-border);
    border-radius: var(--radius-lg);
    padding: var(--spacing-lg);
}

.committee-chart-card h3,
.committee-stats-card h3 {
    font-size: var(--font-size-sm);
    font-weight: var(--font-weight-bold);
    text-transform: uppercase;
    letter-spacing: 0.06em;
    color: var(--color-text-dim);
    margin: 0 0 var(--spacing-md);
}

/* Horizontal stacked party bar */
.party-bar {
    display: flex;
    height: 36px;
    border-radius: var(--radius-md);
    overflow: hidden;
    margin-bottom: var(--spacing-sm);
}

.party-bar-segment {
    display: flex;
    align-items: center;
    justify-content: center;
    color: #fff;
    font-size: var(--font-size-sm);
    font-weight: var(--font-weight-bold);
    min-width: 28px;
    transition: opacity var(--transition-fast);
}

.party-bar-segment:hover {
    opacity: 0.85;
}

.party-bar-R { background: var(--color-republican); }
.party-bar-D { background: var(--color-democrat); }
.party-bar-I { background: var(--color-independent); }

.party-bar-legend {
    display: flex;
    flex-wrap: wrap;
    gap: var(--spacing-md);
    font-size: var(--font-size-xs);
    color: var(--color-text-dim);
}

.party-bar-legend-item {
    display: flex;
    align-items: center;
    gap: 5px;
}

.party-bar-swatch {
    width: 10px;
    height: 10px;
    border-radius: 2px;
    display: inline-block;
}

/* Committee detail grid */
.committee-detail-grid {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 1px;
    background: var(--color-border);
    border: 1px solid var(--color-border);
    border-radius: var(--radius-md);
    overflow: hidden;
}

.committee-detail-item {
    display: flex;
    flex-direction: column;
    padding: var(--spacing-sm) var(--spacing-md);
    background: var(--color-bg-primary);
}

.committee-detail-label {
    font-size: var(--font-size-xs);
    font-weight: var(--font-weight-bold);
    text-transform: uppercase;
    letter-spacing: 0.06em;
    color: var(--color-text-dim);
    margin-bottom: 2px;
}

.committee-detail-value {
    font-size: var(--font-size-sm);
    color: var(--color-text-primary);
    font-weight: var(--font-weight-semibold);
}

/* Leadership cards */
.committee-leadership {
    margin-bottom: var(--spacing-xl);
}

.committee-leadership h2 {
    font-size: var(--font-size-lg);
    margin-bottom: var(--spacing-md);
}

.committee-leaders {
    display: flex;
    gap: var(--spacing-md);
    flex-wrap: wrap;
}

.committee-leader-card {
    display: flex;
    align-items: center;
    gap: var(--spacing-md);
    padding: var(--spacing-md) var(--spacing-lg);
    background: var(--color-bg-primary);
    border: 1px solid var(--color-border);
    border-radius: var(--radius-lg);
    text-decoration: none;
    color: inherit;
    flex: 1;
    min-width: 260px;
    transition: all var(--transition-fast);
}

.committee-leader-card:hover {
    border-color: var(--color-border-dark);
    box-shadow: var(--shadow-md);
}

.committee-leader-photo {
    width: 72px;
    height: 72px;
    border-radius: var(--radius-full);
    object-fit: cover;
    border: 2px solid var(--color-border);
    flex-shrink: 0;
}

.committee-leader-info {
    display: flex;
    flex-direction: column;
    gap: 2px;
}

.committee-leader-role {
    font-size: var(--font-size-xs);
    font-weight: var(--font-weight-bold);
    text-transform: uppercase;
    letter-spacing: 0.06em;
    color: var(--color-text-dim);
}

.committee-leader-name {
    font-size: var(--font-size-base);
    font-weight: var(--font-weight-semibold);
    color: var(--color-text-primary);
}

.committee-leader-detail {
    display: flex;
    align-items: center;
    gap: var(--spacing-sm);
    font-size: var(--font-size-sm);
    color: var(--color-text-dim);
}

/* Section count badge */
.section-count {
    font-size: var(--font-size-sm);
    font-weight: var(--font-weight-normal);
    color: var(--color-text-dim);
}

/* All members grid */
.committee-members-section {
    margin-bottom: var(--spacing-xl);
}

.committee-members-header {
    display: flex;
    align-items: center;
    justify-content: space-between;
    flex-wrap: wrap;
    gap: var(--spacing-sm);
    margin-bottom: var(--spacing-md);
}

.committee-members-header h2 {
    font-size: var(--font-size-lg);
    margin: 0;
}

.committee-members-grid {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(280px, 1fr));
    gap: var(--spacing-sm);
}

.committee-member-row {
    display: flex;
    align-items: center;
    gap: var(--spacing-sm);
    padding: var(--spacing-sm) var(--spacing-md);
    background: var(--color-bg-primary);
    border: 1px solid var(--color-border);
    border-radius: var(--radius-md);
    text-decoration: none;
    color: inherit;
    transition: all var(--transition-fast);
}

a.committee-member-row:hover {
    border-color: var(--color-border-dark);
    box-shadow: var(--shadow-sm);
}

.committee-member-photo {
    width: 36px;
    height: 36px;
    border-radius: var(--radius-full);
    object-fit: cover;
    flex-shrink: 0;
}

.committee-member-name {
    font-size: var(--font-size-sm);
    font-weight: var(--font-weight-semibold);
    flex: 1;
    min-width: 0;
    color: var(--color-text-primary);
}

.committee-member-detail {
    display: flex;
    align-items: center;
    gap: 4px;
    font-size: var(--font-size-xs);
    color: var(--color-text-dim);
    white-space: nowrap;
}

/* Subcommittees grid */
.committee-subcommittees-section {
    margin-bottom: var(--spacing-xl);
}

.committee-subcommittees-section h2 {
    font-size: var(--font-size-lg);
    margin-bottom: var(--spacing-md);
}

.committee-subcommittees-grid {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(220px, 1fr));
    gap: var(--spacing-sm);
}

.committee-subcommittee-card {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: var(--spacing-sm);
    padding: var(--spacing-sm) var(--spacing-md);
    background: var(--color-bg-primary);
    border: 1px solid var(--color-border);
    border-radius: var(--radius-md);
}

.committee-subcommittee-name {
    font-size: var(--font-size-sm);
    font-weight: var(--font-weight-semibold);
    color: var(--color-text-primary);
}

.committee-subcommittee-code {
    font-size: var(--font-size-xs);
    color: var(--color-text-dim);
    font-family: var(--font-mono);
}

/* Lobbying coming soon */
.committee-lobbying-section {
    margin-bottom: var(--spacing-xl);
}

.committee-lobbying-section h2 {
    font-size: var(--font-size-lg);
    margin-bottom: var(--spacing-md);
}

.committee-coming-soon {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: var(--spacing-sm);
    padding: var(--spacing-2xl) var(--spacing-lg);
    background: var(--color-bg-surface);
    border: 1px dashed var(--color-border);
    border-radius: var(--radius-lg);
    text-align: center;
    color: var(--color-text-dim);
}

.committee-coming-soon svg {
    color: var(--color-accent);
}

.committee-coming-soon p {
    font-size: var(--font-size-sm);
    margin: 0;
    max-width: 400px;
}

/* ========== Lobbying Dashboard ========== */

/* Section header with capitol icon */
.lobbying-section-header {
    display: flex;
    align-items: center;
    gap: var(--spacing-sm);
    margin-bottom: var(--spacing-lg);
}

.lobbying-section-header h2 {
    margin: 0;
    font-size: var(--font-size-lg);
}

.lobbying-capitol-icon {
    flex-shrink: 0;
    color: var(--color-primary);
    width: 28px;
    height: 28px;
}

/* Summary stat cards — 4-col grid */
.lobbying-summary {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: var(--spacing-sm);
    margin-bottom: var(--spacing-xl);
}

.lobbying-stat {
    display: flex;
    flex-direction: column;
    padding: var(--spacing-md) var(--spacing-lg);
    background: var(--color-bg-primary);
    border: 1px solid var(--color-border);
    border-radius: var(--radius-lg);
    text-align: center;
}

.lobbying-stat-value {
    font-size: var(--font-size-xl);
    font-weight: var(--font-weight-bold);
    color: var(--color-primary);
    line-height: var(--line-height-tight);
    margin-bottom: 4px;
}

.lobbying-stat-label {
    font-size: var(--font-size-xs);
    font-weight: var(--font-weight-bold);
    text-transform: uppercase;
    letter-spacing: 0.06em;
    color: var(--color-text-dim);
}

/* Quarterly trend chart */
.lobbying-chart-card {
    background: var(--color-bg-primary);
    border: 1px solid var(--color-border);
    border-radius: var(--radius-lg);
    padding: var(--spacing-lg);
    margin-bottom: var(--spacing-xl);
}

.lobbying-chart-card h3 {
    font-size: var(--font-size-sm);
    font-weight: var(--font-weight-bold);
    text-transform: uppercase;
    letter-spacing: 0.06em;
    color: var(--color-text-dim);
    margin: 0 0 var(--spacing-md);
}

.lobbying-chart {
    display: flex;
    align-items: flex-end;
    gap: 4px;
    height: 200px;
    padding-top: var(--spacing-md);
}

.lobbying-chart-bar-wrapper {
    flex: 1;
    display: flex;
    flex-direction: column;
    align-items: center;
    height: 100%;
    justify-content: flex-end;
    min-width: 0;
}

.lobbying-chart-bar {
    width: 100%;
    max-width: 48px;
    background: var(--color-primary);
    border-radius: var(--radius-sm) var(--radius-sm) 0 0;
    min-height: 2px;
    position: relative;
    transition: opacity var(--transition-fast);
    cursor: pointer;
}

.lobbying-chart-bar:hover {
    opacity: 0.8;
}

.lobbying-chart-amount {
    position: absolute;
    bottom: 100%;
    left: 50%;
    transform: translateX(-50%);
    font-size: 0.65rem;
    font-weight: var(--font-weight-semibold);
    color: var(--color-text-primary);
    white-space: nowrap;
    padding-bottom: 4px;
    opacity: 0;
    transition: opacity var(--transition-fast);
    pointer-events: none;
}

.lobbying-chart-bar:hover .lobbying-chart-amount {
    opacity: 1;
}

.lobbying-chart-label {
    font-size: 0.625rem;
    color: var(--color-text-dim);
    text-align: center;
    margin-top: 6px;
    line-height: 1.3;
    white-space: nowrap;
}

/* Top spenders — 2-col grid */
.lobbying-top-spenders {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: var(--spacing-lg);
    margin-bottom: var(--spacing-xl);
}

.lobbying-top-card {
    background: var(--color-bg-primary);
    border: 1px solid var(--color-border);
    border-radius: var(--radius-lg);
    padding: var(--spacing-lg);
}

.lobbying-top-card h3 {
    font-size: var(--font-size-sm);
    font-weight: var(--font-weight-bold);
    text-transform: uppercase;
    letter-spacing: 0.06em;
    color: var(--color-text-dim);
    margin: 0 0 var(--spacing-md);
}

.lobbying-top-list {
    display: flex;
    flex-direction: column;
    gap: 6px;
}

.lobbying-top-item {
    position: relative;
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: var(--spacing-sm) var(--spacing-md);
    border-radius: var(--radius-md);
    overflow: hidden;
    min-height: 38px;
}

.lobbying-top-bar {
    position: absolute;
    top: 0;
    left: 0;
    height: 100%;
    background: rgba(43, 58, 103, 0.08);
    border-radius: var(--radius-md);
    transition: width var(--transition-base);
}

.lobbying-top-bar--firm {
    background: rgba(139, 92, 246, 0.08);
}

.lobbying-top-name {
    position: relative;
    z-index: 1;
    font-size: var(--font-size-sm);
    font-weight: var(--font-weight-semibold);
    color: var(--color-text-primary);
    min-width: 0;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    flex: 1;
    padding-right: var(--spacing-sm);
}

.lobbying-top-amount {
    position: relative;
    z-index: 1;
    font-size: var(--font-size-sm);
    font-weight: var(--font-weight-semibold);
    color: var(--color-text-dim);
    white-space: nowrap;
    flex-shrink: 0;
}

/* Filing browser section */
.lobbying-filings-section {
    margin-bottom: var(--spacing-xl);
}

.lobbying-filings-header {
    display: flex;
    align-items: center;
    justify-content: space-between;
    flex-wrap: wrap;
    gap: var(--spacing-sm);
    margin-bottom: var(--spacing-md);
}

.lobbying-filings-header h3 {
    font-size: var(--font-size-lg);
    margin: 0;
    display: flex;
    align-items: center;
    gap: var(--spacing-sm);
}

.lobbying-filings-controls {
    display: flex;
    align-items: center;
    gap: var(--spacing-sm);
}

.lobbying-search-input,
.lobbying-sort-select {
    padding: 6px var(--spacing-md);
    border: 1px solid var(--color-border);
    border-radius: var(--radius-full);
    background-color: var(--color-bg-primary);
    color: var(--color-text-primary);
    font-size: var(--font-size-sm);
}

.lobbying-search-input {
    min-width: 200px;
}

.lobbying-sort-select {
    min-width: 160px;
    cursor: pointer;
}

.lobbying-search-input:focus,
.lobbying-sort-select:focus {
    outline: none;
    border-color: var(--color-primary);
    box-shadow: 0 0 0 2px rgba(43, 58, 103, 0.1);
}

/* Issue pills */
.lobbying-issue-pills {
    display: flex;
    flex-wrap: wrap;
    gap: 4px;
    margin-bottom: var(--spacing-md);
}

/* Data table */
.lobbying-table-wrapper {
    overflow-x: auto;
    border: 1px solid var(--color-border);
    border-radius: var(--radius-lg);
    margin-bottom: var(--spacing-md);
}

.lobbying-table {
    width: 100%;
    border-collapse: collapse;
    font-size: var(--font-size-sm);
}

.lobbying-table thead th {
    padding: var(--spacing-sm) var(--spacing-md);
    font-size: var(--font-size-xs);
    font-weight: var(--font-weight-bold);
    text-transform: uppercase;
    letter-spacing: 0.06em;
    color: var(--color-text-dim);
    background: var(--color-bg-surface);
    border-bottom: 2px solid var(--color-border);
    text-align: left;
    white-space: nowrap;
}

.lobbying-table thead th.numeric {
    text-align: right;
}

.lobbying-table tbody td {
    padding: var(--spacing-sm) var(--spacing-md);
    border-bottom: 1px solid var(--color-border-light);
    color: var(--color-text-primary);
    vertical-align: middle;
}

.lobbying-table tbody tr:hover {
    background: var(--color-bg-surface);
}

.lobbying-table tbody td.numeric {
    text-align: right;
    font-weight: var(--font-weight-semibold);
    white-space: nowrap;
}

.lobbying-link-col {
    width: 40px;
    text-align: center;
}

.lobbying-issue-tag {
    display: inline-block;
    padding: 2px 8px;
    font-size: 0.7rem;
    font-weight: var(--font-weight-semibold);
    color: var(--color-text-dim);
    background: var(--color-bg-surface);
    border: 1px solid var(--color-border);
    border-radius: var(--radius-full);
    white-space: nowrap;
}

.lobbying-filing-link {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    color: var(--color-text-dim);
    transition: color var(--transition-fast);
}

.lobbying-filing-link:hover {
    color: var(--color-primary);
}

.lobbying-filing-link svg {
    display: inline-block;
}

/* Pagination */
.lobbying-pagination {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 4px;
    padding: var(--spacing-sm) 0;
}

.page-btn {
    padding: 6px 12px;
    border: 1px solid var(--color-border);
    border-radius: var(--radius-md);
    background: var(--color-bg-primary);
    color: var(--color-text-secondary);
    font-size: var(--font-size-sm);
    font-weight: var(--font-weight-semibold);
    cursor: pointer;
    transition: all var(--transition-fast);
}

.page-btn:hover:not(:disabled):not(.page-btn--active) {
    border-color: var(--color-primary);
    color: var(--color-primary);
    background: rgba(43, 58, 103, 0.04);
}

.page-btn--active {
    background: var(--color-primary);
    color: var(--color-text-inverse);
    border-color: var(--color-primary);
    cursor: default;
}

.page-btn:disabled {
    opacity: 0.4;
    cursor: not-allowed;
}

.page-ellipsis {
    padding: 6px 4px;
    color: var(--color-text-dim);
    font-size: var(--font-size-sm);
    user-select: none;
}

@media (max-width: 768px) {
    .congress-stats {
        grid-template-columns: repeat(2, 1fr);
    }

    .filter-row {
        flex-direction: column;
        align-items: flex-start;
        gap: var(--spacing-sm);
    }

    .filter-group {
        flex-direction: column;
        align-items: flex-start;
        width: 100%;
    }

    .pill-group {
        flex-wrap: wrap;
    }

    .filter-group--state select,
    .filter-group--search input {
        width: 100%;
    }

    .member-grid {
        grid-template-columns: 1fr;
    }

    .filter-bar {
        flex-direction: column;
    }

    .member-profile-header {
        flex-direction: column;
        align-items: center;
        text-align: center;
    }

    .member-profile-photo {
        width: 110px;
        height: 110px;
    }

    .member-details-row {
        justify-content: center;
    }

    .member-links {
        justify-content: center;
    }

    .member-body {
        grid-template-columns: 1fr;
    }

    .committee-overview {
        grid-template-columns: 1fr;
    }

    .committee-leaders {
        flex-direction: column;
    }

    .committee-leader-card {
        min-width: 0;
    }

    .committee-members-grid {
        grid-template-columns: 1fr;
    }

    .district-map-container {
        height: 320px !important;
    }

    .district-map-legend {
        padding: var(--spacing-xs) var(--spacing-md);
        gap: var(--spacing-md);
    }

    /* Lobbying responsive */
    .lobbying-summary {
        grid-template-columns: repeat(2, 1fr);
    }

    .lobbying-chart {
        height: 150px;
    }

    .lobbying-top-spenders {
        grid-template-columns: 1fr;
    }

    .lobbying-filings-header {
        flex-direction: column;
        align-items: flex-start;
    }

    .lobbying-filings-controls {
        width: 100%;
        flex-direction: column;
    }

    .lobbying-search-input,
    .lobbying-sort-select {
        width: 100%;
        min-width: 0;
    }

    .lobbying-table {
        font-size: var(--font-size-xs);
    }

    .lobbying-table thead th,
    .lobbying-table tbody td {
        padding: var(--spacing-xs) var(--spacing-sm);
    }

    .lobbying-stat-value {
        font-size: var(--font-size-base);
    }
}

/* ============================================================
   Committees Dashboard
   ============================================================ */
.committees-dashboard { margin-bottom: var(--spacing-2xl); }
.dashboard-hero { text-align: center; padding: var(--spacing-xl) var(--spacing-lg); margin-bottom: var(--spacing-xl); background: var(--color-bg-primary); border: 1px solid var(--color-border); border-radius: var(--radius-lg); }
.dashboard-hero-amount { font-size: 3rem; font-weight: var(--font-weight-bold); color: var(--color-primary); line-height: 1; margin-bottom: var(--spacing-xs); }
.dashboard-hero-label { font-size: var(--font-size-md); color: var(--color-text-dim); }
.dashboard-hero-period { display: block; font-size: var(--font-size-sm); margin-top: var(--spacing-xs); color: var(--color-text-muted); }
.dashboard-top-committees { margin-bottom: var(--spacing-xl); background: var(--color-bg-primary); border: 1px solid var(--color-border); border-radius: var(--radius-lg); padding: var(--spacing-lg); }
.dashboard-top-committees h2 { font-size: var(--font-size-lg); margin: 0 0 var(--spacing-md); }
.dashboard-bar-chart { display: flex; flex-direction: column; gap: 8px; }
.dashboard-bar-row { display: flex; align-items: center; gap: var(--spacing-md); }
.dashboard-bar-label { flex: 0 0 260px; font-size: var(--font-size-sm); font-weight: var(--font-weight-semibold); text-align: right; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.dashboard-bar-label a { color: var(--color-text-primary); text-decoration: none; }
.dashboard-bar-label a:hover { color: var(--color-primary); }
.dashboard-bar-track { flex: 1; height: 28px; background: var(--color-bg-surface); border-radius: var(--radius-sm); overflow: hidden; }
.dashboard-bar-fill { height: 100%; border-radius: var(--radius-sm); transition: width 0.3s ease; }
.dashboard-bar-fill--senate { background: var(--color-primary); }
.dashboard-bar-fill--house { background: #64748b; }
.dashboard-bar-fill--joint { background: #6d28d9; }
.dashboard-bar-amount { flex: 0 0 70px; font-size: var(--font-size-sm); font-weight: var(--font-weight-semibold); color: var(--color-text-dim); text-align: right; }
.dashboard-bar-legend { display: flex; gap: var(--spacing-lg); margin-top: var(--spacing-md); justify-content: center; }
.legend-item { display: flex; align-items: center; gap: 6px; font-size: var(--font-size-sm); color: var(--color-text-dim); }
.legend-swatch { width: 12px; height: 12px; border-radius: 2px; }
.legend-swatch--senate { background: var(--color-primary); }
.legend-swatch--house { background: #64748b; }
.dashboard-issue-heatmap { margin-bottom: var(--spacing-xl); }
.dashboard-issue-heatmap h2 { font-size: var(--font-size-lg); margin: 0 0 var(--spacing-md); }
.heatmap-grid { display: flex; flex-wrap: wrap; gap: 6px; }
.heatmap-cell { display: flex; flex-direction: column; align-items: center; justify-content: center; width: 72px; height: 56px; border-radius: var(--radius-md); background: rgba(43, 58, 103, calc(0.05 + var(--intensity) * 0.35)); cursor: default; transition: transform 0.15s ease; }
.heatmap-cell:hover { transform: scale(1.08); }
.heatmap-code { font-size: 0.7rem; font-weight: var(--font-weight-bold); color: var(--color-text-primary); letter-spacing: 0.04em; }
.heatmap-amount { font-size: 0.65rem; color: var(--color-text-dim); margin-top: 2px; }
.sparkline { display: inline-flex; align-items: flex-end; gap: 2px; height: 20px; vertical-align: middle; }
.spark-bar { display: inline-block; width: 4px; min-height: 2px; background: var(--color-primary); border-radius: 1px; opacity: 0.7; }
.data-table--sortable thead th { cursor: pointer; user-select: none; }
.data-table--sortable thead th:hover { color: var(--color-primary); }
@media (max-width: 768px) {
    .dashboard-bar-label { flex: 0 0 120px; font-size: 0.75rem; }
    .dashboard-bar-amount { flex: 0 0 55px; font-size: 0.75rem; }
    .dashboard-hero-amount { font-size: 2rem; }
    .heatmap-cell { width: 60px; height: 48px; }
    .sparkline { display: none; }
}

/* ============================================================
   Who's Lobbying — Client-Centric View
   ============================================================ */
.lobbying-whos-lobbying { margin-bottom: var(--spacing-xl); }
.whos-lobbying-header { margin-bottom: var(--spacing-md); }
.whos-lobbying-header h3 { font-size: var(--font-size-sm); font-weight: var(--font-weight-bold); text-transform: uppercase; letter-spacing: 0.06em; color: var(--color-text-dim); margin: 0 0 var(--spacing-xs); }
.whos-lobbying-explainer { font-size: var(--font-size-sm); color: var(--color-text-muted); margin: 0 0 var(--spacing-md); }
.whos-lobbying-toggle { display: inline-flex; border: 1px solid var(--color-border); border-radius: var(--radius-md); overflow: hidden; }
.toggle-btn { padding: var(--spacing-xs) var(--spacing-md); font-size: var(--font-size-sm); font-weight: var(--font-weight-semibold); background: var(--color-bg-primary); border: none; cursor: pointer; color: var(--color-text-dim); transition: all 0.15s ease; }
.toggle-btn--active { background: var(--color-primary); color: #fff; }
.client-cards { display: flex; flex-direction: column; gap: 4px; }
.client-card { border: 1px solid var(--color-border); border-radius: var(--radius-md); overflow: hidden; transition: box-shadow 0.15s ease; }
.client-card:hover { box-shadow: 0 1px 4px rgba(0,0,0,0.06); }
.client-card-main { position: relative; display: flex; align-items: center; padding: var(--spacing-sm) var(--spacing-md); cursor: pointer; min-height: 48px; gap: var(--spacing-md); }
.client-card-bar { position: absolute; top: 0; left: 0; height: 100%; background: rgba(43, 58, 103, 0.06); border-radius: var(--radius-md); }
.client-card-info { position: relative; z-index: 1; flex: 1; min-width: 0; }
.client-card-name { display: block; font-size: var(--font-size-sm); font-weight: var(--font-weight-semibold); color: var(--color-text-primary); overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.client-card-via { display: block; font-size: 0.75rem; color: var(--color-text-muted); overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.client-card-meta { position: relative; z-index: 1; display: flex; align-items: center; gap: var(--spacing-sm); flex-shrink: 0; }
.client-card-issues { display: flex; gap: 4px; }
.client-card-amount { font-size: var(--font-size-sm); font-weight: var(--font-weight-bold); color: var(--color-text-primary); white-space: nowrap; min-width: 60px; text-align: right; }
.client-card-chevron { position: relative; z-index: 1; color: var(--color-text-muted); transition: transform 0.2s ease; flex-shrink: 0; }
.client-card.expanded .client-card-chevron { transform: rotate(180deg); }
.client-card-detail { border-top: 1px solid var(--color-border); padding: var(--spacing-sm) var(--spacing-md); background: var(--color-bg-surface); }
.client-detail-table { width: 100%; font-size: var(--font-size-sm); border-collapse: collapse; }
.client-detail-table th { font-weight: var(--font-weight-semibold); text-transform: uppercase; font-size: 0.65rem; letter-spacing: 0.06em; color: var(--color-text-muted); padding: 4px 8px; text-align: left; }
.client-detail-table td { padding: 4px 8px; color: var(--color-text-secondary); }
@media (max-width: 768px) { .client-card-issues { display: none; } .client-card-meta { gap: var(--spacing-xs); } }

/* ============================================================
   Member Lobbying Exposure Card
   ============================================================ */
.lobbying-exposure-card { background: var(--color-bg-primary); border: 1px solid var(--color-border); border-radius: var(--radius-lg); padding: var(--spacing-lg); }
.exposure-explainer { font-size: var(--font-size-sm); color: var(--color-text-muted); margin: 0 0 var(--spacing-sm); }
.exposure-total { font-size: 2.5rem; font-weight: var(--font-weight-bold); color: var(--color-primary); line-height: 1; margin-bottom: var(--spacing-md); }
.exposure-breakdown { display: flex; flex-direction: column; gap: 8px; margin-bottom: var(--spacing-md); }
.exposure-row { display: flex; align-items: center; gap: var(--spacing-sm); }
.exposure-committee { flex: 0 0 200px; font-size: var(--font-size-sm); overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.exposure-committee a { color: var(--color-text-primary); text-decoration: none; }
.exposure-committee a:hover { color: var(--color-primary); }
.exposure-bar-track { flex: 1; height: 14px; background: var(--color-bg-surface); border-radius: var(--radius-sm); overflow: hidden; }
.exposure-bar-fill { height: 100%; background: var(--color-primary); border-radius: var(--radius-sm); opacity: 0.7; }
.exposure-amount { flex: 0 0 60px; text-align: right; font-size: var(--font-size-sm); font-weight: var(--font-weight-semibold); color: var(--color-text-dim); }
.exposure-period { font-size: var(--font-size-sm); color: var(--color-text-muted); margin-bottom: var(--spacing-sm); }
.exposure-caveat { font-size: 0.7rem; color: var(--color-text-muted); font-style: italic; margin: 0; line-height: 1.4; }
@media (max-width: 768px) { .exposure-committee { flex: 0 0 120px; font-size: 0.75rem; } .exposure-total { font-size: 2rem; } }

/* ── Member Activity Feed (GovTrack) ── */
.activity-feed { display: flex; flex-direction: column; gap: 0; }
.activity-item { display: flex; gap: var(--spacing-sm); padding: var(--spacing-sm) 0; border-bottom: 1px solid var(--color-border-light, #eee); }
.activity-item:last-child { border-bottom: none; }
.activity-icon { flex: 0 0 40px; display: flex; align-items: flex-start; justify-content: center; padding-top: 2px; }
.activity-type-icon { font-size: 1.1rem; }
.vote-badge { display: inline-block; font-size: 0.7rem; font-weight: var(--font-weight-bold); text-transform: uppercase; padding: 2px 8px; border-radius: var(--radius-sm); color: #fff; line-height: 1.4; }
.vote-yea { background: #2e7d32; }
.vote-nay { background: #c62828; }
.vote-absent { background: #9e9e9e; }
.vote-present { background: #f57f17; }
.activity-content { flex: 1; min-width: 0; }
.activity-title { display: block; font-size: var(--font-size-sm); font-weight: var(--font-weight-semibold); color: var(--color-primary); text-decoration: none; line-height: 1.4; overflow: hidden; text-overflow: ellipsis; display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; }
.activity-title:hover { text-decoration: underline; }
.activity-meta { display: flex; gap: var(--spacing-sm); align-items: center; margin-top: 2px; }
.activity-date { font-size: 0.75rem; color: var(--color-text-muted); }
.activity-tally { font-size: 0.75rem; color: var(--color-text-dim); font-weight: var(--font-weight-semibold); }
.activity-desc { font-size: 0.8rem; color: var(--color-text-dim); margin: 4px 0 0; line-height: 1.4; overflow: hidden; text-overflow: ellipsis; display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; }
.activity-source { font-size: 0.7rem; color: var(--color-text-muted); margin-top: var(--spacing-sm); text-align: right; }
.activity-source a { color: var(--color-text-muted); text-decoration: underline; }
@media (max-width: 768px) { .activity-icon { flex: 0 0 32px; } .activity-title { font-size: 0.8rem; } }

/* ── Member Voting Record + Party Loyalty ── */
.loyalty-card { background: var(--color-bg-surface, #f8f9fa); border: 1px solid var(--color-border-light, #eee); border-radius: var(--radius-md, 8px); padding: var(--spacing-md); margin-bottom: var(--spacing-md); }
.loyalty-header { display: flex; justify-content: space-between; align-items: baseline; margin-bottom: var(--spacing-xs); }
.loyalty-label { font-size: var(--font-size-sm); font-weight: var(--font-weight-semibold); color: var(--color-text-dim); }
.loyalty-pct { font-size: 1.8rem; font-weight: var(--font-weight-bold); color: var(--color-primary); }
.loyalty-bar-track { width: 100%; height: 8px; background: #e0e0e0; border-radius: 4px; overflow: hidden; margin-bottom: var(--spacing-xs); }
.loyalty-bar-fill { height: 100%; background: var(--color-primary); border-radius: 4px; transition: width 0.3s; }
.loyalty-stats { display: flex; gap: var(--spacing-md); flex-wrap: wrap; font-size: 0.75rem; color: var(--color-text-muted); }

.defections-section { margin-bottom: var(--spacing-md); }
.defections-section h3 { font-size: var(--font-size-base); margin-bottom: var(--spacing-sm); }
.defections-list { display: flex; flex-direction: column; gap: var(--spacing-xs); }
.defection-item { display: flex; gap: var(--spacing-sm); align-items: flex-start; padding: var(--spacing-xs) 0; border-bottom: 1px solid var(--color-border-light, #eee); }
.defection-item:last-child { border-bottom: none; }
.defection-content { flex: 1; min-width: 0; }
.defection-title { display: block; font-size: var(--font-size-sm); color: var(--color-primary); text-decoration: none; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.defection-title:hover { text-decoration: underline; }
.defection-meta { font-size: 0.7rem; color: var(--color-text-muted); }
.defection-flag { font-size: 0.85rem; }

.vote-history { margin-bottom: var(--spacing-md); }
.vote-history h3 { font-size: var(--font-size-base); margin-bottom: var(--spacing-sm); }
.vote-history-table { width: 100%; border-collapse: collapse; font-size: var(--font-size-sm); }
.vote-history-table th { text-align: left; padding: var(--spacing-xs) var(--spacing-sm); border-bottom: 2px solid var(--color-border, #ddd); font-weight: var(--font-weight-semibold); color: var(--color-text-dim); font-size: 0.75rem; text-transform: uppercase; }
.vote-history-table td { padding: var(--spacing-xs) var(--spacing-sm); border-bottom: 1px solid var(--color-border-light, #eee); vertical-align: top; }
.vote-history-table a { color: var(--color-primary); text-decoration: none; }
.vote-history-table a:hover { text-decoration: underline; }
.vote-date { white-space: nowrap; font-size: 0.75rem; color: var(--color-text-muted); }
.vote-bill { max-width: 400px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.vote-result { font-size: 0.75rem; color: var(--color-text-dim); }
.vote-row--defection { background: #fff8e1; }
.vote-defection { text-align: center; }

/* ── Vote Detail Page ── */
.vote-detail-page { max-width: 900px; margin: 0 auto; }
.vote-detail-header { margin-bottom: var(--spacing-lg); }
.vote-chamber-badge { display: inline-block; font-size: 0.7rem; font-weight: var(--font-weight-bold); text-transform: uppercase; padding: 2px 10px; border-radius: var(--radius-sm); color: #fff; margin-right: var(--spacing-xs); }
.vote-chamber--house { background: #1565c0; }
.vote-chamber--senate { background: #c62828; }
.vote-category-badge { display: inline-block; font-size: 0.7rem; font-weight: var(--font-weight-semibold); padding: 2px 10px; border-radius: var(--radius-sm); background: var(--color-bg-surface, #f0f0f0); color: var(--color-text-dim); }
.vote-detail-header h1 { font-size: 1.4rem; margin: var(--spacing-sm) 0 var(--spacing-xs); line-height: 1.3; }
.vote-bill-ref { font-size: var(--font-size-sm); color: var(--color-text-dim); margin: 0; }

.vote-result-card { background: var(--color-bg-surface, #f8f9fa); border: 1px solid var(--color-border-light, #eee); border-radius: var(--radius-md, 8px); padding: var(--spacing-md); margin-bottom: var(--spacing-lg); }
.vote-result-main { display: flex; justify-content: space-between; align-items: center; margin-bottom: var(--spacing-sm); }
.vote-result-label { font-size: 1.2rem; font-weight: var(--font-weight-bold); padding: 4px 16px; border-radius: var(--radius-sm); }
.vote-result--passed { background: #e8f5e9; color: #2e7d32; }
.vote-result--failed { background: #ffebee; color: #c62828; }
.vote-result-date { font-size: var(--font-size-sm); color: var(--color-text-muted); }

.vote-tally { margin-bottom: var(--spacing-sm); }
.tally-bar { display: flex; height: 24px; border-radius: var(--radius-sm); overflow: hidden; background: #e0e0e0; }
.tally-yea { background: #2e7d32; }
.tally-nay { background: #c62828; }
.tally-numbers { display: flex; gap: var(--spacing-md); margin-top: var(--spacing-xs); font-size: var(--font-size-sm); }
.tally-yea-count { color: #2e7d32; font-weight: var(--font-weight-semibold); }
.tally-nay-count { color: #c62828; font-weight: var(--font-weight-semibold); }
.tally-other-count { color: var(--color-text-muted); }

.vote-party-breakdown { border-top: 1px solid var(--color-border-light, #eee); padding-top: var(--spacing-sm); }
.party-row { display: flex; justify-content: space-between; padding: 2px 0; font-size: var(--font-size-sm); }
.party-label { font-weight: var(--font-weight-semibold); }
.party-r { color: #c62828; }
.party-d { color: #1565c0; }
.party-position { color: var(--color-text-dim); }
.defection-summary { margin-top: var(--spacing-xs); font-size: var(--font-size-sm); color: #e65100; font-weight: var(--font-weight-semibold); }

.vote-positions { margin-bottom: var(--spacing-lg); }
.vote-positions h2 { margin-bottom: var(--spacing-md); }
.positions-group { margin-bottom: var(--spacing-md); }
.positions-group-title { font-size: var(--font-size-base); margin-bottom: var(--spacing-sm); padding-bottom: var(--spacing-xs); border-bottom: 1px solid var(--color-border-light, #eee); }
.vote-yea-text { color: #2e7d32; }
.vote-nay-text { color: #c62828; }
.positions-grid { display: flex; flex-wrap: wrap; gap: 6px; }
.position-chip { display: inline-flex; align-items: center; gap: 4px; padding: 4px 10px; border-radius: var(--radius-sm); background: var(--color-bg-surface, #f5f5f5); font-size: 0.8rem; }
.position-chip a { color: inherit; text-decoration: none; display: inline-flex; align-items: center; gap: 4px; }
.position-chip a:hover { text-decoration: underline; }
.position-chip--defection { background: #fff8e1; border: 1px solid #ffe082; }
.position-chip--absent { opacity: 0.6; }
.position-name { font-weight: var(--font-weight-semibold); }
.position-party { font-size: 0.7rem; color: var(--color-text-muted); }
.position-party--R { color: #c62828; }
.position-party--D { color: #1565c0; }

/* ── Votes Dashboard ── */
.votes-dashboard { max-width: 900px; margin: 0 auto; }
.votes-hero { text-align: center; margin-bottom: var(--spacing-lg); }
.votes-hero-count { display: block; font-size: 3rem; font-weight: var(--font-weight-bold); color: var(--color-primary); }
.votes-hero-label { font-size: var(--font-size-sm); color: var(--color-text-muted); }

.votes-tabs { display: flex; gap: var(--spacing-xs); margin-bottom: var(--spacing-md); border-bottom: 2px solid var(--color-border-light, #eee); padding-bottom: var(--spacing-xs); }
.votes-tab { background: none; border: none; padding: var(--spacing-xs) var(--spacing-md); font-size: var(--font-size-sm); font-weight: var(--font-weight-semibold); color: var(--color-text-muted); cursor: pointer; border-radius: var(--radius-sm) var(--radius-sm) 0 0; }
.votes-tab:hover { color: var(--color-text); }
.votes-tab.active { color: var(--color-primary); border-bottom: 2px solid var(--color-primary); margin-bottom: -2px; }

.votes-list { display: flex; flex-direction: column; }
.vote-row { display: flex; justify-content: space-between; align-items: center; padding: var(--spacing-sm) var(--spacing-xs); border-bottom: 1px solid var(--color-border-light, #eee); text-decoration: none; color: inherit; transition: background 0.15s; }
.vote-row:hover { background: var(--color-bg-surface, #f8f9fa); }
.vote-row-main { display: flex; align-items: center; gap: var(--spacing-sm); flex: 1; min-width: 0; }
.vote-chamber-pip { display: inline-flex; align-items: center; justify-content: center; width: 24px; height: 24px; border-radius: 50%; color: #fff; font-size: 0.7rem; font-weight: var(--font-weight-bold); flex-shrink: 0; }
.vote-row-info { flex: 1; min-width: 0; }
.vote-row-question { display: block; font-size: var(--font-size-sm); font-weight: var(--font-weight-semibold); color: var(--color-primary); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.vote-row-meta { font-size: 0.7rem; color: var(--color-text-muted); }
.vote-row-result { display: flex; align-items: center; gap: var(--spacing-sm); flex-shrink: 0; }
.vote-row-result-text { font-size: 0.75rem; font-weight: var(--font-weight-semibold); padding: 2px 8px; border-radius: var(--radius-sm); }
.vote-row-tally { font-size: 0.75rem; color: var(--color-text-dim); font-weight: var(--font-weight-semibold); }
.vote-row-defections { font-size: 0.75rem; color: #e65100; font-weight: var(--font-weight-bold); }

@media (max-width: 768px) {
  .loyalty-stats { flex-direction: column; gap: 2px; }
  .vote-history-table .vote-bill { max-width: 200px; }
  .vote-detail-header h1 { font-size: 1.1rem; }
  .positions-grid { gap: 4px; }
  .position-chip { font-size: 0.7rem; padding: 3px 6px; }
  .vote-row-result { flex-direction: column; align-items: flex-end; gap: 2px; }
}
/* Location pages — state grid, delegation table */

/* States grid on locations index */
.states-grid {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(280px, 1fr));
    gap: var(--spacing-md);
    margin-bottom: var(--spacing-2xl);
}

/* Page header with state flag/name */
.location-header {
    display: flex;
    align-items: center;
    gap: var(--spacing-lg);
    margin-bottom: var(--spacing-xl);
}

.location-header .flag {
    width: 80px;
    height: 53px;
    object-fit: cover;
    border-radius: var(--radius-sm);
    border: 1px solid var(--color-border);
    box-shadow: var(--shadow-sm);
}

.location-header .state-seal {
    width: 80px;
    height: 80px;
    object-fit: contain;
    flex-shrink: 0;
}

.location-header h1 {
    margin-bottom: 0;
}

.location-header .location-meta {
    font-size: var(--font-size-sm);
    color: var(--color-text-dim);
    margin-top: var(--spacing-xs);
}

.location-header .location-meta a {
    color: var(--color-primary);
    text-decoration: none;
    transition: color var(--transition-fast);
}

.location-header .location-meta a:hover {
    color: var(--color-primary-dark);
    text-decoration: underline;
}

/* Delegation section */
.delegation-section {
    margin-bottom: var(--spacing-2xl);
}

.delegation-section h2 {
    border-bottom: 2px solid var(--color-border);
    padding-bottom: var(--spacing-sm);
    margin-bottom: var(--spacing-lg);
}

/* District grid */
.district-grid {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(300px, 1fr));
    gap: var(--spacing-md);
    margin-bottom: var(--spacing-xl);
}

@media (max-width: 768px) {
    .states-grid {
        grid-template-columns: repeat(2, 1fr);
        gap: var(--spacing-sm);
    }

    .location-header {
        flex-direction: column;
        align-items: flex-start;
    }

    .district-grid {
        grid-template-columns: 1fr;
    }
}

@media (max-width: 430px) {
    .states-grid {
        grid-template-columns: repeat(2, 1fr);
        gap: var(--spacing-xs);
    }

    .location-header .flag {
        width: 60px;
        height: 40px;
    }

    .location-header .state-seal {
        width: 60px;
        height: 60px;
    }

    .location-header .location-meta {
        font-size: var(--font-size-xs);
    }
}
/* Find My Rep page */
.find-rep-hero {
    background-color: var(--color-bg-dark);
    color: var(--color-text-inverse);
    padding: var(--spacing-3xl) 0;
    text-align: center;
    border-bottom: 3px solid var(--color-accent);
}

.find-rep-hero h1 {
    color: var(--color-text-inverse);
    font-size: var(--font-size-4xl);
    margin-bottom: var(--spacing-md);
}

.find-rep-hero__subtitle {
    font-size: var(--font-size-lg);
    color: rgba(255, 255, 255, 0.7);
    max-width: 600px;
    margin: 0 auto var(--spacing-xl);
}

/* Larger search variant for the dedicated page */
.hero-search--large {
    max-width: 560px;
}

.hero-search--large input {
    font-size: var(--font-size-xl);
    padding: var(--spacing-md) var(--spacing-lg);
}

.hero-search--large .btn {
    font-size: var(--font-size-lg);
    padding: var(--spacing-md) var(--spacing-2xl);
}

/* Results section */
.find-rep-results {
    padding: var(--spacing-2xl) 0;
    background: var(--color-bg-surface);
}

.find-rep-results h2 {
    font-size: var(--font-size-2xl);
    margin-bottom: var(--spacing-sm);
}

.results-district {
    color: var(--color-text-dim);
    font-size: var(--font-size-base);
    margin-bottom: var(--spacing-lg);
}

.results-warning {
    background: rgba(245, 158, 11, 0.1);
    border: 1px solid rgba(245, 158, 11, 0.3);
    border-radius: var(--radius-md);
    padding: var(--spacing-md);
    margin-bottom: var(--spacing-lg);
    color: var(--color-text-secondary);
    font-size: var(--font-size-sm);
}

.results-list {
    display: flex;
    flex-direction: column;
    gap: var(--spacing-md);
    margin-bottom: var(--spacing-xl);
}

.results-list .member-card {
    text-decoration: none;
    color: inherit;
    transition: border-color var(--transition-fast), box-shadow var(--transition-fast);
}

.results-list .member-card:hover {
    border-color: var(--color-border-dark);
    box-shadow: var(--shadow-md);
}

.results-actions {
    text-align: center;
}

/* Outline button variant */
.btn--outline {
    display: inline-block;
    padding: var(--spacing-sm) var(--spacing-xl);
    background: transparent;
    color: var(--color-primary);
    border: 2px solid var(--color-primary);
    border-radius: var(--radius-md);
    font-weight: var(--font-weight-semibold);
    font-size: var(--font-size-base);
    text-decoration: none;
    cursor: pointer;
    transition: all var(--transition-fast);
}

.btn--outline:hover {
    background: var(--color-primary);
    color: var(--color-text-inverse);
}

/* Info section */
.find-rep-info {
    padding: var(--spacing-2xl) 0;
}

.info-card {
    background: var(--color-bg-primary);
    border: 1px solid var(--color-border);
    border-radius: var(--radius-lg);
    padding: var(--spacing-xl);
}

.info-card h3 {
    font-size: var(--font-size-lg);
    margin-bottom: var(--spacing-sm);
    color: var(--color-primary);
}

.info-card p,
.info-card ul {
    font-size: var(--font-size-sm);
    color: var(--color-text-dim);
    line-height: var(--line-height-relaxed);
}

.info-card ul {
    padding-left: var(--spacing-lg);
    margin: 0;
}

.info-card li {
    margin-bottom: var(--spacing-xs);
}

.info-card a {
    color: var(--color-primary);
    text-decoration: underline;
}

@media (max-width: 768px) {
    .find-rep-hero h1 {
        font-size: var(--font-size-2xl);
    }

    .find-rep-hero__subtitle {
        font-size: var(--font-size-base);
    }

    .hero-search--large input {
        font-size: var(--font-size-lg);
    }
}

@media (max-width: 430px) {
    .find-rep-hero {
        padding: var(--spacing-xl) 0;
    }

    .find-rep-hero h1 {
        font-size: var(--font-size-xl);
    }
}
.sr-only {
    position: absolute;
    width: 1px;
    height: 1px;
    padding: 0;
    margin: -1px;
    overflow: hidden;
    clip: rect(0, 0, 0, 0);
    border: 0;
}

.text-center { text-align: center; }
.text-right { text-align: right; }
.text-muted { color: var(--color-text-dim); }
.text-small { font-size: var(--font-size-sm); }

.mt-0 { margin-top: 0; }
.mt-1 { margin-top: var(--spacing-md); }
.mt-2 { margin-top: var(--spacing-xl); }
.mb-0 { margin-bottom: 0; }
.mb-1 { margin-bottom: var(--spacing-md); }
.mb-2 { margin-bottom: var(--spacing-xl); }

.flex { display: flex; }
.flex-between { justify-content: space-between; }
.flex-center { align-items: center; }
.flex-wrap { flex-wrap: wrap; }
.gap-sm { gap: var(--spacing-sm); }
.gap-md { gap: var(--spacing-md); }

.hidden { display: none; }

.visible-mobile {
    display: none;
}

@media (max-width: 768px) {
    .hidden-mobile { display: none; }
    .visible-mobile { display: block; }
}
/* ===== Tablet (768px and below) ===== */
@media (max-width: 768px) {
    h1 { font-size: var(--font-size-2xl); }
    h2 { font-size: var(--font-size-xl); }
    h3 { font-size: var(--font-size-lg); }

    .stats-bar {
        grid-template-columns: repeat(2, 1fr);
    }

    .data-table {
        font-size: var(--font-size-xs);
    }

    .data-table th, .data-table td {
        padding: var(--spacing-xs) var(--spacing-sm);
    }

    .data-table th {
        font-size: 0.65rem;
    }

    .state-card {
        padding: var(--spacing-sm) var(--spacing-md);
        min-height: 44px;
        gap: var(--spacing-sm);
    }

    .state-card .state-name {
        font-size: var(--font-size-sm);
    }

    .state-card .state-detail {
        font-size: var(--font-size-xs);
    }
}

/* ===== Small Mobile (430px and below) ===== */
@media (max-width: 430px) {
    /* Layout */
    .container {
        padding: 0 var(--spacing-sm);
    }

    main {
        padding: var(--spacing-lg) 0;
    }

    /* Typography */
    h1 { font-size: var(--font-size-xl); }
    h2 { font-size: var(--font-size-lg); }
    h3 { font-size: var(--font-size-base); }

    /* Header */
    .site-header {
        padding: var(--spacing-sm) 0;
    }

    .site-logo-text {
        font-size: var(--font-size-base);
    }

    /* Stats */
    .stats-bar {
        grid-template-columns: repeat(2, 1fr);
        gap: var(--spacing-sm);
    }

    .stat-card {
        padding: var(--spacing-sm) var(--spacing-xs);
    }

    .stat-card .stat-value {
        font-size: var(--font-size-xl);
    }

    .stat-card .stat-label {
        font-size: 0.65rem;
    }

    /* States grid */
    .state-card {
        padding: var(--spacing-xs) var(--spacing-sm);
        min-height: 40px;
        gap: var(--spacing-xs);
    }

    .state-card .state-name {
        font-size: 0.8rem;
        white-space: nowrap;
        overflow: hidden;
        text-overflow: ellipsis;
    }

    .state-card .state-detail {
        display: none;
    }

    /* Section headers */
    .section-header {
        margin-bottom: var(--spacing-lg);
    }

    /* Footer */
    .site-footer {
        padding: var(--spacing-xl) 0 var(--spacing-md);
        margin-top: var(--spacing-xl);
    }

    .footer-content {
        flex-direction: column;
        gap: var(--spacing-md);
        text-align: center;
    }

    .footer-brand {
        max-width: none;
    }

    .footer-nav ul {
        flex-direction: row;
        justify-content: center;
        flex-wrap: wrap;
        gap: var(--spacing-sm) var(--spacing-md);
    }

    .footer-nav a {
        min-height: 44px;
        display: flex;
        align-items: center;
    }

    /* Touch targets */
    a.card,
    .state-card,
    .member-card,
    button,
    .btn,
    select,
    input {
        min-height: 44px;
    }
}