/* Shared article/CV geometry; news keeps a constrained reading column without a rail. */
:root {
  --puaro-article-reading-width: 770px;
  --puaro-article-ad-gap: 32px;
  --puaro-article-rail-top: 24px;
  --puaro-article-anchor-label: 400 11px/18px var(--puaro-grotesque);
  --puaro-article-banner-caption: 400 12px/18px var(--puaro-grotesque);
}
.puaro-single--article-ads:not(.puaro-single--cv) { display: block; }
.puaro-single--article-ads > .puaro-single-content { width: 100%; max-width: var(--puaro-article-reading-width); margin-inline: auto; }
.puaro-article-ad-rail { display: none; min-width: 0; }
/* The reading column, rather than the viewport, determines the inline creative. */
.puaro-single--article-ads :is(.puaro-entry, .puaro-article-ad-fallback), .puaro-cv-directory { container: puaro-ad-layout / inline-size; }
:is(.puaro-entry, .puaro-article-ad-fallback) > [data-ad-slot="article-in-content"] {
  position: relative; left: 50%; transform: translateX(-50%);
  width: 300px; max-width: calc(100vw - 16px); margin: var(--puaro-article-ad-gap) 0;
}
:is(.puaro-entry, .puaro-article-ad-fallback) > [data-ad-slot="article-in-content"] .puaro-ad-simulation { width: 300px; height: 250px; }
/* Reserve the same dimensions before JavaScript starts and when it is disabled. */
@container puaro-ad-layout (min-width: 728px) {
  :is(.puaro-single--article-ads, .puaro-cv-directory) :is([data-ad-slot="article-in-content"], [data-ad-slot="cv-directory-top"]) { width: 728px; }
  :is(.puaro-single--article-ads, .puaro-cv-directory) :is([data-ad-slot="article-in-content"], [data-ad-slot="cv-directory-top"]) .puaro-ad-simulation {
    width: 728px; height: 90px; display: grid; grid-template-columns: 1fr auto;
    align-content: center; gap: 0 var(--puaro-ui-gap); padding: 8px 16px;
    font: var(--puaro-ui-control-font); text-align: left;
  }
  :is(.puaro-single--article-ads, .puaro-cv-directory) :is([data-ad-slot="article-in-content"], [data-ad-slot="cv-directory-top"]) .puaro-ad-simulation > span:first-child { grid-column: 1; grid-row: 1; }
  :is(.puaro-single--article-ads, .puaro-cv-directory) :is([data-ad-slot="article-in-content"], [data-ad-slot="cv-directory-top"]) .puaro-ad-simulation strong { grid-column: 1; grid-row: 2; font: var(--puaro-ui-control-font); }
  :is(.puaro-single--article-ads, .puaro-cv-directory) :is([data-ad-slot="article-in-content"], [data-ad-slot="cv-directory-top"]) [data-ad-dimensions] { grid-column: 2; grid-row: 1 / span 2; align-self: center; text-align: right; }
  :is(.puaro-single--article-ads, .puaro-cv-directory) :is([data-ad-slot="article-in-content"], [data-ad-slot="cv-directory-top"]) small { grid-row: 3; font: var(--puaro-article-banner-caption); }
  :is(.puaro-single--article-ads, .puaro-cv-directory) :is([data-ad-slot="article-in-content"], [data-ad-slot="cv-directory-top"]) small:last-child { grid-column: 2; text-align: right; }
}
@media (min-width: 1100px) {
  .puaro-single--article-ads:has(> .puaro-article-ad-rail:not([data-ad-unavailable="true"])) {
    display: grid; grid-template-columns: minmax(0,770fr) minmax(300px,370fr); gap: 30px;
  }
  .puaro-article-ad-rail { display: block; align-self: start; }
  .puaro-article-ad-rail[data-ad-unavailable="true"] { display: none; }
  .puaro-article-ad-rail > .puaro-ad-slot { width: 300px; margin-inline: auto; }
  .puaro-article-ad-rail .puaro-ad-simulation { width: 300px; height: 250px; }
  .puaro-article-ad-rail[data-ad-bounded] > .puaro-ad-slot:not([data-ad-sticky="false"]) {
    position: sticky; top: var(--puaro-article-rail-top);
  }
}
@media (max-width: 727px) {
  /* Fifty pixels allows two readable lines and a full-size close control. */
  .puaro-ad-article [data-ad-slot="site-anchor"] .puaro-ad-simulation { height: 50px; padding-block: 4px; font: var(--puaro-article-anchor-label); }
  .puaro-ad-article [data-ad-slot="site-anchor"] .puaro-ad-simulation strong { display: none; }
}

/* The CV directory leaderboard belongs below its heading, outside the card grid. */
.puaro-cv-directory:has(> [data-ad-slot="cv-directory-top"] .puaro-ad-simulation) .puaro-cv-heading {
  padding-bottom: 0; margin-bottom: 0;
}
.puaro-cv-directory > [data-ad-slot="cv-directory-top"] {
  position: relative; left: 50%; transform: translateX(-50%);
  width: max(100%, 300px); max-width: calc(100vw - 16px);
}
.puaro-cv-directory > [data-ad-slot="cv-directory-top"] .puaro-ad-simulation { width: 300px; height: 250px; }
@container puaro-ad-layout (min-width: 728px) {
  .puaro-cv-directory > [data-ad-slot="cv-directory-top"] .puaro-ad-simulation { width: 728px; height: 90px; }
}
@container puaro-ad-layout (min-width: 970px) {
  .puaro-cv-directory > [data-ad-slot="cv-directory-top"] .puaro-ad-simulation {
    width: 970px; height: 250px; display: flex; gap: var(--puaro-ui-gap);
    font: var(--puaro-dialog-description); text-align: center;
  }
  .puaro-cv-directory > [data-ad-slot="cv-directory-top"] strong { font: var(--puaro-dialog-heading); }
  .puaro-cv-directory > [data-ad-slot="cv-directory-top"] [data-ad-dimensions],
  .puaro-cv-directory > [data-ad-slot="cv-directory-top"] small:last-child { text-align: center; }
}

.puaro-cv-directory > [data-ad-slot="cv-directory-top"]:has(.puaro-ad-simulation) {
  height: auto; min-height: 0; overflow: visible; margin-block: var(--puaro-article-ad-gap);
}
