/* ======================================================
   Sayonara_Alice.exe — v72.09
   Universal Dual Stage + Title Ignition
   ------------------------------------------------------
   Three authoritative layout modes only:
   1) wide desktop dual stage
   2) compact desktop/tablet dual stage
   3) mobile single stage

   The active mode is exposed by v72_opening.js through
   [data-memory-mode="dual|single"]. This final stylesheet
   deliberately overrides the accumulated historical media
   queries without changing the fluid v72.08 video engine.
====================================================== */

.v72-opening {
  --v72-stage-gutter: clamp(1rem, 4vw, 5.5rem);
  --v72-stage-gap: clamp(6px, .7vw, 12px);
  --v72-copy-measure: min(34vw, 36rem);
}

/* The stage now participates in the shell layout. */
.v72-opening .v72-opening-shell {
  width: min(1800px, 100%) !important;
  min-height: 100vh;
  min-height: 100svh;
  margin-inline: auto;
  box-sizing: border-box;
}

.v72-opening .v72-opening-header,
.v72-opening .v72-opening-copy,
.v72-opening .v72-opening-footer,
.v72-opening .v72-dual-memory-stage {
  position: relative;
}

.v72-opening .v72-opening-header { z-index: 14; }
.v72-opening .v72-opening-copy { z-index: 12; }
.v72-opening .v72-opening-footer { z-index: 14; }
.v72-opening .v72-dual-memory-stage { z-index: 8; }

.v72-opening .v72-dual-memory-stage {
  inset: auto !important;
  top: auto !important;
  right: auto !important;
  bottom: auto !important;
  left: auto !important;
  height: auto !important;
  max-height: none !important;
  aspect-ratio: 1040 / 686;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: var(--v72-stage-gap) !important;
  transform: none !important;
  transform-origin: center !important;
  filter: none !important;
  animation: none !important;
  will-change: opacity;
}

.v72-opening .v72-memory-lane {
  border-radius: clamp(8px, .72vw, 14px) !important;
  -webkit-mask-image: none !important;
  mask-image: none !important;
}

.v72-opening .v72-video-portal {
  width: 100% !important;
  height: 100% !important;
  inset: auto !important;
  top: auto !important;
  right: auto !important;
  bottom: auto !important;
  left: auto !important;
  transform: none !important;
  border-radius: inherit !important;
  -webkit-mask-image: none !important;
  mask-image: none !important;
}

/* --- l'altezza dell'opening durante lo scroll ---------------------------
   Su iOS la toolbar di Safari si ritrae mentre si scorre, e `dvh` la segue:
   e' l'unita' dinamica, per definizione. `.v72-opening` e `.v72-opening-shell`
   la usano (v72_opening.css:91 e v72_04_opening.css:53/83, quest'ultimo dentro
   @media max-width: 780px, quindi e' quello che vince sul telefono).

   Conseguenza: mentre scorri, la sezione si allunga e tutto cio' che contiene
   slitta in giu' NEL DOCUMENTO mentre la pagina scorre in su. Il pannello
   video sembra allora inseguire lo scroll invece di uscire con la sua sezione.

   Simulato riducendo la toolbar di 55px, il collasso tipico di un SE in
   landscape: la sezione passa da 375 a 430, e la lane del video slitta da
   61 a 116 nel documento -- 55px esatti. Su un viewport alto 375 sono il 15%,
   ed e' per questo che si nota soprattutto li'; sui landscape piu' alti la
   stessa quantita' pesa meno e passa inosservata.

   `svh` e' l'altezza a toolbar ESTESA, cioe' la piu' piccola e l'unica
   stabile: la composizione entra intera al primo paint e non si muove piu'
   mentre si scorre. Quando la toolbar si ritrae si intravede la sezione
   successiva, che e' esattamente il comportamento voluto -- il pannello esce
   insieme alla propria sezione.

   Non e' un parallax: non c'e' nessuna trasformazione, solo un box che
   cambia altezza. Il fix non tocca position, transform o lifecycle.

   Solo la sezione: `.v72-opening .v72-opening-shell` alla riga 23 di questo
   stesso foglio e' gia' su `100svh` con specificita' (0,2,0), quindi la shell
   era gia' stabile e batteva il `dvh` di v72_04 da sempre. Questa regola non
   fa che estendere alla sezione la scelta che il foglio aveva gia' fatto per
   la shell.

   Stessa classificazione approvata altrove: capacita' + orientamento +
   altezza, mai larghezza. Questo foglio e' caricato dopo v72_04, quindi
   vince a parita' di specificita' senza bisogno di !important.
   --------------------------------------------------------------------- */
@media (orientation: landscape) and (hover: none)
   and (pointer: coarse) and (max-height: 500px) {
  .v72-opening {
    min-height: 100svh;
  }
}

/* --- il portal in phone landscape ---------------------------------------
   Il blocco qui sopra esiste per annullare la composizione portrait di
   v72_16_opening.css, dove il portal e' un banner in alto: `top: 27.5%`,
   `left: 50%`, `border-radius: 0 0 30px 30px`, e la copy scende sotto con
   `padding-top: 35.8vh`. Li' azzera top, left, transform, border-radius,
   width e height -- ma non `max-height`, che quindi sopravvive.

   Quel clamp e' `max-height: 62svh !important` dentro `@media (max-width:
   699px)`: una soglia di sola larghezza, che percio' cattura anche un
   telefono in landscape stretto. A 667x375 vale 232.5px contro una lane
   alta 303.8: restavano 71.3px di lane nuda sotto il video, e il portal
   perdeva il rapporto della clip, che `object-fit: contain` incorniciava
   con 26.6px di barra per lato. Sui landscape sopra i 699 (844, 852, 932)
   il clamp non si applica e la composizione e' gia' corretta.

   In portrait il clamp serve ancora: misurato a 320x568 morde davvero,
   lane 362.3 contro portal 346.5, e tiene lo spazio per la copy. Non si
   puo' quindi togliere globalmente -- il blocco gemello dello stage porta
   `max-height: none !important` perche' li' non c'e' quel vincolo.

   L'override e' percio' circoscritto, con la classificazione gia' approvata
   altrove: capacita' piu' orientamento piu' altezza, mai larghezza, cosi'
   un telefono lungo in orizzontale resta telefono e nessun tablet entra.
   Sopra i 699 e' un no-op esatto, perche' li' non c'e' nulla da annullare.
   --------------------------------------------------------------------- */
@media (orientation: landscape) and (hover: none)
   and (pointer: coarse) and (max-height: 500px) {
  .v72-opening .v72-video-portal {
    max-height: none !important;
  }
}

.v72-opening .v72-opening-copy {
  max-width: none !important;
  padding: 0 !important;
  transform: none;
}

.v72-opening .v72-opening-title {
  position: relative;
  width: 100% !important;
  min-width: 0 !important;
  max-width: 100% !important;
  overflow: visible;
  isolation: isolate;
}

.v72-opening .v72-title-line {
  white-space: nowrap;
}

/* ======================================================
   1. Wide desktop — copy left, dual memories centre-right
====================================================== */
@media (min-width: 1200px) and (min-height: 600px) {
  .v72-opening[data-memory-mode="dual"] .v72-opening-shell {
    padding: clamp(1.15rem, 2.6vw, 2.8rem) var(--v72-stage-gutter) clamp(1.2rem, 3vw, 3rem) !important;
    display: grid !important;
    grid-template-columns: minmax(320px, .34fr) minmax(650px, .66fr) !important;
    grid-template-rows: auto minmax(0, 1fr) auto !important;
    column-gap: clamp(2rem, 4vw, 5.5rem) !important;
    row-gap: clamp(.75rem, 1.6vh, 1.4rem) !important;
    align-items: center;
  }

  .v72-opening[data-memory-mode="dual"] .v72-opening-header {
    grid-column: 1 / -1;
    grid-row: 1;
  }

  .v72-opening[data-memory-mode="dual"] .v72-dual-memory-stage {
    grid-column: 2;
    grid-row: 2;
    display: grid !important;
    align-self: center;
    justify-self: end;
    width: min(100%, 1100px) !important;
    margin-right: clamp(.35rem, 1.15vw, 1.35rem);
  }

  .v72-opening[data-memory-mode="dual"] .v72-opening-copy {
    grid-column: 1;
    grid-row: 2;
    align-self: center;
    justify-self: start;
    width: 100% !important;
    max-width: 36rem !important;
  }

  .v72-opening[data-memory-mode="dual"] .v72-opening-copy::before {
    inset: -3rem -3.2rem -3rem -3rem !important;
  }

  .v72-opening[data-memory-mode="dual"] .v72-title-sayonara {
    font-size: clamp(3.25rem, 4.65vw, 6.15rem) !important;
  }

  .v72-opening[data-memory-mode="dual"] .v72-title-alice {
    font-size: clamp(3.95rem, 5.55vw, 7.35rem) !important;
  }

  .v72-opening[data-memory-mode="dual"] .v72-opening-subtitle {
    max-width: 33rem;
  }

  .v72-opening[data-memory-mode="dual"] .v72-opening-footer {
    grid-column: 1 / -1;
    grid-row: 3;
  }
}

/* A slightly tighter wide layout for short desktop viewports. */
@media (min-width: 1200px) and (min-height: 600px) and (max-height: 790px) {
  .v72-opening[data-memory-mode="dual"] .v72-opening-shell {
    padding-top: .85rem !important;
    padding-bottom: .9rem !important;
    row-gap: .45rem !important;
  }

  .v72-opening[data-memory-mode="dual"] .v72-dual-memory-stage {
    width: min(92%, 930px) !important;
  }

  .v72-opening[data-memory-mode="dual"] .v72-opening-kicker {
    margin-bottom: .85rem;
  }

  .v72-opening[data-memory-mode="dual"] .v72-opening-subtitle {
    margin-top: 1rem;
    line-height: 1.45;
  }

  .v72-opening[data-memory-mode="dual"] .v72-opening-actions {
    margin-top: 1.15rem;
  }
}

/* ======================================================
   2. Compact desktop + tablet — same two-memory stage
   Both orientations preserve the same composition. Copy is
   intentionally integrated over the lower-left memory.
====================================================== */
@media (min-width: 700px) and (max-width: 1199px) and (min-height: 600px) {
  .v72-opening[data-memory-mode="dual"] {
    --v72-compact-stage: min(calc(100vw - 2 * var(--v72-stage-gutter)), 960px);
  }

  .v72-opening[data-memory-mode="dual"]::before {
    background:
      linear-gradient(90deg, rgb(1 3 10 / .78) 0%, rgb(1 3 10 / .4) 35%, rgb(1 3 10 / .06) 66%, rgb(1 3 10 / .16) 100%),
      linear-gradient(180deg, rgb(0 0 0 / .28), transparent 17%, transparent 80%, rgb(0 0 0 / .76)) !important;
  }

  .v72-opening[data-memory-mode="dual"] .v72-opening-shell {
    padding: clamp(.9rem, 2.2vw, 1.6rem) var(--v72-stage-gutter) clamp(1rem, 2.5vw, 1.8rem) !important;
    display: grid !important;
    grid-template-columns: 1fr !important;
    grid-template-rows: auto minmax(0, 1fr) auto !important;
    gap: clamp(.6rem, 1.5vh, 1rem) !important;
  }

  .v72-opening[data-memory-mode="dual"] .v72-opening-header {
    grid-column: 1;
    grid-row: 1;
  }

  .v72-opening[data-memory-mode="dual"] .v72-dual-memory-stage,
  .v72-opening[data-memory-mode="dual"] .v72-opening-copy {
    grid-column: 1;
    grid-row: 2;
  }

  .v72-opening[data-memory-mode="dual"] .v72-dual-memory-stage {
    display: grid !important;
    align-self: center;
    justify-self: center;
    width: var(--v72-compact-stage) !important;
  }

  .v72-opening[data-memory-mode="dual"] .v72-opening-copy {
    align-self: center;
    justify-self: start;
    width: min(42vw, 25rem) !important;
    margin-left: clamp(.75rem, 3vw, 2.4rem);
    transform: translateY(18%) !important;
    text-align: left !important;
  }

  .v72-opening[data-memory-mode="dual"] .v72-opening-copy::before {
    inset: -2.4rem -3rem -2.6rem -2.5rem !important;
    opacity: calc(var(--v72-adaptive-copy-surface) + .18) !important;
    background: radial-gradient(ellipse at 26% 50%, rgb(1 4 12 / 1) 0%, rgb(1 4 12 / .86) 39%, rgb(1 4 12 / .46) 61%, transparent 84%) !important;
    filter: blur(12px) !important;
  }

  .v72-opening[data-memory-mode="dual"] .v72-opening-kicker {
    justify-content: flex-start !important;
    margin-bottom: clamp(.65rem, 1.4vh, 1rem);
  }

  .v72-opening[data-memory-mode="dual"] .v72-title-sayonara {
    font-size: clamp(2.65rem, 6.25vw, 4.9rem) !important;
  }

  .v72-opening[data-memory-mode="dual"] .v72-title-alice {
    font-size: clamp(3.15rem, 7.45vw, 5.85rem) !important;
  }

  .v72-opening[data-memory-mode="dual"] .v72-opening-subtitle {
    width: 100% !important;
    max-width: 24rem !important;
    margin: clamp(.85rem, 1.8vh, 1.25rem) 0 0 !important;
    text-align: left !important;
    font-size: clamp(.82rem, 1.7vw, 1.05rem);
    line-height: 1.45;
  }

  .v72-opening[data-memory-mode="dual"] .v72-opening-actions {
    width: 100% !important;
    max-width: 25rem !important;
    margin: clamp(.85rem, 1.8vh, 1.25rem) 0 0 !important;
    justify-content: flex-start;
  }

  .v72-opening[data-memory-mode="dual"] .v72-enter,
  .v72-opening[data-memory-mode="dual"] .v72-archive-link {
    min-height: 42px;
    padding: .7rem 1rem;
    font-size: clamp(.58rem, 1.15vw, .7rem);
  }

  .v72-opening[data-memory-mode="dual"] .v72-opening-footer {
    grid-column: 1;
    grid-row: 3;
  }

  .v72-opening[data-memory-mode="dual"] .v72-opening-footer .v72-opening-coordinate {
    opacity: .55;
  }
}

/* Compact dual layouts with little vertical room use the same scene,
   merely scaled as a unit. No single-video tablet breakpoint exists. */
@media (min-width: 700px) and (max-width: 1199px) and (min-height: 600px) and (max-height: 800px) {
  .v72-opening[data-memory-mode="dual"] {
    --v72-compact-stage: min(86vw, 870px);
  }

  .v72-opening[data-memory-mode="dual"] .v72-opening-shell {
    padding-top: .65rem !important;
    padding-bottom: .65rem !important;
    gap: .35rem !important;
  }

  .v72-opening[data-memory-mode="dual"] .v72-opening-copy {
    width: min(38vw, 22rem) !important;
    margin-left: clamp(.55rem, 2vw, 1.4rem);
    transform: translateY(15%) !important;
  }

  .v72-opening[data-memory-mode="dual"] .v72-title-sayonara {
    font-size: clamp(2.35rem, 5.8vw, 4.15rem) !important;
  }

  .v72-opening[data-memory-mode="dual"] .v72-title-alice {
    font-size: clamp(2.85rem, 6.9vw, 4.95rem) !important;
  }

  .v72-opening[data-memory-mode="dual"] .v72-opening-subtitle {
    margin-top: .65rem !important;
    line-height: 1.35;
  }

  .v72-opening[data-memory-mode="dual"] .v72-opening-actions {
    margin-top: .7rem !important;
    gap: .55rem;
  }

  .v72-opening[data-memory-mode="dual"] .v72-opening-footer {
    display: none !important;
  }
}

/* ======================================================
   3. Mobile / short phone landscape — one true decoder
====================================================== */
.v72-opening[data-memory-mode="single"] {
  --v72-mobile-column: min(calc(100vw - 2rem), 18rem);
}

.v72-opening[data-memory-mode="single"] .v72-opening-shell {
  padding: .85rem 1rem 1rem !important;
  display: grid !important;
  grid-template-columns: 1fr !important;
  grid-template-rows: auto auto !important;
  align-content: center !important;
  justify-items: center;
  gap: clamp(.6rem, 1.6vh, 1rem) !important;
}

.v72-opening[data-memory-mode="single"] .v72-opening-header {
  position: absolute;
  top: .75rem;
  left: 1rem;
  right: 1rem;
  width: auto;
}

.v72-opening[data-memory-mode="single"] .v72-opening-header .v72-opening-instance,
.v72-opening[data-memory-mode="single"] .v72-opening-header::after {
  display: none !important;
}

.v72-opening[data-memory-mode="single"] .v72-dual-memory-stage {
  grid-column: 1;
  grid-row: 1;
  display: block !important;
  align-self: end;
  justify-self: center;
  width: var(--v72-mobile-column) !important;
  aspect-ratio: 512 / 686 !important;
  margin-top: clamp(1.8rem, 4vh, 3rem);
}

.v72-opening[data-memory-mode="single"] .v72-memory-lane--b {
  display: none !important;
}

.v72-opening[data-memory-mode="single"] .v72-memory-lane {
  width: 100% !important;
  height: 100% !important;
  border-radius: clamp(10px, 3vw, 17px) !important;
}

.v72-opening[data-memory-mode="single"] .v72-opening-copy {
  grid-column: 1;
  grid-row: 2;
  align-self: start;
  justify-self: center;
  width: var(--v72-mobile-column) !important;
  text-align: center !important;
}

.v72-opening[data-memory-mode="single"] .v72-opening-copy::before {
  inset: -1.2rem -.75rem -1.2rem !important;
  background: radial-gradient(ellipse at 50% 45%, rgb(1 4 12 / .93), rgb(1 4 12 / .58) 56%, transparent 84%) !important;
}

.v72-opening[data-memory-mode="single"] .v72-opening-kicker {
  justify-content: center !important;
  margin-bottom: .6rem;
  font-size: clamp(.52rem, 2.6vw, .65rem);
}

.v72-opening[data-memory-mode="single"] .v72-opening-kicker::before {
  width: clamp(1.8rem, 10vw, 3rem);
}

.v72-opening[data-memory-mode="single"] .v72-title-sayonara {
  font-size: clamp(2.15rem, 10.4vw, 3rem) !important;
}

.v72-opening[data-memory-mode="single"] .v72-title-alice {
  font-size: clamp(2.62rem, 12.6vw, 3.65rem) !important;
}

.v72-opening[data-memory-mode="single"] .v72-opening-subtitle {
  width: 100% !important;
  max-width: 100% !important;
  margin: .72rem auto 0 !important;
  text-align: center !important;
  font-size: clamp(.74rem, 3.15vw, .88rem);
  line-height: 1.4;
}

.v72-opening[data-memory-mode="single"] .v72-opening-actions {
  width: 100% !important;
  max-width: 100% !important;
  margin: .78rem auto 0 !important;
  display: grid !important;
  grid-template-columns: 1fr;
  gap: .48rem;
}

.v72-opening[data-memory-mode="single"] .v72-enter,
.v72-opening[data-memory-mode="single"] .v72-archive-link {
  width: 100%;
  min-height: 40px;
  padding: .62rem .8rem;
  font-size: clamp(.56rem, 2.5vw, .68rem);
}

.v72-opening[data-memory-mode="single"] .v72-opening-footer {
  position: absolute;
  right: 1rem;
  bottom: .65rem;
  left: 1rem;
  justify-content: center;
}

.v72-opening[data-memory-mode="single"] .v72-opening-footer .v72-opening-coordinate {
  display: none;
}

@media (max-height: 700px) {
  .v72-opening[data-memory-mode="single"] {
    --v72-mobile-column: min(calc(100vw - 2rem), 16.9rem);
  }

  .v72-opening[data-memory-mode="single"] .v72-opening-shell {
    gap: .42rem !important;
  }

  .v72-opening[data-memory-mode="single"] .v72-dual-memory-stage {
    margin-top: 1.3rem;
  }

  .v72-opening[data-memory-mode="single"] .v72-opening-kicker {
    margin-bottom: .42rem;
  }

  .v72-opening[data-memory-mode="single"] .v72-opening-subtitle {
    margin-top: .5rem !important;
    line-height: 1.32;
  }

  .v72-opening[data-memory-mode="single"] .v72-opening-actions {
    margin-top: .55rem !important;
  }

  .v72-opening[data-memory-mode="single"] .v72-opening-footer {
    display: none !important;
  }
}

/* Short phone landscape remains single-channel but becomes horizontal. */
@media (max-height: 599px) and (orientation: landscape) {
  .v72-opening[data-memory-mode="single"] {
    --v72-mobile-column: min(36vw, 15rem);
  }

  .v72-opening[data-memory-mode="single"] .v72-opening-shell {
    grid-template-columns: minmax(230px, .8fr) minmax(0, 1fr) !important;
    grid-template-rows: 1fr !important;
    align-items: center;
    column-gap: clamp(1rem, 4vw, 3rem) !important;
    padding: .65rem 1.2rem !important;
  }

  .v72-opening[data-memory-mode="single"] .v72-dual-memory-stage {
    grid-column: 2;
    grid-row: 1;
    width: min(34vw, 15rem) !important;
    margin: 0;
  }

  .v72-opening[data-memory-mode="single"] .v72-opening-copy {
    grid-column: 1;
    grid-row: 1;
    width: min(42vw, 20rem) !important;
    text-align: left !important;
  }

  .v72-opening[data-memory-mode="single"] .v72-opening-kicker,
  .v72-opening[data-memory-mode="single"] .v72-opening-actions {
    justify-content: flex-start !important;
  }

  .v72-opening[data-memory-mode="single"] .v72-opening-subtitle {
    text-align: left !important;
  }
}

/* ======================================================
   Title Ignition — a blue memory shard activates the name
====================================================== */
.v72-js .v72-opening-title .v72-title-line {
  opacity: 0;
  clip-path: inset(0 100% 0 0);
  transform: translateY(.2em) skewX(-2deg);
}

.v72-opening.is-player-ready:not(.is-title-booted) .v72-title-sayonara {
  animation: v72TitleWake .72s cubic-bezier(.18, .8, .18, 1) .16s both;
}

.v72-opening.is-player-ready:not(.is-title-booted) .v72-title-alice {
  animation: v72TitleWake .82s cubic-bezier(.18, .8, .18, 1) .58s both;
}

.v72-title-ignition {
  position: absolute;
  z-index: 4;
  left: 1%;
  top: 14%;
  width: clamp(6px, .55vw, 10px);
  aspect-ratio: 1;
  border-radius: 70% 25% 70% 25%;
  opacity: 0;
  background: #d9feff;
  box-shadow:
    0 0 8px rgb(184 251 255 / .95),
    0 0 24px rgb(45 220 255 / .72),
    0 0 52px rgb(64 114 255 / .42);
  transform: rotate(45deg) scale(.25);
  pointer-events: none;
}

.v72-opening.is-player-ready:not(.is-title-booted) .v72-title-ignition {
  animation: v72TitleIgnitionPath 1.52s cubic-bezier(.24, .72, .19, 1) .24s both;
}

.v72-opening.is-player-ready:not(.is-title-booted) .v72-title-underscore {
  animation:
    v72IgnitionUnderscore 1.3s ease-out .48s both,
    v72UnderscoreIdle 4.8s ease-in-out 2.1s infinite;
}

.v72-opening.is-player-ready:not(.is-title-booted) .v72-title-extension {
  animation: v72ExtensionBoot .55s steps(5, end) 1.12s both;
}

.v72-opening.is-title-booted.is-memory-pulsing .v72-title-underscore {
  animation: v72UnderscoreMemoryPulse .92s ease-out both !important;
}

.v72-opening.is-title-booted.is-memory-pulsing .v72-title-alice {
  clip-path: none;
  opacity: 1;
  transform: translateX(.012em) !important;
  filter: drop-shadow(0 0 34px rgb(77 229 255 / .38)) brightness(1.06) !important;
  transition: filter .26s ease, transform .26s ease;
}

@keyframes v72TitleWake {
  0% {
    opacity: 0;
    clip-path: inset(0 100% 0 0);
    transform: translateY(.2em) skewX(-2deg);
    filter: blur(5px) brightness(.55);
  }
  58% {
    opacity: 1;
    filter: blur(0) brightness(1.22);
  }
  100% {
    opacity: 1;
    clip-path: inset(0 0 0 0);
    transform: translateY(0) skewX(0);
    filter: none;
  }
}

@keyframes v72TitleIgnitionPath {
  0% { left: 1%; top: 15%; opacity: 0; transform: rotate(45deg) scale(.2); }
  10% { opacity: 1; }
  43% { left: 91%; top: 15%; opacity: 1; transform: rotate(225deg) scale(1); }
  53% { left: 94%; top: 22%; transform: rotate(260deg) scale(.72); }
  66% { left: 82%; top: 72%; opacity: 1; transform: rotate(405deg) scale(1.2); }
  88% { left: 48%; top: 73%; opacity: .78; transform: rotate(540deg) scale(.62); }
  100% { left: 48%; top: 73%; opacity: 0; transform: rotate(585deg) scale(.15); }
}

@keyframes v72IgnitionUnderscore {
  0%, 32% { opacity: .2; transform: translateY(.08em) scaleX(.28); }
  46% { opacity: 1; transform: translateY(-.02em) scaleX(1.45); text-shadow: 0 0 28px rgb(79 235 255 / .92); }
  100% { opacity: 1; transform: none; }
}

@keyframes v72UnderscoreIdle {
  0%, 82%, 100% { opacity: .86; text-shadow: 0 0 14px rgb(45 218 255 / .28); }
  88% { opacity: 1; text-shadow: 0 0 25px rgb(83 237 255 / .72); }
  92% { opacity: .58; }
  95% { opacity: 1; }
}

@keyframes v72ExtensionBoot {
  0% { opacity: 0; transform: translateX(-.45em); }
  35% { opacity: .18; }
  55% { opacity: 1; }
  68% { opacity: .3; }
  100% { opacity: 1; transform: translateX(0); }
}

@keyframes v72UnderscoreMemoryPulse {
  0%, 100% { transform: none; opacity: 1; }
  30% { transform: translateY(-.08em) scaleX(1.55); opacity: 1; text-shadow: 0 0 32px rgb(96 242 255 / .9); }
  58% { transform: translateY(.04em) scaleX(.75); opacity: .6; }
}

@keyframes v72TitleMemoryAnswer {
  0%, 100% { filter: drop-shadow(0 0 22px rgb(26 205 255 / .18)); transform: translateX(0); }
  27% { filter: drop-shadow(0 0 34px rgb(77 229 255 / .38)); transform: translateX(.012em); }
  43% { transform: translateX(-.008em); }
}

.v72-opening.is-title-booted .v72-title-line {
  opacity: 1;
  clip-path: none;
  transform: none;
}

.v72-opening.is-title-booted .v72-title-ignition {
  display: none;
}

.v72-opening.is-title-booted:not(.is-memory-pulsing) .v72-title-underscore {
  animation: v72UnderscoreIdle 4.8s ease-in-out infinite;
}

.v72-opening.is-title-booted .v72-title-extension {
  opacity: 1;
  transform: none;
}

/* ======================================================
   System Spark — microtext top/lower slices separate only
   when a new memory arrives. No perpetual glitch loop.
====================================================== */
[data-v72-fragment] {
  position: relative;
  display: inline-block;
}

[data-v72-fragment]::before,
[data-v72-fragment]::after {
  content: attr(data-fragment-text);
  position: absolute;
  inset: 0;
  opacity: 0;
  pointer-events: none;
  white-space: nowrap;
  color: currentColor;
  text-shadow: 0 0 12px rgb(121 239 255 / .7);
}

[data-v72-fragment]::before {
  clip-path: polygon(0 0, 100% 0, 100% 43%, 0 56%);
}

[data-v72-fragment]::after {
  clip-path: polygon(0 52%, 100% 39%, 100% 100%, 0 100%);
}

.v72-opening.is-memory-pulsing [data-v72-fragment] {
  animation: v72MicroTextBody .68s steps(2, end) both;
}

.v72-opening.is-memory-pulsing [data-v72-fragment]::before {
  animation: v72FragmentUpper .72s cubic-bezier(.18, .72, .2, 1) both;
}

.v72-opening.is-memory-pulsing [data-v72-fragment]::after {
  animation: v72FragmentLower .72s cubic-bezier(.18, .72, .2, 1) both;
}

@keyframes v72MicroTextBody {
  0%, 100% { opacity: 1; transform: none; text-shadow: inherit; }
  24% { opacity: .62; transform: translateX(-1px); text-shadow: 2px 0 rgb(87 225 255 / .45), -1px 0 rgb(87 112 255 / .25); }
  36% { opacity: 1; transform: translateX(1px); }
}

@keyframes v72FragmentUpper {
  0%, 12% { opacity: 0; transform: translate(0, 0); }
  24% { opacity: .88; transform: translate(2px, -2px); }
  48% { opacity: .45; transform: translate(-1px, -4px); }
  100% { opacity: 0; transform: translate(0, -7px); }
}

@keyframes v72FragmentLower {
  0%, 18% { opacity: 0; transform: translate(0, 0); }
  30% { opacity: .65; transform: translate(-2px, 1px); }
  56% { opacity: .3; transform: translate(1px, 3px); }
  100% { opacity: 0; transform: translate(0, 5px); }
}

/* Entry animation for the newly grid-positioned stage. */
.v72-js .v72-opening .v72-dual-memory-stage {
  opacity: 0;
}

.v72-js .v72-opening.is-player-ready .v72-dual-memory-stage {
  opacity: 1;
  animation: v72UniversalStageArrival .9s cubic-bezier(.18, .78, .18, 1) both !important;
}

@keyframes v72UniversalStageArrival {
  from { opacity: 0; transform: translateY(14px) scale(.985); }
  to { opacity: 1; transform: translateY(0) scale(1); }
}

/* Enter transition must preserve the grid placement rather than restoring
   old absolute translate values from earlier v72 layers. */
body.is-entering .v72-opening .v72-dual-memory-stage {
  transform: scale(1.018) !important;
}

/* Accessibility: all text remains visible and decorative fragmentation stops. */
@media (prefers-reduced-motion: reduce) {
  .v72-js .v72-opening-title .v72-title-line,
  .v72-opening.is-player-ready .v72-title-sayonara,
  .v72-opening.is-player-ready .v72-title-alice,
  .v72-opening.is-memory-pulsing .v72-title-alice {
    opacity: 1 !important;
    clip-path: none !important;
    transform: none !important;
    filter: none !important;
    animation: none !important;
  }

  .v72-title-ignition,
  [data-v72-fragment]::before,
  [data-v72-fragment]::after {
    display: none !important;
  }

  [data-v72-fragment],
  .v72-title-underscore,
  .v72-title-extension,
  .v72-dual-memory-stage {
    animation: none !important;
    transform: none !important;
  }
}

/* Dual mode must explicitly undo the historical <=1100px single-lane rule. */
.v72-opening[data-memory-mode="dual"] .v72-memory-lane--b {
  display: block !important;
}

.v72-opening[data-memory-mode="dual"] .v72-opening-ambient--b {
  display: block !important;
}

/* Tablet portrait keeps both memories but uses the extra vertical room:
   the stage and copy form one centred stack instead of leaving the copy
   floating over the first portrait. */
@media (min-width: 700px) and (max-width: 1199px) and (min-height: 800px) and (orientation: portrait) {
  .v72-opening[data-memory-mode="dual"] .v72-opening-shell {
    grid-template-rows: auto auto auto auto !important;
    align-content: center !important;
    row-gap: clamp(.8rem, 1.8vh, 1.35rem) !important;
  }

  .v72-opening[data-memory-mode="dual"] .v72-opening-header {
    position: absolute;
    top: clamp(.9rem, 2vw, 1.45rem);
    left: var(--v72-stage-gutter);
    right: var(--v72-stage-gutter);
  }

  .v72-opening[data-memory-mode="dual"] .v72-dual-memory-stage {
    grid-column: 1;
    grid-row: 2;
    align-self: end;
    justify-self: center;
  }

  .v72-opening[data-memory-mode="dual"] .v72-opening-copy {
    grid-column: 1;
    grid-row: 3;
    align-self: start;
    justify-self: center;
    width: min(78vw, 34rem) !important;
    margin: 0 !important;
    transform: none !important;
    text-align: center !important;
  }

  .v72-opening[data-memory-mode="dual"] .v72-opening-copy::before {
    inset: -1.8rem -2.2rem -1.8rem !important;
    background: radial-gradient(ellipse at 50% 48%, rgb(1 4 12 / .96), rgb(1 4 12 / .68) 52%, transparent 84%) !important;
  }

  .v72-opening[data-memory-mode="dual"] .v72-opening-kicker,
  .v72-opening[data-memory-mode="dual"] .v72-opening-actions {
    justify-content: center !important;
  }

  .v72-opening[data-memory-mode="dual"] .v72-opening-subtitle {
    max-width: 31rem !important;
    margin-left: auto !important;
    margin-right: auto !important;
    text-align: center !important;
  }

  .v72-opening[data-memory-mode="dual"] .v72-opening-actions {
    margin-left: auto !important;
    margin-right: auto !important;
  }

  .v72-opening[data-memory-mode="dual"] .v72-opening-footer {
    grid-column: 1;
    grid-row: 4;
  }
}

/* Override the v72.04 mobile decoder selectors when the v72.09 engine has
   explicitly selected dual mode for a tablet/compact desktop. */
.v72-opening[data-memory-mode="dual"] .v72-dual-memory-stage {
  grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
}

.v72-opening[data-memory-mode="dual"] .v72-memory-lane--b,
.v72-opening[data-memory-mode="dual"] [data-v72-memory-lane="b"],
.v72-opening[data-memory-mode="dual"] [data-v72-video-portal="b"] {
  display: block !important;
  visibility: visible !important;
}

/* Video-buffer visibility is intentionally NOT forced here. The active
   v72.07/v72.08 hand-off engine owns visibility through is-prepared,
   is-incoming and is-visible. Forcing every B video visible exposes the
   next buffer frame before the crossfade. */
.v72-opening[data-memory-mode="dual"] [data-v72-opening-video^="b-"] {
  display: block !important;
}

/* Absolute portrait chrome uses the shell padding box, not an implicit grid area. */
@media (min-width: 700px) and (max-width: 1199px) and (min-height: 800px) and (orientation: portrait) {
  .v72-opening[data-memory-mode="dual"] .v72-opening-header {
    grid-column: auto !important;
    grid-row: auto !important;
  }
}
