:root {
  /* Light theme (default) */
  --color-bg: #f5f5f5;
  --color-bg-card: #ffffff;
  --color-bg-hover: #f0f0f0;
  --color-bg-muted: #f9f9f9;
  --color-bg-error: #ffe0e0;

  --color-text: #333333;
  --color-text-muted: #666666;
  --color-text-error: #cc0000;

  --color-border: #dddddd;
  --color-border-light: #eeeeee;
  --color-border-lighter: #f0f0f0;

  --color-primary: #0066cc;
  --color-primary-hover: #0055aa;

  --color-danger: #cc3333;
  --color-danger-hover: #aa2222;

  --color-tag-bg: #e0e0e0;

  --shadow: 0 1px 3px rgba(0, 0, 0, 0.1);

  font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, sans-serif;
  line-height: 1.5;
  font-weight: 400;
  color: var(--color-text);
  background-color: var(--color-bg);
  font-synthesis: none;
  text-rendering: optimizeLegibility;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
}

[data-theme="dark"] {
  --color-bg: #1a1a1a;
  --color-bg-card: #2d2d2d;
  --color-bg-hover: #3d3d3d;
  --color-bg-muted: #252525;
  --color-bg-error: #4a2020;

  --color-text: #e0e0e0;
  --color-text-muted: #a0a0a0;
  --color-text-error: #ff6b6b;

  --color-border: #404040;
  --color-border-light: #353535;
  --color-border-lighter: #303030;

  --color-primary: #4da6ff;
  --color-primary-hover: #7dbfff;

  --color-danger: #ff6b6b;
  --color-danger-hover: #ff8a8a;

  --color-tag-bg: #404040;

  --shadow: 0 1px 3px rgba(0, 0, 0, 0.3);
}