/* VintageWoodCanvas — Color tokens
 * A warm, earthy palette drawn from aged paper, walnut wood, pine, terracotta
 * and brass. Squared, low-chroma, museum-meets-workshop. No cool grays.
 */

:root {
  /* ---- Base ramps -------------------------------------------------- */

  /* Paper / cream neutrals (warm, the "canvas" of the brand) */
  --paper-50:  #FCF9F2;
  --paper-100: #F7F1E4;
  --paper-200: #EFE5D2;
  --paper-300: #E4D5BC;
  --paper-400: #D6C2A2;

  /* Bark / walnut neutrals (the "wood") */
  --bark-400: #9A8268;
  --bark-500: #7C6650;
  --bark-600: #5E4B39;
  --bark-700: #463729;
  --bark-800: #30251B;
  --bark-900: #211913;

  /* Pine — primary brand / actions */
  --pine-300: #7C9683;
  --pine-400: #547061;
  --pine-500: #3B5C49;
  --pine-600: #2F4A3A;
  --pine-700: #243B2E;

  /* Terracotta — accent / energy */
  --clay-300: #DDA184;
  --clay-400: #C9774F;
  --clay-500: #B85C38;
  --clay-600: #9C4A2B;
  --clay-700: #7C3A22;

  /* Brass / ochre — secondary accent, gilt details */
  --brass-300: #E0C079;
  --brass-400: #D0A64B;
  --brass-500: #C0902F;
  --brass-600: #A2761F;

  /* Sage — quiet supporting tint */
  --sage-300: #B8C2A8;
  --sage-500: #8A9A7B;

  /* ---- Semantic surfaces ------------------------------------------- */
  --surface-page:    var(--paper-100);
  --surface-card:    var(--paper-50);
  --surface-raised:  #FFFFFF;
  --surface-sunken:  var(--paper-200);
  --surface-inverse: var(--bark-800);
  --surface-overlay: rgba(33, 25, 19, 0.55);

  /* ---- Semantic text ----------------------------------------------- */
  --text-primary:   var(--bark-900);
  --text-secondary: var(--bark-600);
  --text-muted:     var(--bark-400);
  --text-inverse:   var(--paper-50);
  --text-brand:     var(--pine-600);
  --text-accent:    var(--clay-600);

  /* ---- Borders & lines --------------------------------------------- */
  --border-subtle: #E6DAC4;
  --border-default: #D9C7A8;
  --border-strong: #C2AC88;
  --border-ink:    var(--bark-800);

  /* ---- Brand roles ------------------------------------------------- */
  --brand-primary:        var(--pine-500);
  --brand-primary-hover:  var(--pine-600);
  --brand-primary-press:  var(--pine-700);
  --brand-accent:         var(--clay-500);
  --brand-accent-hover:   var(--clay-600);
  --brand-gilt:           var(--brass-500);

  /* ---- Status ------------------------------------------------------ */
  --success-fg: #2C5237;
  --success-bg: #E4ECD9;
  --warning-fg: #8A5A12;
  --warning-bg: #F6E8C8;
  --danger-fg:  #8E3320;
  --danger-bg:  #F3DBCF;
  --info-fg:    #3A4F63;
  --info-bg:    #DEE6EC;

  /* ---- Focus ring -------------------------------------------------- */
  --focus-ring: var(--brass-500);
}