:root {
    --background: #fffbff;
    --text-color: #201a1b;
    --color-primary: var(--text-color);
    --color-text-links: #1565c0;
    --color-text-visited-secondry: #6a1b9a;
}

@media (prefers-color-scheme: dark) {
    :root {
        --background: #201a1b;
        --text-color: #ece0e0;
        --color-primary: rgba(255 255 255 / 90%);
        --color-text-links: #90caf9;
        --color-text-visited: rgba(255 255 255 / 90%);
    }
}

body {
    margin: 0;
    padding: 0;
    width: 100%;
    height: 100vh;
    display: grid;
    place-items: center;
    text-align: center;
    background-color: var(--background);
    color: var(--color-primary);
    overflow-y: scroll;
    hyphens: auto;
    line-height: 1.5em;
}

a {
    color: var(--color-text-links);
    text-decoration: none;
}

main {
    margin-left: auto;
    margin-right: auto;
    max-width: 800px;
    padding: 1em;
}

a:visited {
    color: var(--color-text-visited-secondry);
}