/* Only the four WORKS series dialogs own this scroll lock. */
html:has(#series-gallery[open]),
body:has(#series-gallery[open]) { overflow: hidden; }

/* The dialog remains the sole scroll container, including the full footer. */
#series-gallery {
  width: 100%;
  height: 100dvh;
  overscroll-behavior: contain;
}

/* Existing aspect-ratio:auto overrides the HTML width/height fallback.
   Reserve the exact source ratio, while keeping the loaded artwork uncropped. */
#series-gallery .series-gallery-item.artwork img {
  aspect-ratio: auto var(--work-image-ratio) !important;
}
@media (max-width: 700px) {
  #series-gallery .series-gallery-item.view img {
    aspect-ratio: auto var(--work-image-ratio) !important;
  }
}

/* Full-width bottom navigation, sized to the ABOUT page reference bar. */
#series-gallery { --series-bar-height: 84px; }
#series-gallery .series-gallery-shell {
  min-height: calc(100% - var(--series-bar-height));
  padding-bottom: 0;
}
#series-gallery > .series-gallery-footer {
  width: 100%;
  min-height: var(--series-bar-height);
  margin: 0;
  padding: 30px var(--pad);
}
@media (max-width: 640px) {
  #series-gallery > .series-gallery-footer { padding: 24px 18px; }
}
@media (max-width: 620px) {
  #series-gallery { --series-bar-height: 204px; }
  #series-gallery > .series-gallery-footer {
    flex-direction: column;
    justify-content: center;
    gap: 30px;
  }
}