.gallery-slideshow {
  width: min(980px, 100%);
  margin: 30px auto 54px;
  padding: clamp(10px, 2vw, 20px);
  border: 1px solid rgba(116, 220, 217, .24);
  border-radius: 18px;
  background: rgba(2, 21, 27, .76);
  box-shadow: 0 20px 54px rgba(0, 0, 0, .3);
}
.gallery-slide { margin: 0; padding: 10px 10px 0; background: #ebe7da; }
.gallery-slide-open { display: block; width: 100%; padding: 0; border: 0; background: transparent; cursor: zoom-in; }
.gallery-slide-open:focus-visible { outline: 3px solid #72dedc; outline-offset: 3px; }
.gallery-slide-image {
  display: block;
  width: 100%;
  height: min(62vh, 620px);
  min-height: 220px;
  object-fit: contain;
  background: #061b20;
  opacity: 1;
  transition: opacity .2s ease;
}
.gallery-slide-image.is-changing { opacity: .35; }
.gallery-slide-caption {
  min-height: 44px;
  display: flex;
  align-items: center;
  padding: 8px 6px;
  color: #18353a;
  font-size: 13px;
  font-weight: 750;
  letter-spacing: .08em;
  text-transform: uppercase;
}
.gallery-slide-controls { display: flex; align-items: center; justify-content: center; gap: 18px; padding: 12px 0 2px; }
.gallery-slide-controls button {
  width: 44px; height: 44px; border: 1px solid rgba(116,220,217,.46); border-radius: 50%;
  background: rgba(2,21,27,.82); color: #eaf8f6; font: inherit; font-size: 21px; cursor: pointer;
}
.gallery-slide-controls button:hover, .gallery-slide-controls button:focus-visible { background: #17666b; outline: 2px solid #72dedc; outline-offset: 2px; }
.gallery-slide-count { min-width: 72px; color: rgba(230,246,242,.8); font-size: 13px; font-variant-numeric: tabular-nums; text-align: center; }
.photo-lightbox-nav[hidden], .photo-lightbox-count[hidden] { display: none; }
.photo-lightbox-nav {
  position: absolute; top: 50%; z-index: 4; width: 52px; height: 52px; transform: translateY(-50%);
  border: 1px solid rgba(255,255,255,.58); border-radius: 50%; color: #fff;
  background: rgba(1,17,22,.78); font: inherit; font-size: 27px; cursor: pointer;
}
.photo-lightbox-prev { left: max(14px, env(safe-area-inset-left)); }
.photo-lightbox-next { right: max(14px, env(safe-area-inset-right)); }
.photo-lightbox-nav:hover, .photo-lightbox-nav:focus-visible { background: #1c777b; outline: 2px solid #79dedb; outline-offset: 2px; }
.photo-lightbox-count {
  position: absolute; left: 50%; bottom: max(18px, env(safe-area-inset-bottom)); z-index: 4;
  transform: translateX(-50%); padding: 8px 12px; border-radius: 999px;
  color: #f1faf8; background: rgba(1,17,22,.82); font-size: 13px; font-variant-numeric: tabular-nums;
}
@media (max-width: 620px) {
  .photo-lightbox { padding: max(12px, env(safe-area-inset-top)) 8px max(70px, env(safe-area-inset-bottom)); }
  .photo-lightbox-image { max-width: 100vw; max-height: 84dvh; }
  .photo-lightbox-nav { top: auto; bottom: max(10px, env(safe-area-inset-bottom)); width: 48px; height: 48px; transform: none; }
  .photo-lightbox-prev { left: calc(50% - 66px); }
  .photo-lightbox-next { right: calc(50% - 66px); }
  .photo-lightbox-count { bottom: max(24px, calc(env(safe-area-inset-bottom) + 10px)); }
  .photo-lightbox-close { top: max(10px, env(safe-area-inset-top)); right: max(10px, env(safe-area-inset-right)); }
}
@media (max-width: 620px) {
  .gallery-slideshow { margin: 24px auto 38px; padding: 9px; }
  .gallery-slide { padding: 6px 6px 0; }
  .gallery-slide-image { height: min(52vh, 440px); min-height: 190px; }
}
@media (prefers-reduced-motion: reduce) { .gallery-slide-image { transition: none; } }
