:root,
.rv-admin,
.rv-frontend {
    --rv-font-sans: "Roboto", "Segoe UI", "Helvetica Neue", Arial, sans-serif;
    --rv-font-serif: "Source Serif 4", "Georgia", serif;

    --rv-text-xs: 12px;
    --rv-text-sm: 14px;
    --rv-text-md: 16px;
    --rv-text-lg: 20px;
    --rv-text-xl: 24px;
    --rv-text-2xl: 32px;

    --rv-line-tight: 1.2;
    --rv-line-normal: 1.5;

    --rv-space-1: 4px;
    --rv-space-2: 8px;
    --rv-space-3: 12px;
    --rv-space-4: 16px;
    --rv-space-5: 24px;
    --rv-space-6: 32px;
    --rv-space-7: 48px;
    --rv-space-8: 64px;

    --rv-radius-sm: 4px;
    --rv-radius-md: 8px;
    --rv-radius-lg: 16px;
    --rv-radius-pill: 999px;

    --rv-breakpoint-mobile: 480px;
    --rv-breakpoint-tablet: 768px;
    --rv-breakpoint-desktop: 1200px;

    --rv-container-max-width: 1240px;
    --rv-container-padding: var(--rv-space-5);
    --rv-container-padding-mobile: var(--rv-space-4);

    --rv-grid-gap-sm: var(--rv-space-3);
    --rv-grid-gap-md: var(--rv-space-4);
    --rv-grid-gap-lg: var(--rv-space-5);

    --rv-md-space-1: var(--rv-space-1);
    --rv-md-space-2: var(--rv-space-2);
    --rv-md-space-3: var(--rv-space-3);
    --rv-md-space-4: var(--rv-space-4);
    --rv-md-space-5: var(--rv-space-5);
    --rv-md-space-6: var(--rv-space-6);
    --rv-md-space-7: var(--rv-space-7);
    --rv-md-space-8: var(--rv-space-8);

    --rv-md-radius-xs: var(--rv-radius-sm);
    --rv-md-radius-sm: var(--rv-radius-md);
    --rv-md-radius-md: 12px;
    --rv-md-radius-lg: var(--rv-radius-lg);
    --rv-md-radius-xl: 24px;
    --rv-md-radius-pill: var(--rv-radius-pill);

    --rv-color-primary: #082352;
    --rv-color-primary-rgb: 8, 35, 82;
    --rv-color-on-primary: #ffffff;
    --rv-color-primary-container: #d9e2ff;
    --rv-color-on-primary-container: #001945;
    --rv-color-primary-light: rgba(8, 35, 82, 0.08);

    --rv-color-bg: #f8fafc;
    --rv-color-surface: #ffffff;
    --rv-color-surface-2: #f1f5f9;
    --rv-color-surface-alt: #ffffff;
    --rv-color-surface-variant: #e2e8f0;
    --rv-color-text: #1e293b;
    --rv-color-text-secondary: #475569;
    --rv-color-muted: #4b5563;
    --rv-color-border: #e2e8f0;

    --rv-color-success: #059669;
    --rv-color-success-soft: #ecfdf5;
    --rv-color-warning: #d97706;
    --rv-color-warning-soft: #fffbeb;
    --rv-color-error: #dc2626;
    --rv-color-error-soft: #fef2f2;
    --rv-color-info: #2563eb;
    --rv-color-info-soft: #eff6ff;

    --rv-color-accent: #0f172a;
    --rv-color-accent-strong: #020617;
    --rv-color-accent-soft: #f1f5f9;

    --rv-md-primary: var(--rv-color-primary);
    --rv-md-on-primary: var(--rv-color-on-primary);
    --rv-md-primary-container: var(--rv-color-primary-container);
    --rv-md-on-primary-container: var(--rv-color-on-primary-container);

    --rv-md-secondary: var(--rv-color-text-secondary);
    --rv-md-on-secondary: #ffffff;
    --rv-md-secondary-container: var(--rv-color-surface-2);
    --rv-md-on-secondary-container: var(--rv-color-text);

    --rv-md-tertiary: var(--rv-color-info);
    --rv-md-on-tertiary: #ffffff;
    --rv-md-tertiary-container: var(--rv-color-info-soft);
    --rv-md-on-tertiary-container: var(--rv-color-info);

    --rv-md-error: var(--rv-color-error);
    --rv-md-on-error: #ffffff;
    --rv-md-error-container: var(--rv-color-error-soft);
    --rv-md-on-error-container: var(--rv-color-error);

    --rv-md-background: var(--rv-color-bg);
    --rv-md-on-background: var(--rv-color-text);
    --rv-md-surface: var(--rv-color-surface);
    --rv-md-on-surface: var(--rv-color-text);
    --rv-md-surface-variant: var(--rv-color-surface-variant);
    --rv-md-on-surface-variant: var(--rv-color-text-secondary);
    --rv-md-surface-container: var(--rv-color-surface);
    --rv-md-surface-container-low: var(--rv-color-surface);
    --rv-md-surface-container-high: #f1f5f9;
    --rv-md-surface-container-highest: #e2e8f0;

    --rv-md-outline: #cbd5e1;
    --rv-md-outline-variant: #e2e8f0;
    --rv-md-shadow: rgba(0, 0, 0, 0.1);
    --rv-md-scrim: rgba(15, 23, 42, 0.5);
    --rv-md-inverse-surface: #0f172a;
    --rv-md-inverse-on-surface: #f8fafc;
    --rv-md-inverse-primary: #94a3b8;

    --rv-md-elevation-0: none;
    --rv-md-elevation-1: 0 1px 3px 0 rgb(0 0 0 / 0.1), 0 1px 2px -1px rgb(0 0 0 / 0.1);
    --rv-md-elevation-2: 0 4px 6px -1px rgb(0 0 0 / 0.1), 0 2px 4px -2px rgb(0 0 0 / 0.1);
    --rv-md-elevation-3: 0 10px 15px -3px rgb(0 0 0 / 0.1), 0 4px 6px -4px rgb(0 0 0 / 0.1);
    --rv-md-elevation-4: 0 20px 25px -5px rgb(0 0 0 / 0.1), 0 8px 10px -6px rgb(0 0 0 / 0.1);
    --rv-md-focus-ring: 0 0 0 2px #fff, 0 0 0 4px var(--rv-color-primary);

    --rv-shadow-sm: var(--rv-md-elevation-1);
    --rv-shadow-md: var(--rv-md-elevation-2);
    --rv-shadow-lg: var(--rv-md-elevation-3);
    --rv-shadow-focus: var(--rv-md-focus-ring);

    --rv-ease-out: cubic-bezier(0, 0, 0.2, 1);
    --rv-ease-bounce: cubic-bezier(0.34, 1.56, 0.64, 1);

    --rv-font-size-xs: var(--rv-text-xs);
    --rv-font-size-sm: var(--rv-text-sm);
    --rv-font-size-base: var(--rv-text-md);
    --rv-font-size-lg: var(--rv-text-lg);
    --rv-font-size-xl: var(--rv-text-xl);
    --rv-font-size-2xl: var(--rv-text-2xl);
    --rv-font-size-3xl: 40px;

    color: var(--rv-color-text);
    font-family: var(--rv-font-sans);
    line-height: var(--rv-line-normal);
}