:root{
--cream-50:#fcfcfb;--cream-100:#f8f5f4;--cream-200:#f3ebe9;
--rose-100:#fdeef0;--rose-200:#f9d7dd;--rose-300:#edaeba;--rose-400:#f28992;--rose-500:#d9628d;--rose-600:#c04578;--rose-700:#9e235f;--rose-900:#5e1339;
--ink-900:#2b1720;--ink-700:#4a2f3b;--ink-500:#6f5661;--ink-300:#a3919a;--ink-100:#ded5d9;
--white:#ffffff;
--success-500:#3f8f6d;--success-100:#e2f1ea;
--warning-500:#c9821f;--warning-100:#faf0dd;
--danger-500:#c0392b;--danger-100:#fbe6e3;
--info-500:#41708f;--info-100:#e5eff5;

/* Celestia. Su rosa no es el de la marca: es el del propio icono
   (assets/iconos/celestia.png), que es de neón. Están aquí, y medidos sobre
   el archivo, para que el icono y los brillitos que dibuja el navegador
   durante la transición sean forzosamente el mismo rosa. */
--celestia-luz:#ffdcc6;--celestia-rosa:#ff62c0;--celestia-viva:#ff10ac;--celestia-honda:#e0107b;

--brand-primary:var(--rose-700);--brand-accent:var(--rose-500);--brand-soft:var(--rose-300);--brand-warm:var(--rose-400);
--surface-page:var(--cream-50);--surface-card:var(--white);--surface-sunken:var(--cream-100);--surface-tint:var(--rose-100);--surface-invert:var(--rose-700);
--text-title:var(--ink-900);--text-body:var(--ink-700);--text-muted:var(--ink-500);--text-onbrand:var(--cream-50);--text-link:var(--rose-700);--text-link-hover:var(--rose-500);
--border-subtle:var(--ink-100);--border-strong:var(--rose-300);--focus-ring:var(--rose-500);
}