/* ==============================================
   TOKENS - Spacing, sizing, transitions
   ============================================== */

:root {
  /* Spacing */
  --pad-xs: 4px;
  --pad-sm: 8px;
  --pad: 12px;
  --pad-lg: 20px;
  --pad-xl: 32px;

  /* Border radius */
  --radius-sm: 4px;
  --radius-md: 6px;
  --radius: 8px;
  --radius-lg: 12px;
  --radius-xl: 16px;

  /* Transitions */
  --transition-fast: 0.1s ease;
  --transition-normal: 0.2s ease;
  --transition-slow: 0.3s ease;

  /* Fixed element heights */
  --header-height: 50px;
  --footer-height: 36px;
}