:root {
  /* Paleta institucional 60-30-10 de SAVELIA. */
  --color-paper: #F4F7F6;         /* 60%: fondo general descansado */
  --color-paper-alt: #F3F6F5;     /* superficies auxiliares y tablas */
  --color-card: #FFFFFF;          /* tarjetas y módulos de información */
  --color-ink: #2C3E3A;           /* texto principal */
  --color-ink-soft: #63746F;      /* texto secundario con contraste AA */
  --color-line: #D3DFDC;          /* líneas y bordes */

  --color-primary: #3F5351;       /* 30%: verde exacto del logo */
  --color-primary-dark: #2F433C;  /* hover y profundidad institucional */
  --color-secondary: #3F5351;     /* verde funcional para estados positivos */
  --color-accent: #D96C4A;        /* 10%: detalle terracota decorativo */
  --color-cta: #B95738;           /* acción principal accesible */
  --color-cta-hover: #9F452D;     /* hover de la acción principal */
  --color-alert: #A64F43;         /* terracota apagado para alertas */
  --color-alert-bg: #F7E7E3;

  --font-display: "Fraunces", "Georgia", serif;
  --font-body: "Inter", system-ui, -apple-system, sans-serif;
  --font-mono: "IBM Plex Mono", "Courier New", monospace;

  --radius-sm: 6px;
  --radius-md: 10px;
  --radius-lg: 16px;

  --shadow-card: 0 1px 2px rgba(44, 62, 58, 0.05), 0 4px 14px rgba(44, 62, 58, 0.08);
  --shadow-card-hover: 0 2px 4px rgba(44, 62, 58, 0.08), 0 10px 24px rgba(44, 62, 58, 0.12);

  --sidebar-w: 248px;
}

@media (prefers-color-scheme: dark) {
  /* La app usa un único tema institucional claro por legibilidad
     y consistencia institucional; no se ofrece modo oscuro automático. */
}