/* Design tokens from DESIGN.md (Trade Radar). Dark theme only. */
:root {
  --surface-base: #131722;
  --surface-raised: #1e222d;
  --surface-sunken: #0f121a;
  --border-hairline: #2a2e39;
  --ink-primary: #d1d4dc;
  --ink-secondary: #9598a1;
  --ink-disabled: #4c525e;
  --accent: #2962ff;
  --buy: #089981;
  --sell: #f23645;
  --warning: #ff9800;
  --buy-tint: #08998126;
  --sell-tint: #f2364526;
  --warning-tint: #ff980026;
  /* Text-only variants (Story 6.7): >= 4.5:1 on every surface and tint they sit on. Fills, tints, dots,
     bars, borders and the focus ring keep the colours above. */
  --buy-text: #22ab94;
  --sell-text: #f77c80;
  --accent-text: #5b8cff;

  --font-ui: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Noto Sans Thai", sans-serif;
  --font-numeric: "SF Mono", "Roboto Mono", Consolas, monospace;
  --text-title: 600 1.125rem/1.5rem var(--font-ui);
  --text-section: 600 0.8125rem/1.125rem var(--font-ui);
  --text-body: 400 0.875rem/1.25rem var(--font-ui);
  --text-meta: 400 0.75rem/1rem var(--font-ui);
  --text-figure-lg: 600 1.75rem/2rem var(--font-numeric);
  --text-figure: 500 0.875rem/1.25rem var(--font-numeric);

  --radius-sm: 4px;
  --radius-md: 8px;
  --radius-full: 9999px;

  --space-1: 4px;
  --space-2: 8px;
  --space-3: 12px;
  --space-4: 16px;
  --space-5: 24px;
  --margin-mobile: 16px;
  --column-max: 480px;
  --tap-min: 44px;
}