/* (unused) .image-container {
		height: 100%;
		position: relative;
	}*/
	/* (unused) .image-container img,*/
	button.svelte-7anmrz {
		width: var(--size-full);
		height: var(--size-full);
		object-fit: contain;
		display: block;
		border-radius: var(--radius-lg);
	}

	.preview.svelte-7anmrz {
		display: flex;
		position: absolute;
		flex-direction: column;
		z-index: var(--layer-2);
		border-radius: calc(var(--block-radius) - var(--block-border-width));
		-webkit-backdrop-filter: blur(8px);
		backdrop-filter: blur(8px);
		width: var(--size-full);
		height: var(--size-full);
	}

	.preview.minimal.svelte-7anmrz {
		width: fit-content;
		height: fit-content;
	}

	.preview.svelte-7anmrz::before {
		content: "";
		position: absolute;
		z-index: var(--layer-below);
		background: var(--background-fill-primary);
		opacity: 0.9;
		width: var(--size-full);
		height: var(--size-full);
	}

	.fixed-height.svelte-7anmrz {
		min-height: var(--size-80);
		max-height: 55vh;
	}

	@media (--screen-xl) {
		.fixed-height.svelte-7anmrz {
			min-height: 450px;
		}
	}

	.media-button.svelte-7anmrz {
		height: calc(100% - 60px);
		width: 100%;
		display: flex;
	}
	.media-button.svelte-7anmrz img,
	.media-button.svelte-7anmrz video {
		width: var(--size-full);
		height: var(--size-full);
		object-fit: contain;
	}
	.thumbnails.svelte-7anmrz img {
		object-fit: cover;
		width: var(--size-full);
		height: var(--size-full);
	}
	.thumbnails.svelte-7anmrz svg {
		position: absolute;
		top: var(--size-2);
		left: var(--size-2);
		width: 50%;
		height: 50%;
		opacity: 50%;
	}
	.preview.svelte-7anmrz img.with-caption {
		height: var(--size-full);
	}

	.preview.minimal.svelte-7anmrz img.with-caption {
		height: auto;
	}

	/* (unused) .selectable {
		cursor: crosshair;
	}*/

	.caption.svelte-7anmrz {
		padding: var(--size-2) var(--size-3);
		overflow: hidden;
		color: var(--block-label-text-color);
		font-weight: var(--weight-semibold);
		text-align: center;
		text-overflow: ellipsis;
		white-space: nowrap;
		align-self: center;
	}

	.thumbnails.svelte-7anmrz {
		display: flex;
		position: absolute;
		bottom: 0;
		justify-content: flex-start;
		align-items: center;
		gap: var(--spacing-lg);
		width: var(--size-full);
		height: var(--size-14);
		overflow-x: scroll;
	}

	.thumbnail-item.svelte-7anmrz {
		--ring-color: transparent;
		position: relative;
		box-shadow:
			inset 0 0 0 1px var(--ring-color),
			var(--shadow-drop);
		border: 1px solid var(--border-color-primary);
		border-radius: var(--button-small-radius);
		background: var(--background-fill-secondary);
		aspect-ratio: var(--ratio-square);
		width: var(--size-full);
		height: var(--size-full);
		overflow: clip;
	}

	.thumbnail-item.svelte-7anmrz:hover {
		--ring-color: var(--color-accent);
		border-color: var(--color-accent);
		filter: brightness(1.1);
	}

	.thumbnail-item.selected.svelte-7anmrz {
		--ring-color: var(--color-accent);
		border-color: var(--color-accent);
	}

	.thumbnail-item.svelte-7anmrz svg {
		position: absolute;
		top: 50%;
		left: 50%;
		width: 50%;
		height: 50%;
		opacity: 50%;
		transform: translate(-50%, -50%);
	}

	.thumbnail-item.svelte-7anmrz video {
		width: var(--size-full);
		height: var(--size-full);
		overflow: hidden;
		object-fit: cover;
	}

	.thumbnail-small.svelte-7anmrz {
		flex: none;
		transform: scale(0.9);
		transition: 0.075s;
		width: var(--size-9);
		height: var(--size-9);
	}
	.thumbnail-small.selected.svelte-7anmrz {
		--ring-color: var(--color-accent);
		transform: scale(1);
		border-color: var(--color-accent);
	}

	/* (unused) .thumbnail-small > img {
		width: var(--size-full);
		height: var(--size-full);
		overflow: hidden;
		object-fit: var(--object-fit);
	}*/

	.grid-wrap.svelte-7anmrz {
		position: relative;
		padding: var(--size-2);
		overflow-y: scroll;
	}

	.grid-container.svelte-7anmrz {
		display: grid;
		position: relative;
		grid-template-rows: repeat(var(--grid-rows), minmax(100px, 1fr));
		grid-template-columns: repeat(var(--grid-cols), minmax(100px, 1fr));
		grid-auto-rows: minmax(100px, 1fr);
		gap: var(--spacing-lg);
	}

	.thumbnail-lg.svelte-7anmrz > img {
		width: var(--size-full);
		height: var(--size-full);
		overflow: hidden;
		object-fit: var(--object-fit);
	}

	.thumbnail-lg.svelte-7anmrz:hover .caption-label:where(.svelte-7anmrz) {
		opacity: 0.5;
	}

	.caption-label.svelte-7anmrz {
		position: absolute;
		right: var(--block-label-margin);
		bottom: var(--block-label-margin);
		z-index: var(--layer-1);
		border-top: 1px solid var(--border-color-primary);
		border-left: 1px solid var(--border-color-primary);
		border-radius: var(--block-label-radius);
		background: var(--background-fill-secondary);
		padding: var(--block-label-padding);
		max-width: 80%;
		overflow: hidden;
		font-size: var(--block-label-text-size);
		text-align: left;
		text-overflow: ellipsis;
		white-space: nowrap;
	}

	.grid-wrap.minimal.svelte-7anmrz {
		padding: 0;
	}

	.gallery-item.svelte-7anmrz {
		position: relative;
		width: 100%;
		height: 100%;
	}

	.delete-button.svelte-7anmrz {
		position: absolute;
		bottom: 0;
		left: 0;
		z-index: var(--layer-1);
		border-top: 1px solid var(--border-color-primary);
		border-right: 1px solid var(--border-color-primary);
		border-radius: 0 var(--radius-sm) 0 var(--radius-sm);
		background: var(--background-fill-secondary);
		padding: var(--block-label-padding);
		cursor: pointer;
		display: flex;
		align-items: center;
		justify-content: center;
		opacity: 0;
		transition: opacity 0.2s ease;
		font-size: var(--block-label-text-size);
		color: var(--block-label-text-color);
		font-weight: var(--weight-semibold);
		width: auto;
		height: auto;
		min-width: fit-content;
		min-height: fit-content;
	}

	.gallery-item.svelte-7anmrz:hover .delete-button:where(.svelte-7anmrz) {
		opacity: 1;
	}

	.delete-button.svelte-7anmrz:hover {
		opacity: 0.8;
	}

	.delete-button.svelte-7anmrz svg {
		width: var(--text-xs);
		height: var(--text-md);
		color: var(--block-label-text-color);
	}