/* ============================================================
   Antara Design Tokens — v1.0.0
   Source of truth: DESIGN_SYSTEM.md
   ============================================================ */

:root {
  /* ---------- Brand colors ---------- */
  --antara-crimson: #8B0000;
  --antara-orange:  #EE5A0E;
  --antara-gold:    #F5B228;

  /* Crimson scale */
  --crimson-50:  #FDF3F3;
  --crimson-100: #FAD9D9;
  --crimson-200: #F2A6A6;
  --crimson-300: #E26464;
  --crimson-400: #C42626;
  --crimson-500: #8B0000;
  --crimson-600: #6E0000;
  --crimson-700: #560000;
  --crimson-800: #3F0000;
  --crimson-900: #2A0000;

  /* Orange scale */
  --orange-50:  #FFF4EC;
  --orange-100: #FFE0CC;
  --orange-200: #FFC299;
  --orange-300: #FF9A5A;
  --orange-400: #F87526;
  --orange-500: #EE5A0E;
  --orange-600: #C9470A;
  --orange-700: #9E3608;
  --orange-800: #722605;
  --orange-900: #4A1804;

  /* Gold scale */
  --gold-50:  #FFFAEC;
  --gold-100: #FFF1CC;
  --gold-200: #FFE399;
  --gold-300: #FCCD66;
  --gold-400: #F8BE3F;
  --gold-500: #F5B228;
  --gold-600: #D9941A;
  --gold-700: #A57013;
  --gold-800: #704C0D;
  --gold-900: #3F2A07;

  /* Warm neutral ink scale */
  --ink-0:   #FFFFFF;
  --ink-50:  #FAF8F5;
  --ink-100: #F1EDE6;
  --ink-200: #E2DCD0;
  --ink-300: #C8C0B2;
  --ink-400: #9C9285;
  --ink-500: #6E6558;
  --ink-600: #4F4940;
  --ink-700: #3A352F;
  --ink-800: #26221E;
  --ink-900: #15120F;

  /* Semantic */
  --success: #1F7A4D;
  --warning: var(--antara-gold);
  --danger:  var(--antara-crimson);
  --info:    #1F5A99;

  /* Surface roles — dark only */
  --bg-page:        var(--ink-900);
  --bg-surface:     #1F1B17;
  --bg-elevated:    #2A251F;
  --bg-tinted:      #2A1B10;
  --border-subtle:  var(--ink-700);
  --border-strong:  var(--ink-600);
  --text-primary:   var(--ink-50);
  --text-secondary: var(--ink-300);
  --text-muted:     var(--ink-400);
  --success:        #34C77B;
  --info:           #5DA3E0;

  /* Signature gradient */
  --gradient-antara: linear-gradient(90deg, #F5B228 0%, #EE5A0E 50%, #8B0000 100%);
  --gradient-antara-diagonal: linear-gradient(135deg, #F5B228 0%, #EE5A0E 50%, #8B0000 100%);

  /* ---------- Typography ---------- */
  --font-display: "Quicksand", "Nunito", "SF Pro Rounded", system-ui, sans-serif;
  --font-body:    "Inter", system-ui, -apple-system, "Segoe UI", sans-serif;
  --font-mono:    "JetBrains Mono", "SF Mono", Menlo, Consolas, monospace;

  /* Sizes */
  --text-display-2xl: 4.5rem;   /* 72 */
  --text-display-xl:  3.75rem;  /* 60 */
  --text-display-lg:  3rem;     /* 48 */
  --text-h1:          2.25rem;  /* 36 */
  --text-h2:          1.875rem; /* 30 */
  --text-h3:          1.5rem;   /* 24 */
  --text-h4:          1.25rem;  /* 20 */
  --text-h5:          1.125rem; /* 18 */
  --text-body-lg:     1.125rem; /* 18 */
  --text-body:        1rem;     /* 16 */
  --text-body-sm:     0.875rem; /* 14 */
  --text-caption:     0.75rem;  /* 12 */
  --text-code:        0.875rem; /* 14 */

  --leading-tight:   1.15;
  --leading-snug:    1.25;
  --leading-normal:  1.5;
  --leading-relaxed: 1.6;

  --tracking-tight: -0.01em;
  --tracking-normal: 0;
  --tracking-wide:  0.08em;

  --weight-regular:  400;
  --weight-medium:   500;
  --weight-semibold: 600;
  --weight-bold:     700;

  /* ---------- Spacing (4pt) ---------- */
  --space-0:  0;
  --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;
  --space-32: 8rem;

  /* ---------- Layout ---------- */
  --container-prose: 45rem;  /* 720 */
  --container-md:    48rem;  /* 768 */
  --container-lg:    64rem;  /* 1024 */
  --container-xl:    75rem;  /* 1200 */
  --container-2xl:   90rem;  /* 1440 */

  --bp-sm:  640px;
  --bp-md:  768px;
  --bp-lg:  1024px;
  --bp-xl:  1280px;
  --bp-2xl: 1536px;

  /* ---------- Radius ---------- */
  --radius-none: 0;
  --radius-sm:   6px;
  --radius-md:   10px;
  --radius-lg:   16px;
  --radius-xl:   24px;
  --radius-2xl:  32px;
  --radius-full: 9999px;

  /* ---------- Shadows (warm-tinted) ---------- */
  --shadow-xs: 0 1px 2px rgba(58, 53, 47, 0.06);
  --shadow-sm: 0 2px 4px rgba(58, 53, 47, 0.08), 0 1px 2px rgba(58, 53, 47, 0.04);
  --shadow-md: 0 4px 12px rgba(58, 53, 47, 0.10), 0 2px 4px rgba(58, 53, 47, 0.06);
  --shadow-lg: 0 12px 32px rgba(58, 53, 47, 0.12), 0 4px 8px rgba(58, 53, 47, 0.06);
  --shadow-xl: 0 24px 64px rgba(58, 53, 47, 0.16), 0 8px 16px rgba(58, 53, 47, 0.08);
  --shadow-glow: 0 0 0 4px rgba(238, 90, 14, 0.15);

  /* ---------- Motion ---------- */
  --motion-instant:  80ms ease-out;
  --motion-fast:     150ms cubic-bezier(0.4, 0, 0.2, 1);
  --motion-base:     240ms cubic-bezier(0.4, 0, 0.2, 1);
  --motion-slow:     400ms cubic-bezier(0.16, 1, 0.3, 1);
  --motion-presence: 600ms cubic-bezier(0.16, 1, 0.3, 1);

  /* ---------- Z-index ---------- */
  --z-base:     0;
  --z-dropdown: 100;
  --z-sticky:   200;
  --z-overlay:  300;
  --z-modal:    400;
  --z-toast:    500;
  --z-tooltip:  600;
}

/* ---------- Reduced motion ---------- */
@media (prefers-reduced-motion: reduce) {
  :root {
    --motion-instant:  1ms linear;
    --motion-fast:     1ms linear;
    --motion-base:     1ms linear;
    --motion-slow:     1ms linear;
    --motion-presence: 1ms linear;
  }
}