/* Lightweight Lightbox — styles */
.lb-overlay {
  position: fixed; inset: 0; background: rgba(0,0,0,.7);
  display: none; align-items: center; justify-content: center;
  z-index: 9999;
  backdrop-filter: blur(2px);
}
.lb-overlay.is-open { display: flex; animation: lb-fade .14s ease-out; }
@keyframes lb-fade { from { opacity: 0 } to { opacity: 1 } }

.lb-frame {
  position: relative; max-width: 92vw; max-height: 88vh;
  display: grid; grid-template-rows: 1fr auto; gap: 10px;
}
.lb-media {
  position: relative; overflow: hidden; border-radius: 12px;
  background: #111;
  box-shadow: 0 10px 30px rgba(0,0,0,.4);
}
.lb-img {
  max-width: 100%; max-height: 88vh; object-fit: contain;
  transform-origin: center center;
  transition: transform .12s ease;
}
.lb-caption {
  color: #eaeaea; font-size: .95rem; text-align: center;
  text-shadow: 0 1px 2px rgba(0,0,0,.5);
}

.lb-close, .lb-prev, .lb-next {
  position: absolute; top: 8px;
  background: rgba(0,0,0,.5); border: 1px solid rgba(255,255,255,.18);
  color: #fff; font-weight: 700;
  width: 40px; height: 40px; border-radius: 999px;
  display: grid; place-items: center; cursor: pointer;
  user-select: none;
  transition: transform .12s ease, background .12s ease;
}
.lb-close:hover, .lb-prev:hover, .lb-next:hover { transform: translateY(-1px); background: rgba(0,0,0,.64); }
.lb-close { right: 8px; }
.lb-prev, .lb-next { top: 50%; transform: translateY(-50%); }
.lb-prev { left: -52px; }
.lb-next { right: -52px; }

@media (max-width: 880px) {
  .lb-prev { left: 8px; }
  .lb-next { right: 8px; }
}

/* Zoom hint cursor */
.lb-zoomable { cursor: zoom-in; }
.lb-zoomed   { cursor: zoom-out; }