.avatar-account-menu{position:fixed;z-index:350;width:min(254px,calc(100vw - 24px));padding:7px;background:#fff;border:1px solid #e3e8ec;border-radius:14px;box-shadow:0 16px 45px #152b3c1c,0 3px 8px #152b3c08;color:#18344a;transform-origin:top right}
.avatar-account-menu:not([hidden]){animation:avatar-menu-enter 260ms cubic-bezier(.2,.75,.25,1) both}
.avatar-menu-heading{padding:13px 13px 15px;margin:0 3px 6px;border-bottom:1px solid #edf0f3;overflow-wrap:anywhere}
.avatar-menu-heading strong{display:block;font-size:13px;font-weight:600;line-height:1.5}
.avatar-menu-heading>span{display:block;margin-top:3px;color:#83909a;font-size:10px;letter-spacing:.35px}
.avatar-account-menu [role=menuitem]{display:flex;align-items:center;gap:12px;width:100%;min-height:48px;padding:12px 13px;border:0;border-radius:8px;background:transparent;color:inherit;text-decoration:none;text-align:start;font:inherit;font-size:13px;font-weight:500;cursor:pointer;transition:background-color 140ms,color 140ms}
.avatar-account-menu [role=menuitem]>svg{width:19px;height:19px;flex:none;color:#687f8d}
.avatar-account-menu .avatar-menu-arrow{margin-inline-start:auto;font-size:21px;color:#9ba9b2;font-weight:400;line-height:1}
.avatar-account-menu [role=menuitem]:hover,.avatar-account-menu [role=menuitem]:focus-visible{background:#f3f6f8;color:#15394e}
.avatar-account-menu [role=menuitem]:focus-visible{outline:2px solid #cadce7;outline-offset:-2px}
body[data-surface=customer] #avatar{transition:box-shadow 160ms,transform 160ms}
body[data-surface=customer] #avatar:hover,body[data-surface=customer] #avatar[aria-expanded=true]{box-shadow:0 0 0 3px #eff3f6}
html[data-theme=dark] .avatar-account-menu{background:#20282c;border-color:#3b474e;color:#e7eff4;box-shadow:0 16px 45px #0005}
html[data-theme=dark] .avatar-menu-heading{border-color:#38454d}
html[data-theme=dark] .avatar-menu-heading>span,html[data-theme=dark] .avatar-account-menu [role=menuitem]>svg{color:#a4b5bf}
html[data-theme=dark] .avatar-account-menu [role=menuitem]:hover,html[data-theme=dark] .avatar-account-menu [role=menuitem]:focus-visible{background:#2c3b44;color:#f0f6fa}
html[data-theme=dark] body[data-surface=customer] #avatar[aria-expanded=true]{box-shadow:0 0 0 3px #3b474e}
@keyframes avatar-menu-enter{from{opacity:0;transform:translateY(-9px) scale(.98)}to{opacity:1;transform:translateY(0) scale(1)}}
@media(prefers-reduced-motion:reduce){.avatar-account-menu:not([hidden]){animation:none}.avatar-account-menu [role=menuitem],body[data-surface=customer] #avatar{transition:none}}
body[data-surface=customer] .customer-account #customer-name{display:inline-block;max-width:170px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;font-size:12px;font-variant-numeric:tabular-nums;line-height:1.5}
@media(max-width:580px){body[data-surface=customer] .customer-account #customer-name{display:inline-block;max-width:130px;font-size:11px}.customer-account{flex-wrap:wrap}}