@property --travel{syntax: "<number>"; inherits: true; initial-value: 0;}.corridor{position:relative;block-size:calc((var(--stops, 3) + 1) * 100svh)}.corridor__stage{position:sticky;inset-block-start:0;block-size:100svh;overflow:clip;perspective:60rem;perspective-origin:50% 46%;display:grid;align-content:center}.bays{list-style:none;margin:0;padding:0;display:flex;align-items:center;gap:clamp(3rem,8vw,9rem);padding-inline:50vw;inline-size:max-content;transform:translate3d(calc(var(--shift, 0px)),0,0);will-change:transform;transform-style:preserve-3d}.slot{position:relative;flex:0 0 auto;inline-size:min(26rem,74vw);display:grid;justify-items:center;transform-style:preserve-3d;--near: 0;transform:translateZ(calc((1 - var(--near)) * -10rem)) rotateY(calc((1 - var(--near)) * var(--face, 0deg))) scale(calc(.9 + var(--near) * .1));opacity:calc(.55 + var(--near) * .45);filter:brightness(calc(.68 + var(--near) * .32));transition:transform .5s cubic-bezier(.22,1,.36,1),opacity .5s cubic-bezier(.22,1,.36,1),filter .5s cubic-bezier(.22,1,.36,1)}.slot[data-side=ahead]{--face: -22deg}.slot[data-side=behind]{--face: 22deg}.slot .gilt{inline-size:100%}.slot .gilt__window img{block-size:min(38svh,19rem)}.slot .lamp{inline-size:100%}.slot .wall-caption{inline-size:min(28rem,80vw);margin-block-start:clamp(.75rem,2vh,1.25rem);opacity:calc(var(--near) * var(--near));transition:opacity .45s cubic-bezier(.22,1,.36,1)}.lamp{position:relative;block-size:clamp(1rem,2.5vh,1.75rem);display:flex;justify-content:center;pointer-events:none}.lamp__housing{inline-size:clamp(2.25rem,5vw,3rem);block-size:100%;background:linear-gradient(to bottom,color-mix(in oklab,var(--gilt-shadow) 80%,#000),var(--gilt-deep));clip-path:polygon(22% 0,78% 0,100% 100%,0 100%);border-radius:2px 2px 0 0}.lamp__housing:after{content:"";position:absolute;inset-block-start:100%;inset-inline:0;margin-inline:auto;inline-size:60%;block-size:3px;background:color-mix(in oklab,var(--lamp) calc(30% + var(--near) * 70%),transparent);filter:blur(1px)}.lamp__cone,.lamp__spill,.lamp__motes{position:absolute;inset-block-start:100%;inset-inline:0;margin-inline:auto;pointer-events:none}.lamp__cone{inline-size:min(130%,32rem);block-size:clamp(14rem,34vh,24rem);background:linear-gradient(to bottom,color-mix(in oklab,var(--lamp) calc(8% + var(--near) * 26%),transparent) 0%,color-mix(in oklab,var(--lamp) calc(2% + var(--near) * 10%),transparent) 42%,transparent 80%);clip-path:polygon(43% 0,57% 0,96% 100%,4% 100%);mask-image:linear-gradient(to right,transparent,#000 18%,#000 82%,transparent);filter:blur(18px)}.lamp__spill{inline-size:min(180%,44rem);block-size:clamp(18rem,42vh,30rem);background:radial-gradient(58% 74% at 50% 0%,color-mix(in oklab,var(--lamp) calc(4% + var(--near) * 18%),transparent) 0%,transparent 72%);filter:blur(22px)}.lamp__motes{inline-size:min(130%,32rem);block-size:clamp(14rem,34vh,24rem);opacity:calc(var(--near) * .5);background-image:radial-gradient(1.5px 1.5px at 18% 22%,#fff6e0 50%,transparent 55%),radial-gradient(1px 1px at 42% 64%,#fff6e0 50%,transparent 55%),radial-gradient(1.5px 1.5px at 68% 38%,#fff6e0 50%,transparent 55%),radial-gradient(1px 1px at 82% 76%,#fff6e0 50%,transparent 55%);background-size:60% 60%,45% 45%;mask-image:linear-gradient(to bottom,#000,transparent 82%)}@media(prefers-reduced-motion:no-preference){.lamp__motes{animation:motes-drift 26s linear infinite}}@keyframes motes-drift{0%{background-position:0% 0%,100% 100%}to{background-position:100% 100%,0% 0%}}.corridor__counter{position:absolute;inset-block-end:clamp(1rem,4vh,2.5rem);inset-inline:0;margin-inline:auto;inline-size:fit-content;z-index:20;display:flex;align-items:center;gap:.875rem;padding:.5rem 1.125rem;border:1px solid color-mix(in oklab,var(--gilt-deep) 70%,transparent);border-radius:999px;background:color-mix(in oklab,#14121b 82%,transparent);backdrop-filter:blur(8px);color:var(--gilt-light);font-size:var(--text-plaque);font-weight:600;font-variant-numeric:tabular-nums;pointer-events:none}@media(prefers-reduced-motion:reduce){.corridor{block-size:auto}.corridor__stage{position:static;block-size:auto;perspective:none;padding-block:clamp(2rem,6vh,4rem)}.bays{display:grid;gap:clamp(3rem,9vh,6rem);padding-inline:0;inline-size:auto;transform:none;justify-items:center}.slot{transform:none;opacity:1;filter:none;transition:none;inline-size:min(28rem,88vw)}.slot .wall-caption{opacity:1;transition:none}.lamp__motes,.corridor__counter{display:none}}.corridor:not([data-corridor-ready]){block-size:auto}.corridor:not([data-corridor-ready]) .corridor__stage{position:static;block-size:auto;overflow:visible;perspective:none;padding-block:clamp(2rem,6vh,4rem)}.corridor:not([data-corridor-ready]) .bays{display:grid;gap:clamp(3rem,9vh,6rem);padding-inline:0;inline-size:auto;transform:none;justify-items:center}.corridor:not([data-corridor-ready]) .slot{transform:none;opacity:1;filter:none;inline-size:min(28rem,88vw)}.corridor:not([data-corridor-ready]) .slot .wall-caption{opacity:1}.corridor:not([data-corridor-ready]) .corridor__counter{display:none}
