/* Preserve original artwork and typography inside a consistent navy frame. */
.game-image img { object-position: var(--art-position, center); }
.game-image.native-cover img { object-fit: contain; max-width: 200px; margin: auto; }
.detail-hero-frame {
  display: grid;
  place-items: center;
  border: 1px solid #2a4168;
  background: radial-gradient(ellipse at 50% 50%, #202450, #071b35 78%);
}
.detail-hero-frame .detail-hero,
.detail-hero-frame .detail-hero.olympus-hero {
  display: block;
  width: 100%;
  height: auto;
  max-height: 560px;
  aspect-ratio: 16 / 9;
  object-fit: scale-down;
  object-position: center;
  background: transparent;
  border-radius: 0;
}
.detail-hero-frame.native-artwork { min-height: 310px; padding: 22px; }
.detail-hero-frame.native-artwork .detail-hero {
  width: min(100%, var(--native-art-width, 200px));
  max-height: 267px;
  aspect-ratio: auto;
}
.detail-thumbnails img {
  display: block;
  object-fit: contain;
  background: #0a203c;
}
.theme-light .lp-reading-hero.lp-image-contain { object-fit: scale-down; }
.detail-gallery { grid-template-columns: repeat(auto-fit, minmax(120px, 230px)); }
.detail-gallery img { height: 125px; }
.detail-gallery > button.selected { border-color: #f5d95c; }
.promotion-card img, .promotion-cover {
  object-fit: contain;
  height: auto;
  aspect-ratio: auto;
}
.provider-card { display: flex; flex-direction: column; align-items: center; }
.provider-card img {
  width: min(100%, var(--logo-width, 220px));
  height: 70px;
  object-fit: contain;
}
.provider-detail-logo { width: min(100%, var(--logo-width, 220px)); height: 80px; }
.provider-strip { grid-template-columns: repeat(4, minmax(0, 1fr)); }
.provider-strip img { width: min(100%, var(--logo-width, 190px)); max-height: 46px; }
.provider-overview {
  grid-column: 1 / -1;
  display: grid;
  grid-template-columns: minmax(0, 1.1fr) minmax(0, 1fr);
  align-items: center;
  gap: 36px;
  margin: 32px 0;
  border: 1px solid #25486d;
  border-radius: 14px;
  overflow: hidden;
  background: #09233f;
}
.provider-overview > img { display: block; width: 100%; height: auto; }
.provider-overview-copy { padding: 26px 30px 26px 0; }
.provider-overview h2 { font-size: 25px; margin-bottom: 12px; }
.provider-overview p { font-size: 15px; line-height: 1.7; color: #c5d2e4; margin: 0 0 20px; }
.provider-overview-actions { display: flex; flex-wrap: wrap; gap: 12px; }
.theme-light .lp-image-logo { background: #0a1e3b; }
.theme-light .lp-topic-cover.lp-image-logo > img { object-fit: scale-down; padding: 32px; }
.theme-light .lp-reading-hero.lp-image-logo { object-fit: scale-down; padding: 60px; }
@media (max-width: 760px) {
  .detail-hero-frame .detail-hero { max-height: none; aspect-ratio: 4 / 3; }
  .detail-hero-frame.native-artwork { min-height: 290px; }
  .detail-gallery { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .detail-gallery img { height: 95px; }
  .detail-thumbnails img { height: 110px; }
  .provider-strip { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .provider-overview { grid-template-columns: 1fr; gap: 0; }
  .provider-overview-copy { padding: 24px; }
  .provider-overview h2 { font-size: 22px; }
  .theme-light .lp-topic-cover.lp-image-logo > img { padding: 16px; }
  .theme-light .lp-reading-hero.lp-image-logo { padding: 30px; }
}