* {
    padding: 0;
    margin: 0;
    user-select: none;
}

#main {
    background-color: rgb(236, 236, 236);
    height: 100%;
    width: 100%;
    position: absolute;
    display: grid;
    place-items: center;
}

.text {
    font-size: 2rem;
    color: rgb(8, 8, 8);
    font-family: 'Cascadia Code';
}

.text::after {
  content: "";
  display: inline-block;
  width: 2.3px;
  height: 1em;
  background: currentColor;
  margin-left: 2px;
  vertical-align: -0.18em; /* tweak: try -0.05em to -0.2em */
  animation: blink 1.2s step-end infinite;
}

@keyframes blink {
    50% {
        opacity: 0;
    }
}