/* Colors — baoyu-design System
   Warm, paper-and-ink palette anchored by terracotta (Claude "book cloth").
   Base ramps first, then semantic aliases. */

:root {
  /* ---- Brand: terracotta / book cloth ---- */
  --terracotta-50:  #FBF0EA;
  --terracotta-100: #F5E0D4;
  --terracotta-200: #ECC4AE;
  --terracotta-300: #E2A485;
  --terracotta-400: #DC8C68;
  --terracotta-500: #D97757; /* core brand */
  --terracotta-600: #C15F3C;
  --terracotta-700: #9E4A2D;
  --terracotta-800: #7A3923;
  --terracotta-900: #582A1A;

  /* ---- Ink: warm near-black through warm grays ---- */
  --ink-900: #1A1915; /* primary text / dark surfaces */
  --ink-800: #2B2A26;
  --ink-700: #3D3B35;
  --ink-600: #56544C;
  --ink-500: #6B6960; /* secondary text */
  --ink-400: #8C8A7F; /* muted / placeholder */
  --ink-300: #B3B0A4;
  --ink-200: #D6D2C6;
  --ink-100: #E7E3D8;
  --ink-50:  #F2EFE6;

  /* ---- Paper: cream canvas ramp ---- */
  --paper-pure:   #FFFFFF;
  --paper-canvas: #FAF9F5; /* app / page background */
  --paper-raised: #F4F2EA; /* panels, sidebars */
  --paper-sunken: #EFECE2; /* wells, code blocks on light */

  /* ---- Supporting accents (used sparingly) ---- */
  --sage-500:   #5B8C5A; /* success / "added" */
  --sage-100:   #E4EEE0;
  --gold-500:   #C99A3C; /* warning / highlight */
  --gold-100:   #F4E9CF;
  --rust-500:   #C0563F; /* danger / destructive */
  --rust-100:   #F6DED6;
  --slate-500:  #4F6C9B; /* links / dev-tool blue accent */
  --slate-100:  #DCE4F0;

  /* ============ SEMANTIC ALIASES ============ */

  /* Text */
  --text-primary:    var(--ink-900);
  --text-secondary:  var(--ink-500);
  --text-muted:      var(--ink-400);
  --text-inverted:   var(--paper-canvas);
  --text-brand:      var(--terracotta-600);
  --text-link:       var(--slate-500);

  /* Surfaces */
  --surface-canvas:  var(--paper-canvas);
  --surface-card:    var(--paper-pure);
  --surface-raised:  var(--paper-raised);
  --surface-sunken:  var(--paper-sunken);
  --surface-inverted:var(--ink-900);
  --surface-brand:   var(--terracotta-500);
  --surface-brand-subtle: var(--terracotta-50);

  /* Borders */
  --border-subtle:   var(--ink-100);
  --border-default:  var(--ink-200);
  --border-strong:   var(--ink-300);
  --border-brand:    var(--terracotta-500);
  --border-inverted: rgba(255,255,255,0.14);

  /* Interactive — terracotta button */
  --action-bg:        var(--terracotta-500);
  --action-bg-hover:  var(--terracotta-600);
  --action-bg-active: var(--terracotta-700);
  --action-fg:        #FFFFFF;

  /* Focus ring */
  --focus-ring: var(--terracotta-400);
}