.topbar{z-index:120}
.mobile-menu-button{display:none}

@media(max-width:760px){
  .topbar{height:auto;min-height:68px;padding:10px 14px;display:grid;grid-template-columns:minmax(0,1fr) auto;gap:0 10px;align-items:center;flex-wrap:initial}
  .brand{min-width:0}
  .brand>span:last-child{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
  .mobile-menu-button{display:inline-flex;align-items:center;justify-content:center;gap:8px;min-width:88px;min-height:44px;padding:8px 12px;border:1px solid #a9beb6;border-radius:10px;background:#fff;color:var(--green);font:inherit;font-weight:850;cursor:pointer}
  .mobile-menu-icon,.mobile-menu-icon::before,.mobile-menu-icon::after{display:block;width:20px;height:2px;border-radius:2px;background:currentColor;content:""}
  .mobile-menu-icon{position:relative}
  .mobile-menu-icon::before{position:absolute;top:-6px}
  .mobile-menu-icon::after{position:absolute;top:6px}
  .topbar.menu-open .mobile-menu-icon{background:transparent}
  .topbar.menu-open .mobile-menu-icon::before{top:0;transform:rotate(45deg)}
  .topbar.menu-open .mobile-menu-icon::after{top:0;transform:rotate(-45deg)}
  .topbar nav,.topbar .account{display:none}
  .topbar.menu-open nav{grid-column:1/-1;display:grid;order:initial;width:100%;max-height:calc(100vh - 155px);margin-top:10px;overflow-x:hidden;overflow-y:auto;overscroll-behavior:contain;gap:0;border:1px solid #d9e2de;border-radius:12px;background:#fff;box-shadow:0 12px 28px rgba(23,33,43,.16)}
  .topbar.menu-open nav a{display:block;padding:13px 15px;border-bottom:1px solid #edf1ef;font-size:15px}
  .topbar.menu-open nav a:last-child{border-bottom:0}
  .topbar.menu-open .account{grid-column:1/-1;display:flex;align-items:stretch;flex-wrap:wrap;width:100%;margin:8px 0 0;padding:10px;border:1px solid #d9e2de;border-radius:12px;background:#f7faf8;gap:10px}
  .topbar.menu-open .account>span{display:inline-flex;align-items:center}
  .topbar.menu-open .account .club-context-form{flex:1 1 100%}
  .topbar.menu-open .account .club-context-form label{display:grid}
  .topbar.menu-open .account .club-context-form select{max-width:none;width:100%;min-height:42px}
  .topbar.menu-open .account a,.topbar.menu-open .account .link-button{display:inline-flex;align-items:center;min-height:40px;padding:8px 11px;border:1px solid #bfd0ca;border-radius:8px;background:#fff;text-decoration:none}
}

@media(max-width:430px){
  .brand-mark{width:34px;height:34px}
  .brand{font-size:14px}
  .mobile-menu-button{min-width:82px}
}