/* ============================================================
   APSYS — Spacing, sizing & radius tokens
   8px base grid. Square corners are the brand default —
   radii are intentionally near-zero.
   ============================================================ */

:root {
  /* Spacing scale (8px grid + 4px half-steps) */
  --space-0: 0;
  --space-1: 0.25rem;  /* 4 */
  --space-2: 0.5rem;   /* 8 */
  --space-3: 0.75rem;  /* 12 */
  --space-4: 1rem;     /* 16 */
  --space-5: 1.5rem;   /* 24 */
  --space-6: 2rem;     /* 32 */
  --space-7: 2.5rem;   /* 40 */
  --space-8: 3rem;     /* 48 */
  --space-9: 4rem;     /* 64 */
  --space-10: 5rem;    /* 80 */

  /* Radius — square is the signature. Use sparingly. */
  --radius-none: 0;
  --radius-sm: 2px;    /* inputs/buttons: a hair, not rounded */
  --radius-md: 3px;
  --radius-pill: 999px;/* status dots / avatars only */

  /* Control sizing (data-app density) */
  --control-h-sm: 28px;
  --control-h: 36px;
  --control-h-lg: 44px;  /* min touch target */

  /* Layout */
  --sidebar-w: 248px;
  --topbar-h: 60px;
  --container-max: 1440px;
  --content-pad: var(--space-6);

  /* Z-index */
  --z-base: 1; /* @kind other */
  --z-sticky: 100; /* @kind other */
  --z-dropdown: 200; /* @kind other */
  --z-overlay: 300; /* @kind other */
  --z-modal: 400; /* @kind other */
  --z-toast: 500; /* @kind other */
}