/* AVATAR-TEMPLATE-BEGIN */
/* Custom avatar for {id} */
[style*="avatars/{id}"],
[src*="avatars/{id}"]{
  content: url({img});
  background-image: url({img})!important;
}
/* AVATAR-TEMPLATE-END */

/* BADGE-TEMPLATE-BEGIN */
/* Custom badge for {username} */
.header-S26rhB:has([aria-label*="{username}"])>.headerTop-1PNKck>.badgeList-2aoHPw::before,
[aria-label="{username}"]>:first-child>:first-child>.profileBadges-2pItdR::before,
.userInfo-regn9W:has([aria-label*="{username}"])>:nth-child(2)>[role="group"]:before,
.baseLayout-1_9QRm:has([placeholder*="{username}"])>:last-child>:last-child>:last-child>[role="group"]:before{
  content: "";
  width: 22px;
  height: 22px;
  background: url({img}) center / 100% 100%;
}
/* BADGE-TEMPLATE-END */
.avatar-31d8He {
  background-repeat: no-repeat;
  background-size: contain;
}
foreignObject:is([width="120"])>div>.avatar-31d8He {
  height: 120px;
  width: 120px;
}
foreignObject:is([width="80"])>div>.avatar-31d8He {
  height: 80px;
  width: 80px;
}
foreignObject:is([width="32"])>div>.avatar-31d8He {
  width: 32px;
  height: 32px;
}
foreignObject:is([width="24"])>div>.avatar-31d8He {
  width: 24px;
  height: 24px;
}
foreignObject:is([width="16"])>div>.avatar-31d8He {
  width: 16px;
  height: 16px;
}