/* The Portalith surface. Fills its stage — the clip-path is the frame, so the content
   underneath never moves as the frame changes shape.

   Absolute, never fixed. A fixed Portalith outlives the section that owns it and sits over
   every later beat; that failure is what forced Focus and Scale into one section. Every
   consumer wants absolute, so it is the default rather than an override. */
.portalith {
  position: absolute;
  inset: 0;
  z-index: 1;
}

/* Solid Golden Blaze: an object placed in the world, not yet a window. */
.portalith[data-fill="gold"] { background: var(--c-portalith); }
.portalith[data-fill="gold"] > * { opacity: 0; }

.portalith[data-fill="film"] { background: var(--c-aperture); }
.portalith[data-fill="film"] > * { opacity: 1; }

.portalith > * { transition: opacity 0.45s var(--ease-out); }

.portalith video,
.portalith img {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  object-fit: cover;
}

/* The showreel stand-in — four films cut together while the real edit does not exist.
   The reel is the Portalith's single child, so [data-fill] gates the whole reel in and
   out as one; the slides crossfade inside it on .is-current. */
.reel { position: absolute; inset: 0; }

.reel__slide {
  position: absolute;
  inset: 0;
  opacity: 0;
  transition: opacity 0.5s var(--ease-out);
}

.reel__slide.is-current { opacity: 1; }