/* A clear, persistent shortcut to the official voter-verification page. */
html body .topbar .voter-header-action{
  display:inline-flex!important;
  flex:0 0 auto!important;
  align-items:center!important;
  justify-content:center!important;
  min-height:38px!important;
  padding:8px 12px!important;
  border:1px solid #172033!important;
  border-radius:9px!important;
  background:#172033!important;
  color:#fff!important;
  font-weight:800!important;
  text-decoration:none!important;
  box-shadow:0 3px 8px rgba(23,32,51,.18)!important;
}
html body .topbar .voter-header-action:hover,
html body .topbar .voter-header-action:focus-visible{
  background:#fff!important;
  color:#172033!important;
  border-color:#fff!important;
}
html body .topbar .voter-header-action[aria-current="page"]{
  background:#fff!important;
  color:#172033!important;
  border-color:#fff!important;
}
@media(min-width:801px){
  html body .topbar{grid-template-columns:180px minmax(0,1fr) auto 238px!important}
  html body .topbar .voter-header-action{justify-self:end!important}
}
/* Wide desktop presentation: spacious brand block, centred navigation, and
   clearly separated action controls — matching the full portal header. */
@media(min-width:1501px){
  html body .topbar{
    grid-template-columns:270px minmax(0,1fr) auto 286px!important;
    min-height:140px!important;
    height:140px!important;
    gap:18px!important;
    padding-left:5.7%!important;
    padding-right:5.7%!important;
  }
  html body .topbar .brand-logo{width:210px!important;height:124px!important;align-items:flex-start!important;justify-content:center!important}
  html body .topbar .brand-logo img{width:186px!important;height:77px!important;max-width:186px!important;object-fit:contain!important;object-position:left center!important}
  html body .topbar .brand-logo small{width:186px!important;max-width:186px!important;margin:0!important;padding:0!important;font-size:12px!important;line-height:1.2!important;letter-spacing:1.55px!important;text-align:left!important;white-space:nowrap!important}
  html body .topbar .portal-nav{justify-content:center!important;gap:clamp(14px,1.25vw,25px)!important;overflow:visible!important}
  html body .topbar .portal-nav a{font-size:clamp(13px,.95vw,16px)!important;padding:10px 0!important}
  html body .topbar .language-selector{width:286px!important}
  html body .topbar .language-selector select{height:56px!important;font-size:14px!important}
  html body .topbar .voter-header-action{min-height:54px!important;padding:11px 16px!important;font-size:15px!important}
}
/* Compact desktop header: keep the complete English navigation on one calm,
   uncluttered line alongside the voter action and language control. */
@media(min-width:801px) and (max-width:1500px){
  html body .topbar{
    grid-template-columns:128px minmax(0,1fr) auto 180px!important;
    grid-template-areas:"brand nav voter language"!important;
    min-height:72px!important;
    height:72px!important;
    gap:12px!important;
    padding-top:0!important;
    padding-bottom:0!important;
  }
  html body .topbar .brand-logo{
    display:flex!important;
    grid-area:brand!important;
    width:128px!important;
    min-width:0!important;
    height:66px!important;
    align-items:flex-start!important;
    justify-content:center!important;
  }
  html body .topbar .brand-logo img{width:120px!important;height:45px!important;max-width:120px!important;object-fit:contain!important;object-position:left center!important}
  html body .topbar .brand-logo small{width:120px!important;max-width:120px!important;font-size:9px!important;line-height:1.1!important;letter-spacing:0!important;text-align:left!important;white-space:nowrap!important}
  html body .topbar .voter-header-action{grid-area:voter!important;justify-self:end!important}
  html body .topbar .language-selector{grid-area:language!important;width:180px!important;justify-self:end!important}
  html body .topbar .portal-nav{
    grid-area:nav!important;
    justify-content:flex-start!important;
    gap:clamp(7px,1.05vw,15px)!important;
    overflow:hidden!important;
    padding:0!important;
  }
  html body .topbar .portal-nav a{font-size:clamp(11px,.9vw,13px)!important}
}
@media(min-width:801px) and (max-width:1280px){
  html body .topbar{grid-template-columns:104px minmax(0,1fr) auto 162px!important;gap:9px!important;padding-left:3%!important;padding-right:3%!important}
  html body .topbar .brand-logo{width:104px!important;height:64px!important}
  html body .topbar .brand-logo img{width:98px!important;height:43px!important;max-width:98px!important}
  html body .topbar .brand-logo small{width:98px!important;max-width:98px!important;font-size:8px!important}
  html body .topbar .language-selector{width:162px!important}
  html body .topbar .voter-header-action{min-height:36px!important;padding:8px 10px!important;font-size:12px!important}
  html body .topbar .portal-nav{gap:8px!important}
  html body .topbar .portal-nav a{font-size:11px!important}
}
@media(max-width:800px){
  html body .topbar{display:grid!important;grid-template-columns:minmax(0,1fr) auto auto!important;grid-template-areas:"brand voter language" "nav nav nav"!important;align-items:center!important;gap:7px!important;padding:8px 12px 9px!important}
  html body .topbar .brand-logo{grid-area:brand!important;min-width:0!important;width:clamp(108px,39vw,150px)!important;height:auto!important}
  html body .topbar .brand-logo img{width:100%!important;height:auto!important;max-height:42px!important;object-fit:contain!important;object-position:left center!important}
  html body .topbar .brand-logo small{font-size:7px!important;white-space:nowrap!important}
  html body .topbar .voter-header-action{grid-area:voter!important;order:initial!important;min-height:38px!important;margin:0!important;padding:8px 10px!important;font-size:10px!important;line-height:1!important;white-space:nowrap!important}
  html body .topbar .language-selector{grid-area:language!important;order:initial!important;width:auto!important;margin:0!important;padding:0!important;display:block!important}
  html body .topbar .language-selector label{display:none!important}
  html body .topbar .language-selector select{width:82px!important;min-width:82px!important;min-height:38px!important;height:38px!important;padding:7px 21px 7px 8px!important;font-size:10px!important;border-radius:9px!important}
  html body .topbar .portal-nav{grid-area:nav!important;order:initial!important;width:100%!important;max-width:100%!important;min-width:0!important;margin:0!important;padding:5px 0 0!important}
}

/* One shared navigation contract for every portal page and every hostname.
   At narrower widths controls move to a deliberate second row rather than
   shrinking into, or overlapping, one another. */
@media(min-width:801px) and (max-width:1180px){
  html body .topbar{
    grid-template-columns:132px minmax(0,1fr) auto!important;
    grid-template-areas:"brand voter language" "nav nav nav"!important;
    min-height:128px!important;
    height:auto!important;
    column-gap:10px!important;
    row-gap:4px!important;
    padding:8px 3.5% 10px!important;
  }
  html body .topbar .brand-logo{display:flex!important;grid-area:brand!important;width:132px!important;height:68px!important;min-width:0!important;align-items:flex-start!important;justify-content:center!important}
  html body .topbar .brand-logo img{width:124px!important;height:46px!important;max-width:124px!important;object-fit:contain!important;object-position:left center!important}
  html body .topbar .brand-logo small{width:124px!important;max-width:124px!important;font-size:9px!important;line-height:1.15!important;letter-spacing:.8px!important;text-align:left!important;white-space:nowrap!important}
  html body .topbar .voter-header-action{grid-area:voter!important;justify-self:end!important;min-height:40px!important;font-size:12px!important;padding:9px 12px!important}
  html body .topbar .language-selector{grid-area:language!important;width:168px!important;justify-self:end!important}
  html body .topbar .language-selector select{height:40px!important;font-size:12px!important}
  html body .topbar .portal-nav{grid-area:nav!important;display:flex!important;justify-content:center!important;align-items:center!important;flex-wrap:wrap!important;gap:6px 14px!important;overflow:visible!important;padding:2px 0 0!important}
  html body .topbar .portal-nav a{flex:0 0 auto!important;font-size:12px!important;line-height:1.25!important;padding:5px 0!important;white-space:nowrap!important}
}
@media(max-width:800px){
  html body .topbar{
    grid-template-columns:minmax(0,1fr) auto auto!important;
    grid-template-areas:"brand voter language" "nav nav nav"!important;
    min-height:112px!important;
    height:auto!important;
    gap:7px!important;
    padding:8px 12px 9px!important;
  }
  html body .topbar .brand-logo{display:flex!important;grid-area:brand!important;width:min(132px,36vw)!important;height:50px!important;min-width:0!important;align-items:flex-start!important;justify-content:center!important}
  html body .topbar .brand-logo img{width:100%!important;height:36px!important;max-width:132px!important;object-fit:contain!important;object-position:left center!important}
  html body .topbar .brand-logo small{width:100%!important;max-width:132px!important;margin:0!important;padding:0!important;font-size:7px!important;line-height:1.1!important;letter-spacing:.45px!important;text-align:left!important;white-space:nowrap!important;overflow:hidden!important;text-overflow:ellipsis!important}
  html body .topbar .voter-header-action{grid-area:voter!important;min-height:38px!important;padding:8px 9px!important;font-size:10px!important;white-space:nowrap!important}
  html body .topbar .language-selector{grid-area:language!important;width:78px!important;margin:0!important;padding:0!important;justify-self:end!important}
  html body .topbar .language-selector label{display:none!important}
  html body .topbar .language-selector select{width:78px!important;min-width:78px!important;height:38px!important;min-height:38px!important;padding:7px 20px 7px 8px!important;font-size:10px!important}
  html body .topbar .portal-nav{grid-area:nav!important;display:flex!important;flex-wrap:nowrap!important;justify-content:flex-start!important;gap:7px!important;overflow-x:auto!important;overflow-y:hidden!important;padding:5px 0 0!important;scrollbar-width:thin!important;-webkit-overflow-scrolling:touch!important}
  html body .topbar .portal-nav a{flex:0 0 auto!important;min-height:36px!important;padding:8px 10px!important;font-size:11px!important;white-space:nowrap!important}
}
