/* Design tokens.
 *
 * Inherited from Sentinel, a sibling product on this estate, rather than
 * designed fresh. No design frames were supplied for dependencywatch, and
 * these tokens are already contrast-tested against WCAG AA by a computed test
 * that reads this file. Re-picking colours by eye would have thrown that away
 * to arrive somewhere similar. See APPROVALS.md A-1.
 *
 * What DID change is the status vocabulary. Sentinel's states are open and
 * resolved; this product's are affected, unknown and not-affected, and the
 * middle one is the whole product. See --unknown below.
 *
 * Nothing is measured in pixels of viewport. Every width here is a max-width
 * or a fraction; there is no fixed shell, because a fixed shell is how a page
 * scrolls sideways on a 360px phone and the layout test in tests/ measures
 * exactly that.
 */

:root {
    /* Surfaces, from furthest back to nearest. */
    --bg:        #0d1117;
    --surface:   #161b22;
    --surface-2: #1c2230;
    --line:      #2a3140;
    --line-soft: #212836;

    /* Text. --muted is still 4.6:1 on --bg; it is quieter, not fainter than
     * legible. A "subtle" grey that fails contrast is a decision to make the
     * caption unreadable, taken by someone with a good monitor. */
    --ink:       #e8edf5;
    --muted:     #9aa7bd;
    /* Was #6b7688, which measured 3.46:1 on --surface-2 and failed WCAG AA on
     * all three surfaces. Lighthouse found it; the comment two lines up had
     * already predicted it and I shipped it anyway. tests/test_contrast.py
     * now computes every pair from this file, so the next one fails a test
     * rather than an audit. This value is 4.62:1 at worst. */
    --faint:     #808b9d;

    /* One accent, used for the thing you are meant to do next and nothing
     * else. An interface where four things glow has no emphasis at all. */
    --accent:    #5aa2ff;
    --accent-ink:#04182f;

    /* Status, and the reason this palette needed rethinking rather than
     * renaming.
     *
     * There are THREE states here, not two, and the third is not a midpoint
     * between the other two. "Unknown" does not mean "somewhat affected"; it
     * means nobody checked, or nobody could. Given a red-to-green ramp the eye
     * reads amber as "mildly bad" and skips it, which is precisely the outcome
     * this product must not produce -- an unknown is the row most likely to be
     * hiding something.
     *
     * So unknown is BLUE. Off the severity ramp entirely, so it reads as a
     * different KIND of thing rather than a lesser amount of the same thing.
     * It sorts above not-affected in the list for the same reason. */
    --affected:    #ff7b72;
    --affected-bg: #2c1417;
    --unknown:     #79b8ff;
    --unknown-bg:  #10203a;
    --clear:       #4ec98a;
    --clear-bg:    #0f2a1d;
    /* A new major version. Deliberately the quietest of the four: it is a
     * signal, not a finding, and giving it a loud colour next to a real CVE
     * teaches people that both are noise. */
    --bump:        #f0b429;
    --bump-bg:     #2a2110;

    /* Kept: app.css still references these, and Sentinel's meanings map
     * cleanly -- open work is amber, done is green. */
    --open:      #f0b429;
    --open-bg:   #2a2110;
    --resolved:  #4ec98a;
    --resolved-bg:#0f2a1d;
    --warn:      #ff8f6b;
    --warn-bg:   #2c1710;

    --radius:    10px;
    --radius-sm: 6px;

    /* A type scale that stays readable at 360px without a media query. */
    --step--1: clamp(0.82rem, 0.79rem + 0.14vw, 0.9rem);
    --step-0:  clamp(0.96rem, 0.93rem + 0.16vw, 1.05rem);
    --step-1:  clamp(1.13rem, 1.06rem + 0.34vw, 1.35rem);
    --step-2:  clamp(1.4rem,  1.24rem + 0.78vw, 1.9rem);
    --step-3:  clamp(1.75rem, 1.44rem + 1.55vw, 2.7rem);

    --sp-1: 0.35rem;
    --sp-2: 0.7rem;
    --sp-3: 1.1rem;
    --sp-4: 1.7rem;
    --sp-5: 2.6rem;
    --sp-6: 4rem;

    --wrap: 68rem;
    --prose: 40rem;

    --mono: ui-monospace, SFMono-Regular, "SF Mono", Menlo, Consolas,
            "Liberation Mono", monospace;
    --sans: system-ui, -apple-system, "Segoe UI", Roboto, "Helvetica Neue",
            Arial, sans-serif;
}