.lb{position:fixed;inset:0;z-index:100;background:rgba(7,21,40,.94);display:none;align-items:center;justify-content:center;backdrop-filter:blur(4px)}
.lb.open{display:flex;animation:fade .25s ease}
@keyframes fade{from{opacity:0}to{opacity:1}}
.lb img{max-width:88vw;max-height:82vh;border-radius:12px;box-shadow:0 30px 80px rgba(0,0,0,.6)}
.lb .lbcap{position:absolute;bottom:26px;left:50%;transform:translateX(-50%);color:#fff;font-family:var(--display);font-weight:500;text-align:center;background:rgba(0,0,0,.4);padding:.5em 1.1em;border-radius:999px;font-size:.92rem}
.lb .lbcap small{color:var(--sky);text-transform:uppercase;letter-spacing:.1em;font-size:.72em;font-family:var(--body);font-weight:700}
.lb button{position:absolute;background:rgba(255,255,255,.12);border:none;color:#fff;width:50px;height:50px;border-radius:50%;cursor:pointer;display:grid;place-items:center;transition:.2s;backdrop-filter:blur(6px)}
.lb button:hover{background:rgba(255,255,255,.28)}
.lb button svg{width:24px;height:24px}
.lb .close{top:24px;right:24px}
.lb .prev{left:24px;top:50%;transform:translateY(-50%)}
.lb .next{right:24px;top:50%;transform:translateY(-50%)}

@media (max-width:600px){
  .lb .prev{left:12px}.lb .next{right:12px}
  .lb button{width:44px;height:44px}
}