/* HackaPH design tokens. LOCKED: see DESIGN.md. Do not add values without the Change Protocol. */
@import url('https://fonts.googleapis.com/css2?family=Space+Grotesk:wght@400;500;600&display=swap');

:root {
  /* colour */
  --bg: #0e0e0e;
  --surface: #141414;
  --border: #2a2a2a;
  --border-hover: #3a3a3a;
  --text: #f5f5f5;
  --muted: #a3a3a3;
  --on-active: #0e0e0e;

  /* type */
  --font: 'Space Grotesk', system-ui, sans-serif;
  --fs-h1: 44px;
  --fs-h1-sm: 32px;
  --fs-lead: 16px;
  --fs-card-title: 18px;
  --fs-meta: 13px;
  --fs-tag: 12px;
  --fs-toggle: 15px;

  /* shape */
  --radius-card: 12px;
  --radius-pill: 999px;

  /* space (4px base) */
  --s-1: 4px;
  --s-2: 8px;
  --s-3: 12px;
  --s-4: 16px;
  --s-6: 24px;
  --s-8: 32px;
  --s-12: 48px;
  --s-18: 72px;
  --s-24: 96px;

  /* motion */
  --t-fast: 150ms;
}

html, body {
  font-family: var(--font);
}

@media (prefers-reduced-motion: reduce) {
  :root { --t-fast: 0ms; }
}