.design-system-thumbnail {
    display: inline-flex;
    justify-content: center;
    align-items: center;
    position: relative;
    aspect-ratio: 1 / 1;
    overflow: hidden;
    flex-shrink: 0;
    background-color: var(--Components-basic-gray-color-background-color-bg-white);
}

.design-system-thumbnail .ds-thumbnail-img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    display: block;
}

.design-system-thumbnail.size-196 { width: var(--px-196); height: var(--px-196); }
.design-system-thumbnail.size-160 { width: var(--px-160); height: var(--px-160); }
.design-system-thumbnail.size-128 { width: var(--px-128); height: var(--px-128); }
.design-system-thumbnail.size-108 { width: var(--px-108); height: var(--px-108); }
.design-system-thumbnail.size-104 { width: var(--px-104); height: var(--px-104); }
.design-system-thumbnail.size-72  { width: var(--px-72); height: var(--px-72); }
.design-system-thumbnail.size-64  { width: var(--px-64); height: var(--px-64); }
.design-system-thumbnail.size-56  { width: var(--px-56); height: var(--px-56); }

.design-system-thumbnail.radius-100 { border-radius: 100px; } 
.design-system-thumbnail.radius-16  { border-radius: 16px; }
.design-system-thumbnail.radius-8   { border-radius: 8px; }
.design-system-thumbnail.radius-2   { border-radius: 2px; }