Azornes-Comfyui-Model-Resolver/web/css/css-variables.css

:root {
    --ml-color-primary: #5af;
    --ml-color-primary-light: #7cf;
    --ml-color-primary-lighter: #7bf;
    --ml-color-success: #5f5;
    --ml-color-error: #f00;
    --ml-color-error-light: #f55;
    --ml-color-error-lighter: #f77;
    --ml-color-warning: #fa0;
    --ml-color-white: #fff;
    --ml-color-black: #000;
    --ml-color-gray-100: #ddd;
    --ml-color-gray-200: #ccc;
    --ml-color-gray-300: #aaa;
    --ml-color-gray-400: #999;
    --ml-color-gray-500: #888;
    --ml-color-gray-600: #666;
    --ml-color-gray-700: #555;
    --ml-color-gray-800: #444;
    --ml-color-gray-900: #333;
    --ml-color-bg-dark-1: #2a2a2a;
    --ml-color-bg-dark-2: #1e1e1e;
    --ml-color-bg-dark-3: #1a1a1a;
    --ml-color-bg-dark-4: #0d0d0d;
    --ml-color-bg-hover: #3a3a3a;
    --ml-overlay-dark-20: rgba(0, 0, 0, 0.2);
    --ml-overlay-dark-50: rgba(0, 0, 0, 0.5);
    --ml-overlay-dark-70: rgba(0, 0, 0, 0.7);
    --ml-overlay-dark-80: rgba(0, 0, 0, 0.8);
    --ml-overlay-light-05: rgba(255, 255, 255, 0.05);
    --ml-overlay-light-08: rgba(255, 255, 255, 0.08);
    --ml-overlay-light-10: rgba(255, 255, 255, 0.1);
    --ml-overlay-light-15: rgba(255, 255, 255, 0.15);
    --ml-overlay-light-20: rgba(255, 255, 255, 0.2);
    --ml-bg-primary-10: rgba(90, 170, 255, 0.1);
    --ml-bg-primary-20: rgba(90, 170, 255, 0.2);
    --ml-bg-primary-30: rgba(90, 170, 255, 0.3);
    --ml-bg-primary-40: rgba(90, 170, 255, 0.4);
    --ml-bg-primary-50: rgba(90, 170, 255, 0.5);
    --ml-bg-success-10: rgba(80, 255, 80, 0.1);
    --ml-bg-success-50: rgba(80, 255, 80, 0.5);
    --ml-bg-error-10: rgba(255, 0, 0, 0.1);
    --ml-bg-error-20: rgba(255, 0, 0, 0.2);
    --ml-bg-gray-30: rgba(100, 100, 100, 0.3);
    --ml-bg-gray-40: rgba(120, 120, 120, 0.4);
    --ml-line-height-tight: 1.3;
    --ml-line-height-normal: 1.5;
    --ml-line-height-relaxed: 1.6;
    --ml-line-height-editor: 19.5px;
    --ml-width-dropdown-min: 250px;
    --ml-width-dropdown-max: 400px;
    --ml-width-input-inline-sm: 120px;
    --ml-width-input-inline-md: 200px;
    --ml-width-dialog-sm: 320px;
    --ml-width-dialog-md: 800px;
    --ml-z-dropdown: 9998;
    --ml-z-dialog: 9999;
    --ml-z-rename-dialog: 10000;
    --ml-z-json-editor: 10001;
    --ml-z-floating-button: 10000;
    --ml-z-notification: 100000;
    --ml-z-context-menu: 100001;
    --ml-z-tooltip: 100002;
    --ml-spacing-1: 1px;
    --ml-spacing-2: 2px;
    --ml-spacing-3: 3px;
    --ml-spacing-4: 4px;
    --ml-spacing-5: 5px;
    --ml-spacing-6: 6px;
    --ml-spacing-8: 8px;
    --ml-spacing-10: 10px;
    --ml-spacing-12: 12px;
    --ml-spacing-15: 15px;
    --ml-spacing-16: 16px;
    --ml-spacing-20: 20px;
    --ml-spacing-24: 24px;
    --ml-spacing-32: 32px;
    --ml-spacing-40: 40px;
    --ml-spacing-48: 48px;
    --ml-radius-sm: 2px;
    --ml-radius-md: 4px;
    --ml-radius-lg: 6px;
    --ml-radius-xl: 8px;
    --ml-radius-2xl: 12px;
    --ml-radius-3xl: 16px;
    --ml-font-xs: 10px;
    --ml-font-sm: 11px;
    --ml-font-md: 12px;
    --ml-font-base: 13px;
    --ml-font-lg: 14px;
    --ml-font-xl: 16px;
    --ml-font-2xl: 18px;
    --ml-font-3xl: 20px;
    --ml-font-4xl: 24px;
    --ml-font-5xl: 48px;
    --ml-transition-fast: 0.1s;
    --ml-transition-normal: 0.2s;
    --ml-transition-all-fast: all 0.1s;
    --ml-transition-all: all 0.2s;
    --ml-transition-bg-fast: background 0.1s;
    --ml-transition-bg: background 0.2s;
    --ml-transition-color: color 0.2s;
    --ml-transition-border: border-color 0.2s;
    --ml-transition-opacity: opacity 0.2s;
    --ml-shadow-lg: 0 8px 32px rgba(0, 0, 0, 0.8);
    --ml-gradient-dark: linear-gradient(135deg, var(--ml-color-bg-dark-1) 0%, var(--ml-color-bg-dark-2) 100%);
    --ml-drag-color-reorder: var(--ml-color-primary);
    --ml-drag-color-move: var(--ml-color-warning);
    --ml-drag-color-error: var(--ml-color-error);
    --ml-drag-color-clone: var(--ml-color-success);

    --ml-bg: #121212;
    --ml-bg-soft: #171717;
    --ml-surface-elevated: #232323;
    --ml-card-bg: #1a1a1a;
    --ml-card-bg-alt: #1d1d1d;
    --ml-panel-bg: #202020;
    --ml-panel-bg-strong: #262626;
    --ml-border: rgba(255, 255, 255, 0.08);
    --ml-border-strong: rgba(255, 255, 255, 0.14);
    --ml-divider: rgba(255, 255, 255, 0.08);
    --ml-text: #f3f3f3;
    --ml-text-muted: #b1b1b1;
    --ml-text-dim: #7b7b7b;
    --ml-text-soft: #dfdfdf;
    --ml-accent: #72d38a;
    --ml-accent-hover: #88de9e;
    --ml-accent-blue: #72d38a;
    --ml-warning: #e1b24d;
    --ml-confidence-high: #72d38a;
    --ml-confidence-medium: #e1b24d;
    --ml-confidence-low: #e06a6a;
    --ml-link-color: #d8d8d8;
    --ml-shadow-elevated: 0 18px 42px rgba(0, 0, 0, 0.28);
    --ml-ui-radius-sm: var(--ml-radius-xl);
    --ml-ui-radius-md: var(--ml-radius-2xl);
    --ml-ui-radius-lg: var(--ml-radius-3xl);
}