html,
body,
div,
h1,
h2,
h3,
h4,
h5,
h6,
p,
img,
dl,
dt,
dd,
ol,
ul,
li,
form,
table,
tr,
th,
td {
  margin: 0;
  padding: 0;
  border: 0;
}
h1,
h2,
h3,
h4,
h5,
h6 {
  font-weight: normal;
}
table {
  border-collapse: collapse;
  border-spacing: 0;
}
img {
  border: 0;
}
ol,
ul {
  list-style: none;
}
i,
b,
em,
strong {
  font-style: normal;
  text-decoration: none;
  font-weight: normal;
}
a,
img {
  -webkit-touch-callout: none;
  text-decoration: none;
}
html {
  -webkit-text-size-adjust: 100%;
  /* 防止页面resize之后，字体未重新渲染的bug */
}
* {
  box-sizing: border-box;
}
html {
  min-height: 100%;
}
body {
  min-height: 100vh;
}
html body {
  font-size: 3.58974vw;
  font-family: "App Text", "Microsoft YaHei", sans-serif;
  touch-action: manipulation;
  background-color: var(--color-background-primary-web) !important;
  color: var(--color-text-primary);
  font-weight: inherit;
  letter-spacing: normal;
}
:global(#root) {
  min-height: 100%;
  min-height: 100vh;
  display: flex;
  flex-direction: column;
  justify-content: space-between;
}
a {
  transition: all ease-in-out 0.3s;
}
/* 主题切换使用方法
  import helper from "@/utils/helper";导入公共方法
  onClick={helper.switchTheme}绑定给按钮

  在样式里使用var
  background:"var(--FC)",
*/
/* 新系统主题 */
/* 白天  */
.detail-button {
  color: var(--FC) !important;
  background-color: var(--TB) !important;
}
.detail-button:hover,
.detail-button:active,
.detail-button:focus {
  background-color: var(--TB) !important;
}
#root {
  color: var(--color-text-primary);
}
/* 深色主题变量 */
/*
 * 全局字体按字符自动匹配，不依赖页面语言或 data-lang 属性。
 * 同一段混排文字中，英文和数字使用 Inter，中文使用 PingFang SC，
 * 高棉文使用 Noto Sans Khmer；未覆盖的字符由系统字体兜底。
 * 新样式继承全局字体，通过 font-weight: 400 / 500 / 600 选择字重。
 * 以下变量兼容旧页面：Medium / Semibold 使用独立族名固定字体文件，
 * 保证仅设置 font-family 的旧组件仍能获得对应字重。
 */
:root {
  --Regular: "App Text", "Microsoft YaHei", sans-serif;
  --Medium: "App Text Medium", "Microsoft YaHei", sans-serif;
  --UMedium: var(--Medium);
  --Semibold: "App Text Semibold", "Microsoft YaHei", sans-serif;
}
/* 新ui的字体 */
@font-face {
  font-family: 'PingFang SC-Regular';
  src: url(https://static.ie.com/static/media/regular.c42f2cf1.ttf) format('truetype');
}
@font-face {
  font-family: 'PingFang SC-Medium';
  src: url(https://static.ie.com/static/media/medium.67ee533e.ttf) format('truetype');
}
@font-face {
  font-family: 'PingFang SC-Semibold';
  src: url(https://static.ie.com/static/media/semibold.a39de046.ttf) format('truetype');
}
/* 英文与数字字体 */
@font-face {
  font-family: 'Inter-SemiBold';
  src: url(https://static.ie.com/static/media/Inter-SemiBold.07a48beb.ttf) format('truetype');
}
@font-face {
  font-family: 'Inter-Medium';
  src: url(https://static.ie.com/static/media/Inter-Medium.ed533866.ttf) format('truetype');
}
@font-face {
  font-family: 'Inter-Regular';
  src: url(https://static.ie.com/static/media/Inter-Regular.079af0e2.ttf) format('truetype');
}
/* 现货行情页指定使用的 Urbanist Regular，避免改变全站既有字重 */
@font-face {
  font-family: 'Urbanist-Spot-Regular';
  src: url(https://static.ie.com/static/media/Urbanist-VariableFont_wght.bfeaaa72.ttf) format('truetype');
  font-weight: 400;
  font-style: normal;
}
/* 柬埔寨高棉语 */
@font-face {
  font-family: 'NotoSansKhmer-SemiBold';
  src: url(https://static.ie.com/static/media/NotoSansKhmer-SemiBold.ac779eb0.ttf) format('truetype');
}
@font-face {
  font-family: 'NotoSansKhmer-Medium';
  src: url(https://static.ie.com/static/media/NotoSansKhmer-Medium.a7397101.ttf) format('truetype');
}
@font-face {
  font-family: 'NotoSansKhmer-Regular';
  src: url(https://static.ie.com/static/media/NotoSansKhmer-Regular.4d79a3a4.ttf) format('truetype');
}
/* 其他字体 */
@font-face {
  font-family: 'DIN-Regular';
  src: url(https://static.ie.com/static/media/DIN-Regular.ecb27f89.otf) format('opentype');
}
@font-face {
  font-family: 'AdobeSongStd-Light';
  src: url(https://static.ie.com/static/media/AdobeSongStd-Light.a5066e32.otf) format('opentype');
}
/* 等级页按 Figma 使用 Inter Regular，独立命名避免改变全站字体 */
@font-face {
  font-family: 'Inter-Grade';
  src: url(https://static.ie.com/static/media/Inter-Variable.bff0f6e3.ttf) format('truetype');
  font-weight: 100 900;
  font-style: normal;
  font-display: swap;
}
:root {
  --NAVH: 18.97436vw;
}
/*
 * unicode-range 控制每个字体文件负责的字符，浏览器按实际文本按需加载。
 * Inter：拉丁字符、数字、通用标点和货币符号，与交易页覆盖范围一致。
 * Noto Sans Khmer：高棉字符及高棉符号。
 * PingFang SC：汉字、中日韩标点、注音及全角字符。
 * App Text 使用标准字重匹配；独立的 Medium / Semibold 族用于旧变量兼容。
 * 上方保留的专用字体族仍供显式指定字体的业务页面使用。
 */
@font-face {
  font-family: "App Text";
  src: url(https://static.ie.com/static/media/Inter-Regular.079af0e2.ttf) format('truetype');
  font-weight: 400;
  font-style: normal;
  font-display: swap;
  unicode-range: U+0000-024F, U+2000-206F, U+20A0-20CF;
}
@font-face {
  font-family: "App Text";
  src: url(https://static.ie.com/static/media/Inter-Medium.ed533866.ttf) format('truetype');
  font-weight: 500;
  font-style: normal;
  font-display: swap;
  unicode-range: U+0000-024F, U+2000-206F, U+20A0-20CF;
}
@font-face {
  font-family: "App Text Medium";
  src: url(https://static.ie.com/static/media/Inter-Medium.ed533866.ttf) format('truetype');
  font-weight: 400;
  font-style: normal;
  font-display: swap;
  unicode-range: U+0000-024F, U+2000-206F, U+20A0-20CF;
}
@font-face {
  font-family: "App Text";
  src: url(https://static.ie.com/static/media/Inter-SemiBold.07a48beb.ttf) format('truetype');
  font-weight: 600;
  font-style: normal;
  font-display: swap;
  unicode-range: U+0000-024F, U+2000-206F, U+20A0-20CF;
}
@font-face {
  font-family: "App Text Semibold";
  src: url(https://static.ie.com/static/media/Inter-SemiBold.07a48beb.ttf) format('truetype');
  font-weight: 400;
  font-style: normal;
  font-display: swap;
  unicode-range: U+0000-024F, U+2000-206F, U+20A0-20CF;
}
@font-face {
  font-family: "App Text";
  src: url(https://static.ie.com/static/media/NotoSansKhmer-Regular.4d79a3a4.ttf) format('truetype');
  font-weight: 400;
  font-style: normal;
  font-display: swap;
  unicode-range: U+1780-17FF, U+19E0-19FF;
}
@font-face {
  font-family: "App Text";
  src: url(https://static.ie.com/static/media/NotoSansKhmer-Medium.a7397101.ttf) format('truetype');
  font-weight: 500;
  font-style: normal;
  font-display: swap;
  unicode-range: U+1780-17FF, U+19E0-19FF;
}
@font-face {
  font-family: "App Text Medium";
  src: url(https://static.ie.com/static/media/NotoSansKhmer-Medium.a7397101.ttf) format('truetype');
  font-weight: 400;
  font-style: normal;
  font-display: swap;
  unicode-range: U+1780-17FF, U+19E0-19FF;
}
@font-face {
  font-family: "App Text";
  src: url(https://static.ie.com/static/media/NotoSansKhmer-SemiBold.ac779eb0.ttf) format('truetype');
  font-weight: 600;
  font-style: normal;
  font-display: swap;
  unicode-range: U+1780-17FF, U+19E0-19FF;
}
@font-face {
  font-family: "App Text Semibold";
  src: url(https://static.ie.com/static/media/NotoSansKhmer-SemiBold.ac779eb0.ttf) format('truetype');
  font-weight: 400;
  font-style: normal;
  font-display: swap;
  unicode-range: U+1780-17FF, U+19E0-19FF;
}
@font-face {
  font-family: "App Text";
  src: url(https://static.ie.com/static/media/regular.c42f2cf1.ttf) format('truetype');
  font-weight: 400;
  font-style: normal;
  font-display: swap;
  unicode-range: U+2E80-2FFF, U+3000-303F, U+3100-312F, U+31A0-31BF, U+31C0-31EF, U+3400-4DBF, U+4E00-9FFF, U+F900-FAFF, U+FE10-FE1F, U+FE30-FE4F, U+FF00-FFEF, U+20000-323AF;
}
@font-face {
  font-family: "App Text";
  src: url(https://static.ie.com/static/media/medium.67ee533e.ttf) format('truetype');
  font-weight: 500;
  font-style: normal;
  font-display: swap;
  unicode-range: U+2E80-2FFF, U+3000-303F, U+3100-312F, U+31A0-31BF, U+31C0-31EF, U+3400-4DBF, U+4E00-9FFF, U+F900-FAFF, U+FE10-FE1F, U+FE30-FE4F, U+FF00-FFEF, U+20000-323AF;
}
@font-face {
  font-family: "App Text Medium";
  src: url(https://static.ie.com/static/media/medium.67ee533e.ttf) format('truetype');
  font-weight: 400;
  font-style: normal;
  font-display: swap;
  unicode-range: U+2E80-2FFF, U+3000-303F, U+3100-312F, U+31A0-31BF, U+31C0-31EF, U+3400-4DBF, U+4E00-9FFF, U+F900-FAFF, U+FE10-FE1F, U+FE30-FE4F, U+FF00-FFEF, U+20000-323AF;
}
@font-face {
  font-family: "App Text";
  src: url(https://static.ie.com/static/media/semibold.a39de046.ttf) format('truetype');
  font-weight: 600;
  font-style: normal;
  font-display: swap;
  unicode-range: U+2E80-2FFF, U+3000-303F, U+3100-312F, U+31A0-31BF, U+31C0-31EF, U+3400-4DBF, U+4E00-9FFF, U+F900-FAFF, U+FE10-FE1F, U+FE30-FE4F, U+FF00-FFEF, U+20000-323AF;
}
@font-face {
  font-family: "App Text Semibold";
  src: url(https://static.ie.com/static/media/semibold.a39de046.ttf) format('truetype');
  font-weight: 400;
  font-style: normal;
  font-display: swap;
  unicode-range: U+2E80-2FFF, U+3000-303F, U+3100-312F, U+31A0-31BF, U+31C0-31EF, U+3400-4DBF, U+4E00-9FFF, U+F900-FAFF, U+FE10-FE1F, U+FE30-FE4F, U+FF00-FFEF, U+20000-323AF;
}
button,
input,
select,
textarea {
  font-family: inherit;
}

/* Generated by scripts/generate-theme-tokens.js. Do not edit directly.
 * Source: https://www.figma.com/design/0leAIASTAWegY1CkJVk27B
 * 281 Figma variables; aliases resolved per mode; snapshot 2026-11-02.
 */
:root {
  --font-language: "PingFang SC";
  --color-border-brand: #844ddf;
  --color-border-brand-emphasis: #844ddf;
  --color-border-card-line: #ededf2;
  --color-border-modal-linear-progress-bar: #ededf2;
  --color-border-primary: #ededf2;
  --color-border-secondary: #d1d5db;
  --color-border-subtle-20: rgba(1, 1, 13, 0.2);
  --color-border-subtle-40: rgba(255, 255, 255, 0.4);
  --color-border-subtle-8: rgba(105, 108, 131, 0.08);
  --color-border-yellow: #ebbb38;
  --color-background-active-panel: #ffffff;
  --color-background-banner-bg: #f7f7fa;
  --color-background-black: #000000;
  --color-background-brand: #844ddf;
  --color-background-brand-emphasis: #844ddf;
  --color-background-brand-subtle: #f4efff;
  --color-background-button-web: rgba(113, 50, 245, 0.12);
  --color-background-card: #ffffff;
  --color-background-card-bg-web: #ffffff;
  --color-background-chart-hover-web: rgba(255, 255, 255, 0.7);
  --color-background-chart-obstruction-web: #ffffff;
  --color-background-gray-bg-web: #f5f6f7;
  --color-background-guide: #ffffff;
  --color-background-inactive-panel: #ededf2;
  --color-background-modal: #ffffff;
  --color-background-modal-button: #ededf2;
  --color-background-modal-label: #f5f6f7;
  --color-background-modal-overlay-default: rgba(10, 6, 16, 0.6);
  --color-background-primary: #ffffff;
  --color-background-primary-web: #ffffff;
  --color-background-quaternary1: #f5f6f7;
  --color-background-quaternary2: #f7f7fa;
  --color-background-quaternary3: #f7f7fa;
  --color-background-quaternary4-web: rgba(100, 94, 108, 0.04);
  --color-background-red-subtle: #fee8eb;
  --color-background-secondary: #eceded;
  --color-background-section-1: rgba(255, 255, 255, 0.4);
  --color-background-section-2: #f7f5fa;
  --color-background-table-toolbar-web: #f7f5fa;
  --color-background-tertiary: #ededf2;
  --color-background-transfer: #fff9e6;
  --color-background-warning-bg: #fffbf1;
  --color-background-yellow-subtle: rgba(235, 187, 56, 0.1);
  --palette-blue-500: #648cdd;
  --blur-12: 3.07692vw;
  --blur-28: 7.17949vw;
  --blur-300: 76.92308vw;
  --blur-4: 1.02564vw;
  --blur-6: 1.53846vw;
  --blur-8: 2.05128vw;
  --palette-brand-1: #ab33eb;
  --palette-brand-10: #c648fe;
  --palette-brand-100: #e9dfff;
  --palette-brand-11: #ff00bf;
  --palette-brand-12: #9844ff;
  --palette-brand-13: #985cff;
  --palette-brand-14: #bf3bf0;
  --palette-brand-15: #f7f5fa;
  --palette-brand-16: rgba(119, 47, 255, 0.48);
  --palette-brand-17: #af85ff;
  --palette-brand-18: #f3eeff;
  --palette-brand-19: #f6f0ff;
  --palette-brand-2: #cb6dff;
  --palette-brand-20: #e178fe;
  --palette-brand-200: #d2bfff;
  --palette-brand-21: rgba(225, 120, 254, 0);
  --palette-brand-22: rgba(227, 198, 252, 0);
  --palette-brand-23: #090217;
  --palette-brand-24: rgba(132, 77, 223, 0.2);
  --palette-brand-25: #26c6da;
  --palette-brand-26: rgba(113, 50, 245, 0.12);
  --palette-brand-27: #e5b9ff;
  --palette-brand-28: #9930df;
  --palette-brand-29: #692cbb;
  --palette-brand-3: #bf44f7;
  --palette-brand-30: #9361d1;
  --palette-brand-300: #b899ff;
  --palette-brand-4: #b161f5;
  --palette-brand-400: #9d74ff;
  --palette-brand-5: #f1e9ff;
  --palette-brand-50: #f4efff;
  --palette-brand-500: #844ddf;
  --palette-brand-6: #f8edfb;
  --palette-brand-600: #5f23cc;
  --palette-brand-7: #f0e9ff;
  --palette-brand-700: #481aa1;
  --palette-brand-8: #ede4ff;
  --palette-brand-800: #321275;
  --palette-brand-9: #f8e3ff;
  --palette-brand-900: #1b0942;
  --color-c2c-aba-bank: #005b7a;
  --color-c2c-alceda-bank: #1b3351;
  --color-c2c-alipay: #1777ff;
  --color-c2c-bank-card: #844ddf;
  --color-c2c-khqr: #e1222e;
  --color-c2c-true-money: #ff8300;
  --color-c2c-upay: #00bd8d;
  --color-c2c-wechat-pay: #00c250;
  --color-c2c-wing-bank: #aacf39;
  --color-trade-down: #f6465d;
  --color-trade-down-subtle: rgba(246, 70, 93, 0.12);
  --color-fill-brand: #844ddf;
  --color-fill-brand-disabled: rgba(132, 77, 223, 0.2);
  --color-fill-brand-emphasis: #844ddf;
  --color-fill-focus: #e9dfff;
  --color-fill-glow: #e5b9ff;
  --color-fill-icon-bg: rgba(10, 6, 16, 0.2);
  --color-fill-inverse: #19141f;
  --color-fill-obstruction-1-0: rgba(255, 255, 255, 0);
  --color-fill-purple1: #c648fe;
  --color-fill-purple2: #f7f5fa;
  --color-fill-purple3: #9d74ff;
  --color-fill-red: #f6465d;
  --color-fill-red-disabled: rgba(246, 70, 93, 0.3);
  --color-fill-tabbar: rgba(255, 255, 255, 0.9);
  --color-fill-toast: #4d4a53;
  --color-fill-transparent: rgba(255, 255, 255, 0);
  --color-fill-yellow: #ebbb38;
  --font-cn: "PingFang SC";
  --color-gradient-bg-a1: rgba(119, 47, 255, 0.48);
  --color-gradient-bg-a2: #af85ff;
  --color-gradient-bg-b1: #f3eeff;
  --color-gradient-bg-b2: #f6f0ff;
  --color-gradient-bg-c1: #e178fe;
  --color-gradient-bg-c2: rgba(225, 120, 254, 0);
  --color-gradient-bg-c3: rgba(227, 198, 252, 0);
  --color-gradient-bg-d1: #692cbb;
  --color-gradient-bg-d2: #9361d1;
  --color-gradient-icon-a1: #844ddf;
  --color-gradient-icon-a2: #cb6dff;
  --color-gradient-icon-b1: #bf44f7;
  --color-gradient-icon-b2: #b161f5;
  --color-gradient-icon-c1: #f4efff;
  --color-gradient-icon-c2: #f1e9ff;
  --color-gradient-icon-c3: #f8edfb;
  --color-gradient-icon-d1: #f0e9ff;
  --color-gradient-icon-d2: #ede4ff;
  --color-gradient-icon-d3: #f8e3ff;
  --color-gradient-icon-e1: #844ddf;
  --color-gradient-icon-e2: #ff00bf;
  --color-gradient-icon-e3: #ff0000;
  --color-gradient-icon-f1: #9844ff;
  --color-gradient-icon-f2: #985cff;
  --color-gradient-icon-f3: #bf3bf0;
  --color-gradient-tab-a1: #ffba24;
  --color-gradient-tab-a2: #f7c62e;
  --palette-green-500: #00c080;
  --palette-green-subtle: rgba(0, 192, 128, 0.12);
  --color-chart-data-6: #9d74ff;
  --color-chart-data1: #ebbb38;
  --color-chart-data2: #481aa1;
  --color-chart-data3: #ff00bf;
  --color-chart-data4: #844ddf;
  --color-chart-data5: #26c6da;
  --palette-neutral-0: #ffffff;
  --palette-neutral-100: #ededf2;
  --palette-neutral-1000: #19141f;
  --palette-neutral-1000-0: #01010d;
  --palette-neutral-200: #eceded;
  --palette-neutral-30: #fafafc;
  --palette-neutral-300: #d1d5db;
  --palette-neutral-40: #f5f6f7;
  --palette-neutral-400: #9497a9;
  --palette-neutral-50: #f7f7fa;
  --palette-neutral-500: #696c83;
  --palette-neutral-600: #4b4c52;
  --palette-neutral-600-0: #6f7076;
  --palette-neutral-700: #4d4a53;
  --palette-neutral-800: #131313;
  --palette-neutral-900: #302c35;
  --palette-neutral-950: #252329;
  --palette-neutral-960: #1b1926;
  --palette-neutral-970: #19181c;
  --palette-neutral-black-000: #000000;
  --palette-neutral-black-20: rgba(1, 1, 13, 0.2);
  --palette-neutral-black-8: rgba(105, 108, 131, 0.08);
  --palette-neutral-disabled-black: rgba(10, 6, 16, 0.5);
  --palette-neutral-disabled-white: rgba(255, 255, 255, 0.5);
  --palette-neutral-guide: #282630;
  --palette-neutral-icon-bg: rgba(255, 255, 255, 0.06);
  --palette-neutral-icon-bg2: rgba(10, 6, 16, 0.2);
  --palette-neutral-modal: #1b191f;
  --palette-neutral-modal-overlay-bg: rgba(10, 6, 16, 0.6);
  --palette-neutral-neutral: #645e6c;
  --palette-neutral-neutral-4: rgba(100, 94, 108, 0.04);
  --palette-neutral-neutral-subtle: rgba(100, 94, 108, 0.12);
  --palette-neutral-obstruction: #10101b;
  --palette-neutral-obstruction-0: rgba(16, 16, 27, 0);
  --palette-neutral-search-bg: rgba(255, 255, 255, 0.08);
  --palette-neutral-tabbar0: rgba(255, 255, 255, 0.9);
  --palette-neutral-tabbar950: rgba(10, 6, 16, 0.9);
  --palette-neutral-transparent0: rgba(255, 255, 255, 0);
  --palette-neutral-transparent950: rgba(10, 6, 16, 0);
  --palette-neutral-white-12: rgba(255, 255, 255, 0.12);
  --palette-neutral-white-20: rgba(255, 255, 255, 0.2);
  --palette-neutral-white-4: rgba(255, 255, 255, 0.04);
  --palette-neutral-white-40: rgba(255, 255, 255, 0.4);
  --palette-neutral-white-70: rgba(255, 255, 255, 0.7);
  --palette-neutral-white-8: rgba(255, 255, 255, 0.08);
  --color-trade-no-change: #645e6c;
  --color-trade-no-change-subtle: rgba(100, 94, 108, 0.12);
  --color-notifications-adl: #e178fe;
  --color-notifications-failed-liq: #f6465d;
  --color-notifications-forced-liquidation: #cb6dff;
  --color-notifications-icon-bg: #ededf2;
  --color-notifications-in-progress: #ebbb38;
  --color-notifications-successful: #844ddf;
  --opacity-12: 0.12;
  --opacity-20: 0.2;
  --opacity-40: 0.4;
  --opacity-48: 0.48;
  --opacity-60: 0.6;
  --opacity-8: 0.08;
  --opacity-80: 0.8;
  --radius-12: 3.07692vw;
  --radius-2: 0.51282vw;
  --radius-20: 5.12821vw;
  --radius-4: 1.02564vw;
  --radius-6: 1.53846vw;
  --radius-8: 2.05128vw;
  --radius-full: 256.15385vw;
  --palette-red-1: #ff0000;
  --palette-red-100: #fee8eb;
  --palette-red-500: #f6465d;
  --palette-red-disabled: rgba(246, 70, 93, 0.3);
  --palette-red-subtle: rgba(246, 70, 93, 0.12);
  --color-status-green: #00c080;
  --color-status-red: #f6465d;
  --spacing-12: 3.07692vw;
  --spacing-16: 4.10256vw;
  --spacing-2: 0.51282vw;
  --spacing-20: 5.12821vw;
  --spacing-24: 6.15385vw;
  --spacing-32: 8.20513vw;
  --spacing-36: 9.23077vw;
  --spacing-4: 1.02564vw;
  --spacing-40: 10.25641vw;
  --spacing-48: 12.30769vw;
  --spacing-6: 1.53846vw;
  --spacing-64: 16.41026vw;
  --spacing-8: 2.05128vw;
  --stroke-width-1: 1px;
  --stroke-width-2: 0.51282vw;
  --stroke-width-half: 0.5px;
  --color-text-blue: #648cdd;
  --color-text-brand: #844ddf;
  --color-text-brand-emphasis: #844ddf;
  --color-text-disabled: #ffffff;
  --color-text-disabled-50: rgba(10, 6, 16, 0.5);
  --color-text-level: #decfa6;
  --color-text-on-brand: #ffffff;
  --color-text-on-yellow: #19141f;
  --color-text-primary: #19141f;
  --color-text-primary-2: #ffffff;
  --color-text-quaternary: #d1d5db;
  --color-text-quaternary-2: #9497a9;
  --color-text-red: #f6465d;
  --color-text-secondary: #696c83;
  --color-text-tertiary: #9497a9;
  --color-text-warning: #ebbb38;
  --color-text-yellow: #ebbb38;
  --color-text-yellow-2: #f7c62e;
  --color-trade-up: #00c080;
  --color-trade-up-subtle: rgba(0, 192, 128, 0.12);
  --color-vouchers-bc: #f5f0ff;
  --color-vouchers-bg: #fcfbfe;
  --color-vouchers-progress-bar-bg: #e3d6ff;
  --font-weight: 400;
  --palette-yellow-1: #ffba24;
  --palette-yellow-100: #fff9e6;
  --palette-yellow-2: #f7c62e;
  --palette-yellow-3: #decfa6;
  --palette-yellow-4: #332d22;
  --palette-yellow-500: #ebbb38;
  --palette-yellow-700: #d7b062;
  --palette-yellow-subtle: rgba(235, 187, 56, 0.1);
  --palette-yellow-warning-bg-d: rgba(235, 187, 56, 0.07);
  --palette-yellow-warning-bg-l: #fffbf1;
  --palette-yellow-warning-tg-d: #f2b50d;
  --palette-yellow-warning-tg-l: #f2b40b;
}

[data-theme="dark"],
[data-exchange-theme] {
  --color-border-brand: #844ddf;
  --color-border-brand-emphasis: #9d74ff;
  --color-border-card-line: rgba(255, 255, 255, 0.06);
  --color-border-modal-linear-progress-bar: #4d4a53;
  --color-border-primary: rgba(255, 255, 255, 0.12);
  --color-border-secondary: #4d4a53;
  --color-border-subtle-20: rgba(255, 255, 255, 0.2);
  --color-border-subtle-40: rgba(255, 255, 255, 0.4);
  --color-border-subtle-8: rgba(255, 255, 255, 0.08);
  --color-border-yellow: #d7b062;
  --color-background-active-panel: rgba(255, 255, 255, 0.06);
  --color-background-banner-bg: rgba(255, 255, 255, 0.04);
  --color-background-black: #000000;
  --color-background-brand: #844ddf;
  --color-background-brand-emphasis: #9d74ff;
  --color-background-brand-subtle: rgba(132, 77, 223, 0.2);
  --color-background-button-web: rgba(255, 255, 255, 0.08);
  --color-background-card: #1b1926;
  --color-background-card-bg-web: rgba(255, 255, 255, 0.06);
  --color-background-chart-hover-web: rgba(255, 255, 255, 0.04);
  --color-background-chart-obstruction-web: #10101b;
  --color-background-gray-bg-web: #01010d;
  --color-background-guide: #282630;
  --color-background-inactive-panel: rgba(100, 94, 108, 0.12);
  --color-background-modal: #1b191f;
  --color-background-modal-button: #252329;
  --color-background-modal-label: rgba(255, 255, 255, 0.06);
  --color-background-modal-overlay-default: rgba(10, 6, 16, 0.6);
  --color-background-primary: #19141f;
  --color-background-primary-web: #01010d;
  --color-background-quaternary1: #252329;
  --color-background-quaternary2: rgba(255, 255, 255, 0.08);
  --color-background-quaternary3: rgba(255, 255, 255, 0.06);
  --color-background-quaternary4-web: rgba(255, 255, 255, 0.04);
  --color-background-red-subtle: rgba(246, 70, 93, 0.12);
  --color-background-secondary: #131313;
  --color-background-section-1: rgba(10, 6, 16, 0);
  --color-background-section-2: #01010d;
  --color-background-table-toolbar-web: #1b1926;
  --color-background-tertiary: #302c35;
  --color-background-transfer: #332d22;
  --color-background-warning-bg: rgba(235, 187, 56, 0.07);
  --color-background-yellow-subtle: rgba(235, 187, 56, 0.1);
  --color-c2c-aba-bank: #005b7a;
  --color-c2c-alceda-bank: #1b3351;
  --color-c2c-alipay: #1777ff;
  --color-c2c-bank-card: #844ddf;
  --color-c2c-khqr: #e1222e;
  --color-c2c-true-money: #ff8300;
  --color-c2c-upay: #00bd8d;
  --color-c2c-wechat-pay: #00c250;
  --color-c2c-wing-bank: #aacf39;
  --color-fill-brand: #844ddf;
  --color-fill-brand-disabled: rgba(132, 77, 223, 0.2);
  --color-fill-brand-emphasis: #9d74ff;
  --color-fill-focus: #481aa1;
  --color-fill-glow: #9930df;
  --color-fill-icon-bg: rgba(255, 255, 255, 0.06);
  --color-fill-inverse: #ffffff;
  --color-fill-obstruction-1-0: rgba(16, 16, 27, 0);
  --color-fill-purple1: #c648fe;
  --color-fill-purple2: #090217;
  --color-fill-purple3: #9d74ff;
  --color-fill-red: #f6465d;
  --color-fill-red-disabled: rgba(246, 70, 93, 0.3);
  --color-fill-tabbar: rgba(10, 6, 16, 0.9);
  --color-fill-toast: #282630;
  --color-fill-transparent: rgba(10, 6, 16, 0);
  --color-fill-yellow: #d7b062;
  --color-gradient-bg-a1: rgba(119, 47, 255, 0.48);
  --color-gradient-bg-a2: #af85ff;
  --color-gradient-bg-b1: #f3eeff;
  --color-gradient-bg-b2: #f6f0ff;
  --color-gradient-bg-c1: #e178fe;
  --color-gradient-bg-c2: rgba(225, 120, 254, 0);
  --color-gradient-bg-c3: rgba(227, 198, 252, 0);
  --color-gradient-bg-d1: #692cbb;
  --color-gradient-bg-d2: #9361d1;
  --color-gradient-icon-a1: #844ddf;
  --color-gradient-icon-a2: #cb6dff;
  --color-gradient-icon-b1: #bf44f7;
  --color-gradient-icon-b2: #b161f5;
  --color-gradient-icon-c1: #f4efff;
  --color-gradient-icon-c2: #f1e9ff;
  --color-gradient-icon-c3: #f8edfb;
  --color-gradient-icon-d1: #f0e9ff;
  --color-gradient-icon-d2: #ede4ff;
  --color-gradient-icon-d3: #f8e3ff;
  --color-gradient-icon-e1: #844ddf;
  --color-gradient-icon-e2: #ff00bf;
  --color-gradient-icon-e3: #ff0000;
  --color-gradient-icon-f1: #9844ff;
  --color-gradient-icon-f2: #985cff;
  --color-gradient-icon-f3: #bf3bf0;
  --color-gradient-tab-a1: #ffba24;
  --color-gradient-tab-a2: #f7c62e;
  --color-chart-data-6: #9d74ff;
  --color-chart-data1: #d7b062;
  --color-chart-data2: #5f23cc;
  --color-chart-data3: #ff00bf;
  --color-chart-data4: #844ddf;
  --color-chart-data5: #26c6da;
  --color-notifications-adl: #e178fe;
  --color-notifications-failed-liq: #f6465d;
  --color-notifications-forced-liquidation: #cb6dff;
  --color-notifications-icon-bg: rgba(255, 255, 255, 0.06);
  --color-notifications-in-progress: #d7b062;
  --color-notifications-successful: #b899ff;
  --color-status-green: #00c080;
  --color-status-red: #f6465d;
  --color-text-blue: #648cdd;
  --color-text-brand: #844ddf;
  --color-text-brand-emphasis: #9d74ff;
  --color-text-disabled: rgba(255, 255, 255, 0.5);
  --color-text-disabled-50: rgba(255, 255, 255, 0.5);
  --color-text-level: #decfa6;
  --color-text-on-brand: #ffffff;
  --color-text-on-yellow: #19141f;
  --color-text-primary: #ffffff;
  --color-text-primary-2: #19141f;
  --color-text-quaternary: #4d4a53;
  --color-text-quaternary-2: #4d4a53;
  --color-text-red: #f6465d;
  --color-text-secondary: #9497a9;
  --color-text-tertiary: #6f7076;
  --color-text-warning: #d7b062;
  --color-text-yellow: #d7b062;
  --color-text-yellow-2: #d7b062;
  --color-vouchers-bc: #2e2442;
  --color-vouchers-bg: #221f29;
  --color-vouchers-progress-bar-bg: #2e2541;
}

[data-theme="light"],
html[data-theme="light"] [data-exchange-theme="inherit"],
[data-exchange-theme="light"] {
  --color-border-brand: #844ddf;
  --color-border-brand-emphasis: #844ddf;
  --color-border-card-line: #ededf2;
  --color-border-modal-linear-progress-bar: #ededf2;
  --color-border-primary: #ededf2;
  --color-border-secondary: #d1d5db;
  --color-border-subtle-20: rgba(1, 1, 13, 0.2);
  --color-border-subtle-40: rgba(255, 255, 255, 0.4);
  --color-border-subtle-8: rgba(105, 108, 131, 0.08);
  --color-border-yellow: #ebbb38;
  --color-background-active-panel: #ffffff;
  --color-background-banner-bg: #f7f7fa;
  --color-background-black: #000000;
  --color-background-brand: #844ddf;
  --color-background-brand-emphasis: #844ddf;
  --color-background-brand-subtle: #f4efff;
  --color-background-button-web: rgba(113, 50, 245, 0.12);
  --color-background-card: #ffffff;
  --color-background-card-bg-web: #ffffff;
  --color-background-chart-hover-web: rgba(255, 255, 255, 0.7);
  --color-background-chart-obstruction-web: #ffffff;
  --color-background-gray-bg-web: #f5f6f7;
  --color-background-guide: #ffffff;
  --color-background-inactive-panel: #ededf2;
  --color-background-modal: #ffffff;
  --color-background-modal-button: #ededf2;
  --color-background-modal-label: #f5f6f7;
  --color-background-modal-overlay-default: rgba(10, 6, 16, 0.6);
  --color-background-primary: #ffffff;
  --color-background-primary-web: #ffffff;
  --color-background-quaternary1: #f5f6f7;
  --color-background-quaternary2: #f7f7fa;
  --color-background-quaternary3: #f7f7fa;
  --color-background-quaternary4-web: rgba(100, 94, 108, 0.04);
  --color-background-red-subtle: #fee8eb;
  --color-background-secondary: #eceded;
  --color-background-section-1: rgba(255, 255, 255, 0.4);
  --color-background-section-2: #f7f5fa;
  --color-background-table-toolbar-web: #f7f5fa;
  --color-background-tertiary: #ededf2;
  --color-background-transfer: #fff9e6;
  --color-background-warning-bg: #fffbf1;
  --color-background-yellow-subtle: rgba(235, 187, 56, 0.1);
  --color-c2c-aba-bank: #005b7a;
  --color-c2c-alceda-bank: #1b3351;
  --color-c2c-alipay: #1777ff;
  --color-c2c-bank-card: #844ddf;
  --color-c2c-khqr: #e1222e;
  --color-c2c-true-money: #ff8300;
  --color-c2c-upay: #00bd8d;
  --color-c2c-wechat-pay: #00c250;
  --color-c2c-wing-bank: #aacf39;
  --color-fill-brand: #844ddf;
  --color-fill-brand-disabled: rgba(132, 77, 223, 0.2);
  --color-fill-brand-emphasis: #844ddf;
  --color-fill-focus: #e9dfff;
  --color-fill-glow: #e5b9ff;
  --color-fill-icon-bg: rgba(10, 6, 16, 0.2);
  --color-fill-inverse: #19141f;
  --color-fill-obstruction-1-0: rgba(255, 255, 255, 0);
  --color-fill-purple1: #c648fe;
  --color-fill-purple2: #f7f5fa;
  --color-fill-purple3: #9d74ff;
  --color-fill-red: #f6465d;
  --color-fill-red-disabled: rgba(246, 70, 93, 0.3);
  --color-fill-tabbar: rgba(255, 255, 255, 0.9);
  --color-fill-toast: #4d4a53;
  --color-fill-transparent: rgba(255, 255, 255, 0);
  --color-fill-yellow: #ebbb38;
  --color-gradient-bg-a1: rgba(119, 47, 255, 0.48);
  --color-gradient-bg-a2: #af85ff;
  --color-gradient-bg-b1: #f3eeff;
  --color-gradient-bg-b2: #f6f0ff;
  --color-gradient-bg-c1: #e178fe;
  --color-gradient-bg-c2: rgba(225, 120, 254, 0);
  --color-gradient-bg-c3: rgba(227, 198, 252, 0);
  --color-gradient-bg-d1: #692cbb;
  --color-gradient-bg-d2: #9361d1;
  --color-gradient-icon-a1: #844ddf;
  --color-gradient-icon-a2: #cb6dff;
  --color-gradient-icon-b1: #bf44f7;
  --color-gradient-icon-b2: #b161f5;
  --color-gradient-icon-c1: #f4efff;
  --color-gradient-icon-c2: #f1e9ff;
  --color-gradient-icon-c3: #f8edfb;
  --color-gradient-icon-d1: #f0e9ff;
  --color-gradient-icon-d2: #ede4ff;
  --color-gradient-icon-d3: #f8e3ff;
  --color-gradient-icon-e1: #844ddf;
  --color-gradient-icon-e2: #ff00bf;
  --color-gradient-icon-e3: #ff0000;
  --color-gradient-icon-f1: #9844ff;
  --color-gradient-icon-f2: #985cff;
  --color-gradient-icon-f3: #bf3bf0;
  --color-gradient-tab-a1: #ffba24;
  --color-gradient-tab-a2: #f7c62e;
  --color-chart-data-6: #9d74ff;
  --color-chart-data1: #ebbb38;
  --color-chart-data2: #481aa1;
  --color-chart-data3: #ff00bf;
  --color-chart-data4: #844ddf;
  --color-chart-data5: #26c6da;
  --color-notifications-adl: #e178fe;
  --color-notifications-failed-liq: #f6465d;
  --color-notifications-forced-liquidation: #cb6dff;
  --color-notifications-icon-bg: #ededf2;
  --color-notifications-in-progress: #ebbb38;
  --color-notifications-successful: #844ddf;
  --color-status-green: #00c080;
  --color-status-red: #f6465d;
  --color-text-blue: #648cdd;
  --color-text-brand: #844ddf;
  --color-text-brand-emphasis: #844ddf;
  --color-text-disabled: #ffffff;
  --color-text-disabled-50: rgba(10, 6, 16, 0.5);
  --color-text-level: #decfa6;
  --color-text-on-brand: #ffffff;
  --color-text-on-yellow: #19141f;
  --color-text-primary: #19141f;
  --color-text-primary-2: #ffffff;
  --color-text-quaternary: #d1d5db;
  --color-text-quaternary-2: #9497a9;
  --color-text-red: #f6465d;
  --color-text-secondary: #696c83;
  --color-text-tertiary: #9497a9;
  --color-text-warning: #ebbb38;
  --color-text-yellow: #ebbb38;
  --color-text-yellow-2: #f7c62e;
  --color-vouchers-bc: #f5f0ff;
  --color-vouchers-bg: #fcfbfe;
  --color-vouchers-progress-bar-bg: #e3d6ff;
}

[data-exchange-theme="dark"] {
  --color-border-brand: #844ddf;
  --color-border-brand-emphasis: #9d74ff;
  --color-border-card-line: rgba(255, 255, 255, 0.06);
  --color-border-modal-linear-progress-bar: #4d4a53;
  --color-border-primary: rgba(255, 255, 255, 0.12);
  --color-border-secondary: #4d4a53;
  --color-border-subtle-20: rgba(255, 255, 255, 0.2);
  --color-border-subtle-40: rgba(255, 255, 255, 0.4);
  --color-border-subtle-8: rgba(255, 255, 255, 0.08);
  --color-border-yellow: #d7b062;
  --color-background-active-panel: rgba(255, 255, 255, 0.06);
  --color-background-banner-bg: rgba(255, 255, 255, 0.04);
  --color-background-black: #000000;
  --color-background-brand: #844ddf;
  --color-background-brand-emphasis: #9d74ff;
  --color-background-brand-subtle: rgba(132, 77, 223, 0.2);
  --color-background-button-web: rgba(255, 255, 255, 0.08);
  --color-background-card: #1b1926;
  --color-background-card-bg-web: rgba(255, 255, 255, 0.06);
  --color-background-chart-hover-web: rgba(255, 255, 255, 0.04);
  --color-background-chart-obstruction-web: #10101b;
  --color-background-gray-bg-web: #01010d;
  --color-background-guide: #282630;
  --color-background-inactive-panel: rgba(100, 94, 108, 0.12);
  --color-background-modal: #1b191f;
  --color-background-modal-button: #252329;
  --color-background-modal-label: rgba(255, 255, 255, 0.06);
  --color-background-modal-overlay-default: rgba(10, 6, 16, 0.6);
  --color-background-primary: #19141f;
  --color-background-primary-web: #01010d;
  --color-background-quaternary1: #252329;
  --color-background-quaternary2: rgba(255, 255, 255, 0.08);
  --color-background-quaternary3: rgba(255, 255, 255, 0.06);
  --color-background-quaternary4-web: rgba(255, 255, 255, 0.04);
  --color-background-red-subtle: rgba(246, 70, 93, 0.12);
  --color-background-secondary: #131313;
  --color-background-section-1: rgba(10, 6, 16, 0);
  --color-background-section-2: #01010d;
  --color-background-table-toolbar-web: #1b1926;
  --color-background-tertiary: #302c35;
  --color-background-transfer: #332d22;
  --color-background-warning-bg: rgba(235, 187, 56, 0.07);
  --color-background-yellow-subtle: rgba(235, 187, 56, 0.1);
  --color-c2c-aba-bank: #005b7a;
  --color-c2c-alceda-bank: #1b3351;
  --color-c2c-alipay: #1777ff;
  --color-c2c-bank-card: #844ddf;
  --color-c2c-khqr: #e1222e;
  --color-c2c-true-money: #ff8300;
  --color-c2c-upay: #00bd8d;
  --color-c2c-wechat-pay: #00c250;
  --color-c2c-wing-bank: #aacf39;
  --color-fill-brand: #844ddf;
  --color-fill-brand-disabled: rgba(132, 77, 223, 0.2);
  --color-fill-brand-emphasis: #9d74ff;
  --color-fill-focus: #481aa1;
  --color-fill-glow: #9930df;
  --color-fill-icon-bg: rgba(255, 255, 255, 0.06);
  --color-fill-inverse: #ffffff;
  --color-fill-obstruction-1-0: rgba(16, 16, 27, 0);
  --color-fill-purple1: #c648fe;
  --color-fill-purple2: #090217;
  --color-fill-purple3: #9d74ff;
  --color-fill-red: #f6465d;
  --color-fill-red-disabled: rgba(246, 70, 93, 0.3);
  --color-fill-tabbar: rgba(10, 6, 16, 0.9);
  --color-fill-toast: #282630;
  --color-fill-transparent: rgba(10, 6, 16, 0);
  --color-fill-yellow: #d7b062;
  --color-gradient-bg-a1: rgba(119, 47, 255, 0.48);
  --color-gradient-bg-a2: #af85ff;
  --color-gradient-bg-b1: #f3eeff;
  --color-gradient-bg-b2: #f6f0ff;
  --color-gradient-bg-c1: #e178fe;
  --color-gradient-bg-c2: rgba(225, 120, 254, 0);
  --color-gradient-bg-c3: rgba(227, 198, 252, 0);
  --color-gradient-bg-d1: #692cbb;
  --color-gradient-bg-d2: #9361d1;
  --color-gradient-icon-a1: #844ddf;
  --color-gradient-icon-a2: #cb6dff;
  --color-gradient-icon-b1: #bf44f7;
  --color-gradient-icon-b2: #b161f5;
  --color-gradient-icon-c1: #f4efff;
  --color-gradient-icon-c2: #f1e9ff;
  --color-gradient-icon-c3: #f8edfb;
  --color-gradient-icon-d1: #f0e9ff;
  --color-gradient-icon-d2: #ede4ff;
  --color-gradient-icon-d3: #f8e3ff;
  --color-gradient-icon-e1: #844ddf;
  --color-gradient-icon-e2: #ff00bf;
  --color-gradient-icon-e3: #ff0000;
  --color-gradient-icon-f1: #9844ff;
  --color-gradient-icon-f2: #985cff;
  --color-gradient-icon-f3: #bf3bf0;
  --color-gradient-tab-a1: #ffba24;
  --color-gradient-tab-a2: #f7c62e;
  --color-chart-data-6: #9d74ff;
  --color-chart-data1: #d7b062;
  --color-chart-data2: #5f23cc;
  --color-chart-data3: #ff00bf;
  --color-chart-data4: #844ddf;
  --color-chart-data5: #26c6da;
  --color-notifications-adl: #e178fe;
  --color-notifications-failed-liq: #f6465d;
  --color-notifications-forced-liquidation: #cb6dff;
  --color-notifications-icon-bg: rgba(255, 255, 255, 0.06);
  --color-notifications-in-progress: #d7b062;
  --color-notifications-successful: #b899ff;
  --color-status-green: #00c080;
  --color-status-red: #f6465d;
  --color-text-blue: #648cdd;
  --color-text-brand: #844ddf;
  --color-text-brand-emphasis: #9d74ff;
  --color-text-disabled: rgba(255, 255, 255, 0.5);
  --color-text-disabled-50: rgba(255, 255, 255, 0.5);
  --color-text-level: #decfa6;
  --color-text-on-brand: #ffffff;
  --color-text-on-yellow: #19141f;
  --color-text-primary: #ffffff;
  --color-text-primary-2: #19141f;
  --color-text-quaternary: #4d4a53;
  --color-text-quaternary-2: #4d4a53;
  --color-text-red: #f6465d;
  --color-text-secondary: #9497a9;
  --color-text-tertiary: #6f7076;
  --color-text-warning: #d7b062;
  --color-text-yellow: #d7b062;
  --color-text-yellow-2: #d7b062;
  --color-vouchers-bc: #2e2442;
  --color-vouchers-bg: #221f29;
  --color-vouchers-progress-bar-bg: #2e2541;
}

[data-token-language="cn"] {
  --font-language: "PingFang SC";
}

[data-token-language="en"] {
  --font-language: "Inter";
}

[data-token-language="km"] {
  --font-language: "Noto Sans Khmer";
}

[data-token-weight="regular"] {
  --font-weight: 400;
}

[data-token-weight="medium"] {
  --font-weight: 500;
}

[data-token-weight="semibold"] {
  --font-weight: 600;
}

[data-token-trade="standard"] {
  --color-trade-down: #f6465d;
  --color-trade-down-subtle: rgba(246, 70, 93, 0.12);
  --color-trade-no-change: #645e6c;
  --color-trade-no-change-subtle: rgba(100, 94, 108, 0.12);
  --color-trade-up: #00c080;
  --color-trade-up-subtle: rgba(0, 192, 128, 0.12);
}

[data-token-trade="reverse"] {
  --color-trade-down: #00c080;
  --color-trade-down-subtle: rgba(0, 192, 128, 0.12);
  --color-trade-no-change: #645e6c;
  --color-trade-no-change-subtle: rgba(100, 94, 108, 0.12);
  --color-trade-up: #f6465d;
  --color-trade-up-subtle: rgba(246, 70, 93, 0.12);
}

[data-token-cn-font="pingfang"] {
  --font-cn: "PingFang SC";
}

[data-token-cn-font="source-han"] {
  --font-cn: "Source Han Sans SC";
}

[data-token-cn-font="harmonyos"] {
  --font-cn: "HarmonyOS Sans SC";
}

[data-token-cn-font="misans"] {
  --font-cn: "MiSans";
}

/* 主题切换动画效果 */

/* 全局主题切换过渡（时长由 global.css 统一维护） */
:root {
  --theme-transition-easing: cubic-bezier(0.4, 0, 0.2, 1);
}

/* 主题切换时的全局过渡 */
body {
  transition:
    background-color var(--theme-transition-duration) var(--theme-transition-easing),
    color var(--theme-transition-duration) var(--theme-transition-easing),
    border-color var(--theme-transition-duration) var(--theme-transition-easing);
}

/* 主题切换动画类 */
.theme-transitioning {
  position: relative;
}

/* 元素进入动画 */
.theme-element-enter {
  animation: elementEnter 0.4s var(--theme-transition-easing) forwards;
}

@keyframes elementEnter {
  0% {
    opacity: 0;
    transform: translateY(10px);
  }
  100% {
    opacity: 1;
    transform: translateY(0);
  }
}

/* 淡入淡出动画 */
.theme-fade-enter {
  opacity: 0;
  animation: fadeEnter var(--theme-transition-duration) var(--theme-transition-easing) forwards;
}

.theme-fade-exit {
  animation: fadeExit var(--theme-transition-duration) var(--theme-transition-easing) forwards;
}

@keyframes fadeEnter {
  0% {
    opacity: 0;
    transform: scale(0.95);
  }
  100% {
    opacity: 1;
    transform: scale(1);
  }
}

@keyframes fadeExit {
  0% {
    opacity: 1;
    transform: scale(1);
  }
  100% {
    opacity: 0;
    transform: scale(1.05);
  }
}

/* 主题切换按钮脉冲效果 */
.theme-switcher-pulse {
  position: relative;
}

.theme-switcher-pulse::after {
  content: '';
  position: absolute;
  top: -1.02564vw;
  left: -1.02564vw;
  right: -1.02564vw;
  bottom: -1.02564vw;
  border: 0.51282vw solid currentColor;
  border-radius: 50%;
  opacity: 0;
  animation: switcherPulse 1.5s ease-out infinite;
}

@keyframes switcherPulse {
  0% {
    opacity: 0.8;
    transform: scale(1);
  }
  100% {
    opacity: 0;
    transform: scale(1.3);
  }
}

/* 颜色过渡效果 */
.color-transition {
  transition:
    color var(--theme-transition-duration) var(--theme-transition-easing),
    background-color var(--theme-transition-duration) var(--theme-transition-easing),
    border-color var(--theme-transition-duration) var(--theme-transition-easing),
    box-shadow var(--theme-transition-duration) var(--theme-transition-easing);
}

/* 背景过渡效果 */
.background-transition {
  transition:
    background-color var(--theme-transition-duration) var(--theme-transition-easing),
    background-image var(--theme-transition-duration) var(--theme-transition-easing);
}

/* 文字颜色过渡 */
.text-color-transition {
  transition: color var(--theme-transition-duration) var(--theme-transition-easing);
}

/* 边框颜色过渡 */
.border-color-transition {
  transition: border-color var(--theme-transition-duration) var(--theme-transition-easing);
}

/* 阴影过渡效果 */
.shadow-transition {
  transition: box-shadow var(--theme-transition-duration) var(--theme-transition-easing);
}

/* 主题切换时的加载动画 */
.theme-loading {
  position: fixed;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background: rgba(0, 0, 0, 0.1);
  display: flex;
  align-items: center;
  justify-content: center;
  z-index: 10000;
  opacity: 0;
  pointer-events: none;
  transition: opacity var(--theme-transition-duration) var(--theme-transition-easing);
}

.theme-loading.active {
  opacity: 1;
  pointer-events: all;
}

.theme-loading-spinner {
  width: 10.25641vw;
  height: 10.25641vw;
  border: 0.76923vw solid rgba(255, 255, 255, 0.3);
  border-top: 0.76923vw solid #ffffff;
  border-radius: 50%;
  animation: themeSpin 1s linear infinite;
}

@keyframes themeSpin {
  0% { transform: rotate(0deg); }
  100% { transform: rotate(360deg); }
}

/* 响应式动画 */
@media (prefers-reduced-motion: reduce) {
  :root {
    --theme-transition-duration: 0.1s;
  }

  *,
  *::before,
  *::after {
    animation-duration: 0.01ms !important;
    animation-iteration-count: 1 !important;
    transition-duration: 0.01ms !important;
  }
}

/* 组件级别的主题切换动画 */
.component-theme-transition {
  transition:
    color var(--theme-transition-duration) var(--theme-transition-easing),
    background-color var(--theme-transition-duration) var(--theme-transition-easing),
    border-color var(--theme-transition-duration) var(--theme-transition-easing),
    box-shadow var(--theme-transition-duration) var(--theme-transition-easing);
}

.component-theme-transition-exit {
  opacity: 0;
  transform: scale(0.9);
}

.component-theme-transition-enter {
  opacity: 1;
  transform: scale(1);
}

/* 高对比度模式支持 */
@media (prefers-contrast: high) {
  .theme-transitioning {
    outline: none;
  }
}

/* 移动设备优化 */
@media (max-width: 768px) {
  :root {
    --theme-transition-duration: 0.2s;
  }

  .theme-loading-spinner {
    width: 32px;
    height: 32px;
    border-width: 2px;
  }
}

/* Legacy names only. All theme colors resolve through theme-tokens.css.
 * Repeat aliases at mode boundaries so local tokens resolve in that scope. */
:root,
[data-theme],
[data-exchange-theme],
[data-token-trade] {
  --bg: var(--color-background-primary-web);
  --bg001: var(--color-background-quaternary1);
  --bg002: var(--color-background-card);
  --cardBg: var(--color-background-card);
  --bg003: var(--color-background-quaternary1);
  --bg004: var(--color-background-quaternary1);
  --bg005: var(--color-background-quaternary4-web);
  --bg006: var(--color-background-brand-subtle);
  --bg007: var(--color-background-quaternary1);
  --bg008: var(--color-background-quaternary1);
  --bg009: var(--color-background-quaternary1);
  --bg010: var(--color-background-quaternary1);
  --bg011: var(--color-background-quaternary4-web);
  --bgfff10: rgba(255, 255, 255, 0.1);
  --bg00010: rgba(0, 0, 0, 0.1);
  --btn-theme-bg: var(--color-background-quaternary1);
  --transfer-field-bg: var(--color-background-quaternary1);
  --transfer-account-bg: var(--color-background-quaternary1);
  --transfer-account-label: var(--color-text-secondary);
  --transfer-account-text: var(--color-text-primary);
  --transfer-account-arrow: var(--color-text-primary);
  --transfer-submit-bg: var(--color-background-brand);
  --transfer-disabled-bg: var(--color-fill-brand-disabled);
  --transfer-disabled-text: var(--color-text-on-brand);
  --bg2: var(--color-background-quaternary1);
  --bg3: var(--color-background-quaternary1);
  --bg4: var(--color-fill-transparent);
  --bg5: var(--color-background-quaternary1);
  --bg6: var(--color-background-quaternary1);
  --bg7: var(--color-background-quaternary1);
  --c001: var(--color-text-primary);
  --c002: var(--color-text-secondary);
  --c003: var(--color-text-tertiary);
  --c004: var(--color-text-primary);
  --c005: var(--color-text-primary);
  --c006: var(--color-text-primary);
  --c007: var(--color-text-primary);
  --b001: var(--color-border-primary);
  --b002: var(--color-border-secondary);
  --white: var(--color-text-on-brand);
  --blue: var(--color-text-brand);
  --purple: var(--color-text-brand);
  --green: var(--color-trade-up);
  --red: var(--color-trade-down);
  --red_bg: var(--color-trade-down-subtle);
  --green_bg: var(--color-trade-up-subtle);
  --yellow: var(--color-text-yellow);
  --light_blue: var(--color-text-blue);
  --fff100: rgba(255, 255, 255, 1);
  --fff95: rgba(255, 255, 255, 0.95);
  --fff90: rgba(255, 255, 255, 0.9);
  --fff85: rgba(255, 255, 255, 0.85);
  --fff80: rgba(255, 255, 255, 0.8);
  --fff75: rgba(255, 255, 255, 0.75);
  --fff70: rgba(255, 255, 255, 0.7);
  --fff60: rgba(255, 255, 255, 0.6);
  --fff50: rgba(255, 255, 255, 0.5);
  --fff45: rgba(255, 255, 255, 0.45);
  --fff40: rgba(255, 255, 255, 0.4);
  --fff35: rgba(255, 255, 255, 0.35);
  --fff30: rgba(255, 255, 255, 0.3);
  --fff25: rgba(255, 255, 255, 0.25);
  --fff20: rgba(255, 255, 255, 0.2);
  --fff15: rgba(255, 255, 255, 0.15);
  --fff10: rgba(255, 255, 255, 0.1);
  --fff05: rgba(255, 255, 255, 0.05);
  --input_bg: var(--color-background-quaternary1);
  --input_border: var(--color-border-secondary);
  --input_placeholder: var(--color-text-tertiary);
  --input_focus_border: var(--color-border-brand);
  --blue_hover: var(--color-fill-brand-disabled);
  --level-bg: var(--color-background-transfer);
  --level-text: var(--color-text-yellow);
  --FC: var(--color-text-brand);
  --FC1: var(--color-background-brand-subtle);
  --FC2: var(--color-text-yellow);
  --FC4: var(--color-background-brand-subtle);
  --FC-green: var(--color-trade-up);
  --FC-red: var(--color-trade-down);
  --FC-white: var(--color-text-on-brand);
  --FC-tips: var(--color-text-secondary);
  --FC-TCR: var(--color-text-primary-2);
  --TC1: var(--color-text-primary);
  --TC2: var(--color-text-primary);
  --TC3: var(--color-text-tertiary);
  --TC-rebel: var(--color-text-primary-2);
  --TC4: var(--color-text-secondary);
  --TC5: var(--color-text-secondary);
  --TC6: var(--color-text-tertiary);
  --TC7: var(--color-text-disabled-50);
  --APP-BG: var(--color-background-primary-web);
  --APP-line1: var(--color-border-primary);
  --APP-line2: var(--color-border-secondary);
  --IBG: var(--color-background-primary-web);
  --IBG-card: var(--color-background-card-bg-web);
  --IBG-line: var(--color-border-primary);
  --BG-yellow: var(--color-background-transfer);
  --BG-purple: var(--color-background-brand-subtle);
  --BG-red: var(--color-background-red-subtle);
  --BG-blue: var(--color-background-section-1);
  --BG-tag: var(--color-background-quaternary3);
  --BG-footer: var(--color-background-section-2);
  --PB: var(--color-background-modal);
  --BC: var(--color-background-quaternary1);
  --BC-OFF: var(--color-background-quaternary1);
  --IB: var(--color-background-quaternary1);
  --TB: var(--color-background-quaternary2);
  --DB: var(--color-border-secondary);
  --HBG: var(--color-background-quaternary4-web);
  --MBG: var(--color-background-modal-overlay-default);
  --SD: var(--color-background-quaternary2);
  --HL: var(--color-border-secondary);
  --VFC1: var(--color-chart-data2);
  --VFC2: var(--color-chart-data3);
  --gray-web-bg: var(--color-background-gray-bg-web);
  --TBG: var(--color-background-primary-web);
  --TBG-card: var(--color-background-card);
  --TBG-line: var(--color-border-primary);
  --TBG-line2: var(--color-border-secondary);
  --background-purple: var(--color-background-brand-subtle);
}

/* Global behavior and utility classes; theme values live in theme-tokens.css. */
:root {
  --theme-transition-duration: 0.2s;
  --transfer-switch-light-display: block;
  --transfer-switch-dark-display: none;
}
[data-theme="dark"] {
  --transfer-switch-light-display: none;
  --transfer-switch-dark-display: block;
}
/* ============================================
   全局过渡动画
   ============================================ */

/* 主题切换时的全局平滑过渡 */
/* * {
  transition-property: background-color, color, border-color, box-shadow, fill, stroke;
  transition-duration: var(--theme-transition-duration);
  transition-timing-function: var(--theme-transition-easing);
} */

/* 排除某些不需要过渡的元素 */
*:where(
  [data-no-transition],
  img,
  video,
  iframe,
  canvas,
  svg
) {
  transition: none !important;
}

/* 主题切换时的根元素过渡 */
:root {
  transition: background-color var(--theme-transition-duration) var(--theme-transition-easing);
}

body {
  background-color: var(--color-background-primary-web) !important;
  color: var(--color-text-primary);
  transition:
    background-color var(--theme-transition-duration) var(--theme-transition-easing),
    color var(--theme-transition-duration) var(--theme-transition-easing);
}

/* 主题切换中状态 */
.theme-transitioning {
  position: relative;
}

/* 无障碍性：减少动画 */
@media (prefers-reduced-motion: reduce) {
  :root {
    --theme-transition-duration: 0.01ms;
  }

  *,
  *::before,
  *::after {
    animation-duration: 0.01ms !important;
    animation-iteration-count: 1 !important;
    transition-duration: 0.01ms !important;
  }
}

/* 移动设备优化：缩短动画时间 */
@media (max-width: 768px) {
  :root {
    --theme-transition-duration: 0.2s;
  }
}

/* 高对比度模式支持 */
@media (prefers-contrast: high) {
  :root { --color-border-primary: currentColor; --color-border-secondary: currentColor; }
}

/* ============================================
   通用工具类
   ============================================ */

/* 背景色工具类 */
.bg-primary { background-color: var(--color-background-primary-web) !important; }
.bg-card { background-color: var(--color-background-card) !important; }
.bg-secondary { background-color: var(--color-background-card) !important; }

/* 文字颜色工具类 */
.text-primary { color: var(--color-text-primary) !important; }
.text-secondary { color: var(--color-text-secondary) !important; }
.text-muted { color: var(--color-text-tertiary) !important; }

/* 边框颜色工具类 */
.border-primary { border-color: var(--color-border-primary) !important; }
.border-secondary { border-color: var(--color-border-secondary) !important; }

/* 主题色工具类 */
.text-blue { color: var(--color-text-brand) !important; }
.text-purple { color: var(--color-text-brand) !important; }
.text-green { color: var(--color-trade-up) !important; }
.text-red { color: var(--color-trade-down) !important; }
.text-yellow { color: var(--color-text-yellow) !important; }

.bg-blue { background-color: var(--color-text-brand) !important; }
.bg-purple { background-color: var(--color-text-brand) !important; }
.bg-green { background-color: var(--color-trade-up) !important; }
.bg-red { background-color: var(--color-trade-down) !important; }
.bg-yellow { background-color: var(--color-text-yellow) !important; }

[data-theme-scope='new'] body {
  background-color: var(--color-background-primary-web);
}

/* 自动填充：去掉浅蓝底；无白底时跟 --TC1，hover/focus 白底时用黑字 */

 [data-theme-scope='new'] input:-webkit-autofill,
[data-theme-scope='new'] input:-internal-autofill-selected {
  -webkit-text-fill-color: var(--color-text-primary) !important;
  color: var(--color-text-primary) !important;
  caret-color: var(--color-text-primary);
  background-color:  transparent !important;
  background-image: none !important;
  -webkit-transition: background-color 99999s ease-in-out 0s;
  transition: background-color 99999s ease-in-out 0s;
  -webkit-appearance: none;
          appearance: none;
  box-shadow: 0 0 0 256.41026vw var(--color-background-quaternary1) inset !important;
}

[data-theme-scope='new'][data-theme='dark']  input:-webkit-autofill,
[data-theme-scope='new'][data-theme='dark'] input:-internal-autofill-selected {
  box-shadow: 0 0 0 256.41026vw var(--color-background-quaternary1) inset !important;
}

[data-theme-scope='new'] input:-webkit-autofill:hover,
[data-theme-scope='new'] input:-webkit-autofill:focus,
[data-theme-scope='new'] input:-webkit-autofill:active {
  -webkit-text-fill-color:  var(--color-text-primary) !important;
  color:  var(--color-text-primary) !important;
  caret-color:  var(--color-text-primary);
  -webkit-transition: background-color 5000s ease-in-out 0s;
  transition: background-color 5000s ease-in-out 0s;
  
} 


/* —— 藏滚动条（页面仍可滚动；非 module，避免哈希） —— */
html[data-theme-scope='new'],
html[data-theme-scope='new'] body,
html[data-theme-scope='new'] #root {
  min-width: 0;
  max-width: 100%;
  overflow-x: hidden;
  scrollbar-width: none;
  -ms-overflow-style: none;
}

html[data-theme-scope='new'] *,
html[data-theme-scope='new'] *::before,
html[data-theme-scope='new'] *::after {
  scrollbar-width: none !important;
  -ms-overflow-style: none !important;
}

html[data-theme-scope='new']::-webkit-scrollbar,
html[data-theme-scope='new']::-webkit-scrollbar-thumb,
html[data-theme-scope='new']::-webkit-scrollbar-track,
html[data-theme-scope='new'] *::-webkit-scrollbar,
html[data-theme-scope='new'] *::-webkit-scrollbar-thumb,
html[data-theme-scope='new'] *::-webkit-scrollbar-track {
  display: none !important;
  width: 0 !important;
  height: 0 !important;
  background: transparent !important;
}

html[data-theme-scope='new'] .g_layoutPage,
html[data-theme-scope='new'] .g_layoutBelowNav,
html[data-theme-scope='new'] .g_contentbox {
  max-width: 100%;
  overflow-x: hidden;
}

.upSlideBox .title {
  height: 13.8vw;
  display: flex;
  align-items: center;
  justify-content: space-between;
  font-size: 5.1vw;
  color: var(--TC1);
  font-family: var(--Medium);
  padding: 0 4.1vw;
}
.upSlideBox .title .close {
  width: 6.2vw;
  height: 6.2vw;
  cursor: pointer;
}
.upSlideBox .inputText {
  line-height: 5.1vw;
  font-size: 3.1vw;
  color: var(--TC2);
  padding: 0 4.1vw;
  margin-top: 2.1vw;
}
.upSlideBox .redText {
  line-height: 6vw;
  font-size: 2.8vw;
  color: var(--FC-red);
  padding: 0 4.1vw;
}
.upSlideBox .inputValue {
  margin: 1.5vw 4.1vw 0 4.1vw;
  width: 91.8vw;
  height: 11.3vw;
  padding: 0 3.1vw;
  font-size: 3.6vw;
  color: var(--TC1);
  background: var(--IB);
  border-radius: 2.1vw;
  border: none;
}
.upSlideBox .inputValue::-webkit-input-placeholder {
  color: var(--TC3);
}
.upSlideBox .inputValue:focus-visible,
.upSlideBox .inputValue:focus {
  /* 为支持的浏览器应用精细样式 */
  outline: 0.3vw solid var(--FC);
}
.upSlideBox .button {
  width: 91.8vw;
  margin: 5.1vw 4.1vw 4.1vw 4.1vw;
  height: 10.8vw;
  font-size: 3.6vw;
  border-radius: 2.1vw;
  background: var(--FC);
  color: var(--FC-white);
}
.text-ellipsis {
  white-space: nowrap;
  text-overflow: ellipsis;
  overflow: hidden;
}
.flex-center {
  line-height: 0;
  display: flex;
  align-items: center;
  justify-content: center;
}
.flex-tb-center {
  line-height: 0;
  display: flex;
  align-items: center;
}
.flex-center-lr {
  display: flex;
  align-items: center;
  justify-content: space-between;
}
.flex-lr {
  display: flex;
  justify-content: space-between;
}

@font-face {
  font-family: iconfontshble;
  src: url(https://static.ie.com/static/media/font.62759b1c.eot);
  src: url(https://static.ie.com/static/media/font.1b35b521.woff) format("woff"), url(https://static.ie.com/static/media/font.92acc682.ttf) format("truetype"), url(https://static.ie.com/static/media/font.ca5d4588.svg) format("svg");
}
.g-icon {
  display: inline-block;
  font-style: normal;
  vertical-align: baseline;
  text-align: center;
  text-transform: none;
  line-height: 1;
  text-rendering: optimizeLegibility;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
  font-size: 5.12821vw;
}
.g-icon:before {
  font-family: iconfontshble;
  display: block;
}
.g-icon-step-forward:before {
  content: "\E600";
}
.g-icon-step-backward:before {
  content: "\E601";
}
.g-icon-forward:before {
  content: "\E602";
}
.g-icon-backward:before {
  content: "\E603";
}
.g-icon-caret-right:before {
  content: "\E604";
}
.g-icon-caret-left:before {
  content: "\E605";
}
.g-icon-caret-down:before {
  content: "\E606";
}
.g-icon-caret-up:before {
  content: "\E607";
}
.g-icon-caret-circle-right:before,
.g-icon-circle-right:before,
.g-icon-right-circle:before {
  content: "\E608";
}
.g-icon-caret-circle-left:before,
.g-icon-circle-left:before,
.g-icon-left-circle:before {
  content: "\E609";
}
.g-icon-caret-circle-up:before,
.g-icon-circle-up:before,
.g-icon-up-circle:before {
  content: "\E60A";
}
.g-icon-caret-circle-down:before,
.g-icon-circle-down:before,
.g-icon-down-circle:before {
  content: "\E60B";
}
.g-icon-right-circle-o:before {
  content: "\E60C";
}
.g-icon-caret-circle-o-right:before,
.g-icon-circle-o-right:before {
  content: "\E60C";
}
.g-icon-left-circle-o:before {
  content: "\E60D";
}
.g-icon-caret-circle-o-left:before,
.g-icon-circle-o-left:before {
  content: "\E60D";
}
.g-icon-up-circle-o:before {
  content: "\E60E";
}
.g-icon-caret-circle-o-up:before,
.g-icon-circle-o-up:before {
  content: "\E60E";
}
.g-icon-down-circle-o:before {
  content: "\E60F";
}
.g-icon-caret-circle-o-down:before,
.g-icon-circle-o-down:before {
  content: "\E60F";
}
.g-icon-verticle-left:before {
  content: "\E610";
}
.g-icon-verticle-right:before {
  content: "\E611";
}
.g-icon-rollback:before {
  content: "\E612";
}
.g-icon-retweet:before {
  content: "\E613";
}
.g-icon-shrink:before {
  content: "\E614";
}
.g-icon-arrow-salt:before,
.g-icon-arrows-alt:before {
  content: "\E615";
}
.g-icon-reload:before {
  content: "\E616";
}
.g-icon-double-right:before {
  content: "\E617";
}
.g-icon-double-left:before {
  content: "\E618";
}
.g-icon-arrow-down:before {
  content: "\E619";
}
.g-icon-arrow-up:before {
  content: "\E61A";
}
.g-icon-arrow-right:before {
  content: "\E61B";
}
.g-icon-arrow-left:before {
  content: "\E61C";
}
.g-icon-down:before {
  content: "\E61D";
}
.g-icon-up:before {
  content: "\E61E";
}
.g-icon-right:before {
  content: "\E61F";
}
.g-icon-left:before {
  content: "\E620";
}
.g-icon-minus-square-o:before {
  content: "\E621";
}
.g-icon-minus-circle:before {
  content: "\E622";
}
.g-icon-minus-circle-o:before {
  content: "\E623";
}
.g-icon-minus:before {
  content: "\E624";
}
.g-icon-plus-circle-o:before {
  content: "\E625";
}
.g-icon-plus-circle:before {
  content: "\E626";
}
.g-icon-plus:before {
  content: "\E627";
}
.g-icon-info-circle:before {
  content: "\E628";
}
.g-icon-info-circle-o:before {
  content: "\E629";
}
.g-icon-info:before {
  content: "\E62A";
}
.g-icon-exclamation:before {
  content: "\E62B";
}
.g-icon-exclamation-circle:before {
  content: "\E62C";
}
.g-icon-exclamation-circle-o:before {
  content: "\E62D";
}
.g-icon-close-circle:before,
.g-icon-cross-circle:before {
  content: "\E62E";
}
.g-icon-close-circle-o:before,
.g-icon-cross-circle-o:before {
  content: "\E62F";
}
.g-icon-check-circle:before {
  content: "\E630";
}
.g-icon-check-circle-o:before {
  content: "\E631";
}
.g-icon-check:before {
  content: "\E632";
}
.g-icon-close:before,
.g-icon-cross:before {
  content: "\E633";
}
.g-icon-customer-service:before,
.g-icon-customerservice:before {
  content: "\E634";
}
.g-icon-credit-card:before {
  content: "\E635";
}
.g-icon-code-o:before {
  content: "\E636";
}
.g-icon-book:before {
  content: "\E637";
}
.g-icon-bars:before {
  content: "\E639";
}
.g-icon-question:before {
  content: "\E63A";
}
.g-icon-question-circle:before {
  content: "\E63B";
}
.g-icon-question-circle-o:before {
  content: "\E63C";
}
.g-icon-pause:before {
  content: "\E63D";
}
.g-icon-pause-circle:before {
  content: "\E63E";
}
.g-icon-pause-circle-o:before {
  content: "\E63F";
}
.g-icon-clock-circle:before {
  content: "\E640";
}
.g-icon-clock-circle-o:before {
  content: "\E641";
}
.g-icon-swap:before {
  content: "\E642";
}
.g-icon-swap-left:before {
  content: "\E643";
}
.g-icon-swap-right:before {
  content: "\E644";
}
.g-icon-plus-square-o:before {
  content: "\E645";
}
.g-icon-frown-circle:before,
.g-icon-frown:before {
  content: "\E646";
}
.g-icon-ellipsis:before {
  content: "\E647";
}
.g-icon-copy:before {
  content: "\E648";
}
.g-icon-menu-fold:before {
  content: "\E9AC";
}
.g-icon-mail:before {
  content: "\E659";
}
.g-icon-logout:before {
  content: "\E65A";
}
.g-icon-link:before {
  content: "\E65B";
}
.g-icon-area-chart:before {
  content: "\E65C";
}
.g-icon-line-chart:before {
  content: "\E65D";
}
.g-icon-home:before {
  content: "\E65E";
}
.g-icon-laptop:before {
  content: "\E65F";
}
.g-icon-star:before {
  content: "\E660";
}
.g-icon-star-o:before {
  content: "\E661";
}
.g-icon-folder:before {
  content: "\E662";
}
.g-icon-filter:before {
  content: "\E663";
}
.g-icon-file:before {
  content: "\E664";
}
.g-icon-exception:before {
  content: "\E665";
}
.g-icon-meh-circle:before,
.g-icon-meh:before {
  content: "\E666";
}
.g-icon-meh-o:before {
  content: "\E667";
}
.g-icon-shopping-cart:before {
  content: "\E668";
}
.g-icon-save:before {
  content: "\E669";
}
.g-icon-user:before {
  content: "\E66A";
}
.g-icon-video-camera:before {
  content: "\E66B";
}
.g-icon-to-top:before {
  content: "\E66C";
}
.g-icon-team:before {
  content: "\E66D";
}
.g-icon-tablet:before {
  content: "\E66E";
}
.g-icon-solution:before {
  content: "\E66F";
}
.g-icon-search:before {
  content: "\E670";
}
.g-icon-share-alt:before {
  content: "\E671";
}
.g-icon-setting:before {
  content: "\E672";
}
.g-icon-poweroff:before {
  content: "\E6D5";
}
.g-icon-picture:before {
  content: "\E674";
}
.g-icon-phone:before {
  content: "\E675";
}
.g-icon-paper-clip:before {
  content: "\E676";
}
.g-icon-notification:before {
  content: "\E677";
}
.g-icon-mobile:before {
  content: "\E678";
}
.g-icon-menu-unfold:before {
  content: "\E9AD";
}
.g-icon-inbox:before {
  content: "\E67A";
}
.g-icon-lock:before {
  content: "\E67B";
}
.g-icon-qrcode:before {
  content: "\E67C";
}
.g-icon-play-circle:before {
  content: "\E6D0";
}
.g-icon-play-circle-o:before {
  content: "\E6D1";
}
.g-icon-tag:before {
  content: "\E6D2";
}
.g-icon-tag-o:before {
  content: "\E6D3";
}
.g-icon-tags:before {
  content: "\E67D";
}
.g-icon-tags-o:before {
  content: "\E67E";
}
.g-icon-cloud-o:before {
  content: "\E67F";
}
.g-icon-cloud:before {
  content: "\E680";
}
.g-icon-cloud-upload:before {
  content: "\E681";
}
.g-icon-cloud-download:before {
  content: "\E682";
}
.g-icon-cloud-download-o:before {
  content: "\E683";
}
.g-icon-cloud-upload-o:before {
  content: "\E684";
}
.g-icon-environment:before {
  content: "\E685";
}
.g-icon-environment-o:before {
  content: "\E686";
}
.g-icon-eye:before {
  content: "\E687";
}
.g-icon-eye-o:before {
  content: "\E688";
}
.g-icon-camera:before {
  content: "\E689";
}
.g-icon-camera-o:before {
  content: "\E68A";
}
.g-icon-windows:before {
  content: "\E68B";
}
.g-icon-apple:before {
  content: "\E68C";
}
.g-icon-apple-o:before {
  content: "\E6D4";
}
.g-icon-android:before {
  content: "\E938";
}
.g-icon-android-o:before {
  content: "\E68D";
}
.g-icon-aliwangwang:before {
  content: "\E68E";
}
.g-icon-aliwangwang-o:before {
  content: "\E68F";
}
.g-icon-export:before {
  content: "\E691";
}
.g-icon-edit:before {
  content: "\E692";
}
.g-icon-circle-down-o:before {
  content: "\E693";
}
.g-icon-circle-down-:before {
  content: "\E694";
}
.g-icon-appstore-o:before {
  content: "\E695";
}
.g-icon-appstore:before {
  content: "\E696";
}
.g-icon-scan:before {
  content: "\E697";
}
.g-icon-file-text:before {
  content: "\E698";
}
.g-icon-folder-open:before {
  content: "\E699";
}
.g-icon-hdd:before {
  content: "\E69A";
}
.g-icon-ie:before {
  content: "\E69B";
}
.g-icon-file-jpg:before {
  content: "\E69C";
}
.g-icon-like:before {
  content: "\E64C";
}
.g-icon-like-o:before {
  content: "\E69D";
}
.g-icon-dislike:before {
  content: "\E64B";
}
.g-icon-dislike-o:before {
  content: "\E69E";
}
.g-icon-delete:before {
  content: "\E69F";
}
.g-icon-enter:before {
  content: "\E6A0";
}
.g-icon-pushpin-o:before {
  content: "\E6A1";
}
.g-icon-pushpin:before {
  content: "\E6A2";
}
.g-icon-heart:before {
  content: "\E6A3";
}
.g-icon-heart-o:before {
  content: "\E6A4";
}
.g-icon-pay-circle:before {
  content: "\E6A5";
}
.g-icon-pay-circle-o:before {
  content: "\E6A6";
}
.g-icon-smile-circle:before,
.g-icon-smile:before {
  content: "\E6A7";
}
.g-icon-smile-o:before {
  content: "\E6A8";
}
.g-icon-frown-o:before {
  content: "\E6A9";
}
.g-icon-calculator:before {
  content: "\E6AA";
}
.g-icon-message:before {
  content: "\E6AB";
}
.g-icon-chrome:before {
  content: "\E6AC";
}
.g-icon-github:before {
  content: "\E6AD";
}
.g-icon-file-unknown:before {
  content: "\E6AF";
}
.g-icon-file-excel:before {
  content: "\E6B0";
}
.g-icon-file-ppt:before {
  content: "\E6B1";
}
.g-icon-file-word:before {
  content: "\E6B2";
}
.g-icon-file-pdf:before {
  content: "\E6B3";
}
.g-icon-desktop:before {
  content: "\E6B4";
}
.g-icon-upload:before {
  content: "\E6B6";
}
.g-icon-download:before {
  content: "\E6B7";
}
.g-icon-pie-chart:before {
  content: "\E6B8";
}
.g-icon-unlock:before {
  content: "\E6BA";
}
.g-icon-calendar:before {
  content: "\E6BB";
}
.g-icon-windows-o:before {
  content: "\E6BC";
}
.g-icon-dot-chart:before {
  content: "\E6BD";
}
.g-icon-bar-chart:before {
  content: "\E6BE";
}
.g-icon-code:before {
  content: "\E6BF";
}
.g-icon-api:before {
  content: "\E951";
}
.g-icon-plus-square:before {
  content: "\E6C0";
}
.g-icon-minus-square:before {
  content: "\E6C1";
}
.g-icon-close-square:before {
  content: "\E6C2";
}
.g-icon-close-square-o:before {
  content: "\E6C3";
}
.g-icon-check-square:before {
  content: "\E6C4";
}
.g-icon-check-square-o:before {
  content: "\E6C5";
}
.g-icon-fast-backward:before {
  content: "\E6C6";
}
.g-icon-fast-forward:before {
  content: "\E6C7";
}
.g-icon-up-square:before {
  content: "\E6C8";
}
.g-icon-down-square:before {
  content: "\E6C9";
}
.g-icon-left-square:before {
  content: "\E6CA";
}
.g-icon-right-square:before {
  content: "\E6CB";
}
.g-icon-right-square-o:before {
  content: "\E6CC";
}
.g-icon-left-square-o:before {
  content: "\E6CD";
}
.g-icon-down-square-o:before {
  content: "\E6CE";
}
.g-icon-up-square-o:before {
  content: "\E6CF";
}
.g-icon-loading:before {
  content: "\E64D";
}
.g-icon-spin {
  animation: loading 1s infinite linear;
}
@keyframes loading {
  0% {
    transform: rotateZ(0deg);
  }
  100% {
    transform: rotateZ(360deg);
  }
}
.g-icon-loading-3-quarters:before {
  content: "\E6AE";
}
.g-icon-bulb:before {
  content: "\E649";
}
.g-icon-select:before {
  content: "\E64A";
}
.g-icon-addfile:before,
.g-icon-file-add:before {
  content: "\E910";
}
.g-icon-addfolder:before,
.g-icon-folder-add:before {
  content: "\E914";
}
.g-icon-switcher:before {
  content: "\E913";
}
.g-icon-rocket:before {
  content: "\E90F";
}
.g-icon-dingding:before {
  content: "\E923";
}
.g-icon-dingding-o:before {
  content: "\E925";
}
.g-icon-bell:before {
  content: "\E64E";
}
.g-icon-disconnect:before {
  content: "\E64F";
}
.g-icon-database:before {
  content: "\E650";
}
.g-icon-compass:before {
  content: "\E6DB";
}
.g-icon-barcode:before {
  content: "\E652";
}
.g-icon-hourglass:before {
  content: "\E653";
}
.g-icon-key:before {
  content: "\E654";
}
.g-icon-flag:before {
  content: "\E655";
}
.g-icon-layout:before {
  content: "\E656";
}
.g-icon-login:before {
  content: "\E657";
}
.g-icon-printer:before {
  content: "\E673";
}
.g-icon-sound:before {
  content: "\E6E9";
}
.g-icon-usb:before {
  content: "\E6D7";
}
.g-icon-skin:before {
  content: "\E6D8";
}
.g-icon-tool:before {
  content: "\E6D9";
}
.g-icon-sync:before {
  content: "\E6DA";
}
.g-icon-wifi:before {
  content: "\E6D6";
}
.g-icon-car:before {
  content: "\E6DC";
}
.g-icon-copyright:before {
  content: "\E6DE";
}
.g-icon-schedule:before {
  content: "\E6DF";
}
.g-icon-user-add:before {
  content: "\E6ED";
}
.g-icon-user-delete:before {
  content: "\E6E0";
}
.g-icon-usergroup-add:before {
  content: "\E6DD";
}
.g-icon-usergroup-delete:before {
  content: "\E6E1";
}
.g-icon-man:before {
  content: "\E6E2";
}
.g-icon-woman:before {
  content: "\E6EC";
}
.g-icon-shop:before {
  content: "\E6E3";
}
.g-icon-gift:before {
  content: "\E6E4";
}
.g-icon-idcard:before {
  content: "\E6E5";
}
.g-icon-medicine-box:before {
  content: "\E6E6";
}
.g-icon-red-envelope:before {
  content: "\E6E7";
}
.g-icon-coffee:before {
  content: "\E6E8";
}
.g-icon-trademark:before {
  content: "\E651";
}
.g-icon-safety:before {
  content: "\E6EA";
}
.g-icon-wallet:before {
  content: "\E6EB";
}
.g-icon-bank:before {
  content: "\E6EE";
}
.g-icon-trophy:before {
  content: "\E6EF";
}
.g-icon-contacts:before {
  content: "\E6F0";
}
.g-icon-global:before {
  content: "\E6F1";
}
.g-icon-shake:before {
  content: "\E94F";
}
.g-icon-fork:before {
  content: "\E6F2";
}
.g-icon-dashboard:before {
  content: "\E99A";
}
.g-icon-profile:before {
  content: "\E999";
}
.g-icon-table:before {
  content: "\E998";
}
.g-icon-warning:before {
  content: "\E997";
}
.g-icon-form:before {
  content: "\E996";
}
.g-icon-spin:before {
  display: inline-block;
  animation: loadingCircle 1s infinite linear;
}
.g-icon-weibo-square:before {
  content: "\E6F5";
}
.g-icon-weibo-circle:before {
  content: "\E6F4";
}
.g-icon-taobao-circle:before {
  content: "\E6F3";
}
.g-icon-html5:before {
  content: "\E9C7";
}
.g-icon-weibo:before {
  content: "\E9C6";
}
.g-icon-twitter:before {
  content: "\E9C5";
}
.g-icon-wechat:before {
  content: "\E9C4";
}
.g-icon-youtube:before {
  content: "\E9C3";
}
.g-icon-alipay-circle:before {
  content: "\E9C2";
}
.g-icon-taobao:before {
  content: "\E9C1";
}
.g-icon-skype:before {
  content: "\E9C0";
}
.g-icon-qq:before {
  content: "\E9BF";
}
.g-icon-medium-workmark:before {
  content: "\E9BE";
}
.g-icon-gitlab:before {
  content: "\E9BD";
}
.g-icon-medium:before {
  content: "\E9BC";
}
.g-icon-linkedin:before {
  content: "\E9BB";
}
.g-icon-google-plus:before {
  content: "\E9BA";
}
.g-icon-dropbox:before {
  content: "\E9B9";
}
.g-icon-facebook:before {
  content: "\E9B8";
}
.g-icon-codepen:before {
  content: "\E9B7";
}
.g-icon-amazon:before {
  content: "\E9B6";
}
.g-icon-google:before {
  content: "\E9B5";
}
.g-icon-codepen-circle:before {
  content: "\E9B4";
}
.g-icon-alipay:before {
  content: "\E9B3";
}
.g-icon-ant-design:before {
  content: "\E9B2";
}
.g-icon-aliyun:before {
  content: "\E9F4";
}
.g-icon-zhihu:before {
  content: "\E703";
}
.g-icon-file-markdown:before {
  content: "\E704";
}
.g-icon-slack:before {
  content: "\E705";
}
.g-icon-slack-square:before {
  content: "\E706";
}
.g-icon-behance:before {
  content: "\E707";
}
.g-icon-behance-square:before {
  content: "\E708";
}
.g-icon-dribbble:before {
  content: "\E709";
}
.g-icon-dribbble-square:before {
  content: "\E70A";
}
.g-icon-instagram:before {
  content: "\E70B";
}
.g-icon-yuque:before {
  content: "\E70C";
}

@font-face {
  font-family: "iconfont";
  /* project id 839010 */
  src: url(https://static.ie.com/static/media/iconfont.4326c8de.eot);
  src: url(https://static.ie.com/static/media/iconfont.4326c8de.eot) format("embedded-opentype"), url(https://static.ie.com/static/media/iconfont.e97c392b.woff) format("woff"), url(https://static.ie.com/static/media/iconfont.b0bd360d.ttf) format("truetype"), url(https://static.ie.com/static/media/iconfont.c9608660.svg) format("svg");
}
.b-icon {
  display: inline-block;
  font-family: "iconfont";
  speak: none;
  font-style: normal;
  font-weight: normal;
  font-feature-settings: normal;
  font-variant: normal;
  text-transform: none;
  text-rendering: auto;
  line-height: 1;
  font-size: 6.15385vw;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
  vertical-align: middle;
}
.b-icon span {
  font-family: "Roboto", "Helvetica", "Arial", sans-serif;
  line-height: 6.15385vw;
  padding: 0 1.28205vw;
}
.b-icon-googleplay:before {
  content: "\e688";
}
.b-icon-coingecko:before {
  content: "\e687";
}
.b-icon-feixiaohao:before {
  content: "\e684";
}
.b-icon-mytoken:before {
  content: "\e685";
}
.b-icon-coinmarketcap:before {
  content: "\e686";
}
.b-icon-delete1:before {
  content: "\e682";
}
.b-icon-save:before {
  content: "\e683";
}
.b-icon-levelunlimited:before {
  content: "\e681";
}
.b-icon-levelwithdraw:before {
  content: "\e67e";
}
.b-icon-levelcheck:before {
  content: "\e67f";
}
.b-icon-levellimited:before {
  content: "\e680";
}
.b-icon-triangle:before {
  content: "\e67c";
}
.b-icon-suspended1:before {
  content: "\e67d";
}
.b-icon-delete:before {
  content: "\e679";
}
.b-icon-checkedRadio2:before {
  content: "\e67b";
}
.b-icon-edit2:before {
  content: "\e67a";
}
.b-icon-flod:before {
  content: "\e677";
}
.b-icon-unflod:before {
  content: "\e678";
}
.b-icon-qq:before {
  content: "\e676";
}
.b-icon-testfight:before {
  content: "\e675";
}
.b-icon-medium:before {
  content: "\e66f";
}
.b-icon-linkedin:before {
  content: "\e670";
}
.b-icon-github:before {
  content: "\e671";
}
.b-icon-line:before {
  content: "\e672";
}
.b-icon-discord:before {
  content: "\e673";
}
.b-icon-biyong:before {
  content: "\e674";
}
.b-icon-count:before {
  content: "\e66e";
}
.b-icon-indicator:before {
  content: "\e66d";
}
.b-icon-contract:before {
  content: "\e66c";
}
.b-icon-dark:before {
  content: "\e669";
}
.b-icon-whiite:before {
  content: "\e66a";
}
.b-icon-cnyswitch:before {
  content: "\e66b";
}
.b-icon-download1:before {
  content: "\e656";
}
.b-icon-kline:before {
  content: "\e659";
}
.b-icon-Sort_left:before {
  content: "\e65a";
}
.b-icon-moreContent:before {
  content: "\e65d";
}
.b-icon-leftmore:before {
  content: "\e65e";
}
.b-icon-fullScreen:before {
  content: "\e65f";
}
.b-icon-Sort_right:before {
  content: "\e661";
}
.b-icon-moment:before {
  content: "\e662";
}
.b-icon-search1:before {
  content: "\e664";
}
.b-icon-check:before {
  content: "\e666";
}
.b-icon-screening:before {
  content: "\e667";
}
.b-icon-share1:before {
  content: "\e668";
}
.b-icon-order_down:before {
  content: "\e663";
}
.b-icon-order_up:before {
  content: "\e665";
}
.b-icon-slider:before {
  content: "\e62f";
}
.b-icon-notice:before {
  content: "\e660";
}
.b-icon-trade:before {
  content: "\e657";
}
.b-icon-asset:before {
  content: "\e658";
}
.b-icon-markets:before {
  content: "\e65b";
}
.b-icon-home:before {
  content: "\e65c";
}
.b-icon-back:before {
  content: "\e655";
}
.b-icon-search:before {
  content: "\e654";
}
.b-icon-paste1:before {
  content: "\e653";
}
.b-icon-brief:before {
  content: "\e652";
}
.b-icon-windows:before {
  content: "\e635";
}
.b-icon-weibo:before {
  content: "\e636";
}
.b-icon-telegram:before {
  content: "\e637";
}
.b-icon-apple:before {
  content: "\e638";
}
.b-icon-facebook:before {
  content: "\e63a";
}
.b-icon-android:before {
  content: "\e63b";
}
.b-icon-locked:before {
  content: "\e63c";
}
.b-icon-favorite:before {
  content: "\e63d";
}
.b-icon-favorited:before {
  content: "\e63e";
}
.b-icon-candels:before {
  content: "\e63f";
}
.b-icon-settings:before {
  content: "\e640";
}
.b-icon-day:before {
  content: "\e641";
}
.b-icon-night:before {
  content: "\e642";
}
.b-icon-announcement:before {
  content: "\e643";
}
.b-icon-pin:before {
  content: "\e644";
}
.b-icon-fullscreen:before {
  content: "\e645";
}
.b-icon-network:before {
  content: "\e646";
}
.b-icon-icon-test1:before {
  content: "\e648";
}
.b-icon-twitter:before {
  content: "\e64a";
}
.b-icon-intro:before {
  content: "\e639";
}
.b-icon-edit:before {
  content: "\e64b";
}
.b-icon-info_line:before {
  content: "\e64c";
}
.b-icon-appdownload:before {
  content: "\e64d";
}
.b-icon-announce:before {
  content: "\e64e";
}
.b-icon-download:before {
  content: "\e64f";
}
.b-icon-reddit:before {
  content: "\e650";
}
.b-icon-Icon_Authentication:before {
  content: "\e651";
}
.b-icon-dianhua:before {
  content: "\e609";
}
.b-icon-v:before {
  content: "\e69a";
}
.b-icon-loading:before {
  content: "\e615";
}
.b-icon-paypal:before {
  content: "\e89e";
}
.b-icon-send:before {
  content: "\e605";
}
.b-icon-kong:before {
  content: "\e600";
}
.b-icon-addPicture:before {
  content: "\e647";
}
.b-icon-usdt:before {
  content: "\e649";
}
.b-icon-alarm:before {
  content: "\e601";
}
.b-icon-arrowDown:before {
  content: "\e602";
}
.b-icon-close:before {
  content: "\e603";
}
.b-icon-attachment:before {
  content: "\e604";
}
.b-icon-filter:before {
  content: "\e606";
}
.b-icon-firstPage:before {
  content: "\e607";
}
.b-icon-fold:before {
  content: "\e608";
}
.b-icon-lastPage:before {
  content: "\e60a";
}
.b-icon-hidden:before {
  content: "\e60b";
}
.b-icon-moreAction:before {
  content: "\e60c";
}
.b-icon-nextPage:before {
  content: "\e60d";
}
.b-icon-prevPage:before {
  content: "\e60e";
}
.b-icon-Suspended:before {
  content: "\e60f";
}
.b-icon-unfold:before {
  content: "\e610";
}
.b-icon-unhidden:before {
  content: "\e611";
}
.b-icon-arrowUp:before {
  content: "\e612";
}
.b-icon-add:before {
  content: "\e613";
}
.b-icon-arrowRight:before {
  content: "\e614";
}
.b-icon-arrowLeft:before {
  content: "\e616";
}
.b-icon-checked:before {
  content: "\e617";
}
.b-icon-cancelled1:before {
  content: "\e61a";
}
.b-icon-finished1:before {
  content: "\e61d";
}
.b-icon-foldPage:before {
  content: "\e61e";
}
.b-icon-paste:before {
  content: "\e622";
}
.b-icon-lightsOFF:before {
  content: "\e625";
}
.b-icon-lightsON:before {
  content: "\e626";
}
.b-icon-transaction:before {
  content: "\e627";
}
.b-icon-unfoldPage:before {
  content: "\e628";
}
.b-icon-bankCard:before {
  content: "\e618";
}
.b-icon-wechatPay:before {
  content: "\e619";
}
.b-icon-alipay:before {
  content: "\e61b";
}
.b-icon-uncheck:before {
  content: "\e61c";
}
.b-icon-user:before {
  content: "\e61f";
}
.b-icon-checkedRadio:before {
  content: "\e620";
}
.b-icon-ucheckedRadio:before {
  content: "\e621";
}
.b-icon-time:before {
  content: "\e623";
}
.b-icon-code1:before {
  content: "\e624";
}
.b-icon-positive:before {
  content: "\e629";
}
.b-icon-reverse:before {
  content: "\e62a";
}
.b-icon-comment:before {
  content: "\e62b";
}
.b-icon-info:before {
  content: "\e62c";
}
.b-icon-praised:before {
  content: "\e62d";
}
.b-icon-upload:before {
  content: "\e62e";
}
.b-icon-logo:before {
  content: "\e631";
}
.b-icon-share:before {
  content: "\e632";
}
.b-icon-praise1:before {
  content: "\e633";
}
.b-icon-icon-test:before {
  content: "\e630";
}
.b-icon-wechat:before {
  content: "\e634";
}
.b-icon-youtube:before {
  content: "\e6a4";
}

.bg {
  background: #fafafa;
}
.blue {
  font-size: 3.59vw;
  color: #6c29eb;
}
.FC {
  color: var(--FC);
}
.paymentclass {
  font-size: 3.08vw;
  line-height: 5.13vw;
  padding-right: 3.08vw;
  position: relative;
  text-align: right;
}
.paymentLeftclass,
.paymentclassLeft36 {
  font-size: 3.08vw;
  line-height: 5.13vw;
  padding-left: 3.08vw;
  position: relative;
}
.paymentclassLeft36 {
  padding-left: 8.21vw;
}
.paymentclass:after {
  content: "";
  display: block;
  width: 0.51vw;
  height: 2.56vw;
  position: absolute;
  top: 50%;
  right: 0;
  background-color: var(--FC1);
  border-radius: 0.51vw 0 0.51vw 0;
  transform: translateY(-50%);
}
.paymentLeftclass:after {
  content: "";
  display: block;
  width: 0.51vw;
  height: 2.56vw;
  position: absolute;
  top: 50%;
  left: 0;
  background-color: var(--FC1);
  border-radius: 0.51vw 0 0.51vw 0;
  transform: translateY(-50%);
}
.paymentclassLeft36:after {
  content: "";
  display: block;
  width: 0.51vw;
  height: 2.56vw;
  position: absolute;
  top: 50%;
  left: 6.15vw;
  background-color: var(--FC1);
  border-radius: 0.51vw 0 0.51vw 0;
  transform: translateY(-50%);
}
.paymentsType0:after {
  background-color: #6C29EB;
}
.paymentsType1:after {
  background-color: #1777FF;
}
.paymentsType2:after {
  background-color: #00C250;
}
.paymentsType12:after {
  background-color: #005B7A;
}
.paymentsType13:after {
  background-color: #1B3351;
}
.paymentsType14:after {
  background-color: #FF8300;
}
.paymentsType15:after {
  background-color: #AACF39;
}
.paymentsType6:after {
  background-color: #E1222E;
}
.paymentsType17:after {
  background-color: #00BD8D;
}
.g-btn {
  display: inline-block;
  border: 0;
  text-align: center;
  transition: all 0.25s ease-out;
  vertical-align: middle;
  font-size: 3.58974vw;
  outline: none;
  padding: 1.53846vw 5.12821vw;
  background: #6c29eb;
  color: #ffffff;
  width: 100%;
  border-radius: 1.02564vw;
  cursor: pointer;
}
.g-btn:disabled {
  cursor: not-allowed;
  background: #60677e;
  color: #9ca5b0;
}
.g-btn:disabled:hover {
  background: #60677e;
  color: #9ca5b0;
}
.g-btn:hover {
  opacity: 0.6;
}
.g-btn-red {
  background: #ff5361;
}
.g-btn-green {
  background: #08af7f;
}
.g-btn-group {
  display: flex;
  width: 100%;
  border-top: 1px solid #424c6d;
}
.g-btn-group .g-btn {
  flex: 1 1;
  border-radius: 0;
}
.g-btn-group.g-btn-group-justify {
  display: flex;
  width: 100%;
}
.g-btn-group.g-btn-group-justify .g-btn,
.g-btn-group.g-btn-group-justify .g-btn-hollow {
  flex: 1 1;
}

.bg {
  background: #fafafa;
}
.blue {
  font-size: 3.59vw;
  color: #6c29eb;
}
.FC {
  color: var(--FC);
}
.paymentclass {
  font-size: 3.08vw;
  line-height: 5.13vw;
  padding-right: 3.08vw;
  position: relative;
  text-align: right;
}
.paymentLeftclass,
.paymentclassLeft36 {
  font-size: 3.08vw;
  line-height: 5.13vw;
  padding-left: 3.08vw;
  position: relative;
}
.paymentclassLeft36 {
  padding-left: 8.21vw;
}
.paymentclass:after {
  content: "";
  display: block;
  width: 0.51vw;
  height: 2.56vw;
  position: absolute;
  top: 50%;
  right: 0;
  background-color: var(--FC1);
  border-radius: 0.51vw 0 0.51vw 0;
  transform: translateY(-50%);
}
.paymentLeftclass:after {
  content: "";
  display: block;
  width: 0.51vw;
  height: 2.56vw;
  position: absolute;
  top: 50%;
  left: 0;
  background-color: var(--FC1);
  border-radius: 0.51vw 0 0.51vw 0;
  transform: translateY(-50%);
}
.paymentclassLeft36:after {
  content: "";
  display: block;
  width: 0.51vw;
  height: 2.56vw;
  position: absolute;
  top: 50%;
  left: 6.15vw;
  background-color: var(--FC1);
  border-radius: 0.51vw 0 0.51vw 0;
  transform: translateY(-50%);
}
.paymentsType0:after {
  background-color: #6C29EB;
}
.paymentsType1:after {
  background-color: #1777FF;
}
.paymentsType2:after {
  background-color: #00C250;
}
.paymentsType12:after {
  background-color: #005B7A;
}
.paymentsType13:after {
  background-color: #1B3351;
}
.paymentsType14:after {
  background-color: #FF8300;
}
.paymentsType15:after {
  background-color: #AACF39;
}
.paymentsType6:after {
  background-color: #E1222E;
}
.paymentsType17:after {
  background-color: #00BD8D;
}
.g-input {
  max-width: 100%;
  position: relative;
  border: 1px solid #67759f;
  border-radius: 0.76923vw;
  caret-color: #ffffff;
  color: #ffffff;
  transition: all ease-in-out 0.3s;
  height: 10.25641vw;
  display: flex;
  align-items: center;
}
.g-input .g-input-suffix,
.g-input .g-input-prefix {
  color: #67759f;
}
.g-input .g-input-suffix i,
.g-input .g-input-prefix i {
  color: #67759f;
}
.g-input.error {
  border-color: #ff5361;
}
.g-input:selection {
  border-color: #6c29eb;
}
.g-input input,
.g-input textarea {
  max-width: 100%;
  outline: none;
  width: 100%;
  height: 100%;
  font-size: 3.58974vw;
  line-height: 6.15385vw;
  padding: 0 2.5641vw;
  margin: 0;
  -webkit-appearance: none;
          appearance: none;
  border: 0;
  background: none;
  color: #ffffff;
}
.g-input input::placeholder,
.g-input textarea::placeholder {
  color: #68778b;
}
.g-input input[type="checkbox"] {
  width: 5.12821vw;
  max-width: 5.12821vw;
  height: 5.12821vw;
  min-height: 5.12821vw;
  padding: 0;
  opacity: 0;
}
.g-input textarea {
  padding: 2.5641vw;
}
.g-input .g-input-suffix {
  color: #67759f;
  margin: 0 2.5641vw 0 0;
}
.g-input .g-input-prefix {
  color: #67759f;
  margin: 0 0 0 2.5641vw;
}
.g-input-error {
  border-color: #ff5361;
}
.g-input-focus {
  border-color: #ffffff;
  background-color: #2b3555;
}
.g-input-focus .g-input-suffix,
.g-input-focus .g-input-prefix {
  color: #ffffff;
}
.g-input-focus .g-input-suffix i,
.g-input-focus .g-input-prefix i {
  color: #ffffff;
}
.g-checkbox {
  position: relative;
  width: 4.10256vw;
  height: 4.10256vw;
  padding: 0;
  cursor: pointer;
}
.g-checkbox input {
  cursor: pointer;
}
.g-input-checked {
  background: #6c29eb;
}
.g-input-checked:before {
  position: absolute;
  width: 100%;
  height: 100%;
  left: 11%;
  top: 13%;
  font-family: iconfontshble;
  content: "\E632";
  display: block;
  color: #ffffff;
  font-size: 3.07692vw;
}
.g-input-group {
  position: relative;
  max-width: 100%;
  display: flex;
  border: 1px solid rgba(255, 255, 255, 0.1);
}
.g-input-group .g-input {
  border: 0;
  flex: 1 1;
}
.g-input-group .g-input:last-child {
  border: 0;
}

.g-msgbox {
  position: fixed;
  top: 50%;
  top: calc(50% + (env(safe-area-inset-top, 0px) - env(safe-area-inset-bottom, 0px)) / 2);
  left: 1rem;
  right: 1rem;
  transform: translateY(-50%);
  max-height: calc(100vh - env(safe-area-inset-top, 0px) - env(safe-area-inset-bottom, 0px) - 2rem);
  max-height: calc(100dvh - env(safe-area-inset-top, 0px) - env(safe-area-inset-bottom, 0px) - 2rem);
  display: flex;
  flex-direction: column;
  align-items: center;
  grid-gap: 0.5rem;
  gap: 0.5rem;
  overflow-y: auto;
  overscroll-behavior: contain;
  pointer-events: none;
  z-index: 1900;
}
.g-message {
  display: flex;
  flex: 0 0 auto;
  align-items: center;
  justify-content: center;
  grid-gap: 0.375rem;
  gap: 0.375rem;
  width: -webkit-max-content;
  width: max-content;
  max-width: 100%;
  box-sizing: border-box;
  padding: 0.75rem;
  margin: 0;
  border: 0;
  border-radius: 0.5rem;
  background: var(--FC-toast, #4d4a53);
  color: #fff;
  box-shadow: none;
  font-style: normal;
  font-weight: 400;
  white-space: normal;
  pointer-events: auto;
  animation: once 0.5s ease-in-out 1 forwards;
}
.g-message > img {
  display: block;
  width: 1rem;
  height: 1rem;
  flex: 0 0 1rem;
}
.g-message > span {
  display: block;
  min-width: 0;
  max-height: calc(100vh - env(safe-area-inset-top, 0px) - env(safe-area-inset-bottom, 0px) - 3.5rem);
  max-height: calc(100dvh - env(safe-area-inset-top, 0px) - env(safe-area-inset-bottom, 0px) - 3.5rem);
  overflow-y: auto;
  overflow-wrap: anywhere;
  word-break: break-word;
  white-space: pre-wrap;
  font-size: 0.875rem;
  line-height: 1.25rem;
  text-align: left;
}
.g-message.close {
  pointer-events: none;
  animation: close 0.5s ease-in-out 1 forwards;
}
.loadBox {
  pointer-events: none;
  position: fixed;
  max-width: 90%;
  z-index: 1900;
  color: var(--TC-rebel);
  margin: 0 auto 2.5641vw;
  top: 50%;
  left: 0;
  right: 0;
  transform: translate3d(0, -50%, 0);
  text-align: center;
  display: flex;
  flex-shrink: unset;
  align-items: center;
  justify-content: center;
  animation: once 0.5s ease-in-out 1 forwards;
}
.loadBox span {
  display: block;
  font-size: 3.58974vw;
  line-height: 1.4;
  min-height: 5.12821vw;
  margin: 0 0 0 1.28205vw;
  max-width: 100%;
  word-break: break-word;
  text-align: left;
}
@keyframes once {
  0% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}
@keyframes close {
  0% {
    opacity: 1;
  }
  100% {
    opacity: 0;
  }
}
.loadBox .icon {
  width: 6.15385vw;
  height: 6.15385vw;
  animation: rotateZ 4s linear 0s infinite;
}
.loadBg {
  pointer-events: auto;
  position: fixed;
  z-index: 1899;
  width: 100%;
  height: 100%;
  top: 0;
  left: 0;
  background: var(--MBG);
}
@keyframes rotateZ {
  0% {
    transform: rotateZ(0deg);
  }
  100% {
    transform: rotateZ(360deg);
  }
}

.bg {
  background: #fafafa;
}
.blue {
  font-size: 3.59vw;
  color: #6c29eb;
}
.FC {
  color: var(--FC);
}
.paymentclass {
  font-size: 3.08vw;
  line-height: 5.13vw;
  padding-right: 3.08vw;
  position: relative;
  text-align: right;
}
.paymentLeftclass,
.paymentclassLeft36 {
  font-size: 3.08vw;
  line-height: 5.13vw;
  padding-left: 3.08vw;
  position: relative;
}
.paymentclassLeft36 {
  padding-left: 8.21vw;
}
.paymentclass:after {
  content: "";
  display: block;
  width: 0.51vw;
  height: 2.56vw;
  position: absolute;
  top: 50%;
  right: 0;
  background-color: var(--FC1);
  border-radius: 0.51vw 0 0.51vw 0;
  transform: translateY(-50%);
}
.paymentLeftclass:after {
  content: "";
  display: block;
  width: 0.51vw;
  height: 2.56vw;
  position: absolute;
  top: 50%;
  left: 0;
  background-color: var(--FC1);
  border-radius: 0.51vw 0 0.51vw 0;
  transform: translateY(-50%);
}
.paymentclassLeft36:after {
  content: "";
  display: block;
  width: 0.51vw;
  height: 2.56vw;
  position: absolute;
  top: 50%;
  left: 6.15vw;
  background-color: var(--FC1);
  border-radius: 0.51vw 0 0.51vw 0;
  transform: translateY(-50%);
}
.paymentsType0:after {
  background-color: #6C29EB;
}
.paymentsType1:after {
  background-color: #1777FF;
}
.paymentsType2:after {
  background-color: #00C250;
}
.paymentsType12:after {
  background-color: #005B7A;
}
.paymentsType13:after {
  background-color: #1B3351;
}
.paymentsType14:after {
  background-color: #FF8300;
}
.paymentsType15:after {
  background-color: #AACF39;
}
.paymentsType6:after {
  background-color: #E1222E;
}
.paymentsType17:after {
  background-color: #00BD8D;
}
.g-loadingBox {
  position: relative;
  width: 100%;
  height: 100%;
  z-index: 1;
  min-height: 5.12821vw;
}
.g-loadingContent {
  display: flex;
  position: absolute;
  left: 50%;
  top: 50%;
  transform: translate(-50%, -50%) translateZ(0);
  z-index: 10;
}
.g-loadingMask {
  width: 100%;
  height: 100%;
  position: absolute;
  left: 0;
  top: 0;
  z-index: 2;
}

.bg {
  background: #fafafa;
}
.blue {
  font-size: 3.59vw;
  color: #6c29eb;
}
.FC {
  color: var(--FC);
}
.paymentclass {
  font-size: 3.08vw;
  line-height: 5.13vw;
  padding-right: 3.08vw;
  position: relative;
  text-align: right;
}
.paymentLeftclass,
.paymentclassLeft36 {
  font-size: 3.08vw;
  line-height: 5.13vw;
  padding-left: 3.08vw;
  position: relative;
}
.paymentclassLeft36 {
  padding-left: 8.21vw;
}
.paymentclass:after {
  content: "";
  display: block;
  width: 0.51vw;
  height: 2.56vw;
  position: absolute;
  top: 50%;
  right: 0;
  background-color: var(--FC1);
  border-radius: 0.51vw 0 0.51vw 0;
  transform: translateY(-50%);
}
.paymentLeftclass:after {
  content: "";
  display: block;
  width: 0.51vw;
  height: 2.56vw;
  position: absolute;
  top: 50%;
  left: 0;
  background-color: var(--FC1);
  border-radius: 0.51vw 0 0.51vw 0;
  transform: translateY(-50%);
}
.paymentclassLeft36:after {
  content: "";
  display: block;
  width: 0.51vw;
  height: 2.56vw;
  position: absolute;
  top: 50%;
  left: 6.15vw;
  background-color: var(--FC1);
  border-radius: 0.51vw 0 0.51vw 0;
  transform: translateY(-50%);
}
.paymentsType0:after {
  background-color: #6C29EB;
}
.paymentsType1:after {
  background-color: #1777FF;
}
.paymentsType2:after {
  background-color: #00C250;
}
.paymentsType12:after {
  background-color: #005B7A;
}
.paymentsType13:after {
  background-color: #1B3351;
}
.paymentsType14:after {
  background-color: #FF8300;
}
.paymentsType15:after {
  background-color: #AACF39;
}
.paymentsType6:after {
  background-color: #E1222E;
}
.paymentsType17:after {
  background-color: #00BD8D;
}
.g-dropdown {
  position: relative;
  width: 100%;
}
.g-dropdown .control {
  position: relative;
  overflow: hidden;
  box-sizing: border-box;
  color: #68778b;
  cursor: default;
  outline: none;
  padding: 0.51282vw 0px 0.51282vw 2.5641vw;
  transition: all 200ms ease;
  width: 100%;
  height: 6.15385vw;
  font-size: 3.07692vw;
}
.g-dropdown .arrow {
  border-color: #68778b;
  border-style: solid;
  border-width: 1px 1px 0 0;
  content: " ";
  display: block;
  position: absolute;
  right: 2.05128vw;
  top: 1.28205vw;
  width: 2.05128vw;
  height: 2.05128vw;
  transform: rotateZ(135deg);
}
.g-dropdown .menu {
  background-color: #fafafa;
  box-sizing: border-box;
  margin-top: -1px;
  max-height: 76.92308vw;
  overflow-y: auto;
  position: absolute;
  top: 100%;
  width: 100%;
  z-index: 900;
  -webkit-overflow-scrolling: touch;
  color: #ffffff;
}
.g-dropdown .menu .group > .title {
  padding: 2.05128vw 2.5641vw;
  color: #ffffff;
  font-weight: bold;
  text-transform: capitalize;
}
.g-dropdown .option {
  box-sizing: border-box;
  color: #ffffff;
  cursor: pointer;
  display: block;
  padding: 3.07692vw 0px 2.5641vw 2.5641vw;
  transition: all 0.3s ease-in-out;
}
.g-dropdown .option:last-child {
  border-bottom-right-radius: 0.51282vw;
  border-bottom-left-radius: 0.51282vw;
}
.g-dropdown .option:hover {
  background-color: #6c29eb;
}
.g-dropdown .option.selected {
  background-color: #6c29eb;
}
.g-dropdown .noresults {
  box-sizing: border-box;
  color: #ffffff;
  cursor: default;
  display: block;
  padding: 2.05128vw 2.5641vw;
}

.bg {
  background: #fafafa;
}
.blue {
  font-size: 3.59vw;
  color: #6c29eb;
}
.FC {
  color: var(--FC);
}
.paymentclass {
  font-size: 3.08vw;
  line-height: 5.13vw;
  padding-right: 3.08vw;
  position: relative;
  text-align: right;
}
.paymentLeftclass,
.paymentclassLeft36 {
  font-size: 3.08vw;
  line-height: 5.13vw;
  padding-left: 3.08vw;
  position: relative;
}
.paymentclassLeft36 {
  padding-left: 8.21vw;
}
.paymentclass:after {
  content: "";
  display: block;
  width: 0.51vw;
  height: 2.56vw;
  position: absolute;
  top: 50%;
  right: 0;
  background-color: var(--FC1);
  border-radius: 0.51vw 0 0.51vw 0;
  transform: translateY(-50%);
}
.paymentLeftclass:after {
  content: "";
  display: block;
  width: 0.51vw;
  height: 2.56vw;
  position: absolute;
  top: 50%;
  left: 0;
  background-color: var(--FC1);
  border-radius: 0.51vw 0 0.51vw 0;
  transform: translateY(-50%);
}
.paymentclassLeft36:after {
  content: "";
  display: block;
  width: 0.51vw;
  height: 2.56vw;
  position: absolute;
  top: 50%;
  left: 6.15vw;
  background-color: var(--FC1);
  border-radius: 0.51vw 0 0.51vw 0;
  transform: translateY(-50%);
}
.paymentsType0:after {
  background-color: #6C29EB;
}
.paymentsType1:after {
  background-color: #1777FF;
}
.paymentsType2:after {
  background-color: #00C250;
}
.paymentsType12:after {
  background-color: #005B7A;
}
.paymentsType13:after {
  background-color: #1B3351;
}
.paymentsType14:after {
  background-color: #FF8300;
}
.paymentsType15:after {
  background-color: #AACF39;
}
.paymentsType6:after {
  background-color: #E1222E;
}
.paymentsType17:after {
  background-color: #00BD8D;
}
.g-layer {
  width: 100%;
  height: 100%;
  background: rgba(0, 0, 0, 0.5);
  position: fixed;
  left: 0;
  top: 0;
  z-index: 200;
  transform: translate(0, 0) translateZ(0);
}
.g-layer.hide {
  transform: translate(-150%, 0) translateZ(0);
}
.g-layer.hide .layer-inner {
  opacity: 0;
  transform: translate(-50%, -50%) translateZ(0) scale(0.1, 0.1);
}
.g-layer.close .layer-inner {
  opacity: 0;
  transform: translate(-50%, -50%) translateZ(0) scale(0.1, 0.1);
}
.g-layer .layer-inner {
  width: 141.02564vw;
  background: #333c5a;
  position: absolute;
  left: 50%;
  top: 50%;
  transition: all 0.2s cubic-bezier(0.39, 0.58, 0.57, 1);
  transform: translate(-50%, -50%) scale(1, 1) translateZ(0);
  opacity: 1;
  border-radius: 1.28205vw;
}
.g-layer.android .layer-inner {
  transform: translate(-50%, -100%) scale(1, 1) translateZ(0);
}
.g-layer .layer-loading {
  width: 76.92308vw;
  padding: 5.12821vw 0;
  text-align: center;
}
.g-layer .layer-title {
  font-size: 4.10256vw;
  text-align: center;
  color: #ffffff;
  line-height: 15.38462vw;
  background: #333c5a;
  border-top-left-radius: 1.28205vw;
  border-top-right-radius: 1.28205vw;
  border-bottom: 1px solid #424c6d;
}
.g-layer .layer-content {
  color: #ffffff;
  border-top-left-radius: 1.28205vw;
  border-top-right-radius: 1.28205vw;
}
.g-layer .g-btn {
  border: 0;
  border-top-left-radius: 0;
  border-top-right-radius: 0;
}
.g-layer .g-btn-group {
  border-bottom-left-radius: 1.28205vw;
  border-bottom-right-radius: 1.28205vw;
  overflow: hidden;
}
.g-layer .showCloseBtn {
  position: absolute;
  right: 6.15385vw;
  top: 6.15385vw;
  z-index: 100;
  color: #c4cad7;
  cursor: pointer;
}
.g-border-l {
  border-left: 1px solid #ffffff;
}

.bg {
  background: #fafafa;
}
.blue {
  font-size: 3.59vw;
  color: #6c29eb;
}
.FC {
  color: var(--FC);
}
.paymentclass {
  font-size: 3.08vw;
  line-height: 5.13vw;
  padding-right: 3.08vw;
  position: relative;
  text-align: right;
}
.paymentLeftclass,
.paymentclassLeft36 {
  font-size: 3.08vw;
  line-height: 5.13vw;
  padding-left: 3.08vw;
  position: relative;
}
.paymentclassLeft36 {
  padding-left: 8.21vw;
}
.paymentclass:after {
  content: "";
  display: block;
  width: 0.51vw;
  height: 2.56vw;
  position: absolute;
  top: 50%;
  right: 0;
  background-color: var(--FC1);
  border-radius: 0.51vw 0 0.51vw 0;
  transform: translateY(-50%);
}
.paymentLeftclass:after {
  content: "";
  display: block;
  width: 0.51vw;
  height: 2.56vw;
  position: absolute;
  top: 50%;
  left: 0;
  background-color: var(--FC1);
  border-radius: 0.51vw 0 0.51vw 0;
  transform: translateY(-50%);
}
.paymentclassLeft36:after {
  content: "";
  display: block;
  width: 0.51vw;
  height: 2.56vw;
  position: absolute;
  top: 50%;
  left: 6.15vw;
  background-color: var(--FC1);
  border-radius: 0.51vw 0 0.51vw 0;
  transform: translateY(-50%);
}
.paymentsType0:after {
  background-color: #6C29EB;
}
.paymentsType1:after {
  background-color: #1777FF;
}
.paymentsType2:after {
  background-color: #00C250;
}
.paymentsType12:after {
  background-color: #005B7A;
}
.paymentsType13:after {
  background-color: #1B3351;
}
.paymentsType14:after {
  background-color: #FF8300;
}
.paymentsType15:after {
  background-color: #AACF39;
}
.paymentsType6:after {
  background-color: #E1222E;
}
.paymentsType17:after {
  background-color: #00BD8D;
}
.g-switch {
  font-size: 3.58974vw;
  line-height: 1.5;
  color: rgba(0, 0, 0, 0.65);
  margin: 0;
  padding: 0;
  list-style: none;
  position: relative;
  display: inline-block;
  height: 5.64103vw;
  min-width: 11.28205vw;
  line-height: 5.12821vw;
  vertical-align: middle;
  border-radius: 25.64103vw;
  border: 1px solid transparent;
  background-color: rgba(0, 0, 0, 0.25);
  transition: all 0.36s cubic-bezier(0.78, 0.14, 0.15, 0.86);
  cursor: pointer;
}
.g-switch span {
  color: #ffffff;
  font-size: 3.07692vw;
  margin-left: 6.15385vw;
  margin-right: 1.53846vw;
  display: block;
}
.g-switch:after,
.g-switch:before {
  position: absolute;
  width: 4.61538vw;
  height: 4.61538vw;
  left: 1px;
  top: 1px;
  border-radius: 4.61538vw;
  background-color: #ffffff;
  content: " ";
  cursor: pointer;
  transition: all 0.36s cubic-bezier(0.78, 0.14, 0.15, 0.86);
}
.g-switch-checked {
  background-color: #34C759;
}
.g-switch-checked span {
  margin-left: 1.53846vw;
  margin-right: 6.15385vw;
}
.g-switch-checked:after,
.g-switch-checked:before {
  left: 100%;
  margin-left: -4.87179vw;
}

.bg {
  background: #fafafa;
}
.blue {
  font-size: 3.59vw;
  color: #6c29eb;
}
.FC {
  color: var(--FC);
}
.paymentclass {
  font-size: 3.08vw;
  line-height: 5.13vw;
  padding-right: 3.08vw;
  position: relative;
  text-align: right;
}
.paymentLeftclass,
.paymentclassLeft36 {
  font-size: 3.08vw;
  line-height: 5.13vw;
  padding-left: 3.08vw;
  position: relative;
}
.paymentclassLeft36 {
  padding-left: 8.21vw;
}
.paymentclass:after {
  content: "";
  display: block;
  width: 0.51vw;
  height: 2.56vw;
  position: absolute;
  top: 50%;
  right: 0;
  background-color: var(--FC1);
  border-radius: 0.51vw 0 0.51vw 0;
  transform: translateY(-50%);
}
.paymentLeftclass:after {
  content: "";
  display: block;
  width: 0.51vw;
  height: 2.56vw;
  position: absolute;
  top: 50%;
  left: 0;
  background-color: var(--FC1);
  border-radius: 0.51vw 0 0.51vw 0;
  transform: translateY(-50%);
}
.paymentclassLeft36:after {
  content: "";
  display: block;
  width: 0.51vw;
  height: 2.56vw;
  position: absolute;
  top: 50%;
  left: 6.15vw;
  background-color: var(--FC1);
  border-radius: 0.51vw 0 0.51vw 0;
  transform: translateY(-50%);
}
.paymentsType0:after {
  background-color: #6C29EB;
}
.paymentsType1:after {
  background-color: #1777FF;
}
.paymentsType2:after {
  background-color: #00C250;
}
.paymentsType12:after {
  background-color: #005B7A;
}
.paymentsType13:after {
  background-color: #1B3351;
}
.paymentsType14:after {
  background-color: #FF8300;
}
.paymentsType15:after {
  background-color: #AACF39;
}
.paymentsType6:after {
  background-color: #E1222E;
}
.paymentsType17:after {
  background-color: #00BD8D;
}
:global .react-tabs__tab {
  padding: 3.07692vw 4.10256vw;
  font-size: 4.10256vw;
  margin: 0 5.12821vw;
  color: #ffffff;
  -webkit-user-select: none;
          user-select: none;
  border: 0;
  border-bottom: 0.51282vw solid rgba(0, 0, 0, 0);
  bottom: 0;
  transition: all 0.3s ease-in-out;
}
:global .react-tabs__tab:focus {
  box-shadow: 0 0 0 rgba(0, 0, 0, 0);
  border-color: rgba(0, 0, 0, 0);
}
:global .react-tabs__tab:hover {
  color: #6c29eb;
}
:global .react-tabs__tab-list {
  margin: 0;
}
:global .react-tabs__tab--selected {
  background: none;
  color: #6c29eb;
  border: 0;
  border-bottom: 0.51282vw solid #6c29eb;
  border-radius: 0;
}
:global .react-tabs__tab--selected:focus {
  border-bottom: 0.51282vw solid #6c29eb;
}
:global .react-tabs__tab--selected:focus::after {
  display: none;
}

.bg {
  background: #fafafa;
}
.blue {
  font-size: 3.59vw;
  color: #6c29eb;
}
.FC {
  color: var(--FC);
}
.paymentclass {
  font-size: 3.08vw;
  line-height: 5.13vw;
  padding-right: 3.08vw;
  position: relative;
  text-align: right;
}
.paymentLeftclass,
.paymentclassLeft36 {
  font-size: 3.08vw;
  line-height: 5.13vw;
  padding-left: 3.08vw;
  position: relative;
}
.paymentclassLeft36 {
  padding-left: 8.21vw;
}
.paymentclass:after {
  content: "";
  display: block;
  width: 0.51vw;
  height: 2.56vw;
  position: absolute;
  top: 50%;
  right: 0;
  background-color: var(--FC1);
  border-radius: 0.51vw 0 0.51vw 0;
  transform: translateY(-50%);
}
.paymentLeftclass:after {
  content: "";
  display: block;
  width: 0.51vw;
  height: 2.56vw;
  position: absolute;
  top: 50%;
  left: 0;
  background-color: var(--FC1);
  border-radius: 0.51vw 0 0.51vw 0;
  transform: translateY(-50%);
}
.paymentclassLeft36:after {
  content: "";
  display: block;
  width: 0.51vw;
  height: 2.56vw;
  position: absolute;
  top: 50%;
  left: 6.15vw;
  background-color: var(--FC1);
  border-radius: 0.51vw 0 0.51vw 0;
  transform: translateY(-50%);
}
.paymentsType0:after {
  background-color: #6C29EB;
}
.paymentsType1:after {
  background-color: #1777FF;
}
.paymentsType2:after {
  background-color: #00C250;
}
.paymentsType12:after {
  background-color: #005B7A;
}
.paymentsType13:after {
  background-color: #1B3351;
}
.paymentsType14:after {
  background-color: #FF8300;
}
.paymentsType15:after {
  background-color: #AACF39;
}
.paymentsType6:after {
  background-color: #E1222E;
}
.paymentsType17:after {
  background-color: #00BD8D;
}
:global .rc-slider-rail {
  background: #2b3555;
}
:global .rc-slider-track {
  background: #6c29eb;
}
:global .rc-slider-handle {
  border: 0.51282vw solid #6c29eb;
  background: #2b3555;
}
:global .rc-slider-handle:active,
:global .rc-slider-handle:focus {
  box-shadow: 0 0 0 rgba(0, 0, 0, 0) !important;
}
:global .rc-slider-tooltip-inner {
  padding: 0;
  min-width: 10.25641vw;
  height: 7.69231vw;
  font-size: 3.07692vw;
  line-height: 7.69231vw;
  color: #ffffff;
  text-align: center;
  text-decoration: none;
  background-color: #2b3555;
  border-radius: 0px;
  box-shadow: 0 1.02564vw 2.05128vw rgba(0, 0, 0, 0.5);
}
:global .rc-slider-tooltip-placement-top .rc-slider-tooltip-arrow {
  border-top-color: #2b3555;
}

.bg {
  background: #fafafa;
}
.blue {
  font-size: 3.59vw;
  color: #6c29eb;
}
.FC {
  color: var(--FC);
}
.paymentclass {
  font-size: 3.08vw;
  line-height: 5.13vw;
  padding-right: 3.08vw;
  position: relative;
  text-align: right;
}
.paymentLeftclass,
.paymentclassLeft36 {
  font-size: 3.08vw;
  line-height: 5.13vw;
  padding-left: 3.08vw;
  position: relative;
}
.paymentclassLeft36 {
  padding-left: 8.21vw;
}
.paymentclass:after {
  content: "";
  display: block;
  width: 0.51vw;
  height: 2.56vw;
  position: absolute;
  top: 50%;
  right: 0;
  background-color: var(--FC1);
  border-radius: 0.51vw 0 0.51vw 0;
  transform: translateY(-50%);
}
.paymentLeftclass:after {
  content: "";
  display: block;
  width: 0.51vw;
  height: 2.56vw;
  position: absolute;
  top: 50%;
  left: 0;
  background-color: var(--FC1);
  border-radius: 0.51vw 0 0.51vw 0;
  transform: translateY(-50%);
}
.paymentclassLeft36:after {
  content: "";
  display: block;
  width: 0.51vw;
  height: 2.56vw;
  position: absolute;
  top: 50%;
  left: 6.15vw;
  background-color: var(--FC1);
  border-radius: 0.51vw 0 0.51vw 0;
  transform: translateY(-50%);
}
.paymentsType0:after {
  background-color: #6C29EB;
}
.paymentsType1:after {
  background-color: #1777FF;
}
.paymentsType2:after {
  background-color: #00C250;
}
.paymentsType12:after {
  background-color: #005B7A;
}
.paymentsType13:after {
  background-color: #1B3351;
}
.paymentsType14:after {
  background-color: #FF8300;
}
.paymentsType15:after {
  background-color: #AACF39;
}
.paymentsType6:after {
  background-color: #E1222E;
}
.paymentsType17:after {
  background-color: #00BD8D;
}
.g-table {
  display: flex;
  flex-direction: column;
  width: 100%;
  background: #333c5a;
}
.g-table .theader {
  display: flex;
  height: 10.25641vw;
  align-items: center;
  color: #9ca5b0;
  font-size: 3.07692vw;
}
.g-table .theader div {
  flex: 1 1;
}
.g-table .theader div:first-child {
  padding: 0 0 0 5.12821vw;
}
.g-table .tbody {
  overflow-y: auto;
  -webkit-overflow-scrolling: touch;
  border-top: 1px solid #424c6d;
}
.g-table .item {
  display: flex;
  height: 10.25641vw;
  align-items: center;
  color: #ffffff;
  border-bottom: 1px solid #424c6d;
}
.g-table .item div {
  flex: 1 1;
  white-space: nowrap;
}
.g-table .item div:first-child {
  padding: 0 0 0 5.12821vw;
}
.g-table .item div .action {
  color: #64b9fc;
}
.g-table .item:hover {
  background: #2b3555;
}
.g-table .item .grey {
  color: #9ca5b0;
}
.g-table .item .grey02 {
  color: #c4cad7;
}
.g-table .noresult {
  min-height: 102.5641vw;
  display: flex;
  align-items: center;
  justify-content: center;
  color: rgba(255, 255, 255, 0.6);
}

.bg {
  background: #fafafa;
}
.blue {
  font-size: 3.59vw;
  color: #6c29eb;
}
.FC {
  color: var(--FC);
}
.paymentclass {
  font-size: 3.08vw;
  line-height: 5.13vw;
  padding-right: 3.08vw;
  position: relative;
  text-align: right;
}
.paymentLeftclass,
.paymentclassLeft36 {
  font-size: 3.08vw;
  line-height: 5.13vw;
  padding-left: 3.08vw;
  position: relative;
}
.paymentclassLeft36 {
  padding-left: 8.21vw;
}
.paymentclass:after {
  content: "";
  display: block;
  width: 0.51vw;
  height: 2.56vw;
  position: absolute;
  top: 50%;
  right: 0;
  background-color: var(--FC1);
  border-radius: 0.51vw 0 0.51vw 0;
  transform: translateY(-50%);
}
.paymentLeftclass:after {
  content: "";
  display: block;
  width: 0.51vw;
  height: 2.56vw;
  position: absolute;
  top: 50%;
  left: 0;
  background-color: var(--FC1);
  border-radius: 0.51vw 0 0.51vw 0;
  transform: translateY(-50%);
}
.paymentclassLeft36:after {
  content: "";
  display: block;
  width: 0.51vw;
  height: 2.56vw;
  position: absolute;
  top: 50%;
  left: 6.15vw;
  background-color: var(--FC1);
  border-radius: 0.51vw 0 0.51vw 0;
  transform: translateY(-50%);
}
.paymentsType0:after {
  background-color: #6C29EB;
}
.paymentsType1:after {
  background-color: #1777FF;
}
.paymentsType2:after {
  background-color: #00C250;
}
.paymentsType12:after {
  background-color: #005B7A;
}
.paymentsType13:after {
  background-color: #1B3351;
}
.paymentsType14:after {
  background-color: #FF8300;
}
.paymentsType15:after {
  background-color: #AACF39;
}
.paymentsType6:after {
  background-color: #E1222E;
}
.paymentsType17:after {
  background-color: #00BD8D;
}
.g-radio {
  display: flex;
  align-items: center;
}
.g-radio .radio {
  width: 4.10256vw;
  height: 4.10256vw;
  background: transparent;
  border-radius: 50%;
  border: 1px solid #c4cad7;
  display: flex;
  overflow: hidden;
  justify-items: center;
  align-items: center;
  margin: 0 2.05128vw 0 0;
  transition: all 0.3s ease-in-out;
  cursor: pointer;
}
.g-radio .radio::after {
  display: block;
  content: " ";
  width: 2.05128vw;
  height: 2.05128vw;
  border-radius: 50%;
  margin: 0 auto;
  transition: all 0.3s ease-in-out;
}
.g-radio-checked .radio {
  border: 1px solid #6c29eb;
}
.g-radio-checked .radio::after {
  background: #6c29eb;
}
.g-radio-disabled .radio {
  background: #9ca5b0;
}
.g-radio-disabled .radio::after {
  background: none;
}
.g-radio-suffix {
  font-size: 3.58974vw;
  color: #ffffff;
}

.bg {
  background: #fafafa;
}
.blue {
  font-size: 3.59vw;
  color: #6c29eb;
}
.FC {
  color: var(--FC);
}
.paymentclass {
  font-size: 3.08vw;
  line-height: 5.13vw;
  padding-right: 3.08vw;
  position: relative;
  text-align: right;
}
.paymentLeftclass,
.paymentclassLeft36 {
  font-size: 3.08vw;
  line-height: 5.13vw;
  padding-left: 3.08vw;
  position: relative;
}
.paymentclassLeft36 {
  padding-left: 8.21vw;
}
.paymentclass:after {
  content: "";
  display: block;
  width: 0.51vw;
  height: 2.56vw;
  position: absolute;
  top: 50%;
  right: 0;
  background-color: var(--FC1);
  border-radius: 0.51vw 0 0.51vw 0;
  transform: translateY(-50%);
}
.paymentLeftclass:after {
  content: "";
  display: block;
  width: 0.51vw;
  height: 2.56vw;
  position: absolute;
  top: 50%;
  left: 0;
  background-color: var(--FC1);
  border-radius: 0.51vw 0 0.51vw 0;
  transform: translateY(-50%);
}
.paymentclassLeft36:after {
  content: "";
  display: block;
  width: 0.51vw;
  height: 2.56vw;
  position: absolute;
  top: 50%;
  left: 6.15vw;
  background-color: var(--FC1);
  border-radius: 0.51vw 0 0.51vw 0;
  transform: translateY(-50%);
}
.paymentsType0:after {
  background-color: #6C29EB;
}
.paymentsType1:after {
  background-color: #1777FF;
}
.paymentsType2:after {
  background-color: #00C250;
}
.paymentsType12:after {
  background-color: #005B7A;
}
.paymentsType13:after {
  background-color: #1B3351;
}
.paymentsType14:after {
  background-color: #FF8300;
}
.paymentsType15:after {
  background-color: #AACF39;
}
.paymentsType6:after {
  background-color: #E1222E;
}
.paymentsType17:after {
  background-color: #00BD8D;
}
:global(.rc-menu) {
  outline: none;
  list-style: none;
  border-radius: 0.76923vw;
}
:global(.rc-menu)-hidden {
  display: none;
}
:global(.rc-menu)-collapse {
  overflow: hidden;
}
:global(.rc-menu)-collapse-active {
  transition: height 0.3s ease-out;
}
:global(.rc-menu)-item-group-list {
  margin: 0;
  padding: 0;
}
:global(.rc-menu)-item-group-title {
  color: rgba(255, 255, 255, 0.6);
  line-height: 1.5;
  padding: 2.05128vw 2.5641vw;
}
:global(.rc-menu)-item-active,
:global(.rc-menu)-submenu-active > :global(.rc-menu)-submenu-title {
  background-color: #6c29eb;
}
:global(.rc-menu)-item-active:first-child,
:global(.rc-menu)-submenu-active > :global(.rc-menu)-submenu-title:first-child {
  border-top-left-radius: 0.76923vw;
  border-top-right-radius: 0.76923vw;
}
:global(.rc-menu)-item-active:last-child,
:global(.rc-menu)-submenu-active > :global(.rc-menu)-submenu-title:last-child {
  border-bottom-left-radius: 0.76923vw;
  border-bottom-right-radius: 0.76923vw;
}
:global(.rc-menu)-item-selected {
  transform: translateZ(0);
}
:global(.rc-menu)-submenu-selected {
  background-color: #6c29eb;
}
:global(.rc-menu) > li:global(.rc-menu)-submenu {
  padding: 0;
}
:global(.rc-menu)-horizontal:global(.rc-menu)-sub,
:global(.rc-menu)-vertical:global(.rc-menu)-sub,
:global(.rc-menu)-vertical-left:global(.rc-menu)-sub,
:global(.rc-menu)-vertical-right:global(.rc-menu)-sub {
  min-width: 15.38462vw;
  margin-top: 0;
  background: #fafafa;
  color: #ffffff;
  font-size: 3.07692vw;
  cursor: pointer;
  box-shadow: 0px 0px 1.53846vw rgba(0, 0, 0, 0.3);
}
:global(.rc-menu)-horizontal:global(.rc-menu)-sub a,
:global(.rc-menu)-vertical:global(.rc-menu)-sub a,
:global(.rc-menu)-vertical-left:global(.rc-menu)-sub a,
:global(.rc-menu)-vertical-right:global(.rc-menu)-sub a {
  color: #ffffff;
}
:global(.rc-menu)-item,
:global(.rc-menu)-submenu-title {
  margin: 0;
  position: relative;
  display: block;
  padding: 1.79487vw;
  white-space: nowrap;
}
:global(.rc-menu) > :global(.rc-menu)-item-divider {
  height: 1px;
  margin: 1px 0;
  overflow: hidden;
  padding: 0;
  line-height: 0;
  background-color: #e5e5e5;
}
:global(.rc-menu)-submenu-popup {
  position: absolute;
  z-index: 10;
}
:global(.rc-menu) .rc-menu-submenu-title .anticon,
:global(.rc-menu) .rc-menu-item .anticon {
  width: 3.58974vw;
  height: 3.58974vw;
  margin-right: 2.05128vw;
  top: -1px;
}
:global(.rc-menu)-horizontal {
  border: none;
  box-shadow: none;
}
:global(.rc-menu)-horizontal > .rc-menu-item,
:global(.rc-menu)-horizontal > .rc-menu-submenu > .rc-menu-submenu-title {
  padding: 3.84615vw 5.12821vw;
}
:global(.rc-menu)-horizontal > .rc-menu-submenu,
:global(.rc-menu)-horizontal > .rc-menu-item {
  float: left;
  border-bottom: 0.51282vw solid transparent;
}
:global(.rc-menu)-horizontal > .rc-menu-submenu-active,
:global(.rc-menu)-horizontal > .rc-menu-item-active {
  background-color: #6c29eb;
  color: rgba(255, 255, 255, 0.6);
}
:global(.rc-menu)-horizontal:after {
  content: " ";
  display: block;
  height: 0;
  clear: both;
}
:global(.rc-menu)-vertical,
:global(.rc-menu)-vertical-left,
:global(.rc-menu)-vertical-right,
:global(.rc-menu)-inline {
  padding: 3.07692vw 0;
}
:global(.rc-menu)-vertical > .rc-menu-item,
:global(.rc-menu)-vertical-left > .rc-menu-item,
:global(.rc-menu)-vertical-right > .rc-menu-item,
:global(.rc-menu)-inline > .rc-menu-item,
:global(.rc-menu)-vertical > .rc-menu-submenu > .rc-menu-submenu-title,
:global(.rc-menu)-vertical-left > .rc-menu-submenu > .rc-menu-submenu-title,
:global(.rc-menu)-vertical-right > .rc-menu-submenu > .rc-menu-submenu-title,
:global(.rc-menu)-inline > .rc-menu-submenu > .rc-menu-submenu-title {
  padding: 3.07692vw;
}
:global(.rc-menu)-vertical .rc-menu-submenu-arrow,
:global(.rc-menu)-vertical-left .rc-menu-submenu-arrow,
:global(.rc-menu)-vertical-right .rc-menu-submenu-arrow,
:global(.rc-menu)-inline .rc-menu-submenu-arrow {
  display: inline-block;
  font: normal normal normal 3.58974vw/1 iconfontshble;
  font-size: inherit;
  vertical-align: baseline;
  text-align: center;
  text-transform: none;
  text-rendering: auto;
  position: absolute;
  right: 4.10256vw;
  line-height: 1.5em;
}
:global(.rc-menu)-vertical .rc-menu-submenu-arrow:before,
:global(.rc-menu)-vertical-left .rc-menu-submenu-arrow:before,
:global(.rc-menu)-vertical-right .rc-menu-submenu-arrow:before,
:global(.rc-menu)-inline .rc-menu-submenu-arrow:before {
  content: "\E61F";
}
:global(.rc-menu)-inline .rc-menu-submenu-arrow {
  transform: rotate(90deg);
  transition: transform 0.3s;
}
:global(.rc-menu)-inline .rc-menu-submenu-open > .rc-menu-submenu-title .rc-menu-submenu-arrow {
  transform: rotate(-90deg);
}
:global(.rc-menu)-vertical:global(.rc-menu)-sub,
:global(.rc-menu)-vertical-left:global(.rc-menu)-sub,
:global(.rc-menu)-vertical-right:global(.rc-menu)-sub {
  padding: 0;
}
:global(.rc-menu)-sub:global(.rc-menu)-inline {
  padding: 0;
  border: none;
  border-radius: 0;
  box-shadow: none;
}
:global(.rc-menu)-sub:global(.rc-menu)-inline > .rc-menu-item,
:global(.rc-menu)-sub:global(.rc-menu)-inline > .rc-menu-submenu > .rc-menu-submenu-title {
  padding-top: 2.05128vw;
  padding-bottom: 2.05128vw;
  padding-right: 0;
}
:global(.rc-menu)-open-slide-up-enter,
:global(.rc-menu)-open-slide-up-appear {
  animation-duration: 0.3s;
  animation-fill-mode: both;
  transform-origin: 0 0;
  opacity: 0;
  animation-timing-function: cubic-bezier(0.08, 0.82, 0.17, 1);
  animation-play-state: paused;
}
:global(.rc-menu)-open-slide-up-leave {
  animation-duration: 0.3s;
  animation-fill-mode: both;
  transform-origin: 0 0;
  opacity: 1;
  animation-timing-function: cubic-bezier(0.6, 0.04, 0.98, 0.34);
  animation-play-state: paused;
}
:global(.rc-menu)-open-slide-up-enter:global(.rc-menu)-open-slide-up-enter-active,
:global(.rc-menu)-open-slide-up-appear:global(.rc-menu)-open-slide-up-appear-active {
  animation-name: rcMenuOpenSlideUpIn;
  animation-play-state: running;
}
:global(.rc-menu)-open-slide-up-leave:global(.rc-menu)-open-slide-up-leave-active {
  animation-name: rcMenuOpenSlideUpOut;
  animation-play-state: running;
}
@keyframes rcMenuOpenSlideUpIn {
  0% {
    opacity: 0;
    transform-origin: 0% 0%;
    transform: scaleY(0);
  }
  100% {
    opacity: 1;
    transform-origin: 0% 0%;
    transform: scaleY(1);
  }
}
@keyframes rcMenuOpenSlideUpOut {
  0% {
    opacity: 1;
    transform-origin: 0% 0%;
    transform: scaleY(1);
  }
  100% {
    opacity: 0;
    transform-origin: 0% 0%;
    transform: scaleY(0);
  }
}
:global(.rc-menu)-open-zoom-enter,
:global(.rc-menu)-open-zoom-appear {
  opacity: 0;
  animation-duration: 0.3s;
  animation-fill-mode: both;
  transform-origin: 0 0;
  animation-timing-function: cubic-bezier(0.08, 0.82, 0.17, 1);
  animation-play-state: paused;
}
:global(.rc-menu)-open-zoom-leave {
  animation-duration: 0.3s;
  animation-fill-mode: both;
  transform-origin: 0 0;
  animation-timing-function: cubic-bezier(0.6, 0.04, 0.98, 0.34);
  animation-play-state: paused;
}
:global(.rc-menu)-open-zoom-enter:global(.rc-menu)-open-zoom-enter-active,
:global(.rc-menu)-open-zoom-appear:global(.rc-menu)-open-zoom-appear-active {
  animation-name: rcMenuOpenZoomIn;
  animation-play-state: running;
}
:global(.rc-menu)-open-zoom-leave:global(.rc-menu)-open-zoom-leave-active {
  animation-name: rcMenuOpenZoomOut;
  animation-play-state: running;
}
@keyframes rcMenuOpenZoomIn {
  0% {
    opacity: 0;
    transform: scale(0, 0);
  }
  100% {
    opacity: 1;
    transform: scale(1, 1);
  }
}
@keyframes rcMenuOpenZoomOut {
  0% {
    transform: scale(1, 1);
  }
  100% {
    opacity: 0;
    transform: scale(0, 0);
  }
}

.up-color {
  color: var(--FC-green) !important;
}
.up-color.reverse {
  color: var(--FC-red) !important;
}

.down-color {
  color: var(--FC-red) !important;
}
.down-color.reverse {
  color: var(--FC-green) !important;
}
.bordercolor{
  border-color: transparent !important;
  color: var(--TC2) !important;
}
.up-bordercolor  {
  border-color: var(--FC-green) !important;
  color: var(--FC-green) !important;
}
.up-bordercolor.reverse {
  border-color: var(--FC-red) !important;
  color: var(--FC-red) !important;
}

.down-bordercolor {
   border-color: var(--FC-red) !important;
  color: var(--FC-red) !important;
 
}
.down-bordercolor.reverse {
  border-color: var(--FC-green) !important;
  color: var(--FC-green) !important;
}
.up-bgcolor {
  background: var(--FC-green) !important;
  color: var(--FC-white) !important;
}
.up-bgcolor.reverse {
  background: var(--FC-red) !important;
}

.down-bgcolor {
  background: var(--FC-red) !important;
  color: var(--FC-white) !important;
}
.down-bgcolor.reverse {
  background: var(--FC-green) !important;
}

/* 数字字体要求 */
.number-font {
  font-family: 'Urbanist-Medium' !important;
}

.marquee {
  height: 100%;
  width: 100%;
  overflow: hidden;
  position: relative;
}

.marquee div {
  display: block;
  width: 200%;
  height: 100%;

  position: absolute;
  overflow: hidden;

  animation: marquee 15s linear infinite;
}
.num-font {
  font-family: 'Urbanist-Regular' !important;
}
.num-font-medium {
  font-family: 'Urbanist-Medium' !important;
}
@keyframes marquee {
  0% { left: 0; }
  100% { left: -100%; }
}
.side_type {
  width: 27.69231vw;
}
@media screen and (max-width: 1446px){
  .side_type {
    width: 82px;
  }
}
@media screen and (max-width: 1366px){
  .side_type {
    width: 72px;
  }
}
.MuiPaper-root.common-paper{
  background: var(--PB);
  color: var(--TC1) ;
}
.MuiButton-label .MuiButton-endIcon{
  margin-left: 0;
}
/* .banner_img.dark::before{
    background: linear-gradient( 270deg, rgba(9,10,12,0) 0%, rgba(9,10,12,0.5) 39%, #090A0C 93%);
}

.banner_img.light::before{
    background: linear-gradient( 270deg, rgba(250,250,250,0) 0%, rgba(250,250,250,0.5) 39%, #FAFAFA 93%);
}

.banner_img.dark::after{
    background: linear-gradient( 90deg, rgba(9,10,12,0) 0%, #090A0C 100%);
}
.banner_img.light::after{
    background: linear-gradient( 90deg, rgba(250,250,250,0) 0%, #FAFAFA 100%);
} */