This is a <span class="type" style="--n:53">CSS only solution for a multi-line typewriter effect.</span>

body {
  font-family: monospace;
  font-weight: 700;
  font-size:50px;
  padding:20px;
  background:#005F6B;
  color:#00DFFC
}

.type {
  color:#0000;
  background:
    linear-gradient(-90deg,#00DFFC 5px,#0000 0) 10px 0,
    linear-gradient(#00DFFC 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}
}