/* ==========================================================================
   theme.css — GENERATED by make_theme_css.py. Do not edit by hand.

   Three themes and one automatic mode. Every color in every Trifecta app
   resolves from these custom properties, so a theme is a block that redefines
   them and NOTHING else — no per-theme rules anywhere in styles.css.

   `data-theme` goes on <html>, never on <body>: `html, body { background:
   var(--paper) }` means an attribute on <body> leaves the page behind the
   content painted in the other theme.
   ========================================================================== */

:root,
[data-theme="light"],
[data-theme="auto"] {
  --ink: #101842;
  --ink-soft: #2D3459;
  --text: #101842;
  --text-muted: #555A76;
  --paper: #F5F3EF;
  --paper-tint: #FAF9F7;
  --paper-card: #FFFFFF;
  --panel: #EEECE8;
  --panel-2: #E9E7E3;
  --line: #E1E0DC;
  --line-strong: #D5D3D0;
  --accent: #0053A5;
  --accent-hover: #063E82;
  --accent-soft: #E6EEF6;
  --accent-ink: #FFFFFF;
  --accent-2: #0067C6;
  --accent-3: #00A0E2;
  --profit: #1B8A5A;
  --profit-soft: #E4F5EC;
  --profit-text: #177A4F;
  --loss: #C0392B;
  --loss-soft: #FBE9E7;
  --loss-text: #A6301F;
  --warn: #B8860B;
  --warn-soft: #FBF3DE;
  --warn-line: #E9D9A8;
  --warn-text: #6B5B10;
  --shadow-strong: rgba(16, 24, 66, 0.16);
  --shadow-soft: rgba(20, 33, 58, 0.06);
}

[data-theme="navy"] {
  --ink: #F5F3EF;
  --ink-soft: #D3D4D9;
  --text: #F5F3EF;
  --text-muted: #999BA7;
  --paper: #0B112E;
  --paper-tint: #171D38;
  --paper-card: #161C37;
  --panel: #212641;
  --panel-2: #282E47;
  --line: #32374F;
  --line-strong: #4A4F64;
  --accent: #73A0CE;
  --accent-hover: #99BADB;
  --accent-soft: #2B3049;
  --accent-ink: #0B112E;
  --accent-2: #0067C6;
  --accent-3: #00A0E2;
  --profit: #76B99C;
  --profit-soft: #232943;
  --profit-text: #76B99C;
  --loss: #D98880;
  --loss-soft: #232943;
  --loss-text: #D98880;
  --warn: #D4B66D;
  --warn-soft: #232943;
  --warn-line: #3C4158;
  --warn-text: #D4B66D;
  --shadow-strong: rgba(0, 0, 0, 0.45);
  --shadow-soft: rgba(0, 0, 0, 0.28);
}

[data-theme="charcoal"] {
  --ink: #F5F3EF;
  --ink-soft: #D5D5D6;
  --text: #F5F3EF;
  --text-muted: #9C9D9E;
  --paper: #131519;
  --paper-tint: #1F2124;
  --paper-card: #1E2023;
  --panel: #282A2E;
  --panel-2: #2F3135;
  --line: #393A3E;
  --line-strong: #505255;
  --accent: #73A0CE;
  --accent-hover: #99BADB;
  --accent-soft: #323337;
  --accent-ink: #131519;
  --accent-2: #0067C6;
  --accent-3: #00A0E2;
  --profit: #76B99C;
  --profit-soft: #2B2C30;
  --profit-text: #76B99C;
  --loss: #D98880;
  --loss-soft: #2B2C30;
  --loss-text: #D98880;
  --warn: #D4B66D;
  --warn-soft: #2B2C30;
  --warn-line: #424447;
  --warn-text: #D4B66D;
  --shadow-strong: rgba(0, 0, 0, 0.45);
  --shadow-soft: rgba(0, 0, 0, 0.28);
}

/* "Match my computer".
 *
 * Resolved by the BROWSER, in CSS, before first paint — never by JavaScript.
 * That matters: the no-flash mechanism has the server stamp `data-theme` into
 * the page shell, and the server cannot know what somebody's operating system
 * is set to. Only the browser can. So `auto` is a media query, and it has
 * exactly the same no-flash behavior as a fixed theme.
 *
 * `data-dark` says WHICH dark, because Windows and macOS say "dark" and this
 * suite has two of them.
 */
@media (prefers-color-scheme: dark) {
  [data-theme="auto"][data-dark="navy"] {
    --ink: #F5F3EF;
    --ink-soft: #D3D4D9;
    --text: #F5F3EF;
    --text-muted: #999BA7;
    --paper: #0B112E;
    --paper-tint: #171D38;
    --paper-card: #161C37;
    --panel: #212641;
    --panel-2: #282E47;
    --line: #32374F;
    --line-strong: #4A4F64;
    --accent: #73A0CE;
    --accent-hover: #99BADB;
    --accent-soft: #2B3049;
    --accent-ink: #0B112E;
    --accent-2: #0067C6;
    --accent-3: #00A0E2;
    --profit: #76B99C;
    --profit-soft: #232943;
    --profit-text: #76B99C;
    --loss: #D98880;
    --loss-soft: #232943;
    --loss-text: #D98880;
    --warn: #D4B66D;
    --warn-soft: #232943;
    --warn-line: #3C4158;
    --warn-text: #D4B66D;
    --shadow-strong: rgba(0, 0, 0, 0.45);
    --shadow-soft: rgba(0, 0, 0, 0.28);
  }
  [data-theme="auto"][data-dark="charcoal"] {
    --ink: #F5F3EF;
    --ink-soft: #D5D5D6;
    --text: #F5F3EF;
    --text-muted: #9C9D9E;
    --paper: #131519;
    --paper-tint: #1F2124;
    --paper-card: #1E2023;
    --panel: #282A2E;
    --panel-2: #2F3135;
    --line: #393A3E;
    --line-strong: #505255;
    --accent: #73A0CE;
    --accent-hover: #99BADB;
    --accent-soft: #323337;
    --accent-ink: #131519;
    --accent-2: #0067C6;
    --accent-3: #00A0E2;
    --profit: #76B99C;
    --profit-soft: #2B2C30;
    --profit-text: #76B99C;
    --loss: #D98880;
    --loss-soft: #2B2C30;
    --loss-text: #D98880;
    --warn: #D4B66D;
    --warn-soft: #2B2C30;
    --warn-line: #424447;
    --warn-text: #D4B66D;
    --shadow-strong: rgba(0, 0, 0, 0.45);
    --shadow-soft: rgba(0, 0, 0, 0.28);
  }
}