/* Nightjar Browser — shared visual identity for the app's own pages.
 *
 * Used by newtab.html and model_helper.html. The sidebar keeps its own
 * palette for now (ui/sidebar.css), so this is deliberately a token file and
 * nothing else: no element styles, no layout, no component rules. Each page
 * keeps the layout it already had and aliases its existing names onto these
 * tokens, which is why adopting this changed no page's structure.
 *
 * No @import and no webfont. Every page that links this is opened from disk
 * with zero outbound requests, and that promise is the product -- see
 * default_start_url() in shell/window.py. A font fetched from a CDN would
 * break it exactly the way a remote homepage would.
 *
 * The palette is the fruit the browser is named for: nightjar skin is a purple so
 * dark it reads near-black, and the flesh under it is a deep magenta. That
 * gives a near-black with a plum bias for text, a violet-leaning grey for
 * quiet surfaces, and the magenta as the one accent -- rather than a neutral
 * grey and a blue, which is what the pages had and could have belonged to
 * anything.
 *
 * Semantic colours (good/warn/bad) are kept separate from the accent on
 * purpose: a page that used the accent for "this model fits" would have no
 * colour left to say "this one does not".
 *
 * THEMING. Three states, not two. An explicit choice stamps data-theme on
 * <html>; the default "system" setting stamps nothing and is resolved by
 * prefers-color-scheme alone. So: bare :root carries the complete light
 * palette, the media query redefines tokens for a dark OS unless light was
 * explicitly chosen, and [data-theme="dark"] redefines them again so an
 * explicit choice wins over a light OS. Never give a colour its only
 * definition inside one of those blocks.
 */

:root {
    /* Surfaces, lightest to heaviest */
    --nightjar-ground:      #FBFAFC;
    --nightjar-surface:     #F3EFF5;
    --nightjar-surface-hi:  #EAE3EE;

    /* Text, strongest to quietest */
    --nightjar-ink:         #1D1520;
    --nightjar-ink-soft:    #6A5F71;
    --nightjar-ink-faint:   #8C8194;

    /* Rules and edges */
    --nightjar-line:        #DDD5E1;
    --nightjar-line-strong: #C4B8CB;

    /* The one accent */
    --nightjar-accent:      #7A2A5C;
    --nightjar-accent-soft: #F4E5EF;

    /* Semantic, deliberately not the accent */
    --nightjar-good:        #2E6B4A;
    --nightjar-good-soft:   #E4F0E8;
    --nightjar-good-line:   #A8C9B5;
    --nightjar-warn:        #8A5312;
    --nightjar-warn-soft:   #F8ECDD;
    --nightjar-bad:         #A33A22;
    --nightjar-bad-soft:    #FAE8E2;

    /* Type. Cross-platform by necessity -- this ships on Windows too, so the
     * macOS system faces can only ever be the first name in a stack.
     * ui-serif resolves to New York on macOS; Georgia carries Windows.
     * 'Outfit' stays first in the body stack because ui/sidebar.css already
     * chose it, and the app should not use two different sans faces. */
    --nightjar-display: ui-serif, "New York", Georgia, Cambria, "Times New Roman", serif;
    --nightjar-body:    'Outfit', -apple-system, BlinkMacSystemFont, "Segoe UI Variable", "Segoe UI", system-ui, sans-serif;
    --nightjar-mono:    ui-monospace, "SF Mono", "Cascadia Mono", Consolas, Menlo, monospace;
}

/* Dark OS, unless the viewer explicitly asked for light. */
@media (prefers-color-scheme: dark) {
    :root:not([data-theme="light"]) {
        --nightjar-ground:      #151019;
        --nightjar-surface:     #1F1824;
        --nightjar-surface-hi:  #2A2131;

        --nightjar-ink:         #EFE9F1;
        --nightjar-ink-soft:    #A697AE;
        --nightjar-ink-faint:   #7E7186;

        --nightjar-line:        #322839;
        --nightjar-line-strong: #4A3C53;

        --nightjar-accent:      #D08FB6;
        --nightjar-accent-soft: #2E1C2A;

        --nightjar-good:        #78C79B;
        --nightjar-good-soft:   #17291F;
        --nightjar-good-line:   #2E4A38;
        --nightjar-warn:        #E0A85C;
        --nightjar-warn-soft:   #2C2116;
        --nightjar-bad:         #E4906F;
        --nightjar-bad-soft:    #33201A;
    }
}

/* An explicit dark choice, which must also beat a light OS. */
:root[data-theme="dark"] {
    --nightjar-ground:      #151019;
    --nightjar-surface:     #1F1824;
    --nightjar-surface-hi:  #2A2131;

    --nightjar-ink:         #EFE9F1;
    --nightjar-ink-soft:    #A697AE;
    --nightjar-ink-faint:   #7E7186;

    --nightjar-line:        #322839;
    --nightjar-line-strong: #4A3C53;

    --nightjar-accent:      #D08FB6;
    --nightjar-accent-soft: #2E1C2A;

    --nightjar-good:        #78C79B;
    --nightjar-good-soft:   #17291F;
    --nightjar-good-line:   #2E4A38;
    --nightjar-warn:        #E0A85C;
    --nightjar-warn-soft:   #2C2116;
    --nightjar-bad:         #E4906F;
    --nightjar-bad-soft:    #33201A;
}