@import url('https://fonts.googleapis.com/css2?family=Space+Grotesk:wght@200;300;400;500;700&family=Space+Mono:wght@400;700&display=swap');
:root{
--font-display:'Space Grotesk',sans-serif;
--font-body:'Space Grotesk',sans-serif;
--font-mono:'Space Mono',monospace;
--tracking-display:-0.045em;--tracking-title:-0.03em;
--text-display-xl:700 128px/.9 var(--font-display);
--text-display-lg:700 88px/.92 var(--font-display);
--text-display-md:700 56px/.95 var(--font-display);
--text-display-sm:700 32px/1.05 var(--font-display);
--text-body-lg:400 19px/1.5 var(--font-body);
--text-body-md:400 16px/1.5 var(--font-body);
--text-body-sm:400 13px/1.45 var(--font-body);
--text-label:700 11px/1.4 var(--font-mono);
--text-note:400 12px/1.45 var(--font-mono);
--text-planner:700 10.5px/1.3 var(--font-mono);
--letter-label:0.18em;
}

:root{
/* tinta y neutros fríos */
--ink:#241d1a;--lead:#4a4744;--body:#4f4d52;--mute:#8b8a8f;--hair:#dcdcdf;--soft:#f3f3f5;--white:#ffffff;
/* acentos en tres tonos */
--mango:#f0a93c;--mango-700:#b36f12;--mango-100:#fbe3b8;
--lilac:#9c86d9;--lilac-700:#5d4aa0;--lilac-300:#c9bbef;--lilac-100:#e7e0f7;
--red:#d62b25;--red-700:#8f1c18;--red-100:#f6d5d2;
--ok:#3f8f5e;
/* universos de conversación */
--u-prod:var(--mango);--u-prod-ink:var(--mango-700);--u-prod-tint:var(--mango-100);
--u-gira:var(--lilac);--u-gira-ink:var(--lilac-700);--u-gira-tint:var(--lilac-100);
--u-dir:var(--ink);--u-dir-ink:var(--ink);--u-dir-tint:var(--soft);
--u-lio:var(--red);--u-lio-ink:var(--red-700);--u-lio-tint:var(--red-100);
/* semánticos */
--surface-page:var(--white);--surface-soft:var(--soft);--surface-dark:var(--ink);
--text-heading:var(--ink);--text-body:var(--body);--text-muted:var(--mute);--on-dark:var(--white);
--border-neutral:var(--hair);--border-strong:var(--ink);
--accent-primary:var(--ink);--accent-spark:var(--mango);--highlight:var(--mango-100);
/* legado (v1) — no usar en diseños nuevos */
--cacao:var(--ink);--cream:#fbf6ee;--red-accent:var(--red);
--lilac-soft-bg:var(--lilac-100);--lilac-soft-border:var(--lilac-300);--mango-soft-bg:var(--mango-100);--mango-soft-border:var(--mango-100);
--neutral-soft-bg:var(--soft);--neutral-soft-border:var(--hair);--border-neutral-strong:var(--hair);--text-body-2:#6b6a70;
--success-fg:var(--ok);--success-bg:#eef5ef;--success-border:#d6e6d6;--warn-fg:var(--red);--warn-bg:var(--red-100);--warn-border:var(--red-100);
--surface-card:var(--white);--on-accent-primary:var(--white);--on-accent-spark:var(--ink);--on-cacao:var(--white);
}

:root{
--space-1:4px;--space-2:8px;--space-3:12px;--space-4:16px;--space-5:24px;--space-6:32px;--space-7:44px;--space-8:56px;--space-9:72px;--space-10:96px;
--radius-sm:0;--radius-md:0;--radius-lg:0;--radius-pill:999px;
--rule:1.5px solid var(--ink);--hairline:1px solid var(--hair);
--shadow-note:0 10px 18px -14px rgba(36,29,26,.5);--shadow-lift:0 22px 26px -16px rgba(36,29,26,.5);
--shadow-card:none;--shadow-card-lg:none;
--border-w:1px;
--ease-out:cubic-bezier(.2,.8,.2,1); /* @kind other */
}

body{background:var(--surface-page);font-family:var(--font-body);color:var(--text-heading);margin:0}
a{color:var(--lilac-700)}
a:hover{color:var(--ink)}