/* Reserve close to Google's own auto-responsive size up front (it sets an inline height on .adsbygoogle
   once its script processes the slot, before fill is known) so neither that sizing pass nor a later
   "unfilled" result visibly shifts the page. */
.publisher-ad { box-sizing: border-box; position: relative; width: 100%; min-width: 0; min-height: 310px; margin: 48px auto; padding: 28px 0 0; border-top: 1px solid var(--border, #d6d7df); text-align: center; clear: both; }
.publisher-ad-label { position: absolute; top: 6px; left: 0; color: var(--muted, #626575); font: 400 12px/1.4 system-ui, sans-serif; }
.publisher-ad > .adsbygoogle { display: block; width: 100%; min-height: 280px; }
/* Once Google confirms there's no ad to show, collapse the reserved space instead of leaving a
   blank (usually white, theme-unaware) box behind — most visible against the dark theme. */
.publisher-ad[data-ad-state="unfilled"], .publisher-ad[data-ad-state="error"] { min-height: 0; margin: 0; padding: 0; border-top-color: transparent; }
.publisher-ad[data-ad-state="unfilled"] .publisher-ad-label, .publisher-ad[data-ad-state="error"] .publisher-ad-label { visibility: hidden; }
/* !important: Google's script sets a conflicting inline `style="display:block"` on this element
   once it decides the slot is unfilled, which otherwise wins over any plain stylesheet rule. */
.publisher-ad[data-ad-state="unfilled"] > .adsbygoogle, .publisher-ad[data-ad-state="error"] > .adsbygoogle { display: none !important; }
@media (max-width: 600px) { .publisher-ad { min-height: 420px; } .publisher-ad > .adsbygoogle { min-height: 390px; } }