:root {
    /* ========= Brand / Accent ========= */
    --color-primary: oklch(38% 0.02 255);          /* ink blue / editorial */
    --color-primary-hover: oklch(32% 0.03 255);

    /* ========= Backgrounds ========= */
    --bg-primary: oklch(99% 0.002 95);             /* newsprint white */
    --bg-secondary: oklch(96% 0.004 90);           /* column background */

    /* ========= Borders ========= */
    --border-primary: oklch(80% 0.006 90);
    --border-width: 1px;

    /* ========= Text ========= */
    --text-primary: oklch(20% 0.01 90);            /* near-black ink */
    --text-secondary: oklch(86% 0.01 90);          /* subhead / metadata */
    --text-muted: oklch(40% 0.01 90);              /* light grayish ink */

    /* ========= States ========= */
    --state-success: oklch(42% 0.08 145);          /* editorial green */
    --state-error: oklch(45% 0.14 30);             /* muted red */
    --state-info: oklch(40% 0.06 255);             /* ink blue */

    /* ========= Radius ========= */
    --radius-l: .2rem;
    --radius-s: .1rem;
    --radius: .15rem;

    /* ========= Spacing ========= */
    --space-l: .8rem;
    --space-s: .25rem;
    --space: .5rem;

    --space-r-l: .6rem .8rem;
    --space-r-s: .15rem .25rem;
    --space-r: .3rem .5rem;

    --space-x-l: .3rem .7rem;
    --space-x-s: .1rem .35rem;
    --space-x: .2rem .5rem;
}