/* Scroll & Stone - image grammar: Folio Plate vs Evidence Figure.
   Apply .folio-plate / .evidence-figure to the containing figure or link
   wrapper (never to a bare <img>, and never globally to .article-figure -
   Folio is always an explicit per-entry decision, not a blanket style).
   The vignette mask targets only the descendant img: masking the wrapper
   itself would erase the halo (::before) sitting outside the mask's opaque
   region, and would fade out any caption living in the same wrapper. */

.folio-plate {
  position: relative;
  isolation: isolate;
  overflow: visible;
  box-shadow: 0 18px 34px rgba(58, 42, 20, 0.28);
}

/* Order-independent guard: .article-figure (style.css) sets overflow:hidden
   at the same specificity as .folio-plate's overflow:visible above, so
   whichever stylesheet loads last would otherwise win and could clip the
   gold halo. This two-class selector outranks either single-class rule
   regardless of <link> order. */
.article-figure.folio-plate {
  overflow: visible;
}

.folio-plate > img,
.folio-plate > picture > img {
  position: relative;
  z-index: 1;
  filter: sepia(0.16) saturate(1.16) contrast(1.04);
  -webkit-mask-image: radial-gradient(ellipse 78% 76% at 50% 48%, #000 56%, transparent 80%);
  mask-image: radial-gradient(ellipse 78% 76% at 50% 48%, #000 56%, transparent 80%);
}

.folio-plate::before {
  content: "";
  position: absolute;
  z-index: 0;
  inset: -12%;
  background: radial-gradient(ellipse, rgba(201, 162, 39, 0.2), transparent 68%);
  pointer-events: none;
}

.folio-plate .caption,
.folio-plate figcaption {
  position: relative;
  z-index: 2;
}

.evidence-figure,
.evidence-figure img {
  filter: none;
  object-fit: contain;
  -webkit-mask-image: none;
  mask-image: none;
}

.evidence-figure img { width: 100%; height: auto; }
