/*
 * Meet VG portfolio dark colour system
 * Exported from GPT Visualizer's canonical manuscript theme.
 */

:root {
  color-scheme: dark;

  --color-canvas: #17130d;
  --color-surface: #1e1811;
  --color-surface-raised: #282017;
  --color-border: #3a3023;

  --color-text: #ece1cd;
  --color-text-muted: #b1a487;
  --color-text-subtle: #6f6450;

  --color-brand: #c9a75d;
  --color-brand-strong: #a8842f;

  --color-green: #8fb87c;
  --color-orange: #d3a35c;
  --color-purple: #b79ccb;
  --color-red: #cf8571;
  --color-pink: #cf90b1;
  --color-cyan: #84acc9;
  --color-yellow: #d8b661;

  --color-success: var(--color-green);
  --color-warning: var(--color-orange);
  --color-danger: var(--color-red);
  --color-info: var(--color-cyan);
  --color-focus: var(--color-brand);
  --color-link: var(--color-brand);
  --color-selection-bg: rgb(201 167 93 / 24%);
  --color-selection-text: var(--color-text);

  --color-line: #463a2c;
  --color-line-emphasis: #8a7d66;

  --bg: var(--color-canvas);
  --bg2: var(--color-surface);
  --bg3: var(--color-surface-raised);
  --bg4: var(--color-border);
  --fg: var(--color-text);
  --fg2: var(--color-text-muted);
  --fg3: var(--color-text-subtle);
  --accent: var(--color-brand);
  --accent2: var(--color-brand-strong);
  --green: var(--color-green);
  --orange: var(--color-orange);
  --purple: var(--color-purple);
  --red: var(--color-red);
  --pink: var(--color-pink);
  --cyan: var(--color-cyan);
  --yellow: var(--color-yellow);
}

::selection {
  color: var(--color-selection-text);
  background: var(--color-selection-bg);
}