:root {
  --color-red-50: #ffebea;
  --color-red-100: #ffc2bf;
  --color-red-200: #ffa5a0;
  --color-red-300: #ff7c74;
  --color-red-400: #ff6259;
  --color-red-500: #ff3b30;
  --color-red-600: #e8362c;
  --color-red-700: #b52a22;
  --color-red-800: #8c201a;
  --color-red-900: #6b1914;
  --dtxmainColor: #012141;
  --dtxmainColor2: #ffffff;
  --bg-color: #ffffff;
  --dtxmainColor4: #00a3ff;
  --dtxmainColor5: #012141;
  --dtxmainColor6: #000000;
  --dtxmainColor7: #4a4a4a;
  --dtxmainColor8: #00a3ff;
  --dtxmainColor9: #012141;
  --dtxmainColor10: #000000;
  --dtxmainColor11: #4a4a4a;
  --dtxmainColor12: #007aff;
  --color-primary: #007aff;
  --color-success: #27ae60;
  --color-waring: #e6a23c;
  --color-danger: #ff6259;
  --color-info: #909399;
  --dtxmainRadius: 10px;
  --bg-color-overlay: #fafcff;
  --text-color: #303133;
  --Button-foreground: #ffffff;
  --Button-normal: #3395ff;
  --Button-hover: #00438c;
  --Button-green: #5dd27a;
  --Foundation-Red-red-500: #e8362c;
  --Foundation-Green-green-500: #34c759;
  --Button-blue: #3395ff;
  --Container-padding-large: 20px;
  --Brand-Color: #ffd522;
  --Button-vertical-padding: 8px;
  --Button-vertical-padding-4: 4px;
  --Button-vertical-padding-6: 6px;
  --Button-vertical-padding-8: 8px;
  --Button-vertical-padding-10: 10px;
  --Button-vertical-padding-16: 16px;
  --Button-horizontal-padding: 16px;
  --Container-corner-radius: 10px;
  --Container-padding: 10px;
  --Button-corner-radius: 8px;
  --Brand-primary: #FFB800;
  --Brand-success-accent: #FFA100;
  --Foreground-primary: #000000;
  --Foreground-secondary: rgba(0, 0, 0, 0.7);
  --Foreground-tertiary: rgba(0, 0, 0, 0.35);
  --Container-background: #F3F3F7;
  --Container-background-secondary: rgba(243, 243, 247, 0.7);
  --Container-background-tertiary: rgba(28, 28, 32, 0.1);
  --Container-border-divider: #E1E1E6;
  --Background-primary: #FFFFFF;
  --Background-secondary: rgba(255, 255, 255, 0.1);
  --Background-tertiary: rgba(0, 0, 0, 0.05);
  --Button-foreground-white: #FFFFFF;
  --Button-white: #FFFFFF;
  --Button-black: #000000;
  --Button-normal: #007AFF;
  --Button-hover: #00336B;
  --Button-inactive: rgba(255, 255, 255, 0.2);
  --Button-red: #E8362C;
  --Button-yellow: #FFCC00;
  --Button-orange: #FF9500;
  --Button-green: #34C759;
  --Button-mint: #00C7BE;
  --Button-teal: #30B0C7;
  --Button-cyan: #32ADE6;
  --Button-blue: #007AFF;
  --Button-indigo: #5856D6;
  --Button-purple: #AF52DE;
  --Primitive-red-50: #FFEBEA;
  --Primitive-red-100: #FFC2BF;
  --Primitive-red-200: #FFA5A0;
  --Primitive-red-300: #FF7C74;
  --Primitive-red-400: #FF6259;
  --Primitive-red-500: #FF3B30;
  --Primitive-red-600: #E8362C;
  --Primitive-red-700: #B52A22;
  --Primitive-red-800: #8C201A;
  --Primitive-red-900: #6B1914;
  --Primitive-orange-50: #FFF4E6;
  --Primitive-orange-100: #FFDEB0;
  --Primitive-orange-200: #FFCE8A;
  --Primitive-orange-300: #FFB854;
  --Primitive-orange-400: #FFAA33;
  --Primitive-orange-500: #FF9500;
  --Primitive-orange-600: #E88800;
  --Primitive-orange-700: #B56A00;
  --Primitive-orange-800: #8C5200;
  --Primitive-orange-900: #6B3F00;
  --Primitive-black: #000000;
  --Primitive-black-a10: rgba(0, 0, 0, 0.1);
  --Primitive-black-a20: rgba(0, 0, 0, 0.2);
  --Primitive-black-a30: rgba(0, 0, 0, 0.3);
  --Primitive-black-a40: rgba(0, 0, 0, 0.4);
  --Primitive-black-a50: rgba(0, 0, 0, 0.5);
  --Primitive-black-a60: rgba(0, 0, 0, 0.6);
  --Primitive-black-a70: rgba(0, 0, 0, 0.7);
  --Primitive-black-a80: rgba(0, 0, 0, 0.8);
  --Primitive-black-a90: rgba(0, 0, 0, 0.9);
  --Primitive-white: #FFFFFF;
  --Primitive-white-a10: rgba(255, 255, 255, 0.1);
  --Primitive-white-a20: rgba(255, 255, 255, 0.2);
  --Primitive-white-a30: rgba(255, 255, 255, 0.3);
  --Primitive-white-a40: rgba(255, 255, 255, 0.4);
  --Primitive-white-a50: rgba(255, 255, 255, 0.5);
  --Primitive-white-a60: rgba(255, 255, 255, 0.6);
  --Primitive-white-a70: rgba(255, 255, 255, 0.7);
  --Primitive-white-a80: rgba(255, 255, 255, 0.8);
  --Primitive-white-a90: rgba(255, 255, 255, 0.9);
  --theme-color: #07294E;
  --font: Inter;
  --small: 12px;
  --caption: 13px;
  --footnote: 14px;
  --body: 16px;
  --body-large: 18px;
  --headline: 20px;
  --heading-5: 24px;
  --heading-4: 30px;
  --heading-3: 40px;
  --heading-2: 50px;
  --heading-1: 60px;
  --gap-xs: 4px;
  --gap-sm: 8px;
  --gap-sm-plus: 10px;
  --gap-md: 16px;
  --gap-md-plus: 20px;
  --gap-lg: 24px;
  --gap-lg-plus: 32px;
  --gap-xl: 56px;
  --gap-xl-plus: 64px;
  --gap-xxl: 80px;
  --gap-xxl-plus: 96px;
  --padding-xs: 4px;
  --padding-sm: 8px;
  --padding-sm-plus: 12px;
  --padding-md: 16px;
  --padding-md-plus: 20px;
  --padding-lg: 24px;
  --padding-lg-plus: 32px;
  --padding-xl: 56px;
  --padding-xl-plus: 64px;
  --border-radius-sm: 4px;
  --border-radius-md: 8px;
  --border-radius-lg: 12px;
  --border-radius-xl: 20px;
  --Spacing-2: 2px;
  --Spacing-4: 4px;
  --Spacing-6: 6px;
  --Spacing-8: 8px;
  --Spacing-9: 9px;
  --Spacing-10: 10px;
  --Spacing-12: 12px;
  --Spacing-14: 14px;
  --Spacing-16: 16px;
  --Spacing-17: 17px;
  --Spacing-18: 18px;
  --Spacing-20: 20px;
  --Spacing-22: 22px;
  --Spacing-23: 23px;
  --Spacing-24: 24px;
  --Spacing-25: 25px;
  --Spacing-30: 30px;
  --Spacing-32: 32px;
  --Spacing-40: 40px;
  --Spacing-44: 44px;
  --Spacing-45: 45px;
  --Spacing-46: 46px;
  --Spacing-50: 50px;
  --Spacing-54: 54px;
  --Spacing-56: 56px;
  --Spacing-60: 60px;
  --Spacing-80: 80px;
  --Spacing-96: 96px;
  --Spacing-108: 108px;
  --Spacing-112: 112px;
  --Spacing-128: 128px;
  --Spacing-160: 160px;
}
/* 针对手机端调整 */
body[mode="dark"] {
  /* 全局主题颜色 */
  --Brand-primary: #FFB800;
  --Brand-success-accent: #FFA100;
  --Foreground-primary: #FFFFFF;
  --Foreground-secondary: rgba(255, 255, 255, 0.7);
  --Foreground-tertiary: rgba(255, 255, 255, 0.35);
  --Container-background: #1C1C20;
  --Container-background-secondary: rgba(28, 28, 32, 0.7);
  --Container-background-tertiary: rgba(243, 243, 247, 0.1);
  --Container-border-divider: #2C2C31;
  --Background-primary: #0F0F11;
  --Background-secondary: rgba(0, 0, 0, 0.1);
  --Background-tertiary: rgba(255, 255, 255, 0.1);
  --Button-foreground-white: #000000;
  --Button-white: #FFFFFF;
  --Button-black: #000000;
  --Button-normal: #3395FF;
  --Button-hover: #00438C;
  --Button-inactive: rgba(255, 255, 255, 0.2);
  --Button-red: #FF3B30;
  --Button-yellow: #FFD633;
  --Button-orange: #FFAA33;
  --Button-green: #5DD27A;
  --Button-mint: #33D2CB;
  --Button-teal: #59C0D2;
  --Button-cyan: #5BBDEB;
  --Button-blue: #3395FF;
  --Button-indigo: #7978DE;
  --Button-purple: #BF75E5;
  --Primitive-red-50: #FFEBEA;
  --Primitive-red-100: #FFC2BF;
  --Primitive-red-200: #FFA5A0;
  --Primitive-red-300: #FF7C74;
  --Primitive-red-400: #FF6259;
  --Primitive-red-500: #FF3B30;
  --Primitive-red-600: #E8362C;
  --Primitive-red-700: #B52A22;
  --Primitive-red-800: #8C201A;
  --Primitive-red-900: #6B1914;
  --Primitive-orange-50: #FFF4E6;
  --Primitive-orange-100: #FFDEB0;
  --Primitive-orange-200: #FFCE8A;
  --Primitive-orange-300: #FFB854;
  --Primitive-orange-400: #FFAA33;
  --Primitive-orange-500: #FF9500;
  --Primitive-orange-600: #E88800;
  --Primitive-orange-700: #B56A00;
  --Primitive-orange-800: #8C5200;
  --Primitive-orange-900: #6B3F00;
  --Primitive-black: #000000;
  --Primitive-black-a10: rgba(0, 0, 0, 0.1);
  --Primitive-black-a20: rgba(0, 0, 0, 0.2);
  --Primitive-black-a30: rgba(0, 0, 0, 0.3);
  --Primitive-black-a40: rgba(0, 0, 0, 0.4);
  --Primitive-black-a50: rgba(0, 0, 0, 0.5);
  --Primitive-black-a60: rgba(0, 0, 0, 0.6);
  --Primitive-black-a70: rgba(0, 0, 0, 0.7);
  --Primitive-black-a80: rgba(0, 0, 0, 0.8);
  --Primitive-black-a90: rgba(0, 0, 0, 0.9);
  --Primitive-white: #FFFFFF;
  --Primitive-white-a10: rgba(255, 255, 255, 0.1);
  --Primitive-white-a20: rgba(255, 255, 255, 0.2);
  --Primitive-white-a30: rgba(255, 255, 255, 0.3);
  --Primitive-white-a40: rgba(255, 255, 255, 0.4);
  --Primitive-white-a50: rgba(255, 255, 255, 0.5);
  --Primitive-white-a60: rgba(255, 255, 255, 0.6);
  --Primitive-white-a70: rgba(255, 255, 255, 0.7);
  --Primitive-white-a80: rgba(255, 255, 255, 0.8);
  --Primitive-white-a90: rgba(255, 255, 255, 0.9);
}
body[mode="light"] {
  /* 全局主题颜色 */
  --Foreground-primary: #000000;
  --Foreground-secondary: rgba(0, 0, 0, 0.7);
  --Foreground-tertiary: rgba(0, 0, 0, 0.5);
  --Background-primary: #ffffff;
  --Background-secondary: rgba(255, 255, 255, 0.1);
  --Background-tertiary: rgba(0, 0, 0, 0.05);
  --Background-blue: #f2f3fa;
  --Background-gray: #080808;
  --Container-background: rgba(255, 255, 255, 0.5);
  --Container-background-secondary: rgba(243, 243, 247, 0.7);
  --Container-background-tertiary: rgba(28, 28, 32, 0.1);
  --Container-background-recessed: rgba(255, 255, 255, 0.2);
  --Container-border: rgba(0, 0, 0, 0.07);
  --Container-border-secondary: rgba(0, 0, 0, 0.1);
  --Container-divider: rgba(0, 0, 0, 0.1);
  --Container-divider-secondary: rgba(0, 0, 0, 0.2);
  --Container-Notification: #f4f4f4;
  --Gradients-Blue-3: #2e335a;
  --text-color-regular: #606266;
  --Variables-Container-Divider: rgba(0, 0, 0, 0.1);
  --Variables-Container-Background: linear-gradient(136deg, rgba(255, 255, 255, 0.9) 0%, rgba(255, 255, 255, 0.9) 100%);
  --Variables-Container-Border: rgba(255, 255, 255, 0.5);
  --Button-red: #ff3b30;
  --Button-inactive: rgba(0, 0, 0, 0.2);
}