.type {
    color: #0000;
    background: linear-gradient(-90deg,#0000 5px,#0000 0) 10px 0, linear-gradient(#000 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 .7s infinite steps(1), t calc(var(--n)*.3s) steps(var(--n)) forwards;
    
    
}

@keyframes t {
    from {
        background-size: 0 200%
    }
}

@keyframes b {
    50% {
        background-position: 0 -100%,0 0
    }
}