.avatar-stack {
  display: flex;
  align-items: center;
  margin: 0;
  padding: 0;
  list-style: none;
}

.avatar-stack > li {
  display: flex;
}

.avatar-stack > li + li {
  margin-inline-start: calc(var(--avatar-overlap, 0.25rem) * -1);
}

.avatar-stack--xs,
.avatar-stack--xxs {
  --avatar-overlap: 0.125rem;
}

.avatar-stack__more {
  --avatar-bg: var(--surface-subtle);
  --avatar-text: var(--text-body);
}
