@media (prefers-color-scheme: light) {
    :root {
        --main-bg-color: blanchedalmond;
        --main-fg-color: rgb(255, 231, 202);
        --main-border-color: brown;
    }
}

@media (prefers-color-scheme: dark) {
    :root {
        --main-bg-color: #18181a;
        --main-fg-color: #1c1b22;
        /* --main-border-color: rgb(93, 154, 194); */
        --main-border-color: rgb(60, 105, 51);
    }
}

html {
    color-scheme: light dark;
}

body {
    font-family: System UI;
    font-size: 1.25rem;
    line-height: 1.5;
    background-color: var(--main-bg-color);
    padding: 0;
    margin: 0;
}

#titleBar {
    text-align: center;
    border-bottom: var(--main-border-color) 3px solid;
}

#titleBar > h1 {
    margin: 1rem;
}