:root{
/* ── Brand ramp — the taco ───────────────────────────── */
--salsa-masa-50:#FDF6E6;--salsa-masa-100:#FAE9C3;--salsa-masa-300:#F2CE78;
--salsa-masa-500:#E8B33F;--salsa-masa-700:#B8862A;--salsa-masa-900:#7A5717;
--salsa-salsa-400:#F0745A;--salsa-salsa-500:#DE4E32;--salsa-salsa-700:#A6321D;
--salsa-avocado-400:#84C97A;--salsa-avocado-500:#5FAE58;--salsa-avocado-700:#3F7E3A;
--salsa-crema-500:#FFF8EE;--salsa-cheese-500:#FFD35C;--salsa-cilantro-500:#2E9E8F;--salsa-lime-500:#B7D94C;
/* Sub-agent archetype colors (§7.3) */
--salsa-agent-lead:#E8B33F;--salsa-agent-research:#5FAE58;--salsa-agent-documents:#F2CE78;
--salsa-agent-data:#8B6B4A;--salsa-agent-comms:#DE4E32;--salsa-agent-watcher:#4E9E4A;--salsa-agent-builder:#FFD35C;
/* ── Neutral ramp — the office (dark, default) ───────── */
--salsa-bg-base:#0D1117;--salsa-bg-sunken:#080B0F;--salsa-bg-surface:#151B23;
--salsa-bg-raised:#1C242E;--salsa-bg-overlay:#232C38;
--salsa-border-subtle:#232B35;--salsa-border-default:#303B48;--salsa-border-strong:#46545F;
--salsa-text-primary:#F2EDE4;--salsa-text-secondary:#A8B2BE;--salsa-text-tertiary:#6E7885;--salsa-text-inverse:#0D1117;
/* ── Semantic — use these in components ─────────────── */
--salsa-accent:var(--salsa-masa-500);
--salsa-accent-hover:var(--salsa-masa-300);
--salsa-accent-pressed:var(--salsa-masa-700);
--salsa-accent-fg:#1A1206;
--salsa-success:var(--salsa-avocado-500);
--salsa-warning:var(--salsa-cheese-500);
--salsa-danger:var(--salsa-salsa-500);
--salsa-danger-hover:var(--salsa-salsa-400);
--salsa-danger-pressed:var(--salsa-salsa-700);
--salsa-info:var(--salsa-cilantro-500);
--salsa-focus-ring:#7FC7FF;
/* ── Agent status (§2.4) — identical everywhere ─────── */
--salsa-status-idle:#6E7885;--salsa-status-thinking:#8B7BE8;--salsa-status-working:#5FAE58;
--salsa-status-researching:#2E9E8F;--salsa-status-writing:#E8B33F;--salsa-status-calling:#4A9BE8;
--salsa-status-waiting:#FFD35C;--salsa-status-error:#DE4E32;--salsa-status-offline:#3A424C;
}
[data-theme="light"]{
--salsa-bg-base:#F7F5F1;--salsa-bg-sunken:#EFEBE4;--salsa-bg-surface:#FFFFFF;
--salsa-bg-raised:#FFFFFF;--salsa-bg-overlay:#FFFFFF;
--salsa-border-subtle:#E4DFD6;--salsa-border-default:#D2CCC1;--salsa-border-strong:#B0A89A;
--salsa-text-primary:#16191D;--salsa-text-secondary:#565D66;--salsa-text-tertiary:#8A9098;--salsa-text-inverse:#FFFFFF;
--salsa-elev-1:0 1px 2px rgba(22,25,29,.08);
--salsa-elev-2:0 4px 12px rgba(22,25,29,.10);
--salsa-elev-3:0 12px 32px rgba(22,25,29,.14);
}