/* Xorion design system v5. Guide palette, one swap: lavender where the Claude app theme uses orange.
   Lavender is never the primary. See PROVENANCE.md for each value's source and each deviation. */
:root {
  color-scheme: light;

  --xo-bg: #ffffff;
  --xo-surface: #ffffff;
  --xo-surface-2: #ececf0;
  --xo-secondary: #eceef2;
  --xo-fg: #0a0a0a;
  --xo-fg-muted: #717182;
  --xo-border: #e6e6e6;
  --xo-border-control: #8a8a99;
  --xo-primary: #030213;
  --xo-primary-fg: #ffffff;
  --xo-accent: #6844ee;
  --xo-accent-fg: #ffffff;
  --xo-accent-mark: #6844ee;
  --xo-danger: #d4183d;
  --xo-danger-fg: #ffffff;
  --xo-danger-text: #d4183d;
  --xo-success: #166534;
  --xo-success-bg: #f0fdf4;
  --xo-success-border: #bbf7d0;
  --xo-warning: #854d0e;
  --xo-warning-bg: #fefce8;
  --xo-warning-border: #fef08a;
  --xo-info: #1e40af;
  --xo-info-bg: #eff6ff;
  --xo-info-border: #bfdbfe;
  --xo-focus: #717182;

  --xo-font-sans: system-ui, -apple-system, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif;
  --xo-font-mono: ui-monospace, SFMono-Regular, Menlo, Consolas, "Liberation Mono", monospace;
  --xo-font-size-xs: 12px;
  --xo-font-size-sm: 14px;
  --xo-font-size-md: 16px;
  --xo-font-size-lg: 18px;
  --xo-font-size-xl: 20px;
  --xo-font-size-2xl: 24px;
  --xo-font-size-3xl: 30px;
  --xo-weight-normal: 400;
  --xo-weight-medium: 500;
  --xo-line-height: 1.5;

  /* The guide's eight steps read as Tailwind units (2 = 8px); 0-5 and 1-5 are the half steps its controls use. */
  --xo-space-0-5: 4px;
  --xo-space-1-5: 12px;
  --xo-space-1: 8px;
  --xo-space-2: 16px;
  --xo-space-3: 24px;
  --xo-space-4: 32px;
  --xo-space-5: 48px;
  --xo-space-6: 64px;
  --xo-space-7: 80px;
  --xo-space-8: 96px;

  --xo-radius-sm: 6px;
  --xo-radius-md: 10px;
  --xo-radius-lg: 14px;
  --xo-radius-full: 999px;

  --xo-control-h-sm: 36px;
  --xo-control-h: 40px;
  --xo-control-h-lg: 44px;
  --xo-icon-sm: 12px;
  --xo-icon: 16px;
  --xo-icon-lg: 20px;

  /* The winning direction's shell (SCORES.md): sidebar workspace with dense rows. */
  --xo-sidebar-w: 232px;
  --xo-inspector-w: 320px;
  --xo-row-h: 40px;
  --xo-topbar-h: 48px;

  --xo-dur-fast: 120ms;
  --xo-dur-base: 200ms;
  --xo-dur-slow: 320ms;
  --xo-dur-spin: 800ms;
  --xo-ease: cubic-bezier(0.4, 0, 0.2, 1);
}

@media (prefers-color-scheme: dark) {
  :root:not([data-theme="light"]) {
    color-scheme: dark;

    --xo-bg: #0a0a0a;
    --xo-surface: #0a0a0a;
    --xo-surface-2: #262626;
    --xo-secondary: #262626;
    --xo-fg: #fafafa;
    --xo-fg-muted: #a1a1a1;
    --xo-border: #262626;
    --xo-border-control: #6f6f6f;
    --xo-primary: #fafafa;
    --xo-primary-fg: #0a0a0a;
    --xo-accent: #b4a2fa;
    --xo-accent-fg: #030213;
    --xo-accent-mark: var(--xo-accent);
    --xo-danger: #82181a;
    --xo-danger-fg: #fafafa;
    --xo-danger-text: #ff6467;
    --xo-success: #bbf7d0;
    --xo-success-bg: #052e16;
    --xo-success-border: #166534;
    --xo-warning: #fef08a;
    --xo-warning-bg: #422006;
    --xo-warning-border: #854d0e;
    --xo-info: #bfdbfe;
    --xo-info-bg: #172554;
    --xo-info-border: #1e40af;
    --xo-focus: #a1a1a1;
  }
}

:root[data-theme="dark"] {
  color-scheme: dark;

  --xo-bg: #0a0a0a;
  --xo-surface: #0a0a0a;
  --xo-surface-2: #262626;
  --xo-secondary: #262626;
  --xo-fg: #fafafa;
  --xo-fg-muted: #a1a1a1;
  --xo-border: #262626;
  --xo-border-control: #6f6f6f;
  --xo-primary: #fafafa;
  --xo-primary-fg: #0a0a0a;
  --xo-accent: #b4a2fa;
  --xo-accent-fg: #030213;
  --xo-accent-mark: var(--xo-accent);
  --xo-danger: #82181a;
  --xo-danger-fg: #fafafa;
  --xo-danger-text: #ff6467;
  --xo-success: #bbf7d0;
  --xo-success-bg: #052e16;
  --xo-success-border: #166534;
  --xo-warning: #fef08a;
  --xo-warning-bg: #422006;
  --xo-warning-border: #854d0e;
  --xo-info: #bfdbfe;
  --xo-info-bg: #172554;
  --xo-info-border: #1e40af;
  --xo-focus: #a1a1a1;
}