/* tokens.css — Carbon + Sky design tokens */

:root {
  /* ===== Color ===== */
  --bg-0:        #0c0d10;
  --bg-1:        #14161b;
  --bg-2:        #1a1d22;
  --bg-elev:     #20232a;
  --border:      #20232a;
  --border-soft: #1a1d22;

  --text-0: #fafafa;
  --text-1: #c8ccd3;
  --text-2: #8d929c;
  --text-3: #5d6573;

  --accent:      #5ba6d8;
  --accent-soft: rgba(91, 166, 216, 0.14);
  --accent-hi:   #7ec0e8;

  --danger:  #e06870;
  --success: #6dd886;
  --warn:    #d2a44f;

  /* Aliases used by existing rules — point to new palette */
  --bg:       var(--bg-0);
  --bg-deep:  var(--bg-1);
  --card:     var(--bg-1);
  --ink:      var(--text-0);
  --ink-soft: var(--text-1);
  --muted:    var(--text-2);

  /* ===== Type ===== */
  --font-sans: 'Inter', system-ui, -apple-system, 'Segoe UI', sans-serif;
  --font-display: var(--font-sans);
  --font-mono: ui-monospace, 'SF Mono', Menlo, monospace;

  --fs-11: 11px;
  --fs-13: 13px;
  --fs-15: 15px;
  --fs-18: 18px;
  --fs-22: 22px;
  --fs-28: 28px;
  --fs-38: 38px;
  --fs-hero: clamp(48px, 7vw, 76px);

  /* ===== Space ===== */
  --sp-1: 4px;
  --sp-2: 8px;
  --sp-3: 12px;
  --sp-4: 16px;
  --sp-5: 24px;
  --sp-6: 32px;
  --sp-7: 48px;

  /* ===== Radii ===== */
  --r-sm: 4px;
  --r-md: 6px;
  --r-lg: 10px;

  /* ===== Shadows ===== */
  --shadow-sm: 0 1px 2px rgba(0, 0, 0, 0.4);
  --shadow-md: 0 4px 16px rgba(0, 0, 0, 0.5);
  --shadow-hero: 0 20px 60px rgba(0, 0, 0, 0.6);

  /* ===== Motion ===== */
  --ease-out: cubic-bezier(0.2, 0.7, 0.2, 1);
  --t-fast: 120ms;
  --t-base: 200ms;

  /* ===== Legacy aliases (components/layout compat) ===== */
  --line:      var(--border);
  --line-soft: var(--border-soft);
  --neg:       var(--danger);
  --gold:      var(--warn);
  --warn-soft: var(--accent-soft);
  --r-xl:      var(--r-lg);
  --r-2xl:     var(--r-lg);
  --sp-8:      32px;
  --sp-10:     40px;
  --sp-12:     48px;
  --fs-12:     var(--fs-11);
  --fs-14:     var(--fs-13);
  --fs-16:     var(--fs-15);
  --fs-20:     var(--fs-18);
  --font-body: var(--font-sans);
  --font-display: var(--font-sans);
}
