/* Homepage account slot retains its geometry while the AJAX profile loads. */
body.browser-page [data-gm-profile-slot] {
  position:relative; width:250px; min-width:250px!important; height:60px;
  flex:0 0 250px; display:flex; align-items:center; justify-content:flex-end;
}
body.browser-page [data-gm-profile-slot] .gm-profile-skeleton {
  position:absolute; inset:0; display:flex; align-items:center;
  justify-content:flex-end; gap:16px; padding:5px;
}
.gm-profile-skeleton__name,.gm-profile-skeleton__avatar {
  display:block; background:#2b2f39; animation:gm-profile-pulse 1.5s ease-in-out infinite;
}
.gm-profile-skeleton__name {width:150px; height:12px; border-radius:6px}
.gm-profile-skeleton__avatar {width:50px; height:50px; flex:0 0 50px; border-radius:50%}
body.browser-page [data-gm-profile-slot] > .gm-profile-content {
  width:100%; display:flex; justify-content:flex-end;
  opacity:0; visibility:hidden; transition:opacity .2s ease;
}
body.browser-page [data-gm-profile-slot] > .gm-profile-content > ul {width:100%; margin:0}
body.browser-page [data-gm-profile-slot].is-ready > .gm-profile-content {opacity:1; visibility:visible}
body.browser-page [data-gm-profile-slot].is-ready > .gm-profile-skeleton {display:none}
body.browser-page [data-gm-profile-slot] .myprofile {width:100%; box-sizing:border-box}
body.browser-desktop [data-gm-profile-slot] .myprofile > div {display:flex; align-items:center; justify-content:flex-end; gap:10px}
body.browser-desktop [data-gm-profile-slot] .myprofile-name {width:auto; flex:1; max-width:none}
body.browser-desktop [data-gm-profile-slot] .myprofile > div > figure {margin:0; float:none}
body.browser-page [data-gm-profile-slot] .myprofile-name {min-width:0}
body.browser-page [data-gm-profile-slot] .myprofile-name h2 {max-width:100%; overflow:hidden; text-overflow:ellipsis; white-space:nowrap}
body.browser-page [data-gm-profile-slot] figure {flex-shrink:0; background:url('/theme/web/img/persons.svg') center/cover no-repeat}
body.browser-page [data-gm-profile-slot] figure img {width:100%; height:100%; object-fit:cover; transition:opacity .2s ease}
body.browser-page [data-gm-profile-slot] figure img.gm-profile-avatar-pending {opacity:0}
body.browser-page [data-gm-profile-slot].is-failed .gm-profile-skeleton > span {animation:none}
@keyframes gm-profile-pulse {0%,100% {opacity:.5} 50% {opacity:1}}
@media (min-width:481px) and (max-width:1279px) {
  body.browser-desktop [data-gm-profile-slot] {width:210px; min-width:210px!important; flex-basis:210px}
  body.browser-desktop .gm-profile-skeleton__name {width:120px}
}
body.browser-mobile [data-gm-profile-slot] {width:50px; min-width:50px!important; height:50px; flex-basis:50px}
body.browser-mobile .gm-profile-skeleton__name {display:none}
body.browser-mobile .gm-profile-skeleton__avatar {width:40px; height:40px; flex-basis:40px}
body.browser-mobile [data-gm-profile-slot] .myprofile--mobile > .js-profile-toggle {display:flex!important; align-items:center; justify-content:center; width:50px!important; height:50px; padding:0}
@media (max-width:480px) {
  body.browser-desktop [data-gm-profile-slot] {width:60px; min-width:60px!important; flex-basis:60px}
  body.browser-desktop .gm-profile-skeleton__name {display:none}
}
@media (prefers-reduced-motion:reduce) {
  .gm-profile-skeleton__name,.gm-profile-skeleton__avatar {animation:none}
  body.browser-page [data-gm-profile-slot] > .gm-profile-content {transition:none}
}
