:root {
  --color-brand-primary: #0f62fe;
  --color-brand-secondary: #42be65;
  --color-bg-page: #ffffff;
  --color-bg-surface: #f4f4f4;
  --color-bg-code: #000000;
  --color-border: #e0e0e0;
  --color-text-primary: #161616;
  --color-text-secondary: #525252;
  --color-text-link: #0f62fe;
  --color-text-link-active: #0043ce;
  --color-text-code: #f87171;
  --font-family-sans: -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, Helvetica, Arial, sans-serif;
  --font-family-mono: 'SFMono-Regular', Consolas, 'Liberation Mono', Menlo, monospace;
  --font-size-base: 16px;
  --line-height-base: 1.6;
  --header-height: 60px;
  --nav-width: 260px;
  --content-max-width: 1060px;
  --prose-max-width: 720px;
  --content-padding: 48px;
  --logo-src: none;
  --logo-width: 32px;
  --logo-height: 32px;

  /* ── Code blocks ── */
  --color-bg-code-block: #000000;
  --color-code-tab-bg: #111111;
  --color-code-tab-active: #000000;
  --color-code-tab-text: #a0a0b8;
  --color-code-text: #cdd6f4;
  --color-syntax-keyword: #cba6f7;
  --color-syntax-string: #a6e3a1;
  --color-syntax-number: #fab387;
  --color-syntax-comment: #8891ab;
  --color-syntax-property: #89dceb;
  --color-syntax-function: #89b4fa;
  --color-syntax-punctuation: #9399b2;

  /* Utility */
  --color-overlay: rgba(0, 0, 0, 0.4);
  --color-bg-hover: #e8e8e8;
  --color-white: #ffffff;
}