:root{
--color-ecto-ink:#1B0E24;
--color-ecto-ink-soft:#241531;
--color-ecto-purple:#7A3FF2;
--color-ecto-purple-dark:#5424B8;
--color-slime:#C6FF3D;
--color-chrome:#B8B4C0;
--color-fog-paper:#F3EFE6;
--color-text-secondary:#9C93A8;
--color-border:#332244;
--color-warning:#F2B33F;
--color-error:#F24F4F;
--bg-canvas:var(--color-ecto-ink);
--bg-canvas-soft:var(--color-ecto-ink-soft);
--bg-canvas-light:var(--color-fog-paper);
--surface-card-dark:var(--color-ecto-ink-soft);
--surface-card-light:#FFFFFF;
--text-on-dark:var(--color-fog-paper);
--text-on-light:var(--color-ecto-ink);
--text-muted-on-dark:var(--color-text-secondary);
--text-muted-on-light:#6B6478;
--border-on-dark:var(--color-border);
--border-chrome:var(--color-chrome);
--accent-spark:var(--color-slime);
--interactive-primary:var(--color-ecto-purple);
--interactive-primary-hover:var(--color-ecto-purple-dark);
--semantic-success:var(--color-slime);
--semantic-warning:var(--color-warning);
--semantic-error:var(--color-error);
--semantic-info:var(--color-ecto-purple);
}