:root {
  --space-1: 4px;
  --space-2: 8px;
  --space-3: 12px;
  --space-4: 16px;
  --space-5: 20px;
  --space-8: 40px;

  /* semantic */
  --screen-gutter: 20px;      /* left/right margin of every mobile screen */
  --feed-gap: 12px;           /* between joke cards */
  --section-gap: 40px;        /* between screen sections */
  --card-padding: 18px;       /* inside a joke card */
  --touch-min: 48px;          /* minimum touch target */
  --touch-min-text: 44px;     /* text buttons only */
  --row-min: 56px;            /* list row height */
  --app-width: 430px;         /* mobile base width */
}