:root[data-theme="dark"] {
  color-scheme: dark;
  --color-canvas: #121611;
  --color-surface: #1c211a;
  --color-surface-strong: #252b21;
  --color-text: #f4ecd0;
  --color-muted: #b8b096;
  --color-border: #4d503c;
  --color-primary: #42c4b8;
  --color-primary-hover: #62ddd1;
  --color-secondary: #d7a63f;
  --color-secondary-hover: #e7bd68;
  --color-accent-soft: #263f36;
  --color-danger: #f09a8e;
  --color-danger-soft: #4a2925;
  --color-success: #9bd46e;
  --color-success-soft: #29402a;
  --color-panel: rgba(28, 33, 26, 0.96);
  --color-panel-border: #4a4a35;
  --color-body-glow: rgba(65, 196, 184, 0.09);
  --color-focus-ring: rgba(66, 196, 184, 0.24);
  --color-focus-border: rgba(66, 196, 184, 0.65);
  --color-code-bg: rgba(66, 196, 184, 0.12);
  --color-quiet-hover: rgba(215, 166, 63, 0.11);
  --color-icon-bg: rgba(66, 196, 184, 0.12);
  --color-note-bg: rgba(10, 13, 10, 0.48);
  --color-empty-bg: rgba(8, 10, 8, 0.38);
  --color-dialog-shadow: rgba(0, 0, 0, 0.62);
  --color-backdrop: rgba(0, 0, 0, 0.72);
  --color-sidebar: #10140f;
  --color-sidebar-active: rgba(66, 196, 184, 0.13);
  --color-sidebar-border: #33372a;
  --shadow-panel: 0 14px 40px rgba(0, 0, 0, 0.28);
  --theme-background: radial-gradient(circle at 75% 0%, rgba(66, 196, 184, 0.08), transparent 34rem);
}