:root {
  --canopy-paper: #f7f5f1;
  --canopy-white: #ffffff;
  --canopy-ink: #050a11;
  --canopy-navy: #07101c;
  --canopy-blue: #0a5cff;
  --canopy-blue-dark: #0647c8;
  --canopy-sky: #d9eef3;
  --canopy-mint: #dcefdc;
  --canopy-violet: #e7dbf1;
  --canopy-butter: #f3e5a8;
  --canopy-line: rgba(5, 10, 17, 0.14);
  --canopy-muted: #5d6570;
  --canopy-success: #137a4d;
  --canopy-danger: #b8324a;

  --canopy-space-1: 0.25rem;
  --canopy-space-2: 0.5rem;
  --canopy-space-3: 0.75rem;
  --canopy-space-4: 1rem;
  --canopy-space-5: 1.5rem;
  --canopy-space-6: 2rem;
  --canopy-space-7: 3rem;
  --canopy-space-8: 4.5rem;
  --canopy-space-9: 7rem;

  --canopy-radius-control: 0.7rem;
  --canopy-radius-panel: 1rem;
  --canopy-radius-section: 1.35rem;
  --canopy-shadow-low: 0 0.75rem 2rem rgba(5, 10, 17, 0.08);
  --canopy-shadow-high: 0 1.6rem 4.5rem rgba(5, 10, 17, 0.16);
  --canopy-ease: cubic-bezier(0.2, 0.8, 0.2, 1);
}