/* Extracted from house/district/_detail/index.html <style> block 4. Keep page-specific rules here until componentized. */
/* ---- Changelog shared styles ---- */
.cl-seg {
  display:inline-flex; gap:4px; padding:4px;
  border:1px solid var(--border-subtle,#d4d4d8); border-radius:999px;
  background:rgba(148,163,184,.12);
}
.cl-seg button {
  border:0; background:transparent; color:var(--text-muted,#6b7280);
  padding:.28rem .65rem; border-radius:999px;
  font-weight:800; font-size:.73rem; white-space:nowrap; cursor:pointer;
}
.cl-seg button.active {
  background:var(--bg-card,#fff); color:var(--text-main,#111827);
  box-shadow:0 1px 3px rgba(15,23,42,.12);
}
@media (prefers-color-scheme:dark){ .cl-seg button.active{ background:rgba(255,255,255,.08); } }
.cl-controls { display:flex; justify-content:center; margin-bottom:1rem; }
.cl-stats {
  display:flex; justify-content:center; gap:16px; align-items:center;
  padding:.5rem 1rem; margin-bottom:1rem;
  background:var(--bg-page,#f3f4f6); border:1px solid var(--border-subtle,#d4d4d8);
  border-radius:12px;
}
.cl-stat { text-align:center; }
.cl-sv { font-size:1.1rem; font-weight:950; letter-spacing:-.03em; color:var(--text-strong,#000); line-height:1; }
.cl-sv.d { color:#0076BA; } .cl-sv.r { color:#EE220C; }
.cl-sl { font-size:.62rem; font-weight:800; text-transform:uppercase; letter-spacing:.06em; color:var(--text-muted,#6b7280); margin-top:2px; }
.cl-sdiv { width:1px; background:var(--border-subtle,#d4d4d8); align-self:stretch; }
.cl-day-group { margin-bottom:12px; }
.cl-day-label { font-size:.67rem; font-weight:900; text-transform:uppercase; letter-spacing:.08em; color:var(--text-muted,#6b7280); margin-bottom:6px; padding:0 2px; }
.cl-entry {
  background:var(--bg-page,#f3f4f6); border:1px solid var(--border-subtle,#d4d4d8);
  border-radius:12px; padding:8px 11px;
  display:flex; align-items:center; gap:9px;
  margin-bottom:5px; text-decoration:none; color:inherit;
  transition:transform 140ms ease-out, box-shadow 140ms ease-out;
}
.cl-entry:hover { transform:translateY(-1px); box-shadow:0 4px 12px rgba(15,23,42,.08); }
.cl-dir { display:inline-flex; align-items:center; justify-content:center; width:15px; height:15px; border-radius:50%; font-size:.54rem; font-weight:900; flex-shrink:0; }
.cl-dir.d { background:rgba(0,118,186,.12); color:#0076BA; }
.cl-dir.r { background:rgba(238,34,12,.12); color:#EE220C; }
.cl-info { flex:1; min-width:0; }
.cl-name { font-weight:900; font-size:.83rem; color:var(--text-strong,#000); white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }
.cl-sub  { font-size:.67rem; color:var(--text-muted,#6b7280); margin-top:1px; }
.cl-pills { display:flex; align-items:center; gap:4px; flex-shrink:0; }
.cl-arr { color:var(--text-muted,#6b7280); font-size:.74rem; }
.cl-pill { border-radius:999px; padding:.18rem .48rem; font-size:.63rem; font-weight:900; color:#fff; white-space:nowrap; }
.cl-pill.solid-d  { background:#0076BA; }
.cl-pill.likely-d { background:#00A2FF; }
.cl-pill.lean-d   { background:#56C1FF; color:#082840; }
.cl-pill.toss-up  { background:#929292; }
.cl-pill.lean-r   { background:#FF968D; color:#3d0800; }
.cl-pill.likely-r { background:#FF644E; }
.cl-pill.solid-r  { background:#EE220C; }
.cl-msg { text-align:center; color:var(--text-muted,#6b7280); padding:16px 0; font-size:.84rem; }

/* ══ ANALYTICS MAP (house district) ══════════════════════════════════ */
#analyticsCardHouse{ display:none; }
#analyticsCardHouse.is-visible{ display:block; }

#mapAnalysisHouse{
  height:420px;
  min-height:340px;
  overflow:visible; /* tooltip must escape the map boundary */
}
/* Keep the MapLibre canvas itself rounded even though the container is overflow:visible */
#mapAnalysisHouse .maplibregl-canvas-container,
#mapAnalysisHouse .maplibregl-canvas,
#mapAnalysisHouse .maplibregl-canvas-container canvas{ border-radius:18px; }
#mapAnalysisHouse .maplibregl-canvas-container{ overflow:hidden; }
#mapAnalysisHouse .maplibregl-control-container{ z-index:7; }
@media (max-width: 980px){ #mapAnalysisHouse{ height:380px; } }
@media (max-width: 520px){ #mapAnalysisHouse{ height:320px; min-height:280px; } }

/* Analysis legend */
.analysis-legend{
  display:flex; align-items:center; gap:0.6rem;
  margin-top:0.75rem; font-size:0.78rem;
  font-weight:700; color:var(--text-muted);
}
.analysis-gradient{ flex:1; height:10px; border-radius:999px; }
.analysis-gradient.expected{ background: linear-gradient(90deg, #0076BA 0%, #ffffff 50%, #EE220C 100%); }
.kalawao-admin-note{
  display:none;
  margin-top:0.75rem;
  padding:0.78rem 0.9rem;
  border-radius:16px;
  border:1px dashed var(--border-subtle);
  background:var(--bg-card-subtle);
  color:var(--text-muted);
  font-size:0.86rem;
  font-weight:700;
  line-height:1.35;
}
.kalawao-admin-note.is-visible{ display:block; }

/* Frost overlay */
.analysis-frost-overlay{
  position:absolute; inset:0; display:none;
  align-items:center; justify-content:center;
  border-radius:18px;
  background: rgba(2,8,23,0.62);
  -webkit-backdrop-filter: blur(8px); backdrop-filter: blur(8px);
  z-index:6;
}
.analysis-frost-overlay.is-visible{ display:flex; }
.analysis-frost-card{
  background: rgba(15,23,42,0.88);
  border:1px solid rgba(148,163,184,0.22);
  border-radius:20px; padding:1.25rem 1.4rem;
  max-width: min(380px, calc(100% - 2.4rem));
  box-shadow: 0 24px 48px rgba(0,0,0,0.45);
}
body.dark .analysis-frost-card{ background: rgba(2,6,23,0.88); }
.analysis-frost-title{ font-size:1.14rem; font-weight:900; letter-spacing:-0.025em; color:#f8fafc; }
.analysis-frost-text{ margin-top:0.48rem; font-size:0.95rem; line-height:1.5; color:rgba(241,245,249,0.92); }
@media (max-width:520px){
  .analysis-frost-card{ padding:1rem 0.95rem; border-radius:18px; }
  .analysis-frost-title{ font-size:1rem; }
  .analysis-frost-text{ font-size:0.86rem; }
}

/* Analysis summary badge */
.analysis-summary{
  display:none; align-items:center; justify-content:space-between;
  gap:0.8rem; flex-wrap:wrap; margin-top:0.75rem;
  padding:0.8rem 0.95rem; border-radius:16px;
  border:1px solid var(--border-subtle); background:var(--bg-card-subtle);
  box-shadow:var(--shadow-subtle);
}
.analysis-summary.is-visible{ display:flex; }
.analysis-summary-copy{ display:flex; flex-direction:column; gap:0.22rem; min-width:0; }
.analysis-summary-kicker{
  font-size:0.72rem; text-transform:uppercase; letter-spacing:0.12em;
  font-weight:800; color:var(--text-muted);
}
.analysis-summary-sub{ font-size:0.82rem; color:var(--text-muted); line-height:1.3; }
.analysis-summary-badge{
  display:inline-flex; align-items:center; gap:0.42rem; min-height:34px;
  padding:0.42rem 0.82rem; border-radius:999px; font-weight:950; font-size:0.92rem;
  line-height:1; letter-spacing:-0.01em; border:1px solid rgba(148,163,184,0.18);
  box-shadow:0 8px 22px rgba(15,23,42,0.10); white-space:nowrap;
}
.analysis-summary-badge.is-d{ background:rgba(59,130,246,0.14); color:var(--solid-d); border-color:rgba(59,130,246,0.28); }
.analysis-summary-badge.is-r{ background:rgba(239,68,68,0.14); color:var(--solid-r); border-color:rgba(239,68,68,0.28); }
.analysis-summary-badge.is-even{ background:rgba(148,163,184,0.14); color:var(--text-strong); border-color:rgba(148,163,184,0.22); }
.analysis-summary-dot{ width:10px; height:10px; border-radius:999px; flex:0 0 auto; background:currentColor; opacity:0.95; }
@media (prefers-color-scheme: dark){
  .analysis-summary-badge{ box-shadow:none; }
  .analysis-summary-badge.is-d{ background:rgba(59,130,246,0.18); border-color:rgba(96,165,250,0.34); }
  .analysis-summary-badge.is-r{ background:rgba(239,68,68,0.18); border-color:rgba(248,113,113,0.34); }
  .analysis-summary-badge.is-even{ background:rgba(148,163,184,0.18); border-color:rgba(148,163,184,0.26); }
}

/* ct-expected tooltip classes (additions to existing .county-tooltip) */
.county-tooltip .ct-head{
  font-weight:1000; font-size:0.98rem; letter-spacing:-0.01em;
  line-height:1.15; white-space:nowrap; overflow:hidden; text-overflow:ellipsis;
}
.county-tooltip .ct-top{
  display:flex; align-items:flex-start; justify-content:space-between;
  gap:0.65rem; margin-bottom:0.48rem;
}
.county-tooltip .ct-summary{ display:flex; flex-wrap:wrap; gap:0.38rem; margin:0 0 0.55rem 0; }
.county-tooltip .ct-chip{
  display:inline-flex; align-items:center; gap:0.28rem; min-height:24px;
  padding:0.2rem 0.5rem; border-radius:999px;
  background: rgba(148,163,184,0.12); border:1px solid rgba(148,163,184,0.18);
  color: var(--text-muted); font-weight:900; font-size:0.74rem; line-height:1;
}
@media (prefers-color-scheme: dark){
  .county-tooltip .ct-chip{ background: rgba(148,163,184,0.14); border-color: rgba(148,163,184,0.16); }
}
.county-tooltip .ct-note{ color: var(--text-muted); font-weight:800; font-size:0.8rem; line-height:1.2; }
.county-tooltip .ct-expected-wrap{ display:flex; flex-direction:column; align-items:flex-start; gap:0.4rem; }
.county-tooltip .ct-expected-badge{
  display:inline-flex; align-items:center; gap:0.38rem; min-height:30px;
  padding:0.34rem 0.72rem; border-radius:999px; font-weight:950; font-size:0.86rem;
  line-height:1; letter-spacing:-0.01em; border:1px solid rgba(148,163,184,0.18);
  box-shadow:0 8px 22px rgba(15,23,42,0.10);
}
.county-tooltip .ct-expected-badge.is-d{ background:rgba(59,130,246,0.14); color:var(--solid-d); border-color:rgba(59,130,246,0.28); }
.county-tooltip .ct-expected-badge.is-r{ background:rgba(239,68,68,0.14); color:var(--solid-r); border-color:rgba(239,68,68,0.28); }
.county-tooltip .ct-expected-badge.is-even{ background:rgba(148,163,184,0.14); color:var(--text-strong); border-color:rgba(148,163,184,0.22); }
.county-tooltip .ct-expected-dot{ width:9px; height:9px; border-radius:999px; flex:0 0 auto; background:currentColor; opacity:0.95; }
.county-tooltip .ct-expected-sub{ font-size:0.74rem; font-weight:850; color:var(--text-muted); line-height:1.15; }
@media (prefers-color-scheme: dark){
  .county-tooltip .ct-expected-badge{ box-shadow:none; }
  .county-tooltip .ct-expected-badge.is-d{ background:rgba(59,130,246,0.18); border-color:rgba(96,165,250,0.34); }
  .county-tooltip .ct-expected-badge.is-r{ background:rgba(239,68,68,0.18); border-color:rgba(248,113,113,0.34); }
  .county-tooltip .ct-expected-badge.is-even{ background:rgba(148,163,184,0.18); border-color:rgba(148,163,184,0.26); }
}
@media (max-width: 520px){
  .county-tooltip .ct-top{ flex-direction:column; align-items:flex-start; gap:0.36rem; }
}

/* ── Analytics card: looser title/subhead spacing ── */
#analyticsCardHouse .card-header{
  margin-bottom: 0.4rem;
}
#analyticsCardHouse .card-help{
  margin-top: 0.2rem;
  margin-bottom: 0.85rem;
}

/* ── Analytics tooltip: richer style matching state index ── */
#countyTooltipAnalysisHouse{
  white-space: normal;
  width: min(340px, calc(100vw - 24px));
  max-width: min(340px, calc(100vw - 24px));
  overflow: hidden;
  border-radius: 16px;
  padding: 0.72rem 0.8rem;
  line-height: 1.15;
}
#countyTooltipAnalysisHouse.show{
  opacity: 1;
  pointer-events: auto;
  transform: translate(-50%, calc(-100% - 16px));
}
#countyTooltipAnalysisHouse::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.94);
  filter: drop-shadow(0 4px 10px rgba(15,23,42,0.12));
}
#countyTooltipAnalysisHouse.below{
  transform: translate(-50%, 16px);
}
#countyTooltipAnalysisHouse.edge-left,
#countyTooltipAnalysisHouse.edge-left.show{ transform: translate(0, calc(-100% - 16px)); }
#countyTooltipAnalysisHouse.edge-right,
#countyTooltipAnalysisHouse.edge-right.show{ transform: translate(-100%, calc(-100% - 16px)); }
#countyTooltipAnalysisHouse.below.edge-left,
#countyTooltipAnalysisHouse.below.edge-left.show{ transform: translate(0, 16px); }
#countyTooltipAnalysisHouse.below.edge-right,
#countyTooltipAnalysisHouse.below.edge-right.show{ transform: translate(-100%, 16px); }
#countyTooltipAnalysisHouse.mobile-popout,
#countyTooltipAnalysisHouse.mobile-popout.show{
  position: fixed;
  transform: none;
  width: min(320px, calc(100vw - 16px));
  max-width: min(320px, calc(100vw - 16px));
}
#countyTooltipAnalysisHouse.mobile-popout::after{ display: none; }
#countyTooltipAnalysisHouse.edge-left::after{ left: 24px; transform: none; }
#countyTooltipAnalysisHouse.edge-right::after{ left: auto; right: 24px; transform: none; }
#countyTooltipAnalysisHouse.below::after{
  bottom: auto; top: -8px; border-top: 0;
  border-bottom: 8px solid rgba(255,255,255,0.94);
  filter: drop-shadow(0 6px 12px rgba(15,23,42,0.10));
}
@supports ((-webkit-backdrop-filter: blur(1px)) or (backdrop-filter: blur(1px))){
  #countyTooltipAnalysisHouse{
    -webkit-backdrop-filter: blur(12px);
    backdrop-filter: blur(12px);
  }
}
@media (prefers-color-scheme: dark){
  #countyTooltipAnalysisHouse{
    background: rgba(2,6,23,0.92); color: #e5e7eb;
    border-color: rgba(148,163,184,0.18); box-shadow: 0 22px 46px rgba(0,0,0,0.42);
  }
  #countyTooltipAnalysisHouse::after{ border-top-color: rgba(2,6,23,0.92); }
  #countyTooltipAnalysisHouse.below::after{ border-bottom-color: rgba(2,6,23,0.92); }
}
@media (max-width: 640px){
  #countyTooltipAnalysisHouse{
    font-size: 0.85rem; padding: 0.72rem 0.78rem;
    width: min(340px, calc(100vw - 16px));
    max-width: min(340px, calc(100vw - 16px));
    max-height: min(60vh, 360px);
    overflow: auto; -webkit-overflow-scrolling: touch;
    border-radius: 15px;
  }
}
.jump-link-wrap{ display:flex; justify-content:center; margin-top:0.95rem; }
.jump-link-wrap.bottom{ margin-top:1rem; }
.jump-link-btn{
  display:inline-flex; align-items:center; justify-content:center;
  gap:0.45rem; min-height:44px; padding:0.78rem 1.1rem;
  border-radius:999px; border:1px solid rgba(0,0,0,0.12);
  background:var(--bg-card-subtle); color:var(--text-strong); text-decoration:none;
  font-weight:800; letter-spacing:-0.01em; box-shadow:var(--shadow-subtle);
  transition:transform .16s ease, box-shadow .16s ease;
}
body.dark .jump-link-btn{ border-color:rgba(255,255,255,0.12); }
.jump-link-btn:hover{ transform:translateY(-1px); box-shadow:var(--shadow-soft); }
.jump-link-btn:active{ transform:translateY(0); }