:root {
    --re-bg-page: #f6f8fb;
    --re-bg-card: #ffffff;
    --re-bg-soft: #f1f5f9;
    --re-bg-hover: #eef4ff;
    --re-bg-muted: #e7edf5;
    --re-text: #162033;
    --re-text-muted: #64748b;
    --re-text-soft: #94a3b8;
    --re-text-inverse: #ffffff;
    --re-border: #dbe4ef;
    --re-border-soft: #edf2f7;
    --re-focus: #2563eb;
    --re-info: #2563eb;
    --re-success: #16a34a;
    --re-warning: #d97706;
    --re-danger: #dc2626;
    --re-cyan: #0891b2;
    --re-purple: #7c3aed;
    --re-slate: #334155;
    --re-grad-primary: linear-gradient(135deg, #2563eb 0%, #7c3aed 100%);
    --re-grad-success: linear-gradient(135deg, #059669 0%, #16a34a 100%);
    --re-grad-warning: linear-gradient(135deg, #d97706 0%, #f59e0b 100%);
    --re-grad-danger: linear-gradient(135deg, #dc2626 0%, #f97316 100%);
    --re-shadow-sm: 0 1px 2px rgba(15, 23, 42, 0.06);
    --re-shadow-md: 0 8px 20px rgba(15, 23, 42, 0.08);
    --re-shadow-lg: 0 18px 42px rgba(15, 23, 42, 0.12);
    --re-focus-ring: 0 0 0 3px rgba(37, 99, 235, 0.2);
    --re-input-focus-ring: 0 0 0 3px rgba(37, 99, 235, 0.14);
    --re-scroll-shadow: linear-gradient(to left, rgba(15, 23, 42, 0.08), rgba(15, 23, 42, 0));
    --re-radius-sm: 4px;
    --re-radius-md: 8px;
    --re-radius-lg: 12px;
    --re-space-xs: 4px;
    --re-space-sm: 8px;
    --re-space-md: 12px;
    --re-space-lg: 16px;
    --re-space-xl: 24px;
    --re-space-2xl: 32px;
    --re-motion-fast: 120ms;
    --re-motion-base: 200ms;
    --re-motion-slow: 320ms;
    --re-ease-out: cubic-bezier(0.16, 1, 0.3, 1);
    --re-ease-spring: cubic-bezier(0.34, 1.56, 0.64, 1);
}

@keyframes re-fade-up {
    from {
        opacity: 0;
        transform: translateY(12px);
    }

    to {
        opacity: 1;
        transform: none;
    }
}

@keyframes re-scale-in {
    from {
        opacity: 0;
        transform: scale(0.97);
    }

    to {
        opacity: 1;
        transform: none;
    }
}

@keyframes re-shimmer {
    0% {
        background-position: 200% 0;
    }

    100% {
        background-position: -200% 0;
    }
}

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