/* TradePilot design tokens (D-046). One file for both halves of the product:
   the signed-in app imports it into app.css (app/frontend/input.css) and the public site links it
   before pub.css. Light is the default; dark follows the system until the Theme button stores a
   choice (data-theme on <html>, applied before paint by static/theme.js).

   Colour roles
   - accent: TradePilot blue, the brand and the colour of primary actions. Deliberately not green,
     so the brand never competes with the gain/loss colours.
   - gain / loss: money going up or down. Always shown with an arrow or a sign as well.
   - ok / warn / danger / idle / paper / live: state badges and notices. Always with an icon and words.
   - nav: a dark "inverse" surface for selected segmented controls and the sign-in panel.
   Every text/background pair below is checked for WCAG AA contrast (tools/check_contrast.py). */

@font-face {
  font-family: "Inter";
  font-style: normal;
  font-display: swap;
  font-weight: 100 900;
  src: url("fonts/inter-latin-ext-wght-normal.woff2?v=5.3.0") format("woff2-variations");
  unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF;
}
@font-face {
  font-family: "Inter";
  font-style: normal;
  font-display: swap;
  font-weight: 100 900;
  src: url("fonts/inter-latin-wght-normal.woff2?v=5.3.0") format("woff2-variations");
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}

:root {
  --tp-font: "Inter", ui-sans-serif, system-ui, -apple-system, "Segoe UI", Roboto, sans-serif;
  --tp-mono: ui-monospace, SFMono-Regular, Menlo, Consolas, monospace;
  --tp-radius-sm: 8px;
  --tp-radius: 10px;
  --tp-radius-lg: 14px;
  --tp-shadow-sm: 0 1px 2px rgba(16, 24, 40, 0.06);
  --tp-shadow: 0 1px 2px rgba(16, 24, 40, 0.05), 0 4px 12px -4px rgba(16, 24, 40, 0.08);
  --tp-shadow-lg: 0 12px 32px -12px rgba(16, 24, 40, 0.22);

  --tp-page: #f5f7fb;
  --tp-surface: #ffffff;
  --tp-raise: #ffffff;
  --tp-card: #f1f4f9;
  --tp-ink: #101828;
  --tp-muted: #556074;
  --tp-border: #e1e6ef;
  --tp-border-strong: #c8d0de;
  --tp-bracket: #b9c3d3;
  --tp-accent: #2b54e0;
  --tp-accent-hover: #2247c4;
  --tp-accent-text: #2246c2;
  --tp-accent-soft: #edf1ff;
  --tp-on-accent: #ffffff;
  --tp-paper-bg: #e9eeff;
  --tp-paper-fg: #23409f;
  --tp-live-bg: #fdecea;
  --tp-live-fg: #9f2a20;
  --tp-ok-bg: #e4f5ec;
  --tp-ok-fg: #0b6640;
  --tp-warn-bg: #fff3d6;
  --tp-warn-fg: #7f4d00;
  --tp-danger-bg: #fdecea;
  --tp-danger-fg: #9f2a20;
  --tp-idle-bg: #edf0f5;
  --tp-idle-fg: #3a4557;
  --tp-nav: #111a2e;
  --tp-nav-2: #1a2540;
  --tp-nav-3: #2a3655;
  --tp-nav-ink: #d5dcea;
  --tp-nav-muted: #9aa6bd;
  --tp-practice: #2b54e0;
  --tp-off-strip: #3a4557;
  --tp-live-strip: #b42318;
  --tp-gain: #0a7a4a;
  --tp-loss: #c0352a;
  --tp-chart-1: #2b54e0;
  --tp-chart-2: #d97706;
  --tp-chart-3: #0a7a4a;
  --tp-chart-4: #9333ea;
  --tp-chart-5: #e05d2b;
  --tp-chart-6: #0e8fa8;
  /* The hero panel (sign-in, public About) is dark in both themes. */
  --tp-hero: #0f1830;
  --tp-hero-2: #1b2a55;
  --tp-hero-ink: #ffffff;
  --tp-hero-muted: #b8c3da;
  --tp-hero-accent: #9db1ff;
  color-scheme: light;
}

@media (prefers-color-scheme: dark) {
  :root:not([data-theme="light"]) {
    --tp-shadow-sm: 0 1px 2px rgba(0, 0, 0, 0.4);
    --tp-shadow: 0 1px 2px rgba(0, 0, 0, 0.35), 0 6px 16px -6px rgba(0, 0, 0, 0.5);
    --tp-shadow-lg: 0 16px 40px -12px rgba(0, 0, 0, 0.7);
    --tp-page: #0a0e16;
    --tp-surface: #111725;
    --tp-raise: #172033;
    --tp-card: #151c2b;
    --tp-ink: #e7ebf3;
    --tp-muted: #98a2b5;
    --tp-border: #222b3c;
    --tp-border-strong: #33405a;
    --tp-bracket: #33405a;
    --tp-accent: #7c98ff;
    --tp-accent-hover: #99afff;
    --tp-accent-text: #a3b6ff;
    --tp-accent-soft: #1b2448;
    --tp-on-accent: #0a0e16;
    --tp-paper-bg: #1b2448;
    --tp-paper-fg: #c6d2ff;
    --tp-live-bg: #3d1719;
    --tp-live-fg: #ffb4ab;
    --tp-ok-bg: #0f2f23;
    --tp-ok-fg: #84e2b4;
    --tp-warn-bg: #33270d;
    --tp-warn-fg: #f4c873;
    --tp-danger-bg: #3d1719;
    --tp-danger-fg: #ffb4ab;
    --tp-idle-bg: #1a2233;
    --tp-idle-fg: #bcc5d6;
    --tp-nav: #e7ebf3;
    --tp-nav-2: #cfd6e4;
    --tp-nav-3: #b6c0d3;
    --tp-nav-ink: #111725;
    --tp-nav-muted: #3a4557;
    --tp-practice: #7c98ff;
    --tp-off-strip: #2c3648;
    --tp-live-strip: #9b1f17;
    --tp-gain: #45d695;
    --tp-loss: #ff8579;
    --tp-chart-1: #7c98ff;
    --tp-chart-2: #f5b83d;
    --tp-chart-3: #45d695;
    --tp-chart-4: #c79bff;
    --tp-chart-5: #ff9a6b;
    --tp-chart-6: #4fd1e8;
    color-scheme: dark;
  }
}

:root[data-theme="dark"] {
  --tp-shadow-sm: 0 1px 2px rgba(0, 0, 0, 0.4);
  --tp-shadow: 0 1px 2px rgba(0, 0, 0, 0.35), 0 6px 16px -6px rgba(0, 0, 0, 0.5);
  --tp-shadow-lg: 0 16px 40px -12px rgba(0, 0, 0, 0.7);
  --tp-page: #0a0e16;
  --tp-surface: #111725;
  --tp-raise: #172033;
  --tp-card: #151c2b;
  --tp-ink: #e7ebf3;
  --tp-muted: #98a2b5;
  --tp-border: #222b3c;
  --tp-border-strong: #33405a;
  --tp-bracket: #33405a;
  --tp-accent: #7c98ff;
  --tp-accent-hover: #99afff;
  --tp-accent-text: #a3b6ff;
  --tp-accent-soft: #1b2448;
  --tp-on-accent: #0a0e16;
  --tp-paper-bg: #1b2448;
  --tp-paper-fg: #c6d2ff;
  --tp-live-bg: #3d1719;
  --tp-live-fg: #ffb4ab;
  --tp-ok-bg: #0f2f23;
  --tp-ok-fg: #84e2b4;
  --tp-warn-bg: #33270d;
  --tp-warn-fg: #f4c873;
  --tp-danger-bg: #3d1719;
  --tp-danger-fg: #ffb4ab;
  --tp-idle-bg: #1a2233;
  --tp-idle-fg: #bcc5d6;
  --tp-nav: #e7ebf3;
  --tp-nav-2: #cfd6e4;
  --tp-nav-3: #b6c0d3;
  --tp-nav-ink: #111725;
  --tp-nav-muted: #3a4557;
  --tp-practice: #7c98ff;
  --tp-off-strip: #2c3648;
  --tp-live-strip: #9b1f17;
  --tp-gain: #45d695;
  --tp-loss: #ff8579;
  --tp-chart-1: #7c98ff;
  --tp-chart-2: #f5b83d;
  --tp-chart-3: #45d695;
  --tp-chart-4: #c79bff;
  --tp-chart-5: #ff9a6b;
  --tp-chart-6: #4fd1e8;
  color-scheme: dark;
}