@layer components {
  .lb-overlay,#lightboxOverlay{
    display:none; position:fixed; inset:0; justify-content:center; align-items:center;
    background:rgba(0,0,0,.8); z-index:9999;
  }
  .lb-overlay.show,#lightboxOverlay.show{ display:flex; }
  .lb-image,#lightboxImage{ max-width:90vw; max-height:90vh; border-radius:8px; box-shadow:0 0 20px rgba(0,0,0,.7); }
  .lb-close,#lightboxClose{ position:absolute; top:20px; right:30px; color:#fff; font-size:30px; cursor:pointer; font-weight:bold; background:transparent; border:0; }
  .lb-nav,#lightboxPrev,#lightboxNext{ position:absolute; top:50%; transform:translateY(-50%); font-size:40px; color:#fff; cursor:pointer; user-select:none; display:block; background:transparent; border:0; }
  #lightboxPrev{ left:30px; } #lightboxNext{ right:30px; }
}