/* Load after main-binder.css. Native-alpha paintings reveal the actual page paper. */
body.main-binder :is(.cover-art-bg, .spread-art, .art-break-img, .art-break-text) {
  min-width: 0;
  border: 0;
  border-image: none;
  border-radius: 0;
  background: transparent;
  box-shadow: none;
  padding: 0;
}

body.main-binder :is(.cover-art-bg, .spread-art, .art-break-img) {
  width: 100%;
  overflow: visible;
  opacity: 1;
  filter: none;
}

/* Remove edge decoration only; do not erase CSS-generated labels. */
body.main-binder :is(.cover-art-bg, .spread-art, .art-break-img, .art-break-text)::before {
  border: 0;
  border-image: none;
  background: transparent;
  box-shadow: none;
}

body.main-binder :is(.cover-art-bg, .spread-art, .art-break-img) > img {
  display: block;
  width: 100%;
  max-width: 100%;
  height: auto;
  max-height: none;
  aspect-ratio: auto;
  object-fit: contain;
  opacity: 1;
  filter: none;
  border: 0;
  background: transparent;
  box-shadow: none;
}

/* Live captions remain in normal flow, below rather than over the painting. */
body.main-binder .spread-art > .spread-caption {
  display: block;
  position: static;
  inset: auto;
  padding: 12px 0 0;
  color: var(--faded-ink);
  background: transparent;
  opacity: 1;
  text-transform: none;
  overflow-wrap: anywhere;
}

body.main-binder .art-break-text {
  padding: 16px 0;
}

@media (max-width: 720px) {
  body.main-binder .spread-art > .spread-caption { padding-top: 10px; }
  body.main-binder .art-break-text { padding: 8px 0; }
}