.jm-gallery {
	container-type: inline-size;
	width: 100%;
}

.jm-row {
	display: grid;
	grid-template-columns: repeat(3, minmax(0, 1fr));
	gap: 0.5rem;
	margin-block: 0.5rem;
}

.jm-gallery .jm-item {
	aspect-ratio: var(--jm-item-ratio, 1 / 1);
	display: block;
	overflow: hidden;
}

.jm-gallery .jm-image {
	display: block;
	height: 100%;
	object-fit: cover;
	object-position: var(--jm-focal-x, 50%) var(--jm-focal-y, 50%);
	width: 100%;
}

@container (max-width: 34rem) {
	.jm-row {
		grid-template-columns: minmax(0, 1fr);
	}
	.jm-gallery .jm-empty { display: none; }
}

@media (max-width: 34rem) {
	.jm-row {
		grid-template-columns: minmax(0, 1fr);
	}
	.jm-gallery .jm-empty { display: none; }
}

/* Explicit crops map the full source into the existing row viewport at any size. */
.jm-gallery .jm-item { position: relative; }
.jm-gallery .jm-item .jm-cropped-image { position: absolute; max-width: none; max-height: none; object-fit: fill; margin: 0; }

/* Mirror the clipped viewport, preserving canonical source-space positioning. */
.jm-gallery .jm-item.jm-flipped, .jm-editor .jm-slot-target.jm-flipped { transform: scaleX(-1); }