@import url('https://fonts.googleapis.com/css2?family=JetBrains+Mono:wght@300&display=swap');

*{
    margin:0;
    padding:0;
    box-sizing:border-box;
}

body{
    background:#000;
    color:#fff;
    height:100vh;
    display:flex;
    justify-content:center;
    align-items:center;
    overflow:hidden;
    font-family:"JetBrains Mono", monospace;
}

.container{
    text-align:center;
    z-index:2;
}

h1{
    font-size:4rem;
    font-weight:300;
    letter-spacing:3px;
    margin-bottom:15px;
}

p{
    color:#666;
    font-size:1rem;
    letter-spacing:4px;
    text-transform:uppercase;
}

#noise{
    position:fixed;
    inset:0;
    opacity:.035;
    pointer-events:none;
    background:
        repeating-radial-gradient(circle at 0 0,#fff 0 1px,#000 2px 4px);
    animation:noise .25s infinite;
}

@keyframes noise{
    0%{transform:translate(0,0);}
    20%{transform:translate(-3%,2%);}
    40%{transform:translate(2%,-2%);}
    60%{transform:translate(-2%,1%);}
    80%{transform:translate(1%,-3%);}
    100%{transform:translate(0,0);}
}

.cursor::after{
    content:"_";
    animation:blink .8s infinite;
}

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