:root {
    --font-sans: "PingFang SC", "Microsoft YaHei", "Segoe UI", system-ui, -apple-system, sans-serif;
    --brand-50: #eef3ff;
    --brand-100: #dce6ff;
    --brand-500: #3f63f4;
    --brand-600: #3153df;
    --brand-700: #2843bb;
    --success-50: #ecfdf3;
    --success-600: #15803d;
    --warning-50: #fff8eb;
    --warning-600: #b45309;
    --danger-50: #fff1f1;
    --danger-600: #b42318;
    --info-50: #eff6ff;
    --info-600: #1d4ed8;
    --space-1: 4px;
    --space-2: 8px;
    --space-3: 12px;
    --space-4: 16px;
    --space-5: 20px;
    --space-6: 24px;
    --space-8: 32px;
    --space-10: 40px;
    --space-12: 48px;
    --radius-xs: 6px;
    --radius-sm: 8px;
    --radius-md: 12px;
    --radius-lg: 16px;
    --radius-pill: 999px;
    --control-sm: 36px;
    --control-md: 40px;
    --control-lg: 44px;
    --text-xs: 12px;
    --text-sm: 13px;
    --text-md: 14px;
    --text-lg: 16px;
    --text-xl: 20px;
    --text-2xl: 24px;
    --text-3xl: 28px;
    --shadow-sm: 0 1px 2px rgb(16 24 40 / 5%);
    --shadow-md: 0 10px 28px rgb(16 24 40 / 10%);
    --shadow-overlay: 0 24px 64px rgb(0 0 0 / 26%);
    --ease-standard: cubic-bezier(.2, .8, .2, 1);
    --motion-fast: 140ms;
    --motion-medium: 180ms;
}

body.client-app {
    color-scheme: dark;
    --page-bg: #0b0d10;
    --surface: #12151a;
    --surface-raised: #181c22;
    --surface-subtle: #101318;
    --surface-hover: #1d222a;
    --border: #2a3038;
    --border-strong: #3a424d;
    --text: #f5f7fa;
    --text-secondary: #aab2bd;
    --text-tertiary: #7f8996;
    --focus-ring: #7893ff;
    --selection: rgb(63 99 244 / 28%);
    --overlay: rgb(5 7 10 / 82%);
}

body.admin-app {
    color-scheme: light;
    --page-bg: #f5f7fa;
    --surface: #ffffff;
    --surface-raised: #ffffff;
    --surface-subtle: #f8fafc;
    --surface-hover: #f1f4f8;
    --border: #e1e6ee;
    --border-strong: #cdd5df;
    --text: #111827;
    --text-secondary: #5f6b7a;
    --text-tertiary: #8792a2;
    --focus-ring: #3153df;
    --selection: rgb(63 99 244 / 16%);
    --overlay: rgb(15 23 42 / 48%);
}

@media (prefers-reduced-motion: reduce) {
    *, *::before, *::after {
        scroll-behavior: auto !important;
        animation-duration: .01ms !important;
        animation-iteration-count: 1 !important;
        transition-duration: .01ms !important;
    }
}