/**
 * Bridge: WordPress theme.json presets → Velora --vl-* knobs.
 * Skin tokens live in theme.json (TT5 palette slugs). Do not restyle components here.
 */

html {
    --vl-font-family: var(--wp--preset--font-family--source-sans-3);
    --vl-font-family-display: var(--wp--preset--font-family--oswald);
    --vl-font-family-serif: var(--wp--preset--font-family--source-serif-4);
    --vl-font-family-mono: var(--wp--preset--font-family--ibm-plex-mono);
    --vl-bg-main: var(--wp--preset--color--base);
    --vl-bg-surface: var(--wp--preset--color--accent-5);
    --vl-bg-surface-elevated: var(--wp--preset--color--accent-3);
    --vl-text-primary: var(--wp--preset--color--contrast);
    --vl-text-secondary: var(--wp--preset--color--accent-4);
    --vl-text-muted: var(--wp--preset--color--accent-4);
    --vl-border-subtle: var(--wp--preset--color--accent-6);
    --vl-color-primary: var(--wp--preset--color--accent-1);
    --vl-color-primary-soft: color-mix(in srgb, var(--wp--preset--color--accent-1) 16%, transparent);
    --vl-radius-sm: var(--wp--custom--radius--sm);
    --vl-radius-md: var(--wp--custom--radius--md);
    --vl-radius-lg: var(--wp--custom--radius--lg);
    --vl-radius-xl: var(--wp--custom--radius--xl);
    --vl-radius-full: var(--wp--custom--radius--full);
    --vl-shadow-sm: var(--wp--preset--shadow--sm);
    --vl-shadow-md: var(--wp--preset--shadow--md);
    --vl-shadow-lg: var(--wp--preset--shadow--lg);
    --vl-shadow-glow: var(--wp--preset--shadow--glow);
    --vl-shadow-dramatic: var(--wp--preset--shadow--dramatic);
    --vl-shadow-inner: var(--wp--preset--shadow--inner);
    --vl-shadow-float: var(--wp--preset--shadow--float);
    --vl-backdrop-blur: 12px;
    --skif-font-display: var(--wp--preset--font-family--oswald);
    --skif-font-body: var(--wp--preset--font-family--source-sans-3);
}

@media (prefers-reduced-motion: reduce) {
    html {
        scroll-behavior: auto;
    }
}