/* Extracted from house/district/_detail/index.html <style> block 3. Keep page-specific rules here until componentized. */
:root{
      --flip-gold:#F5C542;
      --solid-d:#0076BA; --likely-d:#00A2FF; --lean-d:#56C1FF;
      --toss-up:#929292; --lean-r:#FF968D; --likely-r:#FF644E; --solid-r:#EE220C;

      --bg-page:#f3f4f6;
      --bg-card:#ffffff;
      --bg-card-subtle:#f5f5f7;
      --border-subtle:#d4d4d8;

      --text-main:#111827;
      --text-muted:#6b7280;
      --text-strong:#000;

      --radius-card:24px;
      --radius-pill:999px;

      --shadow-soft:0 18px 40px rgba(15,23,42,0.10);
      --shadow-subtle:0 1px 3px rgba(15,23,42,0.15);
    }

    @media (prefers-color-scheme: dark){
      :root{
        --bg-page:#020617;
        --bg-card:#020617;
        --bg-card-subtle:#020617;
        --border-subtle:#1f2937;

        --text-main:#e5e7eb;
        --text-muted:#9ca3af;
        --text-strong:#f9fafb;

        --shadow-soft:0 18px 40px rgba(0,0,0,0.90);
        --shadow-subtle:0 1px 3px rgba(0,0,0,0.60);
      }
    }

    body{
      margin:0;
      background:var(--bg-page);
      color:var(--text-main);
      font-family: system-ui, -apple-system, Segoe UI, Roboto, sans-serif;
      overflow-x:hidden;
    }

    html, body { overflow-x: hidden; }
    html { scroll-padding-top: calc(var(--header-offset, 0px) + 12px); }

    .container{ max-width:1150px; margin:auto; padding:1.2rem; padding-top: calc(1.2rem + var(--header-offset, 0px)); }

    .page-head{
      margin: 0.25rem 0 1.1rem;
      display:flex; flex-direction:column; gap:0.35rem;
    }

    .cm-label{
      font-size:0.8rem;
      text-transform:uppercase;
      letter-spacing:0.12em;
      font-weight:600;
      color:var(--text-muted);
    }

    .cm-h1{
      font-size: clamp(1.8rem, 2.6vw, 2.6rem);
      font-weight:800;
      letter-spacing:-0.03em;
      color:var(--text-strong);
      margin:0;
    }

    .sub{
      font-size:0.95rem;
      color:var(--text-muted);
      margin:0.1rem 0 0;
      line-height:1.35;
    }

    .layout{
      display:grid;
      grid-template-columns: 1fr 1fr;
      gap: 1.2rem;
      align-items:start;
    }
    @media (max-width: 980px){
      .layout{ grid-template-columns: 1fr; }
    }

    .left-col{
      display:flex;
      flex-direction:column;
      gap:1.2rem;
      min-width:0;
    }

    .card{
      background:var(--bg-card);
      border:1px solid var(--border-subtle);
      border-radius:var(--radius-card);
      padding:1.2rem 1.4rem;
      box-shadow:var(--shadow-soft);
      min-width:0;
    }
    @media (max-width: 980px){
      .card{ padding: 1.05rem 1.05rem; }
    }

    .card-header{
      display:flex;
      align-items:baseline;
      justify-content:space-between;
      gap:0.75rem;
      flex-wrap:wrap;
      margin-bottom:0.75rem;
    
    }
    .card-title{
      margin:0;
      font-size:1.25rem;
      font-weight:800;
      letter-spacing:-0.02em;
      color:var(--text-strong);
    }
    .badge{
      font-size:0.8rem;
      color:var(--text-muted);
      font-weight:600;
    }

    .race{
      background:var(--bg-card-subtle);
      border:1px solid var(--border-subtle);
      border-radius:18px;
      box-shadow:var(--shadow-subtle);
      padding:0.85rem 0.95rem;
      display:flex;
      flex-direction:column;
      gap:0.65rem;
    }
    .race-head{
      display:flex;
      justify-content:space-between;
      align-items:center;
      gap:0.5rem;
      flex-wrap:wrap;
    }
    .race-name{
      font-weight:800;
      font-size:1rem;
      letter-spacing:-0.01em;
      color:var(--text-strong);
      display:flex;
      gap:0.45rem;
      align-items:center;
      flex-wrap:wrap;
    }
    .rating-pill{
      padding:0.2rem 0.6rem;
      border-radius:var(--radius-pill);
      font-size:0.75rem;
      font-weight:700;
      white-space:nowrap;
      border:1px solid transparent;
      box-shadow:var(--shadow-subtle);
      color:#fff;
    }
    .solid-D  { background: var(--solid-d); }
    .likely-D { background: var(--likely-d); }
    .lean-D   { background: var(--lean-d); }
    .solid-R  { background: var(--solid-r); }
    .likely-R { background: var(--likely-r); }
    .lean-R   { background: var(--lean-r); }
    .toss-up  { background: var(--toss-up); }
    .rating-none{
      background: transparent;
      color: var(--text-muted);
      border: 1px solid var(--border-subtle);
    }

    .pill{
      display:inline-flex;
      align-items:center;
      justify-content:center;
      padding:0.15rem 0.55rem;
      border-radius:var(--radius-pill);
      font-size:0.75rem;
      font-weight:800;
      white-space:nowrap;
      box-shadow:var(--shadow-subtle);
      color:#fff;
      line-height:1;
    }
    .held-D{ background:var(--solid-d); }
    .held-R{ background:var(--solid-r); }
    .held-none{
      background: transparent;
      color: var(--text-muted);
      border: 1px solid var(--border-subtle);
      box-shadow:none;
      font-weight:700;
    }

    .held-sep{
      display:inline-block;
      margin:0 0.4rem;
      color: var(--text-muted);
      font-weight:800;
      line-height:1;
    }

    .prob-row{
      display:flex;
      align-items:center;
      gap:0.4rem;
      flex-wrap:wrap;
      margin:0.05rem 0 0.1rem;
    }
    .prob-label{ font-size:0.75rem; font-weight:600; }
    .prob-label-d{ color:var(--solid-d); }
    .prob-label-r{ color:var(--solid-r); margin-left:auto; }
    .prob-bar-wrapper{ flex:1 1 140px; display:flex; align-items:center; }
    .prob-bar{
      position:relative;
      width:100%;
      height:0.6rem;
      border-radius:var(--radius-pill);
      overflow:hidden;
      background:var(--bg-card);
      border:1px solid var(--border-subtle);
    }
    .prob-bar-d, .prob-bar-r{ height:100%; display:block; }
    .prob-bar-d{ background:var(--solid-d); float:left; }
    .prob-bar-r{ background:var(--solid-r); float:right; }

    .note{
      background:var(--bg-card-subtle);
      border:1px dashed var(--border-subtle);
      border-radius:18px;
      padding:0.85rem 0.95rem;
      color:var(--text-muted);
      line-height:1.4;
    }

    /* ---- Model Drivers ---- */
    .model-drivers{
      margin-top:1.1rem;
      padding-top:1rem;
      border-top:1px solid var(--border-subtle);
    }
    .model-drivers-label{
      font-size:0.695rem;
      text-transform:uppercase;
      letter-spacing:0.13em;
      font-weight:700;
      color:var(--text-muted);
      margin-bottom:0.6rem;
    }
    .model-drivers-pills{
      display:flex;
      flex-wrap:wrap;
      gap:0.45rem;
      align-items:center;
    }
    .driver-pill{
      display:inline-flex;
      align-items:center;
      gap:0.3rem;
      padding:0.3rem 0.78rem;
      border-radius:999px;
      font-size:0.76rem;
      font-weight:600;
      letter-spacing:0.01em;
      white-space:nowrap;
      border:1.5px solid;
      line-height:1.4;
      transition:opacity 0.15s;
    }
    .driver-pill-history{
      background:rgba(161,98,7,0.08);
      border-color:rgba(161,98,7,0.30);
      color:#92650a;
    }
    .driver-pill-national{
      background:rgba(13,148,136,0.08);
      border-color:rgba(13,148,136,0.30);
      color:#0f766e;
    }
    .driver-pill-local{
      background:rgba(99,60,180,0.08);
      border-color:rgba(99,60,180,0.30);
      color:#5b3fb0;
    }
    @media (prefers-color-scheme:dark){
      .driver-pill-history{ background:rgba(251,191,36,0.12); border-color:rgba(251,191,36,0.35); color:#fcd34d; }
      .driver-pill-national{ background:rgba(45,212,191,0.10); border-color:rgba(45,212,191,0.30); color:#2dd4bf; }
      .driver-pill-local{ background:rgba(167,139,250,0.12); border-color:rgba(167,139,250,0.35); color:#a78bfa; }
    }
    .model-drivers-no-polling{
      margin-top:0.55rem;
      font-size:0.8rem;
      color:var(--text-muted);
      font-style:italic;
      line-height:1.4;
    }

    /* incumbent */
    .inc-row{ display:flex; gap:0.9rem; align-items:center; }
        .inc-row + .inc-row{ margin-top:0.75rem; }
.inc-photo{
      width:78px;
      height:96px;
      object-fit:cover;
      object-position:center 28%;
      border-radius:14px;
      border:1px solid var(--border-subtle);
      box-shadow:var(--shadow-subtle);
      background:var(--bg-card);
      flex:0 0 auto;
    }
    .inc-photo.crop-tall{ object-position:center 22%; }
    .inc-photo.crop-square{ object-position:center 30%; }
    .inc-photo.crop-landscape{ object-position:center center; }
    .inc-photo.is-logo{
      object-fit:contain;
      object-position:center center;
      padding:0.45rem;
      box-sizing:border-box;
      background:var(--bg-card);
    }
    .inc-name{
      font-weight:850;
      color:var(--text-strong);
      line-height:1.15;
      display:flex;
      align-items:center;
      gap:0.5rem;
      flex-wrap:wrap;
      font-size:1.0rem;
    }

    .inc-meta{ display:flex; flex-direction:column; gap:0.25rem; min-width:0; }
    .inc-cred{
      font-size:0.72rem;
      font-weight:650;
      color:var(--text-muted);
      line-height:1.2;
    }
    .inc-cred a{
      color:inherit;
      text-decoration:underline;
      text-underline-offset:2px;
    }

    /* map */
    .map{
      width:100%;
      border-radius:18px;
      border:1px solid var(--border-subtle);
      overflow:hidden;
      box-shadow:var(--shadow-subtle);
      background: var(--bg-card-subtle);
    }
    #mapHero{ height:66vh; min-height:440px; }

    /* place labels (Census Gazetteer) */
    #mapHero{ position:relative; }
    .place-labels{
      position:absolute;
      inset:0;
      pointer-events:none;
      z-index:5;
    }
    .place-label{
      position:absolute;
      transform:translate(-50%,-50%);
      padding:0.18rem 0.45rem;
      border-radius:999px;
      font-weight:800;
      font-size:0.82rem;
      line-height:1;
      white-space:nowrap;
      border:1px solid var(--border-subtle);
      background:rgba(255,255,255,0.92);
      color:#111827;
      box-shadow:var(--shadow-subtle);
    }
    @media (prefers-color-scheme: dark){
      .place-label{
        background:rgba(2,6,23,0.82);
        color:#e5e7eb;
      }
    }


    
    @supports ((-webkit-backdrop-filter: blur(1px)) or (backdrop-filter: blur(1px))){
      .place-label{
        -webkit-backdrop-filter: blur(6px);
        backdrop-filter: blur(6px);
      }
    }



/* County hover tooltip (premium, no flicker) */
.county-tooltip{
  position:absolute;
  left:0;
  top:0;
  z-index:6;
  pointer-events:none;
  opacity:0;
  transform: translate(-50%, calc(-100% - 14px));
  transition: opacity 90ms ease, transform 120ms ease;

  padding:0.52rem 0.68rem;
  border-radius:14px;
  border:1px solid var(--border-subtle);
  background: rgba(255,255,255,0.92);
  color:#111827;
  box-shadow: var(--shadow-soft);
  white-space:nowrap;
  max-width: 72vw;
  overflow:hidden;
  text-overflow:ellipsis;

  font-weight:850;
  letter-spacing:-0.01em;
  font-size:0.92rem;
  line-height:1.05;
}
.county-tooltip.show{
  opacity:1;
  transform: translate(-50%, calc(-100% - 16px));
}
.county-tooltip::after{
  content:"";
  position:absolute;
  left:50%;
  bottom:-8px;
  transform: translateX(-50%);
  width:0;
  height:0;
  border-left:8px solid transparent;
  border-right:8px solid transparent;
  border-top:8px solid rgba(255,255,255,0.92);
  filter: drop-shadow(0 4px 10px rgba(15,23,42,0.12));
}


/* Tooltip auto-flip (keeps it on-screen) */
.county-tooltip.below{
  transform: translate(-50%, 16px);
}
.county-tooltip.below::after{
  bottom:auto;
  top:-8px;
  border-top:0;
  border-bottom:8px solid rgba(255,255,255,0.92);
  filter: drop-shadow(0 6px 12px rgba(15,23,42,0.10));
}
@media (prefers-color-scheme: dark){
  .county-tooltip.below::after{
    border-bottom-color: rgba(2,6,23,0.86);
    filter: drop-shadow(0 8px 14px rgba(0,0,0,0.55));
  }
}
@media (prefers-color-scheme: dark){
  .county-tooltip{
    background: rgba(2,6,23,0.86);
    color:#e5e7eb;
  }
  .county-tooltip::after{
    border-top-color: rgba(2,6,23,0.86);
    filter: drop-shadow(0 4px 12px rgba(0,0,0,0.55));
  }
}
@supports ((-webkit-backdrop-filter: blur(1px)) or (backdrop-filter: blur(1px))){
  .county-tooltip{
    -webkit-backdrop-filter: blur(10px);
    backdrop-filter: blur(10px);
  }
}
@media (max-width: 520px){
  .county-tooltip{ font-size:0.86rem; padding:0.48rem 0.62rem; }
}

/* Slightly smoother label rendering */
.place-label{
  will-change: transform;
}    /* Mobile + small screens: reduce label size and padding */
    @media (max-width: 520px){
      .place-label{
        font-size:0.74rem;
        padding:0.16rem 0.40rem;
        border-radius:999px;
        max-width:68vw;
        overflow:hidden;
        text-overflow:ellipsis;
      }
    }
.attrib{
      margin-top:0.85rem;
      color:var(--text-muted);
      font-size:0.82rem;
      line-height:1.25rem;
    }
    .attrib a{ color:inherit; text-decoration:underline; }
    .attrib a:hover{ text-decoration:none; }
  
/* ---- Map: Reset view button ---- */
.map{ position:relative; }
.reset-view-btn{
  position:absolute;
  left:14px;
  top:14px;
  z-index:5;
  border:1px solid var(--border-subtle);
  background:var(--bg-card);
  color:var(--text-strong);
  padding:0.45rem 0.7rem;
  border-radius:999px;
  font-weight:700;
  font-size:0.9rem;
  box-shadow: var(--shadow-soft);
  opacity:0;
  pointer-events:none;
  transform: translateY(-6px);
  transition: opacity .18s ease, transform .18s ease;
}
.reset-view-btn.show{
  opacity:1;
  pointer-events:auto;
  transform: translateY(0);
}
.reset-view-btn:active{ transform: translateY(1px); }

/* Back button (matches State page style) */
.back-btn{
  appearance:none;
  border:1px solid var(--border-subtle);
  background:var(--bg-card);
  color:var(--text-strong);
  padding:0.45rem 0.85rem;
  border-radius:var(--radius-pill);
  font-size:0.85rem;
  font-weight:750;
  letter-spacing:-0.01em;
  box-shadow:var(--shadow-subtle);
  cursor:pointer;
  display:inline-flex;
  align-items:center;
  gap:0.45rem;
  transition: transform 120ms ease;
  align-self: flex-start;
  width: fit-content;
}

.back-btn:hover{ transform: translateY(-1px); }
.back-btn:active{ transform: translateY(0px); }
.back-btn:focus-visible{
  outline: 3px solid rgba(0, 162, 255, 0.35);
  outline-offset: 3px;
}

/* Page actions row (Back + Voting) */
.page-actions{
  width:100%;
  display:flex;
  align-items:center;
  gap:0.55rem;
  flex-wrap:wrap;
}
#votingBtn{
  margin-left:auto; /* push voting info to right on wide screens */
}
@media (max-width: 640px){
  #votingBtn{ margin-left:0; }
}

/* ---- Odds history chart ---- */
.chart-wrap{
  position: relative;
  width: 100%;
  border-radius: 18px;
  border: 1px solid var(--border-subtle);
  background: var(--bg-card-subtle);
  box-shadow: var(--shadow-subtle);
  overflow: visible;
}
.chart-inner{
  padding: 0.85rem 0.95rem 0.75rem;
}
.chart-head{
  display:flex;
  align-items:flex-start;
  justify-content:space-between;
  gap:0.65rem;
  flex-wrap:wrap;
  margin-bottom:0.65rem;
}
.chart-sub{
  margin:0;
  color:var(--text-muted);
  font-size:0.88rem;
  line-height:1.3;
}
.chart-controls{
  display:flex;
  gap:0.4rem;
  flex-wrap:wrap;
}
.range-btn{
  appearance:none;
  border:1px solid var(--border-subtle);
  background:var(--bg-card);
  color:var(--text-strong);
  padding:0.32rem 0.6rem;
  border-radius:999px;
  font-size:0.78rem;
  font-weight:750;
  letter-spacing:-0.01em;
  box-shadow:var(--shadow-subtle);
  cursor:pointer;
  transition: transform 120ms ease, opacity 120ms ease;
}
.range-btn:hover{ transform: translateY(-1px); }
.range-btn:active{ transform: translateY(0px); }
.range-btn[aria-pressed="true"]{
  border-color: rgba(0, 162, 255, 0.45);
  outline: 3px solid rgba(0, 162, 255, 0.18);
  outline-offset: 2px;
}
.chart-canvas{
  width:100%;
  height: 240px;
  display:block;
}
@media (max-width: 520px){
  .chart-canvas{ height: 210px; }
  .chart-inner{ padding: 0.8rem 0.85rem 0.7rem; }
}
.chart-legend{
  display:flex;
  gap:0.75rem;
  flex-wrap:wrap;
  align-items:center;
  margin-top:0.55rem;
}
.legend-item{
  display:flex;
  align-items:center;
  gap:0.45rem;
  font-size:0.82rem;
  color:var(--text-muted);
  font-weight:650;
}
.legend-swatch{
  width:14px;
  height:10px;
  border-radius:999px;
  box-shadow:var(--shadow-subtle);
}
.legend-d{ background: var(--solid-d); }
.legend-r{ background: var(--solid-r); }
.chart-tooltip{
  position:absolute;
  pointer-events:none;
  z-index:6;
  min-width: 160px;
  max-width: 240px;
  padding:0.55rem 0.65rem;
  border-radius:14px;
  border:1px solid var(--border-subtle);
  background: rgba(255,255,255,0.92);
  color: #111827;
  box-shadow: var(--shadow-soft);
  transform: translate(-50%, -115%);
  opacity:0;
  transition: opacity 120ms ease;
}
@media (prefers-color-scheme: dark){
  .chart-tooltip{
    background: rgba(2,6,23,0.86);
    color: #e5e7eb;
  }
}
@supports ((-webkit-backdrop-filter: blur(1px)) or (backdrop-filter: blur(1px))){
  .chart-tooltip{
    -webkit-backdrop-filter: blur(8px);
    backdrop-filter: blur(8px);
  }
}
.tip-date{
  font-weight:850;
  font-size:0.86rem;
  letter-spacing:-0.01em;
  margin:0 0 0.25rem;
}
.tip-row{
  display:flex;
  justify-content:space-between;
  gap:0.75rem;
  font-size:0.84rem;
  font-weight:700;
  margin:0.12rem 0;
}
.tip-d{ color: var(--solid-d); }
.tip-r{ color: var(--solid-r); }
.chart-empty{
  padding:0.75rem 0.1rem 0.35rem;
  color:var(--text-muted);
  font-size:0.9rem;
  line-height:1.35;
}

/* “Flip” / pivotal pill (black text) */
.pill-flip{
  background: var(--flip-gold);
  color:#000;
}

.race-right{
  display:flex;
  align-items:center;
  gap:0.45rem;
  flex-wrap:wrap;
}



    /* ---------- DISTRICT HERO (matches State pages) ---------- */
    .state-hero{
      width:100%;
      display:flex;
      flex-direction:column;
      align-items:center;
      justify-content:center;
      gap:0.35rem;
      padding: 0.25rem 0 0.1rem;
    }

    .state-outline-wrap{
      width:min(460px, 82vw);
      height: clamp(120px, 18vw, 200px);
      aspect-ratio: 2.25 / 1;
      display:flex;
      align-items:center;
      justify-content:center;
      color: var(--text-muted);
      margin-top: 0.15rem;
      margin-bottom: 0.15rem;
    }

    .state-outline-wrap svg{
      display:block;
      width:100%;
      height:100%;
      overflow:visible;
    }

    .state-outline-path{
      fill:none;
      stroke: currentColor;
      stroke-width:2.25;
      stroke-linecap:round;
      stroke-linejoin:round;
      filter: drop-shadow(0 10px 22px rgba(15,23,42,0.16));
      opacity:0.95;
    }

    .district-fill-path{
      fill: currentColor;
      opacity:0;
      transform-box: fill-box;
      transform-origin: center;
      filter: drop-shadow(0 10px 22px rgba(15,23,42,0.12));
    }

    .district-outline-path{
      fill:none;
      stroke: currentColor;
      stroke-width:2.15;
      stroke-linecap:round;
      stroke-linejoin:round;
      opacity:0.95;
      filter: drop-shadow(0 10px 22px rgba(15,23,42,0.18));
    }

    .state-prefix{
      font-size:0.82rem;
      text-transform:uppercase;
      letter-spacing:0.16em;
      font-weight:700;
      color:var(--text-muted);
      margin-top: 0.2rem;
    }

    .state-name{
      font-size: clamp(2.05rem, 4.1vw, 3.15rem);
      font-weight:900;
      letter-spacing:-0.03em;
      color:var(--text-strong);
      margin:0;
      line-height:1.05;
      text-align:center;
    }

    .state-subtitle{
      max-width: 58ch;
      margin-top: 0.1rem;
      text-align:center;
    }

    /* Smooth hero animations */
    @media (prefers-reduced-motion: no-preference){
      .district-fill-path.fill-in{ opacity:0.22; transform: scale(1); transition: opacity 900ms ease, transform 1100ms cubic-bezier(.2,.8,.2,1); }
      .district-fill-path{ transform: scale(0.985); }
    }

  
/* ---------- PREMIUM STATE OUTLINE ANIMATION (matches state pages exactly) ---------- */
#stateOutlineSvg{ overflow: visible; }

#stateOutlineGroup{
  transform-box: fill-box;
  transform-origin: center;
  opacity: 1;
}

/* Fill comes in softly behind the stroke */
.state-outline-fill{
  fill: url(#cm-outline-fill);
  opacity: 0;
}

/* Glow + stroke paths (created dynamically per subpath) */
.state-outline-glow-path{
  fill: none;
  stroke: url(#cm-outline-stroke);
  stroke-width: 7.2;
  stroke-linecap: round;
  stroke-linejoin: round;
  filter: url(#cm-outline-glow);
  opacity: 0;
}

.state-outline-stroke-path{
  fill: none;
  stroke: url(#cm-outline-stroke);
  stroke-width: 2.35;
  stroke-linecap: round;
  stroke-linejoin: round;
  opacity: 0;
}

/* Subtle "premium pop" on each district/state change */
#stateOutlineSvg.outline-animate #stateOutlineGroup{
  animation: cmOutlinePop 820ms cubic-bezier(.2,.9,.2,1) both;
}
#stateOutlineSvg.outline-animate .state-outline-fill{
  animation: cmOutlineFill 900ms ease 520ms forwards;
}

@keyframes cmOutlinePop{
  from{ opacity: 0; transform: translateY(2px) scale(0.985); }
  55%{ opacity: 1; }
  to{ opacity: 1; transform: translateY(0px) scale(1); }
}
@keyframes cmOutlineFill{
  from{ opacity: 0; }
  to{ opacity: 0.14; }
}

/* District overlay (solid fill + outlined boundary) */
.hero-district-fill-path{
  fill: var(--district-color, #ffffff);
  opacity: 0;
  transform-box: fill-box;
  transform-origin: center;
}
.hero-district-outline-path{
  fill: none;
  stroke: var(--district-color, #ffffff);
  stroke-width: 3.1;
  stroke-linecap: round;
  stroke-linejoin: round;
  opacity: 0;
  filter: drop-shadow(0 8px 18px rgba(15,23,42,0.16));
}

/* Accessibility: respect reduced motion */
@media (prefers-reduced-motion: reduce){
  #stateOutlineSvg.outline-animate #stateOutlineGroup,
  #stateOutlineSvg.outline-animate .state-outline-fill{
    animation: none !important;
  }
  .state-outline-glow-path{ opacity: 0.20; }
  .state-outline-stroke-path{ opacity: 0.95; }
  .state-outline-fill{ opacity: 0.12; }
  .hero-district-fill-path{ opacity: 1; }
  .hero-district-outline-path{ opacity: 1; }
}



/* Candidates + incumbent clarification (district-specific additions) */
.card-help{
  margin-top: -0.35rem;
  margin-bottom: 0.9rem;
  font-size: 0.86rem;
  color: var(--text-muted);
  line-height: 1.35;
}
.cand-title{
  margin-top: 0.9rem;
  font-size: 0.78rem;
  text-transform: uppercase;
  letter-spacing: 0.14em;
  font-weight: 700;
  color: var(--text-muted);
}
.cand-wrap{ margin-top: 0.6rem; }
.cand-grid{
  display:flex;
  gap: 0.9rem;
  align-items: stretch;
}
.cand-tile{
  flex:1;
  min-width:0;
  background: var(--bg-card-subtle);
  border: 1px solid var(--border-subtle);
  border-radius: 14px;
  padding: 0.9rem;
  box-shadow: var(--shadow-subtle);
}
.cand-tile .inc-row{ margin:0; }
@media (max-width: 520px){
  .cand-grid{ flex-direction: column; }
}