.promotion-preview-notice { position: relative; z-index: 80; margin: 0; padding: .75rem 1rem; background: #122236; color: #fff; text-align: center; font-size: .85rem; }
.promotion-preview-notice a { color: #8feaff; margin-inline-start: 1rem; }
.promotion-layout { display: grid; grid-template-columns: minmax(0, 1fr); }
.promotion-layout > main { min-width: 0; }
.promotion-rail { display: grid; gap: 1rem; align-content: start; min-width: 0; margin: 1.5rem auto; width: min(100% - 2rem, 24rem); }
.promotion-rail-pair { grid-template-columns: repeat(2, minmax(0, 1fr)); align-items: start; width: min(100% - 2rem, 49rem); }
.promotion-card { min-width: 0; width: fit-content; max-width: 100%; margin-inline: auto; overflow: hidden; border: 1px solid var(--line); border-radius: 1rem; background: var(--panel); }
.promotion-label { display: block; padding: .55rem .8rem; color: var(--muted); font-size: .65rem; font-weight: 650; letter-spacing: .13em; text-transform: uppercase; }
.promotion-rail-pair .promotion-label { padding: .5rem .6rem; font-size: .6rem; letter-spacing: .1em; }
.promotion-card a { display: block; }
.promotion-card a:focus-visible { outline: 3px solid var(--cyan); outline-offset: -3px; }
.promotion-card img { display: block; width: auto; max-width: 100%; height: auto; max-height: min(24rem, 50svh); object-fit: contain; }
@media (min-width: 105rem) {
  /* Keep the page and its backgrounds full width; banners share the same row in the outer margins. */
  .promotion-layout { grid-template-columns: minmax(1rem, 1fr) minmax(0, 24rem) calc(var(--shell, 76rem) + 3rem) minmax(0, 24rem) minmax(1rem, 1fr); align-items: start; isolation: isolate; direction: ltr; }
  .promotion-layout > main { grid-column: 1 / -1; grid-row: 1; z-index: 0; }
  .promotion-rail { position: sticky; top: 7rem; z-index: 1; grid-row: 1; grid-template-columns: minmax(0, 1fr); width: 100%; margin: 2rem 0; }
  .promotion-rail-left { grid-column: 2; }
  .promotion-rail-right { grid-column: 4; }
  .promotion-card img { max-height: calc(100svh - 10rem); }
  .promotion-rail-pair .promotion-card img { max-height: calc((100svh - 14rem) / 2); }
}
@media print { .promotion-rail { display: none; } .promotion-layout { display: block; } }
