.riko-image-sheet-frame { display:block; position:absolute; inset:0; overflow:hidden; container-type:size }
.riko-image-sheet-frame > span { display:block; position:absolute; inset:0 }
.riko-image-sheet-frame > span > img { display:block; position:absolute; inset:0; width:100%; height:100%; max-width:none; max-height:none; object-fit:cover }
.riko-image-sheet-frame > .riko-image-sheet > img {
  --riko-tile-width:max(100cqw,160cqh);
  width:calc(var(--riko-tile-width)*4);
  height:calc(var(--riko-tile-width)*.625*var(--riko-sheet-rows));
  left:calc(var(--riko-sheet-column)*-1*var(--riko-tile-width) + (100cqw - var(--riko-tile-width))*.5);
  top:calc(var(--riko-sheet-row)*-.625*var(--riko-tile-width) + (100cqh - var(--riko-tile-width)*.625)*.5);
  right:auto; bottom:auto; object-fit:fill;
}

.riko-image-sheet-frame img[hidden] { display:none }

/* Catalogue slots are always wider than their 16:10 tile. Intrinsic image
   sizing avoids size-query containers on the long, filter-heavy results page. */
.riko-catalog__card-image > .riko-image-sheet-frame { container-type:normal }
.riko-catalog__card-image .riko-image-sheet > img {
  width:400%; height:auto; left:calc(var(--riko-sheet-column)*-100%); top:50%;
  transform:translateY(calc((var(--riko-sheet-row) + .5)/var(--riko-sheet-rows)*-100%));
}
