:root{
--color-cream-50:#fbf3e2;
--color-cream-100:#f4e4c9;
--color-cream-200:#e9d3a8;
--color-navy-900:#1e3a4c;
--color-navy-700:#2c4a5e;
--color-navy-400:#5b7386;
--color-olive-700:#445a2e;
--color-olive-500:#5c7a3e;
--color-mustard-600:#c17d0f;
--color-mustard-500:#d68e11;
--color-mustard-200:#f1cd82;
--color-terracotta-700:#a63e1e;
--color-terracotta-600:#c1502e;
--color-terracotta-300:#e2977a;
--color-sky-200:#bcd7e0;
--color-ink-900:#211a13;

--surface-page:var(--color-cream-100);
--surface-raised:var(--color-cream-50);
--surface-inverse:var(--color-navy-900);
--surface-sunken:var(--color-cream-200);

--text-primary:var(--color-navy-900);
--text-secondary:#4d5f68;
--text-muted:#7c8a91;
--text-on-inverse:var(--color-cream-100);
--text-on-accent:var(--color-cream-50);

--accent-primary:var(--color-terracotta-600);
--accent-primary-hover:var(--color-terracotta-700);
--accent-secondary:var(--color-mustard-500);
--accent-secondary-hover:var(--color-mustard-600);
--accent-tertiary:var(--color-olive-700);
--accent-tertiary-hover:var(--color-olive-500);

--border-subtle:rgba(30,58,76,0.16);
--border-strong:rgba(30,58,76,0.32);
--focus-ring:var(--color-navy-700);
}