* {
    box-sizing: border-box;
    font-family: "JetBrains Mono", monospace;
}

html,
body {
    margin: 0;
    width: 100%;
    height: 100%;
}

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

    background: #000;
    color: #fff;
}

a {
    color: #ffc073;
    text-decoration: none;
}

.profile {
    display: flex;
    flex-direction: column;
    align-items: center;
}

.avatar-container {
    position: relative;
    margin-bottom: 2rem;
}

.avatar {
    width: 12rem;
    height: 12rem;

    object-fit: cover;
    border-radius: 50%;
    outline: 2px solid #ffc07380;
}

.pfpbg {
    position: absolute;
    inset: 0;
    z-index: -1;

    width: 12rem;
    height: 12rem;

    border-radius: 50%;
    filter: blur(12px);

    background: #ffc07380;
}

h1 {
    margin: 0;
    font-size: 1.875rem;
}

.links {
    display: flex;
    gap: 0.5rem;
}