:root {
  /* SportBattles Design System - Option A: Sport Utility */

  /* Typography */
  --sb-font-heading: "Space Grotesk", "Inter", "Segoe UI", Arial, sans-serif;
  --sb-font-body: "Inter", "IBM Plex Sans", "Segoe UI", Arial, sans-serif;

  --sb-font-size-xs: 0.75rem;
  --sb-font-size-sm: 0.8125rem;
  --sb-font-size-md: 0.875rem;
  --sb-font-size-lg: 1rem;
  --sb-font-size-xl: 1.25rem;
  --sb-font-size-2xl: 1.625rem;
  --sb-font-size-3xl: 2.125rem;

  /* Brand */
  --sb-green-900: #1f5f4a;
  --sb-green-800: #246d55;
  --sb-green-700: #2b7a5e;
  --sb-green-500: #3a8f6d;
  --sb-green-soft: rgba(43, 122, 94, 0.10);
  --sb-green-soft-2: rgba(43, 122, 94, 0.075);

  /* Neutral */
  --sb-ink: #10201a;
  --sb-muted: rgba(16, 32, 26, 0.64);
  --sb-faint: rgba(16, 32, 26, 0.42);
  --sb-page-bg: #f4f7f6;
  --sb-page-bg-2: #eef3f1;
  --sb-surface: #ffffff;
  --sb-surface-soft: #f8faf9;
  --sb-border: rgba(31, 95, 74, 0.14);
  --sb-border-strong: rgba(31, 95, 74, 0.24);

  /* Semantic */
  --sb-success: #247a4f;
  --sb-success-soft: rgba(36, 122, 79, 0.10);
  --sb-warning: #956b1f;
  --sb-warning-soft: rgba(149, 107, 31, 0.12);
  --sb-danger: #b42318;
  --sb-danger-soft: rgba(180, 35, 24, 0.10);
  --sb-info: #315f8f;
  --sb-info-soft: rgba(49, 95, 143, 0.10);

  /* Spacing */
  --sb-space-1: 0.25rem;
  --sb-space-2: 0.5rem;
  --sb-space-3: 0.75rem;
  --sb-space-4: 1rem;
  --sb-space-5: 1.25rem;
  --sb-space-6: 1.5rem;
  --sb-space-8: 2rem;

  /* Shape and elevation */
  --sb-radius-sm: 4px;
  --sb-radius-md: 8px;
  --sb-radius-pill: 999px;
  --sb-shadow-sm: 0 2px 8px rgba(16, 32, 26, 0.06);
  --sb-shadow-md: 0 8px 22px rgba(16, 32, 26, 0.07);

  /* Layout */
  --sb-public-content-max: 1320px;
  --sb-organizer-content-max: 1440px;
  --sb-page-gutter: 1rem;
  --sb-board-gutter: 0.875rem;

  /* Controls */
  --sb-control-height-sm: 2rem;
  --sb-control-height-md: 2.375rem;
  --sb-control-height-lg: 2.75rem;
}