/* ═══════════════════════════════════════════════════════════════
   UJIYARI — Design Tokens
   All design decisions live here. Change once, applies everywhere.
═══════════════════════════════════════════════════════════════ */

:root {
  /* Brand Colors */
  --color-brand:        #1a3a5c;
  --color-brand-mid:    #1e4d7b;
  --color-brand-light:  #2563a8;
  --color-brand-dark:   #0f2238;
  --color-accent:       #e8830a;
  --color-accent-light: #fff4e6;
  --color-accent-dark:  #c06d08;
  --color-green:        #16a34a;
  --color-red:          #dc2626;

  /* Neutrals */
  --color-white:        #ffffff;
  --color-bg:           #f5f7fa;
  --color-surface:      #ffffff;
  --color-surface-alt:  #f0f4f8;
  --color-border:       #e2e8f0;
  --color-border-light: #edf2f7;

  /* Text */
  --color-text-primary:   #0f1923;
  --color-text-secondary: #3d4f63;
  --color-text-muted:     #6b7e96;
  --color-text-inverse:   #ffffff;

  /* Subject Tag Colors */
  --tag-polity:         #2563eb;
  --tag-economy:        #059669;
  --tag-environment:    #16a34a;
  --tag-science-tech:   #7c3aed;
  --tag-international:  #d97706;
  --tag-history:        #dc2626;
  --tag-geography:      #0891b2;
  --tag-social:         #db2777;
  --tag-security:       #475569;
  --tag-reports:        #0284c7;
  --tag-persons:        #ea580c;

  /* Typography */
  --font-sans:   'Inter', -apple-system, BlinkMacSystemFont, 'Segoe UI', sans-serif;
  --font-serif:  'Playfair Display', Georgia, serif;
  --font-mono:   'JetBrains Mono', monospace;

  --text-xs:    0.6875rem;
  --text-sm:    0.875rem;
  --text-base:  1rem;
  --text-lg:    1.125rem;
  --text-xl:    1.25rem;
  --text-2xl:   1.5rem;
  --text-3xl:   1.875rem;
  --text-4xl:   2.25rem;
  --text-5xl:   3rem;

  --font-normal:   400;
  --font-medium:   500;
  --font-semibold: 600;
  --font-bold:     700;
  --font-extrabold: 800;

  --leading-tight:   1.2;
  --leading-snug:    1.35;
  --leading-normal:  1.6;
  --leading-relaxed: 1.75;

  /* Spacing */
  --space-1:  0.25rem;
  --space-2:  0.5rem;
  --space-3:  0.75rem;
  --space-4:  1rem;
  --space-5:  1.25rem;
  --space-6:  1.5rem;
  --space-8:  2rem;
  --space-10: 2.5rem;
  --space-12: 3rem;
  --space-16: 4rem;
  --space-20: 5rem;
  --space-24: 6rem;

  /* Layout */
  --max-width-content: 780px;
  --max-width-wide:    1200px;
  --max-width-full:    1400px;
  --sidebar-width:     300px;
  --header-height:     64px;

  /* Border radius */
  --radius-sm:   4px;
  --radius-md:   8px;
  --radius-lg:   12px;
  --radius-xl:   16px;
  --radius-2xl:  24px;
  --radius-full: 9999px;

  /* Shadows */
  --shadow-xs:    0 1px 2px rgba(0,0,0,0.06);
  --shadow-sm:    0 1px 4px rgba(0,0,0,0.07), 0 1px 2px rgba(0,0,0,0.04);
  --shadow-md:    0 4px 16px rgba(0,0,0,0.08), 0 2px 4px rgba(0,0,0,0.04);
  --shadow-lg:    0 12px 32px rgba(0,0,0,0.10), 0 4px 8px rgba(0,0,0,0.05);
  --shadow-xl:    0 24px 48px rgba(0,0,0,0.12);
  --shadow-brand: 0 8px 24px rgba(26,58,92,0.20);

  /* Transitions */
  --transition-fast:   150ms cubic-bezier(0.4,0,0.2,1);
  --transition-normal: 250ms cubic-bezier(0.4,0,0.2,1);
  --transition-slow:   400ms cubic-bezier(0.4,0,0.2,1);

  /* Z-index */
  --z-dropdown: 100;
  --z-sticky:   200;
  --z-overlay:  300;
  --z-modal:    400;
}

/* ═══════════════════════════════════════════════════════════════
   DARK MODE — disabled (was auto-activating via OS preference
   and had mobile rendering issues). Light mode is now always used.
   To re-enable later, wrap dark token overrides in:
   @media (prefers-color-scheme: dark) { ... }
═══════════════════════════════════════════════════════════════ */