.account-dropdown { position: relative; color: var(--brand-plum, #4f213b); flex-shrink: 0; }
.account-toggle { display: flex; align-items: center; gap: 10px; min-height: 44px; padding: 5px 12px 5px 5px; border: 1px solid var(--brand-border, rgba(79, 33, 59, .12)); border-radius: 24px; cursor: pointer; list-style: none; background: var(--brand-white, #fff); }
.account-toggle::-webkit-details-marker { display: none; }
.account-toggle:hover, .account-dropdown[open] .account-toggle { background: var(--brand-pink-soft, #fff0f6); }
.account-avatar { display: grid; place-items: center; width: 32px; height: 32px; flex-shrink: 0; border-radius: 50%; background: var(--brand-pink, #fa83ad); color: var(--brand-plum, #4f213b); font-weight: 700; }
.account-name { max-width: 140px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; font-size: .9rem; font-weight: 600; }
.account-chevron { flex-shrink: 0; transition: transform .15s; }
.account-dropdown[open] .account-chevron { transform: rotate(180deg); }
.account-panel { position: absolute; z-index: 1100; top: calc(100% + 10px); right: 0; width: min(280px, calc(100vw - 32px)); padding: 8px; border: 1px solid var(--brand-border, rgba(79, 33, 59, .12)); border-radius: 18px; background: var(--brand-white, #fff); box-shadow: var(--brand-shadow, 0 20px 60px #4f213b1a); }
.account-identity { display: grid; gap: 2px; padding: 10px 12px 14px; margin-bottom: 4px; border-bottom: 1px solid var(--brand-border, rgba(79, 33, 59, .12)); overflow-wrap: anywhere; }
.account-identity strong { font-size: .9rem; }
.account-identity span { color: var(--brand-plum-muted, #795969); font-size: .8rem; }
.account-menu-item { display: block; width: 100%; padding: 11px 12px; border: 0; border-radius: 10px; background: transparent; color: var(--brand-plum, #4f213b); font: inherit; font-size: .9rem; text-align: left; text-decoration: none; cursor: pointer; }
.account-menu-item:hover { background: var(--brand-pink-soft, #fff0f6); }
.account-toggle:focus-visible, .account-menu-item:focus-visible { outline: 2px solid var(--brand-plum, #4f213b); outline-offset: 3px; }
.account-menu-divider { height: 1px; margin: 6px 12px; background: var(--brand-border, rgba(79, 33, 59, .12)); }
.account-logout-form { margin: 0; }
.account-sign-out { font-weight: 600; }
@media (max-width: 720px) {
  .home-header-content .account-toggle { width: 44px; height: 44px; padding: 5px; gap: 0; justify-content: center; border-radius: 50%; }
  .home-header-content .account-name,
  .home-header-content .account-chevron { display: none; }
}