@layer components{.avatar{--avatar-size:2rem;--avatar-radius:var(--radius-sm);aspect-ratio:1;inline-size:var(--avatar-size);block-size:var(--avatar-size);border:var(--border-thin) solid var(--theme-border);border-radius:var(--avatar-radius);font-size:var(--text-sm);font-weight:var(--font-weight-semibold);background-color:var(--theme-bg-alt);color:var(--theme-text);flex:none;justify-content:center;align-items:center;display:flex;overflow:clip}.avatar[data-avatar-size=s]{--avatar-size:1.5rem}.avatar[data-avatar-size=l]{--avatar-size:2.75rem}.avatar[data-avatar-round]{--avatar-radius:var(--radius-round)}}