.lb-open { overflow: hidden; }
.lb-overlay { position: fixed; inset: 0; z-index: 1000; background: rgba(0, 0, 0, .88); display: flex; align-items: center; justify-content: center; }
.lb-overlay[hidden] { display: none; }
.lb-fig { margin: 0; max-width: 94vw; max-height: 94vh; display: flex; flex-direction: column; align-items: center; position: relative; }
.lb-img { display: block; max-width: 94vw; max-height: calc(94vh - 3rem); width: auto; height: auto; border: 6px solid #fff; background: #fff; box-shadow: 0 4px 24px rgba(0, 0, 0, .6); }
.lb-img.lb-loading { opacity: .25; }
.lb-cap { display: flex; justify-content: space-between; gap: 1rem; width: 100%; padding-top: .5rem; color: #eee; font: 13px/1.4 Arial, Helvetica, sans-serif; }
.lb-spin { position: absolute; top: 50%; left: 50%; width: 36px; height: 36px; margin: -18px 0 0 -18px; border: 4px solid rgba(255, 255, 255, .3); border-top-color: #fff; border-radius: 50%; animation: lb-rot .8s linear infinite; }
.lb-spin[hidden] { display: none; }
@keyframes lb-rot { to { transform: rotate(360deg); } }
.lb-close, .lb-prev, .lb-next { position: absolute; background: rgba(0, 0, 0, .45); color: #fff; border: 0; cursor: pointer; line-height: 1; }
.lb-close:hover, .lb-prev:hover, .lb-next:hover, .lb-close:focus-visible, .lb-prev:focus-visible, .lb-next:focus-visible { background: #f76b36; outline: 0; }
.lb-close { top: 10px; right: 10px; width: 44px; height: 44px; font-size: 32px; }
.lb-prev, .lb-next { top: 50%; width: 44px; height: 64px; margin-top: -32px; font-size: 24px; }
.lb-prev { left: 8px; }
.lb-next { right: 8px; }
.lb-prev[hidden], .lb-next[hidden] { display: none; }