:root{
--fg-black:#000000;
--fg-black-2:#17171A;
--fg-black-3:#232326;
--fg-gold:#E8C468;
--fg-gold-soft:oklch(from #E8C468 calc(l + 0.1) c h);
--fg-gold-deep:oklch(from #E8C468 calc(l - 0.14) c h);
--fg-white:#FFFFFF;
--fg-gray:#7A7A7A;
--fg-gray-soft:#A8A8A8;
--fg-gray-line:#2B2B2E;
--fg-red:#FF3B30;
--fg-red-deep:oklch(from #FF3B30 calc(l - 0.12) c h);

--surface-page:var(--fg-black);
--surface-raised:var(--fg-black-2);
--surface-card:var(--fg-black-3);
--surface-page-light:var(--fg-white);
--surface-card-light:#F7F6F3;

--text-primary:var(--fg-white);
--text-secondary:var(--fg-gray-soft);
--text-muted:var(--fg-gray);
--text-primary-onlight:var(--fg-black);
--text-secondary-onlight:#54545A;

--accent-gold:var(--fg-gold);
--accent-signal:var(--fg-red);

--border-subtle:var(--fg-gray-line);
--border-subtle-onlight:#E4E2DC;
--border-gold:var(--fg-gold);

--focus-ring:var(--fg-gold);
}