:root {
    --fm-indigo: #4f46e5;
    --fm-indigo-deep: #4338ca;
    --fm-teal: #0f766e;
    --fm-coral: #f05a47;
    --fm-ink: #111827;
    --fm-slate: #64748b;
    --fm-cloud: #f8fafc;
    --fm-white: #ffffff;
    --fm-lavender: #eef2ff;
    --fm-border: #e2e8f0;
    --fm-success: #15803d;
    --fm-warning: #b45309;
    --fm-danger: #dc2626;
    --fm-info: #2563eb;

    --fm-bg: #f8fafc;
    --fm-surface: #ffffff;
    --fm-surface-soft: #f1f5f9;
    --fm-text: #111827;
    --fm-text-muted: #64748b;
    --fm-border-color: #e2e8f0;
    --fm-focus: rgba(79, 70, 229, 0.28);

    /* Canonical aliases consumed by UI System v2. */
    --fm-primary: var(--fm-indigo);
    --fm-primary-deep: var(--fm-indigo-deep);
    --fm-border: var(--fm-border-color);
    --fm-surface-muted: var(--fm-surface-soft);
    --fm-divider: color-mix(in srgb, var(--fm-border-color) 78%, transparent);
    --fm-success-surface: color-mix(in srgb, var(--fm-success) 9%, var(--fm-surface));
    --fm-warning-surface: color-mix(in srgb, var(--fm-warning) 9%, var(--fm-surface));
    --fm-danger-surface: color-mix(in srgb, var(--fm-danger) 9%, var(--fm-surface));
    --fm-info-surface: color-mix(in srgb, var(--fm-info) 9%, var(--fm-surface));

    --fm-font: "Inter", -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
    --fm-radius-sm: 8px;
    --fm-radius-md: 12px;
    --fm-radius-lg: 18px;
    --fm-radius-xl: 26px;
    --fm-shadow-sm: 0 1px 2px rgba(15, 23, 42, 0.04);
    --fm-shadow-md: 0 18px 50px rgba(15, 23, 42, 0.08);
    --fm-shadow-lg: 0 30px 80px rgba(15, 23, 42, 0.14);

    --fm-space-1: 4px;
    --fm-space-2: 8px;
    --fm-space-3: 12px;
    --fm-space-4: 16px;
    --fm-space-5: 20px;
    --fm-space-6: 24px;
    --fm-space-8: 32px;
    --fm-space-10: 40px;
    --fm-space-12: 48px;
    --fm-space-16: 64px;

    --fm-transition: 180ms ease;
}

html[data-theme="dark"] {
    --fm-bg: #0b1020;
    --fm-surface: #121a2b;
    --fm-surface-soft: #182235;
    --fm-text: #f8fafc;
    --fm-text-muted: #94a3b8;
    --fm-border-color: #263348;
    --fm-focus: rgba(45, 212, 191, 0.25);
    --fm-teal: #2dd4bf;
    --fm-coral: #fb7185;
    --fm-cloud: #0b1020;
    --fm-white: #f8fafc;
    --fm-lavender: rgba(79, 70, 229, 0.16);
    --fm-shadow-sm: 0 1px 2px rgba(0, 0, 0, 0.22);
    --fm-shadow-md: 0 18px 50px rgba(0, 0, 0, 0.28);
    --fm-shadow-lg: 0 30px 80px rgba(0, 0, 0, 0.34);
}

html[data-theme="dark"] .fm-app-body {
    /* High-contrast text and semantic tones on dark surfaces. */
    --fm-primary: #a5b4fc;
    --fm-primary-deep: #c7d2fe;
    --fm-success: #4ade80;
    --fm-warning: #fbbf24;
    --fm-danger: #f87171;
    --fm-info: #93c5fd;
    --fm-v2-shadow-soft: 0 14px 38px rgba(0, 0, 0, 0.24);
    --fm-v2-shadow-float: 0 20px 52px rgba(0, 0, 0, 0.36);
}
