:root{
/* base palette — sampled from brand style guide + app brand-color panel */
--color-purple-700:#6f0ace;
--color-purple-500:#8567e5;
--color-purple-300:#e3daff;
--color-blue-600:#0285cc;
--color-blue-400:#40adce;
--color-teal-300:#85d8ce;
--color-pink-500:#ff66c4;
--color-pink-300:#ffaced;
--color-gray-900:#2b2b2b;
--color-gray-700:#545454;
--color-gray-100:#f7f6f6;
--color-white:#ffffff;

/* semantic aliases */
--brand-primary:var(--color-purple-500);
--brand-primary-deep:var(--color-purple-700);
--brand-secondary:var(--color-blue-600);
--brand-accent:var(--color-pink-500);
--brand-mint:var(--color-teal-300);

--text-primary:var(--color-gray-900);
--text-secondary:var(--color-gray-700);
--text-on-brand:var(--color-white);
--text-link:var(--brand-secondary);
--text-link-hover:var(--color-purple-700);

--surface-page:var(--color-white);
--surface-card:var(--color-white);
--surface-muted:var(--color-gray-100);
--surface-brand:var(--brand-primary);

--border-subtle:#e6e6e6;
--border-strong:var(--color-gray-700);

--focus-ring:var(--color-blue-400);
}