/* Shared compact detail header for live-results and prediction pages. */
body.en-primary-detail .page-head{
  margin-top:clamp(.35rem,.8vw,.65rem) !important;
  margin-bottom:clamp(.7rem,1.25vw,1rem) !important;
}

body.en-primary-detail .page-head > .state-hero{
  gap:.22rem !important;
  padding:clamp(.72rem,1.15vw,1rem) clamp(.9rem,1.5vw,1.25rem) !important;
}

body.en-primary-detail .page-head .state-outline-wrap{
  width:min(360px,72vw) !important;
  height:clamp(78px,8.5vw,112px) !important;
  margin-top:0 !important;
  margin-bottom:0 !important;
}

body.en-primary-detail .page-head .state-prefix{
  margin-top:0 !important;
  font-size:.72rem !important;
}

body.en-primary-detail .page-head .state-name{
  font-size:clamp(2rem,3.65vw,4rem) !important;
  line-height:.98 !important;
}

body.en-primary-detail .page-head .state-subtitle{
  margin:.08rem 0 .12rem !important;
}

body.en-primary-detail .page-head .page-actions{
  gap:.42rem !important;
}

body.en-primary-detail .page-head .page-actions[style]{
  margin-top:.34rem !important;
}

body.en-primary-detail #globalWinnerBanner{
  margin-bottom:clamp(.72rem,1.2vw,1rem) !important;
}

body.en-primary-detail #globalWinnerBanner .winner-banner,
body.en-primary-detail .winner-banner{
  min-height:clamp(5rem,6.2vw,6.25rem) !important;
  gap:clamp(.7rem,1.2vw,1rem) !important;
  padding:clamp(.72rem,1.15vw,1rem) clamp(.9rem,1.6vw,1.3rem) !important;
}

body.en-primary-detail #globalWinnerBanner .winner-banner-icon,
body.en-primary-detail .winner-banner .winner-banner-icon{
  width:clamp(2.85rem,4vw,3.75rem) !important;
  height:clamp(2.85rem,4vw,3.75rem) !important;
}

@media (max-width:760px){
  body.en-primary-detail .page-head > .state-hero{
    padding:.72rem .68rem !important;
  }

  body.en-primary-detail .page-head .state-outline-wrap{
    width:min(270px,68vw) !important;
    height:82px !important;
  }

  body.en-primary-detail .page-head .state-name{
    font-size:clamp(1.95rem,10.5vw,2.85rem) !important;
  }

  body.en-primary-detail .page-head .state-subtitle{
    font-size:.88rem !important;
  }

  body.en-primary-detail #globalWinnerBanner .winner-banner,
  body.en-primary-detail .winner-banner{
    min-height:5rem !important;
    padding:.72rem .82rem !important;
  }

  body.cmep-state-detail-page .page-head .page-actions.no-party-selector{
    display:grid !important;
    grid-template-columns:minmax(0,1fr) minmax(0,1fr) !important;
    align-items:center !important;
    gap:.48rem !important;
  }

  body.cmep-state-detail-page .page-head .page-actions.no-party-selector > .back-btn{
    width:100% !important;
    margin:0 !important;
  }

  body.cmep-page-house-district-detail-static .page-head .page-actions{
    display:grid !important;
    grid-template-columns:minmax(0,1fr) minmax(0,1fr) !important;
    gap:.48rem !important;
  }

  body.cmep-page-house-district-detail-static .page-head .page-actions > .back-btn{
    width:100% !important;
    margin:0 !important;
  }

  body.cmep-page-house-district-detail-static .page-head #backBtn{
    grid-column:1 !important;
    grid-row:1 !important;
  }

  body.cmep-page-house-district-detail-static .page-head #votingBtn{
    grid-column:2 !important;
    grid-row:1 !important;
  }

}

/* Prediction detail parity: keep state and House district top matter on one
   shared geometry contract instead of allowing their legacy adapters to drift. */
html body:is(.cmep-state-detail-page,.cmep-page-house-district-detail-static) > .container{
  box-sizing:border-box !important;
  width:min(1720px,calc(100vw - 48px)) !important;
  max-width:min(1500px,calc(100vw - 56px)) !important;
  padding-top:.45rem !important;
  padding-bottom:1.2rem !important;
}

html body:is(.cmep-state-detail-page,.cmep-page-house-district-detail-static) .page-head{
  margin-top:clamp(.35rem,.8vw,.65rem) !important;
  margin-bottom:clamp(.7rem,1.25vw,1rem) !important;
}

html body:is(.cmep-state-detail-page,.cmep-page-house-district-detail-static) .page-head > .state-hero{
  border-radius:clamp(18px,1.35vw,24px) !important;
}

html body:is(.cmep-state-detail-page,.cmep-page-house-district-detail-static) .page-head .state-subtitle{
  font-size:clamp(.94rem,1.25vw,1.05rem) !important;
  line-height:1.5 !important;
}

body.cmep-page-house-district-detail-static .page-head #topActions{
  width:min(100%,680px) !important;
  margin:.78rem auto 0 !important;
  display:grid !important;
  grid-template-columns:minmax(0,1fr) auto minmax(0,1fr) !important;
  grid-template-areas:"back spacer vote" !important;
  align-items:center !important;
  gap:.62rem .75rem !important;
}

body.cmep-page-house-district-detail-static .page-head #topActions #backBtn{
  grid-area:back !important;
  justify-self:start !important;
}

body.cmep-page-house-district-detail-static .page-head #topActions #votingBtn{
  grid-area:vote !important;
  justify-self:end !important;
}

body.cmep-page-house-district-detail-static .page-head #officeActions{
  width:min(100%,680px) !important;
  margin:.58rem auto 0 !important;
  display:flex !important;
  justify-content:center !important;
}

body.cmep-page-house-district-detail-static .page-head #officeActions .page-actions-center{
  width:auto !important;
  max-width:100% !important;
}

html body:is(.cmep-state-detail-page,.cmep-page-house-district-detail-static) .page-head #officeActions #officeToggle.segmented .seg-btn{
  display:block !important;
  font-size:.82rem !important;
}

@media (min-width:1200px){
  html body:is(.cmep-state-detail-page,.cmep-page-house-district-detail-static) > .container{
    max-width:min(1680px,calc(100vw - 64px)) !important;
  }
}

@media (max-width:760px){
  html body:is(.cmep-state-detail-page,.cmep-page-house-district-detail-static) > .container{
    width:100% !important;
    max-width:100% !important;
    padding-top:.75rem !important;
  }

  html body:is(.cmep-state-detail-page,.cmep-page-house-district-detail-static) .page-head > .state-hero{
    border-radius:20px !important;
  }

  body.cmep-page-house-district-detail-static .page-head #topActions{
    width:100% !important;
    grid-template-columns:minmax(0,1fr) minmax(0,1fr) !important;
    grid-template-areas:"back vote" !important;
    gap:.48rem !important;
  }

  body.cmep-page-house-district-detail-static .page-head #topActions > .back-btn{
    width:100% !important;
    margin:0 !important;
    justify-content:center !important;
  }

  body.cmep-page-house-district-detail-static .page-head #officeActions{
    width:100% !important;
    display:flex !important;
  }
}

@media (max-width:640px){
  body:is(.cmep-state-detail-page,.cmep-page-house-district-detail-static) .page-head #officeActions{
    width:100% !important;
    max-width:100% !important;
    display:block !important;
    padding-inline:0 !important;
  }

  body:is(.cmep-state-detail-page,.cmep-page-house-district-detail-static) .page-head #officeActions .page-actions-center{
    width:100% !important;
    max-width:none !important;
    display:block !important;
  }

  body:is(.cmep-state-detail-page,.cmep-page-house-district-detail-static) .page-head #officeToggle.segmented{
    width:100% !important;
    max-width:none !important;
    min-width:0 !important;
    margin-inline:0 !important;
    box-sizing:border-box !important;
    display:grid !important;
    grid-template-columns:repeat(6,minmax(0,1fr)) !important;
    column-gap:.42rem !important;
    row-gap:.42rem !important;
    justify-content:stretch !important;
    justify-items:stretch !important;
  }

  body:is(.cmep-state-detail-page,.cmep-page-house-district-detail-static) .page-head #officeToggle.segmented .seg-btn{
    display:flex !important;
    align-items:center !important;
    width:100% !important;
    max-width:none !important;
    min-width:0 !important;
    justify-content:center !important;
    text-align:center !important;
    white-space:nowrap !important;
    padding-inline:.45rem !important;
  }

  body:is(.cmep-state-detail-page,.cmep-page-house-district-detail-static) .page-head #officeToggle.segmented .seg-btn:nth-child(-n+3){
    grid-column:span 2 !important;
  }

  body:is(.cmep-state-detail-page,.cmep-page-house-district-detail-static) .page-head #officeToggle.segmented .seg-btn:nth-child(n+4){
    grid-column:span 3 !important;
  }
}

@media (max-width:390px){
  html body:is(.cmep-state-detail-page,.cmep-page-house-district-detail-static) .page-head #officeActions #officeToggle.segmented .seg-btn{
    font-size:.78rem !important;
    padding-inline:.32rem !important;
  }
}
