:root {
  /* Default Light Theme (DeepSeek inspired) */
  --color-bg: #ffffff;
  --color-bg-secondary: #f8f9fa;
  --color-surface: #ffffff;
  --color-text: #1c1e21;
  --color-text-secondary: #525860;
  --color-text-muted: #8c959f;
  --color-border: #e5e7eb;
  --color-border-subtle: #f0f2f5;

  --color-primary: #4d6bfe;
  --color-primary-hover: #3b55d9;
  --color-primary-alpha: rgba(77, 107, 254, 0.08);

  --color-sidebar-bg: #fbfcfd;
  --color-sidebar-hover: #f1f3f5;
  --color-sidebar-active: #e8ecfe;
  --color-sidebar-active-text: #3b55d9;

  --color-code-bg: #1e1e1e;
  --color-code-text: #f8f8f2;
  --color-inline-code-bg: #edf2f7;
  --color-inline-code-text: #d63384;

  --color-toc-active: #4d6bfe;

  --color-success: #10b981;
  --color-warning: #f59e0b;
  --color-danger: #ef4444;

  --header-height: 60px;
  --sidebar-width: 280px;
  --toc-width: 240px;
  --max-content-width: 880px;

  --shadow-sm: 0 1px 2px 0 rgba(0, 0, 0, 0.05);
  --shadow-md: 0 4px 6px -1px rgba(0, 0, 0, 0.1), 0 2px 4px -1px rgba(0, 0, 0, 0.06);
}

[data-theme="dark"] {
  /* Dark Theme */
  --color-bg: #121316;
  --color-bg-secondary: #18191d;
  --color-surface: #1e2025;
  --color-text: #e3e6eb;
  --color-text-secondary: #9aa0a6;
  --color-text-muted: #6b7280;
  --color-border: #2c2f36;
  --color-border-subtle: #23262c;

  --color-primary: #637fff;
  --color-primary-hover: #7b93ff;
  --color-primary-alpha: rgba(99, 127, 255, 0.15);

  --color-sidebar-bg: #16171b;
  --color-sidebar-hover: #22242b;
  --color-sidebar-active: #252a3d;
  --color-sidebar-active-text: #8298ff;

  --color-code-bg: #181a1f;
  --color-code-text: #abb2bf;
  --color-inline-code-bg: #282c34;
  --color-inline-code-text: #ff7b72;

  --color-toc-active: #637fff;

  --shadow-sm: 0 1px 3px 0 rgba(0, 0, 0, 0.5);
  --shadow-md: 0 4px 6px -1px rgba(0, 0, 0, 0.4);
}