/* Viewport crop only: the downloaded official image bytes remain unchanged. */
.cat-item.cat-has-image > summary {
  display:grid;grid-template-columns:88px minmax(0,1fr);gap:12px;
  align-items:center;padding:12px 2px;
}
.cat-thumb {
  position:relative;display:block;width:88px;aspect-ratio:1;
  overflow:hidden;border-radius:8px;background:#f7f8f8;isolation:isolate;
}
.cat-thumb img {
  position:absolute;display:block;left:50%;top:50%;width:var(--crop-scale);
  height:auto;max-width:none;
  transform:translate(calc(-1 * var(--crop-x)),calc(-1 * var(--crop-y)));
  opacity:0;
}
.cat-thumb.is-loaded img {opacity:1}
.cat-thumb-placeholder {
  position:absolute;inset:0;display:flex;align-items:center;justify-content:center;
  padding:6px;text-align:center;font-size:10px;line-height:1.5;color:#929894;
}
.cat-thumb.is-loaded .cat-thumb-placeholder {display:none}
.cat-row-info {display:block;min-width:0;position:relative;padding-right:18px}
.cat-row-info .cat-c-buy {flex-wrap:wrap;row-gap:3px}
.cat-row-info > .cat-chev {position:absolute;right:0;top:3px;float:none!important}
.cat-image-credit {margin:10px 0 0;font-size:10px;color:#8b918d}
.cat-image-credit a {color:inherit;text-decoration:underline;text-underline-offset:2px}
@media(max-width:359px) {
  .cat-item.cat-has-image > summary {grid-template-columns:72px minmax(0,1fr);gap:10px}
  .cat-thumb {width:72px}
}
@media(min-width:768px) {
  .cat-item.cat-has-image > summary {grid-template-columns:96px minmax(0,1fr);gap:16px}
  .cat-thumb {width:96px}
  .cat-row-info {
    display:grid;grid-template-columns:minmax(145px,1.7fr) minmax(105px,1fr) minmax(90px,1fr) minmax(90px,1fr) 16px;
    gap:8px;align-items:center;padding-right:0;
  }
  .cat-row-info > .cat-chev {position:static}
  .cat-row-info > .cat-c-rt,.cat-row-info > .cat-c-diff {margin-right:0}
}