/* R14 (D680–D683, D690): AdSense placements. Every slot has a fixed reserved
   size before the ad script runs (no inline styles: the page CSP forbids them
   outside ad pages, and sizes must not depend on the ad response). */
.ad-slot { display: flex; flex-direction: column; min-width: 0; }
.ad-label { flex: none; height: 16px; margin: 0 0 4px; font-size: 11px; line-height: 16px; letter-spacing: .04em; text-transform: uppercase; color: var(--color-base-content); opacity: .5; }
.ad-unit { display: block; flex: 1 1 auto; width: 100%; min-height: 0; overflow: hidden; }

/* List and related cards: column width, 4:5 (data-ratio 1.25 for masonry). */
.ad-card { display: block; width: 100%; margin-bottom: 1.5rem; break-inside: avoid; }
.ad-slot-card { aspect-ratio: 4 / 5; }
/* An unfilled card collapses; it is normally below the first screen. */
.ad-card:has(ins[data-ad-status="unfilled"]) { display: none; }

/* Detail rails (D682): shown only when the detail content box can keep a
   768px main column beside them; the below-image slot covers narrower boxes. */
.ad-detail { container-type: inline-size; }
.ad-rail { display: none; }
.ad-rail-sticky { position: sticky; top: 1rem; }
.ad-slot-rail { width: 160px; height: 620px; }
.ad-inline { margin: 1.5rem auto 0; max-width: 336px; }
.ad-slot-inline { width: 100%; height: 280px; }

@container (min-width: 1152px) {
  .ad-layout:is(.has-left, .has-right) { display: grid; column-gap: 2rem; grid-template-columns: minmax(0, 1fr); }
  .ad-layout.has-left { grid-template-columns: 160px minmax(0, 1fr); }
  .ad-layout.has-right { grid-template-columns: minmax(0, 1fr) 160px; }
  .ad-layout.has-left.has-right { grid-template-columns: 160px minmax(0, 1fr) 160px; }
  .ad-layout:is(.has-left, .has-right) > :first-child { grid-row: 1; grid-column: 1; }
  .ad-layout.has-left > :first-child, .ad-layout.has-left > .ad-main { grid-column: 2; }
  .ad-layout:is(.has-left, .has-right) > .ad-main { grid-row: 2; min-width: 0; }
  /* Rails start level with the image: 48px below the action buttons (D683 spacing). */
  .ad-layout .ad-rail { display: block; grid-row: 2; margin-top: 1.5rem; }
  .ad-layout .ad-rail-left { grid-column: 1; }
  .ad-layout .ad-rail-right { grid-column: -2; }
  .ad-layout:is(.has-left, .has-right) .ad-inline { display: none; }
}
@container (min-width: 1432px) {
  .ad-layout:not(.ad-layout-modal).has-left { grid-template-columns: 300px minmax(0, 1fr); }
  .ad-layout:not(.ad-layout-modal).has-right { grid-template-columns: minmax(0, 1fr) 300px; }
  .ad-layout:not(.ad-layout-modal).has-left.has-right { grid-template-columns: 300px minmax(0, 1fr) 300px; }
  .ad-layout:not(.ad-layout-modal) .ad-slot-rail { width: 300px; }
}