/*
  Homepage standardization layer
  Scope: body.cmep-home-page (/)
  Purpose: bring the forecast homepage into the same visual system as the current election-night pages
  without rewriting the Senate/House forecast widgets.
*/

body.cmep-home-page{
  --home-bg:#f3f5f8;
  --home-bg-soft:#eef2f7;
  --home-surface:#ffffff;
  --home-surface-2:#f8fafc;
  --home-surface-3:#eef2f7;
  --home-border:#d8dee8;
  --home-border-strong:#b9c3d1;
  --home-text:#172033;
  --home-strong:#08111f;
  --home-muted:#5d6b7f;
  --home-subtle:#7b8798;
  --home-shadow:0 18px 38px rgba(15,23,42,.08);
  --home-shadow-soft:0 8px 20px rgba(15,23,42,.06);
  --home-radius:22px;
  --home-radius-sm:16px;
  --home-shell:1360px;

  --bg-page:var(--home-bg);
  --bg-card:var(--home-surface);
  --bg-card-subtle:var(--home-surface-2);
  --border-subtle:var(--home-border);
  --text-main:var(--home-text);
  --text-muted:var(--home-muted);
  --text-strong:var(--home-strong);
  --shadow-soft:var(--home-shadow);
  --shadow-subtle:var(--home-shadow-soft);

  margin:0 !important;
  padding-top:var(--header-offset,0px);
  background:
    radial-gradient(circle at 12% 18%, rgba(100,116,139,.12), transparent 28rem),
    linear-gradient(180deg,var(--home-bg),var(--home-bg-soft)) !important;
  color:var(--home-text) !important;
  color-scheme:light;
}

@media (prefers-color-scheme:dark){
  html:not([data-theme="light"]):not(.light) body.cmep-home-page:not(.light):not(.light-mode){
    --home-bg:#050b16;
    --home-bg-soft:#020617;
    --home-surface:#0c1422;
    --home-surface-2:#111b2a;
    --home-surface-3:#162235;
    --home-border:#263347;
    --home-border-strong:#384861;
    --home-text:#d9e3f0;
    --home-strong:#f8fafc;
    --home-muted:#aeb9c8;
    --home-subtle:#8fa0b5;
    --home-shadow:0 22px 50px rgba(0,0,0,.34);
    --home-shadow-soft:0 12px 26px rgba(0,0,0,.26);
    background:
      radial-gradient(circle at 12% 18%, rgba(148,163,184,.12), transparent 32rem),
      linear-gradient(180deg,var(--home-bg),var(--home-bg-soft)) !important;
    color-scheme:dark;
  }
}
html[data-theme="dark"] body.cmep-home-page,
html.dark body.cmep-home-page,
body.cmep-home-page.dark,
body.cmep-home-page.dark-mode{
  --home-bg:#050b16;
  --home-bg-soft:#020617;
  --home-surface:#0c1422;
  --home-surface-2:#111b2a;
  --home-surface-3:#162235;
  --home-border:#263347;
  --home-border-strong:#384861;
  --home-text:#d9e3f0;
  --home-strong:#f8fafc;
  --home-muted:#aeb9c8;
  --home-subtle:#8fa0b5;
  --home-shadow:0 22px 50px rgba(0,0,0,.34);
  --home-shadow-soft:0 12px 26px rgba(0,0,0,.26);
  background:
    radial-gradient(circle at 12% 18%, rgba(148,163,184,.12), transparent 32rem),
    linear-gradient(180deg,var(--home-bg),var(--home-bg-soft)) !important;
  color-scheme:dark;
}
html[data-theme="light"] body.cmep-home-page,
html.light body.cmep-home-page,
body.cmep-home-page.light,
body.cmep-home-page.light-mode{
  --home-bg:#f3f5f8;
  --home-bg-soft:#eef2f7;
  --home-surface:#ffffff;
  --home-surface-2:#f8fafc;
  --home-surface-3:#eef2f7;
  --home-border:#d8dee8;
  --home-border-strong:#b9c3d1;
  --home-text:#172033;
  --home-strong:#08111f;
  --home-muted:#5d6b7f;
  --home-subtle:#7b8798;
  --home-shadow:0 18px 38px rgba(15,23,42,.08);
  --home-shadow-soft:0 8px 20px rgba(15,23,42,.06);
  background:
    radial-gradient(circle at 12% 18%, rgba(100,116,139,.12), transparent 28rem),
    linear-gradient(180deg,var(--home-bg),var(--home-bg-soft)) !important;
  color-scheme:light;
}

body.cmep-home-page *,
body.cmep-home-page *::before,
body.cmep-home-page *::after{box-sizing:border-box;}

/* Header parity with election-night hub pages. */
body.cmep-home-page #cm-header,
body.cmep-home-page .cm-header,
body.cmep-home-page .cm-header header,
body.cmep-home-page header.cm-header{
  position:sticky !important;
  top:0 !important;
  z-index:50 !important;
  background:rgba(255,255,255,.88) !important;
  border-bottom:1px solid var(--home-border) !important;
  backdrop-filter:blur(18px) saturate(130%) !important;
  -webkit-backdrop-filter:blur(18px) saturate(130%) !important;
  color:var(--home-text) !important;
}
@media (prefers-color-scheme:dark){
  html:not([data-theme="light"]):not(.light) body.cmep-home-page:not(.light):not(.light-mode) #cm-header,
  html:not([data-theme="light"]):not(.light) body.cmep-home-page:not(.light):not(.light-mode) .cm-header,
  html:not([data-theme="light"]):not(.light) body.cmep-home-page:not(.light):not(.light-mode) .cm-header header,
  html:not([data-theme="light"]):not(.light) body.cmep-home-page:not(.light):not(.light-mode) header.cm-header{background:rgba(5,11,22,.88) !important;}
}
html[data-theme="dark"] body.cmep-home-page #cm-header,
html.dark body.cmep-home-page #cm-header,
body.cmep-home-page.dark #cm-header,
body.cmep-home-page.dark-mode #cm-header,
html[data-theme="dark"] body.cmep-home-page .cm-header,
html.dark body.cmep-home-page .cm-header,
body.cmep-home-page.dark .cm-header,
body.cmep-home-page.dark-mode .cm-header{background:rgba(5,11,22,.88) !important;}
body.cmep-home-page .header-inner{
  max-width:var(--home-shell) !important;
  padding:.72rem clamp(12px,2.1vw,28px) .78rem !important;
  gap:.5rem !important;
}
body.cmep-home-page .logo-link,
body.cmep-home-page .site-title,
body.cmep-home-page #cm-header a{color:var(--home-strong) !important;}
body.cmep-home-page #cm-nav{
  gap:.18rem !important;
  padding:.18rem !important;
  border:1px solid var(--home-border) !important;
  border-radius:999px !important;
  background:var(--home-surface-2) !important;
}
body.cmep-home-page #cm-nav a{
  color:var(--home-muted) !important;
  border-radius:999px !important;
  padding:.38rem .72rem !important;
  background:transparent !important;
  font-weight:750 !important;
}
body.cmep-home-page #cm-nav a:hover,
body.cmep-home-page #cm-nav a.active,
body.cmep-home-page #cm-nav a[aria-current="page"]{
  background:var(--home-surface) !important;
  color:var(--home-strong) !important;
  box-shadow:0 1px 4px rgba(15,23,42,.10) !important;
}

body.cmep-home-page .home-main{
  width:100%;
  min-width:0;
}
body.cmep-home-page .container{
  width:min(100%,var(--home-shell)) !important;
  max-width:var(--home-shell) !important;
  margin:0 auto !important;
  padding:clamp(14px,2.2vw,30px) clamp(12px,2.4vw,34px) !important;
}
body.cmep-home-page .home-top-container{padding-bottom:0 !important;}

body.cmep-home-page .home-hero{
  margin:0 auto clamp(18px,2vw,28px) !important;
  padding:clamp(22px,3vw,44px) clamp(18px,4vw,54px) !important;
  border:1px solid var(--home-border) !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(--home-surface),var(--home-surface-2)) !important;
  box-shadow:var(--home-shadow) !important;
  text-align:center !important;
  overflow:hidden !important;
}
body.cmep-home-page .home-kicker{
  width:fit-content;
  max-width:100%;
  margin:0 auto .58rem;
  padding:.22rem .72rem;
  border:1px solid var(--home-border);
  border-radius:999px;
  background:var(--home-surface-2);
  color:var(--home-muted);
  font-size:.72rem;
  line-height:1;
  font-weight:950;
  letter-spacing:.16em;
  text-transform:uppercase;
}
body.cmep-home-page .home-hero h1{
  margin:0;
  color:var(--home-strong);
  font-size:clamp(2.1rem,4.4vw,4rem);
  line-height:.96;
  letter-spacing:-.065em;
  font-weight:1000;
  text-wrap:balance;
}
body.cmep-home-page .home-lede{
  max-width:780px;
  margin:.82rem auto 0;
  color:var(--home-muted);
  font-size:clamp(.95rem,1.42vw,1.1rem);
  line-height:1.43;
  font-weight:700;
  text-wrap:balance;
}
body.cmep-home-page .home-action-row{
  display:flex;
  justify-content:center;
  align-items:center;
  gap:.48rem;
  flex-wrap:wrap;
  margin:1.2rem auto 0;
}
body.cmep-home-page .home-action-row a,
body.cmep-home-page .cm-btn,
body.cmep-home-page .cl-load-btn,
body.cmep-home-page .range-btn,
body.cmep-home-page .changelog-seg button,
body.cmep-home-page .cmep-share-row button{
  min-height:2.25rem;
  display:inline-flex;
  align-items:center;
  justify-content:center;
  gap:.45rem;
  padding:.58rem .86rem;
  border:1px solid var(--home-border);
  border-radius:999px !important;
  background:var(--home-surface-2);
  color:var(--home-muted);
  box-shadow:none !important;
  text-decoration:none;
  font-size:.82rem;
  line-height:1.05;
  font-weight:850;
  letter-spacing:-.01em;
  cursor:pointer;
  transition:transform 140ms ease, background-color 140ms ease, border-color 140ms ease, color 140ms ease;
}
body.cmep-home-page .home-action-row a:hover,
body.cmep-home-page .cm-btn:hover,
body.cmep-home-page .cl-load-btn:hover:not(:disabled),
body.cmep-home-page .range-btn:hover,
body.cmep-home-page .changelog-seg button:hover,
body.cmep-home-page .cmep-share-row button:hover{
  transform:translateY(-1px);
  color:var(--home-strong);
  border-color:var(--home-border-strong);
  background:var(--home-surface);
}
body.cmep-home-page .home-action-row .home-primary-action,
body.cmep-home-page .changelog-seg button.active,
body.cmep-home-page .range-btn[aria-pressed="true"]{
  background:var(--home-surface) !important;
  color:var(--home-strong) !important;
  border-color:var(--home-border-strong) !important;
  box-shadow:0 1px 4px rgba(15,23,42,.10) !important;
  outline:0 !important;
}

body.cmep-home-page .forecast-grid{
  display:grid !important;
  grid-template-columns:minmax(0,1fr) minmax(0,1fr) !important;
  gap:clamp(14px,1.8vw,24px) !important;
  align-items:start;
  margin:0 !important;
}
body.cmep-home-page .cm-card{
  min-width:0;
  margin:0 0 clamp(14px,1.8vw,24px) !important;
  padding:clamp(14px,1.8vw,24px) !important;
  border:1px solid var(--home-border) !important;
  border-radius:var(--home-radius) !important;
  background:linear-gradient(180deg,var(--home-surface),var(--home-surface-2)) !important;
  box-shadow:var(--home-shadow) !important;
  color:var(--home-text) !important;
  overflow:hidden;
}
body.cmep-home-page .cm-card section{min-width:0;}
body.cmep-home-page section h2{
  margin:0 0 .85rem !important;
  padding-bottom:.78rem;
  border-bottom:1px solid var(--home-border);
  color:var(--home-strong) !important;
  text-align:left !important;
  font-size:clamp(1.05rem,1.45vw,1.28rem) !important;
  line-height:1.05;
  font-weight:950;
  letter-spacing:-.035em;
}
body.cmep-home-page .cm-card .cta-row{justify-content:flex-start;}
body.cmep-home-page .cm-btn{background:var(--home-surface); color:var(--home-strong);}

/* Keep the native forecast modules from carrying old standalone-page spacing into cards. */
body.cmep-home-page .senate-wrapper,
body.cmep-home-page .house-wrapper{
  max-width:none !important;
  width:100% !important;
  margin:0 !important;
  padding:0 !important;
  background:transparent !important;
}
body.cmep-home-page .cmep-native-widget,
body.cmep-home-page .cmep-senate-arc-native,
body.cmep-home-page .cmep-house-arc-native{
  min-width:0;
  color:var(--home-text);
}
body.cmep-home-page #cmep-senate-arc-native .arc-wrap,
body.cmep-home-page #cmep-house-arc-native .arc-wrap{
  max-width:100% !important;
  margin:0 auto clamp(10px,1.4vw,18px) !important;
  padding:0 clamp(0px,.7vw,8px) clamp(10px,1.2vw,16px) !important;
}
body.cmep-home-page #cmep-senate-arc-native .legend,
body.cmep-home-page #cmep-house-arc-native .legend{
  max-width:100% !important;
  margin:.4rem auto .75rem !important;
  padding:0 !important;
  gap:.38rem !important;
}
body.cmep-home-page #cmep-senate-arc-native .legend-item,
body.cmep-home-page #cmep-house-arc-native .legend-item,
body.cmep-home-page .legend-pill,
body.cmep-home-page .pill,
body.cmep-home-page .cl-pill{
  border-radius:999px !important;
  font-weight:850 !important;
  box-shadow:none !important;
}
body.cmep-home-page #cmep-senate-arc-native .legend-item,
body.cmep-home-page #cmep-house-arc-native .legend-item{
  padding:.34rem .62rem !important;
  font-size:.72rem !important;
  letter-spacing:.01em !important;
}
body.cmep-home-page .cmep-share-row{margin:.5rem 0 .3rem !important;}
body.cmep-home-page .path-explainer,
body.cmep-home-page .chart-sub,
body.cmep-home-page .count,
body.cmep-home-page .district-intro{color:var(--home-muted) !important;}

/* Changelog gets the same card/list language as election-night tiles. */
body.cmep-home-page #changelog-section{margin-top:0 !important;}
body.cmep-home-page .changelog-controls{
  justify-content:flex-start !important;
  overflow-x:auto;
  scrollbar-width:none;
}
body.cmep-home-page .changelog-controls::-webkit-scrollbar{display:none;}
body.cmep-home-page .changelog-seg{
  display:inline-flex;
  gap:.22rem;
  padding:.22rem;
  border:1px solid var(--home-border) !important;
  border-radius:999px !important;
  background:var(--home-surface-2) !important;
  box-shadow:none !important;
}
body.cmep-home-page .cl-stats{
  justify-content:flex-start !important;
  gap:clamp(10px,1.5vw,18px) !important;
  margin:.2rem 0 1rem !important;
  padding:.8rem .95rem !important;
  border:1px solid var(--home-border) !important;
  border-radius:var(--home-radius-sm) !important;
  background:var(--home-surface-2) !important;
}
body.cmep-home-page .cl-card{
  padding:.72rem .82rem !important;
  gap:.7rem !important;
  border:1px solid var(--home-border) !important;
  border-radius:var(--home-radius-sm) !important;
  background:var(--home-surface-2) !important;
  box-shadow:none !important;
}
body.cmep-home-page .cl-card:hover{
  box-shadow:var(--home-shadow-soft) !important;
  border-color:var(--home-border-strong) !important;
}
body.cmep-home-page .cl-race-name{
  color:var(--home-strong) !important;
  letter-spacing:-.015em;
}
body.cmep-home-page .cl-day-label,
body.cmep-home-page .cl-race-sub,
body.cmep-home-page .cl-state-msg{color:var(--home-muted) !important;}

body.cmep-home-page footer{
  width:min(100%,var(--home-shell));
  margin:0 auto;
  padding:1.2rem clamp(12px,2.4vw,34px) 2rem;
  border-top:1px solid var(--home-border) !important;
  color:var(--home-muted) !important;
}

@media (max-width:1100px){
  body.cmep-home-page .forecast-grid{grid-template-columns:1fr !important;}
}
@media (max-width:720px){
  body.cmep-home-page .container{padding:12px !important;}
  body.cmep-home-page .home-hero{
    padding:22px 16px !important;
    border-radius:22px !important;
  }
  body.cmep-home-page .home-hero h1{
    font-size:clamp(2rem,12vw,3rem);
    letter-spacing:-.06em;
  }
  body.cmep-home-page .home-action-row{
    justify-content:flex-start;
    overflow-x:auto;
    flex-wrap:nowrap;
    padding-bottom:.15rem;
    scrollbar-width:none;
  }
  body.cmep-home-page .home-action-row::-webkit-scrollbar{display:none;}
  body.cmep-home-page .home-action-row a{flex:0 0 auto;}
  body.cmep-home-page .cm-card{
    padding:14px !important;
    border-radius:18px !important;
  }
  body.cmep-home-page section h2{text-align:left !important;}
  body.cmep-home-page .cl-card{
    align-items:flex-start !important;
    flex-wrap:wrap;
  }
  body.cmep-home-page .cl-pills{
    width:100%;
    justify-content:flex-start;
    padding-left:27px;
  }
}
@media (max-width:420px){
  body.cmep-home-page .cl-stats{display:grid !important; grid-template-columns:1fr 1fr 1fr; gap:.5rem !important;}
  body.cmep-home-page .cl-stat-div{display:none;}
  body.cmep-home-page .cl-stat-val{font-size:1.05rem !important;}
  body.cmep-home-page #cmep-senate-arc-native .legend-item,
  body.cmep-home-page #cmep-house-arc-native .legend-item{font-size:.68rem !important; padding:.3rem .5rem !important;}
}

/* 2026-06-24 cleanup: the global injected header owns navigation on the homepage. */
body.cmep-home-page .home-action-row,
body.cmep-home-page .home-kicker{
  display:none !important;
}
body.cmep-home-page .home-hero{
  padding-block:clamp(22px,3vw,38px) !important;
}
body.cmep-home-page .home-lede{
  margin-top:.7rem !important;
}

/* Home page owns its own hero; suppress legacy/cohesion injected hero variants. */
body.cmep-home-page .cmep-page-hero,
body.cmep-home-page.cmep-page-home .cmep-page-hero,
body.cmep-home-page.cmep-page-home > .cmep-page-hero{
  display:none !important;
}

/* 2026-06-24 changelog polish: center the section header and use election-page segmented menu buttons. */
body.cmep-home-page #changelog-section .cm-card section{
  display:flex !important;
  flex-direction:column !important;
  align-items:center !important;
}
body.cmep-home-page #changelog-section section h2{
  width:100% !important;
  max-width:860px !important;
  margin:0 auto .92rem !important;
  padding-bottom:.72rem !important;
  text-align:center !important;
}
body.cmep-home-page #changelog-section .changelog-controls{
  width:100% !important;
  display:flex !important;
  justify-content:center !important;
  align-items:center !important;
  margin:.18rem auto .72rem !important;
  overflow-x:visible !important;
}
body.cmep-home-page #changelog-section .changelog-controls[style]{
  margin:.12rem auto 1rem !important;
}
body.cmep-home-page #changelog-section .changelog-seg{
  display:inline-flex !important;
  flex-wrap:wrap !important;
  justify-content:center !important;
  align-items:center !important;
  gap:.28rem !important;
  padding:.28rem !important;
  border:1px solid var(--home-border) !important;
  border-radius:999px !important;
  background:color-mix(in srgb, var(--home-surface-2) 90%, var(--home-strong) 4%) !important;
  box-shadow:inset 0 1px 0 rgba(255,255,255,.68), 0 8px 22px rgba(15,23,42,.06) !important;
}
body.cmep-home-page #changelog-section .changelog-seg button{
  min-height:2.28rem !important;
  padding:.54rem .92rem !important;
  border:1px solid transparent !important;
  border-radius:999px !important;
  background:transparent !important;
  color:var(--home-muted) !important;
  box-shadow:none !important;
  font-size:.82rem !important;
  font-weight:950 !important;
  line-height:1 !important;
  letter-spacing:-.012em !important;
  text-shadow:none !important;
}
body.cmep-home-page #changelog-section .changelog-seg.changelog-seg-sm button{
  min-height:2.12rem !important;
  padding:.48rem .82rem !important;
  font-size:.78rem !important;
}
body.cmep-home-page #changelog-section .changelog-seg button:hover:not(:disabled){
  transform:none !important;
  background:color-mix(in srgb, var(--home-surface-3) 82%, var(--home-strong) 6%) !important;
  border-color:var(--home-border) !important;
  color:var(--home-strong) !important;
}
body.cmep-home-page #changelog-section .changelog-seg button.active,
body.cmep-home-page #changelog-section .changelog-seg button[aria-pressed="true"],
body.cmep-home-page #changelog-section .changelog-seg button[aria-selected="true"]{
  background:var(--home-strong) !important;
  border-color:var(--home-strong) !important;
  color:var(--home-surface) !important;
  box-shadow:0 10px 24px rgba(15,23,42,.18), inset 0 1px 0 rgba(255,255,255,.14) !important;
}
body.cmep-home-page #changelog-section .cl-stats{
  align-self:center !important;
  justify-content:center !important;
  margin:.2rem auto 1rem !important;
}
body.cmep-home-page #changelog-section #cl-body{
  width:100% !important;
}

@media (prefers-color-scheme:dark){
  html:not([data-theme="light"]):not(.light) body.cmep-home-page:not(.light):not(.light-mode) #changelog-section .changelog-seg{
    box-shadow:inset 0 1px 0 rgba(255,255,255,.07), 0 10px 26px rgba(0,0,0,.22) !important;
  }
  html:not([data-theme="light"]):not(.light) body.cmep-home-page:not(.light):not(.light-mode) #changelog-section .changelog-seg button.active,
  html:not([data-theme="light"]):not(.light) body.cmep-home-page:not(.light):not(.light-mode) #changelog-section .changelog-seg button[aria-pressed="true"],
  html:not([data-theme="light"]):not(.light) body.cmep-home-page:not(.light):not(.light-mode) #changelog-section .changelog-seg button[aria-selected="true"]{
    background:var(--home-strong) !important;
    border-color:var(--home-border-strong) !important;
    color:#020617 !important;
  }
}
html[data-theme="dark"] body.cmep-home-page #changelog-section .changelog-seg,
html.dark body.cmep-home-page #changelog-section .changelog-seg,
body.cmep-home-page.dark #changelog-section .changelog-seg,
body.cmep-home-page.dark-mode #changelog-section .changelog-seg{
  box-shadow:inset 0 1px 0 rgba(255,255,255,.07), 0 10px 26px rgba(0,0,0,.22) !important;
}
html[data-theme="dark"] body.cmep-home-page #changelog-section .changelog-seg button.active,
html.dark body.cmep-home-page #changelog-section .changelog-seg button.active,
body.cmep-home-page.dark #changelog-section .changelog-seg button.active,
body.cmep-home-page.dark-mode #changelog-section .changelog-seg button.active,
html[data-theme="dark"] body.cmep-home-page #changelog-section .changelog-seg button[aria-pressed="true"],
html.dark body.cmep-home-page #changelog-section .changelog-seg button[aria-pressed="true"],
body.cmep-home-page.dark #changelog-section .changelog-seg button[aria-pressed="true"],
body.cmep-home-page.dark-mode #changelog-section .changelog-seg button[aria-pressed="true"],
html[data-theme="dark"] body.cmep-home-page #changelog-section .changelog-seg button[aria-selected="true"],
html.dark body.cmep-home-page #changelog-section .changelog-seg button[aria-selected="true"],
body.cmep-home-page.dark #changelog-section .changelog-seg button[aria-selected="true"],
body.cmep-home-page.dark-mode #changelog-section .changelog-seg button[aria-selected="true"]{
  background:var(--home-strong) !important;
  border-color:var(--home-border-strong) !important;
  color:#020617 !important;
}
@media (max-width:720px){
  body.cmep-home-page #changelog-section .changelog-controls{
    justify-content:flex-start !important;
    overflow-x:auto !important;
    padding-bottom:.12rem !important;
    scrollbar-width:none !important;
  }
  body.cmep-home-page #changelog-section .changelog-controls::-webkit-scrollbar{display:none;}
  body.cmep-home-page #changelog-section .changelog-seg{
    flex-wrap:nowrap !important;
    justify-content:flex-start !important;
  }
  body.cmep-home-page #changelog-section .changelog-seg button{
    flex:0 0 auto !important;
  }
}

/* Homepage forecast legend pill standardization — keep Senate/House pills the same size. */
body.cmep-home-page :where(#cmep-senate-arc-native, #cmep-house-arc-native) :where(.legend, .seat-road-legend){
  align-items:center !important;
  row-gap:.42rem !important;
  column-gap:.42rem !important;
}
body.cmep-home-page :where(#cmep-senate-arc-native, #cmep-house-arc-native) :where(.legend-item, .legend-pill){
  box-sizing:border-box !important;
  display:inline-flex !important;
  align-items:center !important;
  justify-content:center !important;
  min-height:1.72rem !important;
  padding:.39rem .68rem !important;
  border-radius:999px !important;
  font-size:.72rem !important;
  line-height:1 !important;
  font-weight:850 !important;
  letter-spacing:.01em !important;
  white-space:nowrap !important;
  box-shadow:none !important;
}
body.cmep-home-page :where(#cmep-senate-arc-native, #cmep-house-arc-native) :where(.legend-item.leg-no-election-d, .legend-item.leg-no-election-r, .legend-pill.noel-d, .legend-pill.noel-r){
  min-height:1.84rem !important;
  padding:.38rem .72rem !important;
  border-width:2px !important;
}
body.cmep-home-page :where(#cmep-senate-arc-native, #cmep-house-arc-native) :where(.legend-item.majority-pill, .legend-item.leg-majority, .legend-pill.majority-pill){
  min-height:1.72rem !important;
  padding:.37rem .72rem !important;
  gap:.34rem !important;
  font-size:.72rem !important;
}
body.cmep-home-page :where(#cmep-senate-arc-native, #cmep-house-arc-native) :where(.legend-item.majority-pill .ring, .legend-item.leg-majority .ring, .legend-pill.majority-pill .ring){
  flex:0 0 auto !important;
  width:.72rem !important;
  height:.72rem !important;
  border-width:2px !important;
}
@media (max-width:720px){
  body.cmep-home-page :where(#cmep-senate-arc-native, #cmep-house-arc-native) :where(.legend-item, .legend-pill){
    min-height:1.64rem !important;
    padding:.34rem .58rem !important;
    font-size:.68rem !important;
  }
  body.cmep-home-page :where(#cmep-senate-arc-native, #cmep-house-arc-native) :where(.legend-item.leg-no-election-d, .legend-item.leg-no-election-r, .legend-pill.noel-d, .legend-pill.noel-r){
    min-height:1.76rem !important;
    padding:.33rem .62rem !important;
  }
}

/* 2026-06-25 homepage pill unification: legends, inline ratings, changelog pills, and arc tooltips use one sizing system. */
body.cmep-home-page{
  --home-pill-h:1.72rem;
  --home-pill-h-lg:1.84rem;
  --home-pill-px:.68rem;
  --home-pill-px-lg:.72rem;
  --home-pill-fs:.72rem;
  --home-pill-lh:1;
  --home-pill-weight:850;
}
body.cmep-home-page :where(
  #cmep-senate-arc-native .legend-item,
  #cmep-house-arc-native .legend-item,
  #cmep-senate-arc-native .legend-pill,
  #cmep-house-arc-native .legend-pill,
  .seat-road-legend .legend-pill,
  .legend .legend-item,
  .cl-pill,
  .ct-chip,
  .rating-pill,
  .race-rating-pill,
  .pill.solid-D,
  .pill.likely-D,
  .pill.lean-D,
  .pill.toss-up,
  .pill.lean-R,
  .pill.likely-R,
  .pill.solid-R,
  .pill.noel-d,
  .pill.noel-r,
  .pill.no-election,
  .pill[class*="solid-"],
  .pill[class*="likely-"],
  .pill[class*="lean-"],
  .pill[class*="toss"]
){
  box-sizing:border-box !important;
  display:inline-flex !important;
  align-items:center !important;
  justify-content:center !important;
  min-height:var(--home-pill-h) !important;
  padding:.39rem var(--home-pill-px) !important;
  border-radius:999px !important;
  font-size:var(--home-pill-fs) !important;
  line-height:var(--home-pill-lh) !important;
  font-weight:var(--home-pill-weight) !important;
  letter-spacing:.01em !important;
  white-space:nowrap !important;
  box-shadow:none !important;
}
body.cmep-home-page :where(
  #cmep-senate-arc-native .legend-item.leg-no-election-d,
  #cmep-senate-arc-native .legend-item.leg-no-election-r,
  #cmep-house-arc-native .legend-item.leg-no-election-d,
  #cmep-house-arc-native .legend-item.leg-no-election-r,
  #cmep-senate-arc-native .legend-pill.noel-d,
  #cmep-senate-arc-native .legend-pill.noel-r,
  #cmep-house-arc-native .legend-pill.noel-d,
  #cmep-house-arc-native .legend-pill.noel-r,
  .seat-road-legend .legend-pill.noel-d,
  .seat-road-legend .legend-pill.noel-r,
  #tooltip .ct-chip.no-election,
  #cmep-house-arc-tooltip .ct-chip.no-election,
  .cmep-site-tooltip .ct-chip.no-election,
  .pill.no-election,
  .pill.noel-d,
  .pill.noel-r
){
  min-height:var(--home-pill-h-lg) !important;
  padding:.38rem var(--home-pill-px-lg) !important;
  border-width:2px !important;
}
body.cmep-home-page :where(
  #tooltip .ct-chip,
  #cmep-house-arc-tooltip .ct-chip,
  .cmep-site-tooltip .ct-chip,
  .chart-tooltip .pill,
  .chart-tooltip .rating-pill
){
  min-width:auto !important;
  width:auto !important;
  max-width:100% !important;
  margin:0 !important;
}
body.cmep-home-page :where(
  #cmep-senate-arc-native .legend-item.majority-pill,
  #cmep-senate-arc-native .legend-item.leg-majority,
  #cmep-house-arc-native .legend-item.majority-pill,
  #cmep-house-arc-native .legend-item.leg-majority,
  #cmep-senate-arc-native .legend-pill.majority-pill,
  #cmep-house-arc-native .legend-pill.majority-pill,
  .majority-pill
){
  min-height:var(--home-pill-h) !important;
  padding:.37rem var(--home-pill-px-lg) !important;
  gap:.34rem !important;
  font-size:var(--home-pill-fs) !important;
  line-height:var(--home-pill-lh) !important;
}
body.cmep-home-page :where(
  #cmep-senate-arc-native .legend-item.majority-pill .ring,
  #cmep-senate-arc-native .legend-item.leg-majority .ring,
  #cmep-house-arc-native .legend-item.majority-pill .ring,
  #cmep-house-arc-native .legend-item.leg-majority .ring,
  #cmep-senate-arc-native .legend-pill.majority-pill .ring,
  #cmep-house-arc-native .legend-pill.majority-pill .ring,
  .majority-pill .ring
){
  flex:0 0 auto !important;
  width:.72rem !important;
  height:.72rem !important;
  border-width:2px !important;
}
@media (max-width:720px){
  body.cmep-home-page{
    --home-pill-h:1.64rem;
    --home-pill-h-lg:1.76rem;
    --home-pill-px:.58rem;
    --home-pill-px-lg:.62rem;
    --home-pill-fs:.68rem;
  }
}

/* 2026-06-25 homepage path-control cleanup.
   Keep the path-to-majority controls party-colored, and prevent inactive
   path explainer/banner containers from leaving a faint ghost bar. */
body.cmep-home-page :where(#cmep-senate-arc-native, #cmep-house-arc-native) .path-button.path-dem{
  background:var(--solid-d, #2563eb) !important;
  border-color:rgba(255,255,255,.92) !important;
  color:#fff !important;
}
body.cmep-home-page :where(#cmep-senate-arc-native, #cmep-house-arc-native) .path-button.path-gop{
  background:var(--solid-r, #dc2626) !important;
  border-color:rgba(255,255,255,.92) !important;
  color:#fff !important;
}
body.cmep-home-page :where(#cmep-senate-arc-native, #cmep-house-arc-native) .path-button.path-dem.active{
  background:color-mix(in srgb, var(--solid-d, #2563eb) 14%, transparent) !important;
  border-color:var(--solid-d, #2563eb) !important;
  color:var(--solid-d, #2563eb) !important;
}
body.cmep-home-page :where(#cmep-senate-arc-native, #cmep-house-arc-native) .path-button.path-gop.active{
  background:color-mix(in srgb, var(--solid-r, #dc2626) 14%, transparent) !important;
  border-color:var(--solid-r, #dc2626) !important;
  color:var(--solid-r, #dc2626) !important;
}
@supports not (background: color-mix(in srgb, red 10%, transparent)){
  body.cmep-home-page :where(#cmep-senate-arc-native, #cmep-house-arc-native) .path-button.path-dem.active{ background:rgba(37,99,235,.12) !important; }
  body.cmep-home-page :where(#cmep-senate-arc-native, #cmep-house-arc-native) .path-button.path-gop.active{ background:rgba(220,38,38,.12) !important; }
}
body.cmep-home-page :where(#cmep-senate-arc-native, #cmep-house-arc-native) :where(.path-explainer:empty, .path-banner:empty){
  display:none !important;
  min-height:0 !important;
  height:0 !important;
  margin:0 !important;
  padding:0 !important;
  border:0 !important;
  background:transparent !important;
  box-shadow:none !important;
}
body.cmep-home-page :where(#cmep-senate-arc-native, #cmep-house-arc-native) .path-banner:not(:empty){
  display:flex !important;
}
body.cmep-home-page :where(#cmep-senate-arc-native, #cmep-house-arc-native) .path-explainer:not(:empty){
  display:block !important;
}
/* Majority Maker belongs in the arc legend/path state, not the seat-road bar legend. */
body.cmep-home-page .seat-road-legend .legend-pill.majority-pill{
  display:none !important;
}

/* 2026-06-25 — final homepage hero/header alignment.
   Keep the homepage hero/card as wide as the Senate + House card grid, and let the
   injected global header match the Election Night pages instead of using the older
   capsule nav treatment from the first homepage pass. */
body.cmep-home-page .home-top-container{
  width:min(100%,var(--home-shell)) !important;
  max-width:var(--home-shell) !important;
}
body.cmep-home-page .home-hero{
  width:100% !important;
  max-width:none !important;
  margin-left:0 !important;
  margin-right:0 !important;
}
body.cmep-home-page .home-lede{
  max-width:860px !important;
}

body.cmep-home-page .cm-header,
body.cmep-home-page .cm-header header,
body.cmep-home-page header.cm-header,
body.cmep-home-page #cm-header{
  position:sticky !important;
  top:0 !important;
  background:var(--home-surface) !important;
  border-bottom:1px solid var(--home-border) !important;
  box-shadow:none !important;
  color:var(--home-text) !important;
}
@media (prefers-color-scheme:dark){
  html:not([data-theme="light"]):not(.light) body.cmep-home-page:not(.light):not(.light-mode) .cm-header,
  html:not([data-theme="light"]):not(.light) body.cmep-home-page:not(.light):not(.light-mode) .cm-header header,
  html:not([data-theme="light"]):not(.light) body.cmep-home-page:not(.light):not(.light-mode) header.cm-header,
  html:not([data-theme="light"]):not(.light) body.cmep-home-page:not(.light):not(.light-mode) #cm-header{
    background:var(--home-surface) !important;
    border-bottom-color:var(--home-border) !important;
  }
}
html[data-theme="dark"] body.cmep-home-page .cm-header,
html.dark body.cmep-home-page .cm-header,
body.cmep-home-page.dark .cm-header,
body.cmep-home-page.dark-mode .cm-header,
html[data-theme="dark"] body.cmep-home-page #cm-header,
html.dark body.cmep-home-page #cm-header,
body.cmep-home-page.dark #cm-header,
body.cmep-home-page.dark-mode #cm-header{
  background:var(--home-surface) !important;
  border-bottom-color:var(--home-border) !important;
}
body.cmep-home-page .header-inner{
  max-width:1150px !important;
  padding:.8rem 1rem 1rem !important;
  gap:.55rem !important;
}
body.cmep-home-page #cm-nav{
  background:transparent !important;
  border:0 !important;
  box-shadow:none !important;
  padding:0 !important;
  gap:.45rem !important;
}
body.cmep-home-page #cm-nav a{
  background:transparent !important;
  color:var(--home-muted) !important;
  border:0 !important;
  border-radius:999px !important;
  padding:.42rem .85rem !important;
  font-size:.92rem !important;
  line-height:1.1 !important;
  font-weight:800 !important;
  box-shadow:none !important;
}
body.cmep-home-page #cm-nav a:hover,
body.cmep-home-page #cm-nav a.active,
body.cmep-home-page #cm-nav a.is-active,
body.cmep-home-page #cm-nav a.selected,
body.cmep-home-page #cm-nav a.current,
body.cmep-home-page #cm-nav a[aria-current="page"]{
  background:var(--home-surface-3) !important;
  color:var(--home-strong) !important;
  box-shadow:none !important;
}
@media (max-width:760px){
  body.cmep-home-page .header-inner{
    padding:.58rem .45rem .72rem !important;
    gap:.42rem !important;
  }
  body.cmep-home-page #cm-nav{
    gap:.22rem !important;
  }
  body.cmep-home-page #cm-nav a{
    padding:.38rem .58rem !important;
    font-size:.82rem !important;
  }
}

/* 2026-06-28 mobile width utilization pass
   Match the tighter Election Night mobile gutters: page shell uses the viewport,
   while cards retain enough internal padding to avoid edge collision. */
@media (max-width:720px){
  body.cmep-home-page .home-main,
  body.cmep-home-page .container,
  body.cmep-home-page .home-top-container,
  body.cmep-home-page #changelog-section{
    width:100% !important;
    max-width:100% !important;
    margin-inline:0 !important;
    padding-left:max(6px, env(safe-area-inset-left)) !important;
    padding-right:max(6px, env(safe-area-inset-right)) !important;
  }
  body.cmep-home-page .home-top-container{padding-bottom:0 !important;}
  body.cmep-home-page .home-hero,
  body.cmep-home-page .cm-card{
    width:100% !important;
    max-width:100% !important;
    margin-left:0 !important;
    margin-right:0 !important;
  }
  body.cmep-home-page .home-hero{
    padding:18px 12px !important;
    border-radius:20px !important;
  }
  body.cmep-home-page .cm-card{
    padding:10px !important;
    border-radius:16px !important;
  }
  body.cmep-home-page .forecast-grid{gap:8px !important;}
  body.cmep-home-page :where(#cmep-senate-arc-native,#cmep-house-arc-native) :where(.arc-wrap){
    padding-left:0 !important;
    padding-right:0 !important;
  }
}
@media (max-width:390px){
  body.cmep-home-page .container,
  body.cmep-home-page .home-top-container,
  body.cmep-home-page #changelog-section{
    padding-left:max(5px, env(safe-area-inset-left)) !important;
    padding-right:max(5px, env(safe-area-inset-right)) !important;
  }
  body.cmep-home-page .cm-card{padding:9px !important;}
}


/* 2026-06-28 homepage mobile viewport-width correction
   The homepage has a different shell than the forecast/election-night pages.
   Put the tiny phone gutter on the main element, then let the child containers/cards
   consume the full remaining width so the page matches the Election Night mobile feel. */
@media (max-width:760px){
  html body.cmep-home-page{
    overflow-x:hidden !important;
  }
  html body.cmep-home-page main.home-main{
    width:100vw !important;
    max-width:100vw !important;
    margin:0 !important;
    padding-left:max(5px, env(safe-area-inset-left)) !important;
    padding-right:max(5px, env(safe-area-inset-right)) !important;
    box-sizing:border-box !important;
  }
  html body.cmep-home-page main.home-main > .container,
  html body.cmep-home-page main.home-main > .home-top-container,
  html body.cmep-home-page main.home-main > #changelog-section{
    width:100% !important;
    max-width:none !important;
    margin-left:0 !important;
    margin-right:0 !important;
    padding-left:0 !important;
    padding-right:0 !important;
    box-sizing:border-box !important;
  }
  html body.cmep-home-page .forecast-grid{
    width:100% !important;
    max-width:100% !important;
    margin-left:0 !important;
    margin-right:0 !important;
    gap:8px !important;
    grid-template-columns:minmax(0,1fr) !important;
  }
  html body.cmep-home-page .home-hero,
  html body.cmep-home-page .forecast-grid > .cm-card,
  html body.cmep-home-page #changelog-section > .cm-card,
  html body.cmep-home-page .cm-card{
    width:100% !important;
    max-width:100% !important;
    min-width:0 !important;
    margin-left:0 !important;
    margin-right:0 !important;
    box-sizing:border-box !important;
  }
  html body.cmep-home-page .home-hero{
    padding-left:12px !important;
    padding-right:12px !important;
  }
  html body.cmep-home-page .cm-card{
    padding-left:10px !important;
    padding-right:10px !important;
  }
}
@media (max-width:390px){
  html body.cmep-home-page main.home-main{
    padding-left:max(4px, env(safe-area-inset-left)) !important;
    padding-right:max(4px, env(safe-area-inset-right)) !important;
  }
  html body.cmep-home-page .cm-card{
    padding-left:9px !important;
    padding-right:9px !important;
  }
}

/* 2026-06-28 — homepage mobile width parity + injected-header parity.
   The hero looked wider than the Senate/House cards because older homepage/widget
   shell rules and mobile section padding were still affecting the forecast grid.
   This makes the homepage hero and forecast cards share the same mobile width. */
@media (max-width:760px){
  html body.cmep-home-page,
  html body.cmep-home-page *{
    box-sizing:border-box !important;
  }
  html body.cmep-home-page #cm-header{
    position:sticky !important;
    top:0 !important;
    z-index:10000 !important;
  }
  html body.cmep-home-page #cm-header > .cm-header{
    position:relative !important;
    top:auto !important;
    z-index:auto !important;
  }
  html body.cmep-home-page main.home-main{
    width:100% !important;
    max-width:100% !important;
    padding-left:max(5px, env(safe-area-inset-left)) !important;
    padding-right:max(5px, env(safe-area-inset-right)) !important;
  }
  html body.cmep-home-page main.home-main > .container.home-top-container{
    display:block !important;
    width:100% !important;
    max-width:100% !important;
    margin:0 !important;
    padding-left:0 !important;
    padding-right:0 !important;
  }
  html body.cmep-home-page .home-top-container > .home-hero,
  html body.cmep-home-page .home-top-container > .forecast-grid,
  html body.cmep-home-page .home-top-container > .forecast-grid > .cm-card{
    width:100% !important;
    max-width:100% !important;
    min-width:0 !important;
    margin-left:0 !important;
    margin-right:0 !important;
    justify-self:stretch !important;
  }
  html body.cmep-home-page .home-top-container > .forecast-grid{
    display:grid !important;
    grid-template-columns:minmax(0, 1fr) !important;
    gap:8px !important;
    padding:0 !important;
  }
  html body.cmep-home-page .home-top-container > .forecast-grid > .cm-card{
    padding:10px !important;
    border-radius:16px !important;
  }
  html body.cmep-home-page .home-top-container > .forecast-grid > .cm-card > section,
  html body.cmep-home-page .home-top-container > .forecast-grid > .cm-card section{
    padding-left:0 !important;
    padding-right:0 !important;
  }
}
@media (max-width:390px){
  html body.cmep-home-page main.home-main{
    padding-left:max(4px, env(safe-area-inset-left)) !important;
    padding-right:max(4px, env(safe-area-inset-right)) !important;
  }
  html body.cmep-home-page .home-top-container > .forecast-grid > .cm-card{
    padding-left:9px !important;
    padding-right:9px !important;
  }
}


/* 2026-06-28 — homepage mobile typography/wrapping parity with House/Senate pages. */
body.cmep-home-page .forecast-grid > .cm-card > section > h2{
  display:block !important;
  width:100% !important;
  margin:0 0 10px !important;
  color:var(--home-strong) !important;
  font-size:clamp(1.25rem, 2.4vw, 1.6rem) !important;
  line-height:1.08 !important;
  font-weight:950 !important;
  letter-spacing:-.035em !important;
  text-align:center !important;
}
body.cmep-home-page .forecast-grid > .cm-card > section{
  width:100% !important;
  max-width:100% !important;
  min-width:0 !important;
}
body.cmep-home-page :where(#cmep-senate-arc-native,#cmep-house-arc-native) #path-controls,
body.cmep-home-page #cmep-house-arc-native #cmep-house-arc-path-controls{
  width:100% !important;
  max-width:100% !important;
  min-width:0 !important;
  left:0 !important;
  right:0 !important;
  transform:none !important;
  justify-content:center !important;
}
body.cmep-home-page :where(#cmep-senate-arc-native,#cmep-house-arc-native) .path-button span.label{
  display:block !important;
  width:100% !important;
  white-space:normal !important;
  overflow-wrap:normal !important;
  word-break:normal !important;
  hyphens:none !important;
  text-align:center !important;
  line-height:1.05 !important;
}
body.cmep-home-page #changelog-section .cl-card,
body.cmep-home-page #changelog-section .cl-entry{
  min-width:0 !important;
}
body.cmep-home-page #changelog-section .cl-race-info{
  min-width:0 !important;
}
body.cmep-home-page #changelog-section .cl-race-name,
body.cmep-home-page #changelog-section .cl-race-sub{
  white-space:normal !important;
  overflow:visible !important;
  text-overflow:clip !important;
  overflow-wrap:anywhere !important;
  word-break:normal !important;
  line-height:1.16 !important;
}
body.cmep-home-page #changelog-section .cl-pills{
  min-width:0 !important;
  flex-wrap:wrap !important;
  justify-content:flex-end !important;
  row-gap:4px !important;
}
@media (max-width:760px){
  html body.cmep-home-page .home-top-container > .forecast-grid,
  html body.cmep-home-page .forecast-grid{
    width:100% !important;
    max-width:100% !important;
    min-width:0 !important;
    padding:0 !important;
    margin:8px 0 0 !important;
    display:grid !important;
    grid-template-columns:minmax(0, 1fr) !important;
    align-items:stretch !important;
  }
  html body.cmep-home-page .home-top-container > .forecast-grid > .cm-card,
  html body.cmep-home-page .forecast-grid > .cm-card{
    width:100% !important;
    max-width:100% !important;
    min-width:0 !important;
    margin-left:0 !important;
    margin-right:0 !important;
    justify-self:stretch !important;
  }
  body.cmep-home-page .forecast-grid > .cm-card > section > h2{
    font-size:1.28rem !important;
    text-align:center !important;
    margin-bottom:8px !important;
  }
  body.cmep-home-page :where(#cmep-senate-arc-native,#cmep-house-arc-native) :where(#path-controls,#cmep-house-arc-path-controls){
    display:flex !important;
    flex-direction:row !important;
    justify-content:center !important;
    align-items:center !important;
    gap:16px !important;
    padding:0 !important;
  }
  body.cmep-home-page :where(#cmep-senate-arc-native,#cmep-house-arc-native) .path-button{
    width:96px !important;
    height:96px !important;
    flex:0 0 96px !important;
    max-width:96px !important;
    min-width:0 !important;
    padding:.58rem !important;
    font-size:.8rem !important;
    line-height:1.05 !important;
    white-space:normal !important;
    text-align:center !important;
  }
  body.cmep-home-page :where(#cmep-senate-arc-native,#cmep-house-arc-native) .mobile-path-majority.show{
    display:block !important;
    width:100% !important;
    max-width:100% !important;
    min-width:0 !important;
    overflow:visible !important;
    margin-top:14px !important;
    padding-top:6px !important;
    padding-bottom:4px !important;
  }
  body.cmep-home-page :where(#cmep-senate-arc-native,#cmep-house-arc-native) .mobile-path-dots{
    display:flex !important;
    align-items:center !important;
    justify-content:center !important;
    gap:9px !important;
    margin:0 0 12px !important;
    padding:8px 14px 12px !important;
    min-height:44px !important;
    overflow:visible !important;
  }
  body.cmep-home-page :where(#cmep-senate-arc-native,#cmep-house-arc-native) .mobile-path-cards{
    display:flex !important;
    flex-direction:row !important;
    flex-wrap:nowrap !important;
    gap:12px !important;
    width:100% !important;
    max-width:100% !important;
    min-width:0 !important;
    overflow-x:auto !important;
    overflow-y:visible !important;
    scroll-snap-type:x mandatory !important;
    -webkit-overflow-scrolling:touch !important;
    padding:14px 12px 18px !important;
    scrollbar-width:none !important;
  }
  body.cmep-home-page :where(#cmep-senate-arc-native,#cmep-house-arc-native) .mobile-path-cards::-webkit-scrollbar{display:none !important;}
  body.cmep-home-page :where(#cmep-senate-arc-native,#cmep-house-arc-native) .mobile-path-card{
    flex:0 0 min(320px, calc(100vw - 32px)) !important;
    width:min(320px, calc(100vw - 32px)) !important;
    max-width:calc(100vw - 32px) !important;
    min-width:0 !important;
    scroll-snap-align:center !important;
    display:block !important;
    padding:.72rem .82rem !important;
    border-radius:20px !important;
    overflow:hidden !important;
  }
  body.cmep-home-page :where(#cmep-senate-arc-native,#cmep-house-arc-native) .mobile-path-card :where(.ct-head,.ct-name,.ct-left,.ct-right,.ct-pct){
    white-space:normal !important;
    overflow:visible !important;
    text-overflow:clip !important;
    overflow-wrap:anywhere !important;
    line-height:1.16 !important;
  }
  body.cmep-home-page :where(#cmep-senate-arc-native,#cmep-house-arc-native) .mobile-path-card .ct-row{
    display:flex !important;
    align-items:center !important;
    justify-content:space-between !important;
    gap:.8rem !important;
    min-width:0 !important;
  }
  body.cmep-home-page #changelog-section .cl-card,
  body.cmep-home-page #changelog-section .cl-entry{
    align-items:flex-start !important;
    gap:9px !important;
    padding:10px 11px !important;
  }
  body.cmep-home-page #changelog-section .cl-pills{
    max-width:48% !important;
  }
}
@media (max-width:420px){
  body.cmep-home-page :where(#cmep-senate-arc-native,#cmep-house-arc-native) .path-button{
    width:84px !important;
    height:84px !important;
    flex-basis:84px !important;
    max-width:84px !important;
    font-size:.75rem !important;
    padding:.48rem !important;
  }
  body.cmep-home-page #changelog-section .cl-card,
  body.cmep-home-page #changelog-section .cl-entry{
    display:grid !important;
    grid-template-columns:auto minmax(0, 1fr) !important;
  }
  body.cmep-home-page #changelog-section .cl-pills{
    grid-column:2 !important;
    max-width:100% !important;
    justify-content:flex-start !important;
    margin-top:2px !important;
  }
}

/* 2026-06-28 final: keep homepage changelog menus centered on mobile too. */
body.cmep-home-page #changelog-section .changelog-controls,
body.cmep-home-page #changelog-section .changelog-controls[style]{
  display:flex !important;
  justify-content:center !important;
  align-items:center !important;
  width:100% !important;
  margin-left:auto !important;
  margin-right:auto !important;
  text-align:center !important;
}
body.cmep-home-page #changelog-section .changelog-seg{
  margin-left:auto !important;
  margin-right:auto !important;
  justify-content:center !important;
}
@media (max-width:720px){
  body.cmep-home-page #changelog-section .changelog-controls,
  body.cmep-home-page #changelog-section .changelog-controls[style]{
    justify-content:center !important;
    overflow-x:visible !important;
    padding-left:0 !important;
    padding-right:0 !important;
  }
  body.cmep-home-page #changelog-section .changelog-seg{
    flex-wrap:wrap !important;
    justify-content:center !important;
    max-width:100% !important;
  }
}


/* 2026-07-04: homepage mobile Path to Majority dot parity with House/Senate pages.
   Legacy homepage button rules could wash out the active mobile dots; keep both
   Senate and House homepage path dots filled with their rating color. */
@media (max-width:820px), (hover:none), (pointer:coarse){
  body.cmep-home-page :where(#cmep-senate-arc-native,#cmep-house-arc-native) .mobile-path-dot{
    opacity:1 !important;
    background:var(--dot-color, #929292) !important;
    border-color:var(--dot-color, #929292) !important;
    box-shadow:0 0 0 2px color-mix(in srgb, var(--dot-color, #929292) 22%, transparent), 0 6px 16px rgba(15,23,42,.14) !important;
  }
  body.cmep-home-page :where(#cmep-senate-arc-native,#cmep-house-arc-native) .mobile-path-dot:not(.active){
    background:color-mix(in srgb, var(--dot-color, #929292) 58%, transparent) !important;
    border-color:var(--dot-color, #929292) !important;
  }
  body.cmep-home-page :where(#cmep-senate-arc-native,#cmep-house-arc-native) .mobile-path-dot.active{
    background:var(--dot-color, #929292) !important;
    border-color:var(--dot-color, #929292) !important;
    transform:translateY(-2px) scale(1.14) !important;
    box-shadow:0 0 0 3px color-mix(in srgb, var(--dot-color, #929292) 26%, transparent), 0 10px 22px rgba(15,23,42,.18) !important;
  }
  body.cmep-home-page :where(#cmep-senate-arc-native,#cmep-house-arc-native) .mobile-path-dot.majority-maker,
  body.cmep-home-page :where(#cmep-senate-arc-native,#cmep-house-arc-native) .mobile-path-dot.majority-maker.active{
    border-color:var(--flip-gold, #F6CE46) !important;
    box-shadow:0 0 0 3px rgba(246,206,70,.24), 0 10px 22px rgba(15,23,42,.18) !important;
  }
}

/* 2026-07-26: give tablet Path cards the same swipe carousel as mobile.
   This intentionally overrides the site-wide stacked-card fallback. */
@media (max-width:1180px){
  html body.cmep-home-page.cmep-enhanced :where(#cmep-senate-arc-native,#cmep-house-arc-native) .mobile-path-cards{
    display:flex !important;
    flex-direction:row !important;
    flex-wrap:nowrap !important;
    gap:12px !important;
    width:100% !important;
    max-width:100% !important;
    min-width:0 !important;
    overflow-x:auto !important;
    overflow-y:hidden !important;
    overscroll-behavior-x:contain !important;
    scroll-snap-type:x mandatory !important;
    scroll-padding-inline:12px !important;
    -webkit-overflow-scrolling:touch !important;
    padding:14px 12px 18px !important;
    scrollbar-width:none !important;
    box-sizing:border-box !important;
  }

  html body.cmep-home-page.cmep-enhanced :where(#cmep-senate-arc-native,#cmep-house-arc-native) .mobile-path-cards::-webkit-scrollbar{
    display:none !important;
  }

  html body.cmep-home-page.cmep-enhanced :where(#cmep-senate-arc-native,#cmep-house-arc-native) .mobile-path-card{
    flex:0 0 min(360px, calc(100vw - 32px)) !important;
    width:min(360px, calc(100vw - 32px)) !important;
    max-width:calc(100vw - 32px) !important;
    min-width:0 !important;
    scroll-snap-align:center !important;
  }
}

/* 2026-07-04 safe patch: mobile Path-to-Majority dot clipping fix.
   Keep the homepage path dots consistent with House/Senate while giving the
   active dot/majority-maker ring enough vertical paint room inside homepage cards. */
@media (max-width:820px), (hover:none), (pointer:coarse){
  body.cmep-home-page :where(#cmep-senate-arc-native,#cmep-house-arc-native),
  body.cmep-home-page :where(#cmep-senate-arc-native,#cmep-house-arc-native) :where(.arc-wrap,.mobile-path-majority,.mobile-path-majority.show,.mobile-path-dots){
    overflow:visible !important;
  }
  body.cmep-home-page .forecast-grid > .cm-card{
    overflow:visible !important;
  }
  body.cmep-home-page :where(#cmep-senate-arc-native,#cmep-house-arc-native) .mobile-path-majority,
  body.cmep-home-page :where(#cmep-senate-arc-native,#cmep-house-arc-native) .mobile-path-majority.show{
    padding-top:10px !important;
    padding-bottom:6px !important;
  }
  body.cmep-home-page :where(#cmep-senate-arc-native,#cmep-house-arc-native) .mobile-path-dots{
    align-items:flex-end !important;
    min-height:48px !important;
    margin:0 0 14px !important;
    padding:12px 12px 12px !important;
  }
  body.cmep-home-page :where(#cmep-senate-arc-native,#cmep-house-arc-native) .mobile-path-dot.active{
    transform:translateY(-2px) scale(1.12) !important;
    transform-origin:center center !important;
  }
}

/* 2026-07-04 v5: root homepage Path dot visual parity.
   The root page loads homepage-only CSS after the Senate/House arc CSS. These
   final selectors restore the exact Senate/House active-dot treatment while
   preserving only the extra paint room needed to avoid clipping inside the
   homepage cards. */
@media (max-width:820px), (hover:none), (pointer:coarse){
  body.cmep-home-page #cmep-senate-arc-native,
  body.cmep-home-page #cmep-house-arc-native,
  body.cmep-home-page #cmep-senate-arc-native .arc-wrap,
  body.cmep-home-page #cmep-house-arc-native .arc-wrap,
  body.cmep-home-page #cmep-senate-arc-native .mobile-path-majority,
  body.cmep-home-page #cmep-house-arc-native .mobile-path-majority,
  body.cmep-home-page #cmep-senate-arc-native .mobile-path-dots,
  body.cmep-home-page #cmep-house-arc-native .mobile-path-dots{
    overflow:visible !important;
  }

  body.cmep-home-page #cmep-senate-arc-native .mobile-path-majority.show,
  body.cmep-home-page #cmep-house-arc-native .mobile-path-majority.show{
    padding-top:.45rem !important;
    padding-bottom:.15rem !important;
  }

  body.cmep-home-page #cmep-senate-arc-native .mobile-path-dots{
    display:flex !important;
    align-items:flex-end !important;
    justify-content:center !important;
    gap:10px !important;
    margin:0 0 14px !important;
    padding:8px 8px 8px !important;
    min-height:32px !important;
    max-width:100% !important;
    overflow-x:auto !important;
    overflow-y:visible !important;
    scrollbar-width:none !important;
    box-sizing:border-box !important;
  }

  body.cmep-home-page #cmep-house-arc-native .mobile-path-dots{
    display:flex !important;
    align-items:flex-end !important;
    justify-content:center !important;
    gap:9px !important;
    margin:0 0 14px !important;
    padding:8px 8px 8px !important;
    min-height:30px !important;
    max-width:100% !important;
    overflow-x:auto !important;
    overflow-y:visible !important;
    scrollbar-width:none !important;
    box-sizing:border-box !important;
  }

  body.cmep-home-page #cmep-senate-arc-native .mobile-path-dots::-webkit-scrollbar,
  body.cmep-home-page #cmep-house-arc-native .mobile-path-dots::-webkit-scrollbar{
    display:none !important;
  }

  body.cmep-home-page #cmep-senate-arc-native .mobile-path-dot,
  body.cmep-home-page #cmep-house-arc-native .mobile-path-dot{
    opacity:1 !important;
    min-width:0 !important;
    min-height:0 !important;
    max-width:none !important;
    max-height:none !important;
    padding:0 !important;
    line-height:0 !important;
    flex:0 0 auto !important;
    border-radius:999px !important;
    border:2px solid color-mix(in srgb, var(--dot-color, rgba(148,163,184,0.45)) 80%, rgba(255,255,255,0.18)) !important;
    background:color-mix(in srgb, var(--dot-color, rgba(148,163,184,0.28)) 34%, transparent) !important;
    box-shadow:0 6px 16px rgba(15,23,42,0.12) !important;
    transform:none !important;
    transition:transform var(--transition-med), box-shadow var(--transition-med), border-color var(--transition-med), background-color var(--transition-med) !important;
  }

  body.cmep-home-page #cmep-senate-arc-native .mobile-path-dot.active,
  body.cmep-home-page #cmep-house-arc-native .mobile-path-dot.active{
    transform:translateY(-2px) scale(1.12) !important;
    background:var(--dot-color, rgba(148,163,184,0.45)) !important;
    border-color:var(--dot-color, rgba(148,163,184,0.45)) !important;
    box-shadow:0 10px 22px rgba(15,23,42,0.18) !important;
    transform-origin:center center !important;
  }

  body.cmep-home-page #cmep-senate-arc-native .mobile-path-dot.majority-maker,
  body.cmep-home-page #cmep-house-arc-native .mobile-path-dot.majority-maker{
    border-color:var(--flip-gold, #F6CE46) !important;
  }

  body.cmep-home-page #cmep-senate-arc-native .mobile-path-dot.majority-maker.active,
  body.cmep-home-page #cmep-house-arc-native .mobile-path-dot.majority-maker.active{
    box-shadow:0 0 0 3px rgba(246,206,70,0.22), 0 10px 22px rgba(15,23,42,0.18) !important;
  }
}
