html, body {
    --size: 2rem;
    margin: 0;
    padding: 0;
    width: 100%;
    min-height: 100vh;
    display: flex;
    align-items: center;
    justify-content: center;
    text-align: center;
    font-family: Palatino, Helvetica, arial, sans-serif;
    /*overflow: hidden;*/
}
  
  
  output {
    display: flex;
    justify-content: center;
    padding: 50px;
    border: black solid;
  }
  
  output span {
    font-family: monospace, monospace;
    color: white;
    background: black;
    position: relative;
    z-index: 2;
    padding: 0;
    box-sizing: border-box;
    overflow: hidden;
    animation: show 0.125s linear 1;
    animation-fill-mode: forwards;
    font-size: var(--size);
    height: calc(var(--size) * 1.5);
    line-height: calc(var(--size) * 1.5);
    border-radius: 0.25rem;
    width: 0;
    margin: 0;
  }
  
  @keyframes show {
    100% { 
      width: var(--size); 
      margin: calc(var(--size) * 0.0625);
    }
  }
  
  
  output span.symbol {
    display: inline-block;
  }
  
  @keyframes animate {
  0.0000%{transform: translateY(-0.0000%);}
  1.6128%{transform: translateY(-0.0000%);}
  1.6129%{transform: translateY(-1.6129%);}
  3.2257%{transform: translateY(-1.6129%);}
  3.2258%{transform: translateY(-3.2258%);}
  4.8386%{transform: translateY(-3.2258%);}
  4.8387%{transform: translateY(-4.8387%);}
  6.4515%{transform: translateY(-4.8387%);}
  6.4516%{transform: translateY(-6.4516%);}
  8.0644%{transform: translateY(-6.4516%);}
  8.0645%{transform: translateY(-8.0645%);}
  9.6773%{transform: translateY(-8.0645%);}
  9.6774%{transform: translateY(-9.6774%);}
  11.2902%{transform: translateY(-9.6774%);}
  11.2903%{transform: translateY(-11.2903%);}
  12.9031%{transform: translateY(-11.2903%);}
  12.9032%{transform: translateY(-12.9032%);}
  14.5160%{transform: translateY(-12.9032%);}
  14.5161%{transform: translateY(-14.5161%);}
  16.1289%{transform: translateY(-14.5161%);}
  16.1290%{transform: translateY(-16.1290%);}
  17.7418%{transform: translateY(-16.1290%);}
  17.7419%{transform: translateY(-17.7419%);}
  19.3547%{transform: translateY(-17.7419%);}
  19.3548%{transform: translateY(-19.3548%);}
  20.9676%{transform: translateY(-19.3548%);}
  20.9677%{transform: translateY(-20.9677%);}
  22.5805%{transform: translateY(-20.9677%);}
  22.5806%{transform: translateY(-22.5806%);}
  24.1934%{transform: translateY(-22.5806%);}
  24.1935%{transform: translateY(-24.1935%);}
  25.8064%{transform: translateY(-24.1935%);}
  25.8065%{transform: translateY(-25.8065%);}
  27.4193%{transform: translateY(-25.8065%);}
  27.4194%{transform: translateY(-27.4194%);}
  29.0322%{transform: translateY(-27.4194%);}
  29.0323%{transform: translateY(-29.0323%);}
  30.6451%{transform: translateY(-29.0323%);}
  30.6452%{transform: translateY(-30.6452%);}
  32.2580%{transform: translateY(-30.6452%);}
  32.2581%{transform: translateY(-32.2581%);}
  33.8709%{transform: translateY(-32.2581%);}
  33.8710%{transform: translateY(-33.8710%);}
  35.4838%{transform: translateY(-33.8710%);}
  35.4839%{transform: translateY(-35.4839%);}
  37.0967%{transform: translateY(-35.4839%);}
  37.0968%{transform: translateY(-37.0968%);}
  38.7096%{transform: translateY(-37.0968%);}
  38.7097%{transform: translateY(-38.7097%);}
  40.3225%{transform: translateY(-38.7097%);}
  40.3226%{transform: translateY(-40.3226%);}
  41.9354%{transform: translateY(-40.3226%);}
  41.9355%{transform: translateY(-41.9355%);}
  43.5483%{transform: translateY(-41.9355%);}
  43.5484%{transform: translateY(-43.5484%);}
  45.1612%{transform: translateY(-43.5484%);}
  45.1613%{transform: translateY(-45.1613%);}
  46.7741%{transform: translateY(-45.1613%);}
  46.7742%{transform: translateY(-46.7742%);}
  48.3870%{transform: translateY(-46.7742%);}
  48.3871%{transform: translateY(-48.3871%);}
  49.9999%{transform: translateY(-48.3871%);}
  50.0000%{transform: translateY(-50.0000%);}
  51.6128%{transform: translateY(-50.0000%);}
  51.6129%{transform: translateY(-51.6129%);}
  53.2257%{transform: translateY(-51.6129%);}
  53.2258%{transform: translateY(-53.2258%);}
  54.8386%{transform: translateY(-53.2258%);}
  54.8387%{transform: translateY(-54.8387%);}
  56.4515%{transform: translateY(-54.8387%);}
  56.4516%{transform: translateY(-56.4516%);}
  58.0644%{transform: translateY(-56.4516%);}
  58.0645%{transform: translateY(-58.0645%);}
  59.6773%{transform: translateY(-58.0645%);}
  59.6774%{transform: translateY(-59.6774%);}
  61.2902%{transform: translateY(-59.6774%);}
  61.2903%{transform: translateY(-61.2903%);}
  62.9031%{transform: translateY(-61.2903%);}
  62.9032%{transform: translateY(-62.9032%);}
  64.5160%{transform: translateY(-62.9032%);}
  64.5161%{transform: translateY(-64.5161%);}
  66.1289%{transform: translateY(-64.5161%);}
  66.1290%{transform: translateY(-66.1290%);}
  67.7418%{transform: translateY(-66.1290%);}
  67.7419%{transform: translateY(-67.7419%);}
  69.3547%{transform: translateY(-67.7419%);}
  69.3548%{transform: translateY(-69.3548%);}
  70.9676%{transform: translateY(-69.3548%);}
  70.9677%{transform: translateY(-70.9677%);}
  72.5805%{transform: translateY(-70.9677%);}
  72.5806%{transform: translateY(-72.5806%);}
  74.1934%{transform: translateY(-72.5806%);}
  74.1935%{transform: translateY(-74.1935%);}
  75.8064%{transform: translateY(-74.1935%);}
  75.8065%{transform: translateY(-75.8065%);}
  77.4193%{transform: translateY(-75.8065%);}
  77.4194%{transform: translateY(-77.4194%);}
  79.0322%{transform: translateY(-77.4194%);}
  79.0323%{transform: translateY(-79.0323%);}
  80.6451%{transform: translateY(-79.0323%);}
  80.6452%{transform: translateY(-80.6452%);}
  82.2580%{transform: translateY(-80.6452%);}
  82.2581%{transform: translateY(-82.2581%);}
  83.8709%{transform: translateY(-82.2581%);}
  83.8710%{transform: translateY(-83.8710%);}
  85.4838%{transform: translateY(-83.8710%);}
  85.4839%{transform: translateY(-85.4839%);}
  87.0967%{transform: translateY(-85.4839%);}
  87.0968%{transform: translateY(-87.0968%);}
  88.7096%{transform: translateY(-87.0968%);}
  88.7097%{transform: translateY(-88.7097%);}
  90.3225%{transform: translateY(-88.7097%);}
  90.3226%{transform: translateY(-90.3226%);}
  91.9354%{transform: translateY(-90.3226%);}
  91.9355%{transform: translateY(-91.9355%);}
  93.5483%{transform: translateY(-91.9355%);}
  93.5484%{transform: translateY(-93.5484%);}
  95.1612%{transform: translateY(-93.5484%);}
  95.1613%{transform: translateY(-95.1613%);}
  96.7741%{transform: translateY(-95.1613%);}
  96.7742%{transform: translateY(-96.7742%);}
  98.3870%{transform: translateY(-96.7742%);}
  98.3871%{transform: translateY(-98.3871%);}
  99.9999%{transform: translateY(-98.3871%);}
  100.0000%{transform: translateY(-100.0000%);}
  }
  
  span.number::before {
    content: "A\A y\A G\A Z\A 0\A 3\A W\A j\A 1\A r\A";
    content: "A\A y\A G\A Z\A 0\A 3\A W\A j\A 1\A r\A Y\A J\A k\A D\A l\A d\A X\A U\A R\A a\A H\A g\A f\A 6\A v\A 7\A L\A x\A z\A I\A 5\A Q\A c\A 4\A 2\A n\A C\A N\A u\A T\A v\A q\A w\A t\A B\A s\A p\A V\A m\A K\A i\A O\A P\A h\A 8\A o\A S\A 9\A E\A F\A e\A M\A";
    
    animation: animate 0.0002s infinite;
    position: absolute;
    top: 0;
    left: 0;
    animation-play-state: paused;
  }
  
  span.u0::before { animation-duration: 0.00173454s; }
  span.u1::before { animation-duration: 0.00148639s; }
  span.u2::before { animation-duration: 0.00217324s; }
  span.u3::before { animation-duration: 0.00194568s; }
  span.u4::before { animation-duration: 0.00227657s; }
  span.u5::before { animation-duration: 0.00315454s; }
  span.u6::before { animation-duration: 0.00293465s; }
  span.u7::before { animation-duration: 0.00104548s; }
  span.u8::before { animation-duration: 0.00373451s; }
  span.u9::before { animation-duration: 0.00245781s; }
  
  input {opacity: 0.001}
  input:checked + label span.number::before {
    animation-play-state: running;
  }
  
  