/* VOID.BG — Laser erase variant 1: Interference cancellation (moire) */

.v-laser-write.erase-v1{
  --erase-dur: 1.25s;
}

.v-laser-write.erase-v1.is-erasing{
  transform-origin: 50% 50%;
  animation: vEraseMoire var(--erase-dur) linear forwards;

  -webkit-mask-image:
    repeating-linear-gradient(90deg, #050608 0 3px, transparent 3px 6px),
    repeating-linear-gradient(0deg,  #050608 0 2px, transparent 2px 5px);
  mask-image:
    repeating-linear-gradient(90deg, #050608 0 3px, transparent 3px 6px),
    repeating-linear-gradient(0deg,  #050608 0 2px, transparent 2px 5px);

  -webkit-mask-size: 220px 100%, 100% 180px;
  mask-size: 220px 100%, 100% 180px;
  -webkit-mask-repeat: repeat;
  mask-repeat: repeat;
}

@keyframes vEraseMoire{
  0%{
    opacity: 1;
    filter: contrast(1.05) saturate(1.05);
    -webkit-mask-position: 0 0, 0 0;
    mask-position: 0 0, 0 0;
  }
  72%{
    opacity: 1;
    filter: contrast(1.25) saturate(1.0);
    -webkit-mask-position: 360px 0, 0 260px;
    mask-position: 360px 0, 0 260px;
  }
  100%{
    opacity: 0;
    filter: blur(10px) contrast(1.2);
    -webkit-mask-position: 720px 0, 0 520px;
    mask-position: 720px 0, 0 520px;
  }
}
