/* Design tokens — Apple design system */
:root {
  /* ── Brand & Interactive ─────────────────────────────────────── */
  --primary:         #0066cc;   /* Action Blue */
  --primary-hover:   #0071e3;   /* Focus Blue */
  --primary-pale:    rgba(0, 102, 204, 0.10);
  --on-primary:      #ffffff;

  /* ── Ink ───────────────────────────────────────────────────── */
  --ink:             #1d1d1f;
  --ink-80:          #333336;
  --mute:            #86868b;

  /* ── Canvas ────────────────────────────────────────────────── */
  --canvas:          #ffffff;
  --canvas-parchment:#f5f5f7;
  --canvas-pearl:    #fafafc;
  --hairline:        #d2d2d7;
  --divider:         #e8e8ed;

  /* ── Semantic — iOS system palette ─────────────────────────── */
  --positive:        #34c759;
  --positive-deep:   #248a3d;
  --warning:         #ff9f0a;
  --warning-deep:    #c77400;
  --negative:        #ff3b30;
  --negative-deep:   #c41e3a;

  /* ── Accent (charts) ───────────────────────────────────────── */
  --accent-cyan:     #5ac8fa;
  --accent-orange:   #ff9f0a;

  /* ── Aliases ───────────────────────────────────────────────── */
  --success: var(--positive);
  --error:   var(--negative);

  /* ── Radius ────────────────────────────────────────────────── */
  --r-xs:   5px;
  --r-sm:   8px;
  --r-md:   11px;
  --r-lg:   18px;
  --r-xl:   18px;   /* Apple canonical card radius */
  --r-pill: 9999px;

  /* ── Spacing (Apple HIG rhythm) ────────────────────────────── */
  --sp-xxs: 4px;
  --sp-xs:  8px;
  --sp-sm:  12px;
  --sp-md:  16px;
  --sp-lg:  24px;
  --sp-xl:  32px;
  --sp-xxl: 48px;
  --sp-3xl: 64px;

  /* ── Typography ────────────────────────────────────────────── */
  --font-display: -apple-system, BlinkMacSystemFont, 'SF Pro Display', 'Inter', system-ui, sans-serif;
  --font-body:    -apple-system, BlinkMacSystemFont, 'SF Pro Text', 'Inter', system-ui, sans-serif;
  --font-mono:    'SF Mono', ui-monospace, 'JetBrains Mono', 'Fira Code', monospace;
}

/* ── Theme: dark ─────────────────────────────────────────────── */
[data-theme="dark"] {
  --primary:      #2997ff;   /* Apple Blue on dark */
  --primary-pale: rgba(41, 151, 255, 0.12);
  --on-primary:   #ffffff;

  --bg:           #141416;
  --bg-sidebar:   #1c1c1e;
  --bg-card:      #1c1c1e;
  --bg-card-2:    #2c2c2e;
  --bg-card-green:#0d1f15;
  --text:         #f5f5f7;
  --text-muted:   #86868b;
  --border:       rgba(255, 255, 255, 0.08);
  --border-hover: rgba(255, 255, 255, 0.16);
  --chart-1:      #2997ff;
  --chart-2:      #5ac8fa;
  --chart-3:      #ff9f0a;
  --scrollbar:    #3a3a3c;
}

/* ── Theme: light ────────────────────────────────────────────── */
[data-theme="light"] {
  --bg:           var(--canvas-parchment);
  --bg-sidebar:   var(--canvas);
  --bg-card:      var(--canvas);
  --bg-card-2:    var(--canvas-parchment);
  --bg-card-green:#f0faf4;
  --text:         var(--ink);
  --text-muted:   var(--mute);
  --border:       var(--divider);
  --border-hover: var(--hairline);
  --chart-1:      #0066cc;
  --chart-2:      #5ac8fa;
  --chart-3:      #ff9f0a;
  --scrollbar:    var(--hairline);
}