/* ============================================================
   SYTE.bio — Spacing, radius, sizing, layout
   8px soft grid (with 2/4px micro-steps for dense UI).
   ============================================================ */

:root {
  /* Spacing scale */
  --space-0:   0;
  --space-px:  1px;
  --space-0-5: 0.125rem;  /* 2px  */
  --space-1:   0.25rem;   /* 4px  */
  --space-1-5: 0.375rem;  /* 6px  */
  --space-2:   0.5rem;    /* 8px  */
  --space-3:   0.75rem;   /* 12px */
  --space-4:   1rem;      /* 16px */
  --space-5:   1.5rem;    /* 24px */
  --space-6:   2rem;      /* 32px */
  --space-7:   2.5rem;    /* 40px */
  --space-8:   3rem;      /* 48px */
  --space-9:   4rem;      /* 64px */
  --space-10:  5rem;      /* 80px */
  --space-12:  6rem;      /* 96px */
  --space-16:  8rem;      /* 128px */
  --space-20:  10rem;     /* 160px */

  /* Section rhythm */
  --section-y:    var(--space-16);
  --section-y-sm: var(--space-10);

  /* Radii — restrained, mostly tight corners */
  --radius-none: 0;
  --radius-xs:  4px;
  --radius-sm:  6px;
  --radius-md:  10px;
  --radius-lg:  16px;
  --radius-xl:  24px;
  --radius-pill: 999px;
  --radius-circle: 50%;

  /* Control sizing */
  --control-h-sm: 34px;
  --control-h-md: 42px;
  --control-h-lg: 52px;

  /* Layout */
  --container:     1200px;
  --container-wide:1400px;
  --container-narrow: 760px;
  --gutter:        var(--space-6);

  /* Borders */
  --border-w:      1px;
  --border-w-thick:2px;

  /* Z-index */
  --z-base:    0; /* @kind other */
  --z-raised:  10; /* @kind other */
  --z-sticky:  100; /* @kind other */
  --z-overlay: 1000; /* @kind other */
  --z-modal:   1100; /* @kind other */
  --z-toast:   1200; /* @kind other */
}