/**
 * MLI V2 Canonical Design Tokens (Remediated)
 * Authority: Approved Figma Design System (File Key: JtyaDAEBH10W7OkZGRnXL9)
 * 
 * CANONICAL FIGMA TOKENS (RECONCILED):
 * - Authority Navy:       #090E16
 * - Law Paper:            #FCF7EB
 * - Intelligence Surface: #F1F2F3
 * - Research Blue:        #144575
 * - Verified Green:       #14613D
 * - Provenance Gold:      #9E6B1F
 * 
 * SYSTEM / STATE TOKENS (FUNCTIONAL IMPLEMENTATION):
 * - Warning / Provisional Amber: #E65100 (Accessible status token)
 * - Alert / Repealed Red:        #C62828 (Accessible status token)
 * - Material Impact Purple:      #4A148C (Research Currency impact state)
 * - Historical Slate:            #475569 (Historical point-in-time state)
 * 
 * TYPOGRAPHY (FIGMA ALIGNED):
 * - Canonical UI & Primary Type: "Inter", -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, sans-serif
 * - Proposed Statutory Editorial Serif (Requires Design Approval): "Source Serif 4", "Georgia", serif
 */

:root {
  /* ==========================================================================
     MLI LAW CANONICAL DESIGN TOKENS (STAGE 8B-R2 / STAGE 9A)
     W3C DTCG Aligned | Strictly Preserved | International Enterprise Quality
     ========================================================================== */

  /* Core Surfaces & Canvas */
  --surface-canvas: #F8FAFC;
  --surface-parchment: #FBFBF9;
  --surface-card: #FFFFFF;
  --surface-paper: #FFFFFF;
  --surface-navy: #0A1324;
  --surface-midnight: #050B14;
  --surface-slate-dark: #0F172A;
  --surface-subtle: #F1F5F9;
  --surface-amber-subtle: #FEF3C7;
  --surface-emerald-subtle: #E8F5E9;
  --surface-rose-subtle: #FEE2E2;

  /* Typography Colors (High Contrast WCAG AA / AAA) */
  --text-ink: #0F172A;
  --text-primary: #1C2534;
  --text-secondary: #475569;
  --text-muted: #64748B;
  --text-light-muted: #94A3B8;
  --text-inverted: #FFFFFF;
  --text-inverted-muted: #CBD5E1;

  /* Brand & Institutional Accents */
  --accent-gold: #9E7B38;
  --accent-gold-hover: #8B6B2E;
  --accent-gold-soft: #F9F6F0;
  --accent-gold-wash: rgba(158, 123, 56, 0.15);

  /* Semantic Legal Status Colors */
  --status-verified: #1B5E20;
  --status-pipeline: #B45309;
  --status-overruled: #991B1B;
  --status-neutral: #64748B;

  /* Typography Families */
  --font-serif: "Charter", "Bitstream Charter", "Sitka Text", Cambria, Georgia, serif;
  --font-sans: "Inter", -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, sans-serif;
  --font-mono: "JetBrains Mono", "SF Mono", Menlo, Monaco, Consolas, monospace;

  /* Measures & Spacing */
  --measure-reading: 68ch;
  --container-mobile: 100%;
  --container-tablet: 720px;
  --container-desktop: 1200px;
  --container-bench: 1400px;

  /* Borders & Hairlines */
  --border-structural: 1px solid #E2E8F0;
  --border-subtle: #E2E8F0;
  --border-interactive: 1px solid #CBD5E1;
  --border-navy: 1px solid #1E293B;
  --border-gold: 1px solid #9E7B38;
  --border-gold-focus: 2px solid #9E7B38;

  /* Transitions */
  --transition-fast: 120ms cubic-bezier(0, 0, 0.2, 1);
  --transition-standard: 200ms cubic-bezier(0.16, 1, 0.3, 1);

  /* --- 1. Canonical Figma Color Foundation --- */
  --color-authority-navy: #090E16;      /* Figma: Authority / Institutional Navigation */
  --color-authority-navy-border: #162438;
  --color-authority-navy-contrast: #FFFFFF;

  --color-paper-base: #FCF7EB;          /* Figma: Law Paper reading surface */
  --color-paper-card: #FFFFFF;          /* Pure card surface */
  --color-paper-subtle: #F5EFE0;        /* Subtle paper alternate */
  --color-paper-border: #E6DECE;        /* Paper border */
  --color-paper-border-strong: #CFC5B2;

  --color-intel-surface: #F1F2F3;       /* Figma: Intelligence analytical surface */
  --color-intel-border: #D5D9DC;
  --color-intel-text: #1E293B;

  --color-research-blue: #144575;       /* Figma: Research interaction & action */
  --color-research-blue-hover: #0E3256;
  --color-research-blue-light: #EBF2F8;
  --color-research-blue-border: #A3C2E2;
  --color-focus-ring: #144575;          /* 2px accessible focus ring */

  --color-verified-green: #14613D;      /* Figma: Verified / Current law */
  --color-verified-green-bg: #E8F5EE;
  --color-verified-green-border: #A3D9BE;
  --color-verified-green-text: #14613D;

  --color-provenance-gold: #9E6B1F;     /* Figma: Source Provenance & Governance */
  --color-provenance-gold-hover: #7E5416;
  --color-provenance-gold-bg: #FCF6EC;
  --color-provenance-gold-border: #E8D3B0;
  --color-provenance-gold-text: #6B4710;

  /* --- 2. System State & Functional Implementation Tokens --- */
  --color-state-provisional-amber: #E65100;
  --color-state-provisional-bg: #FFF3E0;
  --color-state-provisional-border: #FFB74D;
  --color-state-provisional-text: #BF360C;

  --color-state-alert-red: #C62828;
  --color-state-alert-bg: #FFEBEE;
  --color-state-alert-border: #EF9A9A;
  --color-state-alert-text: #B71C1C;

  --color-state-impact-purple: #4A148C;
  --color-state-impact-bg: #F3E5F5;
  --color-state-impact-border: #CE93D8;
  --color-state-impact-text: #4A148C;

  --color-state-historical: #475569;
  --color-state-historical-bg: #F1F5F9;
  --color-state-historical-border: #CBD5E1;

  /* --- 3. Text & Typography Hierarchy --- */
  --color-text-primary: #090E16;        /* High-contrast dark */
  --color-text-secondary: #334155;      /* Subheads and secondary data */
  --color-text-muted: #64748B;          /* Hints, timestamps, captions */
  --color-text-subtle: #94A3B8;         /* Placeholders */
  --color-text-on-navy: #F8FAFC;
  --color-text-on-navy-muted: #94A3B8;

  /* Canonical Figma Typography: Inter */
  --font-canonical-ui: "Inter", -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif;
  --font-sans-ui: var(--font-canonical-ui);
  
  /* Proposed Statutory Editorial Serif (Requires Figma Approval) */
  --font-serif-statutory: "Source Serif 4", "Georgia", "Times New Roman", serif;
  
  --font-mono-legal: "SF Mono", "Menlo", "Consolas", monospace;

  /* Type Scale */
  --font-size-hero: 2rem;            /* 32px */
  --font-size-h1: 1.75rem;           /* 28px */
  --font-size-h2: 1.375rem;          /* 22px */
  --font-size-h3: 1.125rem;          /* 18px */
  --font-size-body: 1rem;            /* 16px */
  --font-size-body-sm: 0.875rem;     /* 14px */
  --font-size-caption: 0.75rem;      /* 12px */
  --font-size-badge: 0.6875rem;      /* 11px */

  --line-height-tight: 1.25;
  --line-height-normal: 1.5;
  --line-height-reading: 1.65;

  /* --- 4. Spacing Scale (4px Base Grid) --- */
  --space-1: 0.25rem;  /* 4px */
  --space-2: 0.5rem;   /* 8px */
  --space-3: 0.75rem;  /* 12px */
  --space-4: 1rem;     /* 16px */
  --space-5: 1.25rem;  /* 20px */
  --space-6: 1.5rem;   /* 24px */
  --space-8: 2rem;     /* 32px */
  --space-10: 2.5rem;  /* 40px */
  --space-12: 3rem;    /* 48px */
  --space-16: 4rem;    /* 64px */

  /* --- 5. Border Radii --- */
  --radius-xs: 2px;
  --radius-sm: 4px;
  --radius-md: 6px;
  --radius-lg: 8px;
  --radius-xl: 12px;
  --radius-pill: 9999px;

  /* --- 6. Elevations / Shadows --- */
  --shadow-sm: 0 1px 2px 0 rgba(0, 0, 0, 0.05);
  --shadow-md: 0 4px 6px -1px rgba(0, 0, 0, 0.07), 0 2px 4px -1px rgba(0, 0, 0, 0.04);
  --shadow-lg: 0 10px 15px -3px rgba(0, 0, 0, 0.09), 0 4px 6px -2px rgba(0, 0, 0, 0.04);

  /* --- 7. Responsive Layout Widths --- */
  --layout-max-width-content: 840px;
  --layout-max-width-standard: 1200px;
  --layout-max-width-wide: 1600px;

  --breakpoint-mobile: 767px;
  --breakpoint-tablet: 1024px;
  --breakpoint-desktop: 1280px;

  /* --- 8. Touch Targets (WCAG 2.2 AA) --- */
  --touch-target-min: 44px;
}
