:root{
/* Brand */
--indigo-500:#2222AC; /* primary */
--indigo-600:#1B1B8A; /* accent / pressed / hover */
--indigo-50:#EDEDF8;  /* derived tint for hover fills */
--indigo-100:#DADAF2; /* derived tint for selected fills */
/* Neutrals */
--black:#000000;
--white:#FFFFFF;
--paper:#FEFEFE;
--gray-100:#F3F3F3;   /* derived subtle surface */
--gray-300:#CCCCCC;   /* elevated */
--gray-400:#B5B5B5;   /* border */
--gray-600:#555555;   /* muted text */
--sky-ring:rgba(0,162,233,0.2); /* focus halo */
--carousel-blue:#007AFF; /* carousel pagination only */

/* Semantic */
--primary:var(--indigo-500);
--primary-hover:var(--indigo-600);
--primary-soft:var(--indigo-50);
--primary-selected:var(--indigo-100);
--on-primary:var(--white);
--surface-page:var(--paper);
--surface-card:var(--white);
--surface-subtle:var(--gray-100);
--surface-elevated:var(--gray-300);
--surface-brand:var(--primary);
--surface-ink:var(--black);
--text-primary:var(--black);
--text-muted:var(--gray-600);
--text-on-brand:var(--white);
--text-brand:var(--primary);
--link:var(--primary);
--link-hover:var(--primary-hover);
--link-on-brand:var(--white);
--border-default:var(--gray-400);
--border-subtle:var(--gray-300);
--border-strong:var(--black);
--border-brand:var(--primary);
--overlay:rgba(0,0,0,0.55);
}