/* ── Tema claro (por defecto) ─────────────────────────── */
:root, [data-theme="light"] {
  --color-bg:#f7f6f2; --color-surface:#f9f8f5; --color-surface-2:#fbfbf9; --color-surface-offset:#f3f0ec;
  --color-divider:#dcd9d5; --color-border:#d4d1ca; --color-text:#28251d; --color-text-muted:#6d6b66;
  --color-text-faint:#aba9a3; --color-primary:#01696f; --color-primary-hover:#0c4e54;
  --color-primary-highlight:#cedcd8; --color-success:#437a22; --color-success-bg:#d4dfcc;
  --color-error:#a12c7b; --color-error-bg:#e0ced7;
  --radius-sm:.375rem; --radius-md:.5rem; --radius-lg:.75rem; --radius-xl:1rem; --radius-full:9999px;
  --space-1:.25rem; --space-2:.5rem; --space-3:.75rem; --space-4:1rem; --space-5:1.25rem;
  --space-6:1.5rem; --space-8:2rem; --space-10:2.5rem; --space-12:3rem;
  --text-xs:clamp(.75rem,.7rem + .25vw,.875rem); --text-sm:clamp(.875rem,.8rem + .35vw,1rem);
  --text-base:clamp(1rem,.95rem + .25vw,1.125rem); --text-lg:clamp(1.125rem,1rem + .75vw,1.5rem);
  --text-xl:clamp(1.5rem,1.2rem + 1.25vw,2rem);
  --shadow-sm:0 1px 2px oklch(0.2 0.01 80 / .06); --shadow-md:0 8px 24px oklch(0.2 0.01 80 / .08);
  --transition:180ms cubic-bezier(.16,1,.3,1); --font-body:'Inter','Helvetica Neue',sans-serif;
}

/* ── Tema oscuro ──────────────────────────────────────── */
[data-theme="dark"] {
  --color-bg:#171614; --color-surface:#1c1b19; --color-surface-2:#201f1d; --color-surface-offset:#22211f;
  --color-divider:#262523; --color-border:#393836; --color-text:#e4e2de; --color-text-muted:#9d9b96;
  --color-text-faint:#6a6863; --color-primary:#4f98a3; --color-primary-hover:#227f8b;
  --color-primary-highlight:#313b3b; --color-success:#7db457; --color-success-bg:#314029;
  --color-error:#d163a7; --color-error-bg:#4c3d46;
  --shadow-sm:0 1px 2px oklch(0 0 0/.2); --shadow-md:0 8px 24px oklch(0 0 0/.35);
}