/* Tokens de diseño — "Obra de Vidrio" (dashboard-command-center-spec.md, Lente 3).
   Neutro cálido (nunca gris muerto ni azul-gris SaaS) + eje semántico
   cálido=humano/acción, frío=máquina/sync. Vidrio en 2 tiers, prohibido sobre
   superficies densas (eso vive en app.css, acá solo las variables). */
:root {
  --basalt: #15120e;
  --porcelain: #f3eee4;
  --bone: #f1e9d8;
  --umber: #211c16;
  --terracotta: #c56a2e;
  --sap: #6e8046;
  --teal: #3e8e86;
  --ember: #e0a33c;
  --rust: #9b5b3e;
  --sand: #b9a47e;
  --slate-warm: #8a8172;

  --font-ui: -apple-system, BlinkMacSystemFont, 'Segoe UI', sans-serif;
  --font-mono: 'JetBrains Mono', ui-monospace, 'SF Mono', monospace;

  --radius-sm: 8px;
  --radius-md: 12px;
  --radius-lg: 16px;
  --sp-1: 4px; --sp-2: 8px; --sp-3: 12px; --sp-4: 16px; --sp-6: 24px; --sp-8: 32px;

  --ease-out: cubic-bezier(.16,1,.3,1);
}

:root, :root[data-theme="dark"] {
  --canvas: var(--basalt);
  --elevada: #1e1914;
  --hairline: rgba(241,233,216,.10);
  --ink: var(--bone);
  --ink-soft: rgba(241,233,216,.66);
  --ink-mid: rgba(241,233,216,.44);
  --ink-faint: rgba(241,233,216,.13);
}

@media (prefers-color-scheme: light) {
  :root { --canvas: var(--porcelain); --elevada: #fbf8f1; --hairline: rgba(33,28,22,.12); --ink: var(--umber); --ink-soft: rgba(33,28,22,.70); --ink-mid: rgba(33,28,22,.52); --ink-faint: rgba(33,28,22,.13); }
}
:root[data-theme="light"] {
  --canvas: var(--porcelain); --elevada: #fbf8f1; --hairline: rgba(33,28,22,.12); --ink: var(--umber); --ink-soft: rgba(33,28,22,.70); --ink-mid: rgba(33,28,22,.52); --ink-faint: rgba(33,28,22,.13);
}