:root[data-theme-family="graphite"][data-color-mode="dark"] {
  --color-page-bg: #171717;
  --color-surface: #202020;
  --color-surface-elevated: #272727;
  --color-border: #3c3c3c;
  --color-border-strong: #7b7b7b;
  --color-text-primary: #efefef;
  --color-text-muted: #ababab;
  --color-accent: #8ca0b5;
  --color-accent-contrast: #111111;
  --color-selection-bg: #313131;
  --color-selection-border: #8f9bab;
  --color-current-row-bg: #2a2a2a;
  --color-current-row-border: #8c8c8c;
  --color-active-pane-border: #a8b6c4;
  --color-button-bg: #2d2d2d;
  --color-button-hover: #353535;
  --color-button-secondary-bg: #272727;
  --color-list-header-bg: rgba(255, 255, 255, 0.02);
  --color-list-row-hover: rgba(255, 255, 255, 0.05);
  --color-danger: #e19a9a;
  --color-danger-bg: #472c2c;
  --color-overlay-bg: rgba(8, 8, 8, 0.64);
}

:root[data-theme-family="graphite"][data-color-mode="light"] {
  --color-page-bg: #f0f0f0;
  --color-surface: #ffffff;
  --color-surface-elevated: #f7f7f7;
  --color-border: #dbdbdb;
  --color-border-strong: #a2a2a2;
  --color-text-primary: #232323;
  --color-text-muted: #757575;
  --color-accent: #5f7180;
  --color-accent-contrast: #ffffff;
  --color-selection-bg: #ececec;
  --color-selection-border: #b0bcc6;
  --color-current-row-bg: #f5f5f5;
  --color-current-row-border: #c1c1c1;
  --color-active-pane-border: #7d8f9f;
  --color-button-bg: #f8f8f8;
  --color-button-hover: #f0f0f0;
  --color-button-secondary-bg: #f3f3f3;
  --color-list-header-bg: #f8f8f8;
  --color-list-row-hover: #f4f4f4;
  --color-danger: #ab3333;
  --color-danger-bg: #fdeeee;
  --color-overlay-bg: rgba(24, 24, 24, 0.26);
}