/* ============ LIGHTBOX ============ */
.lb-modal{
  position:fixed;inset:0;z-index:9999;
  display:none;align-items:center;justify-content:center;
}
.lb-modal.open{display:flex}

.lb-backdrop{
  position:absolute;inset:0;background:rgba(0,0,0,.92);
  cursor:zoom-out;
}

.lb-close{
  position:absolute;top:24px;right:24px;width:42px;height:42px;
  background:rgba(255,255,255,.08);border:1px solid rgba(255,255,255,.15);
  color:#fff;border-radius:50%;cursor:pointer;
  display:flex;align-items:center;justify-content:center;
  z-index:2;transition:background .15s;
}
.lb-close:hover{background:rgba(255,255,255,.18)}
.lb-close svg{width:18px;height:18px}

.lb-nav{
  position:absolute;top:50%;transform:translateY(-50%);
  width:48px;height:48px;
  background:rgba(255,255,255,.08);border:1px solid rgba(255,255,255,.15);
  color:#fff;border-radius:50%;cursor:pointer;
  display:flex;align-items:center;justify-content:center;
  z-index:2;transition:background .15s;
}
.lb-nav:hover{background:rgba(255,255,255,.2)}
.lb-prev{left:24px}
.lb-next{right:24px}
.lb-nav svg{width:22px;height:22px}

.lb-stage{
  position:relative;max-width:92vw;max-height:90vh;
  display:flex;align-items:center;justify-content:center;
  z-index:1;pointer-events:none;
}
.lb-img{
  max-width:92vw;max-height:90vh;
  object-fit:contain;display:block;border-radius:8px;
  pointer-events:auto;
}

.lb-counter{
  position:absolute;bottom:24px;left:50%;transform:translateX(-50%);
  background:rgba(0,0,0,.6);color:#fff;
  padding:6px 14px;border-radius:14px;
  font-family:"JetBrains Mono",ui-monospace,monospace;font-size:12px;
  letter-spacing:.05em;z-index:2;
}

@media (max-width:600px){
  .lb-close{top:12px;right:12px;width:36px;height:36px}
  .lb-nav{width:40px;height:40px}
  .lb-prev{left:8px} .lb-next{right:8px}
}