:root {
  --space-0:   0;
  --space-1:   4px;
  --space-2:   8px;
  --space-3:   12px;
  --space-4:   16px;
  --space-5:   20px;
  --space-6:   24px;
  --space-8:   32px;
  --space-10:  40px;
  --space-11:  44px;
  --space-12:  48px;
  --space-16:  64px;
  --space-20:  80px;
  --space-24:  96px;

  --radius-xs:   4px;
  --radius-sm:   8px;
  --radius-md:   12px;
  --radius-lg:   18px;
  --radius-xl:   26px;
  --radius-pill: 999px;
  --radius-circle: 50%;

  --border-thin:   1px;
  --border-base:   1.5px;
  --border-thick:  2px;

  --shadow-xs:  0 1px 2px rgba(25, 23, 22, 0.06);
  --shadow-sm:  0 1px 3px rgba(25, 23, 22, 0.08), 0 1px 2px rgba(25, 23, 22, 0.06);
  --shadow-md:  0 4px 10px rgba(25, 23, 22, 0.08), 0 2px 4px rgba(25, 23, 22, 0.05);
  --shadow-lg:  0 12px 28px rgba(25, 23, 22, 0.12), 0 4px 10px rgba(25, 23, 22, 0.06);
  --shadow-xl:  0 24px 56px rgba(25, 23, 22, 0.16);
  --shadow-focus: 0 0 0 3px rgba(158, 52, 23, 0.40);

  --ease-standard: cubic-bezier(0.2, 0, 0, 1);
  --ease-out:      cubic-bezier(0.16, 1, 0.3, 1);
  --ease-spring:   cubic-bezier(0.34, 1.56, 0.64, 1);
  --dur-fast:   120ms;
  --dur-base:   200ms;
  --dur-slow:   320ms;

  --z-base:     0;
  --z-sticky:   100;
  --z-nav:      200;
  --z-overlay:  900;
  --z-modal:    1000;
  --z-toast:    1100;

  --container:   1120px;
  --container-narrow: 720px;
  --app-width:   430px;
}