:root{
/* Base palette */
--color-ink:#282828;
--color-offwhite:#EDEDED;
--color-white:#FFFFFF;
--color-bone:#E0DFDB;
--color-lavender:#9F91F1;
--color-lavender-dark:#6B63D6;
--color-black:#000000;
/* Ink alphas (text + lines on light grounds) */
--ink-85:rgba(40,40,40,0.85);
--ink-80:rgba(40,40,40,0.8);
--ink-72:rgba(40,40,40,0.72);
--ink-70:rgba(40,40,40,0.7);
--ink-60:rgba(40,40,40,0.6);
--ink-55:rgba(40,40,40,0.55);
--ink-25:rgba(40,40,40,0.25);
--ink-18:rgba(40,40,40,0.18);
--ink-08:rgba(40,40,40,0.08);
/* Off-white alphas (text + lines on dark grounds) */
--offwhite-85:rgba(237,237,237,0.85);
--offwhite-70:rgba(237,237,237,0.7);
--offwhite-68:rgba(237,237,237,0.68);
--offwhite-55:rgba(237,237,237,0.55);
--white-75:rgba(255,255,255,0.75);
--white-10:rgba(255,255,255,0.1);

/* Semantic — surfaces */
--surface-page:var(--color-white);
--surface-bone:var(--color-bone);
--surface-soft:var(--color-offwhite);
--surface-dark:var(--color-ink);
--surface-accent:var(--color-lavender);
--surface-media:var(--color-white);
/* Semantic — text */
--text-strong:var(--color-ink);
--text-body:var(--ink-85);
--text-body-case:var(--ink-80);
--text-muted:var(--ink-70);
--text-subtle:var(--ink-55);
--text-on-dark:var(--color-offwhite);
--text-on-dark-muted:var(--offwhite-70);
--text-on-dark-soft:var(--color-bone);
--text-accent:var(--color-lavender);
/* Semantic — interactive */
--accent:var(--color-lavender);
--accent-hover:var(--color-lavender-dark);
--link-on-light:var(--color-ink);
--link-on-light-hover:var(--color-lavender-dark);
--link-on-dark-hover:var(--color-lavender);
/* Semantic — borders */
--border-divider:var(--ink-25);
--border-hairline:var(--ink-08);
--border-on-dark:var(--white-75);
--border-on-dark-hairline:var(--white-10);
--border-strong:var(--color-ink);
}