:root {
  --bg: #f6f4ef;
  --card: #fffdf8;
  --ink: #1f1f1f;
  --muted: #6f6a62;
  --accent: #0f766e;
  --accent-2: #f6b941;
  --line: rgba(196, 182, 163, 0.46);
  --surface: rgba(255, 255, 255, 0.5);
  --surface-strong: rgba(255, 255, 255, 0.58);
  --panel-bg: rgba(255, 255, 255, 0);
  --panel-border: rgba(255, 255, 255, 0.72);
  --chip-bg: #f0fdfa;
  --chip-ink: #0f766e;
  --chip-line: #ccfbf1;
  --article-bg: rgba(253, 247, 236, 0.52);
  --tag-bg: #ffedd5;
  --tag-line: #fdba74;
  --tag-ink: #3f3b35;
  --text-soft: #3f3b35;
  --glow-1: #fff8e6;
  --glow-2: #e2f8f4;
  --glow-3: transparent;
  --shape-1: #fde68a;
  --shape-2: #a7f3d0;
  --shadow: 0 14px 40px rgba(28, 23, 15, 0.08);
  --shadow-sm: 0 2px 8px rgba(28, 23, 15, 0.06);
  --radius: 16px;
  --radius-sm: 8px;
  --radius-xs: 5px;

  /* Sidebar */
  --sidebar-bg: rgba(255, 253, 248, 0.82);
  --sidebar-border: rgba(196, 182, 163, 0.42);
  --sidebar-width: 260px;

  /* Code */
  --code-bg: #f3efe8;
  --code-ink: #2d2a24;
  --code-border: rgba(196, 182, 163, 0.5);
  --pre-bg: #faf8f4;
  --pre-ink: #2d2a24;
  --pre-border: rgba(196, 182, 163, 0.45);

  /* Nav (top bar) */
  --nav-bg: rgba(255, 253, 248, 0.82);
  --nav-border: rgba(196, 182, 163, 0.5);
  --nav-height: 56px;
}

:root[data-theme="dark"] {
  --bg: #070e17;
  --card: #0b1623;
  --ink: #e7ecef;
  --muted: #95a7b6;
  --accent: #59d6cf;
  --accent-2: #f6b941;
  --line: rgba(140, 176, 200, 0.22);
  --surface: rgba(17, 32, 46, 0.42);
  --surface-strong: rgba(17, 32, 46, 0.56);
  --panel-bg: rgba(10, 20, 33, 0.28);
  --panel-border: rgba(169, 209, 232, 0.16);
  --chip-bg: #0e2e33;
  --chip-ink: #9ef6ec;
  --chip-line: #1c4c54;
  --article-bg: rgba(9, 16, 24, 0.22);
  --tag-bg: rgba(18, 52, 64, 0.44);
  --tag-line: rgba(96, 165, 204, 0.36);
  --tag-ink: #c9f2ee;
  --text-soft: #d4dee6;
  --glow-1: #0b2633;
  --glow-2: #050a18;
  --glow-3: transparent;
  --shape-1: #071427;
  --shape-2: #0b5e5a;
  --shadow: 0 18px 50px rgba(0, 0, 0, 0.28);
  --shadow-sm: 0 2px 8px rgba(0, 0, 0, 0.22);

  --sidebar-bg: rgba(11, 22, 35, 0.85);
  --sidebar-border: rgba(169, 209, 232, 0.14);

  --code-bg: #111c26;
  --code-ink: #9ef6ec;
  --code-border: rgba(169, 209, 232, 0.18);
  --pre-bg: #0c1420;
  --pre-ink: #cdd6f4;
  --pre-border: rgba(169, 209, 232, 0.12);

  --nav-bg: rgba(7, 14, 23, 0.88);
  --nav-border: rgba(169, 209, 232, 0.14);
}