:root {
  /* Color palette */
  --bg: #000000;
  --fg: #FFFFFF;
  --rabbit-orange: #FE5F00;
  --surface: #1A1A1A;
  --data-cool: #62E6E6;
  --data-warm: #FFC93C;
  --data-go: #7FD66B;
  --data-bad: #FF6B6B;

  /* Typography */
  --font-family: 'Space Grotesk', system-ui, -apple-system, sans-serif;
  --type-clock-size: 64px;
  --type-clock-tracking: -2px;
  --type-clock-weight: 500;
  --type-display-size: 28px;
  --type-display-tracking: -1px;
  --type-display-weight: 600;
  --type-body-size: 14px;
  --type-body-weight: 500;
  --type-label-size: 11px;
  --type-label-tracking: 2px;
  --type-caption-size: 10px;
  --type-caption-tracking: 1px;

  /* Spacing */
  --pad-xs: 4px;
  --pad-sm: 8px;
  --pad-md: 14px;
  --pad-lg: 22px;

  /* Chassis */
  --chassis-border: 4px;
  --chassis-inner: 2px;
  --chassis-radius: 14px;

  /* Motion */
  --transition-fast: 150ms ease-out;
  --transition-spring: cubic-bezier(0.34, 1.56, 0.64, 1);
  --transition-duration: 260ms;
}

@media (prefers-reduced-motion: reduce) {
  :root {
    --transition-duration: 150ms;
    --transition-spring: ease-out;
  }
}