/* V88: the classic Fight Club changeover cue is shared by every project. */

.s8 .wk-viewer:not(.open):not(.v71-cinema-open),
.s8 .wk-viewer:not(.open):not(.v71-cinema-open) * {
  pointer-events: none !important;
}

/* Remove the stray gold rule and the outline left on the last opened card. */
.s8 .sl::before {
  display: none !important;
}

.s8 .sl {
  gap: 0 !important;
}

.s8 .wk-card:focus,
.s8 .wk-card:focus-visible {
  outline: none !important;
}

/* Keep the 1px geometry, but never draw the gold thumbnail frame. */
.s8 .wk-thumb,
.s8 .wk-card:hover .wk-thumb,
.s8 .wk-card:focus .wk-thumb,
.s8 .wk-card:focus-visible .wk-thumb,
.s8 .wk-card:active .wk-thumb,
.s8 .wk-card.tap-on .wk-thumb {
  border-color: transparent !important;
}

#palmapost-v88-gallery-shell.is-returning[data-transition] {
  --cue-w: clamp(48px, 5.8vw, 76px);
  --cue-h: clamp(32px, 3.9vw, 52px);
  --cue-right: clamp(24px, 6.5vw, 92px);
  --cue-top: clamp(25px, 7vh, 74px);
}

#palmapost-v88-gallery-shell.is-returning[data-transition]::before,
#palmapost-v88-gallery-shell.is-returning[data-transition]::after {
  content: none;
  position: absolute;
  inset: auto;
  right: var(--cue-right);
  top: var(--cue-top);
  width: var(--cue-w);
  height: var(--cue-h);
  z-index: 3;
  background: transparent;
  border: 0;
  box-shadow: none;
  filter: none;
  pointer-events: none;
  box-sizing: border-box;
  transform-origin: center;
  animation: none;
}

#palmapost-v88-gallery-shell.is-returning[data-transition] .palmapost-v88-gallery-frame {
  backface-visibility: hidden;
  transform-origin: center;
  will-change: transform, opacity, filter, clip-path;
}

/* REEL: the clean Fight Club reference: one chalk-white hand-drawn oval. */
#palmapost-v88-gallery-shell.is-returning[data-transition="reel"] .palmapost-v88-gallery-frame {
  animation: v88-classic-splice 880ms steps(1, end) both;
}

#palmapost-v88-gallery-shell.is-returning[data-transition="reel"]::before {
  content: "";
  border: 3px solid rgba(255,252,218,.98);
  border-width: 3px 4px 2px 3px;
  border-radius: 53% 47% 51% 49% / 45% 55% 46% 54%;
  filter: blur(.25px) drop-shadow(0 0 2px rgba(255,255,230,.72));
  animation: v88-classic-cue 880ms steps(1, end) both;
}

#palmapost-v88-gallery-shell.is-returning[data-transition="reel"]::after {
  content: "";
  right: calc(var(--cue-right) + 3px);
  top: calc(var(--cue-top) - 1px);
  width: calc(var(--cue-w) - 4px);
  height: calc(var(--cue-h) + 2px);
  border: 1px solid rgba(255,255,232,.66);
  border-width: 1px 2px 2px 1px;
  border-radius: 48% 52% 46% 54% / 54% 47% 53% 46%;
  animation: v88-classic-echo 880ms steps(1, end) both;
}

@keyframes v88-classic-cue {
  0%, 8% { opacity: 0; transform: translate(0) rotate(-2deg) scale(.96); }
  9% { opacity: 1; }
  13% { opacity: .18; transform: translate(1px,-1px) rotate(1deg) scale(1.01); }
  16% { opacity: .94; }
  21% { opacity: .34; transform: translate(-1px,1px) rotate(-1deg); }
  24%, 46% { opacity: 1; transform: translate(0) rotate(.5deg) scale(1); }
  49% { opacity: .08; }
  52%, 58% { opacity: .92; transform: translate(2px,-1px) rotate(2deg) scale(.99); }
  61%, 100% { opacity: 0; }
}

@keyframes v88-classic-echo {
  0%, 11% { opacity: 0; transform: rotate(2deg); }
  12%, 20% { opacity: .55; }
  24%, 39% { opacity: .24; transform: rotate(-1deg) translate(1px,0); }
  43%, 56% { opacity: .62; transform: rotate(1deg); }
  59%, 100% { opacity: 0; }
}

@keyframes v88-classic-splice {
  0%, 60% { opacity: 1; transform: translate(0); filter: none; }
  61% { transform: translate(2px,-1px); filter: brightness(1.06) contrast(1.05); }
  64% { transform: translate(-1px,1px); filter: brightness(.94) contrast(1.08); }
  67% { opacity: 1; transform: translate(0); }
  68%, 100% { opacity: 0; }
}

/* CAI: two successive projectionist cues, then a one-frame gate jump. */
#palmapost-v88-gallery-shell.is-returning[data-transition="cai"] .palmapost-v88-gallery-frame {
  animation: v88-double-splice 920ms steps(1, end) both;
}

#palmapost-v88-gallery-shell.is-returning[data-transition="cai"]::before,
#palmapost-v88-gallery-shell.is-returning[data-transition="cai"]::after {
  content: "";
  border: 3px solid rgba(255,253,224,.96);
  border-radius: 51% 49% 54% 46% / 48% 52% 46% 54%;
  filter: blur(.2px) drop-shadow(0 0 3px rgba(255,250,215,.62));
}

#palmapost-v88-gallery-shell.is-returning[data-transition="cai"]::before {
  right: calc(var(--cue-right) + 15px);
  top: calc(var(--cue-top) + 8px);
  width: clamp(42px, 5vw, 66px);
  height: clamp(28px, 3.35vw, 45px);
  animation: v88-first-cue 920ms steps(1, end) both;
}

#palmapost-v88-gallery-shell.is-returning[data-transition="cai"]::after {
  border-width: 2px 4px 3px 2px;
  animation: v88-second-cue 920ms steps(1, end) both;
}

@keyframes v88-first-cue {
  0%, 7% { opacity: 0; transform: rotate(-4deg) scale(.95); }
  8%, 18% { opacity: .96; }
  20% { opacity: .2; transform: translate(1px,-1px) rotate(1deg); }
  22%, 29% { opacity: .82; }
  31%, 100% { opacity: 0; }
}

@keyframes v88-second-cue {
  0%, 33% { opacity: 0; transform: rotate(2deg) scale(.98); }
  34%, 47% { opacity: 1; }
  49% { opacity: .24; transform: translate(-2px,1px) rotate(-1deg); }
  52%, 62% { opacity: .94; }
  64%, 100% { opacity: 0; }
}

@keyframes v88-double-splice {
  0%, 63% { opacity: 1; transform: translateY(0); filter: none; }
  64% { transform: translateY(-10px); filter: brightness(1.16) contrast(1.08); }
  67% { transform: translateY(7px); filter: brightness(.88) contrast(1.14); }
  70% { opacity: 1; transform: translateY(0); }
  71%, 100% { opacity: 0; }
}

/* JESUS: a smoky emulsion blister and a single negative splice frame. */
#palmapost-v88-gallery-shell.is-returning[data-transition="jesus"] .palmapost-v88-gallery-frame {
  animation: v88-blister-splice 860ms steps(1, end) both;
}

#palmapost-v88-gallery-shell.is-returning[data-transition="jesus"]::before {
  content: "";
  border: 4px solid rgba(248,246,221,.9);
  border-color: rgba(255,254,231,.92) rgba(230,226,204,.72) rgba(255,255,239,.98) rgba(196,192,177,.64);
  border-radius: 58% 42% 51% 49% / 43% 57% 46% 54%;
  box-shadow: inset 0 0 8px 2px rgba(0,0,0,.78), 0 0 3px 1px rgba(255,255,231,.45);
  filter: blur(.45px);
  animation: v88-blister-cue 860ms steps(1, end) both;
}

#palmapost-v88-gallery-shell.is-returning[data-transition="jesus"]::after {
  content: "";
  right: calc(var(--cue-right) + 7px);
  top: calc(var(--cue-top) + 5px);
  width: calc(var(--cue-w) - 13px);
  height: calc(var(--cue-h) - 9px);
  border: 1px dashed rgba(255,255,234,.68);
  border-radius: 45% 55% 59% 41% / 53% 47% 55% 45%;
  box-shadow: inset 0 0 11px 4px rgba(0,0,0,.85);
  animation: v88-blister-core 860ms steps(1, end) both;
}

@keyframes v88-blister-cue {
  0%, 9% { opacity: 0; transform: scale(.75) rotate(-5deg); }
  10% { opacity: .72; transform: scale(.9) rotate(2deg); }
  15% { opacity: 1; transform: scale(1.04) rotate(-1deg); }
  20% { opacity: .42; transform: scale(.98) rotate(3deg); }
  24%, 48% { opacity: .94; transform: scale(1.1) rotate(-2deg); }
  52%, 58% { opacity: .58; transform: scale(1.16) rotate(2deg); }
  61%, 100% { opacity: 0; }
}

@keyframes v88-blister-core {
  0%, 13% { opacity: 0; transform: rotate(0); }
  14%, 31% { opacity: .8; }
  35%, 53% { opacity: .48; transform: rotate(7deg) scale(1.06); }
  57%, 100% { opacity: 0; }
}

@keyframes v88-blister-splice {
  0%, 61% { opacity: 1; transform: scale(1); filter: none; }
  62% { filter: grayscale(1) invert(1) contrast(1.35); }
  65% { filter: brightness(.1) contrast(1.5); transform: scale(1.006); }
  68% { opacity: 1; filter: none; }
  69%, 100% { opacity: 0; }
}

/* ME SALVE: a white cue with cyan/magenta registration ghosts. */
#palmapost-v88-gallery-shell.is-returning[data-transition="mesalve"] .palmapost-v88-gallery-frame {
  animation: v88-rgb-splice 900ms steps(1, end) both;
}

#palmapost-v88-gallery-shell.is-returning[data-transition="mesalve"]::before,
#palmapost-v88-gallery-shell.is-returning[data-transition="mesalve"]::after {
  content: "";
  border-radius: 50% 50% 47% 53% / 46% 54% 49% 51%;
}

#palmapost-v88-gallery-shell.is-returning[data-transition="mesalve"]::before {
  border: 3px solid rgba(235,255,255,.9);
  box-shadow: -4px 0 0 -1px rgba(28,229,255,.72), 4px 1px 0 -1px rgba(255,35,104,.68);
  filter: drop-shadow(0 0 2px rgba(255,255,240,.5));
  animation: v88-rgb-cue 900ms steps(1, end) both;
}

#palmapost-v88-gallery-shell.is-returning[data-transition="mesalve"]::after {
  right: calc(var(--cue-right) - 2px);
  top: calc(var(--cue-top) + 2px);
  border: 1px solid rgba(255,255,235,.7);
  box-shadow: inset -3px 0 rgba(0,229,255,.3), inset 3px 0 rgba(255,32,100,.28);
  animation: v88-rgb-echo 900ms steps(1, end) both;
}

@keyframes v88-rgb-cue {
  0%, 8% { opacity: 0; transform: translate(0) skewX(0); }
  9%, 17% { opacity: .96; }
  19% { opacity: .28; transform: translate(-5px,1px) skewX(-3deg); }
  22% { opacity: 1; transform: translate(4px,-1px) skewX(2deg); }
  25% { transform: translate(-2px,0); }
  29%, 48% { opacity: .92; transform: translate(0); }
  51% { opacity: .2; transform: translate(7px,1px); }
  54%, 61% { opacity: .88; transform: translate(-3px,0); }
  64%, 100% { opacity: 0; }
}

@keyframes v88-rgb-echo {
  0%, 14% { opacity: 0; }
  15%, 27% { opacity: .52; transform: translate(3px,0); }
  31%, 46% { opacity: .2; transform: translate(-4px,1px); }
  50%, 59% { opacity: .68; transform: translate(2px,-1px); }
  62%, 100% { opacity: 0; }
}

@keyframes v88-rgb-splice {
  0%, 63% { opacity: 1; transform: translateX(0); clip-path: inset(0); filter: none; }
  64% { transform: translateX(-9px); clip-path: inset(4% 0 64% 0); filter: contrast(1.4) saturate(1.7); }
  66% { transform: translateX(12px); clip-path: inset(38% 0 18% 0); filter: hue-rotate(12deg) contrast(1.6); }
  69% { opacity: 1; transform: translateX(0); clip-path: inset(0); filter: none; }
  70%, 100% { opacity: 0; }
}

/* CANTAO: an incomplete scratched cue, like a damaged hand-marked print. */
#palmapost-v88-gallery-shell.is-returning[data-transition="cantao"] .palmapost-v88-gallery-frame {
  animation: v88-scratch-splice 880ms steps(1, end) both;
}

#palmapost-v88-gallery-shell.is-returning[data-transition="cantao"]::before {
  content: "";
  border: 3px solid rgba(255,253,223,.94);
  border-right-color: transparent;
  border-bottom-color: rgba(255,253,223,.38);
  border-radius: 57% 43% 49% 51% / 44% 56% 47% 53%;
  filter: blur(.25px) drop-shadow(0 0 2px rgba(255,255,228,.7));
  animation: v88-scratch-cue 880ms steps(1, end) both;
}

#palmapost-v88-gallery-shell.is-returning[data-transition="cantao"]::after {
  content: "";
  right: calc(var(--cue-right) - 5px);
  top: calc(var(--cue-top) - 5px);
  width: calc(var(--cue-w) + 10px);
  height: calc(var(--cue-h) + 10px);
  border: 1px dashed rgba(255,255,226,.62);
  border-left-color: transparent;
  border-radius: 46% 54% 58% 42% / 55% 45% 52% 48%;
  box-shadow: 17px -9px 0 -8px rgba(255,255,233,.9), -12px 13px 0 -8px rgba(255,255,233,.74);
  animation: v88-scratch-echo 880ms steps(1, end) both;
}

@keyframes v88-scratch-cue {
  0%, 10% { opacity: 0; transform: rotate(-14deg) scale(.94); }
  11%, 22% { opacity: .96; }
  24% { opacity: .3; transform: rotate(7deg) scale(1.02); }
  27%, 45% { opacity: .9; transform: rotate(-4deg); }
  48% { opacity: .16; }
  51%, 60% { opacity: .82; transform: rotate(3deg) translate(1px,-1px); }
  63%, 100% { opacity: 0; }
}

@keyframes v88-scratch-echo {
  0%, 16% { opacity: 0; transform: rotate(0); }
  17%, 34% { opacity: .62; transform: rotate(8deg); }
  38%, 55% { opacity: .28; transform: rotate(-7deg); }
  59%, 100% { opacity: 0; }
}

@keyframes v88-scratch-splice {
  0%, 62% { opacity: 1; transform: translate(0); filter: none; }
  63% { filter: brightness(.08) contrast(1.6); transform: translate(1px,-2px); }
  66% { filter: brightness(1.7) grayscale(1); transform: translate(-1px,1px); }
  69% { opacity: 1; filter: none; transform: translate(0); }
  70%, 100% { opacity: 0; }
}

/* SOL: a restrained optical halo around the cue, never a full-screen flare. */
#palmapost-v88-gallery-shell.is-returning[data-transition="sol"] .palmapost-v88-gallery-frame {
  animation: v88-halo-splice 900ms steps(1, end) both;
}

#palmapost-v88-gallery-shell.is-returning[data-transition="sol"]::before {
  content: "";
  border: 3px solid rgba(255,255,238,.98);
  border-radius: 52% 48% 55% 45% / 47% 53% 44% 56%;
  box-shadow: 0 0 5px 1px rgba(255,255,235,.86), 0 0 16px 5px rgba(205,222,255,.32);
  animation: v88-halo-cue 900ms steps(1, end) both;
}

#palmapost-v88-gallery-shell.is-returning[data-transition="sol"]::after {
  content: "";
  right: calc(var(--cue-right) - 11px);
  top: calc(var(--cue-top) - 8px);
  width: calc(var(--cue-w) + 22px);
  height: calc(var(--cue-h) + 16px);
  border: 1px solid rgba(222,232,255,.42);
  border-radius: 50%;
  box-shadow: 0 0 20px 7px rgba(183,208,255,.24), inset 0 0 14px rgba(255,255,241,.2);
  filter: blur(1px);
  animation: v88-halo-echo 900ms steps(1, end) both;
}

@keyframes v88-halo-cue {
  0%, 9% { opacity: 0; transform: scale(.82) rotate(-2deg); }
  10% { opacity: .72; transform: scale(.94); }
  14%, 31% { opacity: 1; transform: scale(1); }
  34% { opacity: .34; transform: scale(1.08); }
  38%, 52% { opacity: .96; transform: scale(1.15) rotate(2deg); }
  56%, 63% { opacity: .52; transform: scale(1.22); }
  66%, 100% { opacity: 0; }
}

@keyframes v88-halo-echo {
  0%, 15% { opacity: 0; transform: scale(.7); }
  16%, 36% { opacity: .56; transform: scale(.9); }
  40%, 57% { opacity: .34; transform: scale(1.04); }
  61%, 100% { opacity: 0; transform: scale(1.12); }
}

@keyframes v88-halo-splice {
  0%, 64% { opacity: 1; transform: scale(1); filter: none; }
  65% { filter: brightness(1.85) contrast(.82) saturate(.65); transform: scale(1.003); }
  68% { filter: brightness(.72) contrast(1.2); }
  71% { opacity: 1; filter: none; transform: scale(1); }
  72%, 100% { opacity: 0; }
}

@media (prefers-reduced-motion: reduce) {
  #palmapost-v88-gallery-shell.is-returning[data-transition] .palmapost-v88-gallery-frame,
  #palmapost-v88-gallery-shell.is-returning[data-transition]::before,
  #palmapost-v88-gallery-shell.is-returning[data-transition]::after {
    animation-duration: 1ms !important;
    animation-delay: 0ms !important;
  }
}
