:root{
--color-primary:#000000;--color-on-primary:#ffffff;--color-ink:#000000;--color-canvas:#ffffff;
--color-inverse-canvas:#000000;--color-inverse-ink:#ffffff;--color-on-inverse-soft:rgba(255,255,255,.16);
--color-hairline:#e6e6e6;--color-hairline-soft:#f1f1f1;--color-surface-soft:#f7f7f5;
--color-block-lime:#dceeb1;--color-block-lilac:#c5b0f4;--color-block-cream:#f4ecd6;--color-block-pink:#efd4d4;
--color-block-mint:#c8e6cd;--color-block-coral:#f3c9b6;--color-block-navy:#1f1d3d;
--color-accent-magenta:#ff3d8b;--color-success:#1ea64a;--color-overlay-scrim:rgba(0,0,0,.6);
--text-body:var(--color-ink);--text-inverse:var(--color-inverse-ink);
--surface-page:var(--color-canvas);--surface-tile:var(--color-surface-soft);--surface-inverse:var(--color-inverse-canvas);
--border-default:var(--color-hairline);--border-subtle:var(--color-hairline-soft);
--action-primary-bg:var(--color-primary);--action-primary-fg:var(--color-on-primary);
--action-secondary-bg:var(--color-canvas);--action-secondary-fg:var(--color-ink);
--action-promo-bg:var(--color-accent-magenta);--focus-ring:var(--color-ink);
}