@import url('https://fonts.googleapis.com/css2?family=Noto+Sans:ital,wght@0,100..900;1,100..900&display=swap');

:root {
    color-scheme: light dark;
    --background-color: #f5f7fa;
    --text-color: #121722;
    --muted-text: #4e596a;
    --surface-color: #ffffff;
    --surface-muted: #e8edf3;
    --border-color: #bcc7d6;
    --link-color: #0a67c2;
    --overlay-bg: rgba(255, 255, 255, 0.15);
    --input-bg: #ffffff;
    --input-text: #121722;
    --input-border: #98a7bb;
    --box-color: #e3e7ee;
}

@media (prefers-color-scheme: dark) {
    :root {
        --background-color: #000000;
        --text-color: #e7ecf5;
        --muted-text: #c7c8c9;
        --surface-color: #2d2d2d;
        --surface-muted: #424242;
        --border-color: #111111;
        --link-color: #77b9ff;
        --overlay-bg: rgba(29, 29, 29, 0.478);
        --input-bg: #2e2e2e;
        --input-text: #e7ecf5;
        --input-border: #6e6e6e;
        --box-color: #3d3d3d;
    }
}

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

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