.lightbox-trigger { cursor: zoom-in; }
.lightbox-trigger:focus-visible { outline: 2px solid var(--accent, #25819a); outline-offset: 4px; }
.theme-article-image > .lightbox-trigger, .hero-banner > .lightbox-trigger { display: block; }
.gallery-item.lightbox-trigger { display: block; text-decoration: none; transition: border-color .18s ease, transform .18s ease; }
.gallery-item.lightbox-trigger:hover { border-color: var(--accent, #25819a); transform: translateY(-3px); }
.content-lightbox { position: fixed; inset: 0; width: min(calc(100vw - 24px), 1400px); max-width: none; max-height: none; height: min(calc(100dvh - 24px), 960px); padding: 0; border: 1px solid rgba(255,255,255,.18); border-radius: 18px; background: #0b1c25; color: #f5fafb; box-shadow: 0 28px 90px rgba(0,0,0,.5); }
.content-lightbox::backdrop { background: rgba(4,15,21,.86); backdrop-filter: blur(5px); }
.content-lightbox__panel { position: relative; display: grid; grid-template-columns: 64px minmax(0,1fr) 64px; align-items: center; width: 100%; height: 100%; padding: 54px 10px 40px; }
.content-lightbox figure { display: grid; grid-column: 2; align-content: center; justify-items: center; gap: 12px; min-width: 0; min-height: 0; max-height: 100%; margin: 0; }
.content-lightbox figure img { display: block; max-width: 100%; max-height: min(calc(100dvh - 160px), 800px); width: auto; height: auto; object-fit: contain; border-radius: 6px; }
.content-lightbox figcaption { color: #c7dce2; font-size: 14px; line-height: 1.4; text-align: center; }
.content-lightbox button { display: grid; place-items: center; width: 42px; height: 42px; padding: 0; border: 1px solid rgba(255,255,255,.25); border-radius: 50%; background: rgba(255,255,255,.1); color: #fff; font-size: 32px; line-height: 1; cursor: pointer; }
.content-lightbox button:hover { background: rgba(255,255,255,.22); }
.content-lightbox button:focus-visible { outline: 2px solid #9cdeea; outline-offset: 3px; }
.content-lightbox__close { position: absolute; top: 10px; right: 12px; z-index: 1; }
.content-lightbox__previous { grid-column: 1; justify-self: center; }
.content-lightbox__next { grid-column: 3; justify-self: center; }
.content-lightbox__counter { position: absolute; right: 24px; bottom: 12px; color: #c7dce2; font-size: 13px; }
.content-lightbox [hidden] { display: none !important; }
@media (max-width: 600px) { .content-lightbox__panel { grid-template-columns: 42px minmax(0,1fr) 42px; padding-inline: 2px; } .content-lightbox button { width: 36px; height: 36px; } .content-lightbox figure img { max-height: calc(100dvh - 140px); } }

/* Preserve the whole artwork and put the border against the image, not a padded frame. */
:root main :is(
  .review-structure__proof-image img, .review-structure__gallery img,
  .seo-link-card > img, .blog-card-link > img,
  .seo-article-main .theme-article-image img,
  .theme-prose img:not(.ui-icon), .wp-block-image img,
  .single-ai_collection .hero-banner .banner-img
) {
  display: block;
  width: 100%;
  height: auto;
  max-height: none;
  min-height: 0;
  aspect-ratio: auto;
  object-fit: contain;
  box-sizing: border-box;
  padding: 0;
  border: 1px solid var(--content-card-border, var(--line));
  border-radius: 10px;
  background: var(--surface);
}
:root main :is(.review-structure__proof-image, .review-structure__gallery a) {
  align-self: start;
  padding: 0;
  border: 0;
  border-radius: 10px;
  background: transparent;
}
:root main .review-structure__gallery { align-items: start; }
:root main .seo-featured-art { height: auto; align-self: center; padding: 16px; }
:root main .seo-featured-art img { width: 100%; height: auto; min-height: 0; aspect-ratio: auto; object-fit: contain; border: 1px solid var(--content-card-border, var(--line)); border-radius: 10px; }
:root .single-ai_collection .hero-banner .banner-img { height: auto; aspect-ratio: auto; object-fit: contain; border: 1px solid var(--content-card-border, var(--line)); border-radius: 10px; }
.content-lightbox figure img { border: 1px solid rgba(255,255,255,.35); }