.relay-avatar-shell {
  position: relative !important;
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  overflow: visible !important;
  flex: 0 0 auto !important;
  vertical-align: middle !important;
  isolation: isolate !important;
  width: 42px !important;
  height: 42px !important;
  min-width: 42px !important;
  min-height: 42px !important;
  max-width: 42px !important;
  max-height: 42px !important;
}

.relay-avatar-shell > img:not(.relay-avatar-border-img) {
  position: relative !important;
  z-index: 2 !important;
  display: block !important;
  width: 42px !important;
  height: 42px !important;
  min-width: 42px !important;
  min-height: 42px !important;
  max-width: 42px !important;
  max-height: 42px !important;
  aspect-ratio: 1 / 1 !important;
  object-fit: cover !important;
  border-radius: 50% !important;
  overflow: hidden !important;
}

.relay-avatar-border-img {
  position: absolute !important;
  left: 50% !important;
  top: 50% !important;
  width: 162% !important;
  height: 162% !important;
  min-width: 162% !important;
  min-height: 162% !important;
  max-width: none !important;
  max-height: none !important;
  object-fit: contain !important;
  pointer-events: none !important;
  transform: translate(-50%, -50%) !important;
  z-index: 99 !important;
  overflow: visible !important;
  border-radius: 0 !important;
  clip-path: none !important;
  background: transparent !important;
}

.msg-avatar {
  overflow: visible !important;
}

.msg-spacer {
  width: 42px !important;
  min-width: 42px !important;
  flex: 0 0 42px !important;
}

.profile-border-field {
  display: grid;
  gap: 12px;
  margin-bottom: 18px;
}

.profile-border-label {
  font-size: 12px;
  font-weight: 700;
  color: rgba(255,255,255,.86);
}

.profile-border-options {
  display: flex;
  flex-wrap: wrap;
  gap: 10px;
}

.profile-border-card {
  width: 68px;
  height: 68px;
  display: grid;
  place-items: center;
  border: 1px solid rgba(255,255,255,.09);
  border-radius: 12px;
  background: rgba(255,255,255,.045);
  color: rgba(255,255,255,.72);
  cursor: pointer;
  padding: 0;
}

.profile-border-card img {
  width: 54px;
  height: 54px;
  object-fit: contain;
  pointer-events: none;
}

.profile-border-card.is-selected {
  border-color: #ff6a1a;
  background: rgba(255,106,26,.13);
}

.profile-border-none {
  font-size: 12px;
}

/* scope pfp border fix */
.msg-avatar {
  position: relative !important;
  width: 42px !important;
  height: 42px !important;
  min-width: 42px !important;
  min-height: 42px !important;
  max-width: 42px !important;
  max-height: 42px !important;
  flex: 0 0 42px !important;
  overflow: visible !important;
  border-radius: 0 !important;
  background: transparent !important;
  display: grid !important;
  place-items: center !important;
}

.msg-avatar .relay-avatar-shell {
  width: 42px !important;
  height: 42px !important;
  min-width: 42px !important;
  min-height: 42px !important;
  max-width: 42px !important;
  max-height: 42px !important;
  flex: 0 0 42px !important;
  overflow: visible !important;
}

.msg-avatar .relay-avatar-shell > img:not(.relay-avatar-border-img) {
  width: 42px !important;
  height: 42px !important;
  min-width: 42px !important;
  min-height: 42px !important;
  max-width: 42px !important;
  max-height: 42px !important;
  object-fit: cover !important;
  border-radius: 50% !important;
}

.msg-avatar .relay-avatar-border-img {
  width: 158% !important;
  height: 158% !important;
  min-width: 158% !important;
  min-height: 158% !important;
  z-index: 999 !important;
}

.pop-avatar .relay-avatar-shell,
.dm-pfp .relay-avatar-shell,
.req-pfp .relay-avatar-shell,
.nav-avatar .relay-avatar-shell,
.profile-avatar .relay-avatar-shell,
.account-avatar .relay-avatar-shell,
.dashboard-avatar .relay-avatar-shell {
  width: 100% !important;
  height: 100% !important;
  min-width: 100% !important;
  min-height: 100% !important;
  max-width: 100% !important;
  max-height: 100% !important;
  flex: 0 0 auto !important;
}

.pop-avatar .relay-avatar-shell > img:not(.relay-avatar-border-img),
.dm-pfp .relay-avatar-shell > img:not(.relay-avatar-border-img),
.req-pfp .relay-avatar-shell > img:not(.relay-avatar-border-img),
.nav-avatar .relay-avatar-shell > img:not(.relay-avatar-border-img),
.profile-avatar .relay-avatar-shell > img:not(.relay-avatar-border-img),
.account-avatar .relay-avatar-shell > img:not(.relay-avatar-border-img),
.dashboard-avatar .relay-avatar-shell > img:not(.relay-avatar-border-img) {
  width: 100% !important;
  height: 100% !important;
  min-width: 100% !important;
  min-height: 100% !important;
  max-width: 100% !important;
  max-height: 100% !important;
  object-fit: cover !important;
  border-radius: 50% !important;
}

.pop-avatar .relay-avatar-border-img,
.dm-pfp .relay-avatar-border-img,
.req-pfp .relay-avatar-border-img,
.nav-avatar .relay-avatar-border-img {
  display: none !important;
}


/* restore profile popup borders without shrinking the PFP */
.pop-avatar {
  position: relative !important;
  overflow: visible !important;
}

.pop-avatar .relay-avatar-shell {
  position: relative !important;
  width: 100% !important;
  height: 100% !important;
  min-width: 100% !important;
  min-height: 100% !important;
  max-width: 100% !important;
  max-height: 100% !important;
  overflow: visible !important;
}

.pop-avatar .relay-avatar-shell > img:not(.relay-avatar-border-img) {
  width: 100% !important;
  height: 100% !important;
  min-width: 100% !important;
  min-height: 100% !important;
  max-width: 100% !important;
  max-height: 100% !important;
  object-fit: cover !important;
  border-radius: 50% !important;
}

.pop-avatar .relay-avatar-border-img {
  display: block !important;
  position: absolute !important;
  left: 50% !important;
  top: 50% !important;
  width: 155% !important;
  height: 155% !important;
  min-width: 155% !important;
  min-height: 155% !important;
  max-width: none !important;
  max-height: none !important;
  object-fit: contain !important;
  transform: translate(-50%, -50%) !important;
  pointer-events: none !important;
  z-index: 999 !important;
  border-radius: 0 !important;
  background: transparent !important;
}

.msg-avatar .relay-avatar-border-img {
  display: block !important;
  width: 155% !important;
  height: 155% !important;
  min-width: 155% !important;
  min-height: 155% !important;
  z-index: 999 !important;
}

.pop-avatar .relay-avatar-border-img {
  width: 138% !important;
  height: 138% !important;
  min-width: 138% !important;
  min-height: 138% !important;
  z-index: 999 !important;
}

.msg-avatar .relay-avatar-border-img {
  width: 138% !important;
  height: 138% !important;
  min-width: 138% !important;
  min-height: 138% !important;
  z-index: 999 !important;
}

.pop-avatar .relay-avatar-border-img {
  width: 126% !important;
  height: 126% !important;
  min-width: 126% !important;
  min-height: 126% !important;
  z-index: 999 !important;
}

.msg-avatar .relay-avatar-border-img {
  width: 126% !important;
  height: 126% !important;
  min-width: 126% !important;
  min-height: 126% !important;
  z-index: 999 !important;
}

.pop-avatar .relay-avatar-border-img {
  width: 126% !important;
  height: 126% !important;
  min-width: 126% !important;
  min-height: 126% !important;
  z-index: 999 !important;
}

.msg-avatar .relay-avatar-border-img {
  width: 126% !important;
  height: 126% !important;
  min-width: 126% !important;
  min-height: 126% !important;
  z-index: 999 !important;
}

.pop-avatar .relay-avatar-border-img {
  width: 122% !important;
  height: 122% !important;
  min-width: 122% !important;
  min-height: 122% !important;
}

.msg-avatar .relay-avatar-border-img {
  width: 122% !important;
  height: 122% !important;
  min-width: 122% !important;
  min-height: 122% !important;
}

.pop-avatar .relay-avatar-border-img {
  width: 109% !important;
  height: 109% !important;
  min-width: 109% !important;
  min-height: 109% !important;
}

.msg-avatar .relay-avatar-border-img {
  width: 109% !important;
  height: 109% !important;
  min-width: 109% !important;
  min-height: 109% !important;
}

.pop-avatar .relay-avatar-border-img {
  width: 109% !important;
  height: 109% !important;
  min-width: 109% !important;
  min-height: 109% !important;
}

.msg-avatar .relay-avatar-border-img {
  width: 109% !important;
  height: 109% !important;
  min-width: 109% !important;
  min-height: 109% !important;
}

.pop-avatar .relay-avatar-border-img {
  width: 109% !important;
  height: 109% !important;
  min-width: 109% !important;
  min-height: 109% !important;
}

.msg-avatar .relay-avatar-border-img {
  width: 109% !important;
  height: 109% !important;
  min-width: 109% !important;
  min-height: 109% !important;
}

.pop-avatar .relay-avatar-border-img {
  width: 116% !important;
  height: 116% !important;
  min-width: 116% !important;
  min-height: 116% !important;
}

.msg-avatar .relay-avatar-border-img {
  width: 116% !important;
  height: 116% !important;
  min-width: 116% !important;
  min-height: 116% !important;
}

#messages {
  padding-left: 14px !important;
}

.msg,
.msg-avatar,
.relay-avatar-shell {
  overflow: visible !important;
}

.msg-avatar {
  margin-left: 4px !important;
}