.login-menu { position: relative; }
.profile-button { min-height: 30px; padding: 5px 7px; border-radius: 2px; }
.profile-button .login-menu__button-text { max-width: 130px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.profile-button:hover, .login-menu.is-open .profile-button { background: #e9e8e1; }
.profile-button .login-menu__caret { margin-left: 1px; color: var(--muted); font-size: 13px; line-height: 1; transition: transform .18s ease; }
.login-menu.is-open .login-menu__caret { transform: rotate(180deg); }
.login-menu__panel { position: absolute; z-index: 30; top: calc(100% + 8px); right: 0; min-width: 178px; padding: 8px; border: 1px solid var(--line); background: var(--white); box-shadow: 0 16px 32px #1112; opacity: 0; visibility: hidden; transform: translateY(-5px); transition: opacity .16s ease, transform .16s ease, visibility .16s; }
.login-menu.is-open .login-menu__panel { opacity: 1; visibility: visible; transform: translateY(0); }
.login-menu__label { margin: 3px 7px 7px; color: var(--muted); font: 500 8px "DM Mono", monospace; letter-spacing: .06em; text-transform: uppercase; }
.login-menu__panel a { display: flex; align-items: center; min-height: 34px; padding: 8px 9px; font-size: 10px; font-weight: 800; }
.login-menu__panel a::before { width: 7px; height: 7px; margin-right: 8px; border-radius: 50%; background: var(--acid); content: ""; }
.login-menu__panel a.login-menu__seller::before { background: var(--signal); }
.login-menu__panel a:hover, .login-menu__panel a:focus-visible { background: var(--ink); color: var(--white); outline: none; }
.header { position: relative; z-index: 30; }
.mobile-menu { display: none; }
@media (max-width: 680px) {
  .mobile-menu { position: absolute; z-index: 40; top: calc(100% - 6px); right: 0; display: grid; width: min(280px, calc(100vw - 32px)); gap: 2px; padding: 9px; border: 1px solid var(--line); background: var(--white); box-shadow: 0 16px 32px #1113; opacity: 0; visibility: hidden; transform: translateY(-6px); transition: opacity .16s ease, transform .16s ease, visibility .16s; }
  .mobile-menu.is-open { opacity: 1; visibility: visible; transform: translateY(0); }
  .mobile-menu button, .mobile-menu a { display: flex; align-items: center; min-height: 42px; padding: 10px; border: 0; background: transparent; color: var(--ink); text-align: left; font-size: 12px; font-weight: 800; }
  .mobile-menu button:hover, .mobile-menu button:focus-visible { background: #e9e8e1; outline: none; }
  .mobile-menu__account { justify-content: center; margin-top: 4px; background: var(--ink) !important; color: var(--acid) !important; }
  .menu-button.is-open { background: var(--acid); color: var(--ink); }
}