/* Design tokens shared by every page (desktop style.css + mobile.css).
   Load this BEFORE the page's own stylesheet. */
:root {
  /* type system: Inter for UI chrome/labels, JetBrains Mono for prices/data (both theme-agnostic) */
  --font-ui: "Inter", -apple-system, BlinkMacSystemFont, "Segoe UI", Helvetica, Arial, sans-serif;
  --font-mono: "JetBrains Mono", ui-monospace, "SF Mono", Menlo, Consolas, monospace;

  /* dark — the default / un-stamped theme */
  --bg: #0a0d12; --panel: #12161d; --panel-2: #161b24; --line: #232a37; --ink: #eef1f6;
  --muted: #8992a1; --up: #1f7954; --dn: #bd404e; --accent: #f0a93c; --blue: #4c8dff;
  --input-bg: #0a0d12; --btn-bg: #1a1f29; --active-bg: #1d2431;
  --grid: #171d26; --chart-bg: #0a0d12; --zeroline: #333d4d;
  --overlay: rgba(10, 13, 18, 0.78);
  --up-soft: rgba(38, 194, 129, 0.14); --dn-soft: rgba(255, 84, 104, 0.14);
  --blue-soft: rgba(76, 141, 255, 0.12);
  --up-glow: rgba(38, 194, 129, 0.35); --dn-glow: rgba(255, 84, 104, 0.35); --blue-glow: rgba(76, 141, 255, 0.4);
  --notes-bg: #211c10; --bad-bg: #2b141a;
  --pill-live-bg: #331319; --pill-paper-bg: #10233d;
  --txn-buy-bg: #0f2e20; --txn-sell-bg: #33161c; --evt-accent-bg: #2a2010;
  --shadow-sm: 0 1px 2px rgba(0, 0, 0, .5), 0 1px 1px rgba(0, 0, 0, .3);
  --shadow-md: 0 10px 30px rgba(0, 0, 0, .45), 0 2px 10px rgba(0, 0, 0, .3);
  --hairline: linear-gradient(180deg, rgba(255, 255, 255, .06), rgba(255, 255, 255, 0));
  --ring: 0 0 0 3px var(--blue-glow);
  color-scheme: dark;
}
:root[data-theme="light"] {
  --bg: #f4f6f9; --panel: #ffffff; --panel-2: #fbfcfe; --line: #dde2ea; --ink: #171b23;
  --muted: #667085; --up: #0f8a5f; --dn: #d6304a; --accent: #9a6300; --blue: #2563eb;
  --input-bg: #ffffff; --btn-bg: #eef1f6; --active-bg: #e7ebf3;
  --grid: #eaedf3; --chart-bg: #ffffff; --zeroline: #b7bfcc;
  --overlay: rgba(255, 255, 255, 0.9);
  --up-soft: rgba(15, 138, 95, 0.10); --dn-soft: rgba(214, 48, 74, 0.09);
  --blue-soft: rgba(37, 99, 235, 0.08);
  --up-glow: rgba(15, 138, 95, 0.22); --dn-glow: rgba(214, 48, 74, 0.22); --blue-glow: rgba(37, 99, 235, 0.25);
  --notes-bg: #fff8e6; --bad-bg: #fdecee;
  --pill-live-bg: #fdecee; --pill-paper-bg: #e8f0ff;
  --txn-buy-bg: #e5f7ee; --txn-sell-bg: #fdecee; --evt-accent-bg: #fff6e1;
  --shadow-sm: 0 1px 2px rgba(20, 24, 33, .06), 0 1px 1px rgba(20, 24, 33, .04);
  --shadow-md: 0 12px 28px rgba(20, 24, 33, .10), 0 2px 8px rgba(20, 24, 33, .06);
  --hairline: linear-gradient(180deg, rgba(20, 24, 33, .05), rgba(20, 24, 33, 0));
  --ring: 0 0 0 3px var(--blue-glow);
  color-scheme: light;
}