/* Extracted from house/district/index.html <style> block 1. Keep page-specific rules here until componentized. */
:root{
      --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;
      padding-top: var(--header-offset, 0px);
      overflow-x:hidden;
    }
    .container{ max-width:1150px; margin:auto; padding:1.2rem; }

    .page-head{
      margin: 0.25rem 0 1.2rem;
      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;
      max-width: 78ch;
    }

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

    .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; } }
    #pivotalCard{ margin-top: 1.1rem; }

    .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;
    }

    .field{
      display:flex;
      gap:0.65rem;
      flex-wrap:wrap;
      align-items:center;
      margin-top:0.4rem;
    }
    .input{
      flex: 1 1 340px;
      display:flex;
      align-items:center;
      gap:0.6rem;
      background:var(--bg-card-subtle);
      border:1px solid var(--border-subtle);
      border-radius:18px;
      box-shadow:var(--shadow-subtle);
      padding:0.75rem 0.9rem;
      min-width: 260px;
    }
    .input input{
      width:100%;
      border:0;
      outline:none;
      background:transparent;
      color:var(--text-main);
      font-size:0.95rem;
    }

    .btn{
      border:1px solid var(--border-subtle);
      background:var(--bg-card-subtle);
      color:var(--text-main);
      border-radius: 18px;
      padding: 0.75rem 1rem;
      font-weight: 800;
      box-shadow: var(--shadow-subtle);
      cursor:pointer;
      user-select:none;
      white-space:nowrap;
    }
    .btn:hover{ transform: translateY(-1px); }
    .btn:disabled{ opacity:.6; cursor:not-allowed; transform:none; }

    .note{
      margin-top:0.85rem;
      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.45;
      font-size:0.92rem;
    }
    .error{
      margin-top:0.85rem;
      background: color-mix(in srgb, var(--bg-card-subtle) 80%, #ff00000a);
      border:1px solid color-mix(in srgb, var(--border-subtle) 65%, #ff000030);
      border-radius:18px;
      padding:0.85rem 0.95rem;
      color:var(--text-muted);
      line-height:1.45;
      font-size:0.92rem;
    }

    /* Pills */
.pill{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  padding:0.2rem 0.55rem;
  border-radius:var(--radius-pill);
  font-size:0.78rem;
  font-weight:800;
  white-space:nowrap;
  box-shadow:var(--shadow-subtle);
  color:#fff; /* rating pills are always white text */
}

.pill-solid-d{  background: var(--solid-d); }
.pill-likely-d{ background: var(--likely-d); }
.pill-lean-d{   background: var(--lean-d); }
.pill-tossup{   background: var(--toss-up); }
.pill-lean-r{   background: var(--lean-r); }
.pill-likely-r{ background: var(--likely-r); }
.pill-solid-r{  background: var(--solid-r); }

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


    

/* Incumbent party pills (used in Pivotal Race tiles) */
.pill.inc-D-pill{ background: var(--solid-d); }
.pill.inc-R-pill{ background: var(--solid-r); }
.pill.inc-I-pill{ background: var(--toss-up); color:#fff; }/* Browse search + dropdown */
    .searchWrap{ position:relative; }
    .search{
      display:flex;
      align-items:center;
      gap:0.6rem;
      background:var(--bg-card-subtle);
      border:1px solid var(--border-subtle);
      border-radius:18px;
      box-shadow:var(--shadow-subtle);
      padding:0.65rem 0.8rem;
      margin-bottom:0.55rem;
    }
    .search input{
      width:100%;
      border:0;
      outline:none;
      background:transparent;
      color:var(--text-main);
      font-size:0.95rem;
    }
    .dropdown{
      position:absolute;
      left:0; right:0;
      top: calc(100% + 6px);
      z-index: 50;
      display:none;
      background: var(--bg-card);
      border:1px solid var(--border-subtle);
      border-radius:18px;
      box-shadow: var(--shadow-soft);
      overflow:hidden;
    }
    .dropItem{
      display:flex;
      align-items:center;
      justify-content:space-between;
      gap:0.75rem;
      padding:0.75rem 0.9rem;
      text-decoration:none;
      color:inherit;
      border-top:1px solid color-mix(in srgb, var(--border-subtle) 65%, #0000);
    }
    .dropItem:first-child{ border-top:0; }
    .dropItem:hover{ background: var(--bg-card-subtle); }
    .dropLeft{ min-width:0; }
    .dropTop{
      font-weight:900;
      color:var(--text-strong);
      display:flex;
      align-items:center;
      gap:0.5rem;
      flex-wrap:wrap;
    }
    .dropSub{
      font-size:0.85rem;
      color:var(--text-muted);
      white-space:nowrap;
      overflow:hidden;
      text-overflow:ellipsis;
    }
    .kbd{
      font-size:0.75rem;
      font-weight:800;
      color:var(--text-muted);
      border:1px solid var(--border-subtle);
      padding:0.12rem 0.4rem;
      border-radius:10px;
      background: var(--bg-card-subtle);
    }

    .section-label{
      margin: 0.75rem 0 0.5rem;
      font-size:0.85rem;
      font-weight:900;
      letter-spacing:0.08em;
      text-transform:uppercase;
      color:var(--text-muted);
    }

    .tiles{
      display:grid;
      gap:0.85rem;
      grid-template-columns: repeat(12, 1fr);
    }
    .tile{
      grid-column: span 6;
      display:flex;
      align-items:center;
      justify-content:space-between;
      gap:0.8rem;
      padding:0.95rem 1.05rem;
      border-radius:18px;
      border:1px solid var(--border-subtle);
      background:var(--bg-card-subtle);
      box-shadow:var(--shadow-subtle);
      text-decoration:none;
      color: inherit;
      min-width:0;
      transition: transform .08s ease, box-shadow .12s ease, border-color .12s ease;
    }
    .tile:hover{
      transform: translateY(-2px);
      border-color: color-mix(in srgb, var(--border-subtle) 70%, #0000);
      box-shadow: 0 10px 22px rgba(15,23,42,0.12);
    }
    @media (max-width: 980px){ .tile{ grid-column: span 12; } }

    .left{
      display:flex;
      flex-direction:column;
      gap:0.18rem;
      min-width:0;
    }
    .name{
      font-size:1.05rem;
      font-weight:900;
      letter-spacing:-0.01em;
      color:var(--text-strong);
      white-space:nowrap;
      overflow:hidden;
      text-overflow:ellipsis;
      display:flex;
      align-items:center;
      gap:0.5rem;
      flex-wrap:wrap;
    }
    .hint{
      font-size:0.85rem;
      color:var(--text-muted);
      white-space:nowrap;
      overflow:hidden;
      text-overflow:ellipsis;
    }
    
    .tile .hint{ margin-top:0.22rem; }
.chev{
      flex:0 0 auto;
      width:34px;
      height:34px;
      border-radius:999px;
      border:1px solid var(--border-subtle);
      background:var(--bg-card);
      box-shadow:var(--shadow-subtle);
      display:grid;
      place-items:center;
      color:var(--text-muted);
      font-weight:900;
    }

    .small{ font-size:0.85rem; color:var(--text-muted); line-height:1.35; }

    .attrib{
      margin-top:0.95rem;
      font-size:0.82rem;
      color:var(--text-muted);
      line-height:1.35;
    }
    .attrib a{ color:inherit; }
    .muted-inline{ color:var(--text-muted); font-weight:700; }

    .minirow{
      display:flex;
      align-items:center;
      gap:0.6rem;
      flex-wrap:wrap;
      margin-top:0.35rem;
    }

    /* ---------- PAGE ACTIONS (Back button) ---------- */
    .page-actions{
      width:100%;
      display:flex;
      justify-content:flex-start;
      margin-top:0.65rem;
    }

    .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;
    }
    .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;
    }


    /* Visually hidden (SEO/accessibility) */
    .sr-only{
      position:absolute !important;
      width:1px !important;
      height:1px !important;
      padding:0 !important;
      margin:-1px !important;
      overflow:hidden !important;
      clip:rect(0,0,0,0) !important;
      white-space:nowrap !important;
      border:0 !important;
    }

/* 2026-06-28 cohesive House district finder refresh */
body.cmep-house-districts-page{
  --district-shell:1360px;
  --district-gap:1rem;
  background:
    radial-gradient(circle at 10% 10%, rgba(100,116,139,.13), transparent 30rem),
    linear-gradient(180deg,var(--house-bg,#f3f5f8),var(--house-bg-soft,#eef2f7)) !important;
}
@media (prefers-color-scheme:dark){
  html:not([data-theme="light"]):not(.light) body.cmep-house-districts-page:not(.light):not(.light-mode){
    background:
      radial-gradient(circle at 10% 10%, rgba(148,163,184,.12), transparent 32rem),
      linear-gradient(180deg,var(--house-bg,#050b16),var(--house-bg-soft,#020617)) !important;
  }
}

body.cmep-house-districts-page .districts-main{
  width:100%;
  padding:1.2rem 1rem 2.4rem;
}
body.cmep-house-districts-page .districts-container{
  max-width:var(--district-shell);
  margin:0 auto;
  padding:0;
  display:grid;
  gap:1rem;
}
body.cmep-house-districts-page .page-head,
body.cmep-house-districts-page .districts-hero{
  margin:0;
  padding:1.35rem 1.45rem;
  border:1px solid var(--house-border,var(--border-subtle));
  border-radius:26px;
  background:
    linear-gradient(180deg,color-mix(in srgb,var(--house-surface,#fff) 96%,transparent),color-mix(in srgb,var(--house-surface-2,#f8fafc) 92%,transparent));
  box-shadow:var(--house-shadow,0 18px 38px rgba(15,23,42,.08));
  gap:.42rem;
}
body.cmep-house-districts-page .cm-label{
  color:var(--house-muted,var(--text-muted));
  font-size:.76rem;
  font-weight:900;
  letter-spacing:.14em;
}
body.cmep-house-districts-page .cm-h1{
  color:var(--house-strong,var(--text-strong));
  font-size:clamp(2rem,4vw,3.6rem);
  line-height:.96;
  letter-spacing:-.055em;
}
body.cmep-house-districts-page .sub{
  color:var(--house-muted,var(--text-muted));
  max-width:74ch;
  font-size:1.02rem;
  line-height:1.5;
}
body.cmep-house-districts-page .page-actions{
  gap:.55rem;
  flex-wrap:wrap;
  margin-top:.8rem;
}
body.cmep-house-districts-page .back-btn,
body.cmep-house-districts-page .secondary-link{
  min-height:2.3rem;
  padding:.58rem .9rem;
  border-radius:999px;
  border:1px solid var(--house-border,var(--border-subtle));
  background:var(--house-surface-2,var(--bg-card-subtle));
  color:var(--house-strong,var(--text-strong));
  box-shadow:var(--house-shadow-soft,var(--shadow-subtle));
  text-decoration:none;
  font-weight:850;
}
body.cmep-house-districts-page .secondary-link{
  background:var(--house-strong,var(--text-strong));
  color:var(--house-surface,#fff);
  border-color:color-mix(in srgb,var(--house-strong,#08111f) 70%,transparent);
}
@media (prefers-color-scheme:dark){
  html:not([data-theme="light"]):not(.light) body.cmep-house-districts-page:not(.light):not(.light-mode) .secondary-link{
    background:#f8fafc;
    color:#08111f;
    border-color:#f8fafc;
  }
}
html[data-theme="dark"] body.cmep-house-districts-page .secondary-link,
html.dark body.cmep-house-districts-page .secondary-link,
body.cmep-house-districts-page.dark .secondary-link,
body.cmep-house-districts-page.dark-mode .secondary-link{
  background:#f8fafc;
  color:#08111f;
  border-color:#f8fafc;
}

body.cmep-house-districts-page .grid2{
  grid-template-columns:minmax(0,1.08fr) minmax(320px,.92fr);
  gap:1rem;
}
body.cmep-house-districts-page .card{
  border:1px solid var(--house-border,var(--border-subtle));
  border-radius:22px;
  background:linear-gradient(180deg,var(--house-surface,#fff),color-mix(in srgb,var(--house-surface,#fff) 90%,var(--house-surface-2,#f8fafc)));
  box-shadow:var(--house-shadow,0 18px 38px rgba(15,23,42,.08));
  padding:1.15rem;
}
body.cmep-house-districts-page .card-header{
  align-items:flex-start;
  margin-bottom:.9rem;
}
body.cmep-house-districts-page .card-title{
  color:var(--house-strong,var(--text-strong));
  font-size:1.18rem;
  letter-spacing:-.025em;
}
body.cmep-house-districts-page .card-subtitle{
  margin-top:.16rem;
  color:var(--house-muted,var(--text-muted));
  font-size:.86rem;
  line-height:1.35;
}
body.cmep-house-districts-page .badge{
  display:inline-flex;
  align-items:center;
  min-height:1.75rem;
  padding:.28rem .58rem;
  border:1px solid var(--house-border,var(--border-subtle));
  border-radius:999px;
  background:var(--house-surface-2,var(--bg-card-subtle));
  color:var(--house-muted,var(--text-muted));
  font-size:.74rem;
  font-weight:900;
  white-space:nowrap;
}

body.cmep-house-districts-page .field{
  display:grid;
  grid-template-columns:minmax(260px,1fr) auto auto;
  gap:.6rem;
  margin-top:.1rem;
}
body.cmep-house-districts-page .input,
body.cmep-house-districts-page .search{
  min-height:3rem;
  border-radius:16px;
  border:1px solid var(--house-border,var(--border-subtle));
  background:var(--house-surface-2,var(--bg-card-subtle));
  box-shadow:inset 0 1px 0 rgba(255,255,255,.45), var(--house-shadow-soft,var(--shadow-subtle));
}
body.cmep-house-districts-page .input{
  min-width:0;
  flex:unset;
}
body.cmep-house-districts-page .input input,
body.cmep-house-districts-page .search input{
  color:var(--house-text,var(--text-main));
  font-size:.94rem;
}
body.cmep-house-districts-page .input-icon{
  width:1.35rem;
  height:1.35rem;
  display:inline-grid;
  place-items:center;
  border-radius:999px;
  background:var(--house-surface,#fff);
  color:var(--house-muted,var(--text-muted));
  font-size:.86rem;
  font-weight:900;
  box-shadow:0 1px 2px rgba(15,23,42,.10);
}
body.cmep-house-districts-page .btn{
  min-height:3rem;
  border-radius:16px;
  border:1px solid var(--house-border,var(--border-subtle));
  background:var(--house-surface-2,var(--bg-card-subtle));
  color:var(--house-strong,var(--text-strong));
  box-shadow:var(--house-shadow-soft,var(--shadow-subtle));
  font-weight:900;
  text-decoration:none;
  transition:transform 120ms ease, background 120ms ease, border-color 120ms ease;
}
body.cmep-house-districts-page .btn:hover,
body.cmep-house-districts-page .back-btn:hover{
  transform:translateY(-1px);
  border-color:var(--house-border-strong,var(--border-subtle));
  background:var(--house-surface-3,var(--bg-card-subtle));
}
body.cmep-house-districts-page .note,
body.cmep-house-districts-page .error{
  border-radius:16px;
  background:var(--house-surface-2,var(--bg-card-subtle));
  border-color:var(--house-border,var(--border-subtle));
  color:var(--house-muted,var(--text-muted));
}
body.cmep-house-districts-page .note{ border-style:solid; }
body.cmep-house-districts-page .error{
  border-color:color-mix(in srgb,#dc2626 35%,var(--house-border,var(--border-subtle)));
  background:color-mix(in srgb,#dc2626 8%,var(--house-surface-2,var(--bg-card-subtle)));
}
body.cmep-house-districts-page .small,
body.cmep-house-districts-page .muted-inline{
  color:var(--house-muted,var(--text-muted));
}

body.cmep-house-districts-page .dropdown{
  top:calc(100% + .5rem);
  border-radius:18px;
  border:1px solid var(--house-border,var(--border-subtle));
  background:var(--house-surface,#fff);
  box-shadow:0 22px 42px rgba(15,23,42,.16);
  max-height:min(520px,70vh);
  overflow:auto;
}
body.cmep-house-districts-page .dropItem{
  padding:.82rem .9rem;
  border-top:1px solid color-mix(in srgb,var(--house-border,var(--border-subtle)) 68%,transparent);
}
body.cmep-house-districts-page .dropItem:hover{
  background:var(--house-surface-2,var(--bg-card-subtle));
}
body.cmep-house-districts-page .dropTop{
  color:var(--house-strong,var(--text-strong));
  gap:.42rem;
}
body.cmep-house-districts-page .dropSub{
  color:var(--house-muted,var(--text-muted));
}
body.cmep-house-districts-page .kbd{
  color:var(--house-muted,var(--text-muted));
  border-color:var(--house-border,var(--border-subtle));
  background:var(--house-surface,#fff);
}

body.cmep-house-districts-page .pivotal-card{
  margin-top:0;
}
body.cmep-house-districts-page .tiles{
  grid-template-columns:repeat(12,minmax(0,1fr));
  gap:.72rem;
}
body.cmep-house-districts-page .tile{
  grid-column:span 4;
  border-radius:17px;
  border:1px solid var(--house-border,var(--border-subtle));
  background:var(--house-surface-2,var(--bg-card-subtle));
  box-shadow:var(--house-shadow-soft,var(--shadow-subtle));
  padding:.88rem .9rem;
}
body.cmep-house-districts-page .tile:hover{
  border-color:var(--house-border-strong,var(--border-subtle));
  background:var(--house-surface-3,var(--bg-card-subtle));
  box-shadow:0 14px 24px rgba(15,23,42,.10);
}
body.cmep-house-districts-page .name{
  color:var(--house-strong,var(--text-strong));
  white-space:normal;
  overflow:visible;
  text-overflow:clip;
  line-height:1.18;
  gap:.42rem;
}
body.cmep-house-districts-page .hint{
  color:var(--house-muted,var(--text-muted));
  white-space:normal;
  overflow:visible;
  text-overflow:clip;
  line-height:1.3;
}
body.cmep-house-districts-page .chev{
  width:2rem;
  height:2rem;
  background:var(--house-surface,#fff);
  border-color:var(--house-border,var(--border-subtle));
  color:var(--house-muted,var(--text-muted));
}
body.cmep-house-districts-page .pill{
  min-height:1.55rem;
  padding:.18rem .55rem;
  font-size:.72rem;
  font-weight:900;
  line-height:1;
  border:0;
  box-shadow:none;
}
body.cmep-house-districts-page .pill-flip{
  background:var(--flip-gold,#F6CE46);
  color:#111827;
}
body.cmep-house-districts-page .pill.inc-D-pill,
body.cmep-house-districts-page .pill.inc-R-pill,
body.cmep-house-districts-page .pill.inc-I-pill{
  min-height:1.25rem;
  padding:.13rem .42rem;
  font-size:.66rem;
  vertical-align:middle;
}

@media (max-width:1180px){
  body.cmep-house-districts-page .tile{grid-column:span 6;}
}
@media (max-width:860px){
  body.cmep-house-districts-page .districts-main{padding:.85rem .75rem 2rem;}
  body.cmep-house-districts-page .page-head,
  body.cmep-house-districts-page .districts-hero{padding:1.1rem;border-radius:22px;}
  body.cmep-house-districts-page .grid2{grid-template-columns:1fr;}
  body.cmep-house-districts-page .field{grid-template-columns:1fr 1fr;}
  body.cmep-house-districts-page .field .input{grid-column:1/-1;}
  body.cmep-house-districts-page .tile{grid-column:span 12;}
}
@media (max-width:560px){
  body.cmep-house-districts-page .districts-main{padding:.65rem .55rem 1.6rem;}
  body.cmep-house-districts-page .districts-container{gap:.75rem;}
  body.cmep-house-districts-page .card{padding:.95rem;border-radius:19px;}
  body.cmep-house-districts-page .cm-h1{font-size:clamp(2rem,13vw,2.85rem);}
  body.cmep-house-districts-page .sub{font-size:.95rem;}
  body.cmep-house-districts-page .field{grid-template-columns:1fr;}
  body.cmep-house-districts-page .field .input{grid-column:auto;}
  body.cmep-house-districts-page .btn,
  body.cmep-house-districts-page .back-btn,
  body.cmep-house-districts-page .secondary-link{width:100%;justify-content:center;}
  body.cmep-house-districts-page .page-actions{display:grid;grid-template-columns:1fr;}
  body.cmep-house-districts-page .card-header{gap:.45rem;}
  body.cmep-house-districts-page .badge{font-size:.7rem;}
  body.cmep-house-districts-page .tile{padding:.82rem;}
}

/* Keep the shared House layer from forcing forecast-page spacing onto the finder page. */
body.cmep-house-page.cmep-house-districts-page .districts-container{
  width:100% !important;
  max-width:var(--district-shell) !important;
  margin:0 auto !important;
  padding:0 !important;
}
body.cmep-house-page.cmep-house-districts-page .districts-hero,
body.cmep-house-page.cmep-house-districts-page .card{
  margin-left:0 !important;
  margin-right:0 !important;
}
body.cmep-house-page.cmep-house-districts-page .districts-hero{
  padding:1.35rem 1.45rem !important;
  border-radius:26px !important;
}
body.cmep-house-page.cmep-house-districts-page .card{
  padding:1.15rem !important;
  border-radius:22px !important;
}
@media (max-width:860px){
  body.cmep-house-page.cmep-house-districts-page .districts-hero{
    padding:1.1rem !important;
    border-radius:22px !important;
  }
}
@media (max-width:560px){
  body.cmep-house-page.cmep-house-districts-page .card{
    padding:.95rem !important;
    border-radius:19px !important;
  }
}

/* 2026-06-28 header cleanup: single navigation affordance, tighter masthead. */
body.cmep-house-page.cmep-house-districts-page .districts-hero{
  display:grid !important;
  grid-template-columns:minmax(0,1fr);
  gap:.85rem !important;
  padding:1.05rem 1.15rem 1.18rem !important;
  border-radius:24px !important;
}
body.cmep-house-districts-page .districts-hero-top{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:.75rem;
  min-width:0;
}
body.cmep-house-districts-page .districts-hero-top .cm-label{
  margin-left:auto;
  text-align:right;
  line-height:1.2;
}
body.cmep-house-districts-page .districts-hero-copy{
  display:grid;
  gap:.35rem;
  max-width:880px;
}
body.cmep-house-districts-page .districts-hero .cm-h1{
  font-size:clamp(2rem,3.35vw,3.05rem);
  line-height:1.02;
  letter-spacing:-.05em;
}
body.cmep-house-districts-page .districts-hero .sub{
  max-width:68ch;
  font-size:1rem;
  line-height:1.45;
}
body.cmep-house-districts-page .districts-hero .back-btn.secondary-link{
  min-height:2.15rem;
  padding:.48rem .75rem;
  background:var(--house-surface-2,var(--bg-card-subtle));
  color:var(--house-strong,var(--text-strong));
  border-color:var(--house-border,var(--border-subtle));
  box-shadow:var(--house-shadow-soft,var(--shadow-subtle));
}
body.cmep-house-districts-page .districts-hero .back-btn.secondary-link:hover{
  background:var(--house-surface-3,var(--bg-card-subtle));
  color:var(--house-strong,var(--text-strong));
}
@media (prefers-color-scheme:dark){
  html:not([data-theme="light"]):not(.light) body.cmep-house-districts-page:not(.light):not(.light-mode) .districts-hero .back-btn.secondary-link{
    background:var(--house-surface-2,#0f172a);
    color:var(--house-strong,#f8fafc);
    border-color:var(--house-border,#1f2937);
  }
}
html[data-theme="dark"] body.cmep-house-districts-page .districts-hero .back-btn.secondary-link,
html.dark body.cmep-house-districts-page .districts-hero .back-btn.secondary-link,
body.cmep-house-districts-page.dark .districts-hero .back-btn.secondary-link,
body.cmep-house-districts-page.dark-mode .districts-hero .back-btn.secondary-link{
  background:var(--house-surface-2,#0f172a);
  color:var(--house-strong,#f8fafc);
  border-color:var(--house-border,#1f2937);
}
@media (max-width:720px){
  body.cmep-house-page.cmep-house-districts-page .districts-hero{
    padding:1rem !important;
    border-radius:21px !important;
  }
  body.cmep-house-districts-page .districts-hero-top{
    align-items:flex-start;
  }
  body.cmep-house-districts-page .districts-hero-top .cm-label{
    max-width:45%;
  }
  body.cmep-house-districts-page .districts-hero .cm-h1{
    font-size:clamp(2rem,11vw,2.75rem);
  }
}
@media (max-width:480px){
  body.cmep-house-districts-page .districts-hero-top{
    display:grid;
    grid-template-columns:1fr;
    gap:.55rem;
  }
  body.cmep-house-districts-page .districts-hero-top .cm-label{
    max-width:none;
    margin-left:0;
    text-align:left;
    order:-1;
  }
  body.cmep-house-districts-page .districts-hero .back-btn.secondary-link{
    width:auto;
    justify-content:flex-start;
    justify-self:start;
  }
}


/* 2026-06-29 — align /house/district/ masthead with the homepage hero/header pattern. */
body.cmep-house-page.cmep-house-districts-page .cm-header,
body.cmep-house-page.cmep-house-districts-page .cm-header header,
body.cmep-house-page.cmep-house-districts-page header.cm-header,
body.cmep-house-page.cmep-house-districts-page #cm-header{
  position:sticky !important;
  top:0 !important;
  background:var(--house-surface,#ffffff) !important;
  border-bottom:1px solid var(--house-border,#d8dee8) !important;
  box-shadow:none !important;
  color:var(--house-text,#111827) !important;
}
@media (prefers-color-scheme:dark){
  html:not([data-theme="light"]):not(.light) body.cmep-house-page.cmep-house-districts-page:not(.light):not(.light-mode) .cm-header,
  html:not([data-theme="light"]):not(.light) body.cmep-house-page.cmep-house-districts-page:not(.light):not(.light-mode) .cm-header header,
  html:not([data-theme="light"]):not(.light) body.cmep-house-page.cmep-house-districts-page:not(.light):not(.light-mode) header.cm-header,
  html:not([data-theme="light"]):not(.light) body.cmep-house-page.cmep-house-districts-page:not(.light):not(.light-mode) #cm-header{
    background:var(--house-surface,#050b16) !important;
    border-bottom-color:var(--house-border,#1f2937) !important;
    color:var(--house-text,#e5e7eb) !important;
  }
}
html[data-theme="dark"] body.cmep-house-page.cmep-house-districts-page .cm-header,
html.dark body.cmep-house-page.cmep-house-districts-page .cm-header,
body.cmep-house-page.cmep-house-districts-page.dark .cm-header,
body.cmep-house-page.cmep-house-districts-page.dark-mode .cm-header,
html[data-theme="dark"] body.cmep-house-page.cmep-house-districts-page #cm-header,
html.dark body.cmep-house-page.cmep-house-districts-page #cm-header,
body.cmep-house-page.cmep-house-districts-page.dark #cm-header,
body.cmep-house-page.cmep-house-districts-page.dark-mode #cm-header{
  background:var(--house-surface,#050b16) !important;
  border-bottom-color:var(--house-border,#1f2937) !important;
  color:var(--house-text,#e5e7eb) !important;
}

body.cmep-house-page.cmep-house-districts-page .districts-main{
  width:100% !important;
  min-width:0 !important;
  padding:0 0 2.4rem !important;
}
body.cmep-house-page.cmep-house-districts-page .districts-container{
  width:min(100%,var(--district-shell,1360px)) !important;
  max-width:var(--district-shell,1360px) !important;
  margin:0 auto !important;
  padding:clamp(14px,2.2vw,30px) clamp(12px,2.4vw,34px) !important;
  gap:1rem !important;
}
body.cmep-house-page.cmep-house-districts-page .districts-hero.home-hero{
  width:100% !important;
  max-width:none !important;
  margin:0 0 clamp(18px,2vw,28px) !important;
  padding:clamp(22px,3vw,44px) clamp(18px,4vw,54px) !important;
  border:1px solid var(--house-border,#d8dee8) !important;
  border-radius:clamp(22px,2.4vw,34px) !important;
  background:
    radial-gradient(circle at 50% 0%, rgba(148,163,184,.16), transparent 34rem),
    linear-gradient(180deg,var(--house-surface,#ffffff),var(--house-surface-2,#f8fafc)) !important;
  box-shadow:var(--house-shadow,0 18px 38px rgba(15,23,42,.08)) !important;
  text-align:center !important;
  overflow:hidden !important;
  display:block !important;
  box-sizing:border-box !important;
}
body.cmep-house-page.cmep-house-districts-page .districts-hero.home-hero h1{
  margin:0 !important;
  color:var(--house-strong,#07111f) !important;
  font-size:clamp(2.1rem,4.4vw,4rem) !important;
  line-height:.96 !important;
  letter-spacing:-.065em !important;
  font-weight:1000 !important;
  text-wrap:balance;
}
body.cmep-house-page.cmep-house-districts-page .districts-hero.home-hero .home-lede{
  max-width:860px !important;
  margin:.82rem auto 0 !important;
  color:var(--house-muted,#64748b) !important;
  font-size:clamp(.95rem,1.42vw,1.1rem) !important;
  line-height:1.43 !important;
  font-weight:700 !important;
  text-wrap:balance;
}
@media (max-width:860px){
  body.cmep-house-page.cmep-house-districts-page .districts-container{
    padding-left:clamp(10px,2.6vw,18px) !important;
    padding-right:clamp(10px,2.6vw,18px) !important;
  }
  body.cmep-house-page.cmep-house-districts-page .districts-hero.home-hero{
    padding:clamp(18px,5vw,30px) clamp(14px,4vw,24px) !important;
  }
}
@media (max-width:560px){
  body.cmep-house-page.cmep-house-districts-page .districts-container{
    padding-left:8px !important;
    padding-right:8px !important;
  }
  body.cmep-house-page.cmep-house-districts-page .districts-hero.home-hero{
    padding-left:12px !important;
    padding-right:12px !important;
  }
}

/* 2026-06-29 — standardize finder section to the cleaner site card pattern. */
body.cmep-house-page.cmep-house-districts-page .district-lookup-card{
  overflow:hidden;
}
body.cmep-house-districts-page .lookup-header{
  align-items:flex-start;
  padding-bottom:.85rem;
  border-bottom:1px solid color-mix(in srgb,var(--house-border,var(--border-subtle)) 82%,transparent);
  margin-bottom:1rem;
}
body.cmep-house-districts-page .section-eyebrow{
  margin:0 0 .28rem;
  color:var(--house-muted,var(--text-muted));
  font-size:.72rem;
  line-height:1;
  font-weight:950;
  letter-spacing:.13em;
  text-transform:uppercase;
}
body.cmep-house-districts-page .district-lookup-card .card-title{
  font-size:clamp(1.28rem,1.6vw,1.48rem);
  line-height:1.08;
  letter-spacing:-.035em;
}
body.cmep-house-districts-page .district-lookup-card .card-subtitle{
  max-width:58ch;
  margin-top:.32rem;
  font-size:.9rem;
  line-height:1.42;
}
body.cmep-house-districts-page .lookup-body{
  display:grid;
  gap:.62rem;
}
body.cmep-house-districts-page .field-label{
  display:block;
  color:var(--house-strong,var(--text-strong));
  font-size:.84rem;
  font-weight:900;
  letter-spacing:-.01em;
}
body.cmep-house-districts-page .lookup-field{
  display:grid;
  grid-template-columns:minmax(0,1fr) auto auto;
  align-items:stretch;
  gap:.58rem;
  margin-top:0;
}
body.cmep-house-districts-page .lookup-field .input{
  min-height:3.15rem;
  padding:.72rem .82rem;
  border-radius:18px;
}
body.cmep-house-districts-page .lookup-field .input input::placeholder{
  color:color-mix(in srgb,var(--house-muted,var(--text-muted)) 76%,transparent);
}
body.cmep-house-districts-page .lookup-field .btn{
  min-height:3.15rem;
  padding:.72rem 1.02rem;
  border-radius:18px;
}
body.cmep-house-districts-page .btn-primary{
  background:var(--house-strong,#0f172a);
  border-color:var(--house-strong,#0f172a);
  color:var(--house-surface,#fff);
}
body.cmep-house-districts-page .btn-primary:hover{
  background:color-mix(in srgb,var(--house-strong,#0f172a) 88%,var(--house-surface,#fff));
  border-color:color-mix(in srgb,var(--house-strong,#0f172a) 88%,var(--house-surface,#fff));
  color:var(--house-surface,#fff);
}
body.cmep-house-districts-page .btn-secondary{
  background:var(--house-surface-2,var(--bg-card-subtle));
  color:var(--house-strong,var(--text-strong));
}
body.cmep-house-districts-page .lookup-result,
body.cmep-house-districts-page .lookup-error{
  margin-top:.2rem;
}
body.cmep-house-districts-page .lookup-footnote{
  margin-top:.2rem;
  padding:.78rem .85rem;
  border:1px solid var(--house-border,var(--border-subtle));
  border-radius:16px;
  background:color-mix(in srgb,var(--house-surface-2,var(--bg-card-subtle)) 84%,transparent);
  color:var(--house-muted,var(--text-muted));
  font-size:.83rem;
  line-height:1.42;
}
body.cmep-house-districts-page .lookup-footnote strong{
  color:var(--house-strong,var(--text-strong));
}
@media (prefers-color-scheme:dark){
  html:not([data-theme="light"]):not(.light) body.cmep-house-districts-page:not(.light):not(.light-mode) .btn-primary{
    background:#f8fafc;
    border-color:#f8fafc;
    color:#08111f;
  }
  html:not([data-theme="light"]):not(.light) body.cmep-house-districts-page:not(.light):not(.light-mode) .btn-primary:hover{
    background:#e5e7eb;
    border-color:#e5e7eb;
    color:#08111f;
  }
}
html[data-theme="dark"] body.cmep-house-districts-page .btn-primary,
html.dark body.cmep-house-districts-page .btn-primary,
body.cmep-house-districts-page.dark .btn-primary,
body.cmep-house-districts-page.dark-mode .btn-primary{
  background:#f8fafc;
  border-color:#f8fafc;
  color:#08111f;
}
html[data-theme="dark"] body.cmep-house-districts-page .btn-primary:hover,
html.dark body.cmep-house-districts-page .btn-primary:hover,
body.cmep-house-districts-page.dark .btn-primary:hover,
body.cmep-house-districts-page.dark-mode .btn-primary:hover{
  background:#e5e7eb;
  border-color:#e5e7eb;
  color:#08111f;
}
@media (max-width:1040px){
  body.cmep-house-districts-page .lookup-field{
    grid-template-columns:1fr 1fr;
  }
  body.cmep-house-districts-page .lookup-field .input{
    grid-column:1/-1;
  }
}
@media (max-width:560px){
  body.cmep-house-districts-page .lookup-header{
    display:grid;
    grid-template-columns:1fr;
    gap:.58rem;
  }
  body.cmep-house-districts-page .lookup-header .badge{
    justify-self:start;
  }
  body.cmep-house-districts-page .lookup-field{
    grid-template-columns:1fr;
  }
  body.cmep-house-districts-page .lookup-field .input,
  body.cmep-house-districts-page .lookup-field .btn{
    grid-column:auto;
    width:100%;
  }
}


/* 2026-06-29 — requested finder cleanup: no eyebrow/badge/icon, cleaner fit. */
body.cmep-house-districts-page .district-lookup-card .lookup-header{
  display:block;
}
body.cmep-house-districts-page .district-lookup-card .section-eyebrow,
body.cmep-house-districts-page .district-lookup-card .badge{
  display:none !important;
}
body.cmep-house-districts-page .lookup-field .input{
  gap:0;
}
body.cmep-house-districts-page .lookup-field .input input,
body.cmep-house-districts-page .search input{
  min-width:0;
  overflow:hidden;
  text-overflow:ellipsis;
}
body.cmep-house-districts-page .lookup-field .input input::placeholder,
body.cmep-house-districts-page .search input::placeholder{
  text-overflow:ellipsis;
}
@media (max-width:560px){
  body.cmep-house-districts-page .lookup-field .input{
    padding-left:.9rem;
    padding-right:.9rem;
  }
}

/* 2026-06-29 — align district address search with election-night county search styling. */
body.cmep-house-districts-page .lookup-field .address-search-wrap{
  flex:1 1 240px;
  min-width:0;
  width:100%;
}
body.cmep-house-districts-page .lookup-field .address-search-input{
  width:100%;
  appearance:none;
  -webkit-appearance:none;
  box-sizing:border-box;
  border:1px solid var(--border-subtle);
  background:var(--bg-card-subtle);
  color:var(--text-strong);
  border-radius:12px;
  min-height:3.15rem;
  padding:.72rem 1rem;
  font:inherit;
  font-size:.95rem;
  line-height:1.2;
  box-shadow:var(--shadow-subtle);
  overflow:hidden;
  text-overflow:ellipsis;
}
body.cmep-house-districts-page .lookup-field .address-search-input::placeholder{
  color:var(--text-muted);
  opacity:1;
  text-overflow:ellipsis;
}
body.cmep-house-districts-page .lookup-field .address-search-input:focus{
  outline:none;
  border-color:rgba(0,118,186,.36);
  box-shadow:0 0 0 3px rgba(0,118,186,.12);
}
body.dark.cmep-house-districts-page .lookup-field .address-search-input:focus,
body.dark-mode.cmep-house-districts-page .lookup-field .address-search-input:focus,
html.dark body.cmep-house-districts-page .lookup-field .address-search-input:focus,
html[data-theme="dark"] body.cmep-house-districts-page .lookup-field .address-search-input:focus{
  border-color:rgba(0,162,255,.36);
  box-shadow:0 0 0 3px rgba(0,162,255,.14);
}
@media (max-width:560px){
  body.cmep-house-districts-page .lookup-field .address-search-input{
    min-height:3.05rem;
    padding:.78rem .92rem;
    font-size:.9rem;
  }
}


/* 2026-06-29 — browse districts search parity with election-night county search. */
body.cmep-house-districts-page .lookup-body{
  gap:.7rem;
}
body.cmep-house-districts-page .lookup-body .field-label{
  display:none !important;
}
body.cmep-house-districts-page .searchWrap{
  margin-top:.85rem;
}
body.cmep-house-districts-page .browse-search-wrap{
  display:block;
  min-width:0;
  width:100%;
}
body.cmep-house-districts-page .lookup-field .address-search-input,
body.cmep-house-districts-page .browse-search-input{
  width:100%;
  appearance:none;
  -webkit-appearance:none;
  box-sizing:border-box;
  border:1px solid var(--border-subtle);
  background:var(--bg-card-subtle);
  color:var(--text-strong);
  border-radius:12px;
  min-height:3.15rem;
  padding:.72rem 1rem;
  font:inherit;
  font-size:.95rem;
  line-height:1.2;
  box-shadow:var(--shadow-subtle);
  overflow:hidden;
  text-overflow:ellipsis;
}
body.cmep-house-districts-page .lookup-field .address-search-input::placeholder,
body.cmep-house-districts-page .browse-search-input::placeholder{
  color:var(--text-muted);
  opacity:1;
  text-overflow:ellipsis;
}
body.cmep-house-districts-page .lookup-field .address-search-input:focus,
body.cmep-house-districts-page .browse-search-input:focus{
  outline:none;
  border-color:rgba(0,118,186,.36);
  box-shadow:0 0 0 3px rgba(0,118,186,.12);
}
body.dark.cmep-house-districts-page .lookup-field .address-search-input:focus,
body.dark-mode.cmep-house-districts-page .lookup-field .address-search-input:focus,
html.dark body.cmep-house-districts-page .lookup-field .address-search-input:focus,
html[data-theme="dark"] body.cmep-house-districts-page .lookup-field .address-search-input:focus,
body.dark.cmep-house-districts-page .browse-search-input:focus,
body.dark-mode.cmep-house-districts-page .browse-search-input:focus,
html.dark body.cmep-house-districts-page .browse-search-input:focus,
html[data-theme="dark"] body.cmep-house-districts-page .browse-search-input:focus{
  border-color:rgba(0,162,255,.36);
  box-shadow:0 0 0 3px rgba(0,162,255,.14);
}
body.cmep-house-districts-page .browse-search-input::-webkit-search-cancel-button,
body.cmep-house-districts-page .address-search-input::-webkit-search-cancel-button{
  opacity:.65;
}
@media (max-width:560px){
  body.cmep-house-districts-page .lookup-field .address-search-input,
  body.cmep-house-districts-page .browse-search-input{
    min-height:3.05rem;
    padding:.78rem .92rem;
    font-size:.9rem;
  }
}


/* 2026-06-29 — keep Browse Districts dropdown visible above following content. */
body.cmep-house-districts-page .grid2,
body.cmep-house-districts-page .browse-card,
body.cmep-house-districts-page .searchWrap{
  overflow:visible !important;
}
body.cmep-house-districts-page .browse-card{
  position:relative;
  z-index:40;
}
body.cmep-house-districts-page .pivotal-card{
  position:relative;
  z-index:1;
}
body.cmep-house-districts-page .searchWrap:focus-within{
  z-index:60;
}
body.cmep-house-districts-page .dropdown{
  z-index:9999;
}
