@import url("https://fonts.googleapis.com/css2?family=DM+Sans:ital,wght@0,400;0,500;0,700;1,400&family=Space+Grotesk:wght@400;500;600;700&display=swap");

:root {
      --light: #f5f2ed;
      --dark: #1a1a18;
      --primary: #3d5a3a;
      --secondary: #8c7a62;
      --tertiary: #c4a87a;
      --light-warm: #edeae4;
      --mid: #d4cfc7;
    

  /* Missing tokens required by system.css */
  --border: rgba(26,26,24,0.09);
  --font:   "DM Sans", "Space Grotesk", sans-serif;
  --max:    1160px;
  --mid:    #7a7570;

  /* Semantic tokens — light mode (default) */
  --bg:            var(--light);
  --bg-surface:    #fff;
  --fg:            var(--dark);
  --fg-muted:      var(--mid);
  --border-subtle: var(--border);
}


/* ─── Dark Mode ─── */
[data-theme="dark"] {
  --bg:            #111412;
  --bg-surface:    #1a1e1a;
  --fg:            #e8e5de;
  --fg-muted:      rgba(255,255,255,0.58);
  --mid:           #8a8880;
  --border-subtle: rgba(255,255,255,0.08);
  --border:        rgba(255,255,255,0.08);
}

@media (prefers-color-scheme: dark) {
  html:not([data-theme]) {
    --bg:            #111412;
    --bg-surface:    #1a1e1a;
    --fg:            #e8e5de;
    --fg-muted:      rgba(255,255,255,0.58);
    --mid:           #8a8880;
    --border-subtle: rgba(255,255,255,0.08);
    --border:        rgba(255,255,255,0.08);
  }
}