/* Design tokens — single source of truth for colors, type, spacing, motion. */

:root {
  /* Surfaces */
  --bg: #F2F2F7;
  --surface: #FFFFFF;
  --surface-2: #F2F2F7;

  /* Borders */
  --border: #E5E5EA;
  --border-2: #D1D1D6;

  /* Text */
  --text: #000000;
  --muted: rgba(60, 60, 67, 0.6);
  --muted-strong: rgba(60, 60, 67, 0.7);
  --dim: rgba(60, 60, 67, 0.3);

  /* Fills */
  --fill-subtle: rgba(0, 0, 0, 0.04);
  --fill: rgba(0, 0, 0, 0.06);

  /* Interactive (dark button pattern) */
  --ink: #1C1C1E;
  --ink-on: #FFFFFF;

  /* Brand — money / hero / upgrade moments only */
  --forest: #1C3C2B;
  --mint: #75DC82;
  --mint-on-light: #3B8F45;
  --mint-tint: rgba(117, 220, 130, 0.15);

  /* Status */
  --success: #34C759;

  /* Type */
  --font: -apple-system, BlinkMacSystemFont, 'SF Pro Display', 'SF Pro Text', 'Segoe UI', Roboto, sans-serif;
  --font-num: 'SF Pro Display', -apple-system, system-ui, sans-serif;

  /* Motion */
  --ease: cubic-bezier(0.16, 1, 0.3, 1);
  --t-fast: 0.15s;
  --t-normal: 0.25s;
  --t-slow: 0.4s;
}

@media (prefers-color-scheme: dark) {
  :root {
    --bg: #19181E;
    --surface: #1C1C1E;
    --surface-2: #2C2C2E;

    --border: #38383A;
    --border-2: #48484A;

    --text: #FFFFFF;
    --muted: rgba(235, 235, 245, 0.6);
    --muted-strong: rgba(235, 235, 245, 0.7);
    --dim: rgba(235, 235, 245, 0.3);

    --fill-subtle: rgba(255, 255, 255, 0.06);
    --fill: rgba(255, 255, 255, 0.08);

    --ink: #FFFFFF;
    --ink-on: #000000;
  }
}