:root {
    /* ── Spacing scale ── */
    --ffs-space-2xs: 0.125rem;  /* 2px */
    --ffs-space-xs: 0.25rem;    /* 4px */
    --ffs-space-sm: 0.375rem;   /* 6px */
    --ffs-space-md: 0.5rem;     /* 8px */
    --ffs-space-lg: 0.75rem;    /* 12px */
    --ffs-space-xl: 1rem;       /* 16px */
    --ffs-space-2xl: 1.25rem;   /* 20px */
    --ffs-space-3xl: 1.5rem;    /* 24px */
    --ffs-space-4xl: 2rem;      /* 32px */
    --ffs-space-5xl: 3rem;      /* 48px */

    /* ── Border radius ── */
    --ffs-radius-xs: 4px;
    --ffs-radius-sm: 6px;
    --ffs-radius-md: 8px;
    --ffs-radius-lg: 12px;
    --ffs-radius-xl: 0.75rem;
    --ffs-radius-pill: 9999px;
    --ffs-radius-circle: 50%;

    /* ── Shadows ── */
    --ffs-shadow-xs: 0 1px 2px rgba(0, 0, 0, 0.05);
    --ffs-shadow-sm: 0 1px 2px rgba(0, 0, 0, 0.07);
    --ffs-shadow-md: 0 1px 3px rgba(0, 0, 0, 0.12), 0 1px 2px rgba(0, 0, 0, 0.07);
    --ffs-shadow-lg: 0 2px 8px rgba(0, 0, 0, 0.1);
    --ffs-shadow-xl: 0 8px 32px rgba(0, 0, 0, 0.12), 0 2px 8px rgba(0, 0, 0, 0.06);
    --ffs-shadow-dialog: 0 0 0 1px rgba(0, 0, 0, 0.04), 0 8px 40px rgba(0, 0, 0, 0.12), 0 2px 8px rgba(0, 0, 0, 0.06);

    /* ── Borders ── */
    --ffs-border-default: 1.5px solid var(--rz-base-200);
    --ffs-border-light: 1px solid color-mix(in srgb, var(--rz-text-color) 8%, var(--rz-base-background-color));
    --ffs-border-subtle: 1px solid color-mix(in srgb, var(--rz-text-color) 10%, var(--rz-base-background-color));
    --ffs-border-separator: 1px solid var(--rz-base-200);

    /* ── Background surfaces ── */
    --ffs-bg-hover: color-mix(in srgb, var(--rz-text-color) 4%, var(--rz-base-background-color));
    --ffs-bg-subtle: color-mix(in srgb, var(--rz-text-color) 6%, var(--rz-base-background-color));
    --ffs-bg-muted: color-mix(in srgb, var(--rz-text-color) 8%, var(--rz-base-background-color));
    --ffs-bg-emphasis: color-mix(in srgb, var(--rz-text-color) 10%, var(--rz-base-background-color));
    --ffs-bg-strong: color-mix(in srgb, var(--rz-text-color) 12%, var(--rz-base-background-color));

    /* ── Primary tints ── */
    --ffs-primary-tint-light: color-mix(in srgb, var(--rz-primary) 6%, transparent);
    --ffs-primary-tint: color-mix(in srgb, var(--rz-primary) 10%, transparent);
    --ffs-primary-tint-strong: color-mix(in srgb, var(--rz-primary) 12%, transparent);

    /* ── Typography sizes ── */
    --ffs-text-2xs: 0.5625rem;  /* 9px */
    --ffs-text-xs: 0.6875rem;   /* 11px */
    --ffs-text-sm: 0.75rem;     /* 12px */
    --ffs-text-base: 0.8125rem; /* 13px */
    --ffs-text-md: 0.875rem;    /* 14px */
    --ffs-text-lg: 0.9375rem;   /* 15px */

    /* ── Transitions ── */
    --ffs-transition-fast: 0.15s ease;
    --ffs-transition-normal: 0.25s ease;
    --ffs-transition-smooth: 0.35s ease-out;
    --ffs-transition-spring: 0.4s cubic-bezier(0.4, 0, 0.2, 1);
}