.type{opacity: 0;
}
.type:hover {opacity: 1;

  color:#0000;
  background:
    linear-gradient(-90deg,#ed7994 5px,#0000 0) 10px 0,
    linear-gradient(#ed7994 0 0) 0 0;
  background-size:calc(var(--n)*1ch) 200%;
  -webkit-background-clip:padding-box,text;
  background-clip:padding-box,text;
  background-repeat:no-repeat;
  animation: 
   b .6s infinite steps(1),   
   t calc(var(--n)*.02s) steps(var(--n)) forwards;
  
}


@keyframes t{
  from {background-size:0 200%}
}
@keyframes b{
  50% {background-position:0 -100%,0 0}
}