.avatar{position:relative;display:inline-flex;align-items:center;justify-content:center;width:2.25rem;height:2.25rem;border-radius:var(--radius-circle);overflow:hidden;flex:none;background:var(--avatar-bg, var(--surface-sunken));color:var(--avatar-ink, var(--ink-muted));font-family:var(--font-mono);font-size:var(--text-xs);font-weight:var(--weight-medium);letter-spacing:var(--track-normal);text-decoration:none;text-transform:uppercase;-webkit-user-select:none;user-select:none}.profile-avatar__fallback{display:inline-flex;align-items:center;justify-content:center;width:100%;height:100%}.profile-avatar__image{position:absolute;inset:0;width:100%;height:100%;background:var(--avatar-bg, var(--surface-sunken));object-fit:cover}[data-avatar-image-fit=contain] .profile-avatar__image{object-fit:contain}.avatar--xs{width:1.5rem;height:1.5rem;font-size:var(--text-2xs)}.avatar--sm{width:1.875rem;height:1.875rem;font-size:var(--text-2xs)}.avatar--lg{width:3rem;height:3rem;font-size:var(--text-base)}.avatar--xl{width:5rem;height:5rem;font-size:var(--text-xl)}.avatar--square{border-radius:var(--radius-surface)}.tone-0,.tone-1,.tone-2,.tone-3,.tone-4,.tone-5{--avatar-bg: color-mix(in oklab, var(--tone-hue) 16%, var(--surface-sunken));--avatar-ink: color-mix(in oklab, var(--tone-hue) 58%, var(--ink))}.tone-0{--tone-hue: var(--blue-500)}.tone-1{--tone-hue: var(--violet-500)}.tone-2{--tone-hue: var(--cyan-500)}.tone-3{--tone-hue: var(--teal-500)}.tone-4{--tone-hue: var(--mint-500)}.tone-5{--tone-hue: var(--rose-500)}[data-surface=dark] .avatar{box-shadow:inset 0 0 0 1px var(--line-on-dark)}