/* --- Transition overlay --- */
  #oa-transition {
    position: fixed;
    inset: 0;
    pointer-events: none;
    z-index: 2147483647;
    opacity: 0;
  }


  #oa-wipe {
    position: absolute;
    inset: -20%;
    background:
      linear-gradient(135deg,
        rgba(0,0,0,0) 0%,
        rgba(0,0,0,0) 45%,
        rgba(255,255,255,0.06) 46%,
        rgba(0,0,0,0.85) 50%,
        rgba(0,0,0,0.95) 100%);
    transform: translateX(-120%) skewX(-10deg);
    filter: contrast(1.2) saturate(0.9);
    image-rendering: pixelated;
  }


  #oa-scanlines {
    position: absolute;
    inset: 0;
    opacity: 0.0;
    background: repeating-linear-gradient(
      to bottom,
      rgba(0,0,0,0.06),
      rgba(0,0,0,0.06) 1px,
      rgba(0,0,0,0.0) 3px,
      rgba(0,0,0,0.0) 6px
    );
    mix-blend-mode: multiply;
  }

  .oa-melting {
    overflow: hidden;
  }

  .oa-melting body {
    filter: url(#oa-melt-filter);
    transform-origin: top center;
    animation: oa-body-melt 900ms cubic-bezier(.2,.8,.2,1) forwards;
  }

  @keyframes oa-body-melt {
    0%   { transform: translateY(0) scaleY(1);   filter: url(#oa-melt-filter); }
    60%  { transform: translateY(10px) scaleY(1.01); }
    100% { transform: translateY(40px) scaleY(1.04); }
  }

  .oa-melting #oa-transition {
    opacity: 1;
  }

  .oa-melting #oa-scanlines {
    opacity: 0.35;
    animation: oa-scan 900ms linear forwards;
  }

  @keyframes oa-scan {
    0% { transform: translateY(0); opacity: 0.0; }
    30% { opacity: 0.25; }
    100% { transform: translateY(18px); opacity: 0.35; }
  }

  .oa-melting #oa-wipe {
    animation: oa-wipe-in 900ms cubic-bezier(.2,.9,.2,1) forwards;
  }

  @keyframes oa-wipe-in {
    0%   { transform: translateX(-120%) skewX(-10deg); }
    60%  { transform: translateX(-10%)  skewX(-10deg); }
    100% { transform: translateX(120%)  skewX(-10deg); }
  }

  @media (prefers-reduced-motion: reduce) {
    .oa-melting body { animation: none; filter: none; transform: none; }
    .oa-melting #oa-wipe { animation: none; transform: translateX(0) skewX(0); }
    .oa-melting #oa-scanlines { animation: none; opacity: 0; }
  }