/* Soft light without additional image requests or changes to the gallery items. */
.post-gallery-block:has(> .mk-gallery-preview[data-preview-count]:not([data-preview-count="0"])) {
  position: relative;
  isolation: isolate;
  padding: 20px 0 16px;
}
.post-gallery-block > .mk-gallery-preview[data-preview-count]:not([data-preview-count="0"])::before {
  content: '';
  display: block;
  position: absolute;
  inset: -36px 0;
  z-index: -1;
  pointer-events: none;
  background: rgba(10, 12, 16, .60);
  /* Broad charcoal glow under the mosaic; every edge feathers into the page. */
  -webkit-mask-image: linear-gradient(to right, transparent, #000 12%, #000 88%, transparent), linear-gradient(transparent, #000 25%, #000 75%, transparent);
  -webkit-mask-composite: source-in;
  mask-image: linear-gradient(to right, transparent, #000 12%, #000 88%, transparent), linear-gradient(transparent, #000 25%, #000 75%, transparent);
  mask-composite: intersect;
  filter: blur(18px);
}
.post-gallery-block > .mk-gallery-preview[id] {
  position: relative;
  isolation: isolate;
  overflow: visible;
}
.post-gallery-block > p.mk-gallery-description {
  white-space: pre-line;
}
.post-gallery-block > .mk-gallery-preview[id] > div[data-src] {
  overflow: visible;
  background: transparent;
}
.post-gallery-block > .mk-gallery-preview[id] > div[data-src] > a {
  position: relative;
  border-radius: 6px;
  background: #edede7;
  box-shadow: 0 2px 8px rgba(32, 40, 44, .08);
  transition: transform .28s cubic-bezier(.2,.7,.2,1), box-shadow .28s ease;
}
.post-gallery-block > .mk-gallery-preview[id] > div[data-src]:focus-within {
  z-index: 2;
}
.post-gallery-block > .mk-gallery-preview[id] > div[data-src] > a:focus-visible {
  outline: 3px solid #727c53;
  outline-offset: 3px;
  box-shadow: 0 8px 24px rgba(32, 40, 44, .2);
}
.post-gallery-block .mk-gallery-open {
  border-radius: 8px;
  box-shadow: 0 3px 12px rgba(107, 120, 83, .1);
  transition: transform .22s ease, box-shadow .22s ease, background .22s ease;
}
/* Real mouse events work on hybrid devices whose primary pointer is touch. */
body:not(.lg-on) .post-gallery-block > .mk-gallery-preview[id] > div[data-src].mk-preview-hover {
  z-index: 3;
}
body:not(.lg-on) .post-gallery-block > .mk-gallery-preview[id] > div[data-src].mk-preview-hover > a {
  transform: translate(var(--mk-magnet-x, 0px), var(--mk-magnet-y, 0px)) scale(1.10);
  box-shadow: 0 10px 26px rgba(26, 35, 43, .16), 0 0 0 1px rgba(255,255,255,.75);
}
@media (hover: hover) {
  body:not(.lg-on) .post-gallery-block > .mk-gallery-preview[id] > div[data-src]:hover {
    z-index: 3;
  }
  body:not(.lg-on) .post-gallery-block > .mk-gallery-preview[id] > div[data-src]:hover > a {
    transform: translate(var(--mk-magnet-x, 0px), var(--mk-magnet-y, 0px)) scale(1.10);
    box-shadow: 0 10px 26px rgba(26, 35, 43, .16), 0 0 0 1px rgba(255,255,255,.75);
  }
  .post-gallery-block > .mk-gallery-preview[id] > div[data-src] > a:hover img {
    transform: none;
    filter: brightness(1.04) contrast(1.02);
  }
  .post-gallery-block .mk-gallery-open:hover {
    transform: translateY(-2px);
    box-shadow: 0 8px 24px rgba(107, 120, 83, .22);
  }
}
body:not(.lg-on) .post-gallery-block > .mk-gallery-preview[id] > div[data-src].mk-preview-hover > a img {
  transform: none;
}
/* Neutralize the theme's earlier image-only hover on touch and reduced motion. */
@media (hover: none), (pointer: coarse), (prefers-reduced-motion: reduce) {
  .post-gallery-block > .mk-gallery-preview[id] > div[data-src] > a:hover img {
    transform: none;
  }
}
@media (prefers-reduced-motion: reduce) {
  .post-gallery-block > .mk-gallery-preview[id] > div[data-src] > a,
  .post-gallery-block .mk-gallery-open { transition: none; }
}
