/* The same painted miniature, re-composed for a tall screen. Geometry and
   attached shadows/screen stay together in layer-layout.mjs. */
.set-layer[data-layer="foreground"] .set-image {
  filter: blur(5px) saturate(.78) brightness(.79);
}

/* Quietly give the occasional wider gag the stage, then restore the idle UI.
   Navigation, accessibility controls and the header's film entry stay live. */
.theatre[data-branch="rusty"] .film-title,
.theatre[data-branch="reaction"] .film-title,
.theatre[data-branch="rusty"] .home-actions,
.theatre[data-branch="reaction"] .home-actions {
  opacity: 0 !important;
  visibility: hidden;
  transition: opacity 260ms ease-out;
}
.home-actions { transition: opacity 260ms ease-out; }
@media (prefers-reduced-motion: reduce) {
  .home-actions { transition: none; }
}

@media (max-width: 800px) and (max-aspect-ratio: 9/10) {
  .theatre { --home-title-size: clamp(34px, 7svh, 64px); }
  .theatre[data-mode="home"] .film-title {
    top: 12%;
    font-size: var(--home-title-size);
  }
  .theatre[data-mode="home"] .home-actions {
    top: auto;
    bottom: calc(var(--edge-bottom) + 74px);
    max-width: calc(100% - var(--gutter) * 2);
  }
  .theatre[data-mode="home"] .home-invitation {
    margin-bottom: 4px;
  }
  /* The TV doodle and header Watch button remain; don't duplicate their
     invitation in the narrow space above Zorp's head. */
  .theatre[data-mode="home"] .home-links {
    display: none;
  }
  .set-layer[data-layer="foreground"] .set-image {
    filter: blur(4px) saturate(.78) brightness(.79);
  }
}