:root {
  font-family: Inter, sans-serif;
  font-feature-settings: "liga" 1, "calt" 1; /* fix for Chrome */
  line-height: var(--line-height-base);

  /* Shadow work inspired color palette - earthy, grounding tones */
  --background: #f5f3f0;
  --text-primary: #2a1810;
  --text-secondary: #8b6b47;
  --button-bg: #e8e2dc;
  --border: #d4c4b0;
  --accent: #6b4423;
  --shadow-dark: #1a1a1a;
  --shadow-light: #f8f6f3;
  --insight-bg: #faf8f5;
  --mood-triggered: #c44536;
  --mood-resistant: #b8860b;
  --mood-curious: #4682b4;
  --mood-accepting: #228b22;
  --mood-peaceful: #9370db;

  --border-width: 1px;

  --space-xs: 0.5rem;
  --space-sm: 0.75rem;
  --space-md: 1rem;
  --space-lg: 1.25rem;
  --space-xl: 2rem;
  --space-xxl: 3rem;

  --font-xs: 0.75rem;
  --font-sm: 0.875rem;
  --font-md: 1rem;
  --font-lg: 1.125rem;
  --font-xl: 1.5rem;
  --font-xxl: 2rem;
  --line-height-base: 140%;

  --card-rounded: 0.75rem;
  --button-rounded: 0.375rem;
  --modal-rounded: 1rem;

  /* Shadow work specific variables */
  --journal-width: 45%;
  --insight-border: 2px solid var(--accent);
}

@media (prefers-color-scheme: dark) {
  :root {
    --background: #1a1a1a;
    --text-primary: #e8e2dc;
    --text-secondary: #a08b7a;
    --button-bg: #2a2520;
    --border: #3a342c;
    --accent: #d4a574;
    --shadow-dark: #0a0a0a;
    --shadow-light: #2a2a2a;
    --insight-bg: #242018;
    --mood-triggered: #ff6b6b;
    --mood-resistant: #ffd93d;
    --mood-curious: #74c0fc;
    --mood-accepting: #51cf66;
    --mood-peaceful: #b197fc;
  }
}

@supports (font-variation-settings: normal) {
  :root {
    font-family: InterVariable, sans-serif;
  }
}