/* Loaded after the legacy navigation styles so the topbar has one final source of truth. */
body.hub-party-design .hub-topbar{position:sticky!important;z-index:950!important;top:0!important;display:flex!important;height:80px!important;min-height:80px!important;align-items:center!important;gap:10px!important;padding:0 18px!important;border-bottom:1px solid rgba(255,255,255,.09)!important;background:rgba(10,5,18,.97)!important}
body.hub-party-design .hub-topbar>.hub-sidebar-toggle{order:0;flex:0 0 44px}
body.hub-party-design .hub-topbar>.hub-global-search{order:1;display:grid!important;min-width:220px!important;height:44px!important;min-height:44px!important;flex:1!important;grid-template-columns:24px minmax(0,1fr) 22px!important;margin:0!important;padding:0 12px!important}
body.hub-party-design .hub-topbar>.hub-language-switcher{order:2}
body.hub-party-design .hub-topbar>.hub-message-center{order:3}
body.hub-party-design .hub-topbar>.hub-notification-center{order:4}
body.hub-party-design .hub-topbar>.hub-user-menu,body.hub-party-design .hub-topbar>.hub-topbar-guest{order:5}
body.hub-party-design .hub-topbar .hub-party-cta{display:grid!important;height:42px!important;min-height:42px!important;padding:0 22px!important;font-size:12px!important}

@media(max-width:760px){
 body.hub-party-design .hub-topbar{position:sticky!important;z-index:600!important;top:0!important;height:80px!important;min-height:80px!important;display:grid!important;grid-template-columns:52px minmax(0,1fr) auto!important;grid-template-areas:"menu brand actions"!important;gap:10px!important;padding:8px 16px!important}
 body.hub-party-design .hub-topbar>.hub-mobile-menu{position:relative!important;inset:auto!important;display:grid!important;width:46px!important;height:46px!important;grid-area:menu!important;place-items:center!important}
 body.hub-party-design .hub-topbar>.hub-mobile-brand{position:relative!important;inset:auto!important;display:flex!important;width:auto!important;height:auto!important;min-width:0!important;grid-area:brand!important;justify-self:center!important;transform:none!important}
 body.hub-party-design .hub-topbar>.hub-mobile-brand img{width:auto!important;max-width:min(190px,100%)!important;height:38px!important;max-height:38px!important;object-fit:contain!important}
 body.hub-party-design .hub-topbar>.hub-mobile-context-title{display:none;min-width:0;grid-area:brand;overflow:hidden;color:#fff;font:400 24px/1 Anton,sans-serif;text-overflow:ellipsis;text-transform:uppercase;white-space:nowrap}
 body.hub-party-design .hub-topbar>.hub-mobile-actions{position:relative!important;inset:auto!important;display:flex!important;width:auto!important;height:auto!important;grid-area:actions!important;align-items:center!important;gap:8px!important;overflow:visible!important}
 body.hub-party-design .hub-topbar>.hub-mobile-actions>*{position:relative!important;inset:auto!important;display:grid!important;flex:0 0 46px!important;width:46px!important;height:46px!important;place-items:center!important;border-radius:14px!important}
 body.hub-party-design .hub-topbar>.hub-mobile-actions .hub-mobile-avatar-button{overflow:hidden;border:0!important;border-radius:50%!important;background:linear-gradient(145deg,#7061ff,#28d6df)!important}
 body.hub-party-design .hub-topbar>.hub-mobile-actions .hub-mobile-avatar-button img{width:100%;height:100%;object-fit:cover}
 body.hub-party-design .hub-topbar>.hub-mobile-actions .hub-mobile-join{min-width:62px!important;flex-basis:62px!important;border:0!important;background:linear-gradient(105deg,#ff3093,#ffd53c)!important;color:#170819!important;font-size:12px!important}
 body.hub-party-design .hub-topbar>.hub-sidebar-toggle,body.hub-party-design .hub-topbar>.hub-global-search,body.hub-party-design .hub-topbar>.hub-language-switcher,body.hub-party-design .hub-topbar>.hub-message-center,body.hub-party-design .hub-topbar>.hub-topbar-guest,body.hub-party-design .hub-topbar>.hub-user-menu>.hub-user-trigger,body.hub-party-design .hub-topbar>.hub-notification-center>.hub-notification-button{display:none!important}
 body.hub-party-design .hub-topbar>.hub-notification-center,body.hub-party-design .hub-topbar>.hub-user-menu{position:static!important;display:block!important;width:0!important;height:0!important;min-width:0!important;overflow:visible!important}
 body.hub-party-design .hub-topbar .hub-notification-panel,body.hub-party-design .hub-topbar .hub-user-panel{position:fixed!important;z-index:1500!important;top:76px!important;right:14px!important;left:14px!important;width:auto!important;max-height:calc(100dvh - 150px)!important;overflow:auto!important}
 body.hub-party-design .hub-topbar.is-condensed{height:58px!important;min-height:58px!important;padding-block:5px!important}
 body.hub-party-design .hub-topbar.is-condensed>.hub-mobile-brand{display:none!important}
 body.hub-party-design .hub-topbar.is-condensed>.hub-mobile-context-title{display:block!important}
 body.hub-party-design .hub-topbar.is-condensed>.hub-mobile-actions>*{width:42px!important;height:42px!important;flex-basis:42px!important}
 body.hub-party-design .hub-mobile-bottom-nav{display:grid!important}
}

/* Keep the mobile language picker in its own column, clear of the wordmark. */
@media (max-width: 760px) {
  body.hub-party-design .hub-mobile-sheet .hub-mobile-sheet-head {
    position: relative !important;
    z-index: 700 !important;
    display: grid !important;
    grid-template-columns: 46px minmax(0, 1fr) 76px !important;
    grid-template-areas: "close brand language" !important;
    align-items: center !important;
    gap: 8px !important;
    width: 100% !important;
    min-height: 48px !important;
    overflow: visible !important;
    direction: ltr !important;
  }

  body.hub-party-design .hub-mobile-sheet .hub-mobile-sheet-close {
    grid-area: close !important;
    position: relative !important;
    z-index: 3 !important;
  }

  body.hub-party-design .hub-mobile-sheet .hub-mobile-sheet-brand {
    grid-area: brand !important;
    position: relative !important;
    z-index: 1 !important;
    justify-self: center !important;
    width: 100% !important;
    max-width: 170px !important;
    min-width: 0 !important;
    overflow: hidden !important;
    direction: ltr !important;
  }

  body.hub-party-design .hub-mobile-sheet .hub-mobile-sheet-brand img {
    display: block !important;
    width: 100% !important;
    max-width: 170px !important;
    height: 40px !important;
    object-fit: contain !important;
  }

  body.hub-party-design .hub-mobile-sheet .hub-mobile-language-switcher {
    grid-area: language !important;
    position: relative !important;
    z-index: 8 !important;
    display: flex !important;
    visibility: visible !important;
    opacity: 1 !important;
    justify-self: end !important;
    align-self: center !important;
    width: 76px !important;
    height: 44px !important;
    min-width: 0 !important;
    overflow: visible !important;
    direction: ltr !important;
  }

  body.hub-party-design .hub-mobile-sheet .hub-mobile-language-trigger {
    display: flex !important;
    width: 76px !important;
    height: 44px !important;
    padding: 0 8px !important;
    gap: 4px !important;
    visibility: visible !important;
    opacity: 1 !important;
  }

  body.hub-party-design .hub-mobile-sheet .hub-mobile-language-menu {
    z-index: 1800 !important;
  }
}

@media (max-width: 360px) {
  body.hub-party-design .hub-mobile-sheet .hub-mobile-sheet-head {
    grid-template-columns: 44px minmax(0, 1fr) 66px !important;
    gap: 6px !important;
  }

  body.hub-party-design .hub-mobile-sheet .hub-mobile-sheet-brand,
  body.hub-party-design .hub-mobile-sheet .hub-mobile-sheet-brand img {
    max-width: 140px !important;
  }

  body.hub-party-design .hub-mobile-sheet .hub-mobile-language-switcher,
  body.hub-party-design .hub-mobile-sheet .hub-mobile-language-trigger {
    width: 66px !important;
  }

  body.hub-party-design .hub-mobile-sheet .hub-mobile-language-trigger {
    padding-inline: 6px !important;
    gap: 3px !important;
  }
}
@media(min-width:761px) and (max-width:1180px){
 body.hub-party-design .hub-topbar{padding-inline:12px!important;gap:7px!important}
 body.hub-party-design .hub-topbar>.hub-global-search{min-width:145px!important}
 body.hub-party-design .hub-topbar .hub-language-trigger{min-width:78px!important}
 body.hub-party-design .hub-topbar .hub-user-trigger{width:46px;min-width:46px;padding:4px}
 body.hub-party-design .hub-topbar .hub-user-trigger>strong,body.hub-party-design .hub-topbar .hub-user-trigger>i{display:none}
 body.hub-party-design .hub-topbar .hub-topbar-guest .hub-party-cta{min-width:118px;padding-inline:16px!important}
}
@media(max-width:420px){
 body.hub-party-design .hub-topbar{grid-template-columns:48px minmax(0,1fr) auto!important;padding-inline:12px!important}
 body.hub-party-design .hub-topbar>.hub-mobile-brand img{max-width:168px!important;height:34px!important}
 body.hub-party-design .hub-topbar>.hub-mobile-actions{gap:6px!important}
 body.hub-party-design .hub-topbar>.hub-mobile-actions>*{width:42px!important;height:42px!important;flex-basis:42px!important}
}

/* Full-width language selector at the bottom of the mobile menu. */
@media (max-width:760px) {
 body.hub-party-design .hub-mobile-sheet .hub-mobile-sheet-head{
  grid-template-columns:46px minmax(0,1fr) 46px!important;
  grid-template-areas:"close brand spacer"!important;
 }
 body.hub-party-design .hub-mobile-sheet .hub-mobile-sheet-brand{
  max-width:190px!important;
 }
 body.hub-party-design .hub-mobile-sheet .hub-mobile-sheet-brand img{
  max-width:190px!important;
 }
 body.hub-party-design .hub-mobile-sheet .hub-mobile-sheet-bottom{
  position:relative!important;
  z-index:710!important;
  display:flex!important;
  flex-direction:column!important;
  gap:9px!important;
 }
 body.hub-party-design .hub-mobile-sheet .hub-mobile-language-wide{
  position:relative!important;
  z-index:12!important;
  display:block!important;
  visibility:visible!important;
  opacity:1!important;
  right:auto!important;
  bottom:auto!important;
  left:auto!important;
  flex:0 0 auto!important;
  width:100%!important;
  height:48px!important;
  margin:14px 0 8px!important;
  padding:0!important;
  overflow:visible!important;
  direction:ltr!important;
 }
 body.hub-party-design .hub-mobile-sheet .hub-mobile-language-wide>.hub-mobile-language-trigger{
  display:grid!important;
  grid-template-columns:24px minmax(0,1fr) auto 12px!important;
  align-items:center!important;
  gap:9px!important;
  width:100%!important;
  min-width:100%!important;
  height:48px!important;
  padding:0 14px!important;
  border:1px solid rgba(255,255,255,.17)!important;
  border-radius:15px!important;
  background:rgba(255,255,255,.075)!important;
  color:#fff!important;
  text-align:left!important;
  box-shadow:none!important;
 }
 body.hub-party-design .hub-mobile-sheet .hub-mobile-language-wide>.hub-mobile-language-trigger .hub-language-current-flag{
  width:24px!important;
  height:17px!important;
  object-fit:cover!important;
 }
 body.hub-party-design .hub-mobile-sheet .hub-mobile-language-wide .hub-mobile-language-label{
  min-width:0!important;
  color:#fff!important;
  font:800 13px/1 Archivo,Heebo,sans-serif!important;
  text-transform:none!important;
 }
 body.hub-party-design .hub-mobile-sheet .hub-mobile-language-wide>.hub-mobile-language-trigger>span{
  color:#cbb8dc!important;
  font-size:12px!important;
  font-weight:900!important;
 }
 body.hub-party-design .hub-mobile-sheet .hub-mobile-language-wide>.hub-mobile-language-trigger>i{
  margin:0!important;
  color:#cbb8dc!important;
  font-size:9px!important;
 }
 body.hub-party-design .hub-mobile-sheet .hub-mobile-language-wide>.hub-mobile-language-menu,
 [dir="rtl"] body.hub-party-design .hub-mobile-sheet .hub-mobile-language-wide>.hub-mobile-language-menu{
  position:fixed!important;
  z-index:1800!important;
  top:auto!important;
  right:18px!important;
  bottom:calc(82px + env(safe-area-inset-bottom))!important;
  left:18px!important;
  width:auto!important;
  max-width:none!important;
  max-height:min(62dvh,520px)!important;
  overflow:auto!important;
  padding:12px 10px 10px!important;
  border-radius:19px!important;
  box-shadow:0 28px 70px rgba(0,0,0,.78)!important;
 }
 body.hub-party-design .hub-mobile-sheet .hub-mobile-language-wide>.hub-mobile-language-menu[hidden]{
  display:none!important;
 }
 body.hub-party-design .hub-mobile-sheet .hub-mobile-language-wide .hub-language-list{
  max-height:min(48dvh,410px)!important;
  overflow:auto!important;
 }
 body.hub-party-design .hub-mobile-sheet .hub-mobile-sheet-bottom>div:not(.hub-mobile-language-wide){
  padding-top:2px!important;
 }

 /* Mobile navigation typography follows the compact UI style, not display headings. */
 body.hub-party-design .hub-mobile-sheet .hub-mobile-nav-group h2{
  margin:0 5px 8px!important;
  color:#9275aa!important;
  font-family:Archivo,Heebo,sans-serif!important;
  font-size:10px!important;
  font-weight:800!important;
  line-height:1.2!important;
  letter-spacing:.17em!important;
  text-transform:uppercase!important;
 }
 body.hub-party-design .hub-mobile-sheet .hub-mobile-nav-row{
  min-height:46px!important;
  padding:7px 13px!important;
  gap:10px!important;
 }
 body.hub-party-design .hub-mobile-sheet .hub-mobile-nav-row>b,
 [dir="rtl"] body.hub-party-design .hub-mobile-sheet .hub-mobile-nav-row>b{
  font-family:Archivo,Heebo,sans-serif!important;
  font-size:15px!important;
  font-weight:750!important;
  font-stretch:normal!important;
  line-height:1.2!important;
  letter-spacing:-.015em!important;
  text-transform:none!important;
 }
 body.hub-party-design .hub-mobile-sheet .hub-mobile-nav-row>span{
  width:18px!important;
  font-family:Archivo,Heebo,sans-serif!important;
  font-size:13px!important;
  line-height:1!important;
 }
 body.hub-party-design .hub-mobile-sheet .hub-mobile-nav-row>small{
  font-family:Archivo,Heebo,sans-serif!important;
  font-size:10px!important;
  font-weight:700!important;
  letter-spacing:0!important;
 }
 body.hub-party-design .hub-mobile-sheet .hub-mobile-nav-row>em{
  font-family:Archivo,Heebo,sans-serif!important;
  font-size:10px!important;
  font-weight:800!important;
 }
 html[lang="he"] body.hub-party-design .hub-mobile-sheet .hub-mobile-nav-group h2,
 html[lang="he"] body.hub-party-design .hub-mobile-sheet .hub-mobile-nav-row>b,
 html[lang="he"] body.hub-party-design .hub-mobile-sheet .hub-mobile-nav-row>small,
 html[lang="he"] body.hub-party-design .hub-mobile-sheet .hub-mobile-nav-row>em{
  font-family:Heebo,sans-serif!important;
 }
}
