Generate an 11-stop tonal scale (50-950) from each base color. Output as CSS variables, a Tailwind color object, or Style Dictionary JSON.
:root {
--color-primary-50: #f1f0fd;
--color-primary-100: #e3e1fb;
--color-primary-200: #c7c4f7;
--color-primary-300: #9e99f1;
--color-primary-400: #726bea;
--color-primary-500: #4f46e5;
--color-primary-600: #433cc3;
--color-primary-700: #3731a0;
--color-primary-800: #2b277e;
--color-primary-900: #201c5c;
--color-primary-950: #141239;
--color-accent-50: #fdf0f7;
--color-accent-100: #fce2ef;
--color-accent-200: #f9c4de;
--color-accent-300: #f59ac7;
--color-accent-400: #f06dad;
--color-accent-500: #ec4899;
--color-accent-600: #c93d82;
--color-accent-700: #a5326b;
--color-accent-800: #822854;
--color-accent-900: #5e1d3d;
--color-accent-950: #3b1226;
--color-neutral-50: #f3f4f6;
--color-neutral-100: #e6e9ec;
--color-neutral-200: #cdd3da;
--color-neutral-300: #aab3bf;
--color-neutral-400: #8390a2;
--color-neutral-500: #64748b;
--color-neutral-600: #556376;
--color-neutral-700: #465161;
--color-neutral-800: #37404c;
--color-neutral-900: #282e38;
--color-neutral-950: #191d23;
}