/* ============================================================
   DESIGN TOKENS — "Minimal Editorial (Trust)" — Veritya Daily
   Brand color: Indigo #4F46E5 (per brand-identity.md)
   ============================================================ */

:root {
  /* 60% DOMINANT: Backgrounds */
  --bg-primary:   #FFFFFF;
  --bg-soft:      #F8FAFC;
  --surface:      #FFFFFF;

  /* 30% SECONDARY: Text & structure */
  --text-primary: #1A1A1A;
  --text-secondary: #4B5563;
  --text-muted:   #6B7280;
  --border:       #E5E7EB;

  /* 10% ACCENT: Brand color — Indigo */
  --brand-blue:        #4F46E5;
  --brand-blue-hover:  #4338CA;
  --brand-blue-soft:   #EEF0FB;

  /* Semantic colors */
  --green-up:    #10B981;
  --red-down:    #EF4444;
  --amber:       #F59E0B;

  /* Typography */
  --font-display: 'Source Serif 4', Georgia, 'Times New Roman', serif;
  --font-body:    'Inter', -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif;
  --font-mono:    'JetBrains Mono', 'SFMono-Regular', Consolas, monospace;

  /* Type scale — mobile base 17px, ratio 1.250 (Major Third) */
  --fs-caption: 12px;
  --fs-body:    17px;
  --fs-h3:      21px;
  --fs-h2:      26px;
  --fs-h1:      33px;
  --fs-display: 41px;

  --lh-tight:   1.1;
  --lh-heading: 1.25;
  --lh-snug:    1.3;
  --lh-body:    1.5;
  --lh-relaxed: 1.6;

  /* Spacing (8px grid) */
  --space-1:  4px;
  --space-2:  8px;
  --space-3:  16px;
  --space-4:  24px;
  --space-5:  32px;
  --space-6:  40px;
  --space-7:  48px;
  --space-8:  64px;
  --space-9:  96px;

  /* Layout */
  --container-max:   1200px;
  --article-max:     680px;
  --mobile-margin:   16px;
  --desktop-margin:  32px;

  /* Radius */
  --radius-sm: 8px;
  --radius:    12px;
  --radius-pill: 999px;

  /* Touch targets */
  --touch-min: 48px;

  /* Header height */
  --header-height: 64px;
  --bottom-nav-height: 64px;

  /* Transitions */
  --transition-fast: 150ms ease;
  --transition:      250ms ease;
}

/* ============================================================
   DARK MODE — swaps tokens via [data-theme="dark"]
   ============================================================ */
[data-theme="dark"] {
  --bg-primary:    #0D1117;
  --bg-soft:       #161B22;
  --surface:       #151A23;
  --text-primary:  #E6EDF3;
  --text-secondary: #9CA3AF;
  --text-muted:    #8B949E;
  --border:        #2A2F3A;

  --brand-blue:        #818CF8;
  --brand-blue-hover:  #A5B4FC;
  --brand-blue-soft:   #1E1B4B;

  --green-up:  #3FD99B;
  --red-down:  #FF6B6B;
  --amber:     #FBBF24;
}