:root {
  color-scheme: light;
  --rb-font-sans: "Plus Jakarta Sans", system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
  --rb-font-mono: "SFMono-Regular", Consolas, "Liberation Mono", Menlo, monospace;
  --rb-font-size-base: 1rem;
  --rb-font-size-2xs: .75rem;
  --rb-font-size-xs: .875rem;
  --rb-font-size-sm: .875rem;
  --rb-font-size-md: 1rem;
  --rb-font-size-lg: 1.25rem;
  --rb-font-size-xl: 1.5rem;
  --rb-font-size-2xl: 1.75rem;
  --rb-font-size-3xl: 2rem;
  --rb-font-size-4xl: 3rem;
  --rb-bg: #ffffff;
  --rb-bg-elevated: #ffffff;
  --rb-surface: #ffffff;
  --rb-surface-soft: #f7f7f7;
  --rb-surface-muted: #eeeeee;
  --rb-text: #171717;
  --rb-muted: #595959;
  --rb-subtle: #8a8a8a;
  --rb-border: #e5e5e5;
  --rb-border-soft: #eeeeee;
  --rb-border-input: #8a8a8a;
  --rb-focus: #171717;
  --rb-accent: #171717;
  --rb-accent-hover: #000000;
  --rb-accent-soft: rgba(23, 23, 23, .08);
  --rb-danger: #171717;
  --rb-warning: #595959;
  --rb-success: #171717;
  --rb-info: #595959;
  --rb-shadow-sm: 0 1px 2px rgba(23, 23, 23, .06);
  --rb-shadow-md: 0 12px 32px rgba(23, 23, 23, .1);
  --rb-shadow-lg: 0 24px 60px rgba(23, 23, 23, .12);
  --rb-radius-xs: 6px;
  --rb-radius-sm: 8px;
  --rb-radius-md: 8px;
  --rb-radius-lg: 12px;
  --rb-radius-xl: 16px;
  --rb-space-1: 4px;
  --rb-space-2: 8px;
  --rb-space-3: 12px;
  --rb-space-4: 16px;
  --rb-space-5: 20px;
  --rb-space-6: 24px;
  --rb-space-7: 28px;
  --rb-space-8: 32px;
  --rb-space-9: 48px;
  --rb-space-10: 64px;
  --rb-space-11: 80px;
  --rb-space-12: 96px;
  /* Compatibility names for existing components during migration. */
  --rubion-bg: var(--rb-bg);
  --rubion-base: var(--rb-bg);
  --rubion-surface: var(--rb-surface);
  --rubion-surface-soft: var(--rb-surface-soft);
  --rubion-surface-2: var(--rb-surface-soft);
  --rubion-surface-3: var(--rb-surface-muted);
  --rubion-border: var(--rb-border);
  --rubion-accent: var(--rb-accent);
  --rubion-accent-hover: var(--rb-accent-hover);
  --rubion-accent-active: var(--rb-accent-hover);
  --rubion-accent-strong: var(--rb-accent-hover);
  --rubion-accent-soft: var(--rb-accent-soft);
  --rubion-secondary: var(--rb-surface-soft);
  --rubion-secondary-hover: var(--rb-surface-muted);
  --rubion-success: var(--rb-text);
  --rubion-warning: var(--rb-muted);
  --rubion-danger: var(--rb-text);
  --rubion-focus: var(--rb-text);
  --rubion-text: var(--rb-text);
  --rubion-text-soft: var(--rb-muted);
  --rubion-text-muted: var(--rb-muted);
  --rubion-shadow: var(--rb-shadow-md);
}

@media (forced-colors: active) {
  :root { --rb-focus: Highlight; }
}
