/* ═══ LIGHTBOX — a photograph at full size ═══════════════════════
   Every picture on the site is a crop inside a composition; this is
   where a visitor gets to see the frame itself. */
.lb{
  position:fixed;inset:0;z-index:90;
  display:grid;grid-template-columns:auto 1fr auto;align-items:center;
  gap:clamp(.5rem,2vw,1.5rem);padding:clamp(1rem,4vw,3rem);
  background:rgba(4,12,18,.93);
  -webkit-backdrop-filter:blur(6px);backdrop-filter:blur(6px);
  animation:lb-in .25s ease-out;
}
/* An author display: value beats the UA rule behind [hidden], so a closed
   overlay kept swallowing every click on the page. */
.lb[hidden]{display:none}
@keyframes lb-in{from{opacity:0}to{opacity:1}}
body.lb-open{overflow:hidden}

.lb-stage{margin:0;display:flex;flex-direction:column;align-items:center;gap:1rem;min-width:0}
.lb-stage img{
  max-width:100%;max-height:82vh;width:auto;height:auto;
  border-radius:4px;box-shadow:0 40px 90px -30px rgba(0,0,0,.8);
  animation:lb-pop .3s cubic-bezier(.22,1,.36,1);
}
@keyframes lb-pop{from{opacity:0;transform:scale(.97)}to{opacity:1;transform:none}}
.lb-stage figcaption{
  margin:0;color:rgba(255,255,255,.78);font-size:.95rem;text-align:center;max-width:60ch;
}

.lb-nav,.lb-close{
  display:grid;place-items:center;cursor:pointer;padding:0;
  border-radius:999px;border:1px solid rgba(255,255,255,.25);
  background:rgba(255,255,255,.06);color:#fff;
  transition:background .3s var(--ease),color .3s var(--ease),border-color .3s var(--ease);
}
.lb-nav{width:clamp(44px,5vw,58px);aspect-ratio:1}
.lb-nav svg{width:42%;height:42%}
.lb-nav:hover,.lb-close:hover{background:#fff;color:#041722;border-color:#fff}
.lb-close{
  position:absolute;inset-block-start:clamp(1rem,3vw,2rem);
  inset-inline-end:clamp(1rem,3vw,2rem);
  width:46px;height:46px;z-index:2;
}
.lb-close svg{width:20px;height:20px}
.lb-count{
  position:absolute;inset-block-end:clamp(1rem,3vw,2rem);inset-inline:0;
  margin:0;text-align:center;color:rgba(255,255,255,.6);
  font-size:.82rem;letter-spacing:.2em;font-variant-numeric:tabular-nums;
}

/* The pictures that open say so. */
.gallery-grid img,.feature-media img,.split-media img,
.wcard-bg img,.case-media img,.world-slab img,.stack-card img,
.deck-card img,.ring figure img,.wall figure img{cursor:zoom-in}

@media(max-width:700px){
  .lb{grid-template-columns:1fr;padding-block:4rem}
  .lb-nav{position:absolute;inset-block-end:4.5rem;z-index:2}
  .lb-prev{inset-inline-end:calc(50% + 2.6rem)}
  .lb-next{inset-inline-start:calc(50% + 2.6rem)}
  .lb-stage img{max-height:64vh}
}
@media(prefers-reduced-motion:reduce){
  .lb,.lb-stage img{animation:none}
}