/* Atelier — film lightbox: the screening room. The page stays faintly visible beneath. */
.lbx { position: fixed; inset: 0; z-index: 90; display: grid; place-items: center; opacity: 0; pointer-events: none; transition: opacity .45s ease; }
.lbx.is-open { opacity: 1; pointer-events: auto; }
.lbx .stage { position: relative; width: min(1160px, 100vw - 96px, calc((100vh - 190px) * var(--rw, 1.7778))); aspect-ratio: var(--r, 16/9); margin: 0 auto; background: var(--black); }
.lbx .stage iframe { position: absolute; inset: 0; width: 100%; height: 100%; border: 0; }
.lbx .close, .lbx .prev, .lbx .next { position: absolute; background: transparent; border: 0; cursor: pointer; font: 500 11px/1 var(--font-mono); letter-spacing: .16em; text-transform: uppercase; color: inherit; padding: 12px; }
.lbx .close { top: 22px; right: 22px; }
.lbx .prev { left: 22px; top: 50%; transform: translateY(-50%); }
.lbx .next { right: 22px; top: 50%; transform: translateY(-50%); }
.lbx .prev span, .lbx .next span { display: inline-block; transition: transform .3s cubic-bezier(.2,.7,.2,1); }
.lbx .prev:hover span { transform: translateX(-5px); } .lbx .next:hover span { transform: translateX(5px); }
.lbx .cap b { color: inherit; }
.lbx .cap { display: flex; justify-content: space-between; align-items: baseline; gap: 24px; margin-top: 14px; width: min(1160px, 100vw - 96px, calc((100vh - 190px) * var(--rw, 1.7778))); }
.lbx .cap b { display: block; font-weight: 500; font-size: 14px; }
.lbx .cap .caption { color: inherit; opacity: .8; }
.lbx .idx { font: 500 11px/1 var(--font-mono); letter-spacing: .16em; white-space: nowrap; opacity: .8; }
.lbx .haze { position: absolute; left: 50%; top: 0; width: 100%; aspect-ratio: var(--r, 16/9); transform: translateX(-50%) scale(1.22); background-size: cover; background-position: center; filter: blur(64px) saturate(1.35) brightness(.85); opacity: 0; transition: opacity 1.2s ease; pointer-events: none; z-index: 0; }
.lbx.is-open .haze { opacity: .68; animation: haze-breathe 9s ease-in-out infinite alternate; }
.lbx .haze::after { content: ""; position: absolute; inset: -30%; background: radial-gradient(60% 60% at 50% 50%, rgba(255,210,170,.14), transparent 70%); }
@keyframes haze-breathe { from { transform: translateX(-50%) scale(1.18); } to { transform: translateX(-50%) scale(1.28); } }
.lbx .stage, .lbx .cap { position: relative; z-index: 1; }
.lbx .inner { position: relative; display: flex; flex-direction: column; align-items: center; transform: translateY(10px) scale(.985); transition: transform .5s cubic-bezier(.2,.7,.2,1); }
.lbx.is-open .inner { transform: none; }
html.lbx-open { overflow: hidden; }
html.lbx-open .cur { opacity: 0 !important; }
@media (max-width: 767px) {
  .lbx .stage, .lbx .cap { width: calc(100vw - 32px); }
  .lbx .prev, .lbx .next { top: auto; bottom: 18px; transform: none; }
  .lbx .cap { flex-direction: column; gap: 6px; padding-bottom: 56px; }
}

/* 1 — Screening room: the black ground, cream type, arrows at the edges */
.lbx-1 { background: rgba(20,20,20,.86); color: var(--cream); backdrop-filter: blur(3px) saturate(.8); -webkit-backdrop-filter: blur(3px) saturate(.8); }
.lbx-1::before { content: ""; position: absolute; inset: 0; background: url("plates/band-black-grain.jpg") center / cover; opacity: .35; pointer-events: none; }
.lbx-1 > * { position: relative; }
.lbx-1 .stage { box-shadow: 0 0 0 1px rgba(236,230,214,.12); }



@media (prefers-reduced-motion: reduce) { .lbx, .lbx .inner { transition: none; } .lbx.is-open .haze { animation: none; } }
