@media (prefers-color-scheme: dark) {
    :root {
        --background: #202225;
        --background-code: #1e2022;
        --foreground: #f8f8f8;
        --blurple: #7289da;
    }
}

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

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

.container {
    text-align: center;
}

body {
    background-color: var(--background);
}

*,
body {
    color: var(--foreground);
    font-family: Arial, -system-ui, -apple-system, BlinkMacSystemFont, sans-serif;
}

a {
    color: var(--blurple);
    /* nothing else to put here! */
}

h5 {
    color: var(--foreground-notice);
}

code {
    font-family: 'Consolas', monospace;
    padding: 3px;
    background-color: var(--background-code);
    border: none;
    border-radius: 3px;
}