/* Private live-cube composition. Existing BlockArrow identity remains canonical. */
.film-preview .cipher-hero {
  min-height: min(790px, calc(100svh - 70px)) !important;
  padding: 0 !important; background: transparent !important;
  display: flex; align-items: center; isolation: isolate; overflow: hidden !important;
}
.film-preview .cipher-hero .os-hero__inner { display: block; width: calc(100% - 2 * clamp(20px, 4vw, 58px)); }
.film-preview .cipher-hero .os-hero__text { width: 43%; padding: 50px 0 90px; z-index: 2; pointer-events: none; }
.film-preview .cipher-hero .os-hero__text a { pointer-events: auto; }
.film-preview .cipher-hero .os-hero__text > * { opacity: 1 !important; transform: none !important; transition: none !important; }
.film-preview .cipher-hero .os-hero__text h1 { font-size: clamp(38px, 3.7vw, 56px) !important; max-width: 16ch; }
.film-preview .cipher-hero .lede { font-size: 18px; max-width: 44ch !important; }
.cipher-scene { position: absolute; inset: 0 0 0 40%; z-index: 1; }
#cipherCanvas { width: 100%; height: 100%; display: block; opacity: 0; }
.cipher-poster { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: contain; }
.cipher-active #cipherCanvas { opacity: 1; }
.cipher-active .cipher-poster { visibility: hidden; }
.cipher-narrative { margin: 34px 0 0; color: #8f928f; font: 400 14px/1.5 var(--sans); }
.cipher-controls { position: absolute; inset: auto 0 18px; display: flex; align-items: center; justify-content: space-between; z-index: 3; pointer-events: none; }
.cipher-controls > div { display: flex; gap: 24px; pointer-events: auto; }
.cipher-controls__caption { color: #999c98; font: 400 13px/1.5 var(--sans); }
.cipher-controls button { position: static; background: none; border: 0; color: #b8bab4; padding: 12px 0; min-height: 44px; font: 400 13px/1.5 var(--sans); }
.cipher-controls button[hidden] { display: none; }
.cipher-controls button:focus-visible { outline: 2px solid #edece5; outline-offset: 6px; }
.film-preview .cipher-hero .os-hero__inline { border: 0; }
.film-preview #film { padding-bottom: clamp(48px, 5vw, 72px); }
.film-preview .film-disclosure { border-top: 0; }
.film-preview .cipher-stage { height: auto; position: relative; }
.film-preview .cipher-stage .cipher-hero { position: relative !important; top: auto !important; }
.cipher-active:not(.cipher-still) .film-preview .cipher-scene {
  position: fixed; top: 70px; right: 0; bottom: auto; left: 40%;
  height: calc(100svh - 70px); margin: 0; pointer-events: none;
}
@media (max-width:980px) {
  .cipher-active:not(.cipher-still) .film-preview .cipher-scene {
    left: 0; width: 100%; height: var(--cipher-compact-height);
  }
  .cipher-active:not(.cipher-still) .film-preview .cipher-hero .os-hero__inner {
    padding-top: var(--cipher-compact-height);
  }
}
@media (prefers-reduced-motion:reduce) {
  .film-preview .cipher-stage { height: auto; }
  .film-preview .cipher-stage .cipher-hero { position: relative !important; top: auto !important; }
}
@media (min-width: 981px) and (max-height: 700px) {
  .film-preview .cipher-hero { min-height: 600px !important; }
}
@media (max-width: 980px) {
  .film-preview .cipher-hero { --cipher-compact-height: clamp(340px, 57vw, 520px); min-height: auto !important; display: block; padding-top: 34px !important; }
  .film-preview .cipher-hero .os-hero__inner { margin-top: 32px; padding-bottom: 36px; }
  .film-preview .cipher-hero .os-hero__text { width: min(100%, 620px); padding: 0; }
  .film-preview .cipher-hero .lede { max-width: 56ch !important; }
  .cipher-narrative { margin-top: 22px; }
  .cipher-scene { position: relative; inset: auto; width: 100%; height: var(--cipher-compact-height); margin-top: -10px; }
  .cipher-controls { position: absolute; top: calc(var(--cipher-compact-height) + 4px); bottom: auto; margin-top: 0; padding-bottom: 0; }
  .cipher-controls__caption { display: none; }
  .cipher-controls > div { margin-left: auto; }
}
@media (max-width: 600px) {
  .film-preview .cipher-hero .os-hero__text h1 { font-size: clamp(34px, 9.6vw, 42px) !important; }
  .film-preview .cipher-hero .lede { font-size: 17px; }
  .cipher-narrative { font-size: 13px; }
  .film-preview .cipher-hero { --cipher-compact-height: 355px; }
  .cipher-controls > div { gap: 22px; }
}
@media (prefers-reduced-motion: reduce) {
  .film-preview .cipher-hero .os-hero__text > * { opacity: 1 !important; transform: none !important; transition: none !important; }
}
