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

body{
    background:#000;
    color:#bdbdbd;
    font-family:"Comic Neue",sans-serif;
    overflow:hidden;
    height:100vh;

    cursor:url("https://files.catbox.moe/u0zeqx.cur"), auto;
}

#loading-screen{
    position:fixed;
    inset:0;

    background:#000;

    display:flex;
    justify-content:center;
    align-items:center;

    z-index:9999;

    transition:1s ease;
}

#enter{
    font-size:30px;

    opacity:.6;

    cursor:pointer;

    transition:.3s;
}

#enter:hover{
    opacity:1;
    transform:scale(1.15);
}

#profile{
    position:absolute;

    top:50%;
    left:50%;

    transform:translate(-50%,-50%);

    text-align:center;

    opacity:0;
}

.avatar{
    width:90px;
    height:90px;

    border-radius:50%;

    margin-bottom:10px;

    animation:float 5s ease-in-out infinite;
}

h1{
    font-size:32px;
    margin-bottom:10px;
}

#typewriter{
    min-height:25px;
    margin-bottom:8px;

    font-size:15px;
}

#now-playing{

    font-size:12px;

    opacity:.7;

    margin-bottom:20px;
}

.socials{
    display:flex;

    justify-content:center;

    gap:18px;
}

.socials a{
    color:#bdbdbd;

    font-size:22px;

    transition:.3s;
}

.socials a:hover{
    color:white;

    transform:translateY(-3px);
}

@keyframes float{

    0%,100%{
        transform:translateY(0);
    }

    50%{
        transform:translateY(-6px);
    }
}

@keyframes pop{

    0%{
        opacity:0;
        transform:translate(-50%,-50%) scale(.85);
    }

    100%{
        opacity:1;
        transform:translate(-50%,-50%) scale(1);
    }
}