/* A clear view of the printed discs and cartridges at presentation scale. */
.apple-edition #payments .buyout-media-v12 { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 20px; }
.apple-edition #payments .buyout-media-v12 .steam-symbol-figure { grid-column: 1; grid-row: 1; }
.apple-edition #payments .buyout-media-v12 .disc-figure { grid-column: 2; grid-row: 1; }
.apple-edition #payments .buyout-media-v12 .cartridge-figure { grid-column: 1 / -1; grid-row: 2; }
.apple-edition #payments .buyout-media-v12 .steam-symbol-figure > a,
.apple-edition #payments .buyout-media-v12 .disc-figure > a { width: min(100%, 160px); height: 160px !important; margin-inline: auto; background: #fff; border-radius: 50%; overflow: hidden; }
.apple-edition #payments .buyout-media-v12 .disc-figure img { border-radius: 0; object-fit: contain; }
.apple-edition #payments .buyout-media-v12 .cartridge-figure > a { height: clamp(145px, 17svh, 215px); border-radius: 18px; overflow: hidden; }
.apple-edition #payments .buyout-media-v12 .cartridge-figure img { object-fit: cover; }
.apple-edition #payments .buyout-media-v12 figcaption { margin-top: 10px; }

/* A compact shared comparison grid; keep every logo and caption visible. */
.apple-edition :is(#payments, #payments-arcade) .mobile-roster {
  grid-template-columns: repeat(6, minmax(0, 1fr));
  gap: 14px 10px;
}
@media (max-width: 800px) {
  .apple-edition :is(#payments, #payments-arcade) { padding-block: 68px 20px; }
  .apple-edition :is(#payments, #payments-arcade) .mobile-roster { gap: 10px 8px; }
  .apple-edition #payments .buyout-media-v12 { grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 10px; }
  .apple-edition #payments .buyout-media-v12 > :is(.steam-symbol-figure, .disc-figure, .cartridge-figure) { grid-column: auto; grid-row: auto; }
  .apple-edition #payments .buyout-media-v12 .steam-symbol-figure > a,
  .apple-edition #payments .buyout-media-v12 .disc-figure > a,
  .apple-edition #payments .buyout-media-v12 .cartridge-figure > a { width: 100%; height: 70px !important; }
  .apple-edition :is(#payments, #payments-arcade) .compare-side { padding: 12px; }
  .apple-edition :is(#payments, #payments-arcade) .compare-side h4 { font-size: 25px; margin-bottom: 10px; }
  .apple-edition :is(#payments, #payments-arcade) .compare-side > p { padding-top: 10px; }
  .apple-edition :is(#payments, #payments-arcade) .mobile-roster figcaption { margin-top: 4px; }
}
