:root{
  --clay-50:#fff4f0;
  --clay-100:#ffe7de;
  --clay-200:#fecfbc;
  --clay-300:#fdae90;
  --clay-400:#f28b63;
  --clay-500:#dc6f42;
  --clay-600:#c05628;
  --clay-700:#a14216;
  --clay-800:#7e320f;
  --clay-900:#5b260f;
  --clay-950:#3d1c0e;
  --sage-50:#ebfcee;
  --sage-100:#dff3e2;
  --sage-200:#c8e3cc;
  --sage-300:#acceb2;
  --sage-400:#8fb796;
  --sage-500:#749f7c;
  --sage-600:#5c8665;
  --sage-700:#486e50;
  --sage-800:#37553d;
  --sage-900:#293e2d;
  --sage-950:#1d2a20;
  --butter-50:#fff7de;
  --butter-100:#f7edcb;
  --butter-200:#e9daae;
  --butter-300:#d6c38b;
  --butter-400:#bfa965;
  --butter-500:#a89045;
  --butter-600:#8f782b;
  --butter-700:#766119;
  --butter-800:#5c4b11;
  --butter-900:#433710;
  --butter-950:#2d260f;
  --sand-50:#faf6f1;
  --sand-100:#f1ece6;
  --sand-200:#e1d9d2;
  --sand-300:#cbc2b9;
  --sand-400:#b3a99e;
  --sand-500:#9b9084;
  --sand-600:#83786d;
  --sand-700:#6b6157;
  --sand-800:#534c43;
  --sand-900:#3c3731;
  --sand-950:#292622;
  --surface:var(--sand-50);
  --surface-2:var(--sand-100);
  --line:var(--sand-200);
  --ink:var(--sand-950);
  --ink-2:var(--sand-700);
  --accent:var(--clay-700);
  --accent-ink:var(--sand-50);
  --accent-soft:var(--clay-100);
  --fresh:var(--sage-700);
  --note:var(--butter-200);
}