@layer ds-reset,ds-foundation,ds-subatoms,ds-atoms,ds-molecules,ds-organisms,ds-templates,ds-landing;@layer ds-molecules{.avatar{display:flex;align-items:center;justify-content:center;position:relative;border-radius:50%;flex-shrink:0;width:var(--avatar-size);height:var(--avatar-size);background-color:var(--avatar-bg, var(--control-colors-button-background-default));box-shadow:var(--avatar-shadow, none);border:var(--avatar-border, var(--avatar-border-width, 0px) solid var(--avatar-border-color, transparent));cursor:var(--avatar-cursor, default)}.avatar__placeholder-icon{width:50%;height:50%}.avatar__image{width:100%;height:100%;border-radius:inherit;object-fit:cover}.avatar__icon{display:inline-block}.avatar__icon>path{fill:var(--control-colors-value-default)}.avatar__skeleton{position:absolute;inset:calc(-1 * var(--avatar-border-width, 0px));border-radius:inherit}.avatar__control{display:none}.avatar__badge{display:flex;position:absolute;bottom:0}[dir=ltr] .avatar__badge{right:0}[dir=rtl] .avatar__badge{left:0}.avatar--with-shadow{box-shadow:var(--shadows-tint-1)}.avatar--no-border{border:none}.avatar--cursor-pointer{cursor:pointer}[dir=ltr] .avatar__badge--rectangle,[dir=rtl] .avatar__badge--rectangle{left:50%;right:auto;transform:translate(-50%)}}