/* ===========================================================================
   WhatsGood — Spacing tokens
   4px base grid. Generous breathing room; cards are roomy and chunky.
   ===========================================================================*/

:root {
  --space-0:   0;
  --space-1:   4px;
  --space-2:   8px;
  --space-3:   12px;
  --space-4:   16px;   /* default gutter            */
  --space-5:   20px;
  --space-6:   24px;   /* card padding              */
  --space-8:   32px;
  --space-10:  40px;
  --space-12:  48px;
  --space-16:  64px;

  /* Semantic */
  --gutter-screen:  var(--space-5);   /* phone screen side padding   */
  --gap-card:       var(--space-4);   /* between stacked cards       */
  --pad-card:       var(--space-6);   /* inside a card               */
  --pad-pill-x:     var(--space-5);   /* pill horizontal padding     */
  --pad-pill-y:     var(--space-3);   /* pill vertical padding       */
}