:root {
  /* Surfaces */
  --bg: #0A0D13;
  --surface: #10141D;
  --surface-2: #161B27;
  --surface-3: #1C2231;
  --line: #222938;
  --line-strong: #2E3648;

  /* Text */
  --text: #E9EDF5;
  --muted: #8B94A7;
  --faint: #5C6478;

  /* Brand accent: aged brass. CTAs, focus, active nav, the net worth curve. */
  --accent: #C9A961;
  --accent-bright: #DDBC75;
  --accent-soft: rgba(201, 169, 97, 0.12);
  --on-accent: #14100A;

  /* Money semantics only. Never decorative. */
  --gain: #3ECF8E;
  --gain-soft: rgba(62, 207, 142, 0.12);
  --loss: #F0616D;
  --loss-soft: rgba(240, 97, 109, 0.12);

  /* Type */
  --font-ui: "Segoe UI Variable Text", "Segoe UI", system-ui, -apple-system, sans-serif;
  --font-display: "Segoe UI Variable Display", "Segoe UI", system-ui, sans-serif;
  --font-mono: "Cascadia Mono", "Consolas", ui-monospace, monospace;

  /* Spacing scale */
  --sp-1: 4px;
  --sp-2: 8px;
  --sp-3: 16px;
  --sp-4: 24px;
  --sp-5: 32px;
  --sp-6: 48px;
  --sp-7: 64px;
  --sp-8: 96px;

  /* Shape */
  --r-sm: 6px;
  --r: 10px;
  --r-lg: 14px;

  /* Motion */
  --t-fast: 150ms ease-out;
  --t-med: 250ms ease-out;

  /* Layers */
  --z-nav: 100;
  --z-panel: 200;
  --z-toast: 300;
}