/*
 * Lexicor — Vellum design tokens
 * Drop into your global stylesheet.
 * Canonical: docs/design/vellum/tokens.css (keep in sync; this file ships with stealth-site).
 */

:root {
  /* BRAND */
  --lex-ink:           #1A1A1A;
  --lex-graphite:      #2C2A26;
  --lex-copper:        #B8612F;
  --lex-copper-hover:  #A0521F;
  --lex-copper-pressed:#8A4318;
  --lex-patina:        #3F5B5C;
  --lex-vellum:        #F5F1EA;
  --lex-vellum-2:      #EDE7DC;
  --lex-stone:         #7A7268;

  /* STATUS */
  --lex-healthy:       #4A7C59;
  --lex-warn:          #C8843D;
  --lex-critical:      #B8443A;
  --lex-policy:        #6B4E8C;
  --lex-inactive:      #A8A096;

  /* SEMANTIC (LIGHT) */
  --bg-canvas:         var(--lex-vellum);
  --bg-surface:        #FFFFFF;
  --bg-elevated:       var(--lex-vellum-2);
  --bg-inverse:        var(--lex-ink);

  --text-primary:      var(--lex-ink);
  --text-secondary:    #4A453E;
  --text-muted:        var(--lex-stone);
  --text-on-accent:    #FFFFFF;
  --text-inverse:      var(--lex-vellum);

  --border-subtle:     rgba(26,26,26,0.08);
  --border-default:    rgba(26,26,26,0.15);
  --border-strong:     rgba(26,26,26,0.30);

  --accent:            var(--lex-copper);
  --accent-hover:      var(--lex-copper-hover);
  --accent-pressed:    var(--lex-copper-pressed);

  /* TYPOGRAPHY */
  --font-sans:    'Inter var', 'Inter', ui-sans-serif, system-ui, -apple-system, sans-serif;
  --font-display: 'GT America', 'Inter var', 'Inter', ui-sans-serif, sans-serif;
  --font-mono:    'JetBrains Mono', ui-monospace, 'SF Mono', Consolas, monospace;

  --text-xs:   12px;
  --text-sm:   14px;
  --text-base: 16px;
  --text-lg:   20px;
  --text-xl:   24px;
  --text-2xl:  30px;
  --text-3xl:  38px;
  --text-4xl:  48px;
  --text-5xl:  60px;

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

  --leading-tight: 1.2;
  --leading-snug:  1.4;
  --leading-body:  1.65;

  --tracking-tightest: -0.04em;
  --tracking-tight:    -0.02em;
  --tracking-normal:   0;
  --tracking-wide:     0.08em;
  --tracking-widest:   0.16em;

  /* LAYOUT */
  --space-0: 0;
  --space-1: 4px;
  --space-2: 8px;
  --space-3: 12px;
  --space-4: 16px;
  --space-5: 24px;
  --space-6: 32px;
  --space-7: 48px;
  --space-8: 64px;
  --space-9: 96px;
  --space-10: 128px;

  --radius-sm: 4px;
  --radius-md: 6px;
  --radius-lg: 10px;
  --radius-xl: 16px;
  --radius-pill: 999px;

  --duration-fast: 120ms;
  --duration-base: 180ms;
  --duration-slow: 280ms;
  --easing-standard: cubic-bezier(0.2, 0, 0, 1);

  --elevation-1: 0 0 0 1px var(--border-subtle);
  --elevation-2: 0 0 0 1px var(--border-default);
}

@media (prefers-color-scheme: dark) {
  :root {
    --bg-canvas:      var(--lex-ink);
    --bg-surface:     var(--lex-graphite);
    --bg-elevated:    #36332E;
    --bg-inverse:     var(--lex-vellum);
    --text-primary:   var(--lex-vellum);
    --text-secondary: #C9C2B5;
    --text-muted:     #8A8278;
    --text-inverse:   var(--lex-ink);
    --border-subtle:  rgba(245,241,234,0.08);
    --border-default: rgba(245,241,234,0.15);
    --border-strong:  rgba(245,241,234,0.30);
    --accent:         #D9824F;
    --accent-hover:   #E89564;
    --accent-pressed: #C46F3D;
  }
}

[data-theme='dark'] {
  --bg-canvas:      var(--lex-ink);
  --bg-surface:     var(--lex-graphite);
  --bg-elevated:    #36332E;
  --text-primary:   var(--lex-vellum);
  --text-secondary: #C9C2B5;
  --text-muted:     #8A8278;
  --border-subtle:  rgba(245,241,234,0.08);
  --border-default: rgba(245,241,234,0.15);
  --accent:         #D9824F;
  --accent-hover:   #E89564;
}

html { font-feature-settings: 'cv11', 'ss01', 'ss03'; }
body {
  font-family: var(--font-sans);
  font-size: var(--text-base);
  line-height: var(--leading-body);
  color: var(--text-primary);
  background: var(--bg-canvas);
  -webkit-font-smoothing: antialiased;
}
.tabular, [data-tabular] { font-variant-numeric: tabular-nums; font-feature-settings: 'tnum'; }