.container {
	display: flex;
	align-items: center;
}

.root {
	display: grid;
	place-items: center;
	overflow: hidden;
	-webkit-user-select: none;
	   -moz-user-select: none;
	        user-select: none;
	border-radius: var(--component-radii-pill);
	border: var(--component-border-width-lg) solid var(--stroke-subtle);
}

.root-default-width {
	width: var(--size-150);
	height: var(--size-150);
}

.root-square {
	border-radius: var(--component-radii-md);
}

.root-square .image {
		border-radius: 0;
	}

.image {
	width: 100%;
	height: 100%;
	-o-object-fit: cover;
	   object-fit: cover;
	border-radius: inherit;
}

.fallback {
	width: 100%;
	height: 100%;
	display: flex;
	align-items: center;
	justify-content: center;
	font: var(--font-label-xs);
}

.holder:not(:first-child) {
	margin-left: calc(var(--component-spacing-xs) * -1);
}

.holder .root {
	border: var(--component-border-width-md) solid var(--stroke-subtle);
}
