:root{
/* --- base neutrals --- */
--black:#16151A;
--white:#FFFFFF;
--grey-50:#F7F6F3;
--grey-100:#F0EEEA;
--grey-200:#E3E0D9;
--grey-300:#CFCBC1;
--grey-500:#948F84;
--grey-700:#5C584F;
--grey-900:#26241F;
/* --- navy ink (brand typography) --- */
--navy-900:#0f1232;
--navy-600:#4A5573;
--navy-500:#5A6483;
/* --- violet (borders) --- */
--violet-600:#4517b9;
--violet-200:#c7b9ea;
--violet-100:#e9dcf8;
/* --- pale yellow --- */
--yellow-100:#FAF3D6;
--yellow-200:#F4E9B8;
--yellow-400:#F2D93B;
--yellow-600:#D6BC1C;
/* --- cold rose (accent: badges, links, checkmarks) --- */
--rose-100:#F7DEE3;
--rose-200:#F0BFC9;
--rose-400:#E86487;
--rose-500:#E23A5F;
--rose-600:#C22C4E;
--rose-700:#9C1F3B;
/* --- red (CTA only) --- */
--red-500:#FF3E30;
--red-600:#EB1000;
--red-700:#B80C00;
/* --- semantic scales --- */
--success-500:#2FA36B;
--success-100:#DCF0E5;
--success-700:#1D6B38;
--danger-500:var(--rose-600);
--danger-100:var(--rose-100);
--warning-500:var(--yellow-600);
--warning-100:var(--yellow-100);

/* --- surfaces --- */
--bg-page:#f8f1f8;
--bg-alt:var(--grey-50);
--bg-inverse:var(--black);
--surface-card:var(--white);
--surface-card-alt:var(--grey-100);
--surface-rose:var(--rose-100);
--surface-footer:var(--violet-100);

/* --- text --- */
--text-primary:var(--navy-900);
--text-secondary:var(--navy-600);
--text-muted:var(--navy-500);
--text-inverse:var(--white);
--text-link:var(--rose-700);
--text-link-hover:var(--rose-600);

/* --- borders --- */
--border-strong:var(--violet-600);
--border-default:var(--violet-600);
--border-subtle:var(--violet-200);
--border-ink:var(--black);

/* --- brand / actions --- */
--brand-primary:var(--red-500);
--brand-primary-hover:var(--red-600);
--brand-primary-active:var(--red-700);
/* The primary button never renders the base token: idle is red-600. */
--button-primary-bg:var(--red-600);
--button-primary-bg-hover:var(--red-700);
--button-primary-fg:var(--white);
--button-secondary-bg:var(--white);
--button-secondary-fg:var(--text-primary);
--button-secondary-border:var(--black);
--brand-accent:var(--yellow-400);
--focus-ring:var(--rose-500);

/* --- status pills --- */
--status-success-bg:var(--success-100);
--status-success-fg:var(--success-700);
--status-danger-bg:var(--rose-100);
--status-danger-fg:var(--rose-700);
--status-danger-border:var(--rose-200);
--status-info-bg:var(--yellow-200);
--status-info-fg:var(--grey-900);
--status-neutral-bg:var(--grey-100);
--status-neutral-fg:var(--navy-600);
}