@import "constants.css";

body {
    background-color: var(--background-primary);
    color: var(--accent-primary);
    text-align: center;
    font-family: Arial, sans-serif;
    margin: 0;
    height: 100vh;
    font-size: 2vh;

    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: space-around;

    text-shadow: 1px 1px 2px var(--shadow-color);
}

a {
    color: var(--link);
}

a:visited {
    color: var(--link-visited);
}

img.avatar {
    height: 20vh;
    border-radius: 100%;
}

a.mention {
    transition: background-color 50ms ease-out,color 50ms ease-out;
    border-radius: 3px;
    padding: 2px;
    font-weight: 500;
    unicode-bidi: plaintext;
    color: oklab(0.576971 0.014185 -0.208914);
    background: oklab(0.576971 0.014185 -0.208914 / 0.15);
    text-decoration: none;
    text-shadow: none;
}

a.mention:hover {
    text-decoration: underline;
    background: rgb(88, 101, 242);
    color: rgb(255, 255, 255);
}