body.stroke1Active {
  isolation: isolate;
}

  body.stroke1Active::before,
  body.stroke1Active::after {
    content: "";
    position: fixed;
    pointer-events: none;
  }

  body.stroke1Active::before {
    inset: 0;
    z-index: -2;
    background-color: #ffffff;
    transform-origin: var(--stroke1-origin-x) var(--stroke1-origin-y);
    animation: stroke1WhiteOut 600ms cubic-bezier(0.22, 1, 0.36, 1) both;
  }

  body.stroke1Active::after {
    top: var(--stroke1-origin-y);
    left: var(--stroke1-origin-x);
    z-index: -1;
    width: 110vw;
    height: clamp(4px, 0.8vh, 14px);
    background: linear-gradient( 90deg, transparent 0%, rgba(255, 255, 255, 0.18) 8%, rgba(255, 255, 255, 0.92) 38%, #ffffff 50%, rgba(255, 255, 255, 0.92) 62%, rgba(255, 255, 255, 0.18) 92%, transparent 100% );
    box-shadow: 0 0 8px rgba(255, 255, 255, 1), 0 0 24px rgba(255, 255, 255, 0.72), 0 0 52px rgba(255, 255, 255, 0.38);
    animation: stroke1WhiteFlash 400ms cubic-bezier(0.16, 1, 0.3, 1) both;
  }

  body.stroke1Active.stroke1Fading::before {
    animation: stroke1WhiteFadeOut 460ms ease-in-out both;
  }

  body.stroke1Active.stroke1Fading::after {
    animation: stroke1WhiteFlashFadeOut 460ms ease-in-out both;
  }

@keyframes stroke1WhiteFlash {
  0% {
    opacity: 0;
    transform: translate(-50%, -50%) scaleX(0);
  }

  12% {
    opacity: 1;
    transform: translate(-50%, -50%) scaleX(0.04);
  }

  48% {
    opacity: 1;
    transform: translate(-50%, -50%) scaleX(1);
  }

  62% {
    opacity: 1;
    transform: translate(-50%, -50%) scaleX(1.04);
  }

  78% {
    opacity: 0.7;
    transform: translate(-50%, -50%) scaleX(1.08) scaleY(0.55);
  }

  100% {
    opacity: 0;
    transform: translate(-50%, -50%) scaleX(1.1) scaleY(0);
  }
}

@keyframes stroke1WhiteOut {
  0%, 42% {
    opacity: 0;
    transform: scaleY(0);
  }

  43% {
    opacity: 1;
    transform: scaleY(0.006);
  }

  58% {
    opacity: 1;
    transform: scaleY(0.02);
  }

  100% {
    opacity: 1;
    transform: scaleY(1);
  }
}

@keyframes stroke1WhiteFadeOut {
  from {
    opacity: var(--stroke1-fade-opacity, 1);
    transform: var(--stroke1-fade-transform, scaleY(1));
  }

  to {
    opacity: 0;
    transform: var(--stroke1-fade-transform, scaleY(1));
  }
}

@keyframes stroke1WhiteFlashFadeOut {
  from {
    opacity: var(--stroke1-flash-fade-opacity, 0);
    transform: var(--stroke1-flash-fade-transform, translate(-50%, -50%) scaleX(0));
  }

  to {
    opacity: 0;
    transform: var(--stroke1-flash-fade-transform, translate(-50%, -50%) scaleX(0));
  }
}
