/* Picture wrappers preserve the existing image layout and focus targets. */
.yo-gallery-card > picture, .pc-note > picture { display: block; }
.yo-gallery-card > picture[style] > .yo-gallery-cover { background-color: transparent !important; }
.pc-story-gallery .swiper-slide > picture { display:block;width:100%;height:100%; }
.pc-story-gallery .swiper-slide { background-size:cover;background-position:center;background-repeat:no-repeat; }
.pc-story-gallery img { cursor:default; }
.yo-marketplace .card.yo-gallery-card > picture > .yo-gallery-cover { display: block; width: 100%; height: auto !important; aspect-ratio: 4/3; object-position: center; background: #faf1f5; border-radius: 0; }
.avatar-line > picture, .pc-note-meta > picture, .pc-identity > picture { flex-shrink: 0; }
.pc-main-photo > picture { display: block; width: 100%; height: 100%; }
.pc-main-photo > picture > img { display: block; width: 100%; height: 100%; object-fit: contain; }
.pc-thumbs picture, .yo-product-image picture { display: block; width: 100%; height: 100%; }

/* Keep the frame in charge of sizing, independent of each source's dimensions. */
.yo-marketplace .yo-product-image {
  position: relative;
  width: 100%;
  aspect-ratio: 1 / 1;
  background: #fff;
}
.yo-marketplace .yo-product-image > picture {
  position: absolute;
  inset: 0;
  display: block;
  width: 100%;
  height: 100%;
  min-width: 0;
}
.yo-marketplace .yo-product-image > picture > img {
  display: block;
  width: 100%;
  height: 100%;
  object-fit: contain;
  object-position: center;
}
.yo-marketplace .yo-product-layout {
  grid-template-columns: minmax(0, 480px) minmax(0, 1fr);
  gap: clamp(24px, 4vw, 48px);
}
.yo-marketplace .yo-product-gallery { width: 100%; max-width: 480px; }
.yo-marketplace .yo-product-image-large { height: auto; max-height: none; aspect-ratio: 1 / 1; }
@media (min-width: 901px) and (max-width: 1023px) {
  .yo-marketplace .yo-product-layout { grid-template-columns: minmax(0, 420px) minmax(0, 1fr); gap: 28px; }
}
@media (max-width: 900px) {
  .yo-marketplace .yo-product-layout { grid-template-columns: minmax(0, 1fr); gap: 24px; }
  .yo-marketplace .yo-product-gallery { max-width: 420px; margin-inline: auto; }
}
@media (max-width: 768px) {
  .yo-marketplace .yo-product-layout { gap: 20px; }
  .yo-marketplace .yo-product-gallery { max-width: 360px; }
}
