/* Design tokens — light theme defaults, dark overrides below. */
:root {
  color-scheme: light;
  --font-sans: "Inter", "Segoe UI Variable Text", -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Helvetica, Arial, sans-serif;
  --font-display: "Inter Display", "Inter", "Segoe UI Variable Display", -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, sans-serif;
  --font-mono: "JetBrains Mono", "Cascadia Code", ui-monospace, SFMono-Regular, "SF Mono", Menlo, Consolas, monospace;

  --color-bg: #ffffff;
  --color-bg-elevated: #fafafb;
  --color-bg-inset: #f3f4f7;
  --color-bg-hover: #eef0f4;
  --color-border: #e6e8ee;
  --color-border-strong: #d3d7e0;
  --color-text: #0f1320;
  --color-text-muted: #525a6b;
  --color-text-faint: #8a91a1;
  --color-link: #4f46e5;
  --color-accent: #5b54e8;
  --color-accent-soft: #eeedfd;
  --color-accent-contrast: #ffffff;
  --color-focus: #5b54e8;

  --color-success: #0b8a4e;
  --color-success-bg: #e5f5ec;
  --color-danger: #c62f36;
  --color-danger-bg: #fcebec;
  --color-warning: #a16207;
  --color-warning-bg: #fdf4dc;
  --color-info: #1d5fd6;
  --color-info-bg: #e7effd;

  --method-get: #0b8a4e;
  --method-post: #1d5fd6;
  --method-put: #a16207;
  --method-patch: #7c3aed;
  --method-delete: #c62f36;

  --code-bg: #0e1118;
  --code-bg-header: #151923;
  --code-border: #232836;
  --code-text: #d7dbe6;
  --code-muted: #7d8497;
  --code-key: #8fb4ff;
  --code-string: #7ee2a8;
  --code-number: #f5c177;
  --code-bool: #ff9aa2;
  --code-keyword: #c4a7ff;

  --shadow-sm: 0 1px 2px rgba(15, 19, 32, 0.05);
  --shadow-md: 0 2px 4px rgba(15, 19, 32, 0.04), 0 8px 24px rgba(15, 19, 32, 0.07);
  --shadow-lg: 0 12px 40px rgba(15, 19, 32, 0.16);
  --glow: radial-gradient(60% 80% at 20% 0%, rgba(91, 84, 232, 0.12), transparent 70%);

  --radius-sm: 6px;
  --radius-md: 10px;
  --radius-lg: 14px;
  --radius-xl: 20px;

  --space-1: 4px;
  --space-2: 8px;
  --space-3: 12px;
  --space-4: 16px;
  --space-5: 24px;
  --space-6: 32px;
  --space-7: 48px;
  --space-8: 72px;

  --sidebar-width: 284px;
  --header-height: 56px;
  --subnav-height: 44px;
  --chrome-height: calc(var(--header-height) + var(--subnav-height));
  --transition-fast: 120ms ease;
  --transition-base: 200ms ease;
}

@media (prefers-color-scheme: dark) {
  :root:not([data-theme="light"]) {
    color-scheme: dark;
    --color-bg: #0b0d12;
    --color-bg-elevated: #0f1218;
    --color-bg-inset: #161a22;
    --color-bg-hover: #1b202a;
    --color-border: #1f2430;
    --color-border-strong: #2e3442;
    --color-text: #eceef4;
    --color-text-muted: #a3a9b8;
    --color-text-faint: #6c7385;
    --color-link: #a5a3ff;
    --color-accent: #8e8bff;
    --color-accent-soft: #1d1c3a;
    --color-accent-contrast: #0e0d22;
    --color-focus: #8e8bff;

    --color-success: #3ccf8e;
    --color-success-bg: #0d2419;
    --color-danger: #ff7b82;
    --color-danger-bg: #2a1215;
    --color-warning: #f1bb4f;
    --color-warning-bg: #2a200c;
    --color-info: #7aaeff;
    --color-info-bg: #0f1c30;

    --method-get: #3ccf8e;
    --method-post: #7aaeff;
    --method-put: #f1bb4f;
    --method-patch: #bb9cff;
    --method-delete: #ff7b82;

    --code-bg: #0a0c11;
    --code-bg-header: #10131a;
    --code-border: #1f2430;

    --shadow-sm: 0 1px 2px rgba(0, 0, 0, 0.4);
    --shadow-md: 0 2px 4px rgba(0, 0, 0, 0.3), 0 8px 24px rgba(0, 0, 0, 0.35);
    --shadow-lg: 0 16px 48px rgba(0, 0, 0, 0.6);
    --glow: radial-gradient(60% 80% at 20% 0%, rgba(142, 139, 255, 0.14), transparent 70%);
  }
}

:root[data-theme="dark"] {
  color-scheme: dark;
  --color-bg: #0b0d12;
  --color-bg-elevated: #0f1218;
  --color-bg-inset: #161a22;
  --color-bg-hover: #1b202a;
  --color-border: #1f2430;
  --color-border-strong: #2e3442;
  --color-text: #eceef4;
  --color-text-muted: #a3a9b8;
  --color-text-faint: #6c7385;
  --color-link: #a5a3ff;
  --color-accent: #8e8bff;
  --color-accent-soft: #1d1c3a;
  --color-accent-contrast: #0e0d22;
  --color-focus: #8e8bff;

  --color-success: #3ccf8e;
  --color-success-bg: #0d2419;
  --color-danger: #ff7b82;
  --color-danger-bg: #2a1215;
  --color-warning: #f1bb4f;
  --color-warning-bg: #2a200c;
  --color-info: #7aaeff;
  --color-info-bg: #0f1c30;

  --method-get: #3ccf8e;
  --method-post: #7aaeff;
  --method-put: #f1bb4f;
  --method-patch: #bb9cff;
  --method-delete: #ff7b82;

  --code-bg: #0a0c11;
  --code-bg-header: #10131a;
  --code-border: #1f2430;

  --shadow-sm: 0 1px 2px rgba(0, 0, 0, 0.4);
  --shadow-md: 0 2px 4px rgba(0, 0, 0, 0.3), 0 8px 24px rgba(0, 0, 0, 0.35);
  --shadow-lg: 0 16px 48px rgba(0, 0, 0, 0.6);
  --glow: radial-gradient(60% 80% at 20% 0%, rgba(142, 139, 255, 0.14), transparent 70%);
}