/* Sovereign — Spacing & Layout (Geist foundation)
   A single 4px unit generates the whole scale. Small steps handle component
   internals; large steps (96–192px) do the whitespace-as-hierarchy work between
   sections. Never invent an off-scale value. */

:root {
  --space-0: 0;
  --space-1: 4px;    /* icon gaps, hairline insets */
  --space-2: 8px;    /* min gap between touch targets; chip padding */
  --space-3: 12px;   /* compact stacks, badge padding */
  --space-4: 16px;   /* default element gap, list rhythm */
  --space-5: 24px;   /* card internal padding (the workhorse) */
  --space-6: 32px;   /* gap between cards / grid gutter */
  --space-8: 48px;   /* sub-section spacing */
  --space-10: 64px;  /* block spacing within a section */
  --space-16: 96px;  /* section padding (vertical rhythm) */
  --space-24: 128px; /* major section separation */
  --space-32: 192px; /* hero + tentpole section gap */

  /* ---- Layout ---- */
  --container-prose: 720px;
  --container-default: 1024px;
  --container-wide: 1200px;
  --page-margin: 24px;

  /* ---- Breakpoints (Tailwind-native scale) ---- */
  --bp-sm: 640px;
  --bp-md: 768px;
  --bp-lg: 1024px;
  --bp-xl: 1280px;
  --bp-2xl: 1536px;

  /* ---- Z-index ladder ---- */
  --z-base: 0;      /* @kind other */
  --z-nav: 10;      /* @kind other */
  --z-dropdown: 30; /* @kind other */
  --z-popover: 40;  /* @kind other */
  --z-overlay: 50;  /* @kind other */
  --z-modal: 60;    /* @kind other */
  --z-toast: 70;    /* @kind other */
}