/* Sidis spacing. A 2px-rooted scale; 4/8/12/16/20/24 carry almost everything.
   Cards pad 16px (compact), 20px (mobile card), 24px (desktop card).
   Marketing sections are 96px tall inside a 1200px container with 32px gutters. */

:root {
  --space-0-5: 2px;
  --space-1: 4px;
  --space-1-5: 6px;
  --space-2: 8px;
  --space-2-5: 10px;
  --space-3: 12px;
  --space-3-5: 14px;
  --space-4: 16px;
  --space-5: 20px;
  --space-6: 24px;
  --space-7: 28px;
  --space-8: 32px;
  --space-12: 48px;
  --space-16: 64px;
  --space-24: 96px;

  /* Layout */
  --container-max: 1200px;
  --gutter-page: 32px;
  --section-y: 96px;
  --sidebar-width: 240px;
  --app-header-pad: 20px 24px;
  --mobile-gutter: 20px;
  --mobile-safe-bottom: 34px;

  /* Component heights — touch targets never below 44px, 56px on mobile */
  --control-h: 40px;
  --control-h-touch: 56px;
  --field-h: 44px;
  --field-h-touch: 52px;
  --row-h: 44px;
  --table-header-h: 40px;
  --badge-h: 24px;
  --avatar-h: 32px;
  --progress-h: 4px;
  --progress-h-thick: 8px;
}