/* Clinical blue on cool grey, sans-serif. Light first; dark follows the person's system setting
   person's system setting unless they chose in the header. */
:root {
    --ink: #1f2933;
    --muted: #52606d;
    --paper: #f5f7fa;
    --paper-glow: #dde9f7;
    --card: #ffffff;
    --line: #d9e2ec;
    --line-soft: #e4ecf4;
    --panel: #eef2f7;
    --line-strong: #bcccdc;
    --accent: #1f6feb;
    --accent-strong: #1858bd;
    --accent-ink: #ffffff;
    --font: system-ui, -apple-system, 'Segoe UI', Roboto, 'Helvetica Neue', Arial, sans-serif;
    --font-ui: system-ui, -apple-system, 'Segoe UI', Roboto, 'Helvetica Neue', Arial, sans-serif;
    --shadow: 0 1px 2px rgba(31, 41, 51, 0.06), 0 8px 24px rgba(31, 41, 51, 0.08);
}
:root[data-theme="dark"] {
    --ink: #e6edf3;
    --muted: #9aa7b4;
    --paper: #0f141a;
    --paper-glow: #16233a;
    --card: #181f28;
    --line: #2b3641;
    --line-soft: #222c36;
    --panel: #1f2833;
    --line-strong: #3a4754;
    --accent: #58a6ff;
    --accent-strong: #79b8ff;
    --accent-ink: #0f141a;
    --shadow: 0 1px 2px rgba(0, 0, 0, 0.5), 0 8px 24px rgba(0, 0, 0, 0.4);
}
@media (prefers-color-scheme: dark) {
    :root:not([data-theme="light"]) {
        --ink: #e6edf3;
        --muted: #9aa7b4;
        --paper: #0f141a;
        --paper-glow: #16233a;
        --card: #181f28;
        --line: #2b3641;
        --line-soft: #222c36;
        --panel: #1f2833;
        --line-strong: #3a4754;
        --accent: #58a6ff;
        --accent-strong: #79b8ff;
        --accent-ink: #0f141a;
        --shadow: 0 1px 2px rgba(0, 0, 0, 0.5), 0 8px 24px rgba(0, 0, 0, 0.4);
    }
}