:root {
  --color-primary: rgba(255, 255, 255, 0.6);
  --color-primary-90: rgba(255, 255, 255, 0.85);
  --color-primary-80: rgba(255, 255, 255, 0.7);
  --color-primary-60: rgba(255, 255, 255, 0.5);
  --color-primary-40: rgba(255, 255, 255, 0.35);
  --color-primary-20: rgba(255, 255, 255, 0.2);

  --color-background: linear-gradient(135deg, #eef2f7 0%, #e2e8f0 50%, #eef2f7 100%);
  --color-background-80: rgba(238, 242, 247, 0.8);
  --color-background-60: rgba(238, 242, 247, 0.6);
  --color-background-40: rgba(238, 242, 247, 0.4);
  --color-background-20: rgba(238, 242, 247, 0.2);

  --card-background: rgba(255, 255, 255, 0.5);
  --background-secondary: rgba(248, 249, 250, 0.5);
  --color-surface-hover: rgba(255, 255, 255, 0.3);
  --hover-background: rgba(0, 0, 0, 0.04);

  --text-primary: #1f2937;
  --text-secondary: #6b7280;
  --text-tertiary: #9ca3af;

  --border-color: rgba(0, 0, 0, 0.08);

  --color-selection: #f9fafb;
  --color-selection-80: #f9fafbcc;
  --color-selection-60: #f9fafb99;
  --color-selection-40: #f9fafb66;
  --color-selection-20: #f9fafb33;

  --color-accent: #0247a9;
  --color-accent-80: #012455;
  --color-accent-60: #023b8d;
  --color-accent-40: #5684c6;
  --color-accent-20: #abc2e2;
  --color-accent-10: #ccdaee;

  --color-danger: #de1616;
  --color-danger-80: #6f0b0b;
  --color-danger-60: #b91212;
  --color-danger-40: #e96464;
  --color-danger-20: #f4b1b1;

  --color-success: #28a745;
  --color-success-80: #28a745cc;
  --color-success-60: #28a74599;
  --color-success-40: #28a74566;
  --color-success-20: #28a74533;

  --color-warning: #fbbf24;
  --color-warning-80: #fbbf24cc;
  --color-warning-60: #fbbf2499;
  --color-warning-40: #fbbf2466;
  --color-warning-20: #fbbf2433;

  --color-purple: #8b5cf6;
  --color-purple-80: #8b5cf6cc;
  --color-purple-60: #8b5cf699;
  --color-purple-40: #8b5cf666;
  --color-purple-20: #8b5cf633;
  --color-purple-10: #8b5cf611;

  --color-text: #344054;
  --color-text-secondary: #667085;

  --color-gray-50: #f9fafb;
  --color-gray-100: #fbfbfb;
  --color-gray-200: rgba(0, 0, 0, 0.08);
  --color-gray-300: #e0e0e0;
  --color-gray-400: #98a2b3;
  --color-gray-500: #667085;
  --color-gray-600: #475467;
  --color-gray-700: #344054;
  --color-gray-900: #101828;

  --color-border: rgba(0, 0, 0, 0.06);
  --color-background-secondary: rgba(248, 248, 248, 0.5);

  --color-accent-hover: #023b8d;

  --font-size-small: 14px;
  --font-size-medium: 16px;
  --font-size-large: 18px;

  --font-size-paragraph-large: 22px;
  --font-size-paragraph-medium: 20px;
  --font-size-paragraph-small: 17px;
  --font-size-paragraph-xsmall: 15px;
  --font-size-paragraph-xxsmall: 14px;
  --line-height-paragraphs: 120%;

  --spacing-xsmall: 4px;
  --spacing-small: 8px;
  --spacing-medium: 16px;
  --spacing-large: 24px;
  --spacing-xlarge: 32px;

  --font-size-overline: 11px;
  --font-size-caption: 12px;
  --letter-spacing-overline: 0.08em;

  --glass-backdrop-filter: blur(20px) saturate(180%);
  --glass-border: 1px solid rgba(255, 255, 255, 0.5);
  --glass-shadow: 0 4px 24px rgba(0, 0, 0, 0.06), 0 1px 2px rgba(0, 0, 0, 0.04);
  --glass-inner-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.55);
  --glass-background: linear-gradient(
    135deg,
    rgba(255, 255, 255, 0.72) 0%,
    rgba(255, 255, 255, 0.48) 100%
  );
  --glass-card-hover-background: rgba(255, 255, 255, 0.8);

  --stage-tint-registered: rgba(222, 22, 22, 0.06);
  --stage-tint-tested: rgba(222, 22, 22, 0.03);
  --stage-tint-hardened: rgba(0, 0, 0, 0.02);
  --stage-tint-trusted: rgba(2, 71, 169, 0.03);
  --stage-tint-adapted: rgba(2, 71, 169, 0.06);

  --z-index-popover: 1100;
  --z-index-modal: 5000;
  --z-index-dropdown: 6000;
}

[data-theme='dark'] {
  --color-primary: rgba(42, 42, 42, 0.7);
  --color-primary-90: rgba(42, 42, 42, 0.9);
  --color-primary-80: rgba(42, 42, 42, 0.2);
  --color-primary-60: rgba(42, 42, 42, 0.15);
  --color-primary-40: rgba(42, 42, 42, 0.1);
  --color-primary-20: rgba(42, 42, 42, 0.05);
  --color-primary-10: rgba(42, 42, 42);

  --card-background: rgba(42, 42, 42, 0.8);
  --background-secondary: rgba(50, 50, 50, 0.6);
  --color-surface-hover: rgba(255, 255, 255, 0.08);
  --hover-background: rgba(255, 255, 255, 0.08);

  --text-primary: #e5e7eb;
  --text-secondary: #9ca3af;
  --text-tertiary: #6b7280;

  --border-color: rgba(255, 255, 255, 0.1);

  --color-background: #121212;
  --color-background-80: #121212cc;
  --color-background-60: #12121299;
  --color-background-40: #12121266;
  --color-background-20: #12121233;

  --color-selection: rgba(42, 42, 42, 0.3);
  --color-selection-80: rgba(42, 42, 42, 0.24);
  --color-selection-60: rgba(42, 42, 42, 0.18);
  --color-selection-40: rgba(42, 42, 42, 0.12);
  --color-selection-20: rgba(42, 42, 42, 0.06);

  --color-accent: #4a90e2;
  --color-accent-80: #4a90e2cc;
  --color-accent-60: #4a90e299;
  --color-accent-40: #4a90e266;
  --color-accent-20: #4a90e233;
  --color-accent-10: #4a90e211;

  --color-danger: #ff5252;
  --color-danger-80: #ff5252cc;
  --color-danger-60: #ff525299;
  --color-danger-40: #ff525266;
  --color-danger-20: #ff525233;

  --color-success: #4caf50;
  --color-success-80: #4caf50cc;
  --color-success-60: #4caf5099;
  --color-success-40: #4caf5066;
  --color-success-20: #4caf5033;

  --color-warning: #fbbf24;
  --color-warning-80: #fbbf24cc;
  --color-warning-60: #fbbf2499;
  --color-warning-40: #fbbf2466;
  --color-warning-20: #fbbf2433;

  --color-purple: #7c3aed;
  --color-purple-80: #7c3aedcc;
  --color-purple-60: #7c3aed99;
  --color-purple-40: #7c3aed80;
  --color-purple-20: #7c3aed50;
  --color-purple-10: #7c3aed20;

  --color-text: #e0e0e0;
  --color-text-secondary: #a0a0a0;

  --color-gray-50: rgba(255, 255, 255, 0.05);
  --color-gray-100: #2a2a2a;
  --color-gray-200: rgba(74, 74, 74, 0.3);
  --color-gray-300: #4a4a4a;
  --color-gray-400: #9ca3af;
  --color-gray-500: #c3c3c3;
  --color-gray-600: #a0a0a0;
  --color-gray-700: #c0c0c0;
  --color-gray-900: #e0e0e0;

  --color-border: rgba(255, 255, 255, 0.1);
  --color-background-secondary: rgba(42, 42, 42, 0.5);

  --color-accent-hover: #3b82f6;

  --glass-backdrop-filter: blur(48px) saturate(200%);
  --glass-border: 1px solid rgba(255, 255, 255, 0.125);
  --glass-shadow: 0 8px 32px 0 rgba(0, 0, 0, 0.37);
  --glass-inner-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.08);
  --glass-background: linear-gradient(
    135deg,
    rgba(52, 52, 52, 0.75) 0%,
    rgba(42, 42, 42, 0.65) 100%
  );
  --glass-card-hover-background: rgba(255, 255, 255, 0.08);

  --stage-tint-registered: rgba(255, 82, 82, 0.08);
  --stage-tint-tested: rgba(255, 82, 82, 0.04);
  --stage-tint-hardened: rgba(255, 255, 255, 0.03);
  --stage-tint-trusted: rgba(74, 144, 226, 0.04);
  --stage-tint-adapted: rgba(74, 144, 226, 0.08);
}