:root{
/* Papier en Kobalt — the six tones from palette.md */
--papier:#ffffff;--nevel:#f5f5f7;--lijn:#d1d1d6;--grafiet:#6e6e73;--inkt:#1c1c1e;--kobalt:#3b5bdb;
/* derived tones (authored for UI states; not in palette.md) */
--nevel-2:#ebebef;--lijn-zacht:#e5e5ea;--lijn-sterk:#b8b8bf;--kobalt-hover:#3350c6;--kobalt-active:#2c47b3;--kobalt-tint:#eef1fc;--kobalt-ring:rgba(59,91,219,.32);--fout:#b42318;--fout-tint:#fcefed;--scrim:rgba(28,28,30,.32);
/* semantic aliases */
--surface-page:var(--papier);--surface-section:var(--nevel);--surface-card:var(--nevel);--surface-raised:var(--papier);--surface-pressed:var(--nevel-2);--surface-selected:var(--kobalt-tint);
--text-body:var(--inkt);--text-muted:var(--grafiet);--text-on-accent:var(--papier);--text-link:var(--kobalt);--text-error:var(--fout);
--border-default:var(--lijn);--border-subtle:var(--lijn-zacht);--border-hover:var(--lijn-sterk);--border-strong:var(--inkt);--border-focus:var(--kobalt);
--accent:var(--kobalt);--accent-hover:var(--kobalt-hover);--accent-active:var(--kobalt-active);--accent-tint:var(--kobalt-tint);--focus-ring:0 0 0 3px var(--kobalt-ring);
}