/* Аватар-инициалы (ui.js: avatar, avatarStack): круг с инициалами сотрудника; размеры sm/md/lg.
   Цвет — мягкий акцент (текст --fg на --accent-soft — пара из теста контраста). Бывший сотрудник — пунктирная рамка. */
.avatar {
  --avatar-size: 32px; --avatar-bg: var(--accent-soft); --avatar-fg: var(--fg); --avatar-border: var(--border);
  display: inline-grid; place-items: center; flex: none; width: var(--avatar-size); height: var(--avatar-size);
  border-radius: 50%; border: var(--border-w) solid var(--avatar-border); background: var(--avatar-bg); color: var(--avatar-fg);
  font: var(--fw-semibold) var(--fs-xs)/1 var(--font); letter-spacing: .02em; user-select: none; overflow: hidden;
}
.avatar-sm { --avatar-size: 24px; font-size: var(--fs-xs); }
.avatar-md { --avatar-size: 32px; }
.avatar-lg { --avatar-size: 44px; font-size: var(--fs-md); }
.avatar.former { --avatar-bg: var(--surface-2); --avatar-fg: var(--fg-muted); border-style: dashed; border-color: var(--border-strong); }
.avatar-empty { --avatar-bg: var(--surface-2); --avatar-fg: var(--fg-muted); }
.avatar-more { --avatar-bg: var(--surface-3); --avatar-fg: var(--fg); }

/* наблюдатели и участники: аватары внахлёст, кольцо цвета карточки отделяет соседей */
.avatar-stack { display: inline-flex; align-items: center; }
.avatar-stack .avatar { outline: var(--border-w) solid var(--surface-1); }
.avatar-stack .avatar + .avatar { margin-left: calc(var(--s1h) * -1); }

/* человек одной строкой (ui.js: personChip): аватар + имя + пометки «уволен»/«внешний» */
.person-chip { display: inline-flex; align-items: center; gap: var(--s1h); min-width: 0; max-width: 100%;
  color: inherit; text-decoration: none; vertical-align: middle; }
a.person-chip:hover .person-name { text-decoration: underline; }
.person-name { min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.person-tag { flex: none; padding: 0 var(--s1); border-radius: var(--r-xs); background: var(--surface-2);
  color: var(--fg-muted); font-size: var(--fs-xs); }