:root {
    /* Color: Primary */
    --dm-color-primary-400: #818CF8;
    --dm-color-primary-500: #6366F1;
    --dm-color-primary-600: #4F46E5;

    /* Color: Neutral */
    --dm-color-neutral-100: #F9FAFB;
    --dm-color-neutral-200: #E5E7EB;
    --dm-color-neutral-300: #D1D5DB;
    --dm-color-neutral-600: #4B5563;
    --dm-color-neutral-900: #111827;

    /* Color: Semantic */
    --dm-color-success: #22C55E;
    --dm-color-warning: #F59E0B;
    --dm-color-danger: #EF4444;

    /* Surface */
    --dm-surface-page: #F9FAFB;
    --dm-surface-card: #FFFFFF;
    --dm-surface-border: #E5E7EB;
    --dm-surface-input-border: #D1D5DB;

    /* Text */
    --dm-text-primary: #111827;
    --dm-text-secondary: #4B5563;
    --dm-text-muted: #6B7280;
    --dm-text-inverse: #FFFFFF;
    --dm-text-link: #4F46E5;

    /* Spacing */
    --dm-space-xs: 8px;
    --dm-space-sm: 16px;
    --dm-space-md: 24px;
    --dm-space-lg: 32px;
    --dm-space-xl: 48px;
    --dm-space-2xl: 64px;

    /* Radius */
    --dm-radius-sm: 8px;
    --dm-radius-md: 12px;
    --dm-radius-lg: 16px;
    --dm-radius-pill: 9999px;

    /* Shadow */
    --dm-shadow-sm: 0 1px 2px rgba(0, 0, 0, 0.05);
    --dm-shadow-md: 0 2px 4px rgba(0, 0, 0, 0.10);
    --dm-shadow-lg: 0 4px 6px rgba(0, 0, 0, 0.10);

    /* Typography */
    --dm-font-family-base: Inter, system-ui, -apple-system, BlinkMacSystemFont, 'Segoe UI', sans-serif;

    --dm-font-size-h1: 48px;
    --dm-line-height-h1: 48px;
    --dm-font-weight-h1: 700;

    --dm-font-size-h2: 36px;
    --dm-line-height-h2: 40px;
    --dm-font-weight-h2: 700;

    --dm-font-size-h3: 30px;
    --dm-line-height-h3: 36px;
    --dm-font-weight-h3: 600;

    --dm-font-size-body: 16px;
    --dm-line-height-body: 24px;
    --dm-font-weight-body: 400;

    --dm-font-size-caption: 14px;
    --dm-line-height-caption: 20px;
    --dm-font-weight-caption: 400;

    --dm-font-size-label: 14px;
    --dm-line-height-label: 20px;
    --dm-font-weight-label: 500;

    /* Component dimensions */
    --dm-button-height-sm: 36px;
    --dm-button-height-md: 42px;
    --dm-button-height-lg: 52px;
    --dm-button-radius: 8px;

    --dm-input-height-sm: 40px;
    --dm-input-height-md: 42px;
    --dm-input-height-lg: 50px;
    --dm-input-radius: 8px;

    --dm-card-padding: 24px;
    --dm-card-radius: 12px;
    --dm-card-border: 1px solid #E5E7EB;

    --dm-sidebar-width-desktop: 256px;
    --dm-topbar-height: 64px;
}