.cover--transition-b-v05 .cover__video {
  transition: none;
}

.ctb-scene {
  position: absolute;
  z-index: 5;
  inset: 0;
  overflow: hidden;
  opacity: 0;
  pointer-events: none;
  contain: layout paint style;
  isolation: isolate;
}

.ctb-world {
  position: absolute;
  z-index: 1;
  left: 0;
  top: 0;
  width: 1080px;
  height: 1920px;
  overflow: hidden;
  transform-origin: 0 0;
  will-change: transform, opacity;
  backface-visibility: hidden;
  -webkit-backface-visibility: hidden;
}

.ctb-restoration,
.ctb-restoration > img {
  position: absolute;
  inset: 0;
  width: 1080px;
  height: 1920px;
}

.ctb-restoration > img {
  object-fit: cover;
}

.ctb-restoration {
  opacity: 1;
  transform: translateZ(0);
}

.ctb-restoration--hole {
  z-index: 0;
  /* Replace exactly the stale first-card footprint in the flattened video. */
  clip-path: polygon(370px 940px, 764px 908px, 810px 1430px, 412px 1462px);
  -webkit-clip-path: polygon(370px 940px, 764px 908px, 810px 1430px, 412px 1462px);
}

.ctb-restoration-card-two-reveal {
  position: absolute;
  z-index: 1;
  inset: 0;
  width: 1080px;
  height: 1920px;
  transform: translateZ(0);
  will-change: clip-path;
}

.ctb-restoration--card-two {
  z-index: 0;
  /* Repaint card two as one complete object above the hole patch. This keeps
     the hole boundary from cutting its photo or white frame. */
  clip-path: polygon(368px 900px, 796px 927px, 776px 1468px, 340px 1441px);
  -webkit-clip-path: polygon(368px 900px, 796px 927px, 776px 1468px, 340px 1441px);
}

.ctb-card {
  position: absolute;
  z-index: 2;
  left: 0;
  top: 0;
  width: 800px;
  height: 1048px;
  transform-origin: 0 0;
  will-change: transform, opacity;
  backface-visibility: hidden;
  -webkit-backface-visibility: hidden;
  filter: drop-shadow(5px 14px 20px rgba(72, 55, 47, .11));
}

.ctb-card-paper {
  position: absolute;
  inset: 0;
  width: 800px;
  height: 1048px;
}

.ctb-card-upgrade {
  position: absolute;
  z-index: 2;
  left: 42px;
  top: 58px;
  width: 718px;
  height: 806px;
  overflow: hidden;
  opacity: 0;
  will-change: opacity;
}

.ctb-card-upgrade img {
  position: absolute;
  left: -42px;
  top: -58px;
  width: 800px;
  height: 1200px;
}

.ctb-portal {
  position: absolute;
  inset: 0;
  overflow: hidden;
  opacity: 0;
  pointer-events: none;
  background: var(--paper, #f9f8f5);
  will-change: clip-path, opacity;
  transform: translateZ(0);
  backface-visibility: hidden;
  -webkit-backface-visibility: hidden;
}

.ctb-portal--outer { z-index: 4; }
.ctb-portal--inner { z-index: 6; }

.ctb-page {
  position: absolute;
  left: 0;
  top: 0;
  width: 100%;
  transform-origin: 0 0;
  will-change: transform;
  backface-visibility: hidden;
  -webkit-backface-visibility: hidden;
}

.ctb-page .visual-slice {
  width: 100%;
  max-width: none;
}

.ctb-page button,
.ctb-page a {
  pointer-events: none !important;
}

.ctb-vignette {
  position: absolute;
  z-index: 8;
  inset: -12%;
  pointer-events: none;
  opacity: 0;
  background: radial-gradient(
    ellipse at 63% 16%,
    transparent 0%,
    transparent 18%,
    rgba(70, 54, 51, .035) 54%,
    rgba(54, 43, 43, .14) 100%
  );
  will-change: opacity, transform;
}

.ctb-debug-replay {
  position: fixed;
  z-index: 420;
  right: max(14px, env(safe-area-inset-right));
  bottom: max(16px, env(safe-area-inset-bottom));
  display: grid;
  width: 44px;
  height: 44px;
  padding: 0;
  place-items: center;
  border: 1px solid rgba(97, 78, 116, .2);
  border-radius: 50%;
  color: #705c92;
  background: rgba(251, 249, 247, .9);
  box-shadow: 0 8px 26px rgba(58, 45, 51, .14);
  opacity: 0;
  pointer-events: none;
  transform: translate3d(0, 8px, 0) scale(.94);
  transition:
    opacity 220ms cubic-bezier(.23, 1, .32, 1),
    transform 260ms cubic-bezier(.23, 1, .32, 1);
  backdrop-filter: blur(12px);
  -webkit-backdrop-filter: blur(12px);
}

.ctb-debug-replay[data-ready="true"] {
  opacity: 1;
  pointer-events: auto;
  transform: translate3d(0, 0, 0) scale(1);
}

.ctb-debug-replay svg {
  width: 20px;
  height: 20px;
  fill: none;
  stroke: currentColor;
  stroke-linecap: round;
  stroke-linejoin: round;
  stroke-width: 1.7;
}

.ctb-debug-replay:focus-visible {
  outline: 2px solid #8c78b4;
  outline-offset: 3px;
}

@media (prefers-reduced-motion: reduce) {
  .ctb-debug-replay { display: none; }
}
