/* Real, configured advertisements only. No placeholder skins or dimensions. */
.gp-managed-ad[hidden] { display: none !important; }
.gp-managed-ad {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 6px;
  width: 100%;
  min-width: 0;
  margin: 20px 0;
  background: transparent;
  border: 0;
}
.gp-managed-ad-label { color: #94a3b8; font: 500 10px/1.4 sans-serif; text-transform: uppercase; letter-spacing: .07em; }
.gp-managed-ad-content { width: 100%; max-width: 100%; margin: 0 auto; text-align: center; }
/* Keep playable surfaces and controls away from clickable banner creatives. */
.gp-managed-ad--above { margin-bottom: 150px; }
.gp-managed-ad--below { margin-top: 150px; }
#game-cover.hidden { display: none !important; }
.gp-right-rail-slot:empty, .gp-ad-row:empty { display: none; }
.gp-header-ad { padding: 0 1rem; max-width: 1920px; margin: 0 auto; }
body:has(.gp-single-game-layout) .gp-header-ad:has(.gp-managed-ad:not([hidden])) { margin-bottom: 150px; }
.gp-managed-ad[data-gp-no-fill="1"] { display: none !important; }
@media (min-width: 1280px) {
  /* Only widen the gutter when a rail ad is actually visible. */
  .gp-main-grid:has(#game-sidebar-ad .gp-managed-ad:not([hidden])) { column-gap: 150px; }
}
.gp-blog-layout:not(:has(.gp-managed-ad:not([hidden]))) { grid-template-columns: minmax(0,1fr); }
.gp-blog-layout:not(:has(.gp-managed-ad:not([hidden]))) .gp-blog-content { grid-column: auto; }
.gp-blog-layout:not(:has(.gp-managed-ad:not([hidden]))) .gp-blog-ad-sidebar { display: none; }
@media (max-width: 1279px) {
  #game-sidebar-ad .gp-managed-ad { display: none !important; }
}

/* MyArcade screenshot gallery. */
.gp-screenshot-grid { display: grid; grid-template-columns: minmax(0, 1fr); align-items: start; gap: 1rem; padding: 1rem; }
.gp-screenshot-link { display: block; min-width: 0; overflow: hidden; border: 1px solid rgba(51,65,85,.85); border-radius: 12px; background: #020617; }
.gp-screenshot-link:focus-visible { outline: 2px solid #818cf8; outline-offset: 3px; }
.gp-screenshot-link img { display: block; width: 100%; height: auto; }
@media (min-width: 640px) {
  .gp-screenshot-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .gp-screenshot-link:only-child { grid-column: 1 / -1; }
}
