* {
  font-family: inherit
}

a,
b,
body,
button,
dd,
div,
dl,
dt,
em,
fieldset,
footer,
form,
h1,
h2,
h3,
h4,
h5,
h6,
header,
html,
i,
img,
input,
li,
ol,
p,
pre,
select,
span,
strong,
td,
textarea,
th,
ul {
  -webkit-tap-highlight-color: transparent;
  -webkit-appearance: none;
  margin: 0;
  padding: 0
}

body,
html {
  -webkit-overflow-scrolling: touch;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
  -webkit-text-size-adjust: none;
  -ms-text-size-adjust: none;
  text-size-adjust: none;
  -webkit-user-select: text;
  -moz-user-select: text;
  -ms-user-select: text;
  user-select: text
}

iframe {
  border: 0
}

table {
  border-collapse: collapse;
  border-spacing: 0
}

a {
  cursor: pointer
}

a,
a:active,
a:hover {
  text-decoration: none
}

a:active,
a:hover {
  outline-width: 0
}

li,
ol,
ul {
  list-style: none
}

button,
input,
select,
textarea {
  -webkit-appearance: none;
  -moz-appearance: none;
  appearance: none;
  background-color: initial;
  border: none;
  border-radius: 0;
  box-shadow: none;
  outline: 0;
  resize: none
}

input[type=number] {
  -moz-appearance: textfield
}

input[type=number]::-webkit-inner-spin-button,
input[type=number]::-webkit-outer-spin-button {
  -webkit-appearance: none;
  margin: 0
}

b,
em,
i,
strong {
  font-style: normal
}

@font-face {
  font-display: swap;
  font-family: OKXSans;
  font-style: normal;
  font-weight: 200;
  src: url(/cdn/assets/okfe/libs/fonts/OKX_Sans/Thin.woff2) format("woff2")
}

@font-face {
  font-display: swap;
  font-family: OKXSans;
  font-style: normal;
  font-weight: 300;
  src: url(/cdn/assets/okfe/libs/fonts/OKX_Sans/Light.woff2) format("woff2")
}

@font-face {
  font-display: swap;
  font-family: OKXSans;
  font-style: normal;
  font-weight: 400;
  src: url(/cdn/assets/okfe/libs/fonts/OKX_Sans/Regular.woff2) format("woff2")
}

@font-face {
  font-display: swap;
  font-family: OKXSans;
  font-style: normal;
  font-weight: 500;
  src: url(/cdn/assets/okfe/libs/fonts/OKX_Sans/Medium.woff2) format("woff2")
}

@font-face {
  font-display: swap;
  font-family: OKXSans;
  font-style: normal;
  font-weight: 600;
  src: url(/cdn/assets/okfe/libs/fonts/OKX_Sans/Bold.woff2) format("woff2")
}

body {
  --okx-font-family: "OKXSans", "apple-system", "BlinkMacSystemFont", "Helvetica Neue", "PingFang SC", "Hiragino Sans GB", "Microsoft YaHei", "Arial", "sans-serif"
}

[lang=ar] body,
[lang=vi] body {
  --okx-font-family: Arial, sans-serif
}

body {
  font-family: var(--okx-font-family) !important
}

a,
b,
body,
button,
dd,
div,
dl,
dt,
em,
fieldset,
footer,
form,
h1,
h2,
h3,
h4,
h5,
h6,
header,
html,
i,
img,
input,
li,
ol,
p,
pre,
select,
span,
strong,
td,
textarea,
th,
ul {
  font-size: 100%
}

body,
html {
  font-size: 14px;
  line-height: 1
}

img,
video {
  height: auto;
  max-width: 100%
}

h1,
h2,
h3,
h4,
h5,
h6 {
  font-size: 1em;
  font-weight: 400
}

button,
fieldset,
input,
label,
legend,
option,
select,
textarea {
  font-size: 1em
}

b,
em,
i,
strong {
  font-weight: 400
}

:root {
  --nav-global-body-bg-color: transparent
}

html.white-bg {
  --nav-global-body-bg-color: #fff
}

body,
html {
  background: transparent;
  background: var(--nav-global-body-bg-color);
  color: #000;
  margin: 0
}

@media (max-width:1024px) {
  iframe[name=intercom-banner-frame] {
    display: none !important
  }
}

:root {
  --global-scrollbar-width: 4px;
  --global-scrollbar-height: 6px;
  --global-scrollbar-border-radius: 8px
}

.theme-light,
body {
  --global-scrollbar-background: rgba(0, 0, 0, .26)
}

.theme-dark {
  --global-scrollbar-background: hsla(0, 0%, 100%, .36)
}

body ::-webkit-scrollbar {
  background-color: initial;
  height: 0;
  width: 4px;
  width: var(--global-scrollbar-width)
}

body ::-webkit-scrollbar-track {
  background-color: initial
}

body ::-webkit-scrollbar-thumb {
  background-color: var(--global-scrollbar-background);
  border-radius: 8px;
  border-radius: var(--global-scrollbar-border-radius)
}

body.theme-dark ::-webkit-scrollbar,
body.theme-dark ::-webkit-scrollbar-track {
  background-color: initial
}

body ::-webkit-scrollbar-corner {
  background-color: initial
}

.okx-header-footer-dex-outline {
  --ok-icon-font-family: "ok-f5350cc488"
}

.okx-header-footer-dex-outline:before {
  content: "\e0f7";
  font-family: ok-f5350cc488
}

.okx-header-footer-professional-traders {
  --ok-icon-font-family: "ok-f5350cc488"
}

.okx-header-footer-professional-traders:before {
  content: "\e0f6";
  font-family: ok-f5350cc488
}

.okx-header-footer-t-chart {
  --ok-icon-font-family: "ok-f5350cc488"
}

.okx-header-footer-t-chart:before {
  content: "\e0f5";
  font-family: ok-f5350cc488
}

.okx-header-footer-options {
  --ok-icon-font-family: "ok-f5350cc488"
}

.okx-header-footer-options:before {
  content: "\e0f4";
  font-family: ok-f5350cc488
}

.okx-header-footer-X-Drops {
  --ok-icon-font-family: "ok-f5350cc488"
}

.okx-header-footer-X-Drops:before {
  content: "\e0f3";
  font-family: ok-f5350cc488
}

.okx-header-footer-trendy-news {
  --ok-icon-font-family: "ok-f5350cc488"
}

.okx-header-footer-trendy-news:before {
  content: "\e0f2";
  font-family: ok-f5350cc488
}

.okx-header-footer-feed {
  --ok-icon-font-family: "ok-f5350cc488"
}

.okx-header-footer-feed:before {
  content: "\e0f1";
  font-family: ok-f5350cc488
}

.okx-header-footer-fire-flame_filled {
  --ok-icon-font-family: "ok-f5350cc488"
}

.okx-header-footer-fire-flame_filled:before {
  content: "\e0f0";
  font-family: ok-f5350cc488
}

.okx-header-footer-okds-pointer_up {
  --ok-icon-font-family: "ok-f5350cc488"
}

.okx-header-footer-okds-pointer_up:before {
  content: "\e0ee";
  font-family: ok-f5350cc488
}

.okx-header-footer-pointer-down {
  --ok-icon-font-family: "ok-f5350cc488"
}

.okx-header-footer-pointer-down:before {
  content: "\e0ef";
  font-family: ok-f5350cc488
}

.okx-header-footer-getting-started {
  --ok-icon-font-family: "ok-f5350cc488"
}

.okx-header-footer-getting-started:before {
  content: "\e0ed";
  font-family: ok-f5350cc488
}

.okx-header-footer-calculator {
  --ok-icon-font-family: "ok-f5350cc488"
}

.okx-header-footer-calculator:before {
  content: "\e0ec";
  font-family: ok-f5350cc488
}

.okx-header-footer-flash-earn-outline {
  --ok-icon-font-family: "ok-f5350cc488"
}

.okx-header-footer-flash-earn-outline:before {
  content: "\e0eb";
  font-family: ok-f5350cc488
}

.okx-header-footer-institutional-loans {
  --ok-icon-font-family: "ok-f5350cc488"
}

.okx-header-footer-institutional-loans:before {
  content: "\e0ea";
  font-family: ok-f5350cc488
}

.okx-header-footer-message {
  --ok-icon-font-family: "ok-f5350cc488"
}

.okx-header-footer-message:before {
  content: "\e0e9";
  font-family: ok-f5350cc488
}

.okx-header-footer-caret-up {
  --ok-icon-font-family: "ok-f5350cc488"
}

.okx-header-footer-caret-up:before {
  content: "\e0e7";
  font-family: ok-f5350cc488
}

.okx-header-footer-okx-rubix {
  --ok-icon-font-family: "ok-f5350cc488"
}

.okx-header-footer-okx-rubix:before {
  content: "\e0e6";
  font-family: ok-f5350cc488
}

.okx-header-footer-copiers {
  --ok-icon-font-family: "ok-f5350cc488"
}

.okx-header-footer-copiers:before {
  content: "\e01d";
  font-family: ok-f5350cc488
}

.okx-header-footer-web3-rewards {
  --ok-icon-font-family: "ok-f5350cc488"
}

.okx-header-footer-web3-rewards:before {
  content: "\e0e5";
  font-family: ok-f5350cc488
}

.okx-header-footer-web3-cryptopedia-updated {
  --ok-icon-font-family: "ok-f5350cc488"
}

.okx-header-footer-web3-cryptopedia-updated:before {
  content: "\e0a9";
  font-family: ok-f5350cc488
}

.okx-header-footer-perpetual {
  --ok-icon-font-family: "ok-f5350cc488"
}

.okx-header-footer-perpetual:before {
  content: "\e0b2";
  font-family: ok-f5350cc488
}

.okx-header-footer-white-paper {
  --ok-icon-font-family: "ok-f5350cc488"
}

.okx-header-footer-white-paper:before {
  content: "\e0e4";
  font-family: ok-f5350cc488
}

.okx-header-footer-web3-toolkit {
  --ok-icon-font-family: "ok-f5350cc488"
}

.okx-header-footer-web3-toolkit:before {
  content: "\e0e3";
  font-family: ok-f5350cc488
}

.okx-header-footer-nft {
  --ok-icon-font-family: "ok-f5350cc488"
}

.okx-header-footer-nft:before {
  content: "\e067";
  font-family: ok-f5350cc488
}

.okx-header-footer-web3-liquidity {
  --ok-icon-font-family: "ok-f5350cc488"
}

.okx-header-footer-web3-liquidity:before {
  content: "\e0e2";
  font-family: ok-f5350cc488
}

.okx-header-footer-web3-faucet {
  --ok-icon-font-family: "ok-f5350cc488"
}

.okx-header-footer-web3-faucet:before {
  content: "\e0c5";
  font-family: ok-f5350cc488
}

.okx-header-footer-unlink {
  --ok-icon-font-family: "ok-f5350cc488"
}

.okx-header-footer-unlink:before {
  content: "\e0e1";
  font-family: ok-f5350cc488
}

.okx-header-footer-transaction {
  --ok-icon-font-family: "ok-f5350cc488"
}

.okx-header-footer-transaction:before {
  content: "\e0e0";
  font-family: ok-f5350cc488
}

.okx-header-footer-trading-data {
  --ok-icon-font-family: "ok-f5350cc488"
}

.okx-header-footer-trading-data:before {
  content: "\e0c6";
  font-family: ok-f5350cc488
}

.okx-header-footer-tokens-outline {
  --ok-icon-font-family: "ok-f5350cc488"
}

.okx-header-footer-tokens-outline:before {
  content: "\e0df";
  font-family: ok-f5350cc488
}

.okx-header-footer-setting {
  --ok-icon-font-family: "ok-f5350cc488"
}

.okx-header-footer-setting:before {
  content: "\e076";
  font-family: ok-f5350cc488
}

.okx-header-footer-search {
  --ok-icon-font-family: "ok-f5350cc488"
}

.okx-header-footer-search:before {
  content: "\e0a5";
  font-family: ok-f5350cc488
}

.okx-header-footer-official-website-api {
  --ok-icon-font-family: "ok-f5350cc488"
}

.okx-header-footer-official-website-api:before {
  content: "\e0de";
  font-family: ok-f5350cc488
}

.okx-header-footer-link {
  --ok-icon-font-family: "ok-f5350cc488"
}

.okx-header-footer-link:before {
  content: "\e0a4";
  font-family: ok-f5350cc488
}

.okx-header-footer-globe {
  --ok-icon-font-family: "ok-f5350cc488"
}

.okx-header-footer-globe:before {
  content: "\e0dd";
  font-family: ok-f5350cc488
}

.okx-header-footer-futures-outline {
  --ok-icon-font-family: "ok-f5350cc488"
}

.okx-header-footer-futures-outline:before {
  content: "\e0dc";
  font-family: ok-f5350cc488
}

.okx-header-footer-discover {
  --ok-icon-font-family: "ok-f5350cc488"
}

.okx-header-footer-discover:before {
  content: "\e0ab";
  font-family: ok-f5350cc488
}

.okx-header-footer-copy {
  --ok-icon-font-family: "ok-f5350cc488"
}

.okx-header-footer-copy:before {
  content: "\e0db";
  font-family: ok-f5350cc488
}

.okx-header-footer-bridge-1 {
  --ok-icon-font-family: "ok-f5350cc488"
}

.okx-header-footer-bridge-1:before {
  content: "\e008";
  font-family: ok-f5350cc488
}

.okx-header-footer-blockchain-explorer {
  --ok-icon-font-family: "ok-f5350cc488"
}

.okx-header-footer-blockchain-explorer:before {
  content: "\e007";
  font-family: ok-f5350cc488
}

.okx-header-footer-api-keys {
  --ok-icon-font-family: "ok-f5350cc488"
}

.okx-header-footer-api-keys:before {
  content: "\e0da";
  font-family: ok-f5350cc488
}

.okx-header-footer-dex-network-fee-fast {
  --ok-icon-font-family: "ok-f5350cc488"
}

.okx-header-footer-dex-network-fee-fast:before {
  content: "\e0d9";
  font-family: ok-f5350cc488
}

.okx-header-footer-dex-loan {
  --ok-icon-font-family: "ok-f5350cc488"
}

.okx-header-footer-dex-loan:before {
  content: "\e0d7";
  font-family: ok-f5350cc488
}

.okx-header-footer-web3-dapp-rankings {
  --ok-icon-font-family: "ok-f5350cc488"
}

.okx-header-footer-web3-dapp-rankings:before {
  content: "\e0b1";
  font-family: ok-f5350cc488
}

.okx-header-footer-earn-outline {
  --ok-icon-font-family: "ok-f5350cc488"
}

.okx-header-footer-earn-outline:before {
  content: "\e0d4";
  font-family: ok-f5350cc488
}

.okx-header-footer-security {
  --ok-icon-font-family: "ok-f5350cc488"
}

.okx-header-footer-security:before {
  content: "\e0d5";
  font-family: ok-f5350cc488
}

.okx-header-footer-bell {
  --ok-icon-font-family: "ok-f5350cc488"
}

.okx-header-footer-bell:before {
  content: "\e0d6";
  font-family: ok-f5350cc488
}

.okx-header-footer-risk-unit-portal {
  --ok-icon-font-family: "ok-f5350cc488"
}

.okx-header-footer-risk-unit-portal:before {
  content: "\e0d3";
  font-family: ok-f5350cc488
}

.okx-header-footer-builder-deck {
  --ok-icon-font-family: "ok-f5350cc488"
}

.okx-header-footer-builder-deck:before {
  content: "\e0d2";
  font-family: ok-f5350cc488
}

.okx-header-footer-network-fee-fast {
  --ok-icon-font-family: "ok-f5350cc488"
}

.okx-header-footer-network-fee-fast:before {
  content: "\e0d0";
  font-family: ok-f5350cc488
}

.okx-header-footer-cash-fiat {
  --ok-icon-font-family: "ok-f5350cc488"
}

.okx-header-footer-cash-fiat:before {
  content: "\e0cf";
  font-family: ok-f5350cc488
}

.okx-header-footer-wholesale {
  --ok-icon-font-family: "ok-f5350cc488"
}

.okx-header-footer-wholesale:before {
  content: "\e0ce";
  font-family: ok-f5350cc488
}

.okx-header-footer-okx-filled {
  --ok-icon-font-family: "ok-f5350cc488"
}

.okx-header-footer-okx-filled:before {
  content: "\e0cd";
  font-family: ok-f5350cc488
}

.okx-header-footer-star {
  --ok-icon-font-family: "ok-f5350cc488"
}

.okx-header-footer-star:before {
  content: "\e0cc";
  font-family: ok-f5350cc488
}

.okx-header-footer-vip {
  --ok-icon-font-family: "ok-f5350cc488"
}

.okx-header-footer-vip:before {
  content: "\e0cb";
  font-family: ok-f5350cc488
}

.okx-header-footer-google-play {
  --ok-icon-font-family: "ok-f5350cc488"
}

.okx-header-footer-google-play:before {
  content: "\e0ca";
  font-family: ok-f5350cc488
}

.okx-header-footer-extension-filled {
  --ok-icon-font-family: "ok-f5350cc488"
}

.okx-header-footer-extension-filled:before {
  content: "\e0c9";
  font-family: ok-f5350cc488
}

.okx-header-footer-apple {
  --ok-icon-font-family: "ok-f5350cc488"
}

.okx-header-footer-apple:before {
  content: "\e0c8";
  font-family: ok-f5350cc488
}

.okx-header-footer-android {
  --ok-icon-font-family: "ok-f5350cc488"
}

.okx-header-footer-android:before {
  content: "\e0c7";
  font-family: ok-f5350cc488
}

.okx-header-footer-xlayer {
  --ok-icon-font-family: "ok-f5350cc488"
}

.okx-header-footer-xlayer:before {
  content: "\e0c3";
  font-family: ok-f5350cc488
}

.okx-header-footer-github {
  --ok-icon-font-family: "ok-f5350cc488"
}

.okx-header-footer-github:before {
  content: "\e035";
  font-family: ok-f5350cc488
}

.okx-header-footer-official-website {
  --ok-icon-font-family: "ok-f5350cc488"
}

.okx-header-footer-official-website:before {
  content: "\e0c4";
  font-family: ok-f5350cc488
}

.okx-header-footer-personal-setting {
  --ok-icon-font-family: "ok-f5350cc488"
}

.okx-header-footer-personal-setting:before {
  content: "\e0c2";
  font-family: ok-f5350cc488
}

.okx-header-footer-web3 {
  --ok-icon-font-family: "ok-f5350cc488"
}

.okx-header-footer-web3:before {
  content: "\e0c1";
  font-family: ok-f5350cc488
}

.okx-header-footer-night-outline {
  --ok-icon-font-family: "ok-f5350cc488"
}

.okx-header-footer-night-outline:before {
  content: "\e0c0";
  font-family: ok-f5350cc488
}

.okx-header-footer-night-filled {
  --ok-icon-font-family: "ok-f5350cc488"
}

.okx-header-footer-night-filled:before {
  content: "\e0bf";
  font-family: ok-f5350cc488
}

.okx-header-footer-light-outline {
  --ok-icon-font-family: "ok-f5350cc488"
}

.okx-header-footer-light-outline:before {
  content: "\e0be";
  font-family: ok-f5350cc488
}

.okx-header-footer-light-filled {
  --ok-icon-font-family: "ok-f5350cc488"
}

.okx-header-footer-light-filled:before {
  content: "\e0bd";
  font-family: ok-f5350cc488
}

.okx-header-footer-computer-outline {
  --ok-icon-font-family: "ok-f5350cc488"
}

.okx-header-footer-computer-outline:before {
  content: "\e0bc";
  font-family: ok-f5350cc488
}

.okx-header-footer-computer-filled {
  --ok-icon-font-family: "ok-f5350cc488"
}

.okx-header-footer-computer-filled:before {
  content: "\e0bb";
  font-family: ok-f5350cc488
}

.okx-header-footer-xbtc {
  --ok-icon-font-family: "ok-f5350cc488"
}

.okx-header-footer-xbtc:before {
  content: "\e0ba";
  font-family: ok-f5350cc488
}

.okx-header-footer-question-mark {
  --ok-icon-font-family: "ok-f5350cc488"
}

.okx-header-footer-question-mark:before {
  content: "\e0b9";
  font-family: ok-f5350cc488
}

.okx-header-footer-fire-flame {
  --ok-icon-font-family: "ok-f5350cc488"
}

.okx-header-footer-fire-flame:before {
  content: "\e0b8";
  font-family: ok-f5350cc488
}

.okx-header-footer-leaderboard {
  --ok-icon-font-family: "ok-f5350cc488"
}

.okx-header-footer-leaderboard:before {
  content: "\e0b3";
  font-family: ok-f5350cc488
}

.okx-header-footer-pump {
  --ok-icon-font-family: "ok-f5350cc488"
}

.okx-header-footer-pump:before {
  content: "\e0b4";
  font-family: ok-f5350cc488
}

.okx-header-footer-signal {
  --ok-icon-font-family: "ok-f5350cc488"
}

.okx-header-footer-signal:before {
  content: "\e0b6";
  font-family: ok-f5350cc488
}

.okx-header-footer-tracker {
  --ok-icon-font-family: "ok-f5350cc488"
}

.okx-header-footer-tracker:before {
  content: "\e0b7";
  font-family: ok-f5350cc488
}

.okx-header-footer-trading-mmportal {
  --ok-icon-font-family: "ok-f5350cc488"
}

.okx-header-footer-trading-mmportal:before {
  content: "\e0b0";
  font-family: ok-f5350cc488
}

.okx-header-footer-user-protection {
  --ok-icon-font-family: "ok-f5350cc488"
}

.okx-header-footer-user-protection:before {
  content: "\e0af";
  font-family: ok-f5350cc488
}

.okx-header-footer-defi-recognized {
  --ok-icon-font-family: "ok-f5350cc488"
}

.okx-header-footer-defi-recognized:before {
  content: "\e0ae";
  font-family: ok-f5350cc488
}

.okx-header-footer-token {
  --ok-icon-font-family: "ok-f5350cc488"
}

.okx-header-footer-token:before {
  content: "\e0ac";
  font-family: ok-f5350cc488
}

.okx-header-footer-exchange-rate {
  --ok-icon-font-family: "ok-f5350cc488"
}

.okx-header-footer-exchange-rate:before {
  content: "\e0ad";
  font-family: ok-f5350cc488
}

.okx-header-footer-loan-updated {
  --ok-icon-font-family: "ok-f5350cc488"
}

.okx-header-footer-loan-updated:before {
  content: "\e0a8";
  font-family: ok-f5350cc488
}

.okx-header-footer-referral-updated {
  --ok-icon-font-family: "ok-f5350cc488"
}

.okx-header-footer-referral-updated:before {
  content: "\e0aa";
  font-family: ok-f5350cc488
}

.okx-header-footer-bridge-updated {
  --ok-icon-font-family: "ok-f5350cc488"
}

.okx-header-footer-bridge-updated:before {
  content: "\e0a7";
  font-family: ok-f5350cc488
}

.okx-header-footer-pro-trade {
  --ok-icon-font-family: "ok-f5350cc488"
}

.okx-header-footer-pro-trade:before {
  content: "\e0a6";
  font-family: ok-f5350cc488
}

.okx-header-footer-web3-defi {
  --ok-icon-font-family: "ok-f5350cc488"
}

.okx-header-footer-web3-defi:before {
  content: "\e0a3";
  font-family: ok-f5350cc488
}

.okx-header-footer-trading-nmp {
  --ok-icon-font-family: "ok-f5350cc488"
}

.okx-header-footer-trading-nmp:before {
  content: "\e0a1";
  font-family: ok-f5350cc488
}

.okx-header-footer-fireworks {
  --ok-icon-font-family: "ok-f5350cc488"
}

.okx-header-footer-fireworks:before {
  content: "\e0a0";
  font-family: ok-f5350cc488
}

.okx-header-footer-futures-copy {
  --ok-icon-font-family: "ok-f5350cc488"
}

.okx-header-footer-futures-copy:before {
  content: "\e09f";
  font-family: ok-f5350cc488
}

.okx-header-footer-premarket {
  --ok-icon-font-family: "ok-f5350cc488"
}

.okx-header-footer-premarket:before {
  content: "\e09e";
  font-family: ok-f5350cc488
}

.okx-header-footer-user {
  --ok-icon-font-family: "ok-f5350cc488"
}

.okx-header-footer-user:before {
  content: "\e08a";
  font-family: ok-f5350cc488
}

.okx-header-footer-tips {
  --ok-icon-font-family: "ok-f5350cc488"
}

.okx-header-footer-tips:before {
  content: "\e09d";
  font-family: ok-f5350cc488
}

.okx-header-footer-testnetbridge {
  --ok-icon-font-family: "ok-f5350cc488"
}

.okx-header-footer-testnetbridge:before {
  content: "\e09c";
  font-family: ok-f5350cc488
}

.okx-header-footer-crypto-gifts {
  --ok-icon-font-family: "ok-f5350cc488"
}

.okx-header-footer-crypto-gifts:before {
  content: "\e09b";
  font-family: ok-f5350cc488
}

.okx-header-footer-listing-application {
  --ok-icon-font-family: "ok-f5350cc488"
}

.okx-header-footer-listing-application:before {
  content: "\e09a";
  font-family: ok-f5350cc488
}

.okx-header-footer-spot-copy {
  --ok-icon-font-family: "ok-f5350cc488"
}

.okx-header-footer-spot-copy:before {
  content: "\e098";
  font-family: ok-f5350cc488
}

.okx-header-footer-trader-recruitment {
  --ok-icon-font-family: "ok-f5350cc488"
}

.okx-header-footer-trader-recruitment:before {
  content: "\e097";
  font-family: ok-f5350cc488
}

.okx-header-footer-flash-otc {
  --ok-icon-font-family: "ok-f5350cc488"
}

.okx-header-footer-flash-otc:before {
  content: "\e096";
  font-family: ok-f5350cc488
}

.okx-header-footer-explorer {
  --ok-icon-font-family: "ok-f5350cc488"
}

.okx-header-footer-explorer:before {
  content: "\e095";
  font-family: ok-f5350cc488
}

.okx-header-footer-analysis {
  --ok-icon-font-family: "ok-f5350cc488"
}

.okx-header-footer-analysis:before {
  content: "\e000";
  font-family: ok-f5350cc488
}

.okx-header-footer--ecosystem {
  --ok-icon-font-family: "ok-f5350cc488"
}

.okx-header-footer--ecosystem:before {
  content: "\e001";
  font-family: ok-f5350cc488
}

.okx-header-footer-api-1 {
  --ok-icon-font-family: "ok-f5350cc488"
}

.okx-header-footer-api-1:before {
  content: "\e002";
  font-family: ok-f5350cc488
}

.okx-header-footer-arrow-chevrons-right {
  --ok-icon-font-family: "ok-f5350cc488"
}

.okx-header-footer-arrow-chevrons-right:before {
  content: "\e003";
  font-family: ok-f5350cc488
}

.okx-header-footer-arrow-chevrons-up {
  --ok-icon-font-family: "ok-f5350cc488"
}

.okx-header-footer-arrow-chevrons-up:before {
  content: "\e004";
  font-family: ok-f5350cc488
}

.okx-header-footer-authorization {
  --ok-icon-font-family: "ok-f5350cc488"
}

.okx-header-footer-authorization:before {
  content: "\e005";
  font-family: ok-f5350cc488
}

.okx-header-footer-biyong {
  --ok-icon-font-family: "ok-f5350cc488"
}

.okx-header-footer-biyong:before {
  content: "\e006";
  font-family: ok-f5350cc488
}

.okx-header-footer-api {
  --ok-icon-font-family: "ok-f5350cc488"
}

.okx-header-footer-api:before {
  content: "\e009";
  font-family: ok-f5350cc488
}

.okx-header-footer-blockdream-ventures-1 {
  --ok-icon-font-family: "ok-f5350cc488"
}

.okx-header-footer-blockdream-ventures-1:before {
  content: "\e00a";
  font-family: ok-f5350cc488
}

.okx-header-footer-arbitrage-order {
  --ok-icon-font-family: "ok-f5350cc488"
}

.okx-header-footer-arbitrage-order:before {
  content: "\e00b";
  font-family: ok-f5350cc488
}

.okx-header-footer-arrow-chevrons-down {
  --ok-icon-font-family: "ok-f5350cc488"
}

.okx-header-footer-arrow-chevrons-down:before {
  content: "\e00c";
  font-family: ok-f5350cc488
}

.okx-header-footer-copytrading {
  --ok-icon-font-family: "ok-f5350cc488"
}

.okx-header-footer-copytrading:before {
  content: "\e00d";
  font-family: ok-f5350cc488
}

.okx-header-footer-cryptopedia {
  --ok-icon-font-family: "ok-f5350cc488"
}

.okx-header-footer-cryptopedia:before {
  content: "\e00e";
  font-family: ok-f5350cc488
}

.okx-header-footer-create-a-bot {
  --ok-icon-font-family: "ok-f5350cc488"
}

.okx-header-footer-create-a-bot:before {
  content: "\e00f";
  font-family: ok-f5350cc488
}

.okx-header-footer-dapp {
  --ok-icon-font-family: "ok-f5350cc488"
}

.okx-header-footer-dapp:before {
  content: "\e010";
  font-family: ok-f5350cc488
}

.okx-header-footer-bridge {
  --ok-icon-font-family: "ok-f5350cc488"
}

.okx-header-footer-bridge:before {
  content: "\e011";
  font-family: ok-f5350cc488
}

.okx-header-footer-arrow-pointer-left-sm {
  --ok-icon-font-family: "ok-f5350cc488"
}

.okx-header-footer-arrow-pointer-left-sm:before {
  content: "\e012";
  font-family: ok-f5350cc488
}

.okx-header-footer-buy-crypto {
  --ok-icon-font-family: "ok-f5350cc488"
}

.okx-header-footer-buy-crypto:before {
  content: "\e013";
  font-family: ok-f5350cc488
}

.okx-header-footer-broker {
  --ok-icon-font-family: "ok-f5350cc488"
}

.okx-header-footer-broker:before {
  content: "\e014";
  font-family: ok-f5350cc488
}

.okx-header-footer-buy-with-card {
  --ok-icon-font-family: "ok-f5350cc488"
}

.okx-header-footer-buy-with-card:before {
  content: "\e015";
  font-family: ok-f5350cc488
}

.okx-header-footer-celue {
  --ok-icon-font-family: "ok-f5350cc488"
}

.okx-header-footer-celue:before {
  content: "\e016";
  font-family: ok-f5350cc488
}

.okx-header-footer-center {
  --ok-icon-font-family: "ok-f5350cc488"
}

.okx-header-footer-center:before {
  content: "\e017";
  font-family: ok-f5350cc488
}

.okx-header-footer-check {
  --ok-icon-font-family: "ok-f5350cc488"
}

.okx-header-footer-check:before {
  content: "\e018";
  font-family: ok-f5350cc488
}

.okx-header-footer-close {
  --ok-icon-font-family: "ok-f5350cc488"
}

.okx-header-footer-close:before {
  content: "\e019";
  font-family: ok-f5350cc488
}

.okx-header-footer-cloud {
  --ok-icon-font-family: "ok-f5350cc488"
}

.okx-header-footer-cloud:before {
  content: "\e01a";
  font-family: ok-f5350cc488
}

.okx-header-footer-community {
  --ok-icon-font-family: "ok-f5350cc488"
}

.okx-header-footer-community:before {
  content: "\e01b";
  font-family: ok-f5350cc488
}

.okx-header-footer-convert-1 {
  --ok-icon-font-family: "ok-f5350cc488"
}

.okx-header-footer-convert-1:before {
  content: "\e01c";
  font-family: ok-f5350cc488
}

.okx-header-footer-convert {
  --ok-icon-font-family: "ok-f5350cc488"
}

.okx-header-footer-convert:before {
  content: "\e01e";
  font-family: ok-f5350cc488
}

.okx-header-footer-copy-trading {
  --ok-icon-font-family: "ok-f5350cc488"
}

.okx-header-footer-copy-trading:before {
  content: "\e01f";
  font-family: ok-f5350cc488
}

.okx-header-footer-defi {
  --ok-icon-font-family: "ok-f5350cc488"
}

.okx-header-footer-defi:before {
  content: "\e020";
  font-family: ok-f5350cc488
}

.okx-header-footer-demo-trading-1 {
  --ok-icon-font-family: "ok-f5350cc488"
}

.okx-header-footer-demo-trading-1:before {
  content: "\e021";
  font-family: ok-f5350cc488
}

.okx-header-footer-demo-trading {
  --ok-icon-font-family: "ok-f5350cc488"
}

.okx-header-footer-demo-trading:before {
  content: "\e022";
  font-family: ok-f5350cc488
}

.okx-header-footer-deposit {
  --ok-icon-font-family: "ok-f5350cc488"
}

.okx-header-footer-deposit:before {
  content: "\e023";
  font-family: ok-f5350cc488
}

.okx-header-footer-developers {
  --ok-icon-font-family: "ok-f5350cc488"
}

.okx-header-footer-developers:before {
  content: "\e024";
  font-family: ok-f5350cc488
}

.okx-header-footer-dialogue {
  --ok-icon-font-family: "ok-f5350cc488"
}

.okx-header-footer-dialogue:before {
  content: "\e025";
  font-family: ok-f5350cc488
}

.okx-header-footer-discord {
  --ok-icon-font-family: "ok-f5350cc488"
}

.okx-header-footer-discord:before {
  content: "\e026";
  font-family: ok-f5350cc488
}

.okx-header-footer-doc {
  --ok-icon-font-family: "ok-f5350cc488"
}

.okx-header-footer-doc:before {
  content: "\e027";
  font-family: ok-f5350cc488
}

.okx-header-footer-dot {
  --ok-icon-font-family: "ok-f5350cc488"
}

.okx-header-footer-dot:before {
  content: "\e028";
  font-family: ok-f5350cc488
}

.okx-header-footer-download {
  --ok-icon-font-family: "ok-f5350cc488"
}

.okx-header-footer-download:before {
  content: "\e029";
  font-family: ok-f5350cc488
}

.okx-header-footer-earn {
  --ok-icon-font-family: "ok-f5350cc488"
}

.okx-header-footer-earn:before {
  content: "\e02a";
  font-family: ok-f5350cc488
}

.okx-header-footer-event {
  --ok-icon-font-family: "ok-f5350cc488"
}

.okx-header-footer-event:before {
  content: "\e02b";
  font-family: ok-f5350cc488
}

.okx-header-footer-ecosystem {
  --ok-icon-font-family: "ok-f5350cc488"
}

.okx-header-footer-ecosystem:before {
  content: "\e02c";
  font-family: ok-f5350cc488
}

.okx-header-footer-exclamation {
  --ok-icon-font-family: "ok-f5350cc488"
}

.okx-header-footer-exclamation:before {
  content: "\e02d";
  font-family: ok-f5350cc488
}

.okx-header-footer-facebook {
  --ok-icon-font-family: "ok-f5350cc488"
}

.okx-header-footer-facebook:before {
  content: "\e02f";
  font-family: ok-f5350cc488
}

.okx-header-footer-fees {
  --ok-icon-font-family: "ok-f5350cc488"
}

.okx-header-footer-fees:before {
  content: "\e030";
  font-family: ok-f5350cc488
}

.okx-header-footer-fixed-loan {
  --ok-icon-font-family: "ok-f5350cc488"
}

.okx-header-footer-fixed-loan:before {
  content: "\e031";
  font-family: ok-f5350cc488
}

.okx-header-footer-futures {
  --ok-icon-font-family: "ok-f5350cc488"
}

.okx-header-footer-futures:before {
  content: "\e032";
  font-family: ok-f5350cc488
}

.okx-header-footer-galex {
  --ok-icon-font-family: "ok-f5350cc488"
}

.okx-header-footer-galex:before {
  content: "\e033";
  font-family: ok-f5350cc488
}

.okx-header-footer-gasback {
  --ok-icon-font-family: "ok-f5350cc488"
}

.okx-header-footer-gasback:before {
  content: "\e034";
  font-family: ok-f5350cc488
}

.okx-header-footer-gift {
  --ok-icon-font-family: "ok-f5350cc488"
}

.okx-header-footer-gift:before {
  content: "\e036";
  font-family: ok-f5350cc488
}

.okx-header-footer-language-1 {
  --ok-icon-font-family: "ok-f5350cc488"
}

.okx-header-footer-language-1:before {
  content: "\e037";
  font-family: ok-f5350cc488
}

.okx-header-footer-join-group {
  --ok-icon-font-family: "ok-f5350cc488"
}

.okx-header-footer-join-group:before {
  content: "\e038";
  font-family: ok-f5350cc488
}

.okx-header-footer-hamburger {
  --ok-icon-font-family: "ok-f5350cc488"
}

.okx-header-footer-hamburger:before {
  content: "\e03b";
  font-family: ok-f5350cc488
}

.okx-header-footer-line {
  --ok-icon-font-family: "ok-f5350cc488"
}

.okx-header-footer-line:before {
  content: "\e03c";
  font-family: ok-f5350cc488
}

.okx-header-footer-linkedin {
  --ok-icon-font-family: "ok-f5350cc488"
}

.okx-header-footer-linkedin:before {
  content: "\e03d";
  font-family: ok-f5350cc488
}

.okx-header-footer-loan {
  --ok-icon-font-family: "ok-f5350cc488"
}

.okx-header-footer-loan:before {
  content: "\e03e";
  font-family: ok-f5350cc488
}

.okx-header-footer-historical-market-data {
  --ok-icon-font-family: "ok-f5350cc488"
}

.okx-header-footer-historical-market-data:before {
  content: "\e03f";
  font-family: ok-f5350cc488
}

.okx-header-footer-managed-trading-sub-accounts {
  --ok-icon-font-family: "ok-f5350cc488"
}

.okx-header-footer-managed-trading-sub-accounts:before {
  content: "\e040";
  font-family: ok-f5350cc488
}

.okx-header-footer-home-1 {
  --ok-icon-font-family: "ok-f5350cc488"
}

.okx-header-footer-home-1:before {
  content: "\e041";
  font-family: ok-f5350cc488
}

.okx-header-footer-help-center {
  --ok-icon-font-family: "ok-f5350cc488"
}

.okx-header-footer-help-center:before {
  content: "\e042";
  font-family: ok-f5350cc488
}

.okx-header-footer-marketplace {
  --ok-icon-font-family: "ok-f5350cc488"
}

.okx-header-footer-marketplace:before {
  content: "\e043";
  font-family: ok-f5350cc488
}

.okx-header-footer-home {
  --ok-icon-font-family: "ok-f5350cc488"
}

.okx-header-footer-home:before {
  content: "\e044";
  font-family: ok-f5350cc488
}

.okx-header-footer-hot {
  --ok-icon-font-family: "ok-f5350cc488"
}

.okx-header-footer-hot:before {
  content: "\e045";
  font-family: ok-f5350cc488
}

.okx-header-footer-nitro-spreads {
  --ok-icon-font-family: "ok-f5350cc488"
}

.okx-header-footer-nitro-spreads:before {
  content: "\e046";
  font-family: ok-f5350cc488
}

.okx-header-footer-node {
  --ok-icon-font-family: "ok-f5350cc488"
}

.okx-header-footer-node:before {
  content: "\e047";
  font-family: ok-f5350cc488
}

.okx-header-footer-notice {
  --ok-icon-font-family: "ok-f5350cc488"
}

.okx-header-footer-notice:before {
  content: "\e048";
  font-family: ok-f5350cc488
}

.okx-header-footer-okb {
  --ok-icon-font-family: "ok-f5350cc488"
}

.okx-header-footer-okb:before {
  content: "\e049";
  font-family: ok-f5350cc488
}

.okx-header-footer-okc {
  --ok-icon-font-family: "ok-f5350cc488"
}

.okx-header-footer-okc:before {
  content: "\e04a";
  font-family: ok-f5350cc488
}

.okx-header-footer-oklink-1 {
  --ok-icon-font-family: "ok-f5350cc488"
}

.okx-header-footer-oklink-1:before {
  content: "\e04b";
  font-family: ok-f5350cc488
}

.okx-header-footer-oklink {
  --ok-icon-font-family: "ok-f5350cc488"
}

.okx-header-footer-oklink:before {
  content: "\e04c";
  font-family: ok-f5350cc488
}

.okx-header-footer-okx {
  --ok-icon-font-family: "ok-f5350cc488"
}

.okx-header-footer-okx:before {
  content: "\e04d";
  font-family: ok-f5350cc488
}

.okx-header-footer-overview {
  --ok-icon-font-family: "ok-f5350cc488"
}

.okx-header-footer-overview:before {
  content: "\e04e";
  font-family: ok-f5350cc488
}

.okx-header-footer-opptunities {
  --ok-icon-font-family: "ok-f5350cc488"
}

.okx-header-footer-opptunities:before {
  content: "\e04f";
  font-family: ok-f5350cc488
}

.okx-header-footer-p2p-trading {
  --ok-icon-font-family: "ok-f5350cc488"
}

.okx-header-footer-p2p-trading:before {
  content: "\e050";
  font-family: ok-f5350cc488
}

.okx-header-footer-payment-settings {
  --ok-icon-font-family: "ok-f5350cc488"
}

.okx-header-footer-payment-settings:before {
  content: "\e051";
  font-family: ok-f5350cc488
}

.okx-header-footer-perp {
  --ok-icon-font-family: "ok-f5350cc488"
}

.okx-header-footer-perp:before {
  content: "\e052";
  font-family: ok-f5350cc488
}

.okx-header-footer-pool {
  --ok-icon-font-family: "ok-f5350cc488"
}

.okx-header-footer-pool:before {
  content: "\e053";
  font-family: ok-f5350cc488
}

.okx-header-footer-ibc {
  --ok-icon-font-family: "ok-f5350cc488"
}

.okx-header-footer-ibc:before {
  content: "\e054";
  font-family: ok-f5350cc488
}

.okx-header-footer-press-room {
  --ok-icon-font-family: "ok-f5350cc488"
}

.okx-header-footer-press-room:before {
  content: "\e055";
  font-family: ok-f5350cc488
}

.okx-header-footer-hot-1 {
  --ok-icon-font-family: "ok-f5350cc488"
}

.okx-header-footer-hot-1:before {
  content: "\e056";
  font-family: ok-f5350cc488
}

.okx-header-footer-id-card {
  --ok-icon-font-family: "ok-f5350cc488"
}

.okx-header-footer-id-card:before {
  content: "\e057";
  font-family: ok-f5350cc488
}

.okx-header-footer-information {
  --ok-icon-font-family: "ok-f5350cc488"
}

.okx-header-footer-information:before {
  content: "\e058";
  font-family: ok-f5350cc488
}

.okx-header-footer-info {
  --ok-icon-font-family: "ok-f5350cc488"
}

.okx-header-footer-info:before {
  content: "\e059";
  font-family: ok-f5350cc488
}

.okx-header-footer-instagram {
  --ok-icon-font-family: "ok-f5350cc488"
}

.okx-header-footer-instagram:before {
  content: "\e05a";
  font-family: ok-f5350cc488
}

.okx-header-footer-question {
  --ok-icon-font-family: "ok-f5350cc488"
}

.okx-header-footer-question:before {
  content: "\e05b";
  font-family: ok-f5350cc488
}

.okx-header-footer-proof-of-reservation {
  --ok-icon-font-family: "ok-f5350cc488"
}

.okx-header-footer-proof-of-reservation:before {
  content: "\e05c";
  font-family: ok-f5350cc488
}

.okx-header-footer-questn {
  --ok-icon-font-family: "ok-f5350cc488"
}

.okx-header-footer-questn:before {
  content: "\e05d";
  font-family: ok-f5350cc488
}

.okx-header-footer-institutions-home {
  --ok-icon-font-family: "ok-f5350cc488"
}

.okx-header-footer-institutions-home:before {
  content: "\e05e";
  font-family: ok-f5350cc488
}

.okx-header-footer-jumpstart {
  --ok-icon-font-family: "ok-f5350cc488"
}

.okx-header-footer-jumpstart:before {
  content: "\e05f";
  font-family: ok-f5350cc488
}

.okx-header-footer-rewards {
  --ok-icon-font-family: "ok-f5350cc488"
}

.okx-header-footer-rewards:before {
  content: "\e060";
  font-family: ok-f5350cc488
}

.okx-header-footer-language {
  --ok-icon-font-family: "ok-f5350cc488"
}

.okx-header-footer-language:before {
  content: "\e061";
  font-family: ok-f5350cc488
}

.okx-header-footer-learn {
  --ok-icon-font-family: "ok-f5350cc488"
}

.okx-header-footer-learn:before {
  content: "\e062";
  font-family: ok-f5350cc488
}

.okx-header-footer-logout {
  --ok-icon-font-family: "ok-f5350cc488"
}

.okx-header-footer-logout:before {
  content: "\e063";
  font-family: ok-f5350cc488
}

.okx-header-footer-margin-trading {
  --ok-icon-font-family: "ok-f5350cc488"
}

.okx-header-footer-margin-trading:before {
  content: "\e064";
  font-family: ok-f5350cc488
}

.okx-header-footer-marketing {
  --ok-icon-font-family: "ok-f5350cc488"
}

.okx-header-footer-marketing:before {
  content: "\e065";
  font-family: ok-f5350cc488
}

.okx-header-footer-more {
  --ok-icon-font-family: "ok-f5350cc488"
}

.okx-header-footer-more:before {
  content: "\e066";
  font-family: ok-f5350cc488
}

.okx-header-footer-reddit {
  --ok-icon-font-family: "ok-f5350cc488"
}

.okx-header-footer-reddit:before {
  content: "\e068";
  font-family: ok-f5350cc488
}

.okx-header-footer-records {
  --ok-icon-font-family: "ok-f5350cc488"
}

.okx-header-footer-records:before {
  content: "\e069";
  font-family: ok-f5350cc488
}

.okx-header-footer-referral {
  --ok-icon-font-family: "ok-f5350cc488"
}

.okx-header-footer-referral:before {
  content: "\e06a";
  font-family: ok-f5350cc488
}

.okx-header-footer-report-centre {
  --ok-icon-font-family: "ok-f5350cc488"
}

.okx-header-footer-report-centre:before {
  content: "\e06b";
  font-family: ok-f5350cc488
}

.okx-header-footer-rfq {
  --ok-icon-font-family: "ok-f5350cc488"
}

.okx-header-footer-rfq:before {
  content: "\e06c";
  font-family: ok-f5350cc488
}

.okx-header-footer-safe {
  --ok-icon-font-family: "ok-f5350cc488"
}

.okx-header-footer-safe:before {
  content: "\e06d";
  font-family: ok-f5350cc488
}

.okx-header-footer-security-of-funds {
  --ok-icon-font-family: "ok-f5350cc488"
}

.okx-header-footer-security-of-funds:before {
  content: "\e06e";
  font-family: ok-f5350cc488
}

.okx-header-footer-security-settings {
  --ok-icon-font-family: "ok-f5350cc488"
}

.okx-header-footer-security-settings:before {
  content: "\e06f";
  font-family: ok-f5350cc488
}

.okx-header-footer-signout {
  --ok-icon-font-family: "ok-f5350cc488"
}

.okx-header-footer-signout:before {
  content: "\e070";
  font-family: ok-f5350cc488
}

.okx-header-footer-spot-1 {
  --ok-icon-font-family: "ok-f5350cc488"
}

.okx-header-footer-spot-1:before {
  content: "\e071";
  font-family: ok-f5350cc488
}

.okx-header-footer-spot {
  --ok-icon-font-family: "ok-f5350cc488"
}

.okx-header-footer-spot:before {
  content: "\e072";
  font-family: ok-f5350cc488
}

.okx-header-footer-stake {
  --ok-icon-font-family: "ok-f5350cc488"
}

.okx-header-footer-stake:before {
  content: "\e073";
  font-family: ok-f5350cc488
}

.okx-header-footer-start-demo-trading {
  --ok-icon-font-family: "ok-f5350cc488"
}

.okx-header-footer-start-demo-trading:before {
  content: "\e074";
  font-family: ok-f5350cc488
}

.okx-header-footer-status {
  --ok-icon-font-family: "ok-f5350cc488"
}

.okx-header-footer-status:before {
  content: "\e075";
  font-family: ok-f5350cc488
}

.okx-header-footer-swap {
  --ok-icon-font-family: "ok-f5350cc488"
}

.okx-header-footer-swap:before {
  content: "\e077";
  font-family: ok-f5350cc488
}

.okx-header-footer-support {
  --ok-icon-font-family: "ok-f5350cc488"
}

.okx-header-footer-support:before {
  content: "\e078";
  font-family: ok-f5350cc488
}

.okx-header-footer-subgraph {
  --ok-icon-font-family: "ok-f5350cc488"
}

.okx-header-footer-subgraph:before {
  content: "\e079";
  font-family: ok-f5350cc488
}

.okx-header-footer-testnet {
  --ok-icon-font-family: "ok-f5350cc488"
}

.okx-header-footer-testnet:before {
  content: "\e07a";
  font-family: ok-f5350cc488
}

.okx-header-footer-telegram {
  --ok-icon-font-family: "ok-f5350cc488"
}

.okx-header-footer-telegram:before {
  content: "\e07b";
  font-family: ok-f5350cc488
}

.okx-header-footer-sub-account {
  --ok-icon-font-family: "ok-f5350cc488"
}

.okx-header-footer-sub-account:before {
  content: "\e07c";
  font-family: ok-f5350cc488
}

.okx-header-footer-trade-perp {
  --ok-icon-font-family: "ok-f5350cc488"
}

.okx-header-footer-trade-perp:before {
  content: "\e07d";
  font-family: ok-f5350cc488
}

.okx-header-footer-tiktok {
  --ok-icon-font-family: "ok-f5350cc488"
}

.okx-header-footer-tiktok:before {
  content: "\e07e";
  font-family: ok-f5350cc488
}

.okx-header-footer-trade-swap {
  --ok-icon-font-family: "ok-f5350cc488"
}

.okx-header-footer-trade-swap:before {
  content: "\e080";
  font-family: ok-f5350cc488
}

.okx-header-footer-x1swap {
  --ok-icon-font-family: "ok-f5350cc488"
}

.okx-header-footer-x1swap:before {
  content: "\e081";
  font-family: ok-f5350cc488
}

.okx-header-footer-tradingview {
  --ok-icon-font-family: "ok-f5350cc488"
}

.okx-header-footer-tradingview:before {
  content: "\e082";
  font-family: ok-f5350cc488
}

.okx-header-footer-trading-view {
  --ok-icon-font-family: "ok-f5350cc488"
}

.okx-header-footer-trading-view:before {
  content: "\e083";
  font-family: ok-f5350cc488
}

.okx-header-footer-transfer {
  --ok-icon-font-family: "ok-f5350cc488"
}

.okx-header-footer-transfer:before {
  content: "\e084";
  font-family: ok-f5350cc488
}

.okx-header-footer-twitter-1 {
  --ok-icon-font-family: "ok-f5350cc488"
}

.okx-header-footer-twitter-1:before {
  content: "\e085";
  font-family: ok-f5350cc488
}

.okx-header-footer-twitter {
  --ok-icon-font-family: "ok-f5350cc488"
}

.okx-header-footer-twitter:before {
  content: "\e086";
  font-family: ok-f5350cc488
}

.okx-header-footer-trading-bot {
  --ok-icon-font-family: "ok-f5350cc488"
}

.okx-header-footer-trading-bot:before {
  content: "\e087";
  font-family: ok-f5350cc488
}

.okx-header-footer-user-community {
  --ok-icon-font-family: "ok-f5350cc488"
}

.okx-header-footer-user-community:before {
  content: "\e088";
  font-family: ok-f5350cc488
}

.okx-header-footer-transactions {
  --ok-icon-font-family: "ok-f5350cc488"
}

.okx-header-footer-transactions:before {
  content: "\e089";
  font-family: ok-f5350cc488
}

.okx-header-footer-user-home {
  --ok-icon-font-family: "ok-f5350cc488"
}

.okx-header-footer-user-home:before {
  content: "\e08b";
  font-family: ok-f5350cc488
}

.okx-header-footer-try-fiat {
  --ok-icon-font-family: "ok-f5350cc488"
}

.okx-header-footer-try-fiat:before {
  content: "\e08c";
  font-family: ok-f5350cc488
}

.okx-header-footer-verification {
  --ok-icon-font-family: "ok-f5350cc488"
}

.okx-header-footer-verification:before {
  content: "\e08d";
  font-family: ok-f5350cc488
}

.okx-header-footer-vip-loan {
  --ok-icon-font-family: "ok-f5350cc488"
}

.okx-header-footer-vip-loan:before {
  content: "\e08e";
  font-family: ok-f5350cc488
}

.okx-header-footer-vk {
  --ok-icon-font-family: "ok-f5350cc488"
}

.okx-header-footer-vk:before {
  content: "\e08f";
  font-family: ok-f5350cc488
}

.okx-header-footer-withdraw {
  --ok-icon-font-family: "ok-f5350cc488"
}

.okx-header-footer-withdraw:before {
  content: "\e090";
  font-family: ok-f5350cc488
}

.okx-header-footer-weibo {
  --ok-icon-font-family: "ok-f5350cc488"
}

.okx-header-footer-weibo:before {
  content: "\e091";
  font-family: ok-f5350cc488
}

.okx-header-footer-youtube {
  --ok-icon-font-family: "ok-f5350cc488"
}

.okx-header-footer-youtube:before {
  content: "\e092";
  font-family: ok-f5350cc488
}

.okx-header-footer-wallet {
  --ok-icon-font-family: "ok-f5350cc488"
}

.okx-header-footer-wallet:before {
  content: "\e093";
  font-family: ok-f5350cc488
}

.okx-header-footer-warning {
  --ok-icon-font-family: "ok-f5350cc488"
}

.okx-header-footer-warning:before {
  content: "\e094";
  font-family: ok-f5350cc488
}

.iconfont {
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
  font-size: 16px;
  font-style: normal
}

.iconfont:before {
  display: inline-block
}

@font-face {
  font-display: block;
  font-family: ok-f5350cc488;
  font-style: normal;
  src: url(../font/07a6e99ab2584c1937ef.woff2) format("woff2")
}

[dir=rtl] .okx-header-footer-arrow-chevrons-right:before,
[dir=rtl] .okx-header-footer-arrow-pointer-left-sm:before,
[dir=rtl] .okx-header-footer-question:before {
  transform: scaleX(-1)
}

.theme-light {
  --oxnv-okd-color-gray-050: #f9f9f9;
  --oxnv-okd-color-gray-100: #ebebeb;
  --oxnv-okd-color-gray-200: #dbdbdb;
  --oxnv-okd-color-gray-300: #bdbdbd;
  --oxnv-okd-color-gray-400: #929292;
  --oxnv-okd-color-gray-500: #6e6e6e;
  --oxnv-okd-color-gray-600: #545454;
  --oxnv-okd-color-gray-700: #3d3d3d;
  --oxnv-okd-color-gray-800: #1a1a1a;
  --oxnv-okd-color-gray-900: #000;
  --oxnv-okd-color-blue-050: #f5f9ff;
  --oxnv-okd-color-blue-100: #d1e3ff;
  --oxnv-okd-color-blue-200: #afcfff;
  --oxnv-okd-color-blue-300: #8dbbff;
  --oxnv-okd-color-blue-400: #6ba6ff;
  --oxnv-okd-color-blue-500: #4992ff;
  --oxnv-okd-color-blue-600: #277dff;
  --oxnv-okd-color-blue-700: #0569ff;
  --oxnv-okd-color-blue-800: #005eea;
  --oxnv-okd-color-blue-900: #0051ca;
  --oxnv-okd-color-green-050: #f2fff7;
  --oxnv-okd-color-green-100: #d2f4de;
  --oxnv-okd-color-green-200: #a5e9be;
  --oxnv-okd-color-green-300: #78de9d;
  --oxnv-okd-color-green-400: #4bd37d;
  --oxnv-okd-color-green-500: #31bd65;
  --oxnv-okd-color-green-600: #18a04a;
  --oxnv-okd-color-green-700: #127837;
  --oxnv-okd-color-green-800: #0c5025;
  --oxnv-okd-color-green-900: #0c5025;
  --oxnv-okd-color-red-050: #fff8f9;
  --oxnv-okd-color-red-100: #fcdce5;
  --oxnv-okd-color-red-200: #f9b9ca;
  --oxnv-okd-color-red-300: #f796b0;
  --oxnv-okd-color-red-400: #f07596;
  --oxnv-okd-color-red-500: #f1507b;
  --oxnv-okd-color-red-600: #c14062;
  --oxnv-okd-color-red-700: #91304a;
  --oxnv-okd-color-red-800: #602031;
  --oxnv-okd-color-red-900: #301019;
  --oxnv-okd-color-orange-050: #fef9f6;
  --oxnv-okd-color-orange-100: #fce3d4;
  --oxnv-okd-color-orange-200: #fbceb4;
  --oxnv-okd-color-orange-300: #f9b994;
  --oxnv-okd-color-orange-400: #f7a474;
  --oxnv-okd-color-orange-500: #f58f54;
  --oxnv-okd-color-orange-600: #f6813d;
  --oxnv-okd-color-orange-700: #f16514;
  --oxnv-okd-color-orange-800: #e96010;
  --oxnv-okd-color-orange-900: #bf4803;
  --oxnv-okd-color-yellow-050: #fffcf5;
  --oxnv-okd-color-yellow-100: #fff2d1;
  --oxnv-okd-color-yellow-200: #ffe9af;
  --oxnv-okd-color-yellow-300: #ffdf8d;
  --oxnv-okd-color-yellow-400: #ffd66b;
  --oxnv-okd-color-yellow-500: #ffcc49;
  --oxnv-okd-color-yellow-600: #ffc327;
  --oxnv-okd-color-yellow-700: #ffb905;
  --oxnv-okd-color-yellow-800: #eaa900;
  --oxnv-okd-color-yellow-900: #d29801;
  --oxnv-okd-color-text-white: #fff;
  --oxnv-okd-color-text-black: #1f2933;
  --oxnv-okd-color-background-1: #fff;
  --oxnv-okd-color-background-2: #f7f7f7;
  --oxnv-okd-color-transparent: transparent;
  --oxnv-okd-color-white: #fff;
  --oxnv-okd-color-black: #000;
  --oxnv-okd-color-line-muted: #ebebeb;
  --oxnv-okd-color-line-secondary: #dbdbdb;
  --oxnv-okd-color-line-amplifed: #bdbdbd;
  --oxnv-okd-color-text-lighter: #bdbdbd;
  --oxnv-okd-color-text-light: #929292;
  --oxnv-okd-color-text-secondary: #3d3d3d;
  --oxnv-okd-color-text-amplifed: #000;
  --oxnv-okd-color-background-3: #f2f2f2;
  --oxnv-okd-color-fq-blue-lv1: #0569ff;
  --oxnv-okd-color-fq-green-lv1: #19cc5b;
  --oxnv-okd-color-fq-red-lv1: #f1507b;
  --oxnv-okd-color-fq-orange-lv1: #f16514;
  --oxnv-okd-color-fq-blue-lv2: #0569ff;
  --oxnv-okd-color-background-hover: #ebebeb;
  --oxnv-okd-color-prefer-red-chart: #f1507b;
  --oxnv-okd-color-prefer-red-bg: #eb4b6d;
  --oxnv-okd-color-prefer-green-chart: #19cc5b;
  --oxnv-okd-color-prefer-green-bg: #31bd65;
  --oxnv-okd-color-prefer-red-text: #eb4b6d;
  --oxnv-okd-color-prefer-green-text: #31bd65;
  --oxnv-okd-color-branded-primary: #bcff2f;
  --oxnv-okd-color-fq-critical: #eb4b6d;
  --oxnv-okd-color-fq-warning: #f16514;
  --oxnv-okd-color-fq-positive: #31bd65;
  --oxnv-okd-color-fq-neutral: #000;
  --oxnv-okd-color-fq-accent: #0569ff;
  --oxnv-okd-color-prefer-neutral-text: #929292;
  --oxnv-okd-color-prefer-neutral-bg: #929292;
  --oxnv-okd-color-background-base-primary: #fff;
  --oxnv-okd-color-background-base-secondary: #fafafa;
  --oxnv-okd-color-background-surface-primary: #f3f3f3;
  --oxnv-okd-color-background-surface-secondary: #f6f6f6;
  --oxnv-okd-color-background-surface-pressed: #d9d9d9;
  --oxnv-okd-color-background-surface-disable: #fafafa;
  --oxnv-okd-color-background-scrim: rgba(0, 0, 0, .43);
  --oxnv-okd-color-container-primary: #fff;
  --oxnv-okd-color-container-secondary: #fafafa;
  --oxnv-okd-color-container-tertiary: #fff;
  --oxnv-okd-color-container-contrast: #414141;
  --oxnv-okd-color-container-inverse: #0e0e0e;
  --oxnv-okd-color-content-primary: #000;
  --oxnv-okd-color-content-secondary: #383838;
  --oxnv-okd-color-content-tertiary: #5b5b5b;
  --oxnv-okd-color-content-contrast: #909090;
  --oxnv-okd-color-content-disabled: #b3b3b3;
  --oxnv-okd-color-content-inverse: #fff;
  --oxnv-okd-color-border-primary: #e6e6e6;
  --oxnv-okd-color-border-secondary: #b3b3b3;
  --oxnv-okd-color-border-contrast: #fafafa;
  --oxnv-okd-color-border-selected: #000;
  --oxnv-okd-color-semantic-neutral: #000;
  --oxnv-okd-color-semantic-notice: #ffb117;
  --oxnv-okd-color-semantic-positive: #31bd65;
  --oxnv-okd-color-semantic-negative: #eb4b6d;
  --oxnv-okd-color-semantic-informative: #8a91ff;
  --oxnv-okd-color-semantic-highlight: #bcff2f;
  --oxnv-okd-color-dvp-neutral: rgba(0, 0, 0, .57);
  --oxnv-okd-color-dvp-profit: #00bc4b;
  --oxnv-okd-color-dvp-loss: #f5384f;
  --oxnv-okd-color-categorical-01: #8a91ff;
  --oxnv-okd-color-categorical-02: #ffb117;
  --oxnv-okd-color-categorical-03: #bcff2f;
  --oxnv-okd-color-categorical-04: #12e366;
  --oxnv-okd-color-categorical-05: #ff7888;
  --oxnv-okd-color-common-transparent: hsla(0, 0%, 100%, 0);
  --oxnv-okd-color-transparent-black: transparent;
  --oxnv-okd-color-transparent-white: transparent;
  --oxnv-okd-color-alert-info: #f7f7f7;
  --oxnv-okd-color-alert-success: #eaf8f0;
  --oxnv-okd-color-alert-warning: #fef9f6;
  --oxnv-okd-color-alert-error: #fdedf0;
  --oxnv-okd-color-common-background-2: #f3f3f3;
  --oxnv-okd-color-data-visualization-category-01: #8a91ff;
  --oxnv-okd-color-data-visualization-category-02: #ffb117;
  --oxnv-okd-color-data-visualization-category-03: #bcff2f;
  --oxnv-okd-color-data-visualization-category-04: #12e366;
  --oxnv-okd-color-data-visualization-category-05: #ff7888;
  --oxnv-okd-color-preference-loss: #f5384f;
  --oxnv-okd-color-preference-profit: #00bc4b;
  --oxnv-okd-color-preference-neutral: rgba(0, 0, 0, .57);
  --oxnv-okd-color-border-focus: #000;
  --oxnv-okd-color-background-base-primary_alternative: #fff;
  --oxnv-okd-color-link-content: #4c2fff;
  --oxnv-okd-color-link-accent-content-primary: #2b6d17;
  --oxnv-okd-color-background-surface-contrast: #fff;
  --oxnv-okd-color-background-surface-brand: #000;
  --oxnv-okd-color-border-tertiary: #f3f3f3;
  --oxnv-okd-color-content-brand: #000;
  --oxnv-okd-color-modal-primary: #fff;
  --oxnv-okd-color-modal-secondary: #fff;
  --oxnv-okd-color-modal-tertiary: #fff;
  --oxnv-okd-color-modal-contrast: #4d4d4d;
  --oxnv-okd-color-card-primary: #f6f6f6;
  --oxnv-okd-color-card-secondary: #f6f6f6;
  --oxnv-okd-color-brand-primary: #2b6d17;
  --oxnv-okd-color-brand-primary-alternative: #2b6d17;
  --oxnv-okd-color-brand-secondary: #8ec51d;
  --oxnv-okd-color-brand-tertiary: #bcff2f;
  --oxnv-okd-color-brand-content: #e6ffb0;
  --oxnv-okd-color-brand-content-contrast: #e6ffb0;
  --oxnv-okd-color-global-fixed-always-dark: #000;
  --oxnv-okd-color-global-fixed-always-light: #fff;
  --oxnv-okd-color-surface-structural-subbase: #f6f6f6;
  --oxnv-okd-color-surface-info-default: #4a4a4a;
  --oxnv-okd-color-surface-info-subtle: #f6f6f6;
  --oxnv-okd-color-surface-warning-default: #fea01d;
  --oxnv-okd-color-surface-warning-subtle: #ffedcb;
  --oxnv-okd-color-surface-success-default: #3c8f24;
  --oxnv-okd-color-surface-success-subtle: #e9f4d1;
  --oxnv-okd-color-surface-danger-default: #d33a4c;
  --oxnv-okd-color-surface-danger-subtle: #fee0e3;
  --oxnv-okd-color-surface-interactive-default: rgba(0, 0, 0, .06);
  --oxnv-okd-color-surface-interactive-hovered: rgba(0, 0, 0, .09);
  --oxnv-okd-color-surface-interactive-pressed: rgba(0, 0, 0, .14);
  --oxnv-okd-color-surface-interactive-disabled: rgba(0, 0, 0, .03);
  --oxnv-okd-color-surface-interactive-oncolor-default: hsla(0, 0%, 100%, .9);
  --oxnv-okd-color-surface-interactive-oncolor-hovered: hsla(0, 0%, 100%, .7);
  --oxnv-okd-color-surface-interactive-oncolor-pressed: hsla(0, 0%, 100%, .5);
  --oxnv-okd-color-surface-interactive-emphasis-default: rgba(0, 0, 0, .99);
  --oxnv-okd-color-surface-interactive-emphasis-hovered: rgba(0, 0, 0, .8);
  --oxnv-okd-color-surface-interactive-emphasis-pressed: rgba(0, 0, 0, .7);
  --oxnv-okd-color-surface-interactive-emphasis-disabled: rgba(0, 0, 0, .03);
  --oxnv-okd-color-surface-interactive-selected-default: #000;
  --oxnv-okd-color-surface-interactive-selected-subtle: rgba(0, 0, 0, .06);
  --oxnv-okd-color-surface-interactive-selected-oncolor: hsla(0, 0%, 100%, .9);
  --oxnv-okd-color-surface-structural-base: #fff;
  --oxnv-okd-color-surface-structural-layer-1: #f6f6f6;
  --oxnv-okd-color-surface-structural-layer-2: #e9e9e9;
  --oxnv-okd-color-surface-structural-layer-3: #dcdcdc;
  --oxnv-okd-color-surface-structural-highlight: var(--global-color-highlight);
  --oxnv-okd-color-surface-structural-inverse: #000;
  --oxnv-okd-color-surface-structural-elevated-default: #fff;
  --oxnv-okd-color-surface-structural-elevated-contrast: #fff;
  --oxnv-okd-color-surface-structural-overlay: rgba(0, 0, 0, .4);
  --oxnv-okd-color-border-static-default: rgba(0, 0, 0, .14);
  --oxnv-okd-color-border-static-subtle: rgba(0, 0, 0, .06);
  --oxnv-okd-color-border-static-dotted: rgba(0, 0, 0, .32);
  --oxnv-okd-color-border-interactive-default: rgba(0, 0, 0, .32);
  --oxnv-okd-color-border-interactive-hovered: #333;
  --oxnv-okd-color-border-interactive-pressed: #000;
  --oxnv-okd-color-border-interactive-focused: #000;
  --oxnv-okd-color-border-interactive-selected: #000;
  --oxnv-okd-color-border-interactive-error: #ba2133;
  --oxnv-okd-color-border-interactive-emphasis: #4a4a4a;
  --oxnv-okd-color-border-interactive-oncolor: #e9e9e9;
  --oxnv-okd-color-border-static-emphasis: #4a4a4a;
  --oxnv-okd-color-border-static-experience: var(--global-color-experience-default);
  --oxnv-okd-color-border-static-highlight: var(--global-color-highlight);
  --oxnv-okd-color-border-static-overlay: hsla(0, 0%, 100%, .9);
  --oxnv-okd-color-border-interactive-disabled: rgba(0, 0, 0, .14);
  --oxnv-okd-color-border-info-default: #212121;
  --oxnv-okd-color-border-info-subtle: #757575;
  --oxnv-okd-color-border-warning-default: #ba5d00;
  --oxnv-okd-color-border-warning-subtle: #ffedcb;
  --oxnv-okd-color-border-success-default: #2b6d17;
  --oxnv-okd-color-border-success-subtle: #e9f4d1;
  --oxnv-okd-color-border-danger-default: #ba2133;
  --oxnv-okd-color-border-danger-subtle: #fee0e3;
  --oxnv-okd-color-content-static-default: #000;
  --oxnv-okd-color-content-interactive-default: #4a4a4a;
  --oxnv-okd-color-content-interactive-subtle: #757575;
  --oxnv-okd-color-content-interactive-hovered: #212121;
  --oxnv-okd-color-content-static-subtle: #5e5e5e;
  --oxnv-okd-color-content-interactive-pressed: #000;
  --oxnv-okd-color-content-static-inverse: #fff;
  --oxnv-okd-color-content-static-highlight: var(--global-color-highlight);
  --oxnv-okd-color-content-static-placeholder: rgba(0, 0, 0, .22);
  --oxnv-okd-color-content-interactive-active: #000;
  --oxnv-okd-color-content-interactive-selected: #000;
  --oxnv-okd-color-content-interactive-error: #ba2133;
  --oxnv-okd-color-content-interactive-disabled: rgba(0, 0, 0, .14);
  --oxnv-okd-color-content-info-default: #212121;
  --oxnv-okd-color-content-info-subtle: #757575;
  --oxnv-okd-color-content-warning-default: #ba5d00;
  --oxnv-okd-color-content-warning-subtle: #ffedcb;
  --oxnv-okd-color-content-success-default: #2b6d17;
  --oxnv-okd-color-content-success-subtle: #e9f4d1;
  --oxnv-okd-color-content-danger-default: #ba2133;
  --oxnv-okd-color-content-danger-subtle: #fee0e3;
  --oxnv-okd-color-content-illustration-default: #000;
  --oxnv-okd-color-content-dataviz-categorical-1: var(--global-color-feature-default);
  --oxnv-okd-color-content-dataviz-categorical-2: #0b5bcb;
  --oxnv-okd-color-content-dataviz-categorical-3: #e28400;
  --oxnv-okd-color-content-dataviz-categorical-4: #dbb01d;
  --oxnv-okd-color-content-dataviz-categorical-5: #9543ff;
  --oxnv-okd-color-content-dataviz-categorical-6: #5e5e5e;
  --oxnv-okd-color-content-dataviz-categorical-7: #858585;
  --oxnv-okd-color-content-dataviz-categorical-8: #afafaf;
  --oxnv-okd-color-content-illustration-inverse: #fff;
  --oxnv-okd-color-content-illustration-experience: var(--global-color-experience-default);
  --oxnv-okd-color-content-illustration-highlight: var(--global-color-highlight);
  --oxnv-okd-color-global-alpha-matching-5: hsla(0, 0%, 100%, .05);
  --oxnv-okd-color-global-alpha-matching-10: hsla(0, 0%, 100%, .1);
  --oxnv-okd-color-global-alpha-matching-20: hsla(0, 0%, 100%, .2);
  --oxnv-okd-color-global-alpha-matching-30: hsla(0, 0%, 100%, .3);
  --oxnv-okd-color-global-alpha-matching-40: hsla(0, 0%, 100%, .4);
  --oxnv-okd-color-global-alpha-matching-50: hsla(0, 0%, 100%, .5);
  --oxnv-okd-color-global-alpha-matching-60: hsla(0, 0%, 100%, .6);
  --oxnv-okd-color-global-alpha-matching-70: hsla(0, 0%, 100%, .7);
  --oxnv-okd-color-global-alpha-matching-80: hsla(0, 0%, 100%, .8);
  --oxnv-okd-color-global-alpha-matching-90: hsla(0, 0%, 100%, .9);
  --oxnv-okd-color-global-alpha-inverse-5: rgba(0, 0, 0, .03);
  --oxnv-okd-color-global-alpha-pnl-profit: var(--global-color-profit-alpha);
  --oxnv-okd-color-global-alpha-pnl-loss: var(--global-color-loss-alpha);
  --oxnv-okd-color-global-alpha-feature-1: rgba(43, 109, 23, .16);
  --oxnv-okd-color-global-alpha-inverse-10: rgba(0, 0, 0, .06);
  --oxnv-okd-color-global-alpha-inverse-20: rgba(0, 0, 0, .14);
  --oxnv-okd-color-global-alpha-inverse-30: rgba(0, 0, 0, .22);
  --oxnv-okd-color-global-alpha-inverse-40: rgba(0, 0, 0, .32);
  --oxnv-okd-color-global-alpha-inverse-50: rgba(0, 0, 0, .44);
  --oxnv-okd-color-global-alpha-inverse-60: rgba(0, 0, 0, .57);
  --oxnv-okd-color-global-alpha-inverse-70: rgba(0, 0, 0, .7);
  --oxnv-okd-color-global-alpha-inverse-80: rgba(0, 0, 0, .8);
  --oxnv-okd-color-global-alpha-inverse-90: rgba(0, 0, 0, .9);
  --oxnv-okd-color-surface-pnl-profit-default: var(--global-color-profit-surface-default);
  --oxnv-okd-color-surface-pnl-profit-hovered: var(--global-color-profit-surface-hovered);
  --oxnv-okd-color-surface-pnl-profit-pressed: var(--global-color-profit-surface-pressed);
  --oxnv-okd-color-surface-pnl-profit-tint: var(--global-color-profit-tint);
  --oxnv-okd-color-surface-pnl-loss-default: var(--global-color-loss-surface-default);
  --oxnv-okd-color-surface-pnl-loss-hovered: var(--global-color-loss-surface-hovered);
  --oxnv-okd-color-surface-pnl-loss-pressed: var(--global-color-loss-surface-pressed);
  --oxnv-okd-color-surface-pnl-loss-tint: var(--global-color-loss-tint);
  --oxnv-okd-color-surface-pnl-neutral-default: var(--global-color-neutral-surface-default);
  --oxnv-okd-color-surface-pnl-neutral-hovered: var(--global-color-neutral-surface-hovered);
  --oxnv-okd-color-surface-pnl-neutral-pressed: var(--global-color-neutral-surface-pressed);
  --oxnv-okd-color-surface-interactive-feature-default: var(--global-color-feature-default);
  --oxnv-okd-color-surface-interactive-experience-default: var(--global-color-experience-default);
  --oxnv-okd-color-surface-interactive-experience-hovered: var(--global-color-experience-hovered);
  --oxnv-okd-color-surface-interactive-experience-pressed: var(--global-color-experience-pressed);
  --oxnv-okd-color-surface-interactive-feature-hovered: var(--global-color-feature-hovered);
  --oxnv-okd-color-surface-interactive-feature-pressed: var(--global-color-feature-pressed);
  --oxnv-okd-color-surface-pnl-loss-graph: var(--global-color-loss-graph);
  --oxnv-okd-color-surface-structural-feature: var(--global-color-feature-default);
  --oxnv-okd-color-surface-structural-experience: var(--global-color-experience-default);
  --oxnv-okd-color-border-interactive-feature-default: var(--global-color-feature-default);
  --oxnv-okd-color-border-interactive-feature-hovered: var(--global-color-feature-hovered);
  --oxnv-okd-color-border-interactive-feature-pressed: var(--global-color-feature-pressed);
  --oxnv-okd-color-border-static-feature: var(--global-color-feature-default);
  --oxnv-okd-color-content-static-subtler: #858585;
  --oxnv-okd-color-content-static-feature: var(--global-color-feature-default);
  --oxnv-okd-color-content-static-experience: var(--global-color-experience-default);
  --oxnv-okd-color-content-pnl-profit-default: var(--global-color-profit-default);
  --oxnv-okd-color-content-illustration-feature: var(--global-color-feature-default);
  --oxnv-okd-color-content-pnl-profit-oncolor: var(--global-color-profit-oncolor);
  --oxnv-okd-color-content-pnl-loss-default: var(--global-color-loss-default);
  --oxnv-okd-color-content-pnl-loss-oncolor: var(--global-color-loss-oncolor);
  --oxnv-okd-color-content-pnl-neutral-default: var(--global-color-neutral-default);
  --oxnv-okd-color-content-pnl-neutral-oncolor: var(--global-color-neutral-oncolor);
  --oxnv-okd-color-surface-pnl-profit-graph: var(--global-color-profit-graph);
  --oxnv-okd-color-surface-pnl-neutral-graph: var(--global-color-neutral-graph);
  --oxnv-okd-color-border-interactive-experience-default: var(--global-color-experience-default);
  --oxnv-okd-color-border-interactive-experience-hovered: var(--global-color-experience-hovered);
  --oxnv-okd-color-border-interactive-experience-pressed: var(--global-color-experience-pressed);
  --oxnv-okd-color-content-interactive-feature-default: var(--global-color-feature-default);
  --oxnv-okd-color-content-interactive-feature-hovered: var(--global-color-feature-hovered);
  --oxnv-okd-color-content-interactive-feature-pressed: var(--global-color-feature-pressed);
  --oxnv-okd-color-content-interactive-experience-default: var(--global-color-experience-default);
  --oxnv-okd-color-content-interactive-experience-alternative: var(--global-color-experience-alternative);
  --oxnv-okd-color-content-interactive-experience-accent: var(--global-color-experience-accent);
  --oxnv-okd-color-content-interactive-experience-hovered: var(--global-color-experience-hovered);
  --oxnv-okd-color-content-interactive-experience-pressed: var(--global-color-experience-pressed);
  --oxnv-okd-color-content-interactive-experience-inverse: var(--global-color-experience-inverse);
  --oxnv-okd-color-content-interactive-feature-inverse-default: var(--global-color-feature-primary-inverse-default);
  --oxnv-okd-color-content-interactive-feature-inverse-hovered: var(--global-color-feature-primary-inverse-hovered);
  --oxnv-okd-color-content-interactive-feature-inverse-pressed: var(--global-color-feature-primary-inverse-pressed);
  --oxnv-okd-color-surface-interactive-feature-inverse-default: var(--global-color-feature-primary-inverse-default);
  --oxnv-okd-color-surface-interactive-feature-inverse-hovered: var(--global-color-feature-primary-inverse-hovered);
  --oxnv-okd-color-surface-interactive-feature-inverse-pressed: var(--global-color-feature-primary-inverse-pressed);
  --oxnv-okd-color-border-pnl-loss-default: var(--global-color-loss-default);
  --oxnv-okd-color-border-pnl-loss-graph: var(--global-color-loss-graph);
  --oxnv-okd-color-border-pnl-profit-default: var(--global-color-profit-default);
  --oxnv-okd-color-border-pnl-profit-graph: var(--global-color-profit-graph);
  --oxnv-okd-color-border-pnl-neutral-graph: var(--global-color-neutral-graph);
  --oxnv-okd-color-content-static-notification: #e05a6a;
  --oxnv-okd-color-surface-interactive-unselected-default: rgba(0, 0, 0, .32);
  --oxnv-okd-color-surface-structural-elevated-layer-1: #f6f6f6;
  --oxnv-okd-color-surface-interactive-destructive-default: #e05a6a;
  --oxnv-okd-color-surface-interactive-destructive-hovered: #d33a4c;
  --oxnv-okd-color-surface-interactive-destructive-pressed: #ba2133;
  --oxnv-okd-color-surface-structural-web-only-base: #f6f6f6;
  --oxnv-okd-color-surface-structural-web-only-layer-1: #fff;
  --oxnv-okd-color-global-fixed-shadow: rgba(0, 0, 0, .16);
  --oxnv-okd-color-surface-interactive-destructive-subtle-default: #fee0e3;
  --oxnv-okd-color-surface-interactive-destructive-subtle-hovered: #ffbec5;
  --oxnv-okd-color-surface-interactive-destructive-subtle-pressed: #ff8f9c;
  --oxnv-okd-color-global-fixed-always-light-20: hsla(0, 0%, 100%, .2);
  --oxnv-okd-color-surface-pnl-profit-default-new: var(--global-color-profit-surface-default-new);
  --oxnv-okd-color-surface-pnl-profit-emphasis: var(--global-color-profit-surface-emphasis);
  --oxnv-okd-color-surface-pnl-loss-default-new: var(--global-color-loss-surface-default-new);
  --oxnv-okd-color-surface-pnl-loss-emphasis: var(--global-color-loss-surface-emphasis);
  --oxnv-okd-color-content-pnl-profit-oncolor-default: var(--global-color-profit-default);
  --oxnv-okd-color-content-pnl-profit-oncolor-emphasis: var(--global-color-profit-oncolor);
  --oxnv-okd-color-content-pnl-loss-oncolor-default: var(--global-color-loss-default);
  --oxnv-okd-color-content-pnl-loss-oncolor-emphasis: var(--global-color-loss-oncolor);
  --oxnv-okd-color-surface-pnl-profit-gradient-max: var(--global-color-profit-gradient-max);
  --oxnv-okd-color-surface-pnl-profit-gradient-min: var(--global-color-profit-gradient-min);
  --oxnv-okd-color-surface-pnl-loss-gradient-max: rgba(252, 70, 171, .2);
  --oxnv-okd-color-surface-pnl-loss-gradient-min: rgba(252, 70, 171, 0);
  --oxnv-okd-font-size-base: 16px;
  --oxnv-okd-font-size-md: 14px;
  --oxnv-okd-font-size-xs: 12px;
  --oxnv-okd-line-height-base: 20px;
  --oxnv-okd-line-height-md: 20px;
  --oxnv-okd-line-height-xs: 16px;
  --oxnv-okd-shadow-none: 0 0 0 0 transparent;
  --oxnv-okd-shadow-xs: 0 0 0 1px #0000000d;
  --oxnv-okd-shadow-sm: 0 1px 2px 0 #0000000d;
  --oxnv-okd-shadow-default: 0 1px 3px 0 #0000001a, 0 1px 2px 0 #0000000f;
  --oxnv-okd-shadow-md: 0 4px 6px -1px #0000001a, 0 2px 4px -1px #0000000f;
  --oxnv-okd-shadow-lg: 0 10px 15px -3px #0000001a, 0 4px 6px -2px #0000000d;
  --oxnv-okd-shadow-xl: 0 20px 25px -5px #0000001a, 0 10px 10px -5px #0000000a;
  --oxnv-okd-shadow-2xl: 0 25px 50px -12px #00000040;
  --oxnv-okd-border-radius-none: 0;
  --oxnv-okd-border-radius-sm: 2px;
  --oxnv-okd-border-radius-md: 4px;
  --oxnv-okd-border-radius-lg: 6px;
  --oxnv-okd-border-radius-xl: 8px;
  --oxnv-okd-border-radius-xxl: 10px;
  --oxnv-okd-border-radius-xxxl: 12px;
  --oxnv-okd-font-family: HarmonyOS Sans, SF Pro Text, SF Pro Icons, Arial, Helvetica Neue, Helvetica, sans-serif;
  --oxnv-okd-text-display-lg-font-size: 56px;
  --oxnv-okd-text-display-lg-font-weight: 500;
  --oxnv-okd-text-display-lg-line-height: 1.32;
  --oxnv-okd-text-display-md-font-size: 40px;
  --oxnv-okd-text-display-md-font-weight: 500;
  --oxnv-okd-text-display-md-line-height: 52px;
  --oxnv-okd-text-display-sm-font-size: 40px;
  --oxnv-okd-text-display-sm-font-weight: 500;
  --oxnv-okd-text-display-sm-line-height: 52px;
  --oxnv-okd-text-heading-lg-font-size: 30px;
  --oxnv-okd-text-heading-lg-font-weight: 500;
  --oxnv-okd-text-heading-lg-line-height: 40px;
  --oxnv-okd-text-heading-md-font-size: 24px;
  --oxnv-okd-text-heading-md-font-weight: 500;
  --oxnv-okd-text-heading-md-line-height: 30px;
  --oxnv-okd-text-heading-sm-font-size: 18px;
  --oxnv-okd-text-heading-sm-font-weight: 500;
  --oxnv-okd-text-heading-sm-line-height: 24px;
  --oxnv-okd-text-heading-xl-font-size: 36px;
  --oxnv-okd-text-heading-xl-line-height: 1.32;
  --oxnv-okd-text-heading-xl-font-weight: 600;
  --oxnv-okd-text-heading-xxl-font-size: 40px;
  --oxnv-okd-text-heading-xxl-line-height: 1.32;
  --oxnv-okd-text-heading-xxl-font-weight: 600;
  --oxnv-okd-text-heading-overline-font-size: 12px;
  --oxnv-okd-text-heading-overline-line-height: 15px;
  --oxnv-okd-text-heading-overline-font-weight: 500;
  --oxnv-okd-text-body-sm-regular-font-size: 14px;
  --oxnv-okd-text-body-sm-regular-font-weight: 400;
  --oxnv-okd-text-body-sm-regular-line-height: 21px;
  --oxnv-okd-text-body-sm-bold-font-size: 14px;
  --oxnv-okd-text-body-sm-bold-font-weight: 500;
  --oxnv-okd-text-body-sm-bold-line-height: 21px;
  --oxnv-okd-text-body-md-regular-font-size: 16px;
  --oxnv-okd-text-body-md-regular-font-weight: 400;
  --oxnv-okd-text-body-md-regular-line-height: 24px;
  --oxnv-okd-text-body-md-bold-font-size: 16px;
  --oxnv-okd-text-body-md-bold-font-weight: 500;
  --oxnv-okd-text-body-md-bold-line-height: 24px;
  --oxnv-okd-text-body-xs-regular-font-size: 12px;
  --oxnv-okd-text-body-xs-regular-font-weight: 400;
  --oxnv-okd-text-body-xs-regular-line-height: 18px;
  --oxnv-okd-text-body-xs-bold-font-size: 12px;
  --oxnv-okd-text-body-xs-bold-font-weight: 500;
  --oxnv-okd-text-body-xs-bold-line-height: 18px;
  --oxnv-okd-font-weight-400: 400;
  --oxnv-okd-font-weight-500: 500;
  --oxnv-okd-font-weight-600: 600;
  --oxnv-okd-font-weight-700: 700;
  --oxnv-okd-font-weight-800: 800;
  --oxnv-okd-font-weight-900: 900;
  --oxnv-okd-font-weight-regular: 400;
  --oxnv-okd-font-weight-medium: 500;
  --oxnv-okd-font-weight-bold: 700
}

.theme-dark {
  --oxnv-okd-color-gray-050: #000;
  --oxnv-okd-color-gray-100: #2e2e2e;
  --oxnv-okd-color-gray-200: #404040;
  --oxnv-okd-color-gray-300: #6c6c6c;
  --oxnv-okd-color-gray-400: #909090;
  --oxnv-okd-color-gray-500: #b0b0b0;
  --oxnv-okd-color-gray-600: #ccc;
  --oxnv-okd-color-gray-700: #e3e3e3;
  --oxnv-okd-color-gray-800: #f0f0f0;
  --oxnv-okd-color-gray-900: #fafafa;
  --oxnv-okd-color-blue-050: #051738;
  --oxnv-okd-color-blue-100: #082356;
  --oxnv-okd-color-blue-200: #0c3178;
  --oxnv-okd-color-blue-300: #0f3c94;
  --oxnv-okd-color-blue-400: #1148b0;
  --oxnv-okd-color-blue-500: #1453cc;
  --oxnv-okd-color-blue-600: #175fe8;
  --oxnv-okd-color-blue-700: #1e6bff;
  --oxnv-okd-color-blue-800: #3077ff;
  --oxnv-okd-color-blue-900: #4283ff;
  --oxnv-okd-color-green-050: #002b1f;
  --oxnv-okd-color-green-100: #062b12;
  --oxnv-okd-color-green-200: #0c5625;
  --oxnv-okd-color-green-300: #138037;
  --oxnv-okd-color-green-400: #19ab4a;
  --oxnv-okd-color-green-500: #25a750;
  --oxnv-okd-color-green-600: #4cde7d;
  --oxnv-okd-color-green-700: #79e69d;
  --oxnv-okd-color-green-800: #a5efbe;
  --oxnv-okd-color-green-900: #d2f7de;
  --oxnv-okd-color-red-050: #270b12;
  --oxnv-okd-color-red-100: #300e17;
  --oxnv-okd-color-red-200: #601d2e;
  --oxnv-okd-color-red-300: #902b44;
  --oxnv-okd-color-red-400: #c03a5b;
  --oxnv-okd-color-red-500: #f04872;
  --oxnv-okd-color-red-600: #f76489;
  --oxnv-okd-color-red-700: #f994ae;
  --oxnv-okd-color-red-800: #f9b6c7;
  --oxnv-okd-color-red-900: #fff8f9;
  --oxnv-okd-color-orange-050: #361604;
  --oxnv-okd-color-orange-100: #532206;
  --oxnv-okd-color-orange-200: #743008;
  --oxnv-okd-color-orange-300: #8f3b0a;
  --oxnv-okd-color-orange-400: #aa460c;
  --oxnv-okd-color-orange-500: #c5510e;
  --oxnv-okd-color-orange-600: #e15c0f;
  --oxnv-okd-color-orange-700: #f76816;
  --oxnv-okd-color-orange-800: #f87428;
  --oxnv-okd-color-orange-900: #fa8c4d;
  --oxnv-okd-color-yellow-050: #2d2104;
  --oxnv-okd-color-yellow-100: #493603;
  --oxnv-okd-color-yellow-200: #674b04;
  --oxnv-okd-color-yellow-300: #7f5d05;
  --oxnv-okd-color-yellow-400: #966e06;
  --oxnv-okd-color-yellow-500: #ae8007;
  --oxnv-okd-color-yellow-600: #c69208;
  --oxnv-okd-color-yellow-700: #dba20e;
  --oxnv-okd-color-yellow-800: #dea921;
  --oxnv-okd-color-yellow-900: #e0b134;
  --oxnv-okd-color-text-white: #fff;
  --oxnv-okd-color-text-black: #1f2933;
  --oxnv-okd-color-background-1: #121212;
  --oxnv-okd-color-background-2: #1a1a1a;
  --oxnv-okd-color-transparent: transparent;
  --oxnv-okd-color-white: #fff;
  --oxnv-okd-color-black: #000;
  --oxnv-okd-color-line-muted: #2e2e2e;
  --oxnv-okd-color-line-amplifed: #6c6c6c;
  --oxnv-okd-color-line-secondary: #404040;
  --oxnv-okd-color-text-lighter: #6c6c6c;
  --oxnv-okd-color-text-light: #909090;
  --oxnv-okd-color-text-secondary: #e3e3e3;
  --oxnv-okd-color-text-amplifed: #fafafa;
  --oxnv-okd-color-background-3: #242424;
  --oxnv-okd-color-fq-blue-lv1: #3077ff;
  --oxnv-okd-color-fq-blue-lv2: #1e6bff;
  --oxnv-okd-color-fq-green-lv1: #1fd65c;
  --oxnv-okd-color-fq-red-lv1: #f04872;
  --oxnv-okd-color-fq-orange-lv1: #f76816;
  --oxnv-okd-color-prefer-red-chart: #f04872;
  --oxnv-okd-color-prefer-red-bg: #ca3f64;
  --oxnv-okd-color-prefer-green-chart: #1fd65c;
  --oxnv-okd-color-prefer-green-bg: #25a750;
  --oxnv-okd-color-prefer-red-text: #ca3f64;
  --oxnv-okd-color-prefer-green-text: #25a750;
  --oxnv-okd-color-branded-primary: #bcff2f;
  --oxnv-okd-color-fq-critical: #f04872;
  --oxnv-okd-color-fq-positive: #25a750;
  --oxnv-okd-color-fq-warning: #f76816;
  --oxnv-okd-color-fq-accent: #1e6bff;
  --oxnv-okd-color-fq-neutral: #fafafa;
  --oxnv-okd-color-prefer-neutral-bg: #909090;
  --oxnv-okd-color-prefer-neutral-text: #909090;
  --oxnv-okd-color-background-base-primary: #000;
  --oxnv-okd-color-background-base-secondary: #121212;
  --oxnv-okd-color-background-surface-primary: #1d1d1d;
  --oxnv-okd-color-background-surface-secondary: #121212;
  --oxnv-okd-color-background-surface-pressed: #383838;
  --oxnv-okd-color-background-surface-disable: #0e0e0e;
  --oxnv-okd-color-background-scrim: rgba(0, 0, 0, .68);
  --oxnv-okd-color-container-primary: #272727;
  --oxnv-okd-color-container-secondary: #272727;
  --oxnv-okd-color-container-tertiary: #383838;
  --oxnv-okd-color-container-contrast: #414141;
  --oxnv-okd-color-container-inverse: #fafafa;
  --oxnv-okd-color-content-primary: #fff;
  --oxnv-okd-color-content-secondary: #e6e6e6;
  --oxnv-okd-color-content-tertiary: #b3b3b3;
  --oxnv-okd-color-content-contrast: #909090;
  --oxnv-okd-color-content-disabled: #5b5b5b;
  --oxnv-okd-color-content-inverse: #000;
  --oxnv-okd-color-border-primary: #383838;
  --oxnv-okd-color-border-secondary: #4d4d4d;
  --oxnv-okd-color-border-contrast: #000;
  --oxnv-okd-color-border-selected: #fff;
  --oxnv-okd-color-semantic-neutral: #fff;
  --oxnv-okd-color-semantic-notice: #ffb117;
  --oxnv-okd-color-semantic-positive: #25a750;
  --oxnv-okd-color-semantic-negative: #ca3f64;
  --oxnv-okd-color-semantic-informative: #8a91ff;
  --oxnv-okd-color-semantic-highlight: #bcff2f;
  --oxnv-okd-color-dvp-neutral: hsla(0, 0%, 100%, .76);
  --oxnv-okd-color-dvp-profit: #25a750;
  --oxnv-okd-color-dvp-loss: #ca3f64;
  --oxnv-okd-color-categorical-01: #5f62ff;
  --oxnv-okd-color-categorical-02: #ffb117;
  --oxnv-okd-color-categorical-03: #bcff2f;
  --oxnv-okd-color-categorical-04: #00bc4b;
  --oxnv-okd-color-categorical-05: #f5384f;
  --oxnv-okd-color-transparent-white: transparent;
  --oxnv-okd-color-transparent-black: hsla(0, 0%, 100%, .02);
  --oxnv-okd-color-common-transparent: hsla(0, 0%, 100%, 0);
  --oxnv-okd-color-container-lv2: #1a1a1a;
  --oxnv-okd-color-alert-info: #2e2e2e;
  --oxnv-okd-color-alert-success: #002b1f;
  --oxnv-okd-color-alert-warning: #361604;
  --oxnv-okd-color-alert-error: #270b12;
  --oxnv-okd-color-common-background-2: #383838;
  --oxnv-okd-color-data-visualization-category-01: #5f62ff;
  --oxnv-okd-color-data-visualization-category-02: #ffb117;
  --oxnv-okd-color-data-visualization-category-03: #bcff2f;
  --oxnv-okd-color-data-visualization-category-04: #00bc4b;
  --oxnv-okd-color-data-visualization-category-05: #f5384f;
  --oxnv-okd-color-preference-loss: #ca3f64;
  --oxnv-okd-color-preference-profit: #25a750;
  --oxnv-okd-color-preference-neutral: hsla(0, 0%, 100%, .76);
  --oxnv-okd-color-border-focus: #fff;
  --oxnv-okd-color-background-base-primary_alternative: #000;
  --oxnv-okd-color-link-content: #8a91ff;
  --oxnv-okd-color-link-accent-content-primary: #bcff2f;
  --oxnv-okd-color-background-surface-contrast: #272727;
  --oxnv-okd-color-background-surface-brand: #bcff2f;
  --oxnv-okd-color-border-tertiary: #0e0e0e;
  --oxnv-okd-color-content-brand: #bcff2f;
  --oxnv-okd-color-modal-primary: #0e0e0e;
  --oxnv-okd-color-modal-secondary: #272727;
  --oxnv-okd-color-modal-tertiary: #383838;
  --oxnv-okd-color-modal-contrast: #4d4d4d;
  --oxnv-okd-color-card-primary: #0e0e0e;
  --oxnv-okd-color-card-secondary: #121212;
  --oxnv-okd-color-brand-primary: #121212;
  --oxnv-okd-color-brand-primary-alternative: #bcff2f;
  --oxnv-okd-color-brand-secondary: #272727;
  --oxnv-okd-color-brand-tertiary: #383838;
  --oxnv-okd-color-brand-content: #e6ffb0;
  --oxnv-okd-color-brand-content-contrast: #000;
  --oxnv-okd-color-global-fixed-always-dark: #000;
  --oxnv-okd-color-global-fixed-always-light: #fff;
  --oxnv-okd-color-surface-structural-subbase: #121212;
  --oxnv-okd-color-surface-info-default: #b8b8b8;
  --oxnv-okd-color-surface-info-subtle: #121212;
  --oxnv-okd-color-surface-warning-default: #f5a915;
  --oxnv-okd-color-surface-warning-subtle: #4d3200;
  --oxnv-okd-color-surface-success-default: #3c8f24;
  --oxnv-okd-color-surface-success-subtle: #192400;
  --oxnv-okd-color-surface-danger-default: #ff5d73;
  --oxnv-okd-color-surface-danger-subtle: #420a10;
  --oxnv-okd-color-surface-interactive-default: hsla(0, 0%, 100%, .13);
  --oxnv-okd-color-surface-interactive-hovered: hsla(0, 0%, 100%, .16);
  --oxnv-okd-color-surface-interactive-pressed: hsla(0, 0%, 100%, .22);
  --oxnv-okd-color-surface-interactive-disabled: hsla(0, 0%, 100%, .08);
  --oxnv-okd-color-surface-interactive-oncolor-default: hsla(0, 0%, 100%, .1);
  --oxnv-okd-color-surface-interactive-oncolor-hovered: hsla(0, 0%, 100%, .15);
  --oxnv-okd-color-surface-interactive-oncolor-pressed: hsla(0, 0%, 100%, .2);
  --oxnv-okd-color-surface-interactive-emphasis-default: hsla(0, 0%, 100%, .99);
  --oxnv-okd-color-surface-interactive-emphasis-hovered: hsla(0, 0%, 100%, .8);
  --oxnv-okd-color-surface-interactive-emphasis-pressed: hsla(0, 0%, 100%, .7);
  --oxnv-okd-color-surface-interactive-emphasis-disabled: hsla(0, 0%, 100%, .08);
  --oxnv-okd-color-surface-interactive-selected-default: #fff;
  --oxnv-okd-color-surface-interactive-selected-subtle: hsla(0, 0%, 100%, .13);
  --oxnv-okd-color-surface-interactive-selected-oncolor: hsla(0, 0%, 100%, .1);
  --oxnv-okd-color-surface-structural-base: #000;
  --oxnv-okd-color-surface-structural-layer-1: #121212;
  --oxnv-okd-color-surface-structural-layer-2: #2c2c2c;
  --oxnv-okd-color-surface-structural-layer-3: #3f3f3f;
  --oxnv-okd-color-surface-structural-highlight: var(--global-color-highlight);
  --oxnv-okd-color-surface-structural-inverse: #fff;
  --oxnv-okd-color-surface-structural-elevated-default: #171717;
  --oxnv-okd-color-surface-structural-elevated-contrast: #343434;
  --oxnv-okd-color-surface-structural-overlay: rgba(0, 0, 0, .6);
  --oxnv-okd-color-border-static-default: hsla(0, 0%, 100%, .22);
  --oxnv-okd-color-border-static-subtle: hsla(0, 0%, 100%, .13);
  --oxnv-okd-color-border-static-dotted: hsla(0, 0%, 100%, .4);
  --oxnv-okd-color-border-interactive-default: hsla(0, 0%, 100%, .4);
  --oxnv-okd-color-border-interactive-hovered: #cfcfcf;
  --oxnv-okd-color-border-interactive-pressed: #fff;
  --oxnv-okd-color-border-interactive-focused: #fff;
  --oxnv-okd-color-border-interactive-selected: #fff;
  --oxnv-okd-color-border-interactive-error: #f57a8a;
  --oxnv-okd-color-border-interactive-emphasis: #b8b8b8;
  --oxnv-okd-color-border-interactive-oncolor: #2c2c2c;
  --oxnv-okd-color-border-static-emphasis: #b8b8b8;
  --oxnv-okd-color-border-static-experience: var(--global-color-experience-default);
  --oxnv-okd-color-border-static-highlight: var(--global-color-highlight);
  --oxnv-okd-color-border-static-overlay: hsla(0, 0%, 100%, .1);
  --oxnv-okd-color-border-interactive-disabled: hsla(0, 0%, 100%, .22);
  --oxnv-okd-color-border-info-default: #ebebeb;
  --oxnv-okd-color-border-info-subtle: #7d7d7d;
  --oxnv-okd-color-border-warning-default: #ffc452;
  --oxnv-okd-color-border-warning-subtle: #4d3200;
  --oxnv-okd-color-border-success-default: #49a92d;
  --oxnv-okd-color-border-success-subtle: #192400;
  --oxnv-okd-color-border-danger-default: #f57a8a;
  --oxnv-okd-color-border-danger-subtle: #420a10;
  --oxnv-okd-color-content-static-default: #fff;
  --oxnv-okd-color-content-interactive-default: #b8b8b8;
  --oxnv-okd-color-content-interactive-subtle: #7d7d7d;
  --oxnv-okd-color-content-interactive-hovered: #ebebeb;
  --oxnv-okd-color-content-static-subtle: #969696;
  --oxnv-okd-color-content-interactive-pressed: #fff;
  --oxnv-okd-color-content-static-inverse: #000;
  --oxnv-okd-color-content-static-highlight: var(--global-color-highlight);
  --oxnv-okd-color-content-static-placeholder: hsla(0, 0%, 100%, .3);
  --oxnv-okd-color-content-interactive-active: #fff;
  --oxnv-okd-color-content-interactive-selected: #fff;
  --oxnv-okd-color-content-interactive-error: #f57a8a;
  --oxnv-okd-color-content-interactive-disabled: hsla(0, 0%, 100%, .22);
  --oxnv-okd-color-content-info-default: #ebebeb;
  --oxnv-okd-color-content-info-subtle: #7d7d7d;
  --oxnv-okd-color-content-warning-default: #ffc452;
  --oxnv-okd-color-content-warning-subtle: #4d3200;
  --oxnv-okd-color-content-success-default: #49a92d;
  --oxnv-okd-color-content-success-subtle: #192400;
  --oxnv-okd-color-content-danger-default: #f57a8a;
  --oxnv-okd-color-content-danger-subtle: #420a10;
  --oxnv-okd-color-content-illustration-default: #fff;
  --oxnv-okd-color-content-dataviz-categorical-1: var(--global-color-feature-default);
  --oxnv-okd-color-content-dataviz-categorical-2: #277ae7;
  --oxnv-okd-color-content-dataviz-categorical-3: #ffb729;
  --oxnv-okd-color-content-dataviz-categorical-4: #edc746;
  --oxnv-okd-color-content-dataviz-categorical-5: #ac6cff;
  --oxnv-okd-color-content-dataviz-categorical-6: #969696;
  --oxnv-okd-color-content-dataviz-categorical-7: #636363;
  --oxnv-okd-color-content-dataviz-categorical-8: #454545;
  --oxnv-okd-color-content-illustration-inverse: #000;
  --oxnv-okd-color-content-illustration-experience: var(--global-color-experience-default);
  --oxnv-okd-color-content-illustration-highlight: var(--global-color-highlight);
  --oxnv-okd-color-global-alpha-matching-5: rgba(0, 0, 0, .05);
  --oxnv-okd-color-global-alpha-matching-10: rgba(0, 0, 0, .1);
  --oxnv-okd-color-global-alpha-matching-20: rgba(0, 0, 0, .2);
  --oxnv-okd-color-global-alpha-matching-30: rgba(0, 0, 0, .3);
  --oxnv-okd-color-global-alpha-matching-40: rgba(0, 0, 0, .4);
  --oxnv-okd-color-global-alpha-matching-50: rgba(0, 0, 0, .5);
  --oxnv-okd-color-global-alpha-matching-60: rgba(0, 0, 0, .6);
  --oxnv-okd-color-global-alpha-matching-70: rgba(0, 0, 0, .7);
  --oxnv-okd-color-global-alpha-matching-80: rgba(0, 0, 0, .8);
  --oxnv-okd-color-global-alpha-matching-90: rgba(0, 0, 0, .9);
  --oxnv-okd-color-global-alpha-inverse-5: hsla(0, 0%, 100%, .08);
  --oxnv-okd-color-global-alpha-pnl-profit: var(--global-color-profit-alpha);
  --oxnv-okd-color-global-alpha-pnl-loss: var(--global-color-loss-alpha);
  --oxnv-okd-color-global-alpha-feature-1: rgba(188, 255, 47, .16);
  --oxnv-okd-color-global-alpha-inverse-10: hsla(0, 0%, 100%, .13);
  --oxnv-okd-color-global-alpha-inverse-20: hsla(0, 0%, 100%, .22);
  --oxnv-okd-color-global-alpha-inverse-30: hsla(0, 0%, 100%, .3);
  --oxnv-okd-color-global-alpha-inverse-40: hsla(0, 0%, 100%, .4);
  --oxnv-okd-color-global-alpha-inverse-50: hsla(0, 0%, 100%, .5);
  --oxnv-okd-color-global-alpha-inverse-60: hsla(0, 0%, 100%, .6);
  --oxnv-okd-color-global-alpha-inverse-70: hsla(0, 0%, 100%, .7);
  --oxnv-okd-color-global-alpha-inverse-80: hsla(0, 0%, 100%, .8);
  --oxnv-okd-color-global-alpha-inverse-90: hsla(0, 0%, 100%, .9);
  --oxnv-okd-color-surface-pnl-profit-default: var(--global-color-profit-surface-default);
  --oxnv-okd-color-surface-pnl-profit-hovered: var(--global-color-profit-surface-hovered);
  --oxnv-okd-color-surface-pnl-profit-pressed: var(--global-color-profit-surface-pressed);
  --oxnv-okd-color-surface-pnl-profit-tint: var(--global-color-profit-tint);
  --oxnv-okd-color-surface-pnl-loss-default: var(--global-color-loss-surface-default);
  --oxnv-okd-color-surface-pnl-loss-hovered: var(--global-color-loss-surface-hovered);
  --oxnv-okd-color-surface-pnl-loss-pressed: var(--global-color-loss-surface-pressed);
  --oxnv-okd-color-surface-pnl-loss-tint: var(--global-color-loss-tint);
  --oxnv-okd-color-surface-pnl-neutral-default: var(--global-color-neutral-surface-default);
  --oxnv-okd-color-surface-pnl-neutral-hovered: var(--global-color-neutral-surface-hovered);
  --oxnv-okd-color-surface-pnl-neutral-pressed: var(--global-color-neutral-surface-pressed);
  --oxnv-okd-color-surface-interactive-feature-default: var(--global-color-feature-default);
  --oxnv-okd-color-surface-interactive-experience-default: var(--global-color-experience-default);
  --oxnv-okd-color-surface-interactive-experience-hovered: var(--global-color-experience-hovered);
  --oxnv-okd-color-surface-interactive-experience-pressed: var(--global-color-experience-pressed);
  --oxnv-okd-color-surface-interactive-feature-hovered: var(--global-color-feature-hovered);
  --oxnv-okd-color-surface-interactive-feature-pressed: var(--global-color-feature-pressed);
  --oxnv-okd-color-surface-pnl-loss-graph: var(--global-color-loss-graph);
  --oxnv-okd-color-surface-structural-feature: var(--global-color-feature-default);
  --oxnv-okd-color-surface-structural-experience: var(--global-color-experience-default);
  --oxnv-okd-color-border-interactive-feature-default: var(--global-color-feature-default);
  --oxnv-okd-color-border-interactive-feature-hovered: var(--global-color-feature-hovered);
  --oxnv-okd-color-border-interactive-feature-pressed: var(--global-color-feature-pressed);
  --oxnv-okd-color-border-static-feature: var(--global-color-feature-default);
  --oxnv-okd-color-content-static-subtler: #636363;
  --oxnv-okd-color-content-static-feature: var(--global-color-feature-default);
  --oxnv-okd-color-content-static-experience: var(--global-color-experience-default);
  --oxnv-okd-color-content-pnl-profit-default: var(--global-color-profit-default);
  --oxnv-okd-color-content-illustration-feature: var(--global-color-feature-default);
  --oxnv-okd-color-content-pnl-profit-oncolor: var(--global-color-profit-oncolor);
  --oxnv-okd-color-content-pnl-loss-default: var(--global-color-loss-default);
  --oxnv-okd-color-content-pnl-loss-oncolor: var(--global-color-loss-oncolor);
  --oxnv-okd-color-content-pnl-neutral-default: var(--global-color-neutral-default);
  --oxnv-okd-color-content-pnl-neutral-oncolor: var(--global-color-neutral-oncolor);
  --oxnv-okd-color-surface-pnl-profit-graph: var(--global-color-profit-graph);
  --oxnv-okd-color-surface-pnl-neutral-graph: var(--global-color-neutral-graph);
  --oxnv-okd-color-border-interactive-experience-default: var(--global-color-experience-default);
  --oxnv-okd-color-border-interactive-experience-hovered: var(--global-color-experience-hovered);
  --oxnv-okd-color-border-interactive-experience-pressed: var(--global-color-experience-pressed);
  --oxnv-okd-color-content-interactive-feature-default: var(--global-color-feature-default);
  --oxnv-okd-color-content-interactive-feature-hovered: var(--global-color-feature-hovered);
  --oxnv-okd-color-content-interactive-feature-pressed: var(--global-color-feature-pressed);
  --oxnv-okd-color-content-interactive-experience-default: var(--global-color-experience-default);
  --oxnv-okd-color-content-interactive-experience-alternative: var(--global-color-experience-alternative);
  --oxnv-okd-color-content-interactive-experience-accent: var(--global-color-experience-accent);
  --oxnv-okd-color-content-interactive-experience-hovered: var(--global-color-experience-hovered);
  --oxnv-okd-color-content-interactive-experience-pressed: var(--global-color-experience-pressed);
  --oxnv-okd-color-content-interactive-experience-inverse: var(--global-color-experience-inverse);
  --oxnv-okd-color-content-interactive-feature-inverse-default: var(--global-color-feature-primary-inverse-default);
  --oxnv-okd-color-content-interactive-feature-inverse-hovered: var(--global-color-feature-primary-inverse-hovered);
  --oxnv-okd-color-content-interactive-feature-inverse-pressed: var(--global-color-feature-primary-inverse-pressed);
  --oxnv-okd-color-surface-interactive-feature-inverse-default: var(--global-color-feature-primary-inverse-default);
  --oxnv-okd-color-surface-interactive-feature-inverse-hovered: var(--global-color-feature-primary-inverse-hovered);
  --oxnv-okd-color-surface-interactive-feature-inverse-pressed: var(--global-color-feature-primary-inverse-pressed);
  --oxnv-okd-color-border-pnl-loss-default: var(--global-color-loss-default);
  --oxnv-okd-color-border-pnl-loss-graph: var(--global-color-loss-graph);
  --oxnv-okd-color-border-pnl-profit-default: var(--global-color-profit-default);
  --oxnv-okd-color-border-pnl-profit-graph: var(--global-color-profit-graph);
  --oxnv-okd-color-border-pnl-neutral-graph: var(--global-color-neutral-graph);
  --oxnv-okd-color-content-static-notification: #f5384f;
  --oxnv-okd-color-surface-interactive-unselected-default: hsla(0, 0%, 100%, .4);
  --oxnv-okd-color-surface-structural-elevated-layer-1: #2c2c2c;
  --oxnv-okd-color-surface-interactive-destructive-default: #f5384f;
  --oxnv-okd-color-surface-interactive-destructive-hovered: #ff5d73;
  --oxnv-okd-color-surface-interactive-destructive-pressed: #f57a8a;
  --oxnv-okd-color-surface-structural-web-only-base: #000;
  --oxnv-okd-color-surface-structural-web-only-layer-1: #121212;
  --oxnv-okd-color-global-fixed-shadow: rgba(0, 0, 0, .16);
  --oxnv-okd-color-surface-interactive-destructive-subtle-default: #420a10;
  --oxnv-okd-color-surface-interactive-destructive-subtle-hovered: #840916;
  --oxnv-okd-color-surface-interactive-destructive-subtle-pressed: #c8142a;
  --oxnv-okd-color-global-fixed-always-light-20: hsla(0, 0%, 100%, .2);
  --oxnv-okd-color-surface-pnl-profit-default-new: var(--global-color-profit-surface-default-new);
  --oxnv-okd-color-surface-pnl-profit-emphasis: var(--global-color-profit-surface-emphasis);
  --oxnv-okd-color-surface-pnl-loss-default-new: var(--global-color-loss-surface-default-new);
  --oxnv-okd-color-surface-pnl-loss-emphasis: var(--global-color-loss-surface-emphasis);
  --oxnv-okd-color-content-pnl-profit-oncolor-default: var(--global-color-profit-default);
  --oxnv-okd-color-content-pnl-profit-oncolor-emphasis: var(--global-color-profit-oncolor);
  --oxnv-okd-color-content-pnl-loss-oncolor-default: var(--global-color-loss-default);
  --oxnv-okd-color-content-pnl-loss-oncolor-emphasis: var(--global-color-loss-oncolor);
  --oxnv-okd-color-surface-pnl-profit-gradient-max: var(--global-color-profit-gradient-max);
  --oxnv-okd-color-surface-pnl-profit-gradient-min: var(--global-color-profit-gradient-min);
  --oxnv-okd-color-surface-pnl-loss-gradient-max: rgba(252, 70, 171, .2);
  --oxnv-okd-color-surface-pnl-loss-gradient-min: rgba(252, 70, 171, 0);
  --oxnv-okd-font-size-base: 16px;
  --oxnv-okd-font-size-md: 14px;
  --oxnv-okd-font-size-xs: 12px;
  --oxnv-okd-line-height-base: 20px;
  --oxnv-okd-line-height-md: 20px;
  --oxnv-okd-line-height-xs: 16px;
  --oxnv-okd-shadow-none: 0 0 0 0 transparent;
  --oxnv-okd-shadow-xs: 0 0 0 1px #0000000d;
  --oxnv-okd-shadow-sm: 0 1px 2px 0 #0000000d;
  --oxnv-okd-shadow-default: 0 1px 3px 0 #0000001a, 0 1px 2px 0 #0000000f;
  --oxnv-okd-shadow-md: 0 4px 6px -1px #0000001a, 0 2px 4px -1px #0000000f;
  --oxnv-okd-shadow-lg: 0 10px 15px -3px #0000001a, 0 4px 6px -2px #0000000d;
  --oxnv-okd-shadow-xl: 0 20px 25px -5px #0000001a, 0 10px 10px -5px #0000000a;
  --oxnv-okd-shadow-2xl: 0 25px 50px -12px #00000040;
  --oxnv-okd-border-radius-none: 0;
  --oxnv-okd-border-radius-sm: 2px;
  --oxnv-okd-border-radius-md: 4px;
  --oxnv-okd-border-radius-lg: 6px;
  --oxnv-okd-border-radius-xl: 8px;
  --oxnv-okd-border-radius-xxl: 10px;
  --oxnv-okd-border-radius-xxxl: 12px;
  --oxnv-okd-font-family: HarmonyOS Sans, SF Pro Text, SF Pro Icons, Arial, Helvetica Neue, Helvetica, sans-serif;
  --oxnv-okd-text-display-lg-font-size: 56px;
  --oxnv-okd-text-display-lg-font-weight: 500;
  --oxnv-okd-text-display-lg-line-height: 1.32;
  --oxnv-okd-text-display-md-font-size: 40px;
  --oxnv-okd-text-display-md-font-weight: 500;
  --oxnv-okd-text-display-md-line-height: 52px;
  --oxnv-okd-text-display-sm-font-size: 40px;
  --oxnv-okd-text-display-sm-font-weight: 500;
  --oxnv-okd-text-display-sm-line-height: 52px;
  --oxnv-okd-text-heading-lg-font-size: 30px;
  --oxnv-okd-text-heading-lg-font-weight: 500;
  --oxnv-okd-text-heading-lg-line-height: 40px;
  --oxnv-okd-text-heading-md-font-size: 24px;
  --oxnv-okd-text-heading-md-font-weight: 500;
  --oxnv-okd-text-heading-md-line-height: 30px;
  --oxnv-okd-text-heading-sm-font-size: 18px;
  --oxnv-okd-text-heading-sm-font-weight: 500;
  --oxnv-okd-text-heading-sm-line-height: 24px;
  --oxnv-okd-text-heading-xl-font-size: 36px;
  --oxnv-okd-text-heading-xl-line-height: 1.32;
  --oxnv-okd-text-heading-xl-font-weight: 600;
  --oxnv-okd-text-heading-xxl-font-size: 40px;
  --oxnv-okd-text-heading-xxl-line-height: 1.32;
  --oxnv-okd-text-heading-xxl-font-weight: 600;
  --oxnv-okd-text-heading-overline-font-size: 12px;
  --oxnv-okd-text-heading-overline-line-height: 15px;
  --oxnv-okd-text-heading-overline-font-weight: 500;
  --oxnv-okd-text-body-sm-regular-font-size: 14px;
  --oxnv-okd-text-body-sm-regular-font-weight: 400;
  --oxnv-okd-text-body-sm-regular-line-height: 21px;
  --oxnv-okd-text-body-sm-bold-font-size: 14px;
  --oxnv-okd-text-body-sm-bold-font-weight: 500;
  --oxnv-okd-text-body-sm-bold-line-height: 21px;
  --oxnv-okd-text-body-md-regular-font-size: 16px;
  --oxnv-okd-text-body-md-regular-font-weight: 400;
  --oxnv-okd-text-body-md-regular-line-height: 24px;
  --oxnv-okd-text-body-md-bold-font-size: 16px;
  --oxnv-okd-text-body-md-bold-font-weight: 500;
  --oxnv-okd-text-body-md-bold-line-height: 24px;
  --oxnv-okd-text-body-xs-regular-font-size: 12px;
  --oxnv-okd-text-body-xs-regular-font-weight: 400;
  --oxnv-okd-text-body-xs-regular-line-height: 18px;
  --oxnv-okd-text-body-xs-bold-font-size: 12px;
  --oxnv-okd-text-body-xs-bold-font-weight: 500;
  --oxnv-okd-text-body-xs-bold-line-height: 18px;
  --oxnv-okd-font-weight-400: 400;
  --oxnv-okd-font-weight-500: 500;
  --oxnv-okd-font-weight-600: 600;
  --oxnv-okd-font-weight-700: 700;
  --oxnv-okd-font-weight-800: 800;
  --oxnv-okd-font-weight-900: 900;
  --oxnv-okd-font-weight-regular: 400;
  --oxnv-okd-font-weight-medium: 500;
  --oxnv-okd-font-weight-bold: 700
}

.theme-light.brand-web3 {
  --global-color-feature-default: #2b6d17;
  --global-color-feature-hovered: #225812;
  --global-color-feature-pressed: #18400c;
  --global-color-feature-primary-inverse-default: #e6ffb0;
  --global-color-feature-primary-inverse-hovered: #c4dd8f;
  --global-color-feature-primary-inverse-pressed: #a6bc74;
  --global-color-experience-default: #000;
  --global-color-experience-alternative: #9aed2c;
  --global-color-experience-accent: #fff;
  --global-color-experience-hovered: #73be17;
  --global-color-experience-pressed: #519200;
  --global-color-experience-inverse: #fff;
  --global-color-highlight: #bcff2f
}

.theme-dark.brand-web3 {
  --global-color-feature-default: #bcff2f;
  --global-color-feature-hovered: #9ce207;
  --global-color-feature-pressed: #87c600;
  --global-color-feature-primary-inverse-default: #133f06;
  --global-color-feature-primary-inverse-hovered: #0f3304;
  --global-color-feature-primary-inverse-pressed: #0b2702;
  --global-color-experience-default: #bcff2f;
  --global-color-experience-alternative: #000;
  --global-color-experience-accent: #fff;
  --global-color-experience-hovered: #73be17;
  --global-color-experience-pressed: #a0e847;
  --global-color-experience-inverse: #000;
  --global-color-highlight: #bcff2f
}

.theme-light.pnl-classic {
  --global-color-profit-default: #31bd65;
  --global-color-profit-default-rgb: 49, 189, 101;
  --global-color-profit-surface-default: #31bd65;
  --global-color-profit-surface-default-rgb: 49, 189, 101;
  --global-color-profit-surface-hovered: #29ad5a;
  --global-color-profit-surface-pressed: #008535;
  --global-color-profit-oncolor: #fff;
  --global-color-profit-tint: rgba(49, 189, 101, .2);
  --global-color-profit-graph: #31bd65;
  --global-color-profit-alpha: hsla(0, 0%, 100%, .2);
  --global-color-loss-default: #eb4b6d;
  --global-color-loss-default-rgb: 235, 75, 109;
  --global-color-loss-surface-default: #eb4b6d;
  --global-color-loss-surface-default-rgb: 235, 75, 109;
  --global-color-loss-surface-hovered: #dd4263;
  --global-color-loss-surface-pressed: #cd2438;
  --global-color-loss-oncolor: #fff;
  --global-color-loss-tint: rgba(235, 75, 109, .2);
  --global-color-loss-graph: #eb4b6d;
  --global-color-loss-alpha: hsla(0, 0%, 100%, .2);
  --global-color-neutral-default: #5e5e5e;
  --global-color-neutral-surface-default: #5e5e5e;
  --global-color-neutral-surface-hovered: #4c4c4c;
  --global-color-neutral-surface-pressed: #393939;
  --global-color-neutral-oncolor: #fff;
  --global-color-neutral-graph: #5e5e5e;
  --global-color-profit-surface-default-new: #e0f5e8;
  --global-color-profit-surface-emphasis: #31bd65;
  --global-color-loss-surface-default-new: #fce4e9;
  --global-color-loss-surface-emphasis: #eb4b6d;
  --global-color-profit-gradient-max: rgba(49, 189, 101, .2);
  --global-color-profit-gradient-min: rgba(49, 189, 101, 0);
  --global-color-loss-gradient-max: rgba(235, 75, 109, .2);
  --global-color-loss-gradient-min: rgba(235, 75, 109, 0)
}

.theme-light.pnl-modern {
  --global-color-profit-default: #2b6d17;
  --global-color-profit-default-rgb: 43, 109, 23;
  --global-color-profit-surface-default: #d2e8a4;
  --global-color-profit-surface-default-rgb: 210, 232, 164;
  --global-color-profit-surface-hovered: #bad385;
  --global-color-profit-surface-pressed: #a4bd70;
  --global-color-profit-oncolor: #2b6d17;
  --global-color-profit-tint: rgba(125, 183, 2, .13);
  --global-color-profit-graph: #81be00;
  --global-color-profit-alpha: rgba(43, 109, 23, .16);
  --global-color-loss-default: #a54162;
  --global-color-loss-default-rgb: 165, 65, 98;
  --global-color-loss-surface-default: #ffc0d3;
  --global-color-loss-surface-default-rgb: 255, 192, 211;
  --global-color-loss-surface-hovered: #e8a4b8;
  --global-color-loss-surface-pressed: #d68fa4;
  --global-color-loss-oncolor: #a54162;
  --global-color-loss-tint: rgba(255, 96, 144, .15);
  --global-color-loss-graph: #fc46ab;
  --global-color-loss-alpha: rgba(165, 65, 98, .16);
  --global-color-neutral-default: #5e5e5e;
  --global-color-neutral-surface-default: #f5f5f5;
  --global-color-neutral-surface-hovered: #dedede;
  --global-color-neutral-surface-pressed: #c8c8c8;
  --global-color-neutral-oncolor: #5e5e5e;
  --global-color-neutral-graph: #5e5e5e;
  --global-color-profit-surface-default-new: #d2e8a4;
  --global-color-profit-surface-emphasis: #d2e8a4;
  --global-color-loss-surface-default-new: #ffc0d3;
  --global-color-loss-surface-emphasis: #ffc0d3;
  --global-color-profit-gradient-max: rgba(129, 190, 0, .2);
  --global-color-profit-gradient-min: rgba(129, 190, 0, 0);
  --global-color-loss-gradient-max: rgba(252, 70, 171, .2);
  --global-color-loss-gradient-min: rgba(252, 70, 171, 0)
}

.theme-light {
  --global-color-global-alpha-pnl-profit: var(--oxnv-okd-color-global-alpha-pnl-profit);
  --global-color-global-alpha-pnl-loss: var(--oxnv-okd-color-global-alpha-pnl-loss);
  --global-color-surface-pnl-profit-default: var(--oxnv-okd-color-surface-pnl-profit-default);
  --global-color-surface-pnl-profit-hovered: var(--oxnv-okd-color-surface-pnl-profit-hovered);
  --global-color-surface-pnl-profit-pressed: var(--oxnv-okd-color-surface-pnl-profit-pressed);
  --global-color-surface-pnl-profit-tint: var(--oxnv-okd-color-surface-pnl-profit-tint);
  --global-color-surface-pnl-loss-default: var(--oxnv-okd-color-surface-pnl-loss-default);
  --global-color-surface-pnl-loss-hovered: var(--oxnv-okd-color-surface-pnl-loss-hovered);
  --global-color-surface-pnl-loss-pressed: var(--oxnv-okd-color-surface-pnl-loss-pressed);
  --global-color-surface-pnl-loss-tint: var(--oxnv-okd-color-surface-pnl-loss-tint);
  --global-color-surface-pnl-neutral-default: var(--oxnv-okd-color-surface-pnl-neutral-default);
  --global-color-surface-pnl-neutral-hovered: var(--oxnv-okd-color-surface-pnl-neutral-hovered);
  --global-color-surface-pnl-neutral-pressed: var(--oxnv-okd-color-surface-pnl-neutral-pressed);
  --global-color-surface-pnl-loss-graph: var(--oxnv-okd-color-surface-pnl-loss-graph);
  --global-color-content-pnl-profit-default: var(--oxnv-okd-color-content-pnl-profit-default);
  --global-color-content-pnl-profit-oncolor: var(--oxnv-okd-color-content-pnl-profit-oncolor);
  --global-color-content-pnl-loss-default: var(--oxnv-okd-color-content-pnl-loss-default);
  --global-color-content-pnl-loss-oncolor: var(--oxnv-okd-color-content-pnl-loss-oncolor);
  --global-color-content-pnl-neutral-default: var(--oxnv-okd-color-content-pnl-neutral-default);
  --global-color-content-pnl-neutral-oncolor: var(--oxnv-okd-color-content-pnl-neutral-oncolor);
  --global-color-surface-pnl-profit-graph: var(--oxnv-okd-color-surface-pnl-profit-graph);
  --global-color-surface-pnl-neutral-graph: var(--oxnv-okd-color-surface-pnl-neutral-graph);
  --global-color-border-pnl-loss-default: var(--oxnv-okd-color-border-pnl-loss-default);
  --global-color-border-pnl-loss-graph: var(--oxnv-okd-color-border-pnl-loss-graph);
  --global-color-border-pnl-profit-default: var(--oxnv-okd-color-border-pnl-profit-default);
  --global-color-border-pnl-profit-graph: var(--oxnv-okd-color-border-pnl-profit-graph);
  --global-color-border-pnl-neutral-graph: var(--oxnv-okd-color-border-pnl-neutral-graph);
  --global-color-surface-pnl-profit-default-new: var(--oxnv-okd-color-surface-pnl-profit-default-new);
  --global-color-surface-pnl-profit-emphasis: var(--oxnv-okd-color-surface-pnl-profit-emphasis);
  --global-color-surface-pnl-loss-default-new: var(--oxnv-okd-color-surface-pnl-loss-default-new);
  --global-color-surface-pnl-loss-emphasis: var(--oxnv-okd-color-surface-pnl-loss-emphasis);
  --global-color-content-pnl-profit-oncolor-default: var(--oxnv-okd-color-content-pnl-profit-oncolor-default);
  --global-color-content-pnl-profit-oncolor-emphasis: var(--oxnv-okd-color-content-pnl-profit-oncolor-emphasis);
  --global-color-content-pnl-loss-oncolor-default: var(--oxnv-okd-color-content-pnl-loss-oncolor-default);
  --global-color-content-pnl-loss-oncolor-emphasis: var(--oxnv-okd-color-content-pnl-loss-oncolor-emphasis);
  --global-color-surface-pnl-profit-gradient-max: var(--oxnv-okd-color-surface-pnl-profit-gradient-max);
  --global-color-surface-pnl-profit-gradient-min: var(--oxnv-okd-color-surface-pnl-profit-gradient-min)
}

.theme-light.cfg-red-up {
  --global-color-global-alpha-pnl-profit: var(--oxnv-okd-color-global-alpha-pnl-loss);
  --global-color-global-alpha-pnl-loss: var(--oxnv-okd-color-global-alpha-pnl-profit);
  --global-color-surface-pnl-profit-default: var(--oxnv-okd-color-surface-pnl-loss-default);
  --global-color-surface-pnl-profit-hovered: var(--oxnv-okd-color-surface-pnl-loss-hovered);
  --global-color-surface-pnl-profit-pressed: var(--oxnv-okd-color-surface-pnl-loss-pressed);
  --global-color-surface-pnl-profit-tint: var(--oxnv-okd-color-surface-pnl-loss-tint);
  --global-color-surface-pnl-loss-default: var(--oxnv-okd-color-surface-pnl-profit-default);
  --global-color-surface-pnl-loss-hovered: var(--oxnv-okd-color-surface-pnl-profit-hovered);
  --global-color-surface-pnl-loss-pressed: var(--oxnv-okd-color-surface-pnl-profit-pressed);
  --global-color-surface-pnl-loss-tint: var(--oxnv-okd-color-surface-pnl-profit-tint);
  --global-color-surface-pnl-loss-graph: var(--oxnv-okd-color-surface-pnl-profit-graph);
  --global-color-content-pnl-profit-default: var(--oxnv-okd-color-content-pnl-loss-default);
  --global-color-content-pnl-profit-oncolor: var(--oxnv-okd-color-content-pnl-loss-oncolor);
  --global-color-content-pnl-loss-default: var(--oxnv-okd-color-content-pnl-profit-default);
  --global-color-content-pnl-loss-oncolor: var(--oxnv-okd-color-content-pnl-profit-oncolor);
  --global-color-surface-pnl-profit-graph: var(--oxnv-okd-color-surface-pnl-loss-graph);
  --global-color-border-pnl-loss-default: var(--oxnv-okd-color-border-pnl-profit-default);
  --global-color-border-pnl-loss-graph: var(--oxnv-okd-color-border-pnl-profit-graph);
  --global-color-border-pnl-profit-default: var(--oxnv-okd-color-border-pnl-loss-default);
  --global-color-border-pnl-profit-graph: var(--oxnv-okd-color-border-pnl-loss-graph);
  --global-color-surface-pnl-profit-default-new: var(--oxnv-okd-color-surface-pnl-loss-default-new);
  --global-color-surface-pnl-profit-emphasis: var(--oxnv-okd-color-surface-pnl-loss-emphasis);
  --global-color-surface-pnl-loss-default-new: var(--oxnv-okd-color-surface-pnl-profit-default-new);
  --global-color-surface-pnl-loss-emphasis: var(--oxnv-okd-color-surface-pnl-profit-emphasis);
  --global-color-content-pnl-profit-oncolor-default: var(--oxnv-okd-color-content-pnl-loss-oncolor-default);
  --global-color-content-pnl-profit-oncolor-emphasis: var(--oxnv-okd-color-content-pnl-loss-oncolor-emphasis);
  --global-color-content-pnl-loss-oncolor-default: var(--oxnv-okd-color-content-pnl-profit-oncolor-default);
  --global-color-content-pnl-loss-oncolor-emphasis: var(--oxnv-okd-color-content-pnl-profit-oncolor-emphasis)
}

.theme-dark.pnl-classic {
  --global-color-profit-default: #25a750;
  --global-color-profit-default-rgb: 37, 167, 80;
  --global-color-profit-surface-default: #25a750;
  --global-color-profit-surface-default-rgb: 37, 167, 80;
  --global-color-profit-surface-hovered: #1a8d40;
  --global-color-profit-surface-pressed: #005c25;
  --global-color-profit-oncolor: #fff;
  --global-color-profit-tint: rgba(37, 167, 80, .2);
  --global-color-profit-graph: #25a750;
  --global-color-profit-alpha: hsla(0, 0%, 100%, .2);
  --global-color-loss-default: #ca3f64;
  --global-color-loss-default-rgb: 202, 63, 100;
  --global-color-loss-surface-default: #ca3f64;
  --global-color-loss-surface-default-rgb: 202, 63, 100;
  --global-color-loss-surface-hovered: #b43255;
  --global-color-loss-surface-pressed: #9a1b2a;
  --global-color-loss-oncolor: #fff;
  --global-color-loss-tint: rgba(202, 63, 100, .2);
  --global-color-loss-graph: #ca3f64;
  --global-color-loss-alpha: hsla(0, 0%, 100%, .2);
  --global-color-neutral-default: #b8b8b8;
  --global-color-neutral-surface-default: #5e5e5e;
  --global-color-neutral-surface-hovered: #4c4c4c;
  --global-color-neutral-surface-pressed: #393939;
  --global-color-neutral-oncolor: #fff;
  --global-color-neutral-graph: #b8b8b8;
  --global-color-profit-surface-default-new: #071c0f;
  --global-color-profit-surface-emphasis: #25a750;
  --global-color-loss-surface-default-new: #230b10;
  --global-color-loss-surface-emphasis: #ca3f64;
  --global-color-profit-gradient-max: rgba(37, 167, 80, .2);
  --global-color-profit-gradient-min: rgba(37, 167, 80, 0);
  --global-color-loss-gradient-max: rgba(202, 63, 100, .2);
  --global-color-loss-gradient-min: rgba(202, 63, 100, 0)
}

.theme-dark.pnl-modern {
  --global-color-profit-default: #bcff2f;
  --global-color-profit-default-rgb: 188, 255, 47;
  --global-color-profit-surface-default: #213000;
  --global-color-profit-surface-default-rgb: 33, 48, 0;
  --global-color-profit-surface-hovered: #1a2600;
  --global-color-profit-surface-pressed: #111900;
  --global-color-profit-oncolor: #bcff2f;
  --global-color-profit-tint: rgba(141, 204, 0, .17);
  --global-color-profit-graph: #bcff2f;
  --global-color-profit-alpha: rgba(188, 255, 47, .16);
  --global-color-loss-default: #fc46ab;
  --global-color-loss-default-rgb: 252, 70, 171;
  --global-color-loss-surface-default: #3d192d;
  --global-color-loss-surface-default-rgb: 61, 25, 45;
  --global-color-loss-surface-hovered: #2a101f;
  --global-color-loss-surface-pressed: #11060c;
  --global-color-loss-oncolor: #fc46ab;
  --global-color-loss-tint: rgba(200, 92, 153, .2);
  --global-color-loss-graph: #fc46ab;
  --global-color-loss-alpha: rgba(252, 70, 171, .16);
  --global-color-neutral-default: #b8b8b8;
  --global-color-neutral-surface-default: #212121;
  --global-color-neutral-surface-hovered: #141414;
  --global-color-neutral-surface-pressed: #030303;
  --global-color-neutral-oncolor: #b8b8b8;
  --global-color-neutral-graph: #b8b8b8;
  --global-color-profit-surface-default-new: #213000;
  --global-color-profit-surface-emphasis: #213000;
  --global-color-loss-surface-default-new: #3d192d;
  --global-color-loss-surface-emphasis: #3d192d;
  --global-color-profit-gradient-max: rgba(188, 255, 47, .2);
  --global-color-profit-gradient-min: rgba(188, 255, 47, 0);
  --global-color-loss-gradient-max: rgba(252, 70, 171, .2);
  --global-color-loss-gradient-min: rgba(252, 70, 171, 0)
}

.theme-dark {
  --global-color-global-alpha-pnl-profit: var(--oxnv-okd-color-global-alpha-pnl-profit);
  --global-color-global-alpha-pnl-loss: var(--oxnv-okd-color-global-alpha-pnl-loss);
  --global-color-surface-pnl-profit-default: var(--oxnv-okd-color-surface-pnl-profit-default);
  --global-color-surface-pnl-profit-hovered: var(--oxnv-okd-color-surface-pnl-profit-hovered);
  --global-color-surface-pnl-profit-pressed: var(--oxnv-okd-color-surface-pnl-profit-pressed);
  --global-color-surface-pnl-profit-tint: var(--oxnv-okd-color-surface-pnl-profit-tint);
  --global-color-surface-pnl-loss-default: var(--oxnv-okd-color-surface-pnl-loss-default);
  --global-color-surface-pnl-loss-hovered: var(--oxnv-okd-color-surface-pnl-loss-hovered);
  --global-color-surface-pnl-loss-pressed: var(--oxnv-okd-color-surface-pnl-loss-pressed);
  --global-color-surface-pnl-loss-tint: var(--oxnv-okd-color-surface-pnl-loss-tint);
  --global-color-surface-pnl-neutral-default: var(--oxnv-okd-color-surface-pnl-neutral-default);
  --global-color-surface-pnl-neutral-hovered: var(--oxnv-okd-color-surface-pnl-neutral-hovered);
  --global-color-surface-pnl-neutral-pressed: var(--oxnv-okd-color-surface-pnl-neutral-pressed);
  --global-color-surface-pnl-loss-graph: var(--oxnv-okd-color-surface-pnl-loss-graph);
  --global-color-content-pnl-profit-default: var(--oxnv-okd-color-content-pnl-profit-default);
  --global-color-content-pnl-profit-oncolor: var(--oxnv-okd-color-content-pnl-profit-oncolor);
  --global-color-content-pnl-loss-default: var(--oxnv-okd-color-content-pnl-loss-default);
  --global-color-content-pnl-loss-oncolor: var(--oxnv-okd-color-content-pnl-loss-oncolor);
  --global-color-content-pnl-neutral-default: var(--oxnv-okd-color-content-pnl-neutral-default);
  --global-color-content-pnl-neutral-oncolor: var(--oxnv-okd-color-content-pnl-neutral-oncolor);
  --global-color-surface-pnl-profit-graph: var(--oxnv-okd-color-surface-pnl-profit-graph);
  --global-color-surface-pnl-neutral-graph: var(--oxnv-okd-color-surface-pnl-neutral-graph);
  --global-color-border-pnl-loss-default: var(--oxnv-okd-color-border-pnl-loss-default);
  --global-color-border-pnl-loss-graph: var(--oxnv-okd-color-border-pnl-loss-graph);
  --global-color-border-pnl-profit-default: var(--oxnv-okd-color-border-pnl-profit-default);
  --global-color-border-pnl-profit-graph: var(--oxnv-okd-color-border-pnl-profit-graph);
  --global-color-border-pnl-neutral-graph: var(--oxnv-okd-color-border-pnl-neutral-graph);
  --global-color-surface-pnl-profit-default-new: var(--oxnv-okd-color-surface-pnl-profit-default-new);
  --global-color-surface-pnl-profit-emphasis: var(--oxnv-okd-color-surface-pnl-profit-emphasis);
  --global-color-surface-pnl-loss-default-new: var(--oxnv-okd-color-surface-pnl-loss-default-new);
  --global-color-surface-pnl-loss-emphasis: var(--oxnv-okd-color-surface-pnl-loss-emphasis);
  --global-color-content-pnl-profit-oncolor-default: var(--oxnv-okd-color-content-pnl-profit-oncolor-default);
  --global-color-content-pnl-profit-oncolor-emphasis: var(--oxnv-okd-color-content-pnl-profit-oncolor-emphasis);
  --global-color-content-pnl-loss-oncolor-default: var(--oxnv-okd-color-content-pnl-loss-oncolor-default);
  --global-color-content-pnl-loss-oncolor-emphasis: var(--oxnv-okd-color-content-pnl-loss-oncolor-emphasis);
  --global-color-surface-pnl-profit-gradient-max: var(--oxnv-okd-color-surface-pnl-profit-gradient-max);
  --global-color-surface-pnl-profit-gradient-min: var(--oxnv-okd-color-surface-pnl-profit-gradient-min)
}

.theme-dark.cfg-red-up {
  --global-color-global-alpha-pnl-profit: var(--oxnv-okd-color-global-alpha-pnl-loss);
  --global-color-global-alpha-pnl-loss: var(--oxnv-okd-color-global-alpha-pnl-profit);
  --global-color-surface-pnl-profit-default: var(--oxnv-okd-color-surface-pnl-loss-default);
  --global-color-surface-pnl-profit-hovered: var(--oxnv-okd-color-surface-pnl-loss-hovered);
  --global-color-surface-pnl-profit-pressed: var(--oxnv-okd-color-surface-pnl-loss-pressed);
  --global-color-surface-pnl-profit-tint: var(--oxnv-okd-color-surface-pnl-loss-tint);
  --global-color-surface-pnl-loss-default: var(--oxnv-okd-color-surface-pnl-profit-default);
  --global-color-surface-pnl-loss-hovered: var(--oxnv-okd-color-surface-pnl-profit-hovered);
  --global-color-surface-pnl-loss-pressed: var(--oxnv-okd-color-surface-pnl-profit-pressed);
  --global-color-surface-pnl-loss-tint: var(--oxnv-okd-color-surface-pnl-profit-tint);
  --global-color-surface-pnl-loss-graph: var(--oxnv-okd-color-surface-pnl-profit-graph);
  --global-color-content-pnl-profit-default: var(--oxnv-okd-color-content-pnl-loss-default);
  --global-color-content-pnl-profit-oncolor: var(--oxnv-okd-color-content-pnl-loss-oncolor);
  --global-color-content-pnl-loss-default: var(--oxnv-okd-color-content-pnl-profit-default);
  --global-color-content-pnl-loss-oncolor: var(--oxnv-okd-color-content-pnl-profit-oncolor);
  --global-color-surface-pnl-profit-graph: var(--oxnv-okd-color-surface-pnl-loss-graph);
  --global-color-border-pnl-loss-default: var(--oxnv-okd-color-border-pnl-profit-default);
  --global-color-border-pnl-loss-graph: var(--oxnv-okd-color-border-pnl-profit-graph);
  --global-color-border-pnl-profit-default: var(--oxnv-okd-color-border-pnl-loss-default);
  --global-color-border-pnl-profit-graph: var(--oxnv-okd-color-border-pnl-loss-graph);
  --global-color-surface-pnl-profit-default-new: var(--oxnv-okd-color-surface-pnl-loss-default-new);
  --global-color-surface-pnl-profit-emphasis: var(--oxnv-okd-color-surface-pnl-loss-emphasis);
  --global-color-surface-pnl-loss-default-new: var(--oxnv-okd-color-surface-pnl-profit-default-new);
  --global-color-surface-pnl-loss-emphasis: var(--oxnv-okd-color-surface-pnl-profit-emphasis);
  --global-color-content-pnl-profit-oncolor-default: var(--oxnv-okd-color-content-pnl-loss-oncolor-default);
  --global-color-content-pnl-profit-oncolor-emphasis: var(--oxnv-okd-color-content-pnl-loss-oncolor-emphasis);
  --global-color-content-pnl-loss-oncolor-default: var(--oxnv-okd-color-content-pnl-profit-oncolor-default);
  --global-color-content-pnl-loss-oncolor-emphasis: var(--oxnv-okd-color-content-pnl-profit-oncolor-emphasis)
}

:root {
  --color-red-text: #eb4b6d;
  --color-red-bg: #eb4b6d;
  --color-green-text: #31bd65;
  --color-green-bg: #31bd65;
  --color-red-text-rgb: 235, 75, 109;
  --color-red-bg-rgb: 235, 75, 109;
  --color-green-text-rgb: 49, 189, 101;
  --color-green-bg-rgb: 49, 189, 101;
  --color-up: var(--color-green-text);
  --color-down: var(--color-red-text);
  --color-up-text: var(--color-green-text);
  --color-down-text: var(--color-red-text);
  --color-up-bg: var(--color-green-bg);
  --color-down-bg: var(--color-red-bg);
  --color-up-text-rgb: var(--color-green-text-rgb);
  --color-down-text-rgb: var(--color-red-text-rgb);
  --color-up-bg-rgb: var(--color-green-bg-rgb);
  --color-down-bg-rgb: var(--color-red-bg-rgb)
}

.theme-light {
  --oxnv-okd-color-surface-pnl-profit-default-rgb: var(--global-color-profit-surface-default-rgb);
  --oxnv-okd-color-surface-pnl-loss-default-rgb: var(--global-color-loss-surface-default-rgb);
  --oxnv-okd-color-content-pnl-profit-default-rgb: var(--global-color-profit-default-rgb);
  --oxnv-okd-color-content-pnl-loss-default-rgb: var(--global-color-loss-default-rgb);
  --color-red-text: var(--oxnv-okd-color-content-pnl-loss-default);
  --color-red-bg: var(--oxnv-okd-color-surface-pnl-loss-default);
  --color-green-text: var(--oxnv-okd-color-content-pnl-profit-default);
  --color-green-bg: var(--oxnv-okd-color-surface-pnl-profit-default);
  --color-red-text-rgb: var(--oxnv-okd-color-content-pnl-loss-default-rgb);
  --color-red-bg-rgb: var(--oxnv-okd-color-surface-pnl-loss-default-rgb);
  --color-green-text-rgb: var(--oxnv-okd-color-content-pnl-profit-default-rgb);
  --color-green-bg-rgb: var(--oxnv-okd-color-surface-pnl-profit-default-rgb);
  --oxnv-okd-color-old-content-pnl-profit-default: #2b6d17;
  --oxnv-okd-color-old-surface-pnl-profit-graph: #81be00;
  --oxnv-okd-color-old-content-pnl-loss-default: #a54162;
  --oxnv-okd-color-old-surface-pnl-loss-graph: #fc46ab;
  --oxnv-okd-color-old-surface-pnl-profit-graph-rgb: 129, 190, 0;
  --oxnv-okd-color-old-surface-pnl-loss-graph-rgb: 252, 70, 171;
  --color-up: var(--color-green-text);
  --color-down: var(--color-red-text);
  --color-up-text: var(--color-green-text);
  --color-down-text: var(--color-red-text);
  --color-up-bg: var(--color-green-bg);
  --color-down-bg: var(--color-red-bg);
  --color-up-text-rgb: var(--color-green-text-rgb);
  --color-down-text-rgb: var(--color-red-text-rgb);
  --color-up-bg-rgb: var(--color-green-bg-rgb);
  --color-down-bg-rgb: var(--color-red-bg-rgb);
  --color-content-pnl-profit-default: var(--oxnv-okd-color-old-content-pnl-profit-default);
  --color-surface-pnl-profit-graph: var(--oxnv-okd-color-old-surface-pnl-profit-graph);
  --color-content-pnl-loss-default: var(--oxnv-okd-color-old-content-pnl-loss-default);
  --color-surface-pnl-loss-graph: var(--oxnv-okd-color-old-surface-pnl-loss-graph);
  --color-surface-pnl-profit-graph-rgb: var(--oxnv-okd-color-old-surface-pnl-profit-graph-rgb);
  --color-surface-pnl-loss-graph-rgb: var(--oxnv-okd-color-old-surface-pnl-loss-graph-rgb)
}

.theme-light.cfg-red-up {
  --color-up: var(--color-red-text);
  --color-down: var(--color-green-text);
  --color-up-text: var(--color-red-text);
  --color-down-text: var(--color-green-text);
  --color-up-bg: var(--color-red-bg);
  --color-down-bg: var(--color-green-bg);
  --color-up-text-rgb: var(--color-red-text-rgb);
  --color-down-text-rgb: var(--color-green-text-rgb);
  --color-up-bg-rgb: var(--color-red-bg-rgb);
  --color-down-bg-rgb: var(--color-green-bg-rgb);
  --color-content-pnl-profit-default: var(--oxnv-okd-color-old-content-pnl-loss-default);
  --color-surface-pnl-profit-graph: var(--oxnv-okd-color-old-surface-pnl-loss-graph);
  --color-content-pnl-loss-default: var(--oxnv-okd-color-old-content-pnl-profit-default);
  --color-surface-pnl-loss-graph: var(--oxnv-okd-color-old-surface-pnl-profit-graph);
  --color-surface-pnl-profit-graph-rgb: var(--oxnv-okd-color-old-surface-pnl-loss-graph-rgb);
  --color-surface-pnl-loss-graph-rgb: var(--oxnv-okd-color-old-surface-pnl-profit-graph-rgb)
}

.theme-dark {
  --oxnv-okd-color-surface-pnl-profit-default-rgb: var(--global-color-profit-surface-default-rgb);
  --oxnv-okd-color-surface-pnl-loss-default-rgb: var(--global-color-loss-surface-default-rgb);
  --oxnv-okd-color-content-pnl-profit-default-rgb: var(--global-color-profit-default-rgb);
  --oxnv-okd-color-content-pnl-loss-default-rgb: var(--global-color-loss-default-rgb);
  --color-red-text: var(--oxnv-okd-color-content-pnl-loss-default);
  --color-red-bg: var(--oxnv-okd-color-surface-pnl-loss-default);
  --color-green-text: var(--oxnv-okd-color-content-pnl-profit-default);
  --color-green-bg: var(--oxnv-okd-color-surface-pnl-profit-default);
  --color-red-text-rgb: var(--oxnv-okd-color-content-pnl-loss-default-rgb);
  --color-red-bg-rgb: var(--oxnv-okd-color-surface-pnl-loss-default-rgb);
  --color-green-text-rgb: var(--oxnv-okd-color-content-pnl-profit-default-rgb);
  --color-green-bg-rgb: var(--oxnv-okd-color-surface-pnl-profit-default-rgb);
  --oxnv-okd-color-old-content-pnl-profit-default: #bcff2f;
  --oxnv-okd-color-old-surface-pnl-profit-graph: #bcff2f;
  --oxnv-okd-color-old-content-pnl-loss-default: #fc46ab;
  --oxnv-okd-color-old-surface-pnl-loss-graph: #fc46ab;
  --oxnv-okd-color-old-surface-pnl-profit-graph-rgb: 188, 255, 47;
  --oxnv-okd-color-old-surface-pnl-loss-graph-rgb: 252, 70, 171;
  --color-up: var(--color-green-text);
  --color-down: var(--color-red-text);
  --color-up-text: var(--color-green-text);
  --color-down-text: var(--color-red-text);
  --color-up-bg: var(--color-green-bg);
  --color-down-bg: var(--color-red-bg);
  --color-up-text-rgb: var(--color-green-text-rgb);
  --color-down-text-rgb: var(--color-red-text-rgb);
  --color-up-bg-rgb: var(--color-green-bg-rgb);
  --color-down-bg-rgb: var(--color-red-bg-rgb);
  --color-content-pnl-profit-default: var(--oxnv-okd-color-old-content-pnl-profit-default);
  --color-surface-pnl-profit-graph: var(--oxnv-okd-color-old-surface-pnl-profit-graph);
  --color-content-pnl-loss-default: var(--oxnv-okd-color-old-content-pnl-loss-default);
  --color-surface-pnl-loss-graph: var(--oxnv-okd-color-old-surface-pnl-loss-graph);
  --color-surface-pnl-profit-graph-rgb: var(--oxnv-okd-color-old-surface-pnl-profit-graph-rgb);
  --color-surface-pnl-loss-graph-rgb: var(--oxnv-okd-color-old-surface-pnl-loss-graph-rgb)
}

.theme-dark.cfg-red-up {
  --color-up: var(--color-red-text);
  --color-down: var(--color-green-text);
  --color-up-text: var(--color-red-text);
  --color-down-text: var(--color-green-text);
  --color-up-bg: var(--color-red-bg);
  --color-down-bg: var(--color-green-bg);
  --color-up-text-rgb: var(--color-red-text-rgb);
  --color-down-text-rgb: var(--color-green-text-rgb);
  --color-up-bg-rgb: var(--color-red-bg-rgb);
  --color-down-bg-rgb: var(--color-green-bg-rgb);
  --color-content-pnl-profit-default: var(--oxnv-okd-color-old-content-pnl-loss-default);
  --color-surface-pnl-profit-graph: var(--oxnv-okd-color-old-surface-pnl-loss-graph);
  --color-content-pnl-loss-default: var(--oxnv-okd-color-old-content-pnl-profit-default);
  --color-surface-pnl-loss-graph: var(--oxnv-okd-color-old-surface-pnl-profit-graph);
  --color-surface-pnl-profit-graph-rgb: var(--oxnv-okd-color-old-surface-pnl-loss-graph-rgb);
  --color-surface-pnl-loss-graph-rgb: var(--oxnv-okd-color-old-surface-pnl-profit-graph-rgb)
}

.theme-okcoin {
  --color-up: #2ead65;
  --color-down: #e35e5e;
  --color-up-text: #2ead65;
  --color-down-text: #e35e5e;
  --color-up-bg: #2ead65;
  --color-down-bg: #e35e5e
}

.theme-okcoin.cfg-red-up {
  --color-up: #e35e5e;
  --color-down: #2ead65;
  --color-up-text: #e35e5e;
  --color-down-text: #2ead65;
  --color-up-bg: #e35e5e;
  --color-down-bg: #2ead65
}

#global-sticky-container,
.okx-sticky-container {
  left: 0;
  margin: auto;
  position: -webkit-sticky;
  position: sticky;
  right: 0;
  top: 0;
  z-index: 9499
}

#risk-banner-root {
  background: transparent
}

.global-compliance-banner {
  padding: 12px 24px;
  width: 100%
}

.global-compliance-banner .compliance-border-container {
  border: 1px solid #4d4d4d;
  border-radius: 8px;
  margin: 4px 8px;
  padding: 8px 16px
}

.global-compliance-banner .compliance-border-container .compliance-banner-title {
  font-weight: 500
}

.global-compliance-banner .compliance-border-container .text-with-dot {
  color: #e6e6e6
}

.global-compliance-banner .compliance-border-container .compliance-banner-link {
  color: #bcff2f
}

.global-compliance-banner .compliance-banner-top {
  display: flex;
  margin-bottom: 4px
}

.global-compliance-banner .compliance-banner-icon {
  font-size: 16px;
  line-height: 16px;
  margin-right: 8px
}

@media (min-width:1024px) {
  .global-compliance-banner .compliance-banner-icon {
    font-size: 18px;
    line-height: 28px
  }
}

.global-compliance-banner .compliance-banner-title {
  font-size: 14px;
  font-style: normal;
  font-weight: 700;
  line-height: 16px
}

@media (min-width:1024px) {
  .global-compliance-banner .compliance-banner-title {
    line-height: 28px
  }
}

.global-compliance-banner .text-with-dot {
  font-size: 12px;
  font-weight: 400;
  line-height: 16px
}

.global-compliance-banner .text-with-dot:first-child {
  margin-top: 4px
}

.global-compliance-banner .text-with-dot:before {
  background-color: #fff;
  border-radius: 5px;
  content: "";
  display: inline-block;
  height: 5px;
  margin: 0 8px;
  vertical-align: middle;
  width: 5px
}

.global-compliance-banner .compliance-banner-link {
  color: inherit;
  font-size: 12px;
  line-height: 16px;
  text-decoration: underline
}

.global-compliance-banner .compliance-banner-text {
  color: #000;
  font-size: 12px;
  font-style: normal;
  font-weight: 400;
  line-height: 16px;
  vertical-align: middle
}

.global-compliance-banner .compliance-banner-text.banner-bold-text {
  font-weight: 700
}

@media (min-width:1024px) {
  .global-compliance-banner .compliance-banner-text {
    font-size: 18px;
    line-height: 28px
  }
}

.global-compliance-banner .compliance-banner-trigger {
  color: #000;
  cursor: pointer;
  font-size: 12px;
  font-style: normal;
  font-weight: 400;
  font-weight: 500;
  line-height: 16px;
  margin-right: 4px;
  text-decoration: underline;
  text-indent: 2px;
  vertical-align: middle
}

.global-compliance-banner .compliance-banner-trigger.banner-bold-text {
  font-weight: 700
}

@media (min-width:1024px) {
  .global-compliance-banner .compliance-banner-trigger {
    font-size: 18px;
    line-height: 28px
  }
}

.index_wrapper__n\+bRd {
  height: 100%;
  position: relative
}

@keyframes index_rotation__\+JKxq {
  0% {
    transform: rotate(0deg)
  }

  to {
    transform: rotate(1turn)
  }
}

.index_loadingWrapper__f3niw {
  align-items: center;
  background-color: var(--oxnv-okd-color-container-primary);
  display: flex;
  height: 100%;
  justify-content: center;
  left: 0;
  position: absolute;
  top: 0;
  width: 100%;
  z-index: 1
}

.index_loading__aE76- {
  animation: index_rotation__\+JKxq 1s linear infinite;
  border: 2px solid var(--oxnv-okd-color-gray-200);
  border-radius: 50%;
  border-top-color: var(--oxnv-okd-color-border-selected);
  height: 20px;
  width: 20px
}

.drop-explorer-list .drop-extend-box,
.drop-panel .drop-extend-box {
  position: relative
}

.drop-explorer-list .drop-panel-box,
.drop-panel .drop-panel-box {
  width: 250px
}

.drop-explorer-list .drop-panel-box .dropdown-panel-li,
.drop-panel .drop-panel-box .dropdown-panel-li {
  align-items: center;
  display: flex;
  justify-content: space-between;
  max-width: 320px
}

.drop-explorer-list .drop-panel-box .dropdown-panel-li .panel-box-item,
.drop-panel .drop-panel-box .dropdown-panel-li .panel-box-item {
  width: 100%
}

.drop-explorer-list .drop-panel-box .dropdown-panel-li .panel-box-item:focus-visible,
.drop-panel .drop-panel-box .dropdown-panel-li .panel-box-item:focus-visible {
  border-radius: 4px;
  outline: 2px solid #000;
  outline-offset: 2px
}

.drop-explorer-list .drop-panel-box .drop-panel-list,
.drop-panel .drop-panel-box .drop-panel-list {
  border-bottom: 1px solid #ebebeb;
  padding-bottom: 16px;
  padding-top: 20px
}

.drop-explorer-list .drop-panel-box .drop-panel-list:first-child,
.drop-panel .drop-panel-box .drop-panel-list:first-child {
  padding-top: 0
}

.drop-explorer-list .drop-panel-box .drop-panel-list:last-child,
.drop-panel .drop-panel-box .drop-panel-list:last-child {
  border-bottom: none;
  padding-bottom: 0
}

.drop-explorer-list .drop-panel-box .drop-panel-list .title-text,
.drop-panel .drop-panel-box .drop-panel-list .title-text {
  display: inline-block;
  max-width: 80%;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap
}

.drop-explorer-list .drop-panel-box .drop-panel-list .title-text-trade,
.drop-panel .drop-panel-box .drop-panel-list .title-text-trade {
  display: inline-block
}

.drop-explorer-list .drop-panel-box .drop-panel-title,
.drop-panel .drop-panel-box .drop-panel-title {
  color: #5b5b5b;
  font-size: 14px;
  font-weight: 500;
  line-height: 16px;
  padding: 6px 8px
}

.drop-explorer-list .drop-panel-box .panel-drop-item-icon,
.drop-panel .drop-panel-box .panel-drop-item-icon {
  align-items: stretch;
  align-items: center;
  color: #5b5b5b;
  cursor: pointer;
  display: inline-flex;
  flex-shrink: 0;
  justify-content: center;
  line-height: 60px;
  min-height: 60px;
  padding-right: 10px;
  text-align: right;
  vertical-align: middle;
  width: 24px
}

.drop-explorer-list .drop-panel-box .panel-drop-item-icon:focus-visible,
.drop-panel .drop-panel-box .panel-drop-item-icon:focus-visible {
  border-radius: 4px;
  outline: 2px solid #000;
  outline-offset: 2px
}

.drop-explorer-list .trade-drop-panel-box-menu,
.drop-panel .trade-drop-panel-box-menu {
  width: 326px
}

.drop-explorer-list .explorer-drop-panel-box-menu,
.drop-panel .explorer-drop-panel-box-menu {
  width: 296px
}

.drop-explorer-list .drop-panel-box-list,
.drop-panel .drop-panel-box-list {
  background-color: #fff;
  background-color: var(--header-drop-third-bg-color);
  border-left: 1px solid #ebebeb;
  border-left: 1px solid var(--header-drop-third-border-color);
  border-radius: 0 6px 6px 0;
  border-radius: 0 var(--header-drop-container-border-radius) var(--header-drop-container-border-radius) 0;
  bottom: -12px;
  box-shadow: 10px 12px 30px rgba(14, 32, 66, .08), 0 1px 2px rgba(14, 32, 66, .05);
  left: 262px;
  margin: auto;
  overflow-x: hidden;
  overflow-y: auto;
  padding: 18px 12px;
  position: absolute;
  top: -12px;
  width: 274px
}

.drop-explorer-list .okc-panel-box-list,
.drop-panel .okc-panel-box-list {
  bottom: unset;
  min-height: calc(100% + 24px)
}

.drop-explorer-list .trade-drop-panel-box-list,
.drop-panel .trade-drop-panel-box-list {
  bottom: unset;
  height: calc(100% + 24px);
  left: 336px;
  min-height: 420px;
  width: 374px
}

.drop-explorer-list .explorer-drop-panel-box-list,
.drop-panel .explorer-drop-panel-box-list {
  bottom: unset;
  height: calc(100% + 24px);
  left: 308px;
  min-height: 420px;
  padding: 0;
  width: 323px
}

.drop-explorer-list .navigation-list,
.drop-panel .navigation-list {
  padding: 0;
  width: 404px
}

.drop-explorer-list .hide-drop-panel-box,
.drop-panel .hide-drop-panel-box {
  display: none
}

.drop-explorer-list .trade-drop-item-con,
.drop-panel .trade-drop-item-con {
  position: relative
}

.drop-explorer-list .trade-drop-box-list,
.drop-panel .trade-drop-box-list {
  bottom: -12px;
  left: 336px;
  overflow: visible;
  padding: 12px;
  top: unset
}

.drop-explorer-list .explorer-drop-box-list,
.drop-panel .explorer-drop-box-list {
  bottom: unset;
  left: 308px;
  min-height: calc(100% + 24px);
  overflow: visible;
  padding: 12px;
  top: -12px
}

.drop-explorer-list .current-menu,
.drop-panel .current-menu {
  background: #f9f9f9;
  background: var(--header-lg-drop-box-item-bg-hover);
  border-radius: 4px;
  color: var(--header-lg-drop-box-item-title-hover);
  color: #000;
  cursor: pointer
}

.drop-explorer-list .panel-drop-item-icon[aria-expanded=true],
.drop-panel .panel-drop-item-icon[aria-expanded=true] {
  background: #f9f9f9;
  background: var(--header-lg-drop-box-item-bg-hover);
  border-radius: 4px;
  color: #000;
  color: var(--header-lg-drop-box-item-title-hover);
  cursor: pointer
}

#navColumnContainer .item-column-menu {
  width: 100%
}

#navColumnContainer .item-column-menu .item-title {
  align-items: center;
  display: flex;
  flex-direction: row-reverse;
  justify-content: space-between;
  width: 100%
}

#navColumnContainer .drop-panel .drop-panel-box {
  width: auto
}

#navColumnContainer .drop-panel .drop-panel-box .drop-panel-list {
  border-bottom: none;
  padding-bottom: 0;
  padding-top: 0
}

#navColumnContainer .drop-panel .drop-panel-box .drop-panel-list .drop-panel-box-item {
  align-items: center;
  display: flex;
  justify-content: space-between;
  padding-left: 12px
}

#navColumnContainer .drop-panel .drop-panel-box.explorer-drop-panel-box-menu .drop-panel-box-item,
#navColumnContainer .drop-panel .drop-panel-box.trade-drop-panel-box-menu .drop-panel-box-item {
  padding-left: unset
}

#navColumnContainer .drop-panel .drop-panel-box .explorer-drop-box-list,
#navColumnContainer .drop-panel .drop-panel-box .trade-drop-box-list {
  display: none
}

#navColumnContainer .drop-panel .drop-panel-box .nav-item.more-active .okx-header-footer-arrow-chevrons-down {
  transform: rotate(-180deg)
}

#navColumnContainer .drop-panel .drop-panel-box .nav-item .okx-header-footer-arrow-chevrons-down {
  transform: rotate(0)
}

:root {
  --header-lg-drop-box-item-title-hover: #000
}

body .header-container .header-wrap .web3-header .nav-item.nav-alert {
  align-items: center;
  color: var(--oxnv-okd-color-content-primary);
  display: flex;
  justify-content: center;
  padding: 10px
}

@media (max-width:767px) {
  body .header-container .header-wrap .web3-header .nav-item.nav-alert {
    margin-right: 8px
  }
}

body .header-container .header-wrap .web3-header .nav-item.nav-alert:before {
  font-size: 20px
}

body .header-container .header-wrap .web3-header .nav-container .nav-alert.nav-right-item {
  background: var(--oxnv-okd-color-background-surface-primary);
  border-radius: 8px;
  height: 36px;
  margin-top: 12px;
  min-height: 0;
  width: 36px
}

body .header-container .header-wrap .web3-header .nav-container .nav-alert:hover {
  background: var(--oxnv-okd-color-background-surface-pressed)
}

body .header-container .header-wrap .web3-header .nav-container .nav-alert .nav-link {
  display: none
}

body .header-container .header-wrap .web3-header .column-nav-container .nav-item.nav-alert {
  display: flex;
  justify-content: flex-start;
  margin-left: 0;
  padding: 0
}

body .header-container .header-wrap .web3-header .column-nav-container .nav-item.nav-alert .nav-link {
  display: block
}

body .header-container .header-wrap .web3-header .column-nav-container .nav-item.nav-alert:before {
  display: none
}

@media (max-width:1023px) {

  .header-main .dp-c-l-ag:not(.nav-boost-drop),
  .header-main .drop-c-right-align:not(.nav-boost-drop) {
    background: transparent;
    display: none;
    left: auto;
    opacity: 1;
    padding: 4px 0 4px 12px;
    position: relative;
    top: auto;
    transform: unset;
    visibility: visible;
    width: 100%
  }

  .header-main .dp-c-l-ag:not(.nav-boost-drop).drop-c-common-show,
  .header-main .drop-c-right-align:not(.nav-boost-drop).drop-c-common-show {
    opacity: 1;
    pointer-events: auto;
    top: 60px;
    visibility: visible
  }

  .header-main .dp-c-l-ag:not(.nav-boost-drop) .info-extend-box,
  .header-main .drop-c-right-align:not(.nav-boost-drop) .info-extend-box {
    flex-direction: column
  }

  .header-main .dp-c-l-ag:not(.nav-boost-drop) .info-extend-box .item-title,
  .header-main .drop-c-right-align:not(.nav-boost-drop) .info-extend-box .item-title {
    color: var(--oxnv-okd-color-content-secondary);
    display: inline-flex;
    font-size: 16px;
    height: 44px;
    padding: 14px 0;
    width: 100%
  }

  .header-main .dp-c-l-ag:not(.nav-boost-drop) .info-extend-box .item-title:hover,
  .header-main .drop-c-right-align:not(.nav-boost-drop) .info-extend-box .item-title:hover {
    background: transparent;
    color: var(--oxnv-okd-color-content-primary)
  }

  .header-main .dp-c-l-ag:not(.nav-boost-drop) .info-extend-box .tab-ms,
  .header-main .drop-c-right-align:not(.nav-boost-drop) .info-extend-box .tab-ms {
    color: #646f84;
    font-size: 14px;
    font-style: normal;
    font-weight: 400;
    line-height: 20px
  }

  .header-main .dp-c-l-ag:not(.nav-boost-drop) .extend-box,
  .header-main .drop-c-right-align:not(.nav-boost-drop) .extend-box {
    margin: 0;
    max-width: unset;
    min-width: unset;
    padding: 0;
    width: 100%
  }

  .header-main .dp-c-l-ag:not(.nav-boost-drop) .extend-box .box-title,
  .header-main .dp-c-l-ag:not(.nav-boost-drop) .extend-box .desc-box,
  .header-main .dp-c-l-ag:not(.nav-boost-drop) .extend-box .icon-box,
  .header-main .drop-c-right-align:not(.nav-boost-drop) .extend-box .box-title,
  .header-main .drop-c-right-align:not(.nav-boost-drop) .extend-box .desc-box,
  .header-main .drop-c-right-align:not(.nav-boost-drop) .extend-box .icon-box {
    display: none
  }

  .header-main .dp-c-l-ag:not(.nav-boost-drop) .extend-box .box-item,
  .header-main .drop-c-right-align:not(.nav-boost-drop) .extend-box .box-item {
    height: 44px;
    margin: 0
  }

  .header-main .dp-c-l-ag:not(.nav-boost-drop) .extend-box .box-item .item-title,
  .header-main .drop-c-right-align:not(.nav-boost-drop) .extend-box .box-item .item-title {
    color: var(--oxnv-okd-color-content-secondary);
    display: inline-flex;
    font-size: 16px;
    height: 44px;
    padding: 14px 0;
    width: 100%
  }

  .header-main .dp-c-l-ag:not(.nav-boost-drop) .extend-box .box-item .item-title:hover,
  .header-main .drop-c-right-align:not(.nav-boost-drop) .extend-box .box-item .item-title:hover {
    background: transparent;
    color: var(--oxnv-okd-color-content-primary)
  }

  .header-main .dp-c-l-ag:not(.nav-boost-drop) .extend-box .box-item .item-title.item-panel-drop-title,
  .header-main .drop-c-right-align:not(.nav-boost-drop) .extend-box .box-item .item-title.item-panel-drop-title {
    max-width: 270px;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap
  }

  .header-main .dp-c-l-ag:not(.nav-boost-drop) .extend-box .box-item .item-title.title-without-tag,
  .header-main .drop-c-right-align:not(.nav-boost-drop) .extend-box .box-item .item-title.title-without-tag {
    display: inline-block
  }

  .header-main .dp-c-l-ag:not(.nav-boost-drop) .extend-small-box .box-item,
  .header-main .drop-c-right-align:not(.nav-boost-drop) .extend-small-box .box-item {
    color: var(--oxnv-okd-color-content-secondary);
    display: inline-flex;
    font-size: 16px;
    height: 44px;
    margin: 0;
    padding: 14px 0;
    width: 100%
  }

  .header-main .dp-c-l-ag:not(.nav-boost-drop) .extend-small-box .box-item:hover,
  .header-main .drop-c-right-align:not(.nav-boost-drop) .extend-small-box .box-item:hover {
    background: transparent;
    color: var(--oxnv-okd-color-content-primary)
  }

  .header-main .column-nav-container .nav-scroll-box {
    display: flex;
    flex-direction: row;
    flex-grow: 1;
    justify-content: flex-end;
    padding: 0;
    top: 0;
    width: auto
  }

  .header-main .column-nav-container .nav-scroll-box::-webkit-scrollbar {
    display: none
  }

  .header-main .column-nav-container .mode-xl-line,
  .header-main .column-nav-container .nav-academy,
  .header-main .column-nav-container .nav-balance,
  .header-main .column-nav-container .nav-buy,
  .header-main .column-nav-container .nav-cefi-market,
  .header-main .column-nav-container .nav-custom,
  .header-main .column-nav-container .nav-dashboard,
  .header-main .column-nav-container .nav-deposit,
  .header-main .column-nav-container .nav-earn,
  .header-main .column-nav-container .nav-explorer .nav-nft,
  .header-main .column-nav-container .nav-institutions,
  .header-main .column-nav-container .nav-language,
  .header-main .column-nav-container .nav-leaderboard,
  .header-main .column-nav-container .nav-market,
  .header-main .column-nav-container .nav-meme-pump,
  .header-main .column-nav-container .nav-mobile-download,
  .header-main .column-nav-container .nav-mode,
  .header-main .column-nav-container .nav-more,
  .header-main .column-nav-container .nav-nft,
  .header-main .column-nav-container .nav-okc,
  .header-main .column-nav-container .nav-portfolio,
  .header-main .column-nav-container .nav-referral,
  .header-main .column-nav-container .nav-signal,
  .header-main .column-nav-container .nav-site-flag,
  .header-main .column-nav-container .nav-smsf,
  .header-main .column-nav-container .nav-swap,
  .header-main .column-nav-container .nav-tracker,
  .header-main .column-nav-container .nav-trade,
  .header-main .column-nav-container .nav-user,
  .header-main .column-nav-container .nav-web3-more,
  .header-main .column-nav-container .other-wrap,
  .header-main .column-nav-container .pc-mode,
  .header-main .column-nav-container .profile-wrap,
  .header-main .column-nav-container .user-info-item {
    display: none
  }

  .header-main .column-nav-container .mode-line {
    background: hsla(0, 0%, 100%, .15);
    display: none;
    height: 16px;
    margin: 16px;
    width: 1px
  }

  .header-main .column-nav-container .mode-line.has-address {
    display: block
  }

  .header-main .column-nav-container .mode-no-login {
    display: none
  }

  .header-main.active .column-nav-container {
    z-index: 9500
  }

  .header-main.active .column-nav-container.web3-column-container {
    display: block
  }

  .header-main.active .column-nav-container.web3-column-container .col-mu-top {
    align-items: center;
    display: flex;
    justify-content: space-between;
    padding: 22px 16px
  }

  .header-main.active .column-nav-container.web3-column-container .nav-item .nav-link,
  .header-main.active .column-nav-container.web3-column-container .nav-item .nav-text.mu-txt,
  .header-main.active .column-nav-container.web3-column-container .nav-item.nav-link {
    font-weight: 500
  }

  .header-main.active .column-nav-container .nav-item .dp-c-l-ag:not(.nav-boost-drop),
  .header-main.active .column-nav-container .nav-item .drop-c-right-align:not(.nav-boost-drop) {
    background: transparent;
    display: none;
    left: auto;
    opacity: 1;
    padding: 4px 0 4px 12px;
    position: relative;
    top: auto;
    transform: unset;
    visibility: visible;
    width: 100%
  }

  .header-main.active .column-nav-container .nav-item .dp-c-l-ag:not(.nav-boost-drop).drop-c-common-show,
  .header-main.active .column-nav-container .nav-item .drop-c-right-align:not(.nav-boost-drop).drop-c-common-show {
    opacity: 1;
    pointer-events: auto;
    top: 60px;
    visibility: visible
  }

  .header-main.active .column-nav-container .nav-item .dp-c-l-ag:not(.nav-boost-drop) .info-extend-box,
  .header-main.active .column-nav-container .nav-item .drop-c-right-align:not(.nav-boost-drop) .info-extend-box {
    flex-direction: column
  }

  .header-main.active .column-nav-container .nav-item .dp-c-l-ag:not(.nav-boost-drop) .info-extend-box .item-title,
  .header-main.active .column-nav-container .nav-item .drop-c-right-align:not(.nav-boost-drop) .info-extend-box .item-title {
    color: var(--oxnv-okd-color-content-secondary);
    display: inline-flex;
    font-size: 16px;
    height: 44px;
    padding: 14px 0;
    width: 100%
  }

  .header-main.active .column-nav-container .nav-item .dp-c-l-ag:not(.nav-boost-drop) .info-extend-box .item-title:hover,
  .header-main.active .column-nav-container .nav-item .drop-c-right-align:not(.nav-boost-drop) .info-extend-box .item-title:hover {
    background: transparent;
    color: var(--oxnv-okd-color-content-primary)
  }

  .header-main.active .column-nav-container .nav-item .dp-c-l-ag:not(.nav-boost-drop) .info-extend-box .tab-ms,
  .header-main.active .column-nav-container .nav-item .drop-c-right-align:not(.nav-boost-drop) .info-extend-box .tab-ms {
    color: #646f84;
    font-size: 14px;
    font-style: normal;
    font-weight: 400;
    line-height: 20px
  }

  .header-main.active .column-nav-container .nav-item .dp-c-l-ag:not(.nav-boost-drop) .extend-box,
  .header-main.active .column-nav-container .nav-item .drop-c-right-align:not(.nav-boost-drop) .extend-box {
    margin: 0;
    max-width: unset;
    min-width: unset;
    padding: 0;
    width: 100%
  }

  .header-main.active .column-nav-container .nav-item .dp-c-l-ag:not(.nav-boost-drop) .extend-box .box-title,
  .header-main.active .column-nav-container .nav-item .dp-c-l-ag:not(.nav-boost-drop) .extend-box .desc-box,
  .header-main.active .column-nav-container .nav-item .dp-c-l-ag:not(.nav-boost-drop) .extend-box .icon-box,
  .header-main.active .column-nav-container .nav-item .drop-c-right-align:not(.nav-boost-drop) .extend-box .box-title,
  .header-main.active .column-nav-container .nav-item .drop-c-right-align:not(.nav-boost-drop) .extend-box .desc-box,
  .header-main.active .column-nav-container .nav-item .drop-c-right-align:not(.nav-boost-drop) .extend-box .icon-box {
    display: none
  }

  .header-main.active .column-nav-container .nav-item .dp-c-l-ag:not(.nav-boost-drop) .extend-box .box-item,
  .header-main.active .column-nav-container .nav-item .drop-c-right-align:not(.nav-boost-drop) .extend-box .box-item {
    height: 44px;
    margin: 0
  }

  .header-main.active .column-nav-container .nav-item .dp-c-l-ag:not(.nav-boost-drop) .extend-box .box-item .item-title,
  .header-main.active .column-nav-container .nav-item .drop-c-right-align:not(.nav-boost-drop) .extend-box .box-item .item-title {
    color: var(--oxnv-okd-color-content-secondary);
    display: inline-flex;
    font-size: 16px;
    height: 44px;
    padding: 14px 0;
    width: 100%
  }

  .header-main.active .column-nav-container .nav-item .dp-c-l-ag:not(.nav-boost-drop) .extend-box .box-item .item-title:hover,
  .header-main.active .column-nav-container .nav-item .drop-c-right-align:not(.nav-boost-drop) .extend-box .box-item .item-title:hover {
    background: transparent;
    color: var(--oxnv-okd-color-content-primary)
  }

  .header-main.active .column-nav-container .nav-item .dp-c-l-ag:not(.nav-boost-drop) .extend-box .box-item .item-title.item-panel-drop-title,
  .header-main.active .column-nav-container .nav-item .drop-c-right-align:not(.nav-boost-drop) .extend-box .box-item .item-title.item-panel-drop-title {
    max-width: 270px;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap
  }

  .header-main.active .column-nav-container .nav-item .dp-c-l-ag:not(.nav-boost-drop) .extend-box .box-item .item-title.title-without-tag,
  .header-main.active .column-nav-container .nav-item .drop-c-right-align:not(.nav-boost-drop) .extend-box .box-item .item-title.title-without-tag {
    display: inline-block
  }

  .header-main.active .column-nav-container .nav-item .dp-c-l-ag:not(.nav-boost-drop) .extend-small-box .box-item,
  .header-main.active .column-nav-container .nav-item .drop-c-right-align:not(.nav-boost-drop) .extend-small-box .box-item {
    color: var(--oxnv-okd-color-content-secondary);
    display: inline-flex;
    font-size: 16px;
    height: 44px;
    margin: 0;
    padding: 14px 0;
    width: 100%
  }

  .header-main.active .column-nav-container .nav-item .dp-c-l-ag:not(.nav-boost-drop) .extend-small-box .box-item:hover,
  .header-main.active .column-nav-container .nav-item .drop-c-right-align:not(.nav-boost-drop) .extend-small-box .box-item:hover {
    background: transparent;
    color: var(--oxnv-okd-color-content-primary)
  }

  .header-main.active .column-nav-container .nav-item .dp-c-l-ag .extend-box .box-item {
    width: 100%
  }

  .header-main.active .column-nav-container.asset-active .nav-scroll-box .nav-item.is-left,
  .header-main.active .column-nav-container.asset-active .nav-scroll-box .nav-item.nav-mode,
  .header-main.active .column-nav-container.asset-active .nav-scroll-box .nav-language-column,
  .header-main.active .column-nav-container.asset-active .nav-scroll-box .nav-mobile-download {
    display: none
  }

  .header-main .column-nav-container .nav-scroll-box,
  .header-main .nav-container .nav-scroll-box {
    display: flex;
    flex-direction: row;
    flex-grow: 1;
    justify-content: flex-end;
    padding: 0;
    top: 0;
    width: auto
  }

  .header-main .column-nav-container .nav-scroll-box::-webkit-scrollbar,
  .header-main .nav-container .nav-scroll-box::-webkit-scrollbar {
    display: none
  }

  .header-main .column-nav-container .deposit-item,
  .header-main .column-nav-container .is-left,
  .header-main .column-nav-container .mode-xl-line,
  .header-main .column-nav-container .nav-academy,
  .header-main .column-nav-container .nav-balance,
  .header-main .column-nav-container .nav-buy,
  .header-main .column-nav-container .nav-custom,
  .header-main .column-nav-container .nav-deposit,
  .header-main .column-nav-container .nav-earn,
  .header-main .column-nav-container .nav-institutions,
  .header-main .column-nav-container .nav-language,
  .header-main .column-nav-container .nav-market,
  .header-main .column-nav-container .nav-mobile-download,
  .header-main .column-nav-container .nav-mode,
  .header-main .column-nav-container .nav-more,
  .header-main .column-nav-container .nav-okc,
  .header-main .column-nav-container .nav-site-flag,
  .header-main .column-nav-container .nav-smsf,
  .header-main .column-nav-container .nav-trade,
  .header-main .column-nav-container .nav-user,
  .header-main .column-nav-container .other-wrap,
  .header-main .column-nav-container .pc-mode,
  .header-main .column-nav-container .profile-wrap,
  .header-main .column-nav-container .user-info-item,
  .header-main .nav-container .deposit-item,
  .header-main .nav-container .is-left,
  .header-main .nav-container .mode-xl-line,
  .header-main .nav-container .nav-academy,
  .header-main .nav-container .nav-balance,
  .header-main .nav-container .nav-buy,
  .header-main .nav-container .nav-custom,
  .header-main .nav-container .nav-deposit,
  .header-main .nav-container .nav-earn,
  .header-main .nav-container .nav-institutions,
  .header-main .nav-container .nav-language,
  .header-main .nav-container .nav-market,
  .header-main .nav-container .nav-mobile-download,
  .header-main .nav-container .nav-mode,
  .header-main .nav-container .nav-more,
  .header-main .nav-container .nav-okc,
  .header-main .nav-container .nav-site-flag,
  .header-main .nav-container .nav-smsf,
  .header-main .nav-container .nav-trade,
  .header-main .nav-container .nav-user,
  .header-main .nav-container .other-wrap,
  .header-main .nav-container .pc-mode,
  .header-main .nav-container .profile-wrap,
  .header-main .nav-container .user-info-item {
    display: none
  }

  .header-main .column-nav-container .mode-line,
  .header-main .nav-container .mode-line {
    background: hsla(0, 0%, 100%, .15);
    display: none;
    height: 16px;
    margin: 16px;
    width: 1px
  }

  .header-main .column-nav-container .mode-line.has-address,
  .header-main .nav-container .mode-line.has-address {
    display: block
  }

  .header-main .column-nav-container,
  .header-main .column-nav-container .mode-no-login,
  .header-main .nav-container .mode-no-login {
    display: none
  }

  .header-main.active .column-nav-container {
    background: var(--oxnv-okd-color-background-base-primary);
    box-shadow: 0 12px 60px rgba(14, 32, 66, .15), 0 1px 2px rgba(14, 32, 66, .05);
    display: flex;
    height: 100%;
    position: fixed;
    right: 0;
    transform: translateZ(0);
    width: 376px
  }

  .header-main.active .column-nav-container .nav-scroll-box {
    display: block;
    flex-direction: column;
    height: 95%;
    justify-content: unset;
    overflow: scroll;
    padding: 0 20px 48px;
    position: absolute;
    top: 48px;
    width: 100%
  }

  .header-main.active .column-nav-container .nav-wrap {
    display: flex;
    flex-direction: column;
    width: 100%
  }

  .header-main.active .column-nav-container .nav-item {
    cursor: pointer;
    display: flex;
    flex-direction: row;
    flex-wrap: wrap;
    justify-content: flex-start;
    padding: 0;
    width: 100%
  }

  .header-main.active .column-nav-container .nav-item:focus-visible {
    border-radius: 4px;
    outline: 2px solid #fff;
    outline-offset: 2px
  }

  .header-main.active .column-nav-container .nav-item .icon-img {
    display: none
  }

  .header-main.active .column-nav-container .nav-item.show-more .mu-txt.mu-txt-extend:before,
  .header-main.active .column-nav-container .nav-item.show-more .mu-txt:not(.mu-txt-third):before,
  .header-main.active .column-nav-container .nav-item.show-more .user-arrow.mu-txt-extend:before,
  .header-main.active .column-nav-container .nav-item.show-more .user-arrow:not(.mu-txt-third):before {
    transform: rotate(-180deg)
  }

  .header-main.active .column-nav-container .nav-item.show-more .dp-c-l-ag:not(.nav-boost-drop),
  .header-main.active .column-nav-container .nav-item.show-more .drop-c-right-align:not(.nav-boost-drop) {
    display: block
  }

  .header-main.active .column-nav-container .nav-item.show-more .nav-item.panel-nav-item.panel-col {
    display: flex
  }

  .header-main.active .column-nav-container .nav-item .nav-link,
  .header-main.active .column-nav-container .nav-item .nav-text,
  .header-main.active .column-nav-container .nav-item.nav-link {
    align-items: center;
    color: var(--oxnv-okd-color-content-primary);
    cursor: pointer;
    display: flex;
    flex-grow: 1;
    font-size: 18px;
    height: 52px;
    line-height: unset;
    padding: 17px 0
  }

  .header-main.active .column-nav-container .nav-item .nav-link:focus-visible,
  .header-main.active .column-nav-container .nav-item .nav-text:focus-visible,
  .header-main.active .column-nav-container .nav-item.nav-link:focus-visible {
    border-radius: 4px;
    outline: 2px solid #fff;
    outline-offset: 2px
  }

  .header-main.active .column-nav-container .nav-item .nav-link.mu-txt,
  .header-main.active .column-nav-container .nav-item .nav-text.mu-txt,
  .header-main.active .column-nav-container .nav-item.nav-link.mu-txt {
    justify-content: space-between
  }

  .header-main.active .column-nav-container .nav-item .nav-link.mu-txt:before,
  .header-main.active .column-nav-container .nav-item .nav-text.mu-txt:before,
  .header-main.active .column-nav-container .nav-item.nav-link.mu-txt:before {
    font-size: 14px;
    order: 5
  }

  .header-main.active .column-nav-container .nav-item .nav-link:active,
  .header-main.active .column-nav-container .nav-item .nav-text:active,
  .header-main.active .column-nav-container .nav-item.nav-link:active {
    color: var(--oxnv-okd-color-content-primary)
  }

  .header-main.active .column-nav-container .nav-item .mu-txt:before,
  .header-main.active .column-nav-container .nav-item .user-arrow {
    color: #909090;
    cursor: pointer;
    display: inline-block;
    margin-left: 4px;
    margin-right: 0;
    padding: 20px 0;
    transform: rotate(0deg)
  }

  .header-main.active .column-nav-container .nav-item .mu-txt:before .icon,
  .header-main.active .column-nav-container .nav-item .user-arrow .icon {
    color: #909090;
    font-size: 12px;
    font-weight: 500;
    pointer-events: none
  }

  .header-main.active .column-nav-container .nav-item .dp-c-l-ag .box-item,
  .header-main.active .column-nav-container .nav-item .dp-c-l-ag .extend-link {
    display: inline-block
  }

  .header-main.active .column-nav-container .nav-item .dp-c-l-ag .box-item:focus-visible,
  .header-main.active .column-nav-container .nav-item .dp-c-l-ag .extend-link:focus-visible {
    border-radius: 4px;
    outline: 2px solid #fff;
    outline-offset: 2px
  }

  .header-main.active .column-nav-container .nav-item .dp-c-l-ag .box-item .item-box:focus-visible,
  .header-main.active .column-nav-container .nav-item .dp-c-l-ag .extend-link .item-box:focus-visible {
    border-radius: 4px;
    outline: 2px solid #fff;
    outline-offset: 2px
  }

  .header-main.active .column-nav-container .nav-item .dp-c-l-ag .box-item:before,
  .header-main.active .column-nav-container .nav-item .dp-c-l-ag .extend-link:before {
    display: none
  }

  .header-main.active .column-nav-container .nav-item .dp-c-l-ag .box-item .nav-hot-tag,
  .header-main.active .column-nav-container .nav-item .dp-c-l-ag .box-item .nav-hot-tag.only-column,
  .header-main.active .column-nav-container .nav-item .dp-c-l-ag .box-item .nav-new-tag,
  .header-main.active .column-nav-container .nav-item .dp-c-l-ag .box-item .nav-new-tag.only-column,
  .header-main.active .column-nav-container .nav-item .dp-c-l-ag .extend-link .nav-hot-tag,
  .header-main.active .column-nav-container .nav-item .dp-c-l-ag .extend-link .nav-hot-tag.only-column,
  .header-main.active .column-nav-container .nav-item .dp-c-l-ag .extend-link .nav-new-tag,
  .header-main.active .column-nav-container .nav-item .dp-c-l-ag .extend-link .nav-new-tag.only-column {
    display: inline-block
  }

  .header-main.active .column-nav-container .pc-mode {
    display: none
  }

  .header-main.active .column-nav-container .extend-link {
    color: var(--oxnv-okd-color-content-secondary);
    cursor: pointer;
    display: inline-flex;
    font-size: 16px;
    height: 44px;
    padding: 14px 0;
    width: 100%
  }

  .header-main.active .column-nav-container .extend-link:hover {
    background: transparent;
    color: var(--oxnv-okd-color-content-primary)
  }

  .header-main.active .column-nav-container .extend-link:focus-visible {
    border-radius: 4px;
    outline: 2px solid #fff;
    outline-offset: 2px
  }

  .header-main.active .column-nav-container .extend-link .icon {
    font-size: 16px;
    margin-left: 4px;
    position: relative;
    top: 1px
  }

  .header-main.active .column-nav-container .nav-scroll-box .asset-bottom-line,
  .header-main.active .column-nav-container .nav-scroll-box .nav-item.is-user,
  .header-main.active .column-nav-container .nav-scroll-box .nav-item.nav-balance,
  .header-main.active .column-nav-container .nav-scroll-box .profile-wrap,
  .header-main.active .column-nav-container.asset-active .nav-scroll-box .nav-item.is-left,
  .header-main.active .column-nav-container.asset-active .nav-scroll-box .nav-item.nav-mode,
  .header-main.active .column-nav-container.asset-active .nav-scroll-box .nav-mobile-download {
    display: none
  }

  .header-main.active .column-nav-container.asset-active .nav-scroll-box .asset-bottom-line,
  .header-main.active .column-nav-container.asset-active .nav-scroll-box .nav-balance,
  .header-main.active .column-nav-container.asset-active .nav-scroll-box .nav-item.is-user,
  .header-main.active .column-nav-container.asset-active .nav-scroll-box .profile-wrap {
    display: flex
  }
}

@media (min-width:1024px) {

  .header-main .nav-container .dp-c-l-ag,
  .header-main .nav-container .drop-c-right-align {
    background: var(--oxnv-okd-color-container-primary);
    border-radius: 12px;
    box-shadow: 0 12px 60px rgba(14, 32, 66, .15), 0 1px 2px rgba(14, 32, 66, .05);
    cursor: default;
    opacity: 0;
    overflow: hidden;
    padding: 12px;
    pointer-events: none;
    position: absolute;
    visibility: hidden;
    z-index: 20000
  }

  .header-main .nav-container .dp-c-l-ag.drop-c-common-show,
  .header-main .nav-container .drop-c-right-align.drop-c-common-show {
    opacity: 1;
    pointer-events: auto;
    top: 60px;
    visibility: visible
  }

  .header-main .nav-container .dp-c-l-ag.drop-with-panel,
  .header-main .nav-container .drop-c-right-align.drop-with-panel {
    border-radius: 12px 0 0 12px
  }

  .header-main .nav-container .dp-c-l-ag.drop-with-panel-bottom,
  .header-main .nav-container .drop-c-right-align.drop-with-panel-bottom {
    border-radius: 12px 12px 0 12px
  }

  .header-main .nav-container .drop-animation,
  .header-main .nav-container .drop-animation:hover {
    transition: all .3s cubic-bezier(.645, .045, .355, 1)
  }

  .header-main .nav-container .dp-c-l-ag {
    font-weight: 400;
    left: -14px;
    top: 58px
  }

  .header-main .nav-container .dp-c-l-ag.drop-c-common-show {
    opacity: 1;
    pointer-events: auto;
    top: 60px;
    visibility: visible
  }

  .header-main .nav-container .dp-c-l-ag .info-extend-box {
    display: flex
  }

  .header-main .nav-container .dp-c-l-ag .info-extend-box[data-direction=column] {
    flex-direction: column
  }

  .header-main .nav-container .dp-c-l-ag .extend-box {
    margin-right: 48px
  }

  .header-main .nav-container .dp-c-l-ag .extend-box:last-child {
    margin-right: 0
  }

  .header-main .nav-container .dp-c-l-ag .extend-box .dropdown-panel-li:hover,
  .header-main .nav-container .dp-c-l-ag .extend-box .trade-drop-item-con:hover {
    background: #f9f9f9;
    background: var(--header-lg-drop-box-item-bg-hover);
    border-radius: 4px;
    color: var(--oxnv-okd-color-content-primary);
    cursor: pointer
  }

  .header-main .nav-container .dp-c-l-ag .extend-box .dropdown-panel-li.dp-explorer,
  .header-main .nav-container .dp-c-l-ag .extend-box .trade-drop-item-con.dp-explorer {
    max-width: 250px
  }

  .header-main .nav-container .dp-c-l-ag .extend-box .dropdown-panel-li .drop-panel-box-item,
  .header-main .nav-container .dp-c-l-ag .extend-box .dropdown-panel-li .panel-drop-item-icon,
  .header-main .nav-container .dp-c-l-ag .extend-box .trade-drop-item-con .drop-panel-box-item,
  .header-main .nav-container .dp-c-l-ag .extend-box .trade-drop-item-con .panel-drop-item-icon {
    background: unset;
    color: unset
  }

  .header-main .nav-container .dp-c-l-ag .extend-box .box-title {
    color: var(--oxnv-okd-color-content-contrast);
    font-size: 12px;
    font-weight: 600;
    line-height: 20px;
    margin-bottom: 8px;
    padding-left: 20px
  }

  .header-main .nav-container .dp-c-l-ag .extend-box .explorer-drop-panel-third-list .box-item.drop-panel-menu-item {
    display: flex;
    width: unset
  }

  .header-main .nav-container .dp-c-l-ag .extend-box .box-item {
    align-items: center;
    display: flex;
    padding: 14px 12px
  }

  .header-main .nav-container .dp-c-l-ag .extend-box .box-item:focus-visible {
    border-radius: 4px;
    outline: 2px solid #000;
    outline-offset: 2px
  }

  .header-main .nav-container .dp-c-l-ag .extend-box .box-item.drop-panel-menu-item {
    display: inline-flex;
    vertical-align: middle;
    width: 224px
  }

  .header-main .nav-container .dp-c-l-ag .extend-box .box-item:before {
    color: var(--oxnv-okd-color-content-primary);
    font-size: 24px;
    margin-right: 16px
  }

  .header-main .nav-container .dp-c-l-ag .extend-box .box-item:last-child {
    margin-bottom: 0
  }

  .header-main .nav-container .dp-c-l-ag .extend-box .box-item .icon-box {
    margin-right: 8px
  }

  .header-main .nav-container .dp-c-l-ag .extend-box .box-item .icon-box .icon {
    height: 28px;
    width: 28px
  }

  .header-main .nav-container .dp-c-l-ag .extend-box .box-item .item-box {
    width: -webkit-max-content;
    width: -moz-max-content;
    width: max-content
  }

  .header-main .nav-container .dp-c-l-ag .extend-box .box-item .item-box.item-panel-drop {
    flex: auto;
    max-width: 176px
  }

  .header-main .nav-container .dp-c-l-ag .extend-box .box-item .item-box.trade-item-panel-drop {
    max-width: 251px
  }

  .header-main .nav-container .dp-c-l-ag .extend-box .box-item .item-box .item-title {
    color: var(--oxnv-okd-color-content-primary);
    display: flex;
    font-size: 14px;
    font-weight: 500;
    line-height: 16px
  }

  .header-main .nav-container .dp-c-l-ag .extend-box .box-item .item-box .item-title.item-panel-drop-title {
    align-items: center;
    display: flex;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap
  }

  .header-main .nav-container .dp-c-l-ag .extend-box .box-item .item-box .item-title.trade-item-panel-drop-title {
    align-items: center;
    display: flex
  }

  .header-main .nav-container .dp-c-l-ag .extend-box .box-item .item-box .item-title.title-without-desc {
    padding-bottom: 10px;
    padding-top: 10px
  }

  .header-main .nav-container .dp-c-l-ag .extend-box .box-item .item-box .desc {
    color: var(--oxnv-okd-color-content-contrast);
    font-size: 12px;
    font-weight: 400;
    line-height: 16px;
    margin-top: 4px;
    position: relative;
    visibility: visible
  }

  .header-main .nav-container .dp-c-l-ag .extend-box .box-item:not(.drop-panel-menu-item):hover {
    background: #f9f9f9;
    background: var(--header-lg-drop-box-item-bg-hover);
    border-radius: 4px;
    color: var(--oxnv-okd-color-content-primary);
    cursor: pointer
  }

  .header-main .nav-container .dp-c-l-ag .extend-small-box {
    margin-right: 80px;
    min-width: 120px;
    width: -webkit-max-content;
    width: -moz-max-content;
    width: max-content
  }

  .header-main .nav-container .dp-c-l-ag .extend-small-box .box-title {
    font-weight: 500;
    margin-bottom: 10px;
    padding-left: 12px;
    padding-top: 12px
  }

  .header-main .nav-container .dp-c-l-ag .extend-small-box .box-item {
    align-items: center;
    color: var(--oxnv-okd-color-content-primary);
    cursor: pointer;
    display: flex;
    font-size: 14px;
    font-weight: 500;
    line-height: 20px;
    margin-bottom: 0;
    padding: 12px
  }

  .header-main .nav-container .dp-c-l-ag .extend-small-box .box-item:not(.drop-panel-menu-item):hover {
    background: #f9f9f9;
    background: var(--header-lg-drop-box-item-bg-hover);
    border-radius: 4px;
    color: var(--oxnv-okd-color-content-primary);
    cursor: pointer
  }

  .header-main .nav-container .nav-scroll-box {
    display: flex;
    flex-grow: 1;
    overscroll-behavior-y: contain;
    position: relative
  }

  .header-main .nav-container .nav-l-sec,
  .header-main .nav-container .nav-l-sec .nav-l-con {
    display: flex
  }

  .header-main .nav-container .nav-l-sec .nav-l-con .nav-item {
    margin: 0 10px;
    padding: 0
  }

  .header-main .nav-container .nav-item {
    align-items: center;
    box-sizing: border-box;
    cursor: pointer;
    display: flex;
    height: 100%;
    padding: 0 10px;
    position: relative
  }

  .header-main .nav-container .nav-item .nav-link,
  .header-main .nav-container .nav-item .nav-text,
  .header-main .nav-container .nav-item.nav-link {
    box-sizing: border-box;
    color: var(--oxnv-okd-color-content-primary);
    cursor: pointer;
    display: inline-flex;
    font-size: 14px;
    font-weight: 400;
    line-height: 60px;
    position: relative;
    word-break: break-all
  }

  .header-main .nav-container .nav-item .nav-link.nav-link:focus-visible,
  .header-main .nav-container .nav-item .nav-text.nav-link:focus-visible,
  .header-main .nav-container .nav-item.nav-link.nav-link:focus-visible {
    border: none;
    outline: none
  }

  .header-main .nav-container .nav-item .nav-link.mu-txt,
  .header-main .nav-container .nav-item .nav-text.mu-txt,
  .header-main .nav-container .nav-item.nav-link.mu-txt {
    display: inline-flex;
    flex-direction: row-reverse
  }

  .header-main .nav-container .nav-item .nav-link:focus-visible:after,
  .header-main .nav-container .nav-item .nav-text:focus-visible:after,
  .header-main .nav-container .nav-item.nav-link:focus-visible:after {
    border-radius: 4px;
    bottom: 0;
    content: "";
    height: 30px;
    left: 0;
    margin: auto;
    outline: 2px solid #fff;
    outline-offset: 2px;
    position: absolute;
    right: 0;
    top: 0;
    width: 100%
  }

  .header-main .nav-container .nav-item .mu-txt:before,
  .header-main .nav-container .nav-item .user-arrow {
    color: var(--oxnv-okd-color-content-secondary);
    display: inline-block;
    margin-left: 4px;
    transform: rotate(0deg)
  }

  .header-main .nav-container .nav-item .mu-txt:before .icon,
  .header-main .nav-container .nav-item .user-arrow .icon {
    font-size: 12px
  }

  .header-main .nav-container .nav-item .mu-txt.arrow-show:before,
  .header-main .nav-container .nav-item.show-drop-menu .mu-txt:before,
  .header-main .nav-container .nav-item.show-drop-menu .user-arrow {
    transform: rotate(-180deg)
  }

  .header-main .nav-container .nav-item.show-drop-menu .dp-c-l-ag {
    opacity: 1;
    pointer-events: auto;
    top: 60px;
    visibility: visible
  }

  .header-main .nav-container .nav-academy .nav-link,
  .header-main .nav-container .nav-smsf .nav-link,
  .header-main .nav-container .nav-support .nav-link {
    white-space: nowrap
  }

  .header-main .nav-container .is-left .nav-link,
  .header-main .nav-container .is-left.nav-link {
    align-items: center;
    display: flex;
    height: 100%
  }

  .header-main .nav-container .extend-link {
    align-items: center;
    box-sizing: border-box;
    color: var(--oxnv-okd-color-content-primary);
    cursor: pointer;
    display: flex;
    font-size: 14px;
    font-weight: 500;
    height: unset;
    line-height: 20px;
    padding: 12px 16px;
    white-space: nowrap
  }

  .header-main .nav-container .extend-link:focus-visible {
    border-radius: 4px;
    outline: 2px solid #000;
    outline-offset: 2px
  }

  .header-main .nav-container .extend-link:not(.drop-panel-menu-item):hover {
    background: #f9f9f9;
    background: var(--header-lg-drop-box-item-bg-hover);
    border-radius: 4px;
    color: var(--oxnv-okd-color-content-primary);
    cursor: pointer
  }

  .header-main .nav-container .other-wrap {
    box-sizing: border-box;
    cursor: pointer;
    display: flex;
    line-height: 60px;
    margin: 0 10px;
    padding: 0;
    position: relative
  }

  .header-main .nav-container .other-wrap.nav-im {
    color: #fafafa;
    font-size: 18px
  }

  .header-main .nav-container .other-wrap.nav-im:before {
    font-size: 22px
  }

  .header-main .nav-container .other-wrap .icon,
  .header-main .nav-container .other-wrap .user-info {
    cursor: pointer
  }

  .header-main .nav-container .other-wrap .icon {
    color: var(--oxnv-okd-color-content-primary);
    font-size: 20px;
    position: relative
  }

  .header-main .nav-container .other-wrap .icon:focus-visible:after {
    border-radius: 4px;
    bottom: 0;
    content: "";
    height: 30px;
    left: 0;
    margin: auto;
    outline: 2px solid #fff;
    outline-offset: 2px;
    position: absolute;
    right: 0;
    top: 0;
    width: 100%
  }

  .header-main .nav-container .other-wrap .drop-c-right-align {
    overflow: visible;
    padding: 0 24px;
    right: 0;
    top: 70px
  }

  .header-main .nav-container .other-wrap.show-drop-menu .drop-c-right-align {
    opacity: 1;
    pointer-events: auto;
    top: 60px;
    visibility: visible
  }

  .header-main .nav-container .other-wrap,
  .header-main .nav-container .pc-mode,
  .header-main .nav-container .sm-mode {
    display: none
  }

  .header-main .nav-container .nav-null {
    flex-grow: 1
  }

  .header-main .head-spl-lin {
    background: hsla(0, 0%, 100%, .15);
    height: 16px;
    margin: 16px 10px 16px 20px;
    width: 1px
  }

  .header-main .column-nav-container .nav-scroll-box {
    display: flex;
    flex-direction: row;
    flex-grow: 1;
    justify-content: flex-end;
    padding: 0;
    top: 0;
    width: auto
  }

  .header-main .column-nav-container .nav-scroll-box::-webkit-scrollbar {
    display: none
  }

  .header-main .column-nav-container .mode-xl-line,
  .header-main .column-nav-container .nav-academy,
  .header-main .column-nav-container .nav-balance,
  .header-main .column-nav-container .nav-buy,
  .header-main .column-nav-container .nav-cefi-market,
  .header-main .column-nav-container .nav-custom,
  .header-main .column-nav-container .nav-dashboard,
  .header-main .column-nav-container .nav-deposit,
  .header-main .column-nav-container .nav-earn,
  .header-main .column-nav-container .nav-explorer .nav-nft,
  .header-main .column-nav-container .nav-institutions,
  .header-main .column-nav-container .nav-language,
  .header-main .column-nav-container .nav-leaderboard,
  .header-main .column-nav-container .nav-market,
  .header-main .column-nav-container .nav-meme-pump,
  .header-main .column-nav-container .nav-mobile-download,
  .header-main .column-nav-container .nav-mode,
  .header-main .column-nav-container .nav-more,
  .header-main .column-nav-container .nav-nft,
  .header-main .column-nav-container .nav-okc,
  .header-main .column-nav-container .nav-portfolio,
  .header-main .column-nav-container .nav-referral,
  .header-main .column-nav-container .nav-signal,
  .header-main .column-nav-container .nav-site-flag,
  .header-main .column-nav-container .nav-smsf,
  .header-main .column-nav-container .nav-swap,
  .header-main .column-nav-container .nav-tracker,
  .header-main .column-nav-container .nav-trade,
  .header-main .column-nav-container .nav-user,
  .header-main .column-nav-container .nav-web3-more,
  .header-main .column-nav-container .other-wrap,
  .header-main .column-nav-container .pc-mode,
  .header-main .column-nav-container .profile-wrap,
  .header-main .column-nav-container .user-info-item {
    display: none
  }

  .header-main .column-nav-container .mode-line {
    background: hsla(0, 0%, 100%, .15);
    display: none;
    height: 16px;
    margin: 16px;
    width: 1px
  }

  .header-main .column-nav-container .mode-line.has-address {
    display: block
  }

  .header-main .column-nav-container,
  .header-main .column-nav-container .mode-no-login {
    display: none
  }

  .header-main.active .column-nav-container {
    background: var(--oxnv-okd-color-background-base-primary);
    box-shadow: 0 12px 60px rgba(14, 32, 66, .15), 0 1px 2px rgba(14, 32, 66, .05);
    display: flex;
    height: 100%;
    position: fixed;
    right: 0;
    transform: translateZ(0);
    width: 376px;
    z-index: 9500
  }

  .header-main.active .column-nav-container.web3-column-container {
    display: block
  }

  .header-main.active .column-nav-container.web3-column-container .col-mu-top {
    align-items: center;
    display: flex;
    justify-content: space-between;
    padding: 22px 16px
  }

  .header-main.active .column-nav-container.web3-column-container .nav-item .nav-link,
  .header-main.active .column-nav-container.web3-column-container .nav-item .nav-text.mu-txt,
  .header-main.active .column-nav-container.web3-column-container .nav-item.nav-link {
    font-weight: 500
  }

  .header-main.active .column-nav-container .nav-scroll-box {
    display: block;
    flex-direction: column;
    height: 95%;
    justify-content: unset;
    overflow: scroll;
    padding: 0 20px 48px;
    position: absolute;
    top: 48px;
    width: 100%
  }

  .header-main.active .column-nav-container .nav-wrap {
    display: flex;
    flex-direction: column;
    width: 100%
  }

  .header-main.active .column-nav-container .nav-item {
    cursor: pointer;
    display: flex;
    flex-direction: row;
    flex-wrap: wrap;
    justify-content: flex-start;
    padding: 0;
    width: 100%
  }

  .header-main.active .column-nav-container .nav-item:focus-visible {
    border-radius: 4px;
    outline: 2px solid #fff;
    outline-offset: 2px
  }

  .header-main.active .column-nav-container .nav-item .icon-img {
    display: none
  }

  .header-main.active .column-nav-container .nav-item.show-more .mu-txt.mu-txt-extend:before,
  .header-main.active .column-nav-container .nav-item.show-more .mu-txt:not(.mu-txt-third):before,
  .header-main.active .column-nav-container .nav-item.show-more .user-arrow.mu-txt-extend:before,
  .header-main.active .column-nav-container .nav-item.show-more .user-arrow:not(.mu-txt-third):before {
    transform: rotate(-180deg)
  }

  .header-main.active .column-nav-container .nav-item.show-more .dp-c-l-ag:not(.nav-boost-drop),
  .header-main.active .column-nav-container .nav-item.show-more .drop-c-right-align:not(.nav-boost-drop) {
    display: block
  }

  .header-main.active .column-nav-container .nav-item.show-more .nav-item.panel-nav-item.panel-col {
    display: flex
  }

  .header-main.active .column-nav-container .nav-item .nav-link,
  .header-main.active .column-nav-container .nav-item .nav-text,
  .header-main.active .column-nav-container .nav-item.nav-link {
    align-items: center;
    color: var(--oxnv-okd-color-content-primary);
    cursor: pointer;
    display: flex;
    flex-grow: 1;
    font-size: 18px;
    height: 52px;
    line-height: unset;
    padding: 17px 0
  }

  .header-main.active .column-nav-container .nav-item .nav-link:focus-visible,
  .header-main.active .column-nav-container .nav-item .nav-text:focus-visible,
  .header-main.active .column-nav-container .nav-item.nav-link:focus-visible {
    border-radius: 4px;
    outline: 2px solid #fff;
    outline-offset: 2px
  }

  .header-main.active .column-nav-container .nav-item .nav-link.mu-txt,
  .header-main.active .column-nav-container .nav-item .nav-text.mu-txt,
  .header-main.active .column-nav-container .nav-item.nav-link.mu-txt {
    justify-content: space-between
  }

  .header-main.active .column-nav-container .nav-item .nav-link.mu-txt:before,
  .header-main.active .column-nav-container .nav-item .nav-text.mu-txt:before,
  .header-main.active .column-nav-container .nav-item.nav-link.mu-txt:before {
    font-size: 14px;
    order: 5
  }

  .header-main.active .column-nav-container .nav-item .nav-link:active,
  .header-main.active .column-nav-container .nav-item .nav-text:active,
  .header-main.active .column-nav-container .nav-item.nav-link:active {
    color: var(--oxnv-okd-color-content-primary)
  }

  .header-main.active .column-nav-container .nav-item .mu-txt:before,
  .header-main.active .column-nav-container .nav-item .user-arrow {
    color: #909090;
    cursor: pointer;
    display: inline-block;
    margin-left: 4px;
    margin-right: 0;
    padding: 20px 0;
    transform: rotate(0deg)
  }

  .header-main.active .column-nav-container .nav-item .mu-txt:before .icon,
  .header-main.active .column-nav-container .nav-item .user-arrow .icon {
    color: #909090;
    font-size: 12px;
    font-weight: 500;
    pointer-events: none
  }

  .header-main.active .column-nav-container .nav-item .dp-c-l-ag .box-item,
  .header-main.active .column-nav-container .nav-item .dp-c-l-ag .extend-link {
    display: inline-block
  }

  .header-main.active .column-nav-container .nav-item .dp-c-l-ag .box-item:focus-visible,
  .header-main.active .column-nav-container .nav-item .dp-c-l-ag .extend-link:focus-visible {
    border-radius: 4px;
    outline: 2px solid #fff;
    outline-offset: 2px
  }

  .header-main.active .column-nav-container .nav-item .dp-c-l-ag .box-item .item-box:focus-visible,
  .header-main.active .column-nav-container .nav-item .dp-c-l-ag .extend-link .item-box:focus-visible {
    border-radius: 4px;
    outline: 2px solid #fff;
    outline-offset: 2px
  }

  .header-main.active .column-nav-container .nav-item .dp-c-l-ag .box-item:before,
  .header-main.active .column-nav-container .nav-item .dp-c-l-ag .extend-link:before {
    display: none
  }

  .header-main.active .column-nav-container .nav-item .dp-c-l-ag .box-item .nav-hot-tag,
  .header-main.active .column-nav-container .nav-item .dp-c-l-ag .box-item .nav-hot-tag.only-column,
  .header-main.active .column-nav-container .nav-item .dp-c-l-ag .box-item .nav-new-tag,
  .header-main.active .column-nav-container .nav-item .dp-c-l-ag .box-item .nav-new-tag.only-column,
  .header-main.active .column-nav-container .nav-item .dp-c-l-ag .extend-link .nav-hot-tag,
  .header-main.active .column-nav-container .nav-item .dp-c-l-ag .extend-link .nav-hot-tag.only-column,
  .header-main.active .column-nav-container .nav-item .dp-c-l-ag .extend-link .nav-new-tag,
  .header-main.active .column-nav-container .nav-item .dp-c-l-ag .extend-link .nav-new-tag.only-column {
    display: inline-block
  }

  .header-main.active .column-nav-container .nav-item .dp-c-l-ag:not(.nav-boost-drop),
  .header-main.active .column-nav-container .nav-item .drop-c-right-align:not(.nav-boost-drop) {
    background: transparent;
    display: none;
    left: auto;
    opacity: 1;
    padding: 4px 0 4px 12px;
    position: relative;
    top: auto;
    transform: unset;
    visibility: visible;
    width: 100%
  }

  .header-main.active .column-nav-container .nav-item .dp-c-l-ag:not(.nav-boost-drop).drop-c-common-show,
  .header-main.active .column-nav-container .nav-item .drop-c-right-align:not(.nav-boost-drop).drop-c-common-show {
    opacity: 1;
    pointer-events: auto;
    top: 60px;
    visibility: visible
  }

  .header-main.active .column-nav-container .nav-item .dp-c-l-ag:not(.nav-boost-drop) .info-extend-box,
  .header-main.active .column-nav-container .nav-item .drop-c-right-align:not(.nav-boost-drop) .info-extend-box {
    flex-direction: column
  }

  .header-main.active .column-nav-container .nav-item .dp-c-l-ag:not(.nav-boost-drop) .info-extend-box .item-title,
  .header-main.active .column-nav-container .nav-item .drop-c-right-align:not(.nav-boost-drop) .info-extend-box .item-title {
    color: var(--oxnv-okd-color-content-secondary);
    display: inline-flex;
    font-size: 16px;
    height: 44px;
    padding: 14px 0;
    width: 100%
  }

  .header-main.active .column-nav-container .nav-item .dp-c-l-ag:not(.nav-boost-drop) .info-extend-box .item-title:hover,
  .header-main.active .column-nav-container .nav-item .drop-c-right-align:not(.nav-boost-drop) .info-extend-box .item-title:hover {
    background: transparent;
    color: var(--oxnv-okd-color-content-primary)
  }

  .header-main.active .column-nav-container .nav-item .dp-c-l-ag:not(.nav-boost-drop) .info-extend-box .tab-ms,
  .header-main.active .column-nav-container .nav-item .drop-c-right-align:not(.nav-boost-drop) .info-extend-box .tab-ms {
    color: #646f84;
    font-size: 14px;
    font-style: normal;
    font-weight: 400;
    line-height: 20px
  }

  .header-main.active .column-nav-container .nav-item .dp-c-l-ag:not(.nav-boost-drop) .extend-box,
  .header-main.active .column-nav-container .nav-item .drop-c-right-align:not(.nav-boost-drop) .extend-box {
    margin: 0;
    max-width: unset;
    min-width: unset;
    padding: 0;
    width: 100%
  }

  .header-main.active .column-nav-container .nav-item .dp-c-l-ag:not(.nav-boost-drop) .extend-box .box-title,
  .header-main.active .column-nav-container .nav-item .dp-c-l-ag:not(.nav-boost-drop) .extend-box .desc-box,
  .header-main.active .column-nav-container .nav-item .dp-c-l-ag:not(.nav-boost-drop) .extend-box .icon-box,
  .header-main.active .column-nav-container .nav-item .drop-c-right-align:not(.nav-boost-drop) .extend-box .box-title,
  .header-main.active .column-nav-container .nav-item .drop-c-right-align:not(.nav-boost-drop) .extend-box .desc-box,
  .header-main.active .column-nav-container .nav-item .drop-c-right-align:not(.nav-boost-drop) .extend-box .icon-box {
    display: none
  }

  .header-main.active .column-nav-container .nav-item .dp-c-l-ag:not(.nav-boost-drop) .extend-box .box-item,
  .header-main.active .column-nav-container .nav-item .drop-c-right-align:not(.nav-boost-drop) .extend-box .box-item {
    height: 44px;
    margin: 0
  }

  .header-main.active .column-nav-container .nav-item .dp-c-l-ag:not(.nav-boost-drop) .extend-box .box-item .item-title,
  .header-main.active .column-nav-container .nav-item .drop-c-right-align:not(.nav-boost-drop) .extend-box .box-item .item-title {
    color: var(--oxnv-okd-color-content-secondary);
    display: inline-flex;
    font-size: 16px;
    height: 44px;
    padding: 14px 0;
    width: 100%
  }

  .header-main.active .column-nav-container .nav-item .dp-c-l-ag:not(.nav-boost-drop) .extend-box .box-item .item-title:hover,
  .header-main.active .column-nav-container .nav-item .drop-c-right-align:not(.nav-boost-drop) .extend-box .box-item .item-title:hover {
    background: transparent;
    color: var(--oxnv-okd-color-content-primary)
  }

  .header-main.active .column-nav-container .nav-item .dp-c-l-ag:not(.nav-boost-drop) .extend-box .box-item .item-title.item-panel-drop-title,
  .header-main.active .column-nav-container .nav-item .drop-c-right-align:not(.nav-boost-drop) .extend-box .box-item .item-title.item-panel-drop-title {
    max-width: 270px;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap
  }

  .header-main.active .column-nav-container .nav-item .dp-c-l-ag:not(.nav-boost-drop) .extend-box .box-item .item-title.title-without-tag,
  .header-main.active .column-nav-container .nav-item .drop-c-right-align:not(.nav-boost-drop) .extend-box .box-item .item-title.title-without-tag {
    display: inline-block
  }

  .header-main.active .column-nav-container .nav-item .dp-c-l-ag:not(.nav-boost-drop) .extend-small-box .box-item,
  .header-main.active .column-nav-container .nav-item .drop-c-right-align:not(.nav-boost-drop) .extend-small-box .box-item {
    color: var(--oxnv-okd-color-content-secondary);
    display: inline-flex;
    font-size: 16px;
    height: 44px;
    margin: 0;
    padding: 14px 0;
    width: 100%
  }

  .header-main.active .column-nav-container .nav-item .dp-c-l-ag:not(.nav-boost-drop) .extend-small-box .box-item:hover,
  .header-main.active .column-nav-container .nav-item .drop-c-right-align:not(.nav-boost-drop) .extend-small-box .box-item:hover {
    background: transparent;
    color: var(--oxnv-okd-color-content-primary)
  }

  .header-main.active .column-nav-container .nav-item .dp-c-l-ag .extend-box .box-item {
    width: 100%
  }

  .header-main.active .column-nav-container .pc-mode {
    display: none
  }

  .header-main.active .column-nav-container .extend-link {
    color: var(--oxnv-okd-color-content-secondary);
    cursor: pointer;
    display: inline-flex;
    font-size: 16px;
    height: 44px;
    padding: 14px 0;
    width: 100%
  }

  .header-main.active .column-nav-container .extend-link:hover {
    background: transparent;
    color: var(--oxnv-okd-color-content-primary)
  }

  .header-main.active .column-nav-container .extend-link:focus-visible {
    border-radius: 4px;
    outline: 2px solid #fff;
    outline-offset: 2px
  }

  .header-main.active .column-nav-container .extend-link .icon {
    font-size: 16px;
    margin-left: 4px;
    position: relative;
    top: 1px
  }

  .header-main.active .column-nav-container .nav-scroll-box .asset-bottom-line,
  .header-main.active .column-nav-container .nav-scroll-box .nav-item.is-user,
  .header-main.active .column-nav-container .nav-scroll-box .nav-item.nav-balance,
  .header-main.active .column-nav-container .nav-scroll-box .profile-wrap,
  .header-main.active .column-nav-container.asset-active .nav-scroll-box .nav-item.is-left,
  .header-main.active .column-nav-container.asset-active .nav-scroll-box .nav-item.nav-mode,
  .header-main.active .column-nav-container.asset-active .nav-scroll-box .nav-language-column,
  .header-main.active .column-nav-container.asset-active .nav-scroll-box .nav-mobile-download {
    display: none
  }

  .header-main.active .column-nav-container.asset-active .nav-scroll-box .asset-bottom-line,
  .header-main.active .column-nav-container.asset-active .nav-scroll-box .nav-balance,
  .header-main.active .column-nav-container.asset-active .nav-scroll-box .nav-item.is-user,
  .header-main.active .column-nav-container.asset-active .nav-scroll-box .profile-wrap {
    display: flex
  }

  .header-main.active[data-shrink-step="0"] .column-nav-container {
    display: none
  }

  body .header-container .header-wrap .header-main .nav-container .nav-doc .dp-c-l-ag .extend-box,
  body .header-container .header-wrap .header-main .nav-discovery .dp-c-l-ag .extend-box {
    margin-right: 0
  }

  body .header-container .header-wrap .header-main .nav-container .nav-doc .dp-c-l-ag .extend-box .explorer-drop-panel-third-list .box-item.drop-panel-box-item,
  body .header-container .header-wrap .header-main .nav-discovery .dp-c-l-ag .extend-box .explorer-drop-panel-third-list .box-item.drop-panel-box-item {
    display: flex;
    width: unset
  }

  body .header-container .header-wrap .header-main .nav-container .nav-doc .dp-c-l-ag .extend-box .box-item,
  body .header-container .header-wrap .header-main .nav-discovery .dp-c-l-ag .extend-box .box-item {
    display: flex;
    margin: unset;
    max-width: 342px
  }

  body .header-container .header-wrap .header-main .nav-container .nav-doc .dp-c-l-ag .extend-box .box-item.panel-box-item,
  body .header-container .header-wrap .header-main .nav-discovery .dp-c-l-ag .extend-box .box-item.panel-box-item {
    display: inline-flex;
    vertical-align: middle;
    width: 264px
  }
}

@media (min-width:1024px) {

  body .header-container .header-wrap .header-main .nav-container .nav-doc .dp-c-l-ag .extend-box .box-item.panel-box-item:not(:has(+.panel-drop-item-icon)):not(.third-box-item),
  body .header-container .header-wrap .header-main .nav-discovery .dp-c-l-ag .extend-box .box-item.panel-box-item:not(:has(+.panel-drop-item-icon)):not(.third-box-item) {
    width: 288px
  }

  body .header-container .header-wrap .header-main .nav-container .nav-doc .dp-c-l-ag .extend-box .box-item .icon-box,
  body .header-container .header-wrap .header-main .nav-discovery .dp-c-l-ag .extend-box .box-item .icon-box {
    margin-right: 8px;
    margin-top: -4px
  }

  body .header-container .header-wrap .header-main .nav-container .nav-doc .dp-c-l-ag .extend-box .box-item .item-box,
  body .header-container .header-wrap .header-main .nav-discovery .dp-c-l-ag .extend-box .box-item .item-box {
    display: flex;
    flex-direction: column;
    width: 100%
  }

  body .header-container .header-wrap .header-main .nav-container .nav-doc .dp-c-l-ag .extend-box .box-item .item-box.hide,
  body .header-container .header-wrap .header-main .nav-discovery .dp-c-l-ag .extend-box .box-item .item-box.hide {
    display: none
  }

  body .header-container .header-wrap .header-main .nav-container .nav-doc .dp-c-l-ag .extend-box .box-item .item-box.show,
  body .header-container .header-wrap .header-main .nav-container .nav-doc .dp-c-l-ag .only-new-box,
  body .header-container .header-wrap .header-main .nav-discovery .dp-c-l-ag .extend-box .box-item .item-box.show,
  body .header-container .header-wrap .header-main .nav-discovery .dp-c-l-ag .only-new-box {
    display: block
  }

  body .header-container .header-wrap .header-main .nav-container .nav-doc .dp-c-l-ag,
  body .header-container .header-wrap .header-main .nav-discovery .dp-c-l-ag {
    left: 50%;
    padding-bottom: 12px;
    padding-top: 12px;
    transform: translateX(-50%)
  }

  body .header-container .header-wrap .header-main .nav-container .nav-doc .dp-c-l-ag.drop-panel,
  body .header-container .header-wrap .header-main .nav-discovery .dp-c-l-ag.drop-panel {
    overflow: visible
  }

  body .header-container .header-wrap .header-main .nav-container .nav-doc .dp-c-l-ag .extend-box,
  body .header-container .header-wrap .header-main .nav-discovery .dp-c-l-ag .extend-box {
    min-width: 320px
  }

  body .header-container .header-wrap .header-main .nav-container .nav-doc .dp-c-l-ag .extend-box.drop-extend-box,
  body .header-container .header-wrap .header-main .nav-discovery .dp-c-l-ag .extend-box.drop-extend-box {
    min-width: auto
  }

  body .header-container .header-wrap .header-main .nav-container .nav-doc .dp-c-l-ag .extend-box .box-item,
  body .header-container .header-wrap .header-main .nav-discovery .dp-c-l-ag .extend-box .box-item {
    align-items: center;
    max-width: 400px
  }

  body .header-container .header-wrap .header-main .nav-container .nav-doc .dp-c-l-ag .extend-box .box-item.drop-panel-box-item,
  body .header-container .header-wrap .header-main .nav-discovery .dp-c-l-ag .extend-box .box-item.drop-panel-box-item {
    padding: 12px 8px
  }

  body .header-container .header-wrap .header-main .nav-container .nav-doc .dp-c-l-ag .extend-box .box-item .item-box .item-panel-drop-desc,
  body .header-container .header-wrap .header-main .nav-discovery .dp-c-l-ag .extend-box .box-item .item-box .item-panel-drop-desc {
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap
  }

  body .header-container .header-wrap .header-main .nav-container .nav-doc .dp-c-l-ag .extend-box:last-child,
  body .header-container .header-wrap .header-main .nav-discovery .dp-c-l-ag .extend-box:last-child {
    margin-right: 0
  }

  body .header-container .header-wrap .header-main .nav-container .nav-doc .dp-c-l-ag .extend-box .drop-menu-desc-list,
  body .header-container .header-wrap .header-main .nav-discovery .dp-c-l-ag .extend-box .drop-menu-desc-list {
    box-sizing: border-box;
    display: flex;
    padding-left: 52px;
    width: 100%
  }

  body .header-container .header-wrap .header-main .nav-container .nav-doc .dp-c-l-ag .extend-box .drop-menu-desc-list .drop-menu-list-item,
  body .header-container .header-wrap .header-main .nav-discovery .dp-c-l-ag .extend-box .drop-menu-desc-list .drop-menu-list-item {
    width: 172px
  }

  body .header-container .header-wrap .header-main .nav-container .nav-doc .dp-c-l-ag .extend-box .drop-menu-desc-list .drop-menu-list-item.drop-menu-reverse-list,
  body .header-container .header-wrap .header-main .nav-discovery .dp-c-l-ag .extend-box .drop-menu-desc-list .drop-menu-list-item.drop-menu-reverse-list {
    display: flex;
    flex-direction: column-reverse
  }

  body .header-container .header-wrap .header-main .nav-container .nav-doc .dp-c-l-ag .extend-box .drop-menu-desc-list .drop-menu-list-item .drop-menu-item,
  body .header-container .header-wrap .header-main .nav-discovery .dp-c-l-ag .extend-box .drop-menu-desc-list .drop-menu-list-item .drop-menu-item {
    border-radius: 4px;
    box-sizing: border-box;
    color: var(--oxnv-okd-color-content-primary);
    display: block;
    font-size: 14px;
    font-weight: 400;
    line-height: 16px;
    padding: 11px 4px 11px 21px;
    position: relative
  }

  body .header-container .header-wrap .header-main .nav-container .nav-doc .dp-c-l-ag .extend-box .drop-menu-desc-list .drop-menu-list-item .drop-menu-item:focus-visible,
  body .header-container .header-wrap .header-main .nav-discovery .dp-c-l-ag .extend-box .drop-menu-desc-list .drop-menu-list-item .drop-menu-item:focus-visible {
    border-radius: 4px;
    outline: 2px solid #000;
    outline-offset: 2px
  }

  body .header-container .header-wrap .header-main .nav-container .nav-doc .dp-c-l-ag .extend-box .drop-menu-desc-list .drop-menu-list-item .drop-menu-item:before,
  body .header-container .header-wrap .header-main .nav-discovery .dp-c-l-ag .extend-box .drop-menu-desc-list .drop-menu-list-item .drop-menu-item:before {
    background: var(--oxnv-okd-color-content-primary);
    border-radius: 50%;
    content: "";
    display: block;
    font-size: 12px;
    height: 5px;
    left: 8px;
    position: absolute;
    top: 16px;
    width: 5px
  }

  body .header-container .header-wrap .header-main .nav-container .nav-doc .dp-c-l-ag .extend-box .drop-menu-desc-list .drop-menu-list-item .drop-menu-item:hover,
  body .header-container .header-wrap .header-main .nav-discovery .dp-c-l-ag .extend-box .drop-menu-desc-list .drop-menu-list-item .drop-menu-item:hover {
    background: #f9f9f9;
    background: var(--header-lg-drop-box-item-bg-hover)
  }

  body .header-container .header-wrap .header-main .nav-container .nav-doc .dp-c-l-ag .extend-box .drop-menu-desc-list .drop-menu-list-item .drop-menu-item .nav-new-tag,
  body .header-container .header-wrap .header-main .nav-discovery .dp-c-l-ag .extend-box .drop-menu-desc-list .drop-menu-list-item .drop-menu-item .nav-new-tag {
    margin-left: 0
  }

  body .header-container .header-wrap .header-main .nav-container .nav-doc .dp-c-l-ag .extend-box .drop-menu-desc-list .drop-menu-list-item .drop-menu-item .new-tag-title-container,
  body .header-container .header-wrap .header-main .nav-discovery .dp-c-l-ag .extend-box .drop-menu-desc-list .drop-menu-list-item .drop-menu-item .new-tag-title-container {
    margin-right: 5px
  }
}

body .header-container .header-wrap .web3-header .nav-container .nav-item.nav-boost-item {
  cursor: auto;
  display: inline-block;
  padding-left: 0;
  padding-right: 0
}

body .header-container .header-wrap .web3-header .nav-container .nav-item.nav-boost-item .dp-c-l-ag {
  left: auto;
  right: -52px;
  top: 60px
}

@media (min-width:1024px) {
  body .header-container .header-wrap .web3-header .nav-container .nav-item.nav-boost-item .dp-c-l-ag {
    left: -42px;
    right: auto
  }
}

body .header-container .header-wrap .web3-header .nav-container .nav-item.nav-boost {
  align-items: center;
  background-color: var(--header-boost-icon-background);
  border-radius: 8px;
  color: var(--oxnv-okd-color-brand-primary-alternative);
  cursor: pointer;
  display: flex;
  flex-shrink: 0;
  font-size: 14px;
  font-weight: 500;
  gap: 4px;
  height: 36px;
  justify-content: center;
  line-height: 16px;
  margin-top: 12px;
  padding: 8px
}

body .header-container .header-wrap .web3-header .nav-container .nav-item.nav-boost .nav-boost-icon {
  height: 20px;
  width: 20px
}

body .header-container .header-wrap .web3-header .nav-container .nav-item.nav-boost.nav-boost-sm {
  display: none
}

body .header-container .header-wrap .web3-header .nav-container .nav-item.nav-boost .dp-c-l-ag .extend-box .box-item {
  max-width: 276px
}

.oxnv-pnlswitch-mode {
  display: flex
}

.oxnv-pnlswitch-mode-row-label {
  flex: 1 1
}

.oxnv-pnlswitch-mode.oxnv-pnlswitch-mode-horizontal {
  flex-direction: row;
  gap: 16px
}

.oxnv-pnlswitch-mode.oxnv-pnlswitch-mode-horizontal .oxnv-pnlswitch-mode-item {
  align-items: flex-start;
  display: flex;
  flex: 1 1;
  flex-direction: column;
  gap: 16px;
  justify-content: space-between
}

.oxnv-pnlswitch-mode.oxnv-pnlswitch-mode-vertical {
  flex-direction: column;
  gap: 8px
}

.oxnv-pnlswitch-mode.oxnv-pnlswitch-mode-vertical .oxnv-pnlswitch-mode-item {
  align-items: center;
  display: flex;
  flex: 1 1;
  justify-content: space-between
}

.oxnv-pnlswitch-mode.oxnv-pnlswitch-mode-vertical .oxnv-pnlswitch-mode-chart {
  margin-left: 8px
}

.oxnv-pnlswitch-mode-label {
  color: var(--oxnv-okd-color-content-static-default);
  color: var(--oxnv-okd-pnlswitch-font-color, var(--oxnv-okd-color-content-static-default));
  flex: 1 1;
  font-size: 14px;
  font-size: var(--oxnv-okd-pnlswitch-label-font-size, 14px);
  line-height: 16px;
  line-height: var(--oxnv-okd-pnlswitch-label-line-height, 16px)
}

.oxnv-pnlswitch-updown {
  display: flex
}

.oxnv-pnlswitch-updown-row-label {
  flex: 1 1
}

.oxnv-pnlswitch-updown.oxnv-pnlswitch-updown-horizontal {
  flex-direction: row;
  gap: 16px
}

.oxnv-pnlswitch-updown.oxnv-pnlswitch-updown-horizontal .oxnv-pnlswitch-updown-icon {
  font-size: 24px
}

.oxnv-pnlswitch-updown.oxnv-pnlswitch-updown-vertical {
  gap: 8px
}

.oxnv-pnlswitch-updown.oxnv-pnlswitch-updown-vertical .oxnv-pnlswitch-updown-icon {
  font-size: 16px
}

.oxnv-pnlswitch-updown .oxnv-pnlswitch-updown-item {
  align-items: center;
  display: flex;
  flex: 1 1;
  justify-content: space-between
}

.oxnv-pnlswitch-updown-label {
  align-items: center;
  color: var(--oxnv-okd-color-content-static-default);
  color: var(--oxnv-okd-pnlswitch-font-color, var(--oxnv-okd-color-content-static-default));
  display: flex;
  flex: 1 1;
  font-size: 14px;
  font-size: var(--oxnv-okd-pnlswitch-label-font-size, 14px);
  line-height: 16px;
  line-height: var(--oxnv-okd-pnlswitch-label-line-height, 16px);
  margin-right: 8px;
  min-height: 22px
}

.oxnv-pnlswitch-updown-icon-container {
  display: flex
}

.oxnv-pnlswitch-updown-global-up {
  color: var(--global-color-surface-pnl-profit-graph);
  font-size: 16px
}

.oxnv-pnlswitch-updown-global-down {
  color: var(--global-color-surface-pnl-loss-graph);
  font-size: 16px
}

.oxnv-pnlswitch-updown-up {
  color: var(--oxnv-okd-color-surface-pnl-profit-graph)
}

.oxnv-pnlswitch-updown-down {
  color: var(--oxnv-okd-color-surface-pnl-loss-graph)
}

.oxnv-pnlswitch-updown-icon:last-child {
  margin-left: -3px
}

.oxnv-icon.icon {
  font-family: var(--ok-icon-font-family) !important
}

.theme-light {
  --oxnv-okd-color-gray-050: #f9f9f9;
  --oxnv-okd-color-gray-100: #ebebeb;
  --oxnv-okd-color-gray-200: #dbdbdb;
  --oxnv-okd-color-gray-300: #bdbdbd;
  --oxnv-okd-color-gray-400: #929292;
  --oxnv-okd-color-gray-500: #6e6e6e;
  --oxnv-okd-color-gray-600: #545454;
  --oxnv-okd-color-gray-700: #3d3d3d;
  --oxnv-okd-color-gray-800: #1a1a1a;
  --oxnv-okd-color-gray-900: #000;
  --oxnv-okd-color-blue-050: #f5f9ff;
  --oxnv-okd-color-blue-100: #d1e3ff;
  --oxnv-okd-color-blue-200: #afcfff;
  --oxnv-okd-color-blue-300: #8dbbff;
  --oxnv-okd-color-blue-400: #6ba6ff;
  --oxnv-okd-color-blue-500: #4992ff;
  --oxnv-okd-color-blue-600: #277dff;
  --oxnv-okd-color-blue-700: #0569ff;
  --oxnv-okd-color-blue-800: #005eea;
  --oxnv-okd-color-blue-900: #0051ca;
  --oxnv-okd-color-green-050: #f2fff7;
  --oxnv-okd-color-green-100: #d2f4de;
  --oxnv-okd-color-green-200: #a5e9be;
  --oxnv-okd-color-green-300: #78de9d;
  --oxnv-okd-color-green-400: #4bd37d;
  --oxnv-okd-color-green-500: #31bd65;
  --oxnv-okd-color-green-600: #18a04a;
  --oxnv-okd-color-green-700: #127837;
  --oxnv-okd-color-green-800: #0c5025;
  --oxnv-okd-color-green-900: #0c5025;
  --oxnv-okd-color-red-050: #fff8f9;
  --oxnv-okd-color-red-100: #fcdce5;
  --oxnv-okd-color-red-200: #f9b9ca;
  --oxnv-okd-color-red-300: #f796b0;
  --oxnv-okd-color-red-400: #f07596;
  --oxnv-okd-color-red-500: #f1507b;
  --oxnv-okd-color-red-600: #c14062;
  --oxnv-okd-color-red-700: #91304a;
  --oxnv-okd-color-red-800: #602031;
  --oxnv-okd-color-red-900: #301019;
  --oxnv-okd-color-orange-050: #fef9f6;
  --oxnv-okd-color-orange-100: #fce3d4;
  --oxnv-okd-color-orange-200: #fbceb4;
  --oxnv-okd-color-orange-300: #f9b994;
  --oxnv-okd-color-orange-400: #f7a474;
  --oxnv-okd-color-orange-500: #f58f54;
  --oxnv-okd-color-orange-600: #f6813d;
  --oxnv-okd-color-orange-700: #f16514;
  --oxnv-okd-color-orange-800: #e96010;
  --oxnv-okd-color-orange-900: #bf4803;
  --oxnv-okd-color-yellow-050: #fffcf5;
  --oxnv-okd-color-yellow-100: #fff2d1;
  --oxnv-okd-color-yellow-200: #ffe9af;
  --oxnv-okd-color-yellow-300: #ffdf8d;
  --oxnv-okd-color-yellow-400: #ffd66b;
  --oxnv-okd-color-yellow-500: #ffcc49;
  --oxnv-okd-color-yellow-600: #ffc327;
  --oxnv-okd-color-yellow-700: #ffb905;
  --oxnv-okd-color-yellow-800: #eaa900;
  --oxnv-okd-color-yellow-900: #d29801;
  --oxnv-okd-color-text-white: #fff;
  --oxnv-okd-color-text-black: #1f2933;
  --oxnv-okd-color-background-1: #fff;
  --oxnv-okd-color-background-2: #f7f7f7;
  --oxnv-okd-color-transparent: transparent;
  --oxnv-okd-color-white: #fff;
  --oxnv-okd-color-black: #000;
  --oxnv-okd-color-line-muted: #ebebeb;
  --oxnv-okd-color-line-secondary: #dbdbdb;
  --oxnv-okd-color-line-amplifed: #bdbdbd;
  --oxnv-okd-color-text-lighter: #bdbdbd;
  --oxnv-okd-color-text-light: #929292;
  --oxnv-okd-color-text-secondary: #3d3d3d;
  --oxnv-okd-color-text-amplifed: #000;
  --oxnv-okd-color-background-3: #f2f2f2;
  --oxnv-okd-color-fq-blue-lv1: #0569ff;
  --oxnv-okd-color-fq-green-lv1: #19cc5b;
  --oxnv-okd-color-fq-red-lv1: #f1507b;
  --oxnv-okd-color-fq-orange-lv1: #f16514;
  --oxnv-okd-color-fq-blue-lv2: #0569ff;
  --oxnv-okd-color-background-hover: #ebebeb;
  --oxnv-okd-color-prefer-red-chart: #f1507b;
  --oxnv-okd-color-prefer-red-bg: #eb4b6d;
  --oxnv-okd-color-prefer-green-chart: #19cc5b;
  --oxnv-okd-color-prefer-green-bg: #31bd65;
  --oxnv-okd-color-prefer-red-text: #eb4b6d;
  --oxnv-okd-color-prefer-green-text: #31bd65;
  --oxnv-okd-color-branded-primary: #bcff2f;
  --oxnv-okd-color-fq-critical: #eb4b6d;
  --oxnv-okd-color-fq-warning: #f16514;
  --oxnv-okd-color-fq-positive: #31bd65;
  --oxnv-okd-color-fq-neutral: #000;
  --oxnv-okd-color-fq-accent: #0569ff;
  --oxnv-okd-color-prefer-neutral-text: #929292;
  --oxnv-okd-color-prefer-neutral-bg: #929292;
  --oxnv-okd-color-background-base-primary: #fff;
  --oxnv-okd-color-background-base-secondary: #fafafa;
  --oxnv-okd-color-background-surface-primary: #f3f3f3;
  --oxnv-okd-color-background-surface-secondary: #f6f6f6;
  --oxnv-okd-color-background-surface-pressed: #d9d9d9;
  --oxnv-okd-color-background-surface-disable: #fafafa;
  --oxnv-okd-color-background-scrim: rgba(0, 0, 0, .43);
  --oxnv-okd-color-container-primary: #fff;
  --oxnv-okd-color-container-secondary: #fafafa;
  --oxnv-okd-color-container-tertiary: #fff;
  --oxnv-okd-color-container-contrast: #414141;
  --oxnv-okd-color-container-inverse: #0e0e0e;
  --oxnv-okd-color-content-primary: #000;
  --oxnv-okd-color-content-secondary: #383838;
  --oxnv-okd-color-content-tertiary: #5b5b5b;
  --oxnv-okd-color-content-contrast: #909090;
  --oxnv-okd-color-content-disabled: #b3b3b3;
  --oxnv-okd-color-content-inverse: #fff;
  --oxnv-okd-color-border-primary: #e6e6e6;
  --oxnv-okd-color-border-secondary: #b3b3b3;
  --oxnv-okd-color-border-contrast: #fafafa;
  --oxnv-okd-color-border-selected: #000;
  --oxnv-okd-color-semantic-neutral: #000;
  --oxnv-okd-color-semantic-notice: #ffb117;
  --oxnv-okd-color-semantic-positive: #31bd65;
  --oxnv-okd-color-semantic-negative: #eb4b6d;
  --oxnv-okd-color-semantic-informative: #8a91ff;
  --oxnv-okd-color-semantic-highlight: #bcff2f;
  --oxnv-okd-color-dvp-neutral: rgba(0, 0, 0, .57);
  --oxnv-okd-color-dvp-profit: #00bc4b;
  --oxnv-okd-color-dvp-loss: #f5384f;
  --oxnv-okd-color-categorical-01: #8a91ff;
  --oxnv-okd-color-categorical-02: #ffb117;
  --oxnv-okd-color-categorical-03: #bcff2f;
  --oxnv-okd-color-categorical-04: #12e366;
  --oxnv-okd-color-categorical-05: #ff7888;
  --oxnv-okd-color-common-transparent: hsla(0, 0%, 100%, 0);
  --oxnv-okd-color-transparent-black: transparent;
  --oxnv-okd-color-transparent-white: transparent;
  --oxnv-okd-color-alert-info: #f7f7f7;
  --oxnv-okd-color-alert-success: #eaf8f0;
  --oxnv-okd-color-alert-warning: #fef9f6;
  --oxnv-okd-color-alert-error: #fdedf0;
  --oxnv-okd-color-common-background-2: #f3f3f3;
  --oxnv-okd-color-data-visualization-category-01: #8a91ff;
  --oxnv-okd-color-data-visualization-category-02: #ffb117;
  --oxnv-okd-color-data-visualization-category-03: #bcff2f;
  --oxnv-okd-color-data-visualization-category-04: #12e366;
  --oxnv-okd-color-data-visualization-category-05: #ff7888;
  --oxnv-okd-color-preference-loss: #f5384f;
  --oxnv-okd-color-preference-profit: #00bc4b;
  --oxnv-okd-color-preference-neutral: rgba(0, 0, 0, .57);
  --oxnv-okd-color-border-focus: #000;
  --oxnv-okd-color-background-base-primary_alternative: #fff;
  --oxnv-okd-color-link-content: #4c2fff;
  --oxnv-okd-color-link-accent-content-primary: #2b6d17;
  --oxnv-okd-color-background-surface-contrast: #fff;
  --oxnv-okd-color-background-surface-brand: #000;
  --oxnv-okd-color-border-tertiary: #f3f3f3;
  --oxnv-okd-color-content-brand: #000;
  --oxnv-okd-color-modal-primary: #fff;
  --oxnv-okd-color-modal-secondary: #fff;
  --oxnv-okd-color-modal-tertiary: #fff;
  --oxnv-okd-color-modal-contrast: #4d4d4d;
  --oxnv-okd-color-card-primary: #f6f6f6;
  --oxnv-okd-color-card-secondary: #f6f6f6;
  --oxnv-okd-color-brand-primary: #2b6d17;
  --oxnv-okd-color-brand-primary-alternative: #2b6d17;
  --oxnv-okd-color-brand-secondary: #8ec51d;
  --oxnv-okd-color-brand-tertiary: #bcff2f;
  --oxnv-okd-color-brand-content: #e6ffb0;
  --oxnv-okd-color-brand-content-contrast: #e6ffb0;
  --oxnv-okd-color-global-fixed-always-dark: #000;
  --oxnv-okd-color-global-fixed-always-light: #fff;
  --oxnv-okd-color-surface-structural-subbase: #f6f6f6;
  --oxnv-okd-color-surface-info-default: #4a4a4a;
  --oxnv-okd-color-surface-info-subtle: #f6f6f6;
  --oxnv-okd-color-surface-warning-default: #fea01d;
  --oxnv-okd-color-surface-warning-subtle: #ffedcb;
  --oxnv-okd-color-surface-success-default: #3c8f24;
  --oxnv-okd-color-surface-success-subtle: #e9f4d1;
  --oxnv-okd-color-surface-danger-default: #d33a4c;
  --oxnv-okd-color-surface-danger-subtle: #fee0e3;
  --oxnv-okd-color-surface-interactive-default: rgba(0, 0, 0, .06);
  --oxnv-okd-color-surface-interactive-hovered: rgba(0, 0, 0, .09);
  --oxnv-okd-color-surface-interactive-pressed: rgba(0, 0, 0, .14);
  --oxnv-okd-color-surface-interactive-disabled: rgba(0, 0, 0, .03);
  --oxnv-okd-color-surface-interactive-oncolor-default: hsla(0, 0%, 100%, .9);
  --oxnv-okd-color-surface-interactive-oncolor-hovered: hsla(0, 0%, 100%, .7);
  --oxnv-okd-color-surface-interactive-oncolor-pressed: hsla(0, 0%, 100%, .5);
  --oxnv-okd-color-surface-interactive-emphasis-default: rgba(0, 0, 0, .99);
  --oxnv-okd-color-surface-interactive-emphasis-hovered: rgba(0, 0, 0, .8);
  --oxnv-okd-color-surface-interactive-emphasis-pressed: rgba(0, 0, 0, .7);
  --oxnv-okd-color-surface-interactive-emphasis-disabled: rgba(0, 0, 0, .03);
  --oxnv-okd-color-surface-interactive-selected-default: #000;
  --oxnv-okd-color-surface-interactive-selected-subtle: rgba(0, 0, 0, .06);
  --oxnv-okd-color-surface-interactive-selected-oncolor: hsla(0, 0%, 100%, .9);
  --oxnv-okd-color-surface-structural-base: #fff;
  --oxnv-okd-color-surface-structural-layer-1: #f6f6f6;
  --oxnv-okd-color-surface-structural-layer-2: #e9e9e9;
  --oxnv-okd-color-surface-structural-layer-3: #dcdcdc;
  --oxnv-okd-color-surface-structural-highlight: var(--global-color-highlight);
  --oxnv-okd-color-surface-structural-inverse: #000;
  --oxnv-okd-color-surface-structural-elevated-default: #fff;
  --oxnv-okd-color-surface-structural-elevated-contrast: #fff;
  --oxnv-okd-color-surface-structural-overlay: rgba(0, 0, 0, .4);
  --oxnv-okd-color-border-static-default: rgba(0, 0, 0, .14);
  --oxnv-okd-color-border-static-subtle: rgba(0, 0, 0, .06);
  --oxnv-okd-color-border-static-dotted: rgba(0, 0, 0, .32);
  --oxnv-okd-color-border-interactive-default: rgba(0, 0, 0, .32);
  --oxnv-okd-color-border-interactive-hovered: #333;
  --oxnv-okd-color-border-interactive-pressed: #000;
  --oxnv-okd-color-border-interactive-focused: #000;
  --oxnv-okd-color-border-interactive-selected: #000;
  --oxnv-okd-color-border-interactive-error: #ba2133;
  --oxnv-okd-color-border-interactive-emphasis: #4a4a4a;
  --oxnv-okd-color-border-interactive-oncolor: #e9e9e9;
  --oxnv-okd-color-border-static-emphasis: #4a4a4a;
  --oxnv-okd-color-border-static-experience: var(--global-color-experience-default);
  --oxnv-okd-color-border-static-highlight: var(--global-color-highlight);
  --oxnv-okd-color-border-static-overlay: hsla(0, 0%, 100%, .9);
  --oxnv-okd-color-border-interactive-disabled: rgba(0, 0, 0, .14);
  --oxnv-okd-color-border-info-default: #212121;
  --oxnv-okd-color-border-info-subtle: #757575;
  --oxnv-okd-color-border-warning-default: #ba5d00;
  --oxnv-okd-color-border-warning-subtle: #ffedcb;
  --oxnv-okd-color-border-success-default: #2b6d17;
  --oxnv-okd-color-border-success-subtle: #e9f4d1;
  --oxnv-okd-color-border-danger-default: #ba2133;
  --oxnv-okd-color-border-danger-subtle: #fee0e3;
  --oxnv-okd-color-content-static-default: #000;
  --oxnv-okd-color-content-interactive-default: #4a4a4a;
  --oxnv-okd-color-content-interactive-subtle: #757575;
  --oxnv-okd-color-content-interactive-hovered: #212121;
  --oxnv-okd-color-content-static-subtle: #5e5e5e;
  --oxnv-okd-color-content-interactive-pressed: #000;
  --oxnv-okd-color-content-static-inverse: #fff;
  --oxnv-okd-color-content-static-highlight: var(--global-color-highlight);
  --oxnv-okd-color-content-static-placeholder: rgba(0, 0, 0, .22);
  --oxnv-okd-color-content-interactive-active: #000;
  --oxnv-okd-color-content-interactive-selected: #000;
  --oxnv-okd-color-content-interactive-error: #ba2133;
  --oxnv-okd-color-content-interactive-disabled: rgba(0, 0, 0, .14);
  --oxnv-okd-color-content-info-default: #212121;
  --oxnv-okd-color-content-info-subtle: #757575;
  --oxnv-okd-color-content-warning-default: #ba5d00;
  --oxnv-okd-color-content-warning-subtle: #ffedcb;
  --oxnv-okd-color-content-success-default: #2b6d17;
  --oxnv-okd-color-content-success-subtle: #e9f4d1;
  --oxnv-okd-color-content-danger-default: #ba2133;
  --oxnv-okd-color-content-danger-subtle: #fee0e3;
  --oxnv-okd-color-content-illustration-default: #000;
  --oxnv-okd-color-content-dataviz-categorical-1: var(--global-color-feature-default);
  --oxnv-okd-color-content-dataviz-categorical-2: #0b5bcb;
  --oxnv-okd-color-content-dataviz-categorical-3: #e28400;
  --oxnv-okd-color-content-dataviz-categorical-4: #dbb01d;
  --oxnv-okd-color-content-dataviz-categorical-5: #9543ff;
  --oxnv-okd-color-content-dataviz-categorical-6: #5e5e5e;
  --oxnv-okd-color-content-dataviz-categorical-7: #858585;
  --oxnv-okd-color-content-dataviz-categorical-8: #afafaf;
  --oxnv-okd-color-content-illustration-inverse: #fff;
  --oxnv-okd-color-content-illustration-experience: var(--global-color-experience-default);
  --oxnv-okd-color-content-illustration-highlight: var(--global-color-highlight);
  --oxnv-okd-color-global-alpha-matching-5: hsla(0, 0%, 100%, .05);
  --oxnv-okd-color-global-alpha-matching-10: hsla(0, 0%, 100%, .1);
  --oxnv-okd-color-global-alpha-matching-20: hsla(0, 0%, 100%, .2);
  --oxnv-okd-color-global-alpha-matching-30: hsla(0, 0%, 100%, .3);
  --oxnv-okd-color-global-alpha-matching-40: hsla(0, 0%, 100%, .4);
  --oxnv-okd-color-global-alpha-matching-50: hsla(0, 0%, 100%, .5);
  --oxnv-okd-color-global-alpha-matching-60: hsla(0, 0%, 100%, .6);
  --oxnv-okd-color-global-alpha-matching-70: hsla(0, 0%, 100%, .7);
  --oxnv-okd-color-global-alpha-matching-80: hsla(0, 0%, 100%, .8);
  --oxnv-okd-color-global-alpha-matching-90: hsla(0, 0%, 100%, .9);
  --oxnv-okd-color-global-alpha-inverse-5: rgba(0, 0, 0, .03);
  --oxnv-okd-color-global-alpha-pnl-profit: var(--global-color-profit-alpha);
  --oxnv-okd-color-global-alpha-pnl-loss: var(--global-color-loss-alpha);
  --oxnv-okd-color-global-alpha-feature-1: rgba(43, 109, 23, .16);
  --oxnv-okd-color-global-alpha-inverse-10: rgba(0, 0, 0, .06);
  --oxnv-okd-color-global-alpha-inverse-20: rgba(0, 0, 0, .14);
  --oxnv-okd-color-global-alpha-inverse-30: rgba(0, 0, 0, .22);
  --oxnv-okd-color-global-alpha-inverse-40: rgba(0, 0, 0, .32);
  --oxnv-okd-color-global-alpha-inverse-50: rgba(0, 0, 0, .44);
  --oxnv-okd-color-global-alpha-inverse-60: rgba(0, 0, 0, .57);
  --oxnv-okd-color-global-alpha-inverse-70: rgba(0, 0, 0, .7);
  --oxnv-okd-color-global-alpha-inverse-80: rgba(0, 0, 0, .8);
  --oxnv-okd-color-global-alpha-inverse-90: rgba(0, 0, 0, .9);
  --oxnv-okd-color-surface-pnl-profit-default: var(--global-color-profit-surface-default);
  --oxnv-okd-color-surface-pnl-profit-hovered: var(--global-color-profit-surface-hovered);
  --oxnv-okd-color-surface-pnl-profit-pressed: var(--global-color-profit-surface-pressed);
  --oxnv-okd-color-surface-pnl-profit-tint: var(--global-color-profit-tint);
  --oxnv-okd-color-surface-pnl-loss-default: var(--global-color-loss-surface-default);
  --oxnv-okd-color-surface-pnl-loss-hovered: var(--global-color-loss-surface-hovered);
  --oxnv-okd-color-surface-pnl-loss-pressed: var(--global-color-loss-surface-pressed);
  --oxnv-okd-color-surface-pnl-loss-tint: var(--global-color-loss-tint);
  --oxnv-okd-color-surface-pnl-neutral-default: var(--global-color-neutral-surface-default);
  --oxnv-okd-color-surface-pnl-neutral-hovered: var(--global-color-neutral-surface-hovered);
  --oxnv-okd-color-surface-pnl-neutral-pressed: var(--global-color-neutral-surface-pressed);
  --oxnv-okd-color-surface-interactive-feature-default: var(--global-color-feature-default);
  --oxnv-okd-color-surface-interactive-experience-default: var(--global-color-experience-default);
  --oxnv-okd-color-surface-interactive-experience-hovered: var(--global-color-experience-hovered);
  --oxnv-okd-color-surface-interactive-experience-pressed: var(--global-color-experience-pressed);
  --oxnv-okd-color-surface-interactive-feature-hovered: var(--global-color-feature-hovered);
  --oxnv-okd-color-surface-interactive-feature-pressed: var(--global-color-feature-pressed);
  --oxnv-okd-color-surface-pnl-loss-graph: var(--global-color-loss-graph);
  --oxnv-okd-color-surface-structural-feature: var(--global-color-feature-default);
  --oxnv-okd-color-surface-structural-experience: var(--global-color-experience-default);
  --oxnv-okd-color-border-interactive-feature-default: var(--global-color-feature-default);
  --oxnv-okd-color-border-interactive-feature-hovered: var(--global-color-feature-hovered);
  --oxnv-okd-color-border-interactive-feature-pressed: var(--global-color-feature-pressed);
  --oxnv-okd-color-border-static-feature: var(--global-color-feature-default);
  --oxnv-okd-color-content-static-subtler: #858585;
  --oxnv-okd-color-content-static-feature: var(--global-color-feature-default);
  --oxnv-okd-color-content-static-experience: var(--global-color-experience-default);
  --oxnv-okd-color-content-pnl-profit-default: var(--global-color-profit-default);
  --oxnv-okd-color-content-illustration-feature: var(--global-color-feature-default);
  --oxnv-okd-color-content-pnl-profit-oncolor: var(--global-color-profit-oncolor);
  --oxnv-okd-color-content-pnl-loss-default: var(--global-color-loss-default);
  --oxnv-okd-color-content-pnl-loss-oncolor: var(--global-color-loss-oncolor);
  --oxnv-okd-color-content-pnl-neutral-default: var(--global-color-neutral-default);
  --oxnv-okd-color-content-pnl-neutral-oncolor: var(--global-color-neutral-oncolor);
  --oxnv-okd-color-surface-pnl-profit-graph: var(--global-color-profit-graph);
  --oxnv-okd-color-surface-pnl-neutral-graph: var(--global-color-neutral-graph);
  --oxnv-okd-color-border-interactive-experience-default: var(--global-color-experience-default);
  --oxnv-okd-color-border-interactive-experience-hovered: var(--global-color-experience-hovered);
  --oxnv-okd-color-border-interactive-experience-pressed: var(--global-color-experience-pressed);
  --oxnv-okd-color-content-interactive-feature-default: var(--global-color-feature-default);
  --oxnv-okd-color-content-interactive-feature-hovered: var(--global-color-feature-hovered);
  --oxnv-okd-color-content-interactive-feature-pressed: var(--global-color-feature-pressed);
  --oxnv-okd-color-content-interactive-experience-default: var(--global-color-experience-default);
  --oxnv-okd-color-content-interactive-experience-alternative: var(--global-color-experience-alternative);
  --oxnv-okd-color-content-interactive-experience-accent: var(--global-color-experience-accent);
  --oxnv-okd-color-content-interactive-experience-hovered: var(--global-color-experience-hovered);
  --oxnv-okd-color-content-interactive-experience-pressed: var(--global-color-experience-pressed);
  --oxnv-okd-color-content-interactive-experience-inverse: var(--global-color-experience-inverse);
  --oxnv-okd-color-content-interactive-feature-inverse-default: var(--global-color-feature-primary-inverse-default);
  --oxnv-okd-color-content-interactive-feature-inverse-hovered: var(--global-color-feature-primary-inverse-hovered);
  --oxnv-okd-color-content-interactive-feature-inverse-pressed: var(--global-color-feature-primary-inverse-pressed);
  --oxnv-okd-color-surface-interactive-feature-inverse-default: var(--global-color-feature-primary-inverse-default);
  --oxnv-okd-color-surface-interactive-feature-inverse-hovered: var(--global-color-feature-primary-inverse-hovered);
  --oxnv-okd-color-surface-interactive-feature-inverse-pressed: var(--global-color-feature-primary-inverse-pressed);
  --oxnv-okd-color-border-pnl-loss-default: var(--global-color-loss-default);
  --oxnv-okd-color-border-pnl-loss-graph: var(--global-color-loss-graph);
  --oxnv-okd-color-border-pnl-profit-default: var(--global-color-profit-default);
  --oxnv-okd-color-border-pnl-profit-graph: var(--global-color-profit-graph);
  --oxnv-okd-color-border-pnl-neutral-graph: var(--global-color-neutral-graph);
  --oxnv-okd-color-content-static-notification: #e05a6a;
  --oxnv-okd-color-surface-interactive-unselected-default: rgba(0, 0, 0, .32);
  --oxnv-okd-color-surface-structural-elevated-layer-1: #f6f6f6;
  --oxnv-okd-color-surface-interactive-destructive-default: #e05a6a;
  --oxnv-okd-color-surface-interactive-destructive-hovered: #d33a4c;
  --oxnv-okd-color-surface-interactive-destructive-pressed: #ba2133;
  --oxnv-okd-color-surface-structural-web-only-base: #f6f6f6;
  --oxnv-okd-color-surface-structural-web-only-layer-1: #fff;
  --oxnv-okd-color-global-fixed-shadow: rgba(0, 0, 0, .16);
  --oxnv-okd-color-surface-interactive-destructive-subtle-default: #fee0e3;
  --oxnv-okd-color-surface-interactive-destructive-subtle-hovered: #ffbec5;
  --oxnv-okd-color-surface-interactive-destructive-subtle-pressed: #ff8f9c;
  --oxnv-okd-color-global-fixed-always-light-20: hsla(0, 0%, 100%, .2);
  --oxnv-okd-color-surface-pnl-profit-default-new: var(--global-color-profit-surface-default-new);
  --oxnv-okd-color-surface-pnl-profit-emphasis: var(--global-color-profit-surface-emphasis);
  --oxnv-okd-color-surface-pnl-loss-default-new: var(--global-color-loss-surface-default-new);
  --oxnv-okd-color-surface-pnl-loss-emphasis: var(--global-color-loss-surface-emphasis);
  --oxnv-okd-color-content-pnl-profit-oncolor-default: var(--global-color-profit-default);
  --oxnv-okd-color-content-pnl-profit-oncolor-emphasis: var(--global-color-profit-oncolor);
  --oxnv-okd-color-content-pnl-loss-oncolor-default: var(--global-color-loss-default);
  --oxnv-okd-color-content-pnl-loss-oncolor-emphasis: var(--global-color-loss-oncolor);
  --oxnv-okd-color-surface-pnl-profit-gradient-max: var(--global-color-profit-gradient-max);
  --oxnv-okd-color-surface-pnl-profit-gradient-min: var(--global-color-profit-gradient-min);
  --oxnv-okd-color-surface-pnl-loss-gradient-max: rgba(252, 70, 171, .2);
  --oxnv-okd-color-surface-pnl-loss-gradient-min: rgba(252, 70, 171, 0);
  --oxnv-okd-font-size-base: 16px;
  --oxnv-okd-font-size-md: 14px;
  --oxnv-okd-font-size-xs: 12px;
  --oxnv-okd-line-height-base: 20px;
  --oxnv-okd-line-height-md: 20px;
  --oxnv-okd-line-height-xs: 16px;
  --oxnv-okd-shadow-none: 0 0 0 0 transparent;
  --oxnv-okd-shadow-xs: 0 0 0 1px #0000000d;
  --oxnv-okd-shadow-sm: 0 1px 2px 0 #0000000d;
  --oxnv-okd-shadow-default: 0 1px 3px 0 #0000001a, 0 1px 2px 0 #0000000f;
  --oxnv-okd-shadow-md: 0 4px 6px -1px #0000001a, 0 2px 4px -1px #0000000f;
  --oxnv-okd-shadow-lg: 0 10px 15px -3px #0000001a, 0 4px 6px -2px #0000000d;
  --oxnv-okd-shadow-xl: 0 20px 25px -5px #0000001a, 0 10px 10px -5px #0000000a;
  --oxnv-okd-shadow-2xl: 0 25px 50px -12px #00000040;
  --oxnv-okd-border-radius-none: 0;
  --oxnv-okd-border-radius-sm: 2px;
  --oxnv-okd-border-radius-md: 4px;
  --oxnv-okd-border-radius-lg: 6px;
  --oxnv-okd-border-radius-xl: 8px;
  --oxnv-okd-border-radius-xxl: 10px;
  --oxnv-okd-border-radius-xxxl: 12px;
  --oxnv-okd-font-family: HarmonyOS Sans, SF Pro Text, SF Pro Icons, Arial, Helvetica Neue, Helvetica, sans-serif;
  --oxnv-okd-text-display-lg-font-size: 56px;
  --oxnv-okd-text-display-lg-font-weight: 500;
  --oxnv-okd-text-display-lg-line-height: 1.32;
  --oxnv-okd-text-display-md-font-size: 40px;
  --oxnv-okd-text-display-md-font-weight: 500;
  --oxnv-okd-text-display-md-line-height: 52px;
  --oxnv-okd-text-display-sm-font-size: 40px;
  --oxnv-okd-text-display-sm-font-weight: 500;
  --oxnv-okd-text-display-sm-line-height: 52px;
  --oxnv-okd-text-heading-lg-font-size: 30px;
  --oxnv-okd-text-heading-lg-font-weight: 500;
  --oxnv-okd-text-heading-lg-line-height: 40px;
  --oxnv-okd-text-heading-md-font-size: 24px;
  --oxnv-okd-text-heading-md-font-weight: 500;
  --oxnv-okd-text-heading-md-line-height: 30px;
  --oxnv-okd-text-heading-sm-font-size: 18px;
  --oxnv-okd-text-heading-sm-font-weight: 500;
  --oxnv-okd-text-heading-sm-line-height: 24px;
  --oxnv-okd-text-heading-xl-font-size: 36px;
  --oxnv-okd-text-heading-xl-line-height: 1.32;
  --oxnv-okd-text-heading-xl-font-weight: 600;
  --oxnv-okd-text-heading-xxl-font-size: 40px;
  --oxnv-okd-text-heading-xxl-line-height: 1.32;
  --oxnv-okd-text-heading-xxl-font-weight: 600;
  --oxnv-okd-text-heading-overline-font-size: 12px;
  --oxnv-okd-text-heading-overline-line-height: 15px;
  --oxnv-okd-text-heading-overline-font-weight: 500;
  --oxnv-okd-text-body-sm-regular-font-size: 14px;
  --oxnv-okd-text-body-sm-regular-font-weight: 400;
  --oxnv-okd-text-body-sm-regular-line-height: 21px;
  --oxnv-okd-text-body-sm-bold-font-size: 14px;
  --oxnv-okd-text-body-sm-bold-font-weight: 500;
  --oxnv-okd-text-body-sm-bold-line-height: 21px;
  --oxnv-okd-text-body-md-regular-font-size: 16px;
  --oxnv-okd-text-body-md-regular-font-weight: 400;
  --oxnv-okd-text-body-md-regular-line-height: 24px;
  --oxnv-okd-text-body-md-bold-font-size: 16px;
  --oxnv-okd-text-body-md-bold-font-weight: 500;
  --oxnv-okd-text-body-md-bold-line-height: 24px;
  --oxnv-okd-text-body-xs-regular-font-size: 12px;
  --oxnv-okd-text-body-xs-regular-font-weight: 400;
  --oxnv-okd-text-body-xs-regular-line-height: 18px;
  --oxnv-okd-text-body-xs-bold-font-size: 12px;
  --oxnv-okd-text-body-xs-bold-font-weight: 500;
  --oxnv-okd-text-body-xs-bold-line-height: 18px;
  --oxnv-okd-font-weight-400: 400;
  --oxnv-okd-font-weight-500: 500;
  --oxnv-okd-font-weight-600: 600;
  --oxnv-okd-font-weight-700: 700;
  --oxnv-okd-font-weight-800: 800;
  --oxnv-okd-font-weight-900: 900;
  --oxnv-okd-font-weight-regular: 400;
  --oxnv-okd-font-weight-medium: 500;
  --oxnv-okd-font-weight-bold: 700
}

.theme-dark {
  --oxnv-okd-color-gray-050: #000;
  --oxnv-okd-color-gray-100: #2e2e2e;
  --oxnv-okd-color-gray-200: #404040;
  --oxnv-okd-color-gray-300: #6c6c6c;
  --oxnv-okd-color-gray-400: #909090;
  --oxnv-okd-color-gray-500: #b0b0b0;
  --oxnv-okd-color-gray-600: #ccc;
  --oxnv-okd-color-gray-700: #e3e3e3;
  --oxnv-okd-color-gray-800: #f0f0f0;
  --oxnv-okd-color-gray-900: #fafafa;
  --oxnv-okd-color-blue-050: #051738;
  --oxnv-okd-color-blue-100: #082356;
  --oxnv-okd-color-blue-200: #0c3178;
  --oxnv-okd-color-blue-300: #0f3c94;
  --oxnv-okd-color-blue-400: #1148b0;
  --oxnv-okd-color-blue-500: #1453cc;
  --oxnv-okd-color-blue-600: #175fe8;
  --oxnv-okd-color-blue-700: #1e6bff;
  --oxnv-okd-color-blue-800: #3077ff;
  --oxnv-okd-color-blue-900: #4283ff;
  --oxnv-okd-color-green-050: #002b1f;
  --oxnv-okd-color-green-100: #062b12;
  --oxnv-okd-color-green-200: #0c5625;
  --oxnv-okd-color-green-300: #138037;
  --oxnv-okd-color-green-400: #19ab4a;
  --oxnv-okd-color-green-500: #25a750;
  --oxnv-okd-color-green-600: #4cde7d;
  --oxnv-okd-color-green-700: #79e69d;
  --oxnv-okd-color-green-800: #a5efbe;
  --oxnv-okd-color-green-900: #d2f7de;
  --oxnv-okd-color-red-050: #270b12;
  --oxnv-okd-color-red-100: #300e17;
  --oxnv-okd-color-red-200: #601d2e;
  --oxnv-okd-color-red-300: #902b44;
  --oxnv-okd-color-red-400: #c03a5b;
  --oxnv-okd-color-red-500: #f04872;
  --oxnv-okd-color-red-600: #f76489;
  --oxnv-okd-color-red-700: #f994ae;
  --oxnv-okd-color-red-800: #f9b6c7;
  --oxnv-okd-color-red-900: #fff8f9;
  --oxnv-okd-color-orange-050: #361604;
  --oxnv-okd-color-orange-100: #532206;
  --oxnv-okd-color-orange-200: #743008;
  --oxnv-okd-color-orange-300: #8f3b0a;
  --oxnv-okd-color-orange-400: #aa460c;
  --oxnv-okd-color-orange-500: #c5510e;
  --oxnv-okd-color-orange-600: #e15c0f;
  --oxnv-okd-color-orange-700: #f76816;
  --oxnv-okd-color-orange-800: #f87428;
  --oxnv-okd-color-orange-900: #fa8c4d;
  --oxnv-okd-color-yellow-050: #2d2104;
  --oxnv-okd-color-yellow-100: #493603;
  --oxnv-okd-color-yellow-200: #674b04;
  --oxnv-okd-color-yellow-300: #7f5d05;
  --oxnv-okd-color-yellow-400: #966e06;
  --oxnv-okd-color-yellow-500: #ae8007;
  --oxnv-okd-color-yellow-600: #c69208;
  --oxnv-okd-color-yellow-700: #dba20e;
  --oxnv-okd-color-yellow-800: #dea921;
  --oxnv-okd-color-yellow-900: #e0b134;
  --oxnv-okd-color-text-white: #fff;
  --oxnv-okd-color-text-black: #1f2933;
  --oxnv-okd-color-background-1: #121212;
  --oxnv-okd-color-background-2: #1a1a1a;
  --oxnv-okd-color-transparent: transparent;
  --oxnv-okd-color-white: #fff;
  --oxnv-okd-color-black: #000;
  --oxnv-okd-color-line-muted: #2e2e2e;
  --oxnv-okd-color-line-amplifed: #6c6c6c;
  --oxnv-okd-color-line-secondary: #404040;
  --oxnv-okd-color-text-lighter: #6c6c6c;
  --oxnv-okd-color-text-light: #909090;
  --oxnv-okd-color-text-secondary: #e3e3e3;
  --oxnv-okd-color-text-amplifed: #fafafa;
  --oxnv-okd-color-background-3: #242424;
  --oxnv-okd-color-fq-blue-lv1: #3077ff;
  --oxnv-okd-color-fq-blue-lv2: #1e6bff;
  --oxnv-okd-color-fq-green-lv1: #1fd65c;
  --oxnv-okd-color-fq-red-lv1: #f04872;
  --oxnv-okd-color-fq-orange-lv1: #f76816;
  --oxnv-okd-color-prefer-red-chart: #f04872;
  --oxnv-okd-color-prefer-red-bg: #ca3f64;
  --oxnv-okd-color-prefer-green-chart: #1fd65c;
  --oxnv-okd-color-prefer-green-bg: #25a750;
  --oxnv-okd-color-prefer-red-text: #ca3f64;
  --oxnv-okd-color-prefer-green-text: #25a750;
  --oxnv-okd-color-branded-primary: #bcff2f;
  --oxnv-okd-color-fq-critical: #f04872;
  --oxnv-okd-color-fq-positive: #25a750;
  --oxnv-okd-color-fq-warning: #f76816;
  --oxnv-okd-color-fq-accent: #1e6bff;
  --oxnv-okd-color-fq-neutral: #fafafa;
  --oxnv-okd-color-prefer-neutral-bg: #909090;
  --oxnv-okd-color-prefer-neutral-text: #909090;
  --oxnv-okd-color-background-base-primary: #000;
  --oxnv-okd-color-background-base-secondary: #121212;
  --oxnv-okd-color-background-surface-primary: #1d1d1d;
  --oxnv-okd-color-background-surface-secondary: #121212;
  --oxnv-okd-color-background-surface-pressed: #383838;
  --oxnv-okd-color-background-surface-disable: #0e0e0e;
  --oxnv-okd-color-background-scrim: rgba(0, 0, 0, .68);
  --oxnv-okd-color-container-primary: #272727;
  --oxnv-okd-color-container-secondary: #272727;
  --oxnv-okd-color-container-tertiary: #383838;
  --oxnv-okd-color-container-contrast: #414141;
  --oxnv-okd-color-container-inverse: #fafafa;
  --oxnv-okd-color-content-primary: #fff;
  --oxnv-okd-color-content-secondary: #e6e6e6;
  --oxnv-okd-color-content-tertiary: #b3b3b3;
  --oxnv-okd-color-content-contrast: #909090;
  --oxnv-okd-color-content-disabled: #5b5b5b;
  --oxnv-okd-color-content-inverse: #000;
  --oxnv-okd-color-border-primary: #383838;
  --oxnv-okd-color-border-secondary: #4d4d4d;
  --oxnv-okd-color-border-contrast: #000;
  --oxnv-okd-color-border-selected: #fff;
  --oxnv-okd-color-semantic-neutral: #fff;
  --oxnv-okd-color-semantic-notice: #ffb117;
  --oxnv-okd-color-semantic-positive: #25a750;
  --oxnv-okd-color-semantic-negative: #ca3f64;
  --oxnv-okd-color-semantic-informative: #8a91ff;
  --oxnv-okd-color-semantic-highlight: #bcff2f;
  --oxnv-okd-color-dvp-neutral: hsla(0, 0%, 100%, .76);
  --oxnv-okd-color-dvp-profit: #25a750;
  --oxnv-okd-color-dvp-loss: #ca3f64;
  --oxnv-okd-color-categorical-01: #5f62ff;
  --oxnv-okd-color-categorical-02: #ffb117;
  --oxnv-okd-color-categorical-03: #bcff2f;
  --oxnv-okd-color-categorical-04: #00bc4b;
  --oxnv-okd-color-categorical-05: #f5384f;
  --oxnv-okd-color-transparent-white: transparent;
  --oxnv-okd-color-transparent-black: hsla(0, 0%, 100%, .02);
  --oxnv-okd-color-common-transparent: hsla(0, 0%, 100%, 0);
  --oxnv-okd-color-container-lv2: #1a1a1a;
  --oxnv-okd-color-alert-info: #2e2e2e;
  --oxnv-okd-color-alert-success: #002b1f;
  --oxnv-okd-color-alert-warning: #361604;
  --oxnv-okd-color-alert-error: #270b12;
  --oxnv-okd-color-common-background-2: #383838;
  --oxnv-okd-color-data-visualization-category-01: #5f62ff;
  --oxnv-okd-color-data-visualization-category-02: #ffb117;
  --oxnv-okd-color-data-visualization-category-03: #bcff2f;
  --oxnv-okd-color-data-visualization-category-04: #00bc4b;
  --oxnv-okd-color-data-visualization-category-05: #f5384f;
  --oxnv-okd-color-preference-loss: #ca3f64;
  --oxnv-okd-color-preference-profit: #25a750;
  --oxnv-okd-color-preference-neutral: hsla(0, 0%, 100%, .76);
  --oxnv-okd-color-border-focus: #fff;
  --oxnv-okd-color-background-base-primary_alternative: #000;
  --oxnv-okd-color-link-content: #8a91ff;
  --oxnv-okd-color-link-accent-content-primary: #bcff2f;
  --oxnv-okd-color-background-surface-contrast: #272727;
  --oxnv-okd-color-background-surface-brand: #bcff2f;
  --oxnv-okd-color-border-tertiary: #0e0e0e;
  --oxnv-okd-color-content-brand: #bcff2f;
  --oxnv-okd-color-modal-primary: #0e0e0e;
  --oxnv-okd-color-modal-secondary: #272727;
  --oxnv-okd-color-modal-tertiary: #383838;
  --oxnv-okd-color-modal-contrast: #4d4d4d;
  --oxnv-okd-color-card-primary: #0e0e0e;
  --oxnv-okd-color-card-secondary: #121212;
  --oxnv-okd-color-brand-primary: #121212;
  --oxnv-okd-color-brand-primary-alternative: #bcff2f;
  --oxnv-okd-color-brand-secondary: #272727;
  --oxnv-okd-color-brand-tertiary: #383838;
  --oxnv-okd-color-brand-content: #e6ffb0;
  --oxnv-okd-color-brand-content-contrast: #000;
  --oxnv-okd-color-global-fixed-always-dark: #000;
  --oxnv-okd-color-global-fixed-always-light: #fff;
  --oxnv-okd-color-surface-structural-subbase: #121212;
  --oxnv-okd-color-surface-info-default: #b8b8b8;
  --oxnv-okd-color-surface-info-subtle: #121212;
  --oxnv-okd-color-surface-warning-default: #f5a915;
  --oxnv-okd-color-surface-warning-subtle: #4d3200;
  --oxnv-okd-color-surface-success-default: #3c8f24;
  --oxnv-okd-color-surface-success-subtle: #192400;
  --oxnv-okd-color-surface-danger-default: #ff5d73;
  --oxnv-okd-color-surface-danger-subtle: #420a10;
  --oxnv-okd-color-surface-interactive-default: hsla(0, 0%, 100%, .13);
  --oxnv-okd-color-surface-interactive-hovered: hsla(0, 0%, 100%, .16);
  --oxnv-okd-color-surface-interactive-pressed: hsla(0, 0%, 100%, .22);
  --oxnv-okd-color-surface-interactive-disabled: hsla(0, 0%, 100%, .08);
  --oxnv-okd-color-surface-interactive-oncolor-default: hsla(0, 0%, 100%, .1);
  --oxnv-okd-color-surface-interactive-oncolor-hovered: hsla(0, 0%, 100%, .15);
  --oxnv-okd-color-surface-interactive-oncolor-pressed: hsla(0, 0%, 100%, .2);
  --oxnv-okd-color-surface-interactive-emphasis-default: hsla(0, 0%, 100%, .99);
  --oxnv-okd-color-surface-interactive-emphasis-hovered: hsla(0, 0%, 100%, .8);
  --oxnv-okd-color-surface-interactive-emphasis-pressed: hsla(0, 0%, 100%, .7);
  --oxnv-okd-color-surface-interactive-emphasis-disabled: hsla(0, 0%, 100%, .08);
  --oxnv-okd-color-surface-interactive-selected-default: #fff;
  --oxnv-okd-color-surface-interactive-selected-subtle: hsla(0, 0%, 100%, .13);
  --oxnv-okd-color-surface-interactive-selected-oncolor: hsla(0, 0%, 100%, .1);
  --oxnv-okd-color-surface-structural-base: #000;
  --oxnv-okd-color-surface-structural-layer-1: #121212;
  --oxnv-okd-color-surface-structural-layer-2: #2c2c2c;
  --oxnv-okd-color-surface-structural-layer-3: #3f3f3f;
  --oxnv-okd-color-surface-structural-highlight: var(--global-color-highlight);
  --oxnv-okd-color-surface-structural-inverse: #fff;
  --oxnv-okd-color-surface-structural-elevated-default: #171717;
  --oxnv-okd-color-surface-structural-elevated-contrast: #343434;
  --oxnv-okd-color-surface-structural-overlay: rgba(0, 0, 0, .6);
  --oxnv-okd-color-border-static-default: hsla(0, 0%, 100%, .22);
  --oxnv-okd-color-border-static-subtle: hsla(0, 0%, 100%, .13);
  --oxnv-okd-color-border-static-dotted: hsla(0, 0%, 100%, .4);
  --oxnv-okd-color-border-interactive-default: hsla(0, 0%, 100%, .4);
  --oxnv-okd-color-border-interactive-hovered: #cfcfcf;
  --oxnv-okd-color-border-interactive-pressed: #fff;
  --oxnv-okd-color-border-interactive-focused: #fff;
  --oxnv-okd-color-border-interactive-selected: #fff;
  --oxnv-okd-color-border-interactive-error: #f57a8a;
  --oxnv-okd-color-border-interactive-emphasis: #b8b8b8;
  --oxnv-okd-color-border-interactive-oncolor: #2c2c2c;
  --oxnv-okd-color-border-static-emphasis: #b8b8b8;
  --oxnv-okd-color-border-static-experience: var(--global-color-experience-default);
  --oxnv-okd-color-border-static-highlight: var(--global-color-highlight);
  --oxnv-okd-color-border-static-overlay: hsla(0, 0%, 100%, .1);
  --oxnv-okd-color-border-interactive-disabled: hsla(0, 0%, 100%, .22);
  --oxnv-okd-color-border-info-default: #ebebeb;
  --oxnv-okd-color-border-info-subtle: #7d7d7d;
  --oxnv-okd-color-border-warning-default: #ffc452;
  --oxnv-okd-color-border-warning-subtle: #4d3200;
  --oxnv-okd-color-border-success-default: #49a92d;
  --oxnv-okd-color-border-success-subtle: #192400;
  --oxnv-okd-color-border-danger-default: #f57a8a;
  --oxnv-okd-color-border-danger-subtle: #420a10;
  --oxnv-okd-color-content-static-default: #fff;
  --oxnv-okd-color-content-interactive-default: #b8b8b8;
  --oxnv-okd-color-content-interactive-subtle: #7d7d7d;
  --oxnv-okd-color-content-interactive-hovered: #ebebeb;
  --oxnv-okd-color-content-static-subtle: #969696;
  --oxnv-okd-color-content-interactive-pressed: #fff;
  --oxnv-okd-color-content-static-inverse: #000;
  --oxnv-okd-color-content-static-highlight: var(--global-color-highlight);
  --oxnv-okd-color-content-static-placeholder: hsla(0, 0%, 100%, .3);
  --oxnv-okd-color-content-interactive-active: #fff;
  --oxnv-okd-color-content-interactive-selected: #fff;
  --oxnv-okd-color-content-interactive-error: #f57a8a;
  --oxnv-okd-color-content-interactive-disabled: hsla(0, 0%, 100%, .22);
  --oxnv-okd-color-content-info-default: #ebebeb;
  --oxnv-okd-color-content-info-subtle: #7d7d7d;
  --oxnv-okd-color-content-warning-default: #ffc452;
  --oxnv-okd-color-content-warning-subtle: #4d3200;
  --oxnv-okd-color-content-success-default: #49a92d;
  --oxnv-okd-color-content-success-subtle: #192400;
  --oxnv-okd-color-content-danger-default: #f57a8a;
  --oxnv-okd-color-content-danger-subtle: #420a10;
  --oxnv-okd-color-content-illustration-default: #fff;
  --oxnv-okd-color-content-dataviz-categorical-1: var(--global-color-feature-default);
  --oxnv-okd-color-content-dataviz-categorical-2: #277ae7;
  --oxnv-okd-color-content-dataviz-categorical-3: #ffb729;
  --oxnv-okd-color-content-dataviz-categorical-4: #edc746;
  --oxnv-okd-color-content-dataviz-categorical-5: #ac6cff;
  --oxnv-okd-color-content-dataviz-categorical-6: #969696;
  --oxnv-okd-color-content-dataviz-categorical-7: #636363;
  --oxnv-okd-color-content-dataviz-categorical-8: #454545;
  --oxnv-okd-color-content-illustration-inverse: #000;
  --oxnv-okd-color-content-illustration-experience: var(--global-color-experience-default);
  --oxnv-okd-color-content-illustration-highlight: var(--global-color-highlight);
  --oxnv-okd-color-global-alpha-matching-5: rgba(0, 0, 0, .05);
  --oxnv-okd-color-global-alpha-matching-10: rgba(0, 0, 0, .1);
  --oxnv-okd-color-global-alpha-matching-20: rgba(0, 0, 0, .2);
  --oxnv-okd-color-global-alpha-matching-30: rgba(0, 0, 0, .3);
  --oxnv-okd-color-global-alpha-matching-40: rgba(0, 0, 0, .4);
  --oxnv-okd-color-global-alpha-matching-50: rgba(0, 0, 0, .5);
  --oxnv-okd-color-global-alpha-matching-60: rgba(0, 0, 0, .6);
  --oxnv-okd-color-global-alpha-matching-70: rgba(0, 0, 0, .7);
  --oxnv-okd-color-global-alpha-matching-80: rgba(0, 0, 0, .8);
  --oxnv-okd-color-global-alpha-matching-90: rgba(0, 0, 0, .9);
  --oxnv-okd-color-global-alpha-inverse-5: hsla(0, 0%, 100%, .08);
  --oxnv-okd-color-global-alpha-pnl-profit: var(--global-color-profit-alpha);
  --oxnv-okd-color-global-alpha-pnl-loss: var(--global-color-loss-alpha);
  --oxnv-okd-color-global-alpha-feature-1: rgba(188, 255, 47, .16);
  --oxnv-okd-color-global-alpha-inverse-10: hsla(0, 0%, 100%, .13);
  --oxnv-okd-color-global-alpha-inverse-20: hsla(0, 0%, 100%, .22);
  --oxnv-okd-color-global-alpha-inverse-30: hsla(0, 0%, 100%, .3);
  --oxnv-okd-color-global-alpha-inverse-40: hsla(0, 0%, 100%, .4);
  --oxnv-okd-color-global-alpha-inverse-50: hsla(0, 0%, 100%, .5);
  --oxnv-okd-color-global-alpha-inverse-60: hsla(0, 0%, 100%, .6);
  --oxnv-okd-color-global-alpha-inverse-70: hsla(0, 0%, 100%, .7);
  --oxnv-okd-color-global-alpha-inverse-80: hsla(0, 0%, 100%, .8);
  --oxnv-okd-color-global-alpha-inverse-90: hsla(0, 0%, 100%, .9);
  --oxnv-okd-color-surface-pnl-profit-default: var(--global-color-profit-surface-default);
  --oxnv-okd-color-surface-pnl-profit-hovered: var(--global-color-profit-surface-hovered);
  --oxnv-okd-color-surface-pnl-profit-pressed: var(--global-color-profit-surface-pressed);
  --oxnv-okd-color-surface-pnl-profit-tint: var(--global-color-profit-tint);
  --oxnv-okd-color-surface-pnl-loss-default: var(--global-color-loss-surface-default);
  --oxnv-okd-color-surface-pnl-loss-hovered: var(--global-color-loss-surface-hovered);
  --oxnv-okd-color-surface-pnl-loss-pressed: var(--global-color-loss-surface-pressed);
  --oxnv-okd-color-surface-pnl-loss-tint: var(--global-color-loss-tint);
  --oxnv-okd-color-surface-pnl-neutral-default: var(--global-color-neutral-surface-default);
  --oxnv-okd-color-surface-pnl-neutral-hovered: var(--global-color-neutral-surface-hovered);
  --oxnv-okd-color-surface-pnl-neutral-pressed: var(--global-color-neutral-surface-pressed);
  --oxnv-okd-color-surface-interactive-feature-default: var(--global-color-feature-default);
  --oxnv-okd-color-surface-interactive-experience-default: var(--global-color-experience-default);
  --oxnv-okd-color-surface-interactive-experience-hovered: var(--global-color-experience-hovered);
  --oxnv-okd-color-surface-interactive-experience-pressed: var(--global-color-experience-pressed);
  --oxnv-okd-color-surface-interactive-feature-hovered: var(--global-color-feature-hovered);
  --oxnv-okd-color-surface-interactive-feature-pressed: var(--global-color-feature-pressed);
  --oxnv-okd-color-surface-pnl-loss-graph: var(--global-color-loss-graph);
  --oxnv-okd-color-surface-structural-feature: var(--global-color-feature-default);
  --oxnv-okd-color-surface-structural-experience: var(--global-color-experience-default);
  --oxnv-okd-color-border-interactive-feature-default: var(--global-color-feature-default);
  --oxnv-okd-color-border-interactive-feature-hovered: var(--global-color-feature-hovered);
  --oxnv-okd-color-border-interactive-feature-pressed: var(--global-color-feature-pressed);
  --oxnv-okd-color-border-static-feature: var(--global-color-feature-default);
  --oxnv-okd-color-content-static-subtler: #636363;
  --oxnv-okd-color-content-static-feature: var(--global-color-feature-default);
  --oxnv-okd-color-content-static-experience: var(--global-color-experience-default);
  --oxnv-okd-color-content-pnl-profit-default: var(--global-color-profit-default);
  --oxnv-okd-color-content-illustration-feature: var(--global-color-feature-default);
  --oxnv-okd-color-content-pnl-profit-oncolor: var(--global-color-profit-oncolor);
  --oxnv-okd-color-content-pnl-loss-default: var(--global-color-loss-default);
  --oxnv-okd-color-content-pnl-loss-oncolor: var(--global-color-loss-oncolor);
  --oxnv-okd-color-content-pnl-neutral-default: var(--global-color-neutral-default);
  --oxnv-okd-color-content-pnl-neutral-oncolor: var(--global-color-neutral-oncolor);
  --oxnv-okd-color-surface-pnl-profit-graph: var(--global-color-profit-graph);
  --oxnv-okd-color-surface-pnl-neutral-graph: var(--global-color-neutral-graph);
  --oxnv-okd-color-border-interactive-experience-default: var(--global-color-experience-default);
  --oxnv-okd-color-border-interactive-experience-hovered: var(--global-color-experience-hovered);
  --oxnv-okd-color-border-interactive-experience-pressed: var(--global-color-experience-pressed);
  --oxnv-okd-color-content-interactive-feature-default: var(--global-color-feature-default);
  --oxnv-okd-color-content-interactive-feature-hovered: var(--global-color-feature-hovered);
  --oxnv-okd-color-content-interactive-feature-pressed: var(--global-color-feature-pressed);
  --oxnv-okd-color-content-interactive-experience-default: var(--global-color-experience-default);
  --oxnv-okd-color-content-interactive-experience-alternative: var(--global-color-experience-alternative);
  --oxnv-okd-color-content-interactive-experience-accent: var(--global-color-experience-accent);
  --oxnv-okd-color-content-interactive-experience-hovered: var(--global-color-experience-hovered);
  --oxnv-okd-color-content-interactive-experience-pressed: var(--global-color-experience-pressed);
  --oxnv-okd-color-content-interactive-experience-inverse: var(--global-color-experience-inverse);
  --oxnv-okd-color-content-interactive-feature-inverse-default: var(--global-color-feature-primary-inverse-default);
  --oxnv-okd-color-content-interactive-feature-inverse-hovered: var(--global-color-feature-primary-inverse-hovered);
  --oxnv-okd-color-content-interactive-feature-inverse-pressed: var(--global-color-feature-primary-inverse-pressed);
  --oxnv-okd-color-surface-interactive-feature-inverse-default: var(--global-color-feature-primary-inverse-default);
  --oxnv-okd-color-surface-interactive-feature-inverse-hovered: var(--global-color-feature-primary-inverse-hovered);
  --oxnv-okd-color-surface-interactive-feature-inverse-pressed: var(--global-color-feature-primary-inverse-pressed);
  --oxnv-okd-color-border-pnl-loss-default: var(--global-color-loss-default);
  --oxnv-okd-color-border-pnl-loss-graph: var(--global-color-loss-graph);
  --oxnv-okd-color-border-pnl-profit-default: var(--global-color-profit-default);
  --oxnv-okd-color-border-pnl-profit-graph: var(--global-color-profit-graph);
  --oxnv-okd-color-border-pnl-neutral-graph: var(--global-color-neutral-graph);
  --oxnv-okd-color-content-static-notification: #f5384f;
  --oxnv-okd-color-surface-interactive-unselected-default: hsla(0, 0%, 100%, .4);
  --oxnv-okd-color-surface-structural-elevated-layer-1: #2c2c2c;
  --oxnv-okd-color-surface-interactive-destructive-default: #f5384f;
  --oxnv-okd-color-surface-interactive-destructive-hovered: #ff5d73;
  --oxnv-okd-color-surface-interactive-destructive-pressed: #f57a8a;
  --oxnv-okd-color-surface-structural-web-only-base: #000;
  --oxnv-okd-color-surface-structural-web-only-layer-1: #121212;
  --oxnv-okd-color-global-fixed-shadow: rgba(0, 0, 0, .16);
  --oxnv-okd-color-surface-interactive-destructive-subtle-default: #420a10;
  --oxnv-okd-color-surface-interactive-destructive-subtle-hovered: #840916;
  --oxnv-okd-color-surface-interactive-destructive-subtle-pressed: #c8142a;
  --oxnv-okd-color-global-fixed-always-light-20: hsla(0, 0%, 100%, .2);
  --oxnv-okd-color-surface-pnl-profit-default-new: var(--global-color-profit-surface-default-new);
  --oxnv-okd-color-surface-pnl-profit-emphasis: var(--global-color-profit-surface-emphasis);
  --oxnv-okd-color-surface-pnl-loss-default-new: var(--global-color-loss-surface-default-new);
  --oxnv-okd-color-surface-pnl-loss-emphasis: var(--global-color-loss-surface-emphasis);
  --oxnv-okd-color-content-pnl-profit-oncolor-default: var(--global-color-profit-default);
  --oxnv-okd-color-content-pnl-profit-oncolor-emphasis: var(--global-color-profit-oncolor);
  --oxnv-okd-color-content-pnl-loss-oncolor-default: var(--global-color-loss-default);
  --oxnv-okd-color-content-pnl-loss-oncolor-emphasis: var(--global-color-loss-oncolor);
  --oxnv-okd-color-surface-pnl-profit-gradient-max: var(--global-color-profit-gradient-max);
  --oxnv-okd-color-surface-pnl-profit-gradient-min: var(--global-color-profit-gradient-min);
  --oxnv-okd-color-surface-pnl-loss-gradient-max: rgba(252, 70, 171, .2);
  --oxnv-okd-color-surface-pnl-loss-gradient-min: rgba(252, 70, 171, 0);
  --oxnv-okd-font-size-base: 16px;
  --oxnv-okd-font-size-md: 14px;
  --oxnv-okd-font-size-xs: 12px;
  --oxnv-okd-line-height-base: 20px;
  --oxnv-okd-line-height-md: 20px;
  --oxnv-okd-line-height-xs: 16px;
  --oxnv-okd-shadow-none: 0 0 0 0 transparent;
  --oxnv-okd-shadow-xs: 0 0 0 1px #0000000d;
  --oxnv-okd-shadow-sm: 0 1px 2px 0 #0000000d;
  --oxnv-okd-shadow-default: 0 1px 3px 0 #0000001a, 0 1px 2px 0 #0000000f;
  --oxnv-okd-shadow-md: 0 4px 6px -1px #0000001a, 0 2px 4px -1px #0000000f;
  --oxnv-okd-shadow-lg: 0 10px 15px -3px #0000001a, 0 4px 6px -2px #0000000d;
  --oxnv-okd-shadow-xl: 0 20px 25px -5px #0000001a, 0 10px 10px -5px #0000000a;
  --oxnv-okd-shadow-2xl: 0 25px 50px -12px #00000040;
  --oxnv-okd-border-radius-none: 0;
  --oxnv-okd-border-radius-sm: 2px;
  --oxnv-okd-border-radius-md: 4px;
  --oxnv-okd-border-radius-lg: 6px;
  --oxnv-okd-border-radius-xl: 8px;
  --oxnv-okd-border-radius-xxl: 10px;
  --oxnv-okd-border-radius-xxxl: 12px;
  --oxnv-okd-font-family: HarmonyOS Sans, SF Pro Text, SF Pro Icons, Arial, Helvetica Neue, Helvetica, sans-serif;
  --oxnv-okd-text-display-lg-font-size: 56px;
  --oxnv-okd-text-display-lg-font-weight: 500;
  --oxnv-okd-text-display-lg-line-height: 1.32;
  --oxnv-okd-text-display-md-font-size: 40px;
  --oxnv-okd-text-display-md-font-weight: 500;
  --oxnv-okd-text-display-md-line-height: 52px;
  --oxnv-okd-text-display-sm-font-size: 40px;
  --oxnv-okd-text-display-sm-font-weight: 500;
  --oxnv-okd-text-display-sm-line-height: 52px;
  --oxnv-okd-text-heading-lg-font-size: 30px;
  --oxnv-okd-text-heading-lg-font-weight: 500;
  --oxnv-okd-text-heading-lg-line-height: 40px;
  --oxnv-okd-text-heading-md-font-size: 24px;
  --oxnv-okd-text-heading-md-font-weight: 500;
  --oxnv-okd-text-heading-md-line-height: 30px;
  --oxnv-okd-text-heading-sm-font-size: 18px;
  --oxnv-okd-text-heading-sm-font-weight: 500;
  --oxnv-okd-text-heading-sm-line-height: 24px;
  --oxnv-okd-text-heading-xl-font-size: 36px;
  --oxnv-okd-text-heading-xl-line-height: 1.32;
  --oxnv-okd-text-heading-xl-font-weight: 600;
  --oxnv-okd-text-heading-xxl-font-size: 40px;
  --oxnv-okd-text-heading-xxl-line-height: 1.32;
  --oxnv-okd-text-heading-xxl-font-weight: 600;
  --oxnv-okd-text-heading-overline-font-size: 12px;
  --oxnv-okd-text-heading-overline-line-height: 15px;
  --oxnv-okd-text-heading-overline-font-weight: 500;
  --oxnv-okd-text-body-sm-regular-font-size: 14px;
  --oxnv-okd-text-body-sm-regular-font-weight: 400;
  --oxnv-okd-text-body-sm-regular-line-height: 21px;
  --oxnv-okd-text-body-sm-bold-font-size: 14px;
  --oxnv-okd-text-body-sm-bold-font-weight: 500;
  --oxnv-okd-text-body-sm-bold-line-height: 21px;
  --oxnv-okd-text-body-md-regular-font-size: 16px;
  --oxnv-okd-text-body-md-regular-font-weight: 400;
  --oxnv-okd-text-body-md-regular-line-height: 24px;
  --oxnv-okd-text-body-md-bold-font-size: 16px;
  --oxnv-okd-text-body-md-bold-font-weight: 500;
  --oxnv-okd-text-body-md-bold-line-height: 24px;
  --oxnv-okd-text-body-xs-regular-font-size: 12px;
  --oxnv-okd-text-body-xs-regular-font-weight: 400;
  --oxnv-okd-text-body-xs-regular-line-height: 18px;
  --oxnv-okd-text-body-xs-bold-font-size: 12px;
  --oxnv-okd-text-body-xs-bold-font-weight: 500;
  --oxnv-okd-text-body-xs-bold-line-height: 18px;
  --oxnv-okd-font-weight-400: 400;
  --oxnv-okd-font-weight-500: 500;
  --oxnv-okd-font-weight-600: 600;
  --oxnv-okd-font-weight-700: 700;
  --oxnv-okd-font-weight-800: 800;
  --oxnv-okd-font-weight-900: 900;
  --oxnv-okd-font-weight-regular: 400;
  --oxnv-okd-font-weight-medium: 500;
  --oxnv-okd-font-weight-bold: 700
}

.oxnv-a11y-button:focus-visible {
  border-radius: 4px;
  outline: 2px solid var(--oxnv-okd-color-border-focus);
  outline-color: var(--oxnv-okd-color-border-focus);
  outline-offset: 2px;
  outline-style: solid;
  outline-width: 2px
}

.oxnv-a11y-selection {
  display: none
}

.oxnv-selectioncard-group {
  display: flex;
  flex-direction: column;
  gap: 24px;
  gap: var(--oxnv-okd-selectioncard-gap, 24px)
}

.oxnv-selectioncard {
  align-items: center;
  background-color: initial;
  background-color: var(--oxnv-okd-selectioncard-item-background-color, transparent);
  border: var(--oxnv-okd-selectioncard-item-border-width, .5px) solid var(--oxnv-okd-selectioncard-item-border-color, var(--oxnv-okd-color-border-interactive-default));
  border-radius: 8px;
  border-radius: var(--oxnv-okd-selectioncard-item-border-radius, 8px);
  cursor: pointer;
  display: flex;
  padding: 16px;
  padding: var(--oxnv-okd-selectioncard-item-padding, 16px)
}

.oxnv-selectioncard-selected {
  background-color: initial;
  background-color: var(--oxnv-okd-selectioncard-item-selected-background-color, transparent);
  border: .5px solid transparent;
  border: var(--oxnv-okd-selectioncard-item-border-width, .5px) solid transparent;
  box-shadow: inset 0 0 0 1.5px var(--oxnv-okd-color-border-interactive-selected);
  box-shadow: inset 0 0 0 var(--oxnv-okd-selectioncard-item-selected-border-width, 1.5px) var(--oxnv-okd-selectioncard-item-selected-border-color, var(--oxnv-okd-color-border-interactive-selected))
}

@media (hover:hover) {
  .oxnv-selectioncard:hover {
    background-color: var(--oxnv-okd-color-surface-interactive-hovered);
    background-color: var(--oxnv-okd-selectioncard-item-hover-background-color, var(--oxnv-okd-color-surface-interactive-hovered))
  }
}

.okd-component-okds-pointer_up {
  --ok-icon-font-family: "ok-d9362c9b40"
}

.okd-component-okds-pointer_up:before {
  content: "\e003";
  font-family: ok-d9362c9b40
}

.okd-component-pointer-down {
  --ok-icon-font-family: "ok-d9362c9b40"
}

.okd-component-pointer-down:before {
  content: "\e004";
  font-family: ok-d9362c9b40
}

.okd-component-loading {
  --ok-icon-font-family: "ok-d9362c9b40"
}

.okd-component-loading:before {
  content: "\e002";
  font-family: ok-d9362c9b40
}

.okd-component-selected {
  --ok-icon-font-family: "ok-d9362c9b40"
}

.okd-component-selected:before {
  content: "\e000";
  font-family: ok-d9362c9b40
}

.okd-component-clear-filled {
  --ok-icon-font-family: "ok-d9362c9b40"
}

.okd-component-clear-filled:before {
  content: "\e001";
  font-family: ok-d9362c9b40
}

.iconfont {
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
  font-size: 16px;
  font-style: normal
}

.iconfont:before {
  display: inline-block
}

@font-face {
  font-display: block;
  font-family: ok-d9362c9b40;
  font-style: normal;
  src: url(../font/16d53ae8a09d3c2a1d92.woff2) format("woff2")
}

@media (max-width:1023px) {

  .header-main .dp-c-l-ag:not(.nav-boost-drop),
  .header-main .drop-c-right-align:not(.nav-boost-drop) {
    background: transparent;
    display: none;
    left: auto;
    opacity: 1;
    padding: 4px 0 4px 12px;
    position: relative;
    top: auto;
    transform: unset;
    visibility: visible;
    width: 100%
  }

  .header-main .dp-c-l-ag:not(.nav-boost-drop).drop-c-common-show,
  .header-main .drop-c-right-align:not(.nav-boost-drop).drop-c-common-show {
    opacity: 1;
    pointer-events: auto;
    top: 60px;
    visibility: visible
  }

  .header-main .dp-c-l-ag:not(.nav-boost-drop) .info-extend-box,
  .header-main .drop-c-right-align:not(.nav-boost-drop) .info-extend-box {
    flex-direction: column
  }

  .header-main .dp-c-l-ag:not(.nav-boost-drop) .info-extend-box .item-title,
  .header-main .drop-c-right-align:not(.nav-boost-drop) .info-extend-box .item-title {
    color: var(--oxnv-okd-color-content-secondary);
    display: inline-flex;
    font-size: 16px;
    height: 44px;
    padding: 14px 0;
    width: 100%
  }

  .header-main .dp-c-l-ag:not(.nav-boost-drop) .info-extend-box .item-title:hover,
  .header-main .drop-c-right-align:not(.nav-boost-drop) .info-extend-box .item-title:hover {
    background: transparent;
    color: var(--oxnv-okd-color-content-primary)
  }

  .header-main .dp-c-l-ag:not(.nav-boost-drop) .info-extend-box .tab-ms,
  .header-main .drop-c-right-align:not(.nav-boost-drop) .info-extend-box .tab-ms {
    color: #646f84;
    font-size: 14px;
    font-style: normal;
    font-weight: 400;
    line-height: 20px
  }

  .header-main .dp-c-l-ag:not(.nav-boost-drop) .extend-box,
  .header-main .drop-c-right-align:not(.nav-boost-drop) .extend-box {
    margin: 0;
    max-width: unset;
    min-width: unset;
    padding: 0;
    width: 100%
  }

  .header-main .dp-c-l-ag:not(.nav-boost-drop) .extend-box .box-title,
  .header-main .dp-c-l-ag:not(.nav-boost-drop) .extend-box .desc-box,
  .header-main .dp-c-l-ag:not(.nav-boost-drop) .extend-box .icon-box,
  .header-main .drop-c-right-align:not(.nav-boost-drop) .extend-box .box-title,
  .header-main .drop-c-right-align:not(.nav-boost-drop) .extend-box .desc-box,
  .header-main .drop-c-right-align:not(.nav-boost-drop) .extend-box .icon-box {
    display: none
  }

  .header-main .dp-c-l-ag:not(.nav-boost-drop) .extend-box .box-item,
  .header-main .drop-c-right-align:not(.nav-boost-drop) .extend-box .box-item {
    height: 44px;
    margin: 0
  }

  .header-main .dp-c-l-ag:not(.nav-boost-drop) .extend-box .box-item .item-title,
  .header-main .drop-c-right-align:not(.nav-boost-drop) .extend-box .box-item .item-title {
    color: var(--oxnv-okd-color-content-secondary);
    display: inline-flex;
    font-size: 16px;
    height: 44px;
    padding: 14px 0;
    width: 100%
  }

  .header-main .dp-c-l-ag:not(.nav-boost-drop) .extend-box .box-item .item-title:hover,
  .header-main .drop-c-right-align:not(.nav-boost-drop) .extend-box .box-item .item-title:hover {
    background: transparent;
    color: var(--oxnv-okd-color-content-primary)
  }

  .header-main .dp-c-l-ag:not(.nav-boost-drop) .extend-box .box-item .item-title.item-panel-drop-title,
  .header-main .drop-c-right-align:not(.nav-boost-drop) .extend-box .box-item .item-title.item-panel-drop-title {
    max-width: 270px;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap
  }

  .header-main .dp-c-l-ag:not(.nav-boost-drop) .extend-box .box-item .item-title.title-without-tag,
  .header-main .drop-c-right-align:not(.nav-boost-drop) .extend-box .box-item .item-title.title-without-tag {
    display: inline-block
  }

  .header-main .dp-c-l-ag:not(.nav-boost-drop) .extend-small-box .box-item,
  .header-main .drop-c-right-align:not(.nav-boost-drop) .extend-small-box .box-item {
    color: var(--oxnv-okd-color-content-secondary);
    display: inline-flex;
    font-size: 16px;
    height: 44px;
    margin: 0;
    padding: 14px 0;
    width: 100%
  }

  .header-main .dp-c-l-ag:not(.nav-boost-drop) .extend-small-box .box-item:hover,
  .header-main .drop-c-right-align:not(.nav-boost-drop) .extend-small-box .box-item:hover {
    background: transparent;
    color: var(--oxnv-okd-color-content-primary)
  }

  .header-main .column-nav-container .nav-scroll-box {
    display: flex;
    flex-direction: row;
    flex-grow: 1;
    justify-content: flex-end;
    padding: 0;
    top: 0;
    width: auto
  }

  .header-main .column-nav-container .nav-scroll-box::-webkit-scrollbar {
    display: none
  }

  .header-main .column-nav-container .mode-xl-line,
  .header-main .column-nav-container .nav-academy,
  .header-main .column-nav-container .nav-balance,
  .header-main .column-nav-container .nav-buy,
  .header-main .column-nav-container .nav-cefi-market,
  .header-main .column-nav-container .nav-custom,
  .header-main .column-nav-container .nav-dashboard,
  .header-main .column-nav-container .nav-deposit,
  .header-main .column-nav-container .nav-earn,
  .header-main .column-nav-container .nav-explorer .nav-nft,
  .header-main .column-nav-container .nav-institutions,
  .header-main .column-nav-container .nav-language,
  .header-main .column-nav-container .nav-leaderboard,
  .header-main .column-nav-container .nav-market,
  .header-main .column-nav-container .nav-meme-pump,
  .header-main .column-nav-container .nav-mobile-download,
  .header-main .column-nav-container .nav-mode,
  .header-main .column-nav-container .nav-more,
  .header-main .column-nav-container .nav-nft,
  .header-main .column-nav-container .nav-okc,
  .header-main .column-nav-container .nav-portfolio,
  .header-main .column-nav-container .nav-referral,
  .header-main .column-nav-container .nav-signal,
  .header-main .column-nav-container .nav-site-flag,
  .header-main .column-nav-container .nav-smsf,
  .header-main .column-nav-container .nav-swap,
  .header-main .column-nav-container .nav-tracker,
  .header-main .column-nav-container .nav-trade,
  .header-main .column-nav-container .nav-user,
  .header-main .column-nav-container .nav-web3-more,
  .header-main .column-nav-container .other-wrap,
  .header-main .column-nav-container .pc-mode,
  .header-main .column-nav-container .profile-wrap,
  .header-main .column-nav-container .user-info-item {
    display: none
  }

  .header-main .column-nav-container .mode-line {
    background: hsla(0, 0%, 100%, .15);
    display: none;
    height: 16px;
    margin: 16px;
    width: 1px
  }

  .header-main .column-nav-container .mode-line.has-address {
    display: block
  }

  .header-main .column-nav-container .mode-no-login {
    display: none
  }

  .header-main.active .column-nav-container {
    z-index: 9500
  }

  .header-main.active .column-nav-container.web3-column-container {
    display: block
  }

  .header-main.active .column-nav-container.web3-column-container .col-mu-top {
    align-items: center;
    display: flex;
    justify-content: space-between;
    padding: 22px 16px
  }

  .header-main.active .column-nav-container.web3-column-container .nav-item .nav-link,
  .header-main.active .column-nav-container.web3-column-container .nav-item .nav-text.mu-txt,
  .header-main.active .column-nav-container.web3-column-container .nav-item.nav-link {
    font-weight: 500
  }

  .header-main.active .column-nav-container .nav-item .dp-c-l-ag:not(.nav-boost-drop),
  .header-main.active .column-nav-container .nav-item .drop-c-right-align:not(.nav-boost-drop) {
    background: transparent;
    display: none;
    left: auto;
    opacity: 1;
    padding: 4px 0 4px 12px;
    position: relative;
    top: auto;
    transform: unset;
    visibility: visible;
    width: 100%
  }

  .header-main.active .column-nav-container .nav-item .dp-c-l-ag:not(.nav-boost-drop).drop-c-common-show,
  .header-main.active .column-nav-container .nav-item .drop-c-right-align:not(.nav-boost-drop).drop-c-common-show {
    opacity: 1;
    pointer-events: auto;
    top: 60px;
    visibility: visible
  }

  .header-main.active .column-nav-container .nav-item .dp-c-l-ag:not(.nav-boost-drop) .info-extend-box,
  .header-main.active .column-nav-container .nav-item .drop-c-right-align:not(.nav-boost-drop) .info-extend-box {
    flex-direction: column
  }

  .header-main.active .column-nav-container .nav-item .dp-c-l-ag:not(.nav-boost-drop) .info-extend-box .item-title,
  .header-main.active .column-nav-container .nav-item .drop-c-right-align:not(.nav-boost-drop) .info-extend-box .item-title {
    color: var(--oxnv-okd-color-content-secondary);
    display: inline-flex;
    font-size: 16px;
    height: 44px;
    padding: 14px 0;
    width: 100%
  }

  .header-main.active .column-nav-container .nav-item .dp-c-l-ag:not(.nav-boost-drop) .info-extend-box .item-title:hover,
  .header-main.active .column-nav-container .nav-item .drop-c-right-align:not(.nav-boost-drop) .info-extend-box .item-title:hover {
    background: transparent;
    color: var(--oxnv-okd-color-content-primary)
  }

  .header-main.active .column-nav-container .nav-item .dp-c-l-ag:not(.nav-boost-drop) .info-extend-box .tab-ms,
  .header-main.active .column-nav-container .nav-item .drop-c-right-align:not(.nav-boost-drop) .info-extend-box .tab-ms {
    color: #646f84;
    font-size: 14px;
    font-style: normal;
    font-weight: 400;
    line-height: 20px
  }

  .header-main.active .column-nav-container .nav-item .dp-c-l-ag:not(.nav-boost-drop) .extend-box,
  .header-main.active .column-nav-container .nav-item .drop-c-right-align:not(.nav-boost-drop) .extend-box {
    margin: 0;
    max-width: unset;
    min-width: unset;
    padding: 0;
    width: 100%
  }

  .header-main.active .column-nav-container .nav-item .dp-c-l-ag:not(.nav-boost-drop) .extend-box .box-title,
  .header-main.active .column-nav-container .nav-item .dp-c-l-ag:not(.nav-boost-drop) .extend-box .desc-box,
  .header-main.active .column-nav-container .nav-item .dp-c-l-ag:not(.nav-boost-drop) .extend-box .icon-box,
  .header-main.active .column-nav-container .nav-item .drop-c-right-align:not(.nav-boost-drop) .extend-box .box-title,
  .header-main.active .column-nav-container .nav-item .drop-c-right-align:not(.nav-boost-drop) .extend-box .desc-box,
  .header-main.active .column-nav-container .nav-item .drop-c-right-align:not(.nav-boost-drop) .extend-box .icon-box {
    display: none
  }

  .header-main.active .column-nav-container .nav-item .dp-c-l-ag:not(.nav-boost-drop) .extend-box .box-item,
  .header-main.active .column-nav-container .nav-item .drop-c-right-align:not(.nav-boost-drop) .extend-box .box-item {
    height: 44px;
    margin: 0
  }

  .header-main.active .column-nav-container .nav-item .dp-c-l-ag:not(.nav-boost-drop) .extend-box .box-item .item-title,
  .header-main.active .column-nav-container .nav-item .drop-c-right-align:not(.nav-boost-drop) .extend-box .box-item .item-title {
    color: var(--oxnv-okd-color-content-secondary);
    display: inline-flex;
    font-size: 16px;
    height: 44px;
    padding: 14px 0;
    width: 100%
  }

  .header-main.active .column-nav-container .nav-item .dp-c-l-ag:not(.nav-boost-drop) .extend-box .box-item .item-title:hover,
  .header-main.active .column-nav-container .nav-item .drop-c-right-align:not(.nav-boost-drop) .extend-box .box-item .item-title:hover {
    background: transparent;
    color: var(--oxnv-okd-color-content-primary)
  }

  .header-main.active .column-nav-container .nav-item .dp-c-l-ag:not(.nav-boost-drop) .extend-box .box-item .item-title.item-panel-drop-title,
  .header-main.active .column-nav-container .nav-item .drop-c-right-align:not(.nav-boost-drop) .extend-box .box-item .item-title.item-panel-drop-title {
    max-width: 270px;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap
  }

  .header-main.active .column-nav-container .nav-item .dp-c-l-ag:not(.nav-boost-drop) .extend-box .box-item .item-title.title-without-tag,
  .header-main.active .column-nav-container .nav-item .drop-c-right-align:not(.nav-boost-drop) .extend-box .box-item .item-title.title-without-tag {
    display: inline-block
  }

  .header-main.active .column-nav-container .nav-item .dp-c-l-ag:not(.nav-boost-drop) .extend-small-box .box-item,
  .header-main.active .column-nav-container .nav-item .drop-c-right-align:not(.nav-boost-drop) .extend-small-box .box-item {
    color: var(--oxnv-okd-color-content-secondary);
    display: inline-flex;
    font-size: 16px;
    height: 44px;
    margin: 0;
    padding: 14px 0;
    width: 100%
  }

  .header-main.active .column-nav-container .nav-item .dp-c-l-ag:not(.nav-boost-drop) .extend-small-box .box-item:hover,
  .header-main.active .column-nav-container .nav-item .drop-c-right-align:not(.nav-boost-drop) .extend-small-box .box-item:hover {
    background: transparent;
    color: var(--oxnv-okd-color-content-primary)
  }

  .header-main.active .column-nav-container .nav-item .dp-c-l-ag .extend-box .box-item {
    width: 100%
  }

  .header-main.active .column-nav-container.asset-active .nav-scroll-box .nav-item.is-left,
  .header-main.active .column-nav-container.asset-active .nav-scroll-box .nav-item.nav-mode,
  .header-main.active .column-nav-container.asset-active .nav-scroll-box .nav-language-column,
  .header-main.active .column-nav-container.asset-active .nav-scroll-box .nav-mobile-download {
    display: none
  }

  .header-main .column-nav-container .nav-scroll-box,
  .header-main .nav-container .nav-scroll-box {
    display: flex;
    flex-direction: row;
    flex-grow: 1;
    justify-content: flex-end;
    padding: 0;
    top: 0;
    width: auto
  }

  .header-main .column-nav-container .nav-scroll-box::-webkit-scrollbar,
  .header-main .nav-container .nav-scroll-box::-webkit-scrollbar {
    display: none
  }

  .header-main .column-nav-container .deposit-item,
  .header-main .column-nav-container .is-left,
  .header-main .column-nav-container .mode-xl-line,
  .header-main .column-nav-container .nav-academy,
  .header-main .column-nav-container .nav-balance,
  .header-main .column-nav-container .nav-buy,
  .header-main .column-nav-container .nav-custom,
  .header-main .column-nav-container .nav-deposit,
  .header-main .column-nav-container .nav-earn,
  .header-main .column-nav-container .nav-institutions,
  .header-main .column-nav-container .nav-language,
  .header-main .column-nav-container .nav-market,
  .header-main .column-nav-container .nav-mobile-download,
  .header-main .column-nav-container .nav-mode,
  .header-main .column-nav-container .nav-more,
  .header-main .column-nav-container .nav-okc,
  .header-main .column-nav-container .nav-site-flag,
  .header-main .column-nav-container .nav-smsf,
  .header-main .column-nav-container .nav-trade,
  .header-main .column-nav-container .nav-user,
  .header-main .column-nav-container .other-wrap,
  .header-main .column-nav-container .pc-mode,
  .header-main .column-nav-container .profile-wrap,
  .header-main .column-nav-container .user-info-item,
  .header-main .nav-container .deposit-item,
  .header-main .nav-container .is-left,
  .header-main .nav-container .mode-xl-line,
  .header-main .nav-container .nav-academy,
  .header-main .nav-container .nav-balance,
  .header-main .nav-container .nav-buy,
  .header-main .nav-container .nav-custom,
  .header-main .nav-container .nav-deposit,
  .header-main .nav-container .nav-earn,
  .header-main .nav-container .nav-institutions,
  .header-main .nav-container .nav-language,
  .header-main .nav-container .nav-market,
  .header-main .nav-container .nav-mobile-download,
  .header-main .nav-container .nav-mode,
  .header-main .nav-container .nav-more,
  .header-main .nav-container .nav-okc,
  .header-main .nav-container .nav-site-flag,
  .header-main .nav-container .nav-smsf,
  .header-main .nav-container .nav-trade,
  .header-main .nav-container .nav-user,
  .header-main .nav-container .other-wrap,
  .header-main .nav-container .pc-mode,
  .header-main .nav-container .profile-wrap,
  .header-main .nav-container .user-info-item {
    display: none
  }

  .header-main .column-nav-container .mode-line,
  .header-main .nav-container .mode-line {
    background: hsla(0, 0%, 100%, .15);
    display: none;
    height: 16px;
    margin: 16px;
    width: 1px
  }

  .header-main .column-nav-container .mode-line.has-address,
  .header-main .nav-container .mode-line.has-address {
    display: block
  }

  .header-main .column-nav-container,
  .header-main .column-nav-container .mode-no-login,
  .header-main .nav-container .mode-no-login {
    display: none
  }

  .header-main.active .column-nav-container {
    background: var(--oxnv-okd-color-background-base-primary);
    box-shadow: 0 12px 60px rgba(14, 32, 66, .15), 0 1px 2px rgba(14, 32, 66, .05);
    display: flex;
    height: 100%;
    position: fixed;
    right: 0;
    transform: translateZ(0);
    width: 376px
  }

  .header-main.active .column-nav-container .nav-scroll-box {
    display: block;
    flex-direction: column;
    height: 95%;
    justify-content: unset;
    overflow: scroll;
    padding: 0 20px 48px;
    position: absolute;
    top: 48px;
    width: 100%
  }

  .header-main.active .column-nav-container .nav-wrap {
    display: flex;
    flex-direction: column;
    width: 100%
  }

  .header-main.active .column-nav-container .nav-item {
    cursor: pointer;
    display: flex;
    flex-direction: row;
    flex-wrap: wrap;
    justify-content: flex-start;
    padding: 0;
    width: 100%
  }

  .header-main.active .column-nav-container .nav-item:focus-visible {
    border-radius: 4px;
    outline: 2px solid #fff;
    outline-offset: 2px
  }

  .header-main.active .column-nav-container .nav-item .icon-img {
    display: none
  }

  .header-main.active .column-nav-container .nav-item.show-more .mu-txt.mu-txt-extend:before,
  .header-main.active .column-nav-container .nav-item.show-more .mu-txt:not(.mu-txt-third):before,
  .header-main.active .column-nav-container .nav-item.show-more .user-arrow.mu-txt-extend:before,
  .header-main.active .column-nav-container .nav-item.show-more .user-arrow:not(.mu-txt-third):before {
    transform: rotate(-180deg)
  }

  .header-main.active .column-nav-container .nav-item.show-more .dp-c-l-ag:not(.nav-boost-drop),
  .header-main.active .column-nav-container .nav-item.show-more .drop-c-right-align:not(.nav-boost-drop) {
    display: block
  }

  .header-main.active .column-nav-container .nav-item.show-more .nav-item.panel-nav-item.panel-col {
    display: flex
  }

  .header-main.active .column-nav-container .nav-item .nav-link,
  .header-main.active .column-nav-container .nav-item .nav-text,
  .header-main.active .column-nav-container .nav-item.nav-link {
    align-items: center;
    color: var(--oxnv-okd-color-content-primary);
    cursor: pointer;
    display: flex;
    flex-grow: 1;
    font-size: 18px;
    height: 52px;
    line-height: unset;
    padding: 17px 0
  }

  .header-main.active .column-nav-container .nav-item .nav-link:focus-visible,
  .header-main.active .column-nav-container .nav-item .nav-text:focus-visible,
  .header-main.active .column-nav-container .nav-item.nav-link:focus-visible {
    border-radius: 4px;
    outline: 2px solid #fff;
    outline-offset: 2px
  }

  .header-main.active .column-nav-container .nav-item .nav-link.mu-txt,
  .header-main.active .column-nav-container .nav-item .nav-text.mu-txt,
  .header-main.active .column-nav-container .nav-item.nav-link.mu-txt {
    justify-content: space-between
  }

  .header-main.active .column-nav-container .nav-item .nav-link.mu-txt:before,
  .header-main.active .column-nav-container .nav-item .nav-text.mu-txt:before,
  .header-main.active .column-nav-container .nav-item.nav-link.mu-txt:before {
    font-size: 14px;
    order: 5
  }

  .header-main.active .column-nav-container .nav-item .nav-link:active,
  .header-main.active .column-nav-container .nav-item .nav-text:active,
  .header-main.active .column-nav-container .nav-item.nav-link:active {
    color: var(--oxnv-okd-color-content-primary)
  }

  .header-main.active .column-nav-container .nav-item .mu-txt:before,
  .header-main.active .column-nav-container .nav-item .user-arrow {
    color: #909090;
    cursor: pointer;
    display: inline-block;
    margin-left: 4px;
    margin-right: 0;
    padding: 20px 0;
    transform: rotate(0deg)
  }

  .header-main.active .column-nav-container .nav-item .mu-txt:before .icon,
  .header-main.active .column-nav-container .nav-item .user-arrow .icon {
    color: #909090;
    font-size: 12px;
    font-weight: 500;
    pointer-events: none
  }

  .header-main.active .column-nav-container .nav-item .dp-c-l-ag .box-item,
  .header-main.active .column-nav-container .nav-item .dp-c-l-ag .extend-link {
    display: inline-block
  }

  .header-main.active .column-nav-container .nav-item .dp-c-l-ag .box-item:focus-visible,
  .header-main.active .column-nav-container .nav-item .dp-c-l-ag .extend-link:focus-visible {
    border-radius: 4px;
    outline: 2px solid #fff;
    outline-offset: 2px
  }

  .header-main.active .column-nav-container .nav-item .dp-c-l-ag .box-item .item-box:focus-visible,
  .header-main.active .column-nav-container .nav-item .dp-c-l-ag .extend-link .item-box:focus-visible {
    border-radius: 4px;
    outline: 2px solid #fff;
    outline-offset: 2px
  }

  .header-main.active .column-nav-container .nav-item .dp-c-l-ag .box-item:before,
  .header-main.active .column-nav-container .nav-item .dp-c-l-ag .extend-link:before {
    display: none
  }

  .header-main.active .column-nav-container .nav-item .dp-c-l-ag .box-item .nav-hot-tag,
  .header-main.active .column-nav-container .nav-item .dp-c-l-ag .box-item .nav-hot-tag.only-column,
  .header-main.active .column-nav-container .nav-item .dp-c-l-ag .box-item .nav-new-tag,
  .header-main.active .column-nav-container .nav-item .dp-c-l-ag .box-item .nav-new-tag.only-column,
  .header-main.active .column-nav-container .nav-item .dp-c-l-ag .extend-link .nav-hot-tag,
  .header-main.active .column-nav-container .nav-item .dp-c-l-ag .extend-link .nav-hot-tag.only-column,
  .header-main.active .column-nav-container .nav-item .dp-c-l-ag .extend-link .nav-new-tag,
  .header-main.active .column-nav-container .nav-item .dp-c-l-ag .extend-link .nav-new-tag.only-column {
    display: inline-block
  }

  .header-main.active .column-nav-container .pc-mode {
    display: none
  }

  .header-main.active .column-nav-container .extend-link {
    color: var(--oxnv-okd-color-content-secondary);
    cursor: pointer;
    display: inline-flex;
    font-size: 16px;
    height: 44px;
    padding: 14px 0;
    width: 100%
  }

  .header-main.active .column-nav-container .extend-link:hover {
    background: transparent;
    color: var(--oxnv-okd-color-content-primary)
  }

  .header-main.active .column-nav-container .extend-link:focus-visible {
    border-radius: 4px;
    outline: 2px solid #fff;
    outline-offset: 2px
  }

  .header-main.active .column-nav-container .extend-link .icon {
    font-size: 16px;
    margin-left: 4px;
    position: relative;
    top: 1px
  }

  .header-main.active .column-nav-container .nav-scroll-box .asset-bottom-line,
  .header-main.active .column-nav-container .nav-scroll-box .nav-item.is-user,
  .header-main.active .column-nav-container .nav-scroll-box .nav-item.nav-balance,
  .header-main.active .column-nav-container .nav-scroll-box .profile-wrap,
  .header-main.active .column-nav-container.asset-active .nav-scroll-box .nav-item.is-left,
  .header-main.active .column-nav-container.asset-active .nav-scroll-box .nav-item.nav-mode,
  .header-main.active .column-nav-container.asset-active .nav-scroll-box .nav-mobile-download {
    display: none
  }

  .header-main.active .column-nav-container.asset-active .nav-scroll-box .asset-bottom-line,
  .header-main.active .column-nav-container.asset-active .nav-scroll-box .nav-balance,
  .header-main.active .column-nav-container.asset-active .nav-scroll-box .nav-item.is-user,
  .header-main.active .column-nav-container.asset-active .nav-scroll-box .profile-wrap {
    display: flex
  }
}

@media (min-width:1024px) {

  .header-main .nav-container .dp-c-l-ag,
  .header-main .nav-container .drop-c-right-align {
    background: var(--oxnv-okd-color-container-primary);
    border-radius: 12px;
    box-shadow: 0 12px 60px rgba(14, 32, 66, .15), 0 1px 2px rgba(14, 32, 66, .05);
    cursor: default;
    opacity: 0;
    overflow: hidden;
    padding: 12px;
    pointer-events: none;
    position: absolute;
    visibility: hidden;
    z-index: 20000
  }

  .header-main .nav-container .dp-c-l-ag.drop-c-common-show,
  .header-main .nav-container .drop-c-right-align.drop-c-common-show {
    opacity: 1;
    pointer-events: auto;
    top: 60px;
    visibility: visible
  }

  .header-main .nav-container .dp-c-l-ag.drop-with-panel,
  .header-main .nav-container .drop-c-right-align.drop-with-panel {
    border-radius: 12px 0 0 12px
  }

  .header-main .nav-container .dp-c-l-ag.drop-with-panel-bottom,
  .header-main .nav-container .drop-c-right-align.drop-with-panel-bottom {
    border-radius: 12px 12px 0 12px
  }

  .header-main .nav-container .drop-animation,
  .header-main .nav-container .drop-animation:hover {
    transition: all .3s cubic-bezier(.645, .045, .355, 1)
  }

  .header-main .nav-container .dp-c-l-ag {
    font-weight: 400;
    left: -14px;
    top: 58px
  }

  .header-main .nav-container .dp-c-l-ag.drop-c-common-show {
    opacity: 1;
    pointer-events: auto;
    top: 60px;
    visibility: visible
  }

  .header-main .nav-container .dp-c-l-ag .info-extend-box {
    display: flex
  }

  .header-main .nav-container .dp-c-l-ag .info-extend-box[data-direction=column] {
    flex-direction: column
  }

  .header-main .nav-container .dp-c-l-ag .extend-box {
    margin-right: 48px
  }

  .header-main .nav-container .dp-c-l-ag .extend-box:last-child {
    margin-right: 0
  }

  .header-main .nav-container .dp-c-l-ag .extend-box .dropdown-panel-li:hover,
  .header-main .nav-container .dp-c-l-ag .extend-box .trade-drop-item-con:hover {
    background: #f9f9f9;
    background: var(--header-lg-drop-box-item-bg-hover);
    border-radius: 4px;
    color: var(--oxnv-okd-color-content-primary);
    cursor: pointer
  }

  .header-main .nav-container .dp-c-l-ag .extend-box .dropdown-panel-li.dp-explorer,
  .header-main .nav-container .dp-c-l-ag .extend-box .trade-drop-item-con.dp-explorer {
    max-width: 250px
  }

  .header-main .nav-container .dp-c-l-ag .extend-box .dropdown-panel-li .drop-panel-box-item,
  .header-main .nav-container .dp-c-l-ag .extend-box .dropdown-panel-li .panel-drop-item-icon,
  .header-main .nav-container .dp-c-l-ag .extend-box .trade-drop-item-con .drop-panel-box-item,
  .header-main .nav-container .dp-c-l-ag .extend-box .trade-drop-item-con .panel-drop-item-icon {
    background: unset;
    color: unset
  }

  .header-main .nav-container .dp-c-l-ag .extend-box .box-title {
    color: var(--oxnv-okd-color-content-contrast);
    font-size: 12px;
    font-weight: 600;
    line-height: 20px;
    margin-bottom: 8px;
    padding-left: 20px
  }

  .header-main .nav-container .dp-c-l-ag .extend-box .explorer-drop-panel-third-list .box-item.drop-panel-menu-item {
    display: flex;
    width: unset
  }

  .header-main .nav-container .dp-c-l-ag .extend-box .box-item {
    align-items: center;
    display: flex;
    padding: 14px 12px
  }

  .header-main .nav-container .dp-c-l-ag .extend-box .box-item:focus-visible {
    border-radius: 4px;
    outline: 2px solid #000;
    outline-offset: 2px
  }

  .header-main .nav-container .dp-c-l-ag .extend-box .box-item.drop-panel-menu-item {
    display: inline-flex;
    vertical-align: middle;
    width: 224px
  }

  .header-main .nav-container .dp-c-l-ag .extend-box .box-item:before {
    color: var(--oxnv-okd-color-content-primary);
    font-size: 24px;
    margin-right: 16px
  }

  .header-main .nav-container .dp-c-l-ag .extend-box .box-item:last-child {
    margin-bottom: 0
  }

  .header-main .nav-container .dp-c-l-ag .extend-box .box-item .icon-box {
    margin-right: 8px
  }

  .header-main .nav-container .dp-c-l-ag .extend-box .box-item .icon-box .icon {
    height: 28px;
    width: 28px
  }

  .header-main .nav-container .dp-c-l-ag .extend-box .box-item .item-box {
    width: -webkit-max-content;
    width: -moz-max-content;
    width: max-content
  }

  .header-main .nav-container .dp-c-l-ag .extend-box .box-item .item-box.item-panel-drop {
    flex: auto;
    max-width: 176px
  }

  .header-main .nav-container .dp-c-l-ag .extend-box .box-item .item-box.trade-item-panel-drop {
    max-width: 251px
  }

  .header-main .nav-container .dp-c-l-ag .extend-box .box-item .item-box .item-title {
    color: var(--oxnv-okd-color-content-primary);
    display: flex;
    font-size: 14px;
    font-weight: 500;
    line-height: 16px
  }

  .header-main .nav-container .dp-c-l-ag .extend-box .box-item .item-box .item-title.item-panel-drop-title {
    align-items: center;
    display: flex;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap
  }

  .header-main .nav-container .dp-c-l-ag .extend-box .box-item .item-box .item-title.trade-item-panel-drop-title {
    align-items: center;
    display: flex
  }

  .header-main .nav-container .dp-c-l-ag .extend-box .box-item .item-box .item-title.title-without-desc {
    padding-bottom: 10px;
    padding-top: 10px
  }

  .header-main .nav-container .dp-c-l-ag .extend-box .box-item .item-box .desc {
    color: var(--oxnv-okd-color-content-contrast);
    font-size: 12px;
    font-weight: 400;
    line-height: 16px;
    margin-top: 4px;
    position: relative;
    visibility: visible
  }

  .header-main .nav-container .dp-c-l-ag .extend-box .box-item:not(.drop-panel-menu-item):hover {
    background: #f9f9f9;
    background: var(--header-lg-drop-box-item-bg-hover);
    border-radius: 4px;
    color: var(--oxnv-okd-color-content-primary);
    cursor: pointer
  }

  .header-main .nav-container .dp-c-l-ag .extend-small-box {
    margin-right: 80px;
    min-width: 120px;
    width: -webkit-max-content;
    width: -moz-max-content;
    width: max-content
  }

  .header-main .nav-container .dp-c-l-ag .extend-small-box .box-title {
    font-weight: 500;
    margin-bottom: 10px;
    padding-left: 12px;
    padding-top: 12px
  }

  .header-main .nav-container .dp-c-l-ag .extend-small-box .box-item {
    align-items: center;
    color: var(--oxnv-okd-color-content-primary);
    cursor: pointer;
    display: flex;
    font-size: 14px;
    font-weight: 500;
    line-height: 20px;
    margin-bottom: 0;
    padding: 12px
  }

  .header-main .nav-container .dp-c-l-ag .extend-small-box .box-item:not(.drop-panel-menu-item):hover {
    background: #f9f9f9;
    background: var(--header-lg-drop-box-item-bg-hover);
    border-radius: 4px;
    color: var(--oxnv-okd-color-content-primary);
    cursor: pointer
  }

  .header-main .nav-container .nav-scroll-box {
    display: flex;
    flex-grow: 1;
    overscroll-behavior-y: contain;
    position: relative
  }

  .header-main .nav-container .nav-l-sec,
  .header-main .nav-container .nav-l-sec .nav-l-con {
    display: flex
  }

  .header-main .nav-container .nav-l-sec .nav-l-con .nav-item {
    margin: 0 10px;
    padding: 0
  }

  .header-main .nav-container .nav-item {
    align-items: center;
    box-sizing: border-box;
    cursor: pointer;
    display: flex;
    height: 100%;
    padding: 0 10px;
    position: relative
  }

  .header-main .nav-container .nav-item .nav-link,
  .header-main .nav-container .nav-item .nav-text,
  .header-main .nav-container .nav-item.nav-link {
    box-sizing: border-box;
    color: var(--oxnv-okd-color-content-primary);
    cursor: pointer;
    display: inline-flex;
    font-size: 14px;
    font-weight: 400;
    line-height: 60px;
    position: relative;
    word-break: break-all
  }

  .header-main .nav-container .nav-item .nav-link.nav-link:focus-visible,
  .header-main .nav-container .nav-item .nav-text.nav-link:focus-visible,
  .header-main .nav-container .nav-item.nav-link.nav-link:focus-visible {
    border: none;
    outline: none
  }

  .header-main .nav-container .nav-item .nav-link.mu-txt,
  .header-main .nav-container .nav-item .nav-text.mu-txt,
  .header-main .nav-container .nav-item.nav-link.mu-txt {
    display: inline-flex;
    flex-direction: row-reverse
  }

  .header-main .nav-container .nav-item .nav-link:focus-visible:after,
  .header-main .nav-container .nav-item .nav-text:focus-visible:after,
  .header-main .nav-container .nav-item.nav-link:focus-visible:after {
    border-radius: 4px;
    bottom: 0;
    content: "";
    height: 30px;
    left: 0;
    margin: auto;
    outline: 2px solid #fff;
    outline-offset: 2px;
    position: absolute;
    right: 0;
    top: 0;
    width: 100%
  }

  .header-main .nav-container .nav-item .mu-txt:before,
  .header-main .nav-container .nav-item .user-arrow {
    color: var(--oxnv-okd-color-content-secondary);
    display: inline-block;
    margin-left: 4px;
    transform: rotate(0deg)
  }

  .header-main .nav-container .nav-item .mu-txt:before .icon,
  .header-main .nav-container .nav-item .user-arrow .icon {
    font-size: 12px
  }

  .header-main .nav-container .nav-item .mu-txt.arrow-show:before,
  .header-main .nav-container .nav-item.show-drop-menu .mu-txt:before,
  .header-main .nav-container .nav-item.show-drop-menu .user-arrow {
    transform: rotate(-180deg)
  }

  .header-main .nav-container .nav-item.show-drop-menu .dp-c-l-ag {
    opacity: 1;
    pointer-events: auto;
    top: 60px;
    visibility: visible
  }

  .header-main .nav-container .nav-academy .nav-link,
  .header-main .nav-container .nav-smsf .nav-link,
  .header-main .nav-container .nav-support .nav-link {
    white-space: nowrap
  }

  .header-main .nav-container .is-left .nav-link,
  .header-main .nav-container .is-left.nav-link {
    align-items: center;
    display: flex;
    height: 100%
  }

  .header-main .nav-container .extend-link {
    align-items: center;
    box-sizing: border-box;
    color: var(--oxnv-okd-color-content-primary);
    cursor: pointer;
    display: flex;
    font-size: 14px;
    font-weight: 500;
    height: unset;
    line-height: 20px;
    padding: 12px 16px;
    white-space: nowrap
  }

  .header-main .nav-container .extend-link:focus-visible {
    border-radius: 4px;
    outline: 2px solid #000;
    outline-offset: 2px
  }

  .header-main .nav-container .extend-link:not(.drop-panel-menu-item):hover {
    background: #f9f9f9;
    background: var(--header-lg-drop-box-item-bg-hover);
    border-radius: 4px;
    color: var(--oxnv-okd-color-content-primary);
    cursor: pointer
  }

  .header-main .nav-container .other-wrap {
    box-sizing: border-box;
    cursor: pointer;
    display: flex;
    line-height: 60px;
    margin: 0 10px;
    padding: 0;
    position: relative
  }

  .header-main .nav-container .other-wrap.nav-im {
    color: #fafafa;
    font-size: 18px
  }

  .header-main .nav-container .other-wrap.nav-im:before {
    font-size: 22px
  }

  .header-main .nav-container .other-wrap .icon,
  .header-main .nav-container .other-wrap .user-info {
    cursor: pointer
  }

  .header-main .nav-container .other-wrap .icon {
    color: var(--oxnv-okd-color-content-primary);
    font-size: 20px;
    position: relative
  }

  .header-main .nav-container .other-wrap .icon:focus-visible:after {
    border-radius: 4px;
    bottom: 0;
    content: "";
    height: 30px;
    left: 0;
    margin: auto;
    outline: 2px solid #fff;
    outline-offset: 2px;
    position: absolute;
    right: 0;
    top: 0;
    width: 100%
  }

  .header-main .nav-container .other-wrap .drop-c-right-align {
    overflow: visible;
    padding: 0 24px;
    right: 0;
    top: 70px
  }

  .header-main .nav-container .other-wrap.show-drop-menu .drop-c-right-align {
    opacity: 1;
    pointer-events: auto;
    top: 60px;
    visibility: visible
  }

  .header-main .nav-container .other-wrap,
  .header-main .nav-container .pc-mode,
  .header-main .nav-container .sm-mode {
    display: none
  }

  .header-main .nav-container .nav-null {
    flex-grow: 1
  }

  .header-main .head-spl-lin {
    background: hsla(0, 0%, 100%, .15);
    height: 16px;
    margin: 16px 10px 16px 20px;
    width: 1px
  }

  .header-main .column-nav-container .nav-scroll-box {
    display: flex;
    flex-direction: row;
    flex-grow: 1;
    justify-content: flex-end;
    padding: 0;
    top: 0;
    width: auto
  }

  .header-main .column-nav-container .nav-scroll-box::-webkit-scrollbar {
    display: none
  }

  .header-main .column-nav-container .mode-xl-line,
  .header-main .column-nav-container .nav-academy,
  .header-main .column-nav-container .nav-balance,
  .header-main .column-nav-container .nav-buy,
  .header-main .column-nav-container .nav-cefi-market,
  .header-main .column-nav-container .nav-custom,
  .header-main .column-nav-container .nav-dashboard,
  .header-main .column-nav-container .nav-deposit,
  .header-main .column-nav-container .nav-earn,
  .header-main .column-nav-container .nav-explorer .nav-nft,
  .header-main .column-nav-container .nav-institutions,
  .header-main .column-nav-container .nav-language,
  .header-main .column-nav-container .nav-leaderboard,
  .header-main .column-nav-container .nav-market,
  .header-main .column-nav-container .nav-meme-pump,
  .header-main .column-nav-container .nav-mobile-download,
  .header-main .column-nav-container .nav-mode,
  .header-main .column-nav-container .nav-more,
  .header-main .column-nav-container .nav-nft,
  .header-main .column-nav-container .nav-okc,
  .header-main .column-nav-container .nav-portfolio,
  .header-main .column-nav-container .nav-referral,
  .header-main .column-nav-container .nav-signal,
  .header-main .column-nav-container .nav-site-flag,
  .header-main .column-nav-container .nav-smsf,
  .header-main .column-nav-container .nav-swap,
  .header-main .column-nav-container .nav-tracker,
  .header-main .column-nav-container .nav-trade,
  .header-main .column-nav-container .nav-user,
  .header-main .column-nav-container .nav-web3-more,
  .header-main .column-nav-container .other-wrap,
  .header-main .column-nav-container .pc-mode,
  .header-main .column-nav-container .profile-wrap,
  .header-main .column-nav-container .user-info-item {
    display: none
  }

  .header-main .column-nav-container .mode-line {
    background: hsla(0, 0%, 100%, .15);
    display: none;
    height: 16px;
    margin: 16px;
    width: 1px
  }

  .header-main .column-nav-container .mode-line.has-address {
    display: block
  }

  .header-main .column-nav-container,
  .header-main .column-nav-container .mode-no-login {
    display: none
  }

  .header-main.active .column-nav-container {
    background: var(--oxnv-okd-color-background-base-primary);
    box-shadow: 0 12px 60px rgba(14, 32, 66, .15), 0 1px 2px rgba(14, 32, 66, .05);
    display: flex;
    height: 100%;
    position: fixed;
    right: 0;
    transform: translateZ(0);
    width: 376px;
    z-index: 9500
  }

  .header-main.active .column-nav-container.web3-column-container {
    display: block
  }

  .header-main.active .column-nav-container.web3-column-container .col-mu-top {
    align-items: center;
    display: flex;
    justify-content: space-between;
    padding: 22px 16px
  }

  .header-main.active .column-nav-container.web3-column-container .nav-item .nav-link,
  .header-main.active .column-nav-container.web3-column-container .nav-item .nav-text.mu-txt,
  .header-main.active .column-nav-container.web3-column-container .nav-item.nav-link {
    font-weight: 500
  }

  .header-main.active .column-nav-container .nav-scroll-box {
    display: block;
    flex-direction: column;
    height: 95%;
    justify-content: unset;
    overflow: scroll;
    padding: 0 20px 48px;
    position: absolute;
    top: 48px;
    width: 100%
  }

  .header-main.active .column-nav-container .nav-wrap {
    display: flex;
    flex-direction: column;
    width: 100%
  }

  .header-main.active .column-nav-container .nav-item {
    cursor: pointer;
    display: flex;
    flex-direction: row;
    flex-wrap: wrap;
    justify-content: flex-start;
    padding: 0;
    width: 100%
  }

  .header-main.active .column-nav-container .nav-item:focus-visible {
    border-radius: 4px;
    outline: 2px solid #fff;
    outline-offset: 2px
  }

  .header-main.active .column-nav-container .nav-item .icon-img {
    display: none
  }

  .header-main.active .column-nav-container .nav-item.show-more .mu-txt.mu-txt-extend:before,
  .header-main.active .column-nav-container .nav-item.show-more .mu-txt:not(.mu-txt-third):before,
  .header-main.active .column-nav-container .nav-item.show-more .user-arrow.mu-txt-extend:before,
  .header-main.active .column-nav-container .nav-item.show-more .user-arrow:not(.mu-txt-third):before {
    transform: rotate(-180deg)
  }

  .header-main.active .column-nav-container .nav-item.show-more .dp-c-l-ag:not(.nav-boost-drop),
  .header-main.active .column-nav-container .nav-item.show-more .drop-c-right-align:not(.nav-boost-drop) {
    display: block
  }

  .header-main.active .column-nav-container .nav-item.show-more .nav-item.panel-nav-item.panel-col {
    display: flex
  }

  .header-main.active .column-nav-container .nav-item .nav-link,
  .header-main.active .column-nav-container .nav-item .nav-text,
  .header-main.active .column-nav-container .nav-item.nav-link {
    align-items: center;
    color: var(--oxnv-okd-color-content-primary);
    cursor: pointer;
    display: flex;
    flex-grow: 1;
    font-size: 18px;
    height: 52px;
    line-height: unset;
    padding: 17px 0
  }

  .header-main.active .column-nav-container .nav-item .nav-link:focus-visible,
  .header-main.active .column-nav-container .nav-item .nav-text:focus-visible,
  .header-main.active .column-nav-container .nav-item.nav-link:focus-visible {
    border-radius: 4px;
    outline: 2px solid #fff;
    outline-offset: 2px
  }

  .header-main.active .column-nav-container .nav-item .nav-link.mu-txt,
  .header-main.active .column-nav-container .nav-item .nav-text.mu-txt,
  .header-main.active .column-nav-container .nav-item.nav-link.mu-txt {
    justify-content: space-between
  }

  .header-main.active .column-nav-container .nav-item .nav-link.mu-txt:before,
  .header-main.active .column-nav-container .nav-item .nav-text.mu-txt:before,
  .header-main.active .column-nav-container .nav-item.nav-link.mu-txt:before {
    font-size: 14px;
    order: 5
  }

  .header-main.active .column-nav-container .nav-item .nav-link:active,
  .header-main.active .column-nav-container .nav-item .nav-text:active,
  .header-main.active .column-nav-container .nav-item.nav-link:active {
    color: var(--oxnv-okd-color-content-primary)
  }

  .header-main.active .column-nav-container .nav-item .mu-txt:before,
  .header-main.active .column-nav-container .nav-item .user-arrow {
    color: #909090;
    cursor: pointer;
    display: inline-block;
    margin-left: 4px;
    margin-right: 0;
    padding: 20px 0;
    transform: rotate(0deg)
  }

  .header-main.active .column-nav-container .nav-item .mu-txt:before .icon,
  .header-main.active .column-nav-container .nav-item .user-arrow .icon {
    color: #909090;
    font-size: 12px;
    font-weight: 500;
    pointer-events: none
  }

  .header-main.active .column-nav-container .nav-item .dp-c-l-ag .box-item,
  .header-main.active .column-nav-container .nav-item .dp-c-l-ag .extend-link {
    display: inline-block
  }

  .header-main.active .column-nav-container .nav-item .dp-c-l-ag .box-item:focus-visible,
  .header-main.active .column-nav-container .nav-item .dp-c-l-ag .extend-link:focus-visible {
    border-radius: 4px;
    outline: 2px solid #fff;
    outline-offset: 2px
  }

  .header-main.active .column-nav-container .nav-item .dp-c-l-ag .box-item .item-box:focus-visible,
  .header-main.active .column-nav-container .nav-item .dp-c-l-ag .extend-link .item-box:focus-visible {
    border-radius: 4px;
    outline: 2px solid #fff;
    outline-offset: 2px
  }

  .header-main.active .column-nav-container .nav-item .dp-c-l-ag .box-item:before,
  .header-main.active .column-nav-container .nav-item .dp-c-l-ag .extend-link:before {
    display: none
  }

  .header-main.active .column-nav-container .nav-item .dp-c-l-ag .box-item .nav-hot-tag,
  .header-main.active .column-nav-container .nav-item .dp-c-l-ag .box-item .nav-hot-tag.only-column,
  .header-main.active .column-nav-container .nav-item .dp-c-l-ag .box-item .nav-new-tag,
  .header-main.active .column-nav-container .nav-item .dp-c-l-ag .box-item .nav-new-tag.only-column,
  .header-main.active .column-nav-container .nav-item .dp-c-l-ag .extend-link .nav-hot-tag,
  .header-main.active .column-nav-container .nav-item .dp-c-l-ag .extend-link .nav-hot-tag.only-column,
  .header-main.active .column-nav-container .nav-item .dp-c-l-ag .extend-link .nav-new-tag,
  .header-main.active .column-nav-container .nav-item .dp-c-l-ag .extend-link .nav-new-tag.only-column {
    display: inline-block
  }

  .header-main.active .column-nav-container .nav-item .dp-c-l-ag:not(.nav-boost-drop),
  .header-main.active .column-nav-container .nav-item .drop-c-right-align:not(.nav-boost-drop) {
    background: transparent;
    display: none;
    left: auto;
    opacity: 1;
    padding: 4px 0 4px 12px;
    position: relative;
    top: auto;
    transform: unset;
    visibility: visible;
    width: 100%
  }

  .header-main.active .column-nav-container .nav-item .dp-c-l-ag:not(.nav-boost-drop).drop-c-common-show,
  .header-main.active .column-nav-container .nav-item .drop-c-right-align:not(.nav-boost-drop).drop-c-common-show {
    opacity: 1;
    pointer-events: auto;
    top: 60px;
    visibility: visible
  }

  .header-main.active .column-nav-container .nav-item .dp-c-l-ag:not(.nav-boost-drop) .info-extend-box,
  .header-main.active .column-nav-container .nav-item .drop-c-right-align:not(.nav-boost-drop) .info-extend-box {
    flex-direction: column
  }

  .header-main.active .column-nav-container .nav-item .dp-c-l-ag:not(.nav-boost-drop) .info-extend-box .item-title,
  .header-main.active .column-nav-container .nav-item .drop-c-right-align:not(.nav-boost-drop) .info-extend-box .item-title {
    color: var(--oxnv-okd-color-content-secondary);
    display: inline-flex;
    font-size: 16px;
    height: 44px;
    padding: 14px 0;
    width: 100%
  }

  .header-main.active .column-nav-container .nav-item .dp-c-l-ag:not(.nav-boost-drop) .info-extend-box .item-title:hover,
  .header-main.active .column-nav-container .nav-item .drop-c-right-align:not(.nav-boost-drop) .info-extend-box .item-title:hover {
    background: transparent;
    color: var(--oxnv-okd-color-content-primary)
  }

  .header-main.active .column-nav-container .nav-item .dp-c-l-ag:not(.nav-boost-drop) .info-extend-box .tab-ms,
  .header-main.active .column-nav-container .nav-item .drop-c-right-align:not(.nav-boost-drop) .info-extend-box .tab-ms {
    color: #646f84;
    font-size: 14px;
    font-style: normal;
    font-weight: 400;
    line-height: 20px
  }

  .header-main.active .column-nav-container .nav-item .dp-c-l-ag:not(.nav-boost-drop) .extend-box,
  .header-main.active .column-nav-container .nav-item .drop-c-right-align:not(.nav-boost-drop) .extend-box {
    margin: 0;
    max-width: unset;
    min-width: unset;
    padding: 0;
    width: 100%
  }

  .header-main.active .column-nav-container .nav-item .dp-c-l-ag:not(.nav-boost-drop) .extend-box .box-title,
  .header-main.active .column-nav-container .nav-item .dp-c-l-ag:not(.nav-boost-drop) .extend-box .desc-box,
  .header-main.active .column-nav-container .nav-item .dp-c-l-ag:not(.nav-boost-drop) .extend-box .icon-box,
  .header-main.active .column-nav-container .nav-item .drop-c-right-align:not(.nav-boost-drop) .extend-box .box-title,
  .header-main.active .column-nav-container .nav-item .drop-c-right-align:not(.nav-boost-drop) .extend-box .desc-box,
  .header-main.active .column-nav-container .nav-item .drop-c-right-align:not(.nav-boost-drop) .extend-box .icon-box {
    display: none
  }

  .header-main.active .column-nav-container .nav-item .dp-c-l-ag:not(.nav-boost-drop) .extend-box .box-item,
  .header-main.active .column-nav-container .nav-item .drop-c-right-align:not(.nav-boost-drop) .extend-box .box-item {
    height: 44px;
    margin: 0
  }

  .header-main.active .column-nav-container .nav-item .dp-c-l-ag:not(.nav-boost-drop) .extend-box .box-item .item-title,
  .header-main.active .column-nav-container .nav-item .drop-c-right-align:not(.nav-boost-drop) .extend-box .box-item .item-title {
    color: var(--oxnv-okd-color-content-secondary);
    display: inline-flex;
    font-size: 16px;
    height: 44px;
    padding: 14px 0;
    width: 100%
  }

  .header-main.active .column-nav-container .nav-item .dp-c-l-ag:not(.nav-boost-drop) .extend-box .box-item .item-title:hover,
  .header-main.active .column-nav-container .nav-item .drop-c-right-align:not(.nav-boost-drop) .extend-box .box-item .item-title:hover {
    background: transparent;
    color: var(--oxnv-okd-color-content-primary)
  }

  .header-main.active .column-nav-container .nav-item .dp-c-l-ag:not(.nav-boost-drop) .extend-box .box-item .item-title.item-panel-drop-title,
  .header-main.active .column-nav-container .nav-item .drop-c-right-align:not(.nav-boost-drop) .extend-box .box-item .item-title.item-panel-drop-title {
    max-width: 270px;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap
  }

  .header-main.active .column-nav-container .nav-item .dp-c-l-ag:not(.nav-boost-drop) .extend-box .box-item .item-title.title-without-tag,
  .header-main.active .column-nav-container .nav-item .drop-c-right-align:not(.nav-boost-drop) .extend-box .box-item .item-title.title-without-tag {
    display: inline-block
  }

  .header-main.active .column-nav-container .nav-item .dp-c-l-ag:not(.nav-boost-drop) .extend-small-box .box-item,
  .header-main.active .column-nav-container .nav-item .drop-c-right-align:not(.nav-boost-drop) .extend-small-box .box-item {
    color: var(--oxnv-okd-color-content-secondary);
    display: inline-flex;
    font-size: 16px;
    height: 44px;
    margin: 0;
    padding: 14px 0;
    width: 100%
  }

  .header-main.active .column-nav-container .nav-item .dp-c-l-ag:not(.nav-boost-drop) .extend-small-box .box-item:hover,
  .header-main.active .column-nav-container .nav-item .drop-c-right-align:not(.nav-boost-drop) .extend-small-box .box-item:hover {
    background: transparent;
    color: var(--oxnv-okd-color-content-primary)
  }

  .header-main.active .column-nav-container .nav-item .dp-c-l-ag .extend-box .box-item {
    width: 100%
  }

  .header-main.active .column-nav-container .pc-mode {
    display: none
  }

  .header-main.active .column-nav-container .extend-link {
    color: var(--oxnv-okd-color-content-secondary);
    cursor: pointer;
    display: inline-flex;
    font-size: 16px;
    height: 44px;
    padding: 14px 0;
    width: 100%
  }

  .header-main.active .column-nav-container .extend-link:hover {
    background: transparent;
    color: var(--oxnv-okd-color-content-primary)
  }

  .header-main.active .column-nav-container .extend-link:focus-visible {
    border-radius: 4px;
    outline: 2px solid #fff;
    outline-offset: 2px
  }

  .header-main.active .column-nav-container .extend-link .icon {
    font-size: 16px;
    margin-left: 4px;
    position: relative;
    top: 1px
  }

  .header-main.active .column-nav-container .nav-scroll-box .asset-bottom-line,
  .header-main.active .column-nav-container .nav-scroll-box .nav-item.is-user,
  .header-main.active .column-nav-container .nav-scroll-box .nav-item.nav-balance,
  .header-main.active .column-nav-container .nav-scroll-box .profile-wrap,
  .header-main.active .column-nav-container.asset-active .nav-scroll-box .nav-item.is-left,
  .header-main.active .column-nav-container.asset-active .nav-scroll-box .nav-item.nav-mode,
  .header-main.active .column-nav-container.asset-active .nav-scroll-box .nav-language-column,
  .header-main.active .column-nav-container.asset-active .nav-scroll-box .nav-mobile-download {
    display: none
  }

  .header-main.active .column-nav-container.asset-active .nav-scroll-box .asset-bottom-line,
  .header-main.active .column-nav-container.asset-active .nav-scroll-box .nav-balance,
  .header-main.active .column-nav-container.asset-active .nav-scroll-box .nav-item.is-user,
  .header-main.active .column-nav-container.asset-active .nav-scroll-box .profile-wrap {
    display: flex
  }

  .header-main.active[data-shrink-step="0"] .column-nav-container {
    display: none
  }

  body .header-container .header-wrap .header-main .nav-container .nav-doc .dp-c-l-ag .extend-box,
  body .header-container .header-wrap .header-main .nav-discovery .dp-c-l-ag .extend-box {
    margin-right: 0
  }

  body .header-container .header-wrap .header-main .nav-container .nav-doc .dp-c-l-ag .extend-box .explorer-drop-panel-third-list .box-item.drop-panel-box-item,
  body .header-container .header-wrap .header-main .nav-discovery .dp-c-l-ag .extend-box .explorer-drop-panel-third-list .box-item.drop-panel-box-item {
    display: flex;
    width: unset
  }

  body .header-container .header-wrap .header-main .nav-container .nav-doc .dp-c-l-ag .extend-box .box-item,
  body .header-container .header-wrap .header-main .nav-discovery .dp-c-l-ag .extend-box .box-item {
    display: flex;
    margin: unset;
    max-width: 342px
  }

  body .header-container .header-wrap .header-main .nav-container .nav-doc .dp-c-l-ag .extend-box .box-item.panel-box-item,
  body .header-container .header-wrap .header-main .nav-discovery .dp-c-l-ag .extend-box .box-item.panel-box-item {
    display: inline-flex;
    vertical-align: middle;
    width: 264px
  }
}

@media (min-width:1024px) {

  body .header-container .header-wrap .header-main .nav-container .nav-doc .dp-c-l-ag .extend-box .box-item.panel-box-item:not(:has(+.panel-drop-item-icon)):not(.third-box-item),
  body .header-container .header-wrap .header-main .nav-discovery .dp-c-l-ag .extend-box .box-item.panel-box-item:not(:has(+.panel-drop-item-icon)):not(.third-box-item) {
    width: 288px
  }

  body .header-container .header-wrap .header-main .nav-container .nav-doc .dp-c-l-ag .extend-box .box-item .icon-box,
  body .header-container .header-wrap .header-main .nav-discovery .dp-c-l-ag .extend-box .box-item .icon-box {
    margin-right: 8px;
    margin-top: -4px
  }

  body .header-container .header-wrap .header-main .nav-container .nav-doc .dp-c-l-ag .extend-box .box-item .item-box,
  body .header-container .header-wrap .header-main .nav-discovery .dp-c-l-ag .extend-box .box-item .item-box {
    display: flex;
    flex-direction: column;
    width: 100%
  }

  body .header-container .header-wrap .header-main .nav-container .nav-doc .dp-c-l-ag .extend-box .box-item .item-box.hide,
  body .header-container .header-wrap .header-main .nav-discovery .dp-c-l-ag .extend-box .box-item .item-box.hide {
    display: none
  }

  body .header-container .header-wrap .header-main .nav-container .nav-doc .dp-c-l-ag .extend-box .box-item .item-box.show,
  body .header-container .header-wrap .header-main .nav-container .nav-doc .dp-c-l-ag .only-new-box,
  body .header-container .header-wrap .header-main .nav-discovery .dp-c-l-ag .extend-box .box-item .item-box.show,
  body .header-container .header-wrap .header-main .nav-discovery .dp-c-l-ag .only-new-box {
    display: block
  }

  body .header-container .header-wrap .header-main .nav-container .nav-doc .dp-c-l-ag,
  body .header-container .header-wrap .header-main .nav-discovery .dp-c-l-ag {
    left: 50%;
    padding-bottom: 12px;
    padding-top: 12px;
    transform: translateX(-50%)
  }

  body .header-container .header-wrap .header-main .nav-container .nav-doc .dp-c-l-ag.drop-panel,
  body .header-container .header-wrap .header-main .nav-discovery .dp-c-l-ag.drop-panel {
    overflow: visible
  }

  body .header-container .header-wrap .header-main .nav-container .nav-doc .dp-c-l-ag .extend-box,
  body .header-container .header-wrap .header-main .nav-discovery .dp-c-l-ag .extend-box {
    min-width: 320px
  }

  body .header-container .header-wrap .header-main .nav-container .nav-doc .dp-c-l-ag .extend-box.drop-extend-box,
  body .header-container .header-wrap .header-main .nav-discovery .dp-c-l-ag .extend-box.drop-extend-box {
    min-width: auto
  }

  body .header-container .header-wrap .header-main .nav-container .nav-doc .dp-c-l-ag .extend-box .box-item,
  body .header-container .header-wrap .header-main .nav-discovery .dp-c-l-ag .extend-box .box-item {
    align-items: center;
    max-width: 400px
  }

  body .header-container .header-wrap .header-main .nav-container .nav-doc .dp-c-l-ag .extend-box .box-item.drop-panel-box-item,
  body .header-container .header-wrap .header-main .nav-discovery .dp-c-l-ag .extend-box .box-item.drop-panel-box-item {
    padding: 12px 8px
  }

  body .header-container .header-wrap .header-main .nav-container .nav-doc .dp-c-l-ag .extend-box .box-item .item-box .item-panel-drop-desc,
  body .header-container .header-wrap .header-main .nav-discovery .dp-c-l-ag .extend-box .box-item .item-box .item-panel-drop-desc {
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap
  }

  body .header-container .header-wrap .header-main .nav-container .nav-doc .dp-c-l-ag .extend-box:last-child,
  body .header-container .header-wrap .header-main .nav-discovery .dp-c-l-ag .extend-box:last-child {
    margin-right: 0
  }

  body .header-container .header-wrap .header-main .nav-container .nav-doc .dp-c-l-ag .extend-box .drop-menu-desc-list,
  body .header-container .header-wrap .header-main .nav-discovery .dp-c-l-ag .extend-box .drop-menu-desc-list {
    box-sizing: border-box;
    display: flex;
    padding-left: 52px;
    width: 100%
  }

  body .header-container .header-wrap .header-main .nav-container .nav-doc .dp-c-l-ag .extend-box .drop-menu-desc-list .drop-menu-list-item,
  body .header-container .header-wrap .header-main .nav-discovery .dp-c-l-ag .extend-box .drop-menu-desc-list .drop-menu-list-item {
    width: 172px
  }

  body .header-container .header-wrap .header-main .nav-container .nav-doc .dp-c-l-ag .extend-box .drop-menu-desc-list .drop-menu-list-item.drop-menu-reverse-list,
  body .header-container .header-wrap .header-main .nav-discovery .dp-c-l-ag .extend-box .drop-menu-desc-list .drop-menu-list-item.drop-menu-reverse-list {
    display: flex;
    flex-direction: column-reverse
  }

  body .header-container .header-wrap .header-main .nav-container .nav-doc .dp-c-l-ag .extend-box .drop-menu-desc-list .drop-menu-list-item .drop-menu-item,
  body .header-container .header-wrap .header-main .nav-discovery .dp-c-l-ag .extend-box .drop-menu-desc-list .drop-menu-list-item .drop-menu-item {
    border-radius: 4px;
    box-sizing: border-box;
    color: var(--oxnv-okd-color-content-primary);
    display: block;
    font-size: 14px;
    font-weight: 400;
    line-height: 16px;
    padding: 11px 4px 11px 21px;
    position: relative
  }

  body .header-container .header-wrap .header-main .nav-container .nav-doc .dp-c-l-ag .extend-box .drop-menu-desc-list .drop-menu-list-item .drop-menu-item:focus-visible,
  body .header-container .header-wrap .header-main .nav-discovery .dp-c-l-ag .extend-box .drop-menu-desc-list .drop-menu-list-item .drop-menu-item:focus-visible {
    border-radius: 4px;
    outline: 2px solid #000;
    outline-offset: 2px
  }

  body .header-container .header-wrap .header-main .nav-container .nav-doc .dp-c-l-ag .extend-box .drop-menu-desc-list .drop-menu-list-item .drop-menu-item:before,
  body .header-container .header-wrap .header-main .nav-discovery .dp-c-l-ag .extend-box .drop-menu-desc-list .drop-menu-list-item .drop-menu-item:before {
    background: var(--oxnv-okd-color-content-primary);
    border-radius: 50%;
    content: "";
    display: block;
    font-size: 12px;
    height: 5px;
    left: 8px;
    position: absolute;
    top: 16px;
    width: 5px
  }

  body .header-container .header-wrap .header-main .nav-container .nav-doc .dp-c-l-ag .extend-box .drop-menu-desc-list .drop-menu-list-item .drop-menu-item:hover,
  body .header-container .header-wrap .header-main .nav-discovery .dp-c-l-ag .extend-box .drop-menu-desc-list .drop-menu-list-item .drop-menu-item:hover {
    background: #f9f9f9;
    background: var(--header-lg-drop-box-item-bg-hover)
  }

  body .header-container .header-wrap .header-main .nav-container .nav-doc .dp-c-l-ag .extend-box .drop-menu-desc-list .drop-menu-list-item .drop-menu-item .nav-new-tag,
  body .header-container .header-wrap .header-main .nav-discovery .dp-c-l-ag .extend-box .drop-menu-desc-list .drop-menu-list-item .drop-menu-item .nav-new-tag {
    margin-left: 0
  }

  body .header-container .header-wrap .header-main .nav-container .nav-doc .dp-c-l-ag .extend-box .drop-menu-desc-list .drop-menu-list-item .drop-menu-item .new-tag-title-container,
  body .header-container .header-wrap .header-main .nav-discovery .dp-c-l-ag .extend-box .drop-menu-desc-list .drop-menu-list-item .drop-menu-item .new-tag-title-container {
    margin-right: 5px
  }
}

.nav-r-pan-i {
  align-items: center;
  background: var(--oxnv-okd-color-background-surface-primary);
  border-radius: 8px;
  color: var(--oxnv-okd-color-content-primary);
  cursor: pointer;
  display: flex;
  font-size: 20px;
  height: 36px;
  justify-content: center;
  margin-top: 12px;
  padding: 10px;
  width: 36px
}

.web3-menu-btn {
  margin-left: 8px
}

@media (max-width:767px) {
  .web3-menu-btn {
    margin-left: 0
  }
}

.nav-r-pan {
  display: block;
  position: relative;
  text-align: left
}

.nav-r-pan:hover .nav-r-pan-i {
  background: var(--oxnv-okd-color-background-surface-pressed)
}

@media (min-width:1024px) {
  .nav-r-pan {
    display: flex
  }
}

.nav-r-pan .nav-r-fun-pan {
  background: var(--oxnv-okd-color-container-primary);
  border: 1px solid var(--oxnv-okd-color-border-primary);
  border-radius: 12px;
  box-shadow: 0 20px 25px 0 rgba(0, 0, 0, .1), 0 10px 10px 0 rgba(0, 0, 0, .04);
  min-height: 325px;
  opacity: 0;
  overflow: hidden;
  padding: 16px 8px;
  position: absolute;
  right: 0;
  top: 54px;
  transition: all .3s cubic-bezier(.645, .045, .355, 1);
  visibility: hidden;
  z-index: -1
}

.nav-r-pan .nav-r-fun-pan.nav-r-fun-pan-show {
  opacity: 1;
  top: 60px;
  visibility: visible;
  z-index: 20001
}

.nav-r-pan .nav-r-container {
  opacity: 0;
  position: absolute;
  z-index: -100
}

.nav-r-pan .nav-r-pan-page {
  background-color: var(--oxnv-okd-color-container-primary);
  max-height: 450px;
  overflow-y: scroll;
  width: 270px
}

.nav-r-pan .nav-r-pan-page.nav-r-pan-download {
  overflow-y: visible
}

.nav-r-pan .nav-r-pan-page .nav-r-pan-option-list {
  margin-top: 10px
}

.nav-r-pan .nav-r-pan-page .nav-r-pan-option-item {
  align-items: center;
  color: var(--oxnv-okd-color-content-tertiary);
  cursor: pointer;
  display: flex;
  font-size: 14px;
  font-weight: 500;
  justify-content: space-between;
  line-height: 22px;
  padding: 10px 8px
}

.nav-r-pan .nav-r-pan-page .nav-r-pan-option-item.nav-r-selec-item,
.nav-r-pan .nav-r-pan-page .nav-r-pan-option-item:hover {
  color: var(--oxnv-okd-color-content-primary)
}

.nav-r-pan .nav-r-pan-page .nav-r-pan-download-area .nav-r-pan-qrcode-content {
  margin-top: 18px;
  position: relative;
  text-align: center
}

.nav-r-pan .nav-r-pan-page .nav-r-pan-download-area .nav-r-pan-qrcode-content .nav-pan-download-qrcode {
  height: 150px;
  width: 150px
}

.nav-r-pan .nav-r-pan-page .nav-r-pan-download-area .nav-r-pan-qrcode-content .nav-pan-download-web3 {
  bottom: 0;
  height: 36px;
  left: 0;
  margin: auto;
  position: absolute;
  right: 0;
  top: 0;
  width: 36px
}

.nav-r-pan .nav-r-pan-page .nav-r-pan-download-area .nav-pan-download-txt {
  color: var(--oxnv-okd-color-content-primary);
  font-size: 14px;
  font-weight: 400;
  line-height: 22px;
  margin-top: 12px;
  text-align: center
}

.nav-r-pan .nav-r-pan-page .nav-r-pan-download-area .nav-r-pan-download-way {
  display: flex;
  flex-wrap: wrap;
  justify-content: space-between;
  margin: 20px 8px
}

.nav-r-pan .nav-r-pan-page .nav-r-pan-download-area .nav-r-pan-download-way .nav-r-pan-download-item {
  align-items: center;
  background: var(--oxnv-okd-color-background-surface-primary);
  border-radius: 40px;
  color: var(--oxnv-okd-color-content-primary);
  cursor: pointer;
  display: flex;
  font-size: 12px;
  font-weight: 400;
  gap: 12px;
  justify-content: center;
  line-height: 18px;
  margin-bottom: 8px;
  min-width: 118px;
  padding: 8px 12px
}

.nav-r-pan .nav-r-pan-page .nav-r-pan-download-area .nav-r-pan-download-way .nav-r-pan-download-item .nav-r-pan-download-icon {
  font-size: 18px
}

.nav-r-pan .nav-r-pan-page .nav-r-pan-download-area .nav-r-pan-download-way .nav-r-pan-download-item.nav-r-pan-download-disabled {
  color: var(--oxnv-okd-color-content-disabled);
  cursor: not-allowed
}

.nav-r-pan .nav-r-pan-page .nav-r-pan-download-area .nav-r-pan-download-learn {
  align-items: center;
  color: var(--oxnv-okd-color-content-primary);
  display: flex;
  flex-direction: row-reverse;
  font-size: 14px;
  font-weight: 500;
  justify-content: flex-end;
  line-height: 16px;
  padding: 0 8px 8px
}

.nav-r-pan .nav-r-pan-page .nav-r-pan-download-area .nav-r-pan-download-learn:before {
  font-size: 16px
}

.nav-r-pan .nav-r-pan-page .nav-r-pan-support {
  margin-top: 10px
}

.nav-r-pan .nav-r-pan-page .nav-r-pan-support .nav-r-pan-sup-link {
  align-items: center;
  color: var(--oxnv-okd-color-content-primary);
  display: flex;
  flex-direction: row-reverse;
  font-size: 14px;
  font-weight: 400;
  justify-content: space-between;
  line-height: 22px;
  padding: 10px 8px
}

.nav-r-pan .nav-r-pan-page .nav-r-pan-support .nav-r-pan-sup-link:before {
  color: var(--oxnv-okd-color-content-contrast);
  font-size: 12px
}

.nav-r-pan .nav-fun-show {
  animation: slide .2s linear forwards
}

.nav-r-pan .nav-r-pan-item {
  align-items: center;
  border-radius: 8px;
  cursor: pointer;
  display: flex;
  justify-content: space-between;
  line-height: 22px;
  margin-bottom: 4px;
  padding: 10px 8px;
  width: 270px
}

.nav-r-pan .nav-r-pan-item:hover:not(:first-child) {
  background-color: var(--oxnv-okd-color-background-surface-primary)
}

.nav-r-pan .nav-r-pan-item .nav-r-item-name {
  color: var(--oxnv-okd-color-content-primary);
  font-size: 14px;
  font-weight: 500;
  line-height: 22px;
  max-width: 150px
}

.nav-r-pan .nav-r-pan-item .nav-r-theme-box {
  background: var(--oxnv-okd-color-background-surface-primary);
  border-radius: 8px;
  display: flex;
  gap: 2px;
  padding: 2px
}

.nav-r-pan .nav-r-pan-item .nav-r-theme-box .nav-r-theme-item {
  border-radius: 6px;
  color: var(--oxnv-okd-color-content-contrast);
  cursor: pointer;
  padding: 4px 8px
}

.nav-r-pan .nav-r-pan-item .nav-r-theme-box .nav-r-theme-item.nav-r-th-it-sel,
.nav-r-pan .nav-r-pan-item .nav-r-theme-box .nav-r-theme-item:hover {
  background-color: var(--oxnv-okd-color-background-base-primary);
  color: var(--oxnv-okd-color-content-primary)
}

.nav-r-pan .nav-r-pan-item .nav-r-theme-box .nav-r-theme-item .icon {
  font-size: 16px
}

.nav-r-pan .nav-r-pan-item .nav-r-lan-cur {
  color: var(--oxnv-okd-color-content-contrast);
  cursor: pointer;
  display: flex;
  flex-direction: row-reverse;
  font-size: 12px;
  font-weight: 400;
  line-height: 16px
}

.nav-r-pan .nav-r-notc .notc-item {
  display: block;
  font-size: 12px;
  font-weight: 400;
  line-height: 18px;
  padding: 4px 8px
}

.nav-r-pan .nav-r-notc .notc-title {
  color: var(--oxnv-okd-color-content-tertiary)
}

.nav-r-pan .nav-r-notc .notc-date {
  color: var(--oxnv-okd-color-content-contrast)
}

.nav-r-pan .nav-r-pan-co-pre {
  cursor: pointer
}

.nav-r-pan .nav-r-pan-co-pre .nav-r-pan-co-pre-icon {
  align-items: center;
  display: flex;
  flex-direction: row-reverse
}

.nav-r-pan .nav-r-pan-co-pre .nav-r-pan-co-pre-icon:before {
  margin-left: 4px
}

.nav-r-pan .okx-header-footer-okds-pointer_up,
.nav-r-pan .okx-header-footer-pointer-down {
  font-size: 16px
}

.nav-r-pan .okx-header-footer-okds-pointer_up:last-child,
.nav-r-pan .okx-header-footer-pointer-down:last-child {
  margin-left: 4px
}

.nav-r-pan.nav-r-pan-column {
  border-top: 1px solid var(--oxnv-okd-color-border-primary);
  flex-direction: column;
  margin-top: 8px
}

.nav-r-pan.nav-r-pan-column .nav-r-pan-item {
  cursor: pointer;
  margin-bottom: 0;
  padding: 17px 0;
  width: 100%
}

.nav-r-pan.nav-r-pan-column .nav-r-pan-item:first-child {
  margin-top: 8px
}

.nav-r-pan.nav-r-pan-column .nav-r-pan-item:hover:not(:first-child) {
  background-color: initial
}

.nav-r-pan.nav-r-pan-column .nav-r-pan-item .nav-r-item-name {
  color: var(--oxnv-okd-color-content-primary);
  font-size: 18px;
  line-height: 18px;
  max-width: 300px
}

.nav-r-pan.nav-r-pan-column .nav-r-pan-item .nav-r-theme-box .nav-r-theme-item {
  line-height: 16px;
  padding: 4px 16px
}

.nav-r-pan.nav-r-pan-column .nav-r-pan-item .nav-r-theme-box .nav-r-theme-item .icon {
  display: block;
  height: 16px
}

.nav-r-pan .nav-r-bk-area {
  background-color: var(--oxnv-okd-color-container-primary);
  color: var(--oxnv-okd-color-content-primary);
  cursor: pointer;
  font-size: 14px;
  font-weight: 500;
  left: 0;
  line-height: 22px;
  position: -webkit-sticky;
  position: sticky;
  right: 0;
  top: 0;
  z-index: 2
}

.nav-r-pan .nav-r-bk-area .nav-r-bk {
  display: inline-block;
  font-size: 18px;
  margin-right: 4px;
  transform: rotate(180deg)
}

.nav-r-split-line {
  background-color: var(--oxnv-okd-color-border-primary);
  height: 1px;
  margin: 8px 0
}

@keyframes slide {
  0% {
    opacity: 0;
    position: static;
    z-index: 1
  }

  50% {
    opacity: .5
  }

  to {
    opacity: 1;
    position: static;
    z-index: 1
  }
}

.color-preference-profit-global {
  color: var(--global-color-surface-pnl-profit-graph)
}

.color-preference-loss-global {
  color: var(--global-color-surface-pnl-loss-graph)
}

.color-preference-loss {
  color: var(--oxnv-okd-color-surface-pnl-loss-graph)
}

.color-preference-profit {
  color: var(--oxnv-okd-color-surface-pnl-profit-graph)
}

.icon-pointer-up {
  display: inline-block;
  transform: rotate(180deg)
}

.nav-r-color-pre-page .nav-r-color-panel {
  margin: 16px 4px 16px 8px
}

.nav-r-color-pre-page .nav-r-color-panel .nav-r-color-title {
  color: var(--oxnv-okd-color-content-primary);
  font-size: 14px;
  font-weight: 500;
  line-height: 22px;
  margin-bottom: 8px
}

:root {
  --header-drop-third-bg-color: #fff;
  --header-drop-third-border-color: #ebebeb;
  --header-lg-drop-box-item-title-hover: var(--oxnv-okd-color-content-primary);
  --header-lg-drop-box-item-bg-hover: #f9f9f9;
  --header-drop-container-border-radius: 6px
}

.drop-c-common-show {
  opacity: 1;
  pointer-events: auto;
  top: 60px;
  visibility: visible
}

.header-main.web3-header .dp-c-l-ag:not(.nav-boost-drop),
.header-main.web3-header .drop-c-right-align:not(.nav-boost-drop) {
  display: block;
  width: auto
}

.header-main.web3-header .dp-c-l-ag:not(.nav-boost-drop) .info-extend-box,
.header-main.web3-header .drop-c-right-align:not(.nav-boost-drop) .info-extend-box {
  flex-direction: row
}

.header-main.web3-header .dp-c-l-ag:not(.nav-boost-drop) .info-extend-box .box-title,
.header-main.web3-header .drop-c-right-align:not(.nav-boost-drop) .info-extend-box .box-title {
  display: block
}

@media (max-width:1023px) {

  .header-main .dp-c-l-ag:not(.nav-boost-drop),
  .header-main .drop-c-right-align:not(.nav-boost-drop) {
    background: transparent;
    display: none;
    left: auto;
    opacity: 1;
    padding: 4px 0 4px 12px;
    position: relative;
    top: auto;
    transform: unset;
    visibility: visible;
    width: 100%
  }

  .header-main .dp-c-l-ag:not(.nav-boost-drop).drop-c-common-show,
  .header-main .drop-c-right-align:not(.nav-boost-drop).drop-c-common-show {
    opacity: 1;
    pointer-events: auto;
    top: 60px;
    visibility: visible
  }

  .header-main .dp-c-l-ag:not(.nav-boost-drop) .info-extend-box,
  .header-main .drop-c-right-align:not(.nav-boost-drop) .info-extend-box {
    flex-direction: column
  }

  .header-main .dp-c-l-ag:not(.nav-boost-drop) .info-extend-box .item-title,
  .header-main .drop-c-right-align:not(.nav-boost-drop) .info-extend-box .item-title {
    color: var(--oxnv-okd-color-content-secondary);
    display: inline-flex;
    font-size: 16px;
    height: 44px;
    padding: 14px 0;
    width: 100%
  }

  .header-main .dp-c-l-ag:not(.nav-boost-drop) .info-extend-box .item-title:hover,
  .header-main .drop-c-right-align:not(.nav-boost-drop) .info-extend-box .item-title:hover {
    background: transparent;
    color: var(--oxnv-okd-color-content-primary)
  }

  .header-main .dp-c-l-ag:not(.nav-boost-drop) .info-extend-box .tab-ms,
  .header-main .drop-c-right-align:not(.nav-boost-drop) .info-extend-box .tab-ms {
    color: #646f84;
    font-size: 14px;
    font-style: normal;
    font-weight: 400;
    line-height: 20px
  }

  .header-main .dp-c-l-ag:not(.nav-boost-drop) .extend-box,
  .header-main .drop-c-right-align:not(.nav-boost-drop) .extend-box {
    margin: 0;
    max-width: unset;
    min-width: unset;
    padding: 0;
    width: 100%
  }

  .header-main .dp-c-l-ag:not(.nav-boost-drop) .extend-box .box-title,
  .header-main .dp-c-l-ag:not(.nav-boost-drop) .extend-box .desc-box,
  .header-main .dp-c-l-ag:not(.nav-boost-drop) .extend-box .icon-box,
  .header-main .drop-c-right-align:not(.nav-boost-drop) .extend-box .box-title,
  .header-main .drop-c-right-align:not(.nav-boost-drop) .extend-box .desc-box,
  .header-main .drop-c-right-align:not(.nav-boost-drop) .extend-box .icon-box {
    display: none
  }

  .header-main .dp-c-l-ag:not(.nav-boost-drop) .extend-box .box-item,
  .header-main .drop-c-right-align:not(.nav-boost-drop) .extend-box .box-item {
    height: 44px;
    margin: 0
  }

  .header-main .dp-c-l-ag:not(.nav-boost-drop) .extend-box .box-item .item-title,
  .header-main .drop-c-right-align:not(.nav-boost-drop) .extend-box .box-item .item-title {
    color: var(--oxnv-okd-color-content-secondary);
    display: inline-flex;
    font-size: 16px;
    height: 44px;
    padding: 14px 0;
    width: 100%
  }

  .header-main .dp-c-l-ag:not(.nav-boost-drop) .extend-box .box-item .item-title:hover,
  .header-main .drop-c-right-align:not(.nav-boost-drop) .extend-box .box-item .item-title:hover {
    background: transparent;
    color: var(--oxnv-okd-color-content-primary)
  }

  .header-main .dp-c-l-ag:not(.nav-boost-drop) .extend-box .box-item .item-title.item-panel-drop-title,
  .header-main .drop-c-right-align:not(.nav-boost-drop) .extend-box .box-item .item-title.item-panel-drop-title {
    max-width: 270px;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap
  }

  .header-main .dp-c-l-ag:not(.nav-boost-drop) .extend-box .box-item .item-title.title-without-tag,
  .header-main .drop-c-right-align:not(.nav-boost-drop) .extend-box .box-item .item-title.title-without-tag {
    display: inline-block
  }

  .header-main .dp-c-l-ag:not(.nav-boost-drop) .extend-small-box .box-item,
  .header-main .drop-c-right-align:not(.nav-boost-drop) .extend-small-box .box-item {
    color: var(--oxnv-okd-color-content-secondary);
    display: inline-flex;
    font-size: 16px;
    height: 44px;
    margin: 0;
    padding: 14px 0;
    width: 100%
  }

  .header-main .dp-c-l-ag:not(.nav-boost-drop) .extend-small-box .box-item:hover,
  .header-main .drop-c-right-align:not(.nav-boost-drop) .extend-small-box .box-item:hover {
    background: transparent;
    color: var(--oxnv-okd-color-content-primary)
  }

  .header-main .column-nav-container .nav-scroll-box {
    display: flex;
    flex-direction: row;
    flex-grow: 1;
    justify-content: flex-end;
    padding: 0;
    top: 0;
    width: auto
  }

  .header-main .column-nav-container .nav-scroll-box::-webkit-scrollbar {
    display: none
  }

  .header-main .column-nav-container .mode-xl-line,
  .header-main .column-nav-container .nav-academy,
  .header-main .column-nav-container .nav-balance,
  .header-main .column-nav-container .nav-buy,
  .header-main .column-nav-container .nav-cefi-market,
  .header-main .column-nav-container .nav-custom,
  .header-main .column-nav-container .nav-dashboard,
  .header-main .column-nav-container .nav-deposit,
  .header-main .column-nav-container .nav-earn,
  .header-main .column-nav-container .nav-explorer .nav-nft,
  .header-main .column-nav-container .nav-institutions,
  .header-main .column-nav-container .nav-language,
  .header-main .column-nav-container .nav-leaderboard,
  .header-main .column-nav-container .nav-market,
  .header-main .column-nav-container .nav-meme-pump,
  .header-main .column-nav-container .nav-mobile-download,
  .header-main .column-nav-container .nav-mode,
  .header-main .column-nav-container .nav-more,
  .header-main .column-nav-container .nav-nft,
  .header-main .column-nav-container .nav-okc,
  .header-main .column-nav-container .nav-portfolio,
  .header-main .column-nav-container .nav-referral,
  .header-main .column-nav-container .nav-signal,
  .header-main .column-nav-container .nav-site-flag,
  .header-main .column-nav-container .nav-smsf,
  .header-main .column-nav-container .nav-swap,
  .header-main .column-nav-container .nav-tracker,
  .header-main .column-nav-container .nav-trade,
  .header-main .column-nav-container .nav-user,
  .header-main .column-nav-container .nav-web3-more,
  .header-main .column-nav-container .other-wrap,
  .header-main .column-nav-container .pc-mode,
  .header-main .column-nav-container .profile-wrap,
  .header-main .column-nav-container .user-info-item {
    display: none
  }

  .header-main .column-nav-container .mode-line {
    background: hsla(0, 0%, 100%, .15);
    display: none;
    height: 16px;
    margin: 16px;
    width: 1px
  }

  .header-main .column-nav-container .mode-line.has-address {
    display: block
  }

  .header-main .column-nav-container .mode-no-login {
    display: none
  }

  .header-main.active .column-nav-container {
    z-index: 9500
  }

  .header-main.active .column-nav-container.web3-column-container {
    display: block
  }

  .header-main.active .column-nav-container.web3-column-container .col-mu-top {
    align-items: center;
    display: flex;
    justify-content: space-between;
    padding: 22px 16px
  }

  .header-main.active .column-nav-container.web3-column-container .nav-item .nav-link,
  .header-main.active .column-nav-container.web3-column-container .nav-item .nav-text.mu-txt,
  .header-main.active .column-nav-container.web3-column-container .nav-item.nav-link {
    font-weight: 500
  }

  .header-main.active .column-nav-container .nav-item .dp-c-l-ag:not(.nav-boost-drop),
  .header-main.active .column-nav-container .nav-item .drop-c-right-align:not(.nav-boost-drop) {
    background: transparent;
    display: none;
    left: auto;
    opacity: 1;
    padding: 4px 0 4px 12px;
    position: relative;
    top: auto;
    transform: unset;
    visibility: visible;
    width: 100%
  }

  .header-main.active .column-nav-container .nav-item .dp-c-l-ag:not(.nav-boost-drop).drop-c-common-show,
  .header-main.active .column-nav-container .nav-item .drop-c-right-align:not(.nav-boost-drop).drop-c-common-show {
    opacity: 1;
    pointer-events: auto;
    top: 60px;
    visibility: visible
  }

  .header-main.active .column-nav-container .nav-item .dp-c-l-ag:not(.nav-boost-drop) .info-extend-box,
  .header-main.active .column-nav-container .nav-item .drop-c-right-align:not(.nav-boost-drop) .info-extend-box {
    flex-direction: column
  }

  .header-main.active .column-nav-container .nav-item .dp-c-l-ag:not(.nav-boost-drop) .info-extend-box .item-title,
  .header-main.active .column-nav-container .nav-item .drop-c-right-align:not(.nav-boost-drop) .info-extend-box .item-title {
    color: var(--oxnv-okd-color-content-secondary);
    display: inline-flex;
    font-size: 16px;
    height: 44px;
    padding: 14px 0;
    width: 100%
  }

  .header-main.active .column-nav-container .nav-item .dp-c-l-ag:not(.nav-boost-drop) .info-extend-box .item-title:hover,
  .header-main.active .column-nav-container .nav-item .drop-c-right-align:not(.nav-boost-drop) .info-extend-box .item-title:hover {
    background: transparent;
    color: var(--oxnv-okd-color-content-primary)
  }

  .header-main.active .column-nav-container .nav-item .dp-c-l-ag:not(.nav-boost-drop) .info-extend-box .tab-ms,
  .header-main.active .column-nav-container .nav-item .drop-c-right-align:not(.nav-boost-drop) .info-extend-box .tab-ms {
    color: #646f84;
    font-size: 14px;
    font-style: normal;
    font-weight: 400;
    line-height: 20px
  }

  .header-main.active .column-nav-container .nav-item .dp-c-l-ag:not(.nav-boost-drop) .extend-box,
  .header-main.active .column-nav-container .nav-item .drop-c-right-align:not(.nav-boost-drop) .extend-box {
    margin: 0;
    max-width: unset;
    min-width: unset;
    padding: 0;
    width: 100%
  }

  .header-main.active .column-nav-container .nav-item .dp-c-l-ag:not(.nav-boost-drop) .extend-box .box-title,
  .header-main.active .column-nav-container .nav-item .dp-c-l-ag:not(.nav-boost-drop) .extend-box .desc-box,
  .header-main.active .column-nav-container .nav-item .dp-c-l-ag:not(.nav-boost-drop) .extend-box .icon-box,
  .header-main.active .column-nav-container .nav-item .drop-c-right-align:not(.nav-boost-drop) .extend-box .box-title,
  .header-main.active .column-nav-container .nav-item .drop-c-right-align:not(.nav-boost-drop) .extend-box .desc-box,
  .header-main.active .column-nav-container .nav-item .drop-c-right-align:not(.nav-boost-drop) .extend-box .icon-box {
    display: none
  }

  .header-main.active .column-nav-container .nav-item .dp-c-l-ag:not(.nav-boost-drop) .extend-box .box-item,
  .header-main.active .column-nav-container .nav-item .drop-c-right-align:not(.nav-boost-drop) .extend-box .box-item {
    height: 44px;
    margin: 0
  }

  .header-main.active .column-nav-container .nav-item .dp-c-l-ag:not(.nav-boost-drop) .extend-box .box-item .item-title,
  .header-main.active .column-nav-container .nav-item .drop-c-right-align:not(.nav-boost-drop) .extend-box .box-item .item-title {
    color: var(--oxnv-okd-color-content-secondary);
    display: inline-flex;
    font-size: 16px;
    height: 44px;
    padding: 14px 0;
    width: 100%
  }

  .header-main.active .column-nav-container .nav-item .dp-c-l-ag:not(.nav-boost-drop) .extend-box .box-item .item-title:hover,
  .header-main.active .column-nav-container .nav-item .drop-c-right-align:not(.nav-boost-drop) .extend-box .box-item .item-title:hover {
    background: transparent;
    color: var(--oxnv-okd-color-content-primary)
  }

  .header-main.active .column-nav-container .nav-item .dp-c-l-ag:not(.nav-boost-drop) .extend-box .box-item .item-title.item-panel-drop-title,
  .header-main.active .column-nav-container .nav-item .drop-c-right-align:not(.nav-boost-drop) .extend-box .box-item .item-title.item-panel-drop-title {
    max-width: 270px;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap
  }

  .header-main.active .column-nav-container .nav-item .dp-c-l-ag:not(.nav-boost-drop) .extend-box .box-item .item-title.title-without-tag,
  .header-main.active .column-nav-container .nav-item .drop-c-right-align:not(.nav-boost-drop) .extend-box .box-item .item-title.title-without-tag {
    display: inline-block
  }

  .header-main.active .column-nav-container .nav-item .dp-c-l-ag:not(.nav-boost-drop) .extend-small-box .box-item,
  .header-main.active .column-nav-container .nav-item .drop-c-right-align:not(.nav-boost-drop) .extend-small-box .box-item {
    color: var(--oxnv-okd-color-content-secondary);
    display: inline-flex;
    font-size: 16px;
    height: 44px;
    margin: 0;
    padding: 14px 0;
    width: 100%
  }

  .header-main.active .column-nav-container .nav-item .dp-c-l-ag:not(.nav-boost-drop) .extend-small-box .box-item:hover,
  .header-main.active .column-nav-container .nav-item .drop-c-right-align:not(.nav-boost-drop) .extend-small-box .box-item:hover {
    background: transparent;
    color: var(--oxnv-okd-color-content-primary)
  }

  .header-main.active .column-nav-container .nav-item .dp-c-l-ag .extend-box .box-item {
    width: 100%
  }

  .header-main.active .column-nav-container.asset-active .nav-scroll-box .nav-item.is-left,
  .header-main.active .column-nav-container.asset-active .nav-scroll-box .nav-item.nav-mode,
  .header-main.active .column-nav-container.asset-active .nav-scroll-box .nav-language-column,
  .header-main.active .column-nav-container.asset-active .nav-scroll-box .nav-mobile-download {
    display: none
  }

  .header-main .column-nav-container .nav-scroll-box,
  .header-main .nav-container .nav-scroll-box {
    display: flex;
    flex-direction: row;
    flex-grow: 1;
    justify-content: flex-end;
    padding: 0;
    top: 0;
    width: auto
  }

  .header-main .column-nav-container .nav-scroll-box::-webkit-scrollbar,
  .header-main .nav-container .nav-scroll-box::-webkit-scrollbar {
    display: none
  }

  .header-main .column-nav-container .deposit-item,
  .header-main .column-nav-container .is-left,
  .header-main .column-nav-container .mode-xl-line,
  .header-main .column-nav-container .nav-academy,
  .header-main .column-nav-container .nav-balance,
  .header-main .column-nav-container .nav-buy,
  .header-main .column-nav-container .nav-custom,
  .header-main .column-nav-container .nav-deposit,
  .header-main .column-nav-container .nav-earn,
  .header-main .column-nav-container .nav-institutions,
  .header-main .column-nav-container .nav-language,
  .header-main .column-nav-container .nav-market,
  .header-main .column-nav-container .nav-mobile-download,
  .header-main .column-nav-container .nav-mode,
  .header-main .column-nav-container .nav-more,
  .header-main .column-nav-container .nav-okc,
  .header-main .column-nav-container .nav-site-flag,
  .header-main .column-nav-container .nav-smsf,
  .header-main .column-nav-container .nav-trade,
  .header-main .column-nav-container .nav-user,
  .header-main .column-nav-container .other-wrap,
  .header-main .column-nav-container .pc-mode,
  .header-main .column-nav-container .profile-wrap,
  .header-main .column-nav-container .user-info-item,
  .header-main .nav-container .deposit-item,
  .header-main .nav-container .is-left,
  .header-main .nav-container .mode-xl-line,
  .header-main .nav-container .nav-academy,
  .header-main .nav-container .nav-balance,
  .header-main .nav-container .nav-buy,
  .header-main .nav-container .nav-custom,
  .header-main .nav-container .nav-deposit,
  .header-main .nav-container .nav-earn,
  .header-main .nav-container .nav-institutions,
  .header-main .nav-container .nav-language,
  .header-main .nav-container .nav-market,
  .header-main .nav-container .nav-mobile-download,
  .header-main .nav-container .nav-mode,
  .header-main .nav-container .nav-more,
  .header-main .nav-container .nav-okc,
  .header-main .nav-container .nav-site-flag,
  .header-main .nav-container .nav-smsf,
  .header-main .nav-container .nav-trade,
  .header-main .nav-container .nav-user,
  .header-main .nav-container .other-wrap,
  .header-main .nav-container .pc-mode,
  .header-main .nav-container .profile-wrap,
  .header-main .nav-container .user-info-item {
    display: none
  }

  .header-main .column-nav-container .mode-line,
  .header-main .nav-container .mode-line {
    background: hsla(0, 0%, 100%, .15);
    display: none;
    height: 16px;
    margin: 16px;
    width: 1px
  }

  .header-main .column-nav-container .mode-line.has-address,
  .header-main .nav-container .mode-line.has-address {
    display: block
  }

  .header-main .column-nav-container,
  .header-main .column-nav-container .mode-no-login,
  .header-main .nav-container .mode-no-login {
    display: none
  }

  .header-main.active .column-nav-container {
    background: var(--oxnv-okd-color-background-base-primary);
    box-shadow: 0 12px 60px rgba(14, 32, 66, .15), 0 1px 2px rgba(14, 32, 66, .05);
    display: flex;
    height: 100%;
    position: fixed;
    right: 0;
    transform: translateZ(0);
    width: 376px
  }

  .header-main.active .column-nav-container .nav-scroll-box {
    display: block;
    flex-direction: column;
    height: 95%;
    justify-content: unset;
    overflow: scroll;
    padding: 0 20px 48px;
    position: absolute;
    top: 48px;
    width: 100%
  }

  .header-main.active .column-nav-container .nav-wrap {
    display: flex;
    flex-direction: column;
    width: 100%
  }

  .header-main.active .column-nav-container .nav-item {
    cursor: pointer;
    display: flex;
    flex-direction: row;
    flex-wrap: wrap;
    justify-content: flex-start;
    padding: 0;
    width: 100%
  }

  .header-main.active .column-nav-container .nav-item:focus-visible {
    border-radius: 4px;
    outline: 2px solid #fff;
    outline-offset: 2px
  }

  .header-main.active .column-nav-container .nav-item .icon-img {
    display: none
  }

  .header-main.active .column-nav-container .nav-item.show-more .mu-txt.mu-txt-extend:before,
  .header-main.active .column-nav-container .nav-item.show-more .mu-txt:not(.mu-txt-third):before,
  .header-main.active .column-nav-container .nav-item.show-more .user-arrow.mu-txt-extend:before,
  .header-main.active .column-nav-container .nav-item.show-more .user-arrow:not(.mu-txt-third):before {
    transform: rotate(-180deg)
  }

  .header-main.active .column-nav-container .nav-item.show-more .dp-c-l-ag:not(.nav-boost-drop),
  .header-main.active .column-nav-container .nav-item.show-more .drop-c-right-align:not(.nav-boost-drop) {
    display: block
  }

  .header-main.active .column-nav-container .nav-item.show-more .nav-item.panel-nav-item.panel-col {
    display: flex
  }

  .header-main.active .column-nav-container .nav-item .nav-link,
  .header-main.active .column-nav-container .nav-item .nav-text,
  .header-main.active .column-nav-container .nav-item.nav-link {
    align-items: center;
    color: var(--oxnv-okd-color-content-primary);
    cursor: pointer;
    display: flex;
    flex-grow: 1;
    font-size: 18px;
    height: 52px;
    line-height: unset;
    padding: 17px 0
  }

  .header-main.active .column-nav-container .nav-item .nav-link:focus-visible,
  .header-main.active .column-nav-container .nav-item .nav-text:focus-visible,
  .header-main.active .column-nav-container .nav-item.nav-link:focus-visible {
    border-radius: 4px;
    outline: 2px solid #fff;
    outline-offset: 2px
  }

  .header-main.active .column-nav-container .nav-item .nav-link.mu-txt,
  .header-main.active .column-nav-container .nav-item .nav-text.mu-txt,
  .header-main.active .column-nav-container .nav-item.nav-link.mu-txt {
    justify-content: space-between
  }

  .header-main.active .column-nav-container .nav-item .nav-link.mu-txt:before,
  .header-main.active .column-nav-container .nav-item .nav-text.mu-txt:before,
  .header-main.active .column-nav-container .nav-item.nav-link.mu-txt:before {
    font-size: 14px;
    order: 5
  }

  .header-main.active .column-nav-container .nav-item .nav-link:active,
  .header-main.active .column-nav-container .nav-item .nav-text:active,
  .header-main.active .column-nav-container .nav-item.nav-link:active {
    color: var(--oxnv-okd-color-content-primary)
  }

  .header-main.active .column-nav-container .nav-item .mu-txt:before,
  .header-main.active .column-nav-container .nav-item .user-arrow {
    color: #909090;
    cursor: pointer;
    display: inline-block;
    margin-left: 4px;
    margin-right: 0;
    padding: 20px 0;
    transform: rotate(0deg)
  }

  .header-main.active .column-nav-container .nav-item .mu-txt:before .icon,
  .header-main.active .column-nav-container .nav-item .user-arrow .icon {
    color: #909090;
    font-size: 12px;
    font-weight: 500;
    pointer-events: none
  }

  .header-main.active .column-nav-container .nav-item .dp-c-l-ag .box-item,
  .header-main.active .column-nav-container .nav-item .dp-c-l-ag .extend-link {
    display: inline-block
  }

  .header-main.active .column-nav-container .nav-item .dp-c-l-ag .box-item:focus-visible,
  .header-main.active .column-nav-container .nav-item .dp-c-l-ag .extend-link:focus-visible {
    border-radius: 4px;
    outline: 2px solid #fff;
    outline-offset: 2px
  }

  .header-main.active .column-nav-container .nav-item .dp-c-l-ag .box-item .item-box:focus-visible,
  .header-main.active .column-nav-container .nav-item .dp-c-l-ag .extend-link .item-box:focus-visible {
    border-radius: 4px;
    outline: 2px solid #fff;
    outline-offset: 2px
  }

  .header-main.active .column-nav-container .nav-item .dp-c-l-ag .box-item:before,
  .header-main.active .column-nav-container .nav-item .dp-c-l-ag .extend-link:before {
    display: none
  }

  .header-main.active .column-nav-container .nav-item .dp-c-l-ag .box-item .nav-hot-tag,
  .header-main.active .column-nav-container .nav-item .dp-c-l-ag .box-item .nav-hot-tag.only-column,
  .header-main.active .column-nav-container .nav-item .dp-c-l-ag .box-item .nav-new-tag,
  .header-main.active .column-nav-container .nav-item .dp-c-l-ag .box-item .nav-new-tag.only-column,
  .header-main.active .column-nav-container .nav-item .dp-c-l-ag .extend-link .nav-hot-tag,
  .header-main.active .column-nav-container .nav-item .dp-c-l-ag .extend-link .nav-hot-tag.only-column,
  .header-main.active .column-nav-container .nav-item .dp-c-l-ag .extend-link .nav-new-tag,
  .header-main.active .column-nav-container .nav-item .dp-c-l-ag .extend-link .nav-new-tag.only-column {
    display: inline-block
  }

  .header-main.active .column-nav-container .pc-mode {
    display: none
  }

  .header-main.active .column-nav-container .extend-link {
    color: var(--oxnv-okd-color-content-secondary);
    cursor: pointer;
    display: inline-flex;
    font-size: 16px;
    height: 44px;
    padding: 14px 0;
    width: 100%
  }

  .header-main.active .column-nav-container .extend-link:hover {
    background: transparent;
    color: var(--oxnv-okd-color-content-primary)
  }

  .header-main.active .column-nav-container .extend-link:focus-visible {
    border-radius: 4px;
    outline: 2px solid #fff;
    outline-offset: 2px
  }

  .header-main.active .column-nav-container .extend-link .icon {
    font-size: 16px;
    margin-left: 4px;
    position: relative;
    top: 1px
  }

  .header-main.active .column-nav-container .nav-scroll-box .asset-bottom-line,
  .header-main.active .column-nav-container .nav-scroll-box .nav-item.is-user,
  .header-main.active .column-nav-container .nav-scroll-box .nav-item.nav-balance,
  .header-main.active .column-nav-container .nav-scroll-box .profile-wrap,
  .header-main.active .column-nav-container.asset-active .nav-scroll-box .nav-item.is-left,
  .header-main.active .column-nav-container.asset-active .nav-scroll-box .nav-item.nav-mode,
  .header-main.active .column-nav-container.asset-active .nav-scroll-box .nav-mobile-download {
    display: none
  }

  .header-main.active .column-nav-container.asset-active .nav-scroll-box .asset-bottom-line,
  .header-main.active .column-nav-container.asset-active .nav-scroll-box .nav-balance,
  .header-main.active .column-nav-container.asset-active .nav-scroll-box .nav-item.is-user,
  .header-main.active .column-nav-container.asset-active .nav-scroll-box .profile-wrap {
    display: flex
  }
}

@media (max-width:1023px) and (min-width:768px) {
  .header-main.active .column-nav-container .nav-scroll-box {
    padding: 0 24px 48px;
    width: 376px
  }

  .header-main.active .column-nav-container .nav-item .mu-txt:before,
  .header-main.active .column-nav-container .nav-item .user-arrow {
    margin-right: 4px
  }
}

.header-main.web3-header .nav-container .dp-c-l-ag,
.header-main.web3-header .nav-container .drop-c-right-align {
  background: var(--oxnv-okd-color-container-primary);
  border-radius: 12px;
  box-shadow: 0 12px 60px rgba(14, 32, 66, .15), 0 1px 2px rgba(14, 32, 66, .05);
  cursor: default;
  opacity: 0;
  overflow: hidden;
  padding: 12px;
  pointer-events: none;
  position: absolute;
  visibility: hidden;
  z-index: 20000
}

.header-main.web3-header .nav-container .dp-c-l-ag.drop-c-common-show,
.header-main.web3-header .nav-container .drop-c-right-align.drop-c-common-show {
  opacity: 1;
  pointer-events: auto;
  top: 60px;
  visibility: visible
}

.header-main.web3-header .nav-container .dp-c-l-ag.drop-with-panel,
.header-main.web3-header .nav-container .drop-c-right-align.drop-with-panel {
  border-radius: 12px 0 0 12px
}

.header-main.web3-header .nav-container .dp-c-l-ag.drop-with-panel-bottom,
.header-main.web3-header .nav-container .drop-c-right-align.drop-with-panel-bottom {
  border-radius: 12px 12px 0 12px
}

.header-main.web3-header .nav-container .drop-animation,
.header-main.web3-header .nav-container .drop-animation:hover {
  transition: all .3s cubic-bezier(.645, .045, .355, 1)
}

.header-main.web3-header .nav-container .dp-c-l-ag {
  font-weight: 400;
  left: -14px;
  top: 58px
}

.header-main.web3-header .nav-container .dp-c-l-ag.drop-c-common-show {
  opacity: 1;
  pointer-events: auto;
  top: 60px;
  visibility: visible
}

.header-main.web3-header .nav-container .dp-c-l-ag .info-extend-box {
  display: flex
}

.header-main.web3-header .nav-container .dp-c-l-ag .info-extend-box[data-direction=column] {
  flex-direction: column
}

.header-main.web3-header .nav-container .dp-c-l-ag .extend-box {
  margin-right: 48px
}

.header-main.web3-header .nav-container .dp-c-l-ag .extend-box:last-child {
  margin-right: 0
}

.header-main.web3-header .nav-container .dp-c-l-ag .extend-box .dropdown-panel-li:hover,
.header-main.web3-header .nav-container .dp-c-l-ag .extend-box .trade-drop-item-con:hover {
  background: #f9f9f9;
  background: var(--header-lg-drop-box-item-bg-hover);
  border-radius: 4px;
  color: var(--oxnv-okd-color-content-primary);
  cursor: pointer
}

.header-main.web3-header .nav-container .dp-c-l-ag .extend-box .dropdown-panel-li.dp-explorer,
.header-main.web3-header .nav-container .dp-c-l-ag .extend-box .trade-drop-item-con.dp-explorer {
  max-width: 250px
}

.header-main.web3-header .nav-container .dp-c-l-ag .extend-box .dropdown-panel-li .drop-panel-box-item,
.header-main.web3-header .nav-container .dp-c-l-ag .extend-box .dropdown-panel-li .panel-drop-item-icon,
.header-main.web3-header .nav-container .dp-c-l-ag .extend-box .trade-drop-item-con .drop-panel-box-item,
.header-main.web3-header .nav-container .dp-c-l-ag .extend-box .trade-drop-item-con .panel-drop-item-icon {
  background: unset;
  color: unset
}

.header-main.web3-header .nav-container .dp-c-l-ag .extend-box .box-title {
  color: var(--oxnv-okd-color-content-contrast);
  font-size: 12px;
  font-weight: 600;
  line-height: 20px;
  margin-bottom: 8px;
  padding-left: 20px
}

.header-main.web3-header .nav-container .dp-c-l-ag .extend-box .explorer-drop-panel-third-list .box-item.drop-panel-menu-item {
  display: flex;
  width: unset
}

.header-main.web3-header .nav-container .dp-c-l-ag .extend-box .box-item {
  align-items: center;
  display: flex;
  padding: 14px 12px
}

.header-main.web3-header .nav-container .dp-c-l-ag .extend-box .box-item:focus-visible {
  border-radius: 4px;
  outline: 2px solid #000;
  outline-offset: 2px
}

.header-main.web3-header .nav-container .dp-c-l-ag .extend-box .box-item.drop-panel-menu-item {
  display: inline-flex;
  vertical-align: middle;
  width: 224px
}

.header-main.web3-header .nav-container .dp-c-l-ag .extend-box .box-item:before {
  color: var(--oxnv-okd-color-content-primary);
  font-size: 24px;
  margin-right: 16px
}

.header-main.web3-header .nav-container .dp-c-l-ag .extend-box .box-item:last-child {
  margin-bottom: 0
}

.header-main.web3-header .nav-container .dp-c-l-ag .extend-box .box-item .icon-box {
  margin-right: 8px
}

.header-main.web3-header .nav-container .dp-c-l-ag .extend-box .box-item .icon-box .icon {
  height: 28px;
  width: 28px
}

.header-main.web3-header .nav-container .dp-c-l-ag .extend-box .box-item .item-box {
  width: -webkit-max-content;
  width: -moz-max-content;
  width: max-content
}

.header-main.web3-header .nav-container .dp-c-l-ag .extend-box .box-item .item-box.item-panel-drop {
  flex: auto;
  max-width: 176px
}

.header-main.web3-header .nav-container .dp-c-l-ag .extend-box .box-item .item-box.trade-item-panel-drop {
  max-width: 251px
}

.header-main.web3-header .nav-container .dp-c-l-ag .extend-box .box-item .item-box .item-title {
  color: var(--oxnv-okd-color-content-primary);
  display: flex;
  font-size: 14px;
  font-weight: 500;
  line-height: 16px
}

.header-main.web3-header .nav-container .dp-c-l-ag .extend-box .box-item .item-box .item-title.item-panel-drop-title {
  align-items: center;
  display: flex;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap
}

.header-main.web3-header .nav-container .dp-c-l-ag .extend-box .box-item .item-box .item-title.trade-item-panel-drop-title {
  align-items: center;
  display: flex
}

.header-main.web3-header .nav-container .dp-c-l-ag .extend-box .box-item .item-box .item-title.title-without-desc {
  padding-bottom: 10px;
  padding-top: 10px
}

.header-main.web3-header .nav-container .dp-c-l-ag .extend-box .box-item .item-box .desc {
  color: var(--oxnv-okd-color-content-contrast);
  font-size: 12px;
  font-weight: 400;
  line-height: 16px;
  margin-top: 4px;
  position: relative;
  visibility: visible
}

.header-main.web3-header .nav-container .dp-c-l-ag .extend-box .box-item:not(.drop-panel-menu-item):hover {
  background: #f9f9f9;
  background: var(--header-lg-drop-box-item-bg-hover);
  border-radius: 4px;
  color: var(--oxnv-okd-color-content-primary);
  cursor: pointer
}

.header-main.web3-header .nav-container .dp-c-l-ag .extend-small-box {
  margin-right: 80px;
  min-width: 120px;
  width: -webkit-max-content;
  width: -moz-max-content;
  width: max-content
}

.header-main.web3-header .nav-container .dp-c-l-ag .extend-small-box .box-title {
  font-weight: 500;
  margin-bottom: 10px;
  padding-left: 12px;
  padding-top: 12px
}

.header-main.web3-header .nav-container .dp-c-l-ag .extend-small-box .box-item {
  align-items: center;
  color: var(--oxnv-okd-color-content-primary);
  cursor: pointer;
  display: flex;
  font-size: 14px;
  font-weight: 500;
  line-height: 20px;
  margin-bottom: 0;
  padding: 12px
}

.header-main.web3-header .nav-container .dp-c-l-ag .extend-small-box .box-item:not(.drop-panel-menu-item):hover {
  background: #f9f9f9;
  background: var(--header-lg-drop-box-item-bg-hover);
  border-radius: 4px;
  color: var(--oxnv-okd-color-content-primary);
  cursor: pointer
}

.header-main.web3-header .nav-container .nav-scroll-box {
  flex-grow: 1;
  overscroll-behavior-y: contain;
  position: relative
}

.header-main.web3-header .nav-container .nav-l-sec,
.header-main.web3-header .nav-container .nav-l-sec .nav-l-con {
  display: flex
}

.header-main.web3-header .nav-container .nav-l-sec .nav-l-con .nav-item {
  margin: 0 10px;
  padding: 0
}

.header-main.web3-header .nav-container .nav-item {
  align-items: center;
  box-sizing: border-box;
  cursor: pointer;
  display: flex;
  height: 100%;
  padding: 0 10px;
  position: relative
}

.header-main.web3-header .nav-container .nav-item .nav-link,
.header-main.web3-header .nav-container .nav-item .nav-text,
.header-main.web3-header .nav-container .nav-item.nav-link {
  box-sizing: border-box;
  color: var(--oxnv-okd-color-content-primary);
  cursor: pointer;
  display: inline-flex;
  font-size: 14px;
  font-weight: 400;
  line-height: 60px;
  position: relative;
  word-break: break-all
}

.header-main.web3-header .nav-container .nav-item .nav-link.nav-link:focus-visible,
.header-main.web3-header .nav-container .nav-item .nav-text.nav-link:focus-visible,
.header-main.web3-header .nav-container .nav-item.nav-link.nav-link:focus-visible {
  border: none;
  outline: none
}

.header-main.web3-header .nav-container .nav-item .nav-link.mu-txt,
.header-main.web3-header .nav-container .nav-item .nav-text.mu-txt,
.header-main.web3-header .nav-container .nav-item.nav-link.mu-txt {
  display: inline-flex;
  flex-direction: row-reverse
}

.header-main.web3-header .nav-container .nav-item .nav-link:focus-visible:after,
.header-main.web3-header .nav-container .nav-item .nav-text:focus-visible:after,
.header-main.web3-header .nav-container .nav-item.nav-link:focus-visible:after {
  border-radius: 4px;
  bottom: 0;
  content: "";
  height: 30px;
  left: 0;
  margin: auto;
  outline: 2px solid #fff;
  outline-offset: 2px;
  position: absolute;
  right: 0;
  top: 0;
  width: 100%
}

.header-main.web3-header .nav-container .nav-item .mu-txt:before,
.header-main.web3-header .nav-container .nav-item .user-arrow {
  color: var(--oxnv-okd-color-content-secondary);
  display: inline-block;
  margin-left: 4px;
  transform: rotate(0deg)
}

.header-main.web3-header .nav-container .nav-item .mu-txt:before .icon,
.header-main.web3-header .nav-container .nav-item .user-arrow .icon {
  font-size: 12px
}

.header-main.web3-header .nav-container .nav-item .mu-txt.arrow-show:before,
.header-main.web3-header .nav-container .nav-item.show-drop-menu .mu-txt:before,
.header-main.web3-header .nav-container .nav-item.show-drop-menu .user-arrow {
  transform: rotate(-180deg)
}

.header-main.web3-header .nav-container .nav-item.show-drop-menu .dp-c-l-ag {
  opacity: 1;
  pointer-events: auto;
  top: 60px;
  visibility: visible
}

.header-main.web3-header .nav-container .nav-academy .nav-link,
.header-main.web3-header .nav-container .nav-smsf .nav-link,
.header-main.web3-header .nav-container .nav-support .nav-link {
  white-space: nowrap
}

.header-main.web3-header .nav-container .is-left .nav-link,
.header-main.web3-header .nav-container .is-left.nav-link {
  align-items: center;
  display: flex;
  height: 100%
}

.header-main.web3-header .nav-container .extend-link {
  align-items: center;
  box-sizing: border-box;
  color: var(--oxnv-okd-color-content-primary);
  cursor: pointer;
  display: flex;
  font-size: 14px;
  font-weight: 500;
  height: unset;
  line-height: 20px;
  padding: 12px 16px;
  white-space: nowrap
}

.header-main.web3-header .nav-container .extend-link:focus-visible {
  border-radius: 4px;
  outline: 2px solid #000;
  outline-offset: 2px
}

.header-main.web3-header .nav-container .extend-link:not(.drop-panel-menu-item):hover {
  background: #f9f9f9;
  background: var(--header-lg-drop-box-item-bg-hover);
  border-radius: 4px;
  color: var(--oxnv-okd-color-content-primary);
  cursor: pointer
}

.header-main.web3-header .nav-container .other-wrap {
  box-sizing: border-box;
  cursor: pointer;
  display: flex;
  line-height: 60px;
  margin: 0 10px;
  padding: 0;
  position: relative
}

.header-main.web3-header .nav-container .other-wrap.nav-im {
  color: #fafafa;
  font-size: 18px
}

.header-main.web3-header .nav-container .other-wrap.nav-im:before {
  font-size: 22px
}

.header-main.web3-header .nav-container .other-wrap .icon,
.header-main.web3-header .nav-container .other-wrap .user-info {
  cursor: pointer
}

.header-main.web3-header .nav-container .other-wrap .icon {
  color: var(--oxnv-okd-color-content-primary);
  font-size: 20px;
  position: relative
}

.header-main.web3-header .nav-container .other-wrap .icon:focus-visible:after {
  border-radius: 4px;
  bottom: 0;
  content: "";
  height: 30px;
  left: 0;
  margin: auto;
  outline: 2px solid #fff;
  outline-offset: 2px;
  position: absolute;
  right: 0;
  top: 0;
  width: 100%
}

.header-main.web3-header .nav-container .other-wrap .drop-c-right-align {
  overflow: visible;
  padding: 0 24px;
  right: 0;
  top: 70px
}

.header-main.web3-header .nav-container .other-wrap.show-drop-menu .drop-c-right-align {
  opacity: 1;
  pointer-events: auto;
  top: 60px;
  visibility: visible
}

.header-main.web3-header .nav-container .other-wrap,
.header-main.web3-header .nav-container .pc-mode,
.header-main.web3-header .nav-container .sm-mode {
  display: none
}

@media (min-width:1024px) {
  .header-main.web3-header .nav-container .other-wrap {
    display: block
  }
}

.header-main.web3-header .nav-container .nav-null {
  flex-grow: 1
}

.header-main.web3-header .head-spl-lin {
  background: hsla(0, 0%, 100%, .15);
  height: 16px;
  margin: 16px 10px 16px 20px;
  width: 1px
}

.header-main.web3-header .column-nav-container {
  display: none
}

.header-main.web3-header .nav-container {
  flex: 1 1;
  justify-content: flex-end;
  max-width: 100%;
  min-width: 0
}

.header-main.web3-header .nav-container .nav-scroll-box {
  display: flex;
  width: 100%
}

.header-main.web3-header .nav-container .nav-scroll-box .nav-l-container {
  flex: 1 1;
  min-width: 0
}

.header-main.web3-header .nav-container .nav-scroll-box .nav-l-container .nav-l-con .nav-item {
  flex-shrink: 0
}

@media (min-width:1024px) {

  .header-main .nav-container .dp-c-l-ag,
  .header-main .nav-container .drop-c-right-align {
    background: var(--oxnv-okd-color-container-primary);
    border-radius: 12px;
    box-shadow: 0 12px 60px rgba(14, 32, 66, .15), 0 1px 2px rgba(14, 32, 66, .05);
    cursor: default;
    opacity: 0;
    overflow: hidden;
    padding: 12px;
    pointer-events: none;
    position: absolute;
    visibility: hidden;
    z-index: 20000
  }

  .header-main .nav-container .dp-c-l-ag.drop-c-common-show,
  .header-main .nav-container .drop-c-right-align.drop-c-common-show {
    opacity: 1;
    pointer-events: auto;
    top: 60px;
    visibility: visible
  }

  .header-main .nav-container .dp-c-l-ag.drop-with-panel,
  .header-main .nav-container .drop-c-right-align.drop-with-panel {
    border-radius: 12px 0 0 12px
  }

  .header-main .nav-container .dp-c-l-ag.drop-with-panel-bottom,
  .header-main .nav-container .drop-c-right-align.drop-with-panel-bottom {
    border-radius: 12px 12px 0 12px
  }

  .header-main .nav-container .drop-animation,
  .header-main .nav-container .drop-animation:hover {
    transition: all .3s cubic-bezier(.645, .045, .355, 1)
  }

  .header-main .nav-container .dp-c-l-ag {
    font-weight: 400;
    left: -14px;
    top: 58px
  }

  .header-main .nav-container .dp-c-l-ag.drop-c-common-show {
    opacity: 1;
    pointer-events: auto;
    top: 60px;
    visibility: visible
  }

  .header-main .nav-container .dp-c-l-ag .info-extend-box {
    display: flex
  }

  .header-main .nav-container .dp-c-l-ag .info-extend-box[data-direction=column] {
    flex-direction: column
  }

  .header-main .nav-container .dp-c-l-ag .extend-box {
    margin-right: 48px
  }

  .header-main .nav-container .dp-c-l-ag .extend-box:last-child {
    margin-right: 0
  }

  .header-main .nav-container .dp-c-l-ag .extend-box .dropdown-panel-li:hover,
  .header-main .nav-container .dp-c-l-ag .extend-box .trade-drop-item-con:hover {
    background: #f9f9f9;
    background: var(--header-lg-drop-box-item-bg-hover);
    border-radius: 4px;
    color: var(--oxnv-okd-color-content-primary);
    cursor: pointer
  }

  .header-main .nav-container .dp-c-l-ag .extend-box .dropdown-panel-li.dp-explorer,
  .header-main .nav-container .dp-c-l-ag .extend-box .trade-drop-item-con.dp-explorer {
    max-width: 250px
  }

  .header-main .nav-container .dp-c-l-ag .extend-box .dropdown-panel-li .drop-panel-box-item,
  .header-main .nav-container .dp-c-l-ag .extend-box .dropdown-panel-li .panel-drop-item-icon,
  .header-main .nav-container .dp-c-l-ag .extend-box .trade-drop-item-con .drop-panel-box-item,
  .header-main .nav-container .dp-c-l-ag .extend-box .trade-drop-item-con .panel-drop-item-icon {
    background: unset;
    color: unset
  }

  .header-main .nav-container .dp-c-l-ag .extend-box .box-title {
    color: var(--oxnv-okd-color-content-contrast);
    font-size: 12px;
    font-weight: 600;
    line-height: 20px;
    margin-bottom: 8px;
    padding-left: 20px
  }

  .header-main .nav-container .dp-c-l-ag .extend-box .explorer-drop-panel-third-list .box-item.drop-panel-menu-item {
    display: flex;
    width: unset
  }

  .header-main .nav-container .dp-c-l-ag .extend-box .box-item {
    align-items: center;
    display: flex;
    padding: 14px 12px
  }

  .header-main .nav-container .dp-c-l-ag .extend-box .box-item:focus-visible {
    border-radius: 4px;
    outline: 2px solid #000;
    outline-offset: 2px
  }

  .header-main .nav-container .dp-c-l-ag .extend-box .box-item.drop-panel-menu-item {
    display: inline-flex;
    vertical-align: middle;
    width: 224px
  }

  .header-main .nav-container .dp-c-l-ag .extend-box .box-item:before {
    color: var(--oxnv-okd-color-content-primary);
    font-size: 24px;
    margin-right: 16px
  }

  .header-main .nav-container .dp-c-l-ag .extend-box .box-item:last-child {
    margin-bottom: 0
  }

  .header-main .nav-container .dp-c-l-ag .extend-box .box-item .icon-box {
    margin-right: 8px
  }

  .header-main .nav-container .dp-c-l-ag .extend-box .box-item .icon-box .icon {
    height: 28px;
    width: 28px
  }

  .header-main .nav-container .dp-c-l-ag .extend-box .box-item .item-box {
    width: -webkit-max-content;
    width: -moz-max-content;
    width: max-content
  }

  .header-main .nav-container .dp-c-l-ag .extend-box .box-item .item-box.item-panel-drop {
    flex: auto;
    max-width: 176px
  }

  .header-main .nav-container .dp-c-l-ag .extend-box .box-item .item-box.trade-item-panel-drop {
    max-width: 251px
  }

  .header-main .nav-container .dp-c-l-ag .extend-box .box-item .item-box .item-title {
    color: var(--oxnv-okd-color-content-primary);
    display: flex;
    font-size: 14px;
    font-weight: 500;
    line-height: 16px
  }

  .header-main .nav-container .dp-c-l-ag .extend-box .box-item .item-box .item-title.item-panel-drop-title {
    align-items: center;
    display: flex;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap
  }

  .header-main .nav-container .dp-c-l-ag .extend-box .box-item .item-box .item-title.trade-item-panel-drop-title {
    align-items: center;
    display: flex
  }

  .header-main .nav-container .dp-c-l-ag .extend-box .box-item .item-box .item-title.title-without-desc {
    padding-bottom: 10px;
    padding-top: 10px
  }

  .header-main .nav-container .dp-c-l-ag .extend-box .box-item .item-box .desc {
    color: var(--oxnv-okd-color-content-contrast);
    font-size: 12px;
    font-weight: 400;
    line-height: 16px;
    margin-top: 4px;
    position: relative;
    visibility: visible
  }

  .header-main .nav-container .dp-c-l-ag .extend-box .box-item:not(.drop-panel-menu-item):hover {
    background: #f9f9f9;
    background: var(--header-lg-drop-box-item-bg-hover);
    border-radius: 4px;
    color: var(--oxnv-okd-color-content-primary);
    cursor: pointer
  }

  .header-main .nav-container .dp-c-l-ag .extend-small-box {
    margin-right: 80px;
    min-width: 120px;
    width: -webkit-max-content;
    width: -moz-max-content;
    width: max-content
  }

  .header-main .nav-container .dp-c-l-ag .extend-small-box .box-title {
    font-weight: 500;
    margin-bottom: 10px;
    padding-left: 12px;
    padding-top: 12px
  }

  .header-main .nav-container .dp-c-l-ag .extend-small-box .box-item {
    align-items: center;
    color: var(--oxnv-okd-color-content-primary);
    cursor: pointer;
    display: flex;
    font-size: 14px;
    font-weight: 500;
    line-height: 20px;
    margin-bottom: 0;
    padding: 12px
  }

  .header-main .nav-container .dp-c-l-ag .extend-small-box .box-item:not(.drop-panel-menu-item):hover {
    background: #f9f9f9;
    background: var(--header-lg-drop-box-item-bg-hover);
    border-radius: 4px;
    color: var(--oxnv-okd-color-content-primary);
    cursor: pointer
  }

  .header-main .nav-container .nav-scroll-box {
    display: flex;
    flex-grow: 1;
    overscroll-behavior-y: contain;
    position: relative
  }

  .header-main .nav-container .nav-l-sec,
  .header-main .nav-container .nav-l-sec .nav-l-con {
    display: flex
  }

  .header-main .nav-container .nav-l-sec .nav-l-con .nav-item {
    margin: 0 10px;
    padding: 0
  }

  .header-main .nav-container .nav-item {
    align-items: center;
    box-sizing: border-box;
    cursor: pointer;
    display: flex;
    height: 100%;
    padding: 0 10px;
    position: relative
  }

  .header-main .nav-container .nav-item .nav-link,
  .header-main .nav-container .nav-item .nav-text,
  .header-main .nav-container .nav-item.nav-link {
    box-sizing: border-box;
    color: var(--oxnv-okd-color-content-primary);
    cursor: pointer;
    display: inline-flex;
    font-size: 14px;
    font-weight: 400;
    line-height: 60px;
    position: relative;
    word-break: break-all
  }

  .header-main .nav-container .nav-item .nav-link.nav-link:focus-visible,
  .header-main .nav-container .nav-item .nav-text.nav-link:focus-visible,
  .header-main .nav-container .nav-item.nav-link.nav-link:focus-visible {
    border: none;
    outline: none
  }

  .header-main .nav-container .nav-item .nav-link.mu-txt,
  .header-main .nav-container .nav-item .nav-text.mu-txt,
  .header-main .nav-container .nav-item.nav-link.mu-txt {
    display: inline-flex;
    flex-direction: row-reverse
  }

  .header-main .nav-container .nav-item .nav-link:focus-visible:after,
  .header-main .nav-container .nav-item .nav-text:focus-visible:after,
  .header-main .nav-container .nav-item.nav-link:focus-visible:after {
    border-radius: 4px;
    bottom: 0;
    content: "";
    height: 30px;
    left: 0;
    margin: auto;
    outline: 2px solid #fff;
    outline-offset: 2px;
    position: absolute;
    right: 0;
    top: 0;
    width: 100%
  }

  .header-main .nav-container .nav-item .mu-txt:before,
  .header-main .nav-container .nav-item .user-arrow {
    color: var(--oxnv-okd-color-content-secondary);
    display: inline-block;
    margin-left: 4px;
    transform: rotate(0deg)
  }

  .header-main .nav-container .nav-item .mu-txt:before .icon,
  .header-main .nav-container .nav-item .user-arrow .icon {
    font-size: 12px
  }

  .header-main .nav-container .nav-item .mu-txt.arrow-show:before,
  .header-main .nav-container .nav-item.show-drop-menu .mu-txt:before,
  .header-main .nav-container .nav-item.show-drop-menu .user-arrow {
    transform: rotate(-180deg)
  }

  .header-main .nav-container .nav-item.show-drop-menu .dp-c-l-ag {
    opacity: 1;
    pointer-events: auto;
    top: 60px;
    visibility: visible
  }

  .header-main .nav-container .nav-academy .nav-link,
  .header-main .nav-container .nav-smsf .nav-link,
  .header-main .nav-container .nav-support .nav-link {
    white-space: nowrap
  }

  .header-main .nav-container .is-left .nav-link,
  .header-main .nav-container .is-left.nav-link {
    align-items: center;
    display: flex;
    height: 100%
  }

  .header-main .nav-container .extend-link {
    align-items: center;
    box-sizing: border-box;
    color: var(--oxnv-okd-color-content-primary);
    cursor: pointer;
    display: flex;
    font-size: 14px;
    font-weight: 500;
    height: unset;
    line-height: 20px;
    padding: 12px 16px;
    white-space: nowrap
  }

  .header-main .nav-container .extend-link:focus-visible {
    border-radius: 4px;
    outline: 2px solid #000;
    outline-offset: 2px
  }

  .header-main .nav-container .extend-link:not(.drop-panel-menu-item):hover {
    background: #f9f9f9;
    background: var(--header-lg-drop-box-item-bg-hover);
    border-radius: 4px;
    color: var(--oxnv-okd-color-content-primary);
    cursor: pointer
  }

  .header-main .nav-container .other-wrap {
    box-sizing: border-box;
    cursor: pointer;
    display: flex;
    line-height: 60px;
    margin: 0 10px;
    padding: 0;
    position: relative
  }

  .header-main .nav-container .other-wrap.nav-im {
    color: #fafafa;
    font-size: 18px
  }

  .header-main .nav-container .other-wrap.nav-im:before {
    font-size: 22px
  }

  .header-main .nav-container .other-wrap .icon,
  .header-main .nav-container .other-wrap .user-info {
    cursor: pointer
  }

  .header-main .nav-container .other-wrap .icon {
    color: var(--oxnv-okd-color-content-primary);
    font-size: 20px;
    position: relative
  }

  .header-main .nav-container .other-wrap .icon:focus-visible:after {
    border-radius: 4px;
    bottom: 0;
    content: "";
    height: 30px;
    left: 0;
    margin: auto;
    outline: 2px solid #fff;
    outline-offset: 2px;
    position: absolute;
    right: 0;
    top: 0;
    width: 100%
  }

  .header-main .nav-container .other-wrap .drop-c-right-align {
    overflow: visible;
    padding: 0 24px;
    right: 0;
    top: 70px
  }

  .header-main .nav-container .other-wrap.show-drop-menu .drop-c-right-align {
    opacity: 1;
    pointer-events: auto;
    top: 60px;
    visibility: visible
  }

  .header-main .nav-container .other-wrap,
  .header-main .nav-container .pc-mode,
  .header-main .nav-container .sm-mode {
    display: none
  }

  .header-main .nav-container .nav-null {
    flex-grow: 1
  }

  .header-main .head-spl-lin {
    background: hsla(0, 0%, 100%, .15);
    height: 16px;
    margin: 16px 10px 16px 20px;
    width: 1px
  }

  .header-main .column-nav-container .nav-scroll-box {
    display: flex;
    flex-direction: row;
    flex-grow: 1;
    justify-content: flex-end;
    padding: 0;
    top: 0;
    width: auto
  }

  .header-main .column-nav-container .nav-scroll-box::-webkit-scrollbar {
    display: none
  }

  .header-main .column-nav-container .mode-xl-line,
  .header-main .column-nav-container .nav-academy,
  .header-main .column-nav-container .nav-balance,
  .header-main .column-nav-container .nav-buy,
  .header-main .column-nav-container .nav-cefi-market,
  .header-main .column-nav-container .nav-custom,
  .header-main .column-nav-container .nav-dashboard,
  .header-main .column-nav-container .nav-deposit,
  .header-main .column-nav-container .nav-earn,
  .header-main .column-nav-container .nav-explorer .nav-nft,
  .header-main .column-nav-container .nav-institutions,
  .header-main .column-nav-container .nav-language,
  .header-main .column-nav-container .nav-leaderboard,
  .header-main .column-nav-container .nav-market,
  .header-main .column-nav-container .nav-meme-pump,
  .header-main .column-nav-container .nav-mobile-download,
  .header-main .column-nav-container .nav-mode,
  .header-main .column-nav-container .nav-more,
  .header-main .column-nav-container .nav-nft,
  .header-main .column-nav-container .nav-okc,
  .header-main .column-nav-container .nav-portfolio,
  .header-main .column-nav-container .nav-referral,
  .header-main .column-nav-container .nav-signal,
  .header-main .column-nav-container .nav-site-flag,
  .header-main .column-nav-container .nav-smsf,
  .header-main .column-nav-container .nav-swap,
  .header-main .column-nav-container .nav-tracker,
  .header-main .column-nav-container .nav-trade,
  .header-main .column-nav-container .nav-user,
  .header-main .column-nav-container .nav-web3-more,
  .header-main .column-nav-container .other-wrap,
  .header-main .column-nav-container .pc-mode,
  .header-main .column-nav-container .profile-wrap,
  .header-main .column-nav-container .user-info-item {
    display: none
  }

  .header-main .column-nav-container .mode-line {
    background: hsla(0, 0%, 100%, .15);
    display: none;
    height: 16px;
    margin: 16px;
    width: 1px
  }

  .header-main .column-nav-container .mode-line.has-address {
    display: block
  }

  .header-main .column-nav-container,
  .header-main .column-nav-container .mode-no-login {
    display: none
  }

  .header-main.active .column-nav-container {
    background: var(--oxnv-okd-color-background-base-primary);
    box-shadow: 0 12px 60px rgba(14, 32, 66, .15), 0 1px 2px rgba(14, 32, 66, .05);
    display: flex;
    height: 100%;
    position: fixed;
    right: 0;
    transform: translateZ(0);
    width: 376px;
    z-index: 9500
  }

  .header-main.active .column-nav-container.web3-column-container {
    display: block
  }

  .header-main.active .column-nav-container.web3-column-container .col-mu-top {
    align-items: center;
    display: flex;
    justify-content: space-between;
    padding: 22px 16px
  }

  .header-main.active .column-nav-container.web3-column-container .nav-item .nav-link,
  .header-main.active .column-nav-container.web3-column-container .nav-item .nav-text.mu-txt,
  .header-main.active .column-nav-container.web3-column-container .nav-item.nav-link {
    font-weight: 500
  }

  .header-main.active .column-nav-container .nav-scroll-box {
    display: block;
    flex-direction: column;
    height: 95%;
    justify-content: unset;
    overflow: scroll;
    padding: 0 20px 48px;
    position: absolute;
    top: 48px;
    width: 100%
  }

  .header-main.active .column-nav-container .nav-wrap {
    display: flex;
    flex-direction: column;
    width: 100%
  }

  .header-main.active .column-nav-container .nav-item {
    cursor: pointer;
    display: flex;
    flex-direction: row;
    flex-wrap: wrap;
    justify-content: flex-start;
    padding: 0;
    width: 100%
  }

  .header-main.active .column-nav-container .nav-item:focus-visible {
    border-radius: 4px;
    outline: 2px solid #fff;
    outline-offset: 2px
  }

  .header-main.active .column-nav-container .nav-item .icon-img {
    display: none
  }

  .header-main.active .column-nav-container .nav-item.show-more .mu-txt.mu-txt-extend:before,
  .header-main.active .column-nav-container .nav-item.show-more .mu-txt:not(.mu-txt-third):before,
  .header-main.active .column-nav-container .nav-item.show-more .user-arrow.mu-txt-extend:before,
  .header-main.active .column-nav-container .nav-item.show-more .user-arrow:not(.mu-txt-third):before {
    transform: rotate(-180deg)
  }

  .header-main.active .column-nav-container .nav-item.show-more .dp-c-l-ag:not(.nav-boost-drop),
  .header-main.active .column-nav-container .nav-item.show-more .drop-c-right-align:not(.nav-boost-drop) {
    display: block
  }

  .header-main.active .column-nav-container .nav-item.show-more .nav-item.panel-nav-item.panel-col {
    display: flex
  }

  .header-main.active .column-nav-container .nav-item .nav-link,
  .header-main.active .column-nav-container .nav-item .nav-text,
  .header-main.active .column-nav-container .nav-item.nav-link {
    align-items: center;
    color: var(--oxnv-okd-color-content-primary);
    cursor: pointer;
    display: flex;
    flex-grow: 1;
    font-size: 18px;
    height: 52px;
    line-height: unset;
    padding: 17px 0
  }

  .header-main.active .column-nav-container .nav-item .nav-link:focus-visible,
  .header-main.active .column-nav-container .nav-item .nav-text:focus-visible,
  .header-main.active .column-nav-container .nav-item.nav-link:focus-visible {
    border-radius: 4px;
    outline: 2px solid #fff;
    outline-offset: 2px
  }

  .header-main.active .column-nav-container .nav-item .nav-link.mu-txt,
  .header-main.active .column-nav-container .nav-item .nav-text.mu-txt,
  .header-main.active .column-nav-container .nav-item.nav-link.mu-txt {
    justify-content: space-between
  }

  .header-main.active .column-nav-container .nav-item .nav-link.mu-txt:before,
  .header-main.active .column-nav-container .nav-item .nav-text.mu-txt:before,
  .header-main.active .column-nav-container .nav-item.nav-link.mu-txt:before {
    font-size: 14px;
    order: 5
  }

  .header-main.active .column-nav-container .nav-item .nav-link:active,
  .header-main.active .column-nav-container .nav-item .nav-text:active,
  .header-main.active .column-nav-container .nav-item.nav-link:active {
    color: var(--oxnv-okd-color-content-primary)
  }

  .header-main.active .column-nav-container .nav-item .mu-txt:before,
  .header-main.active .column-nav-container .nav-item .user-arrow {
    color: #909090;
    cursor: pointer;
    display: inline-block;
    margin-left: 4px;
    margin-right: 0;
    padding: 20px 0;
    transform: rotate(0deg)
  }

  .header-main.active .column-nav-container .nav-item .mu-txt:before .icon,
  .header-main.active .column-nav-container .nav-item .user-arrow .icon {
    color: #909090;
    font-size: 12px;
    font-weight: 500;
    pointer-events: none
  }

  .header-main.active .column-nav-container .nav-item .dp-c-l-ag .box-item,
  .header-main.active .column-nav-container .nav-item .dp-c-l-ag .extend-link {
    display: inline-block
  }

  .header-main.active .column-nav-container .nav-item .dp-c-l-ag .box-item:focus-visible,
  .header-main.active .column-nav-container .nav-item .dp-c-l-ag .extend-link:focus-visible {
    border-radius: 4px;
    outline: 2px solid #fff;
    outline-offset: 2px
  }

  .header-main.active .column-nav-container .nav-item .dp-c-l-ag .box-item .item-box:focus-visible,
  .header-main.active .column-nav-container .nav-item .dp-c-l-ag .extend-link .item-box:focus-visible {
    border-radius: 4px;
    outline: 2px solid #fff;
    outline-offset: 2px
  }

  .header-main.active .column-nav-container .nav-item .dp-c-l-ag .box-item:before,
  .header-main.active .column-nav-container .nav-item .dp-c-l-ag .extend-link:before {
    display: none
  }

  .header-main.active .column-nav-container .nav-item .dp-c-l-ag .box-item .nav-hot-tag,
  .header-main.active .column-nav-container .nav-item .dp-c-l-ag .box-item .nav-hot-tag.only-column,
  .header-main.active .column-nav-container .nav-item .dp-c-l-ag .box-item .nav-new-tag,
  .header-main.active .column-nav-container .nav-item .dp-c-l-ag .box-item .nav-new-tag.only-column,
  .header-main.active .column-nav-container .nav-item .dp-c-l-ag .extend-link .nav-hot-tag,
  .header-main.active .column-nav-container .nav-item .dp-c-l-ag .extend-link .nav-hot-tag.only-column,
  .header-main.active .column-nav-container .nav-item .dp-c-l-ag .extend-link .nav-new-tag,
  .header-main.active .column-nav-container .nav-item .dp-c-l-ag .extend-link .nav-new-tag.only-column {
    display: inline-block
  }

  .header-main.active .column-nav-container .nav-item .dp-c-l-ag:not(.nav-boost-drop),
  .header-main.active .column-nav-container .nav-item .drop-c-right-align:not(.nav-boost-drop) {
    background: transparent;
    display: none;
    left: auto;
    opacity: 1;
    padding: 4px 0 4px 12px;
    position: relative;
    top: auto;
    transform: unset;
    visibility: visible;
    width: 100%
  }

  .header-main.active .column-nav-container .nav-item .dp-c-l-ag:not(.nav-boost-drop).drop-c-common-show,
  .header-main.active .column-nav-container .nav-item .drop-c-right-align:not(.nav-boost-drop).drop-c-common-show {
    opacity: 1;
    pointer-events: auto;
    top: 60px;
    visibility: visible
  }

  .header-main.active .column-nav-container .nav-item .dp-c-l-ag:not(.nav-boost-drop) .info-extend-box,
  .header-main.active .column-nav-container .nav-item .drop-c-right-align:not(.nav-boost-drop) .info-extend-box {
    flex-direction: column
  }

  .header-main.active .column-nav-container .nav-item .dp-c-l-ag:not(.nav-boost-drop) .info-extend-box .item-title,
  .header-main.active .column-nav-container .nav-item .drop-c-right-align:not(.nav-boost-drop) .info-extend-box .item-title {
    color: var(--oxnv-okd-color-content-secondary);
    display: inline-flex;
    font-size: 16px;
    height: 44px;
    padding: 14px 0;
    width: 100%
  }

  .header-main.active .column-nav-container .nav-item .dp-c-l-ag:not(.nav-boost-drop) .info-extend-box .item-title:hover,
  .header-main.active .column-nav-container .nav-item .drop-c-right-align:not(.nav-boost-drop) .info-extend-box .item-title:hover {
    background: transparent;
    color: var(--oxnv-okd-color-content-primary)
  }

  .header-main.active .column-nav-container .nav-item .dp-c-l-ag:not(.nav-boost-drop) .info-extend-box .tab-ms,
  .header-main.active .column-nav-container .nav-item .drop-c-right-align:not(.nav-boost-drop) .info-extend-box .tab-ms {
    color: #646f84;
    font-size: 14px;
    font-style: normal;
    font-weight: 400;
    line-height: 20px
  }

  .header-main.active .column-nav-container .nav-item .dp-c-l-ag:not(.nav-boost-drop) .extend-box,
  .header-main.active .column-nav-container .nav-item .drop-c-right-align:not(.nav-boost-drop) .extend-box {
    margin: 0;
    max-width: unset;
    min-width: unset;
    padding: 0;
    width: 100%
  }

  .header-main.active .column-nav-container .nav-item .dp-c-l-ag:not(.nav-boost-drop) .extend-box .box-title,
  .header-main.active .column-nav-container .nav-item .dp-c-l-ag:not(.nav-boost-drop) .extend-box .desc-box,
  .header-main.active .column-nav-container .nav-item .dp-c-l-ag:not(.nav-boost-drop) .extend-box .icon-box,
  .header-main.active .column-nav-container .nav-item .drop-c-right-align:not(.nav-boost-drop) .extend-box .box-title,
  .header-main.active .column-nav-container .nav-item .drop-c-right-align:not(.nav-boost-drop) .extend-box .desc-box,
  .header-main.active .column-nav-container .nav-item .drop-c-right-align:not(.nav-boost-drop) .extend-box .icon-box {
    display: none
  }

  .header-main.active .column-nav-container .nav-item .dp-c-l-ag:not(.nav-boost-drop) .extend-box .box-item,
  .header-main.active .column-nav-container .nav-item .drop-c-right-align:not(.nav-boost-drop) .extend-box .box-item {
    height: 44px;
    margin: 0
  }

  .header-main.active .column-nav-container .nav-item .dp-c-l-ag:not(.nav-boost-drop) .extend-box .box-item .item-title,
  .header-main.active .column-nav-container .nav-item .drop-c-right-align:not(.nav-boost-drop) .extend-box .box-item .item-title {
    color: var(--oxnv-okd-color-content-secondary);
    display: inline-flex;
    font-size: 16px;
    height: 44px;
    padding: 14px 0;
    width: 100%
  }

  .header-main.active .column-nav-container .nav-item .dp-c-l-ag:not(.nav-boost-drop) .extend-box .box-item .item-title:hover,
  .header-main.active .column-nav-container .nav-item .drop-c-right-align:not(.nav-boost-drop) .extend-box .box-item .item-title:hover {
    background: transparent;
    color: var(--oxnv-okd-color-content-primary)
  }

  .header-main.active .column-nav-container .nav-item .dp-c-l-ag:not(.nav-boost-drop) .extend-box .box-item .item-title.item-panel-drop-title,
  .header-main.active .column-nav-container .nav-item .drop-c-right-align:not(.nav-boost-drop) .extend-box .box-item .item-title.item-panel-drop-title {
    max-width: 270px;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap
  }

  .header-main.active .column-nav-container .nav-item .dp-c-l-ag:not(.nav-boost-drop) .extend-box .box-item .item-title.title-without-tag,
  .header-main.active .column-nav-container .nav-item .drop-c-right-align:not(.nav-boost-drop) .extend-box .box-item .item-title.title-without-tag {
    display: inline-block
  }

  .header-main.active .column-nav-container .nav-item .dp-c-l-ag:not(.nav-boost-drop) .extend-small-box .box-item,
  .header-main.active .column-nav-container .nav-item .drop-c-right-align:not(.nav-boost-drop) .extend-small-box .box-item {
    color: var(--oxnv-okd-color-content-secondary);
    display: inline-flex;
    font-size: 16px;
    height: 44px;
    margin: 0;
    padding: 14px 0;
    width: 100%
  }

  .header-main.active .column-nav-container .nav-item .dp-c-l-ag:not(.nav-boost-drop) .extend-small-box .box-item:hover,
  .header-main.active .column-nav-container .nav-item .drop-c-right-align:not(.nav-boost-drop) .extend-small-box .box-item:hover {
    background: transparent;
    color: var(--oxnv-okd-color-content-primary)
  }

  .header-main.active .column-nav-container .nav-item .dp-c-l-ag .extend-box .box-item {
    width: 100%
  }

  .header-main.active .column-nav-container .pc-mode {
    display: none
  }

  .header-main.active .column-nav-container .extend-link {
    color: var(--oxnv-okd-color-content-secondary);
    cursor: pointer;
    display: inline-flex;
    font-size: 16px;
    height: 44px;
    padding: 14px 0;
    width: 100%
  }

  .header-main.active .column-nav-container .extend-link:hover {
    background: transparent;
    color: var(--oxnv-okd-color-content-primary)
  }

  .header-main.active .column-nav-container .extend-link:focus-visible {
    border-radius: 4px;
    outline: 2px solid #fff;
    outline-offset: 2px
  }

  .header-main.active .column-nav-container .extend-link .icon {
    font-size: 16px;
    margin-left: 4px;
    position: relative;
    top: 1px
  }

  .header-main.active .column-nav-container .nav-scroll-box .asset-bottom-line,
  .header-main.active .column-nav-container .nav-scroll-box .nav-item.is-user,
  .header-main.active .column-nav-container .nav-scroll-box .nav-item.nav-balance,
  .header-main.active .column-nav-container .nav-scroll-box .profile-wrap,
  .header-main.active .column-nav-container.asset-active .nav-scroll-box .nav-item.is-left,
  .header-main.active .column-nav-container.asset-active .nav-scroll-box .nav-item.nav-mode,
  .header-main.active .column-nav-container.asset-active .nav-scroll-box .nav-language-column,
  .header-main.active .column-nav-container.asset-active .nav-scroll-box .nav-mobile-download {
    display: none
  }

  .header-main.active .column-nav-container.asset-active .nav-scroll-box .asset-bottom-line,
  .header-main.active .column-nav-container.asset-active .nav-scroll-box .nav-balance,
  .header-main.active .column-nav-container.asset-active .nav-scroll-box .nav-item.is-user,
  .header-main.active .column-nav-container.asset-active .nav-scroll-box .profile-wrap {
    display: flex
  }

  .header-main.active[data-shrink-step="0"] .column-nav-container {
    display: none
  }
}

@media (min-width:1024px) and (min-width:1024px) {
  .header-main .nav-container .other-wrap {
    display: block
  }
}

@media (min-width:1024px) and (min-width:768px) {
  .header-main.active .column-nav-container .nav-scroll-box {
    padding: 0 24px 48px;
    width: 376px
  }

  .header-main.active .column-nav-container .nav-item .mu-txt:before,
  .header-main.active .column-nav-container .nav-item .user-arrow {
    margin-right: 4px
  }
}

@media (min-width:1024px) and (max-width:1550px) {
  .header-main .other-language-left-section {
    opacity: 0;
    visibility: hidden
  }
}

@media (min-width:1024px) and (max-width:1288px) {
  .header-main .other-language-left-section-zh {
    opacity: 0;
    visibility: hidden
  }
}

@media (min-width:1024px) and (max-width:1365px) {
  .header-main .other-language-left-section-en {
    opacity: 0;
    visibility: hidden
  }
}

@media (min-width:1024px) and (max-width:1024px) {
  .header-main .web3-other-language-left-section-zh {
    opacity: 0;
    visibility: hidden
  }
}

@media (min-width:1024px) and (max-width:1213px) {
  .header-main .web3-other-language-left-section-en {
    opacity: 0;
    visibility: hidden
  }
}

@media (min-width:1024px) and (max-width:1460px) {
  .header-main .tr-other-language-left-section-en {
    opacity: 0;
    visibility: hidden
  }
}

.skip-to-content {
  clip: rect(0, 0, 0, 0);
  border-width: 0;
  height: 1px;
  margin: -1px;
  overflow: hidden;
  padding: 0;
  position: absolute;
  white-space: nowrap;
  width: 1px
}

.skip-to-content:focus-visible {
  clip: unset;
  align-items: center;
  background: #000;
  border-radius: 4px;
  color: #fff;
  display: flex;
  font-size: 14px;
  font-style: normal;
  font-weight: 400;
  gap: 8px;
  height: auto;
  justify-content: center;
  left: 18px;
  line-height: 16px;
  margin: unset;
  outline: 2px solid #fff;
  outline-offset: 2px;
  padding: 4px 12px;
  position: absolute;
  top: 54px;
  width: auto;
  z-index: 3;
  z-index: 9502
}

.body-wrap {
  overflow: hidden
}

body .header-container {
  min-width: 320px
}

body .header-container * {
  box-sizing: border-box
}

body .header-container .header-wrap {
  background: #000;
  height: 60px;
  width: 100%
}

body .header-container .header-wrap.header-wrap-home {
  position: fixed;
  top: 0;
  width: 100%;
  z-index: 9500
}

body .header-container .header-wrap.header-wrap-home.header-with-banner {
  position: static
}

body .header-container .header-wrap .header-main {
  display: flex;
  height: 60px;
  justify-content: space-between;
  position: relative;
  visibility: visible
}

body .header-container .header-wrap .header-main .nav-container .nav-right-item {
  align-items: center;
  display: flex;
  margin-left: 8px;
  min-height: 60px;
  min-height: var(--global-header-height)
}

@media (max-width:767px) {
  body .header-container .header-wrap .header-main .nav-container .nav-right-item.nav-boost-item {
    margin-left: 0
  }
}

@media (min-width:768px) {

  body .header-container .header-wrap .header-main .nav-container .nav-right-item .dp-c-l-ag,
  body .header-container .header-wrap .header-main .nav-container .nav-right-item .drop-c-right-align {
    background: var(--oxnv-okd-color-container-primary);
    border-radius: 12px;
    box-shadow: 0 12px 60px rgba(14, 32, 66, .15), 0 1px 2px rgba(14, 32, 66, .05);
    cursor: default;
    opacity: 0;
    overflow: hidden;
    padding: 12px;
    pointer-events: none;
    position: absolute;
    visibility: hidden;
    z-index: 20000
  }

  body .header-container .header-wrap .header-main .nav-container .nav-right-item .dp-c-l-ag.drop-c-common-show,
  body .header-container .header-wrap .header-main .nav-container .nav-right-item .drop-c-right-align.drop-c-common-show {
    opacity: 1;
    pointer-events: auto;
    top: 60px;
    visibility: visible
  }

  body .header-container .header-wrap .header-main .nav-container .nav-right-item .dp-c-l-ag.drop-with-panel,
  body .header-container .header-wrap .header-main .nav-container .nav-right-item .drop-c-right-align.drop-with-panel {
    border-radius: 12px 0 0 12px
  }

  body .header-container .header-wrap .header-main .nav-container .nav-right-item .dp-c-l-ag.drop-with-panel-bottom,
  body .header-container .header-wrap .header-main .nav-container .nav-right-item .drop-c-right-align.drop-with-panel-bottom {
    border-radius: 12px 12px 0 12px
  }

  body .header-container .header-wrap .header-main .nav-container .nav-right-item .drop-animation,
  body .header-container .header-wrap .header-main .nav-container .nav-right-item .drop-animation:hover {
    transition: all .3s cubic-bezier(.645, .045, .355, 1)
  }

  body .header-container .header-wrap .header-main .nav-container .nav-right-item .dp-c-l-ag {
    font-weight: 400;
    left: -14px;
    top: 58px
  }

  body .header-container .header-wrap .header-main .nav-container .nav-right-item .dp-c-l-ag.drop-c-common-show {
    opacity: 1;
    pointer-events: auto;
    top: 60px;
    visibility: visible
  }

  body .header-container .header-wrap .header-main .nav-container .nav-right-item .dp-c-l-ag .info-extend-box {
    display: flex
  }

  body .header-container .header-wrap .header-main .nav-container .nav-right-item .dp-c-l-ag .info-extend-box[data-direction=column] {
    flex-direction: column
  }

  body .header-container .header-wrap .header-main .nav-container .nav-right-item .dp-c-l-ag .extend-box {
    margin-right: 48px
  }

  body .header-container .header-wrap .header-main .nav-container .nav-right-item .dp-c-l-ag .extend-box:last-child {
    margin-right: 0
  }

  body .header-container .header-wrap .header-main .nav-container .nav-right-item .dp-c-l-ag .extend-box .dropdown-panel-li:hover,
  body .header-container .header-wrap .header-main .nav-container .nav-right-item .dp-c-l-ag .extend-box .trade-drop-item-con:hover {
    background: #f9f9f9;
    background: var(--header-lg-drop-box-item-bg-hover);
    border-radius: 4px;
    color: var(--oxnv-okd-color-content-primary);
    cursor: pointer
  }

  body .header-container .header-wrap .header-main .nav-container .nav-right-item .dp-c-l-ag .extend-box .dropdown-panel-li.dp-explorer,
  body .header-container .header-wrap .header-main .nav-container .nav-right-item .dp-c-l-ag .extend-box .trade-drop-item-con.dp-explorer {
    max-width: 250px
  }

  body .header-container .header-wrap .header-main .nav-container .nav-right-item .dp-c-l-ag .extend-box .dropdown-panel-li .drop-panel-box-item,
  body .header-container .header-wrap .header-main .nav-container .nav-right-item .dp-c-l-ag .extend-box .dropdown-panel-li .panel-drop-item-icon,
  body .header-container .header-wrap .header-main .nav-container .nav-right-item .dp-c-l-ag .extend-box .trade-drop-item-con .drop-panel-box-item,
  body .header-container .header-wrap .header-main .nav-container .nav-right-item .dp-c-l-ag .extend-box .trade-drop-item-con .panel-drop-item-icon {
    background: unset;
    color: unset
  }

  body .header-container .header-wrap .header-main .nav-container .nav-right-item .dp-c-l-ag .extend-box .box-title {
    color: var(--oxnv-okd-color-content-contrast);
    font-size: 12px;
    font-weight: 600;
    line-height: 20px;
    margin-bottom: 8px;
    padding-left: 20px
  }

  body .header-container .header-wrap .header-main .nav-container .nav-right-item .dp-c-l-ag .extend-box .explorer-drop-panel-third-list .box-item.drop-panel-menu-item {
    display: flex;
    width: unset
  }

  body .header-container .header-wrap .header-main .nav-container .nav-right-item .dp-c-l-ag .extend-box .box-item {
    align-items: center;
    display: flex;
    padding: 14px 12px
  }

  body .header-container .header-wrap .header-main .nav-container .nav-right-item .dp-c-l-ag .extend-box .box-item:focus-visible {
    border-radius: 4px;
    outline: 2px solid #000;
    outline-offset: 2px
  }

  body .header-container .header-wrap .header-main .nav-container .nav-right-item .dp-c-l-ag .extend-box .box-item.drop-panel-menu-item {
    display: inline-flex;
    vertical-align: middle;
    width: 224px
  }

  body .header-container .header-wrap .header-main .nav-container .nav-right-item .dp-c-l-ag .extend-box .box-item:before {
    color: var(--oxnv-okd-color-content-primary);
    font-size: 24px;
    margin-right: 16px
  }

  body .header-container .header-wrap .header-main .nav-container .nav-right-item .dp-c-l-ag .extend-box .box-item:last-child {
    margin-bottom: 0
  }

  body .header-container .header-wrap .header-main .nav-container .nav-right-item .dp-c-l-ag .extend-box .box-item .icon-box {
    margin-right: 8px
  }

  body .header-container .header-wrap .header-main .nav-container .nav-right-item .dp-c-l-ag .extend-box .box-item .icon-box .icon {
    height: 28px;
    width: 28px
  }

  body .header-container .header-wrap .header-main .nav-container .nav-right-item .dp-c-l-ag .extend-box .box-item .item-box {
    width: -webkit-max-content;
    width: -moz-max-content;
    width: max-content
  }

  body .header-container .header-wrap .header-main .nav-container .nav-right-item .dp-c-l-ag .extend-box .box-item .item-box.item-panel-drop {
    flex: auto;
    max-width: 176px
  }

  body .header-container .header-wrap .header-main .nav-container .nav-right-item .dp-c-l-ag .extend-box .box-item .item-box.trade-item-panel-drop {
    max-width: 251px
  }

  body .header-container .header-wrap .header-main .nav-container .nav-right-item .dp-c-l-ag .extend-box .box-item .item-box .item-title {
    color: var(--oxnv-okd-color-content-primary);
    display: flex;
    font-size: 14px;
    font-weight: 500;
    line-height: 16px
  }

  body .header-container .header-wrap .header-main .nav-container .nav-right-item .dp-c-l-ag .extend-box .box-item .item-box .item-title.item-panel-drop-title {
    align-items: center;
    display: flex;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap
  }

  body .header-container .header-wrap .header-main .nav-container .nav-right-item .dp-c-l-ag .extend-box .box-item .item-box .item-title.trade-item-panel-drop-title {
    align-items: center;
    display: flex
  }

  body .header-container .header-wrap .header-main .nav-container .nav-right-item .dp-c-l-ag .extend-box .box-item .item-box .item-title.title-without-desc {
    padding-bottom: 10px;
    padding-top: 10px
  }

  body .header-container .header-wrap .header-main .nav-container .nav-right-item .dp-c-l-ag .extend-box .box-item .item-box .desc {
    color: var(--oxnv-okd-color-content-contrast);
    font-size: 12px;
    font-weight: 400;
    line-height: 16px;
    margin-top: 4px;
    position: relative;
    visibility: visible
  }

  body .header-container .header-wrap .header-main .nav-container .nav-right-item .dp-c-l-ag .extend-box .box-item:not(.drop-panel-menu-item):hover {
    background: #f9f9f9;
    background: var(--header-lg-drop-box-item-bg-hover);
    border-radius: 4px;
    color: var(--oxnv-okd-color-content-primary);
    cursor: pointer
  }

  body .header-container .header-wrap .header-main .nav-container .nav-right-item .dp-c-l-ag .extend-small-box {
    margin-right: 80px;
    min-width: 120px;
    width: -webkit-max-content;
    width: -moz-max-content;
    width: max-content
  }

  body .header-container .header-wrap .header-main .nav-container .nav-right-item .dp-c-l-ag .extend-small-box .box-title {
    font-weight: 500;
    margin-bottom: 10px;
    padding-left: 12px;
    padding-top: 12px
  }

  body .header-container .header-wrap .header-main .nav-container .nav-right-item .dp-c-l-ag .extend-small-box .box-item {
    align-items: center;
    color: var(--oxnv-okd-color-content-primary);
    cursor: pointer;
    display: flex;
    font-size: 14px;
    font-weight: 500;
    line-height: 20px;
    margin-bottom: 0;
    padding: 12px
  }

  body .header-container .header-wrap .header-main .nav-container .nav-right-item .dp-c-l-ag .extend-small-box .box-item:not(.drop-panel-menu-item):hover {
    background: #f9f9f9;
    background: var(--header-lg-drop-box-item-bg-hover);
    border-radius: 4px;
    color: var(--oxnv-okd-color-content-primary);
    cursor: pointer
  }

  body .header-container .header-wrap .header-main .nav-container .nav-right-item.show-drop-menu .dp-c-l-ag {
    opacity: 1;
    pointer-events: auto;
    top: 60px;
    visibility: visible
  }
}

@media (min-width:1024px) {
  body .header-container .header-wrap .header-main {
    margin: 0 auto;
    padding: 0 24px;
    visibility: visible
  }

  body .header-container .header-wrap .header-main .gas-container,
  body .header-container .header-wrap .header-main .nav-r-sec .nav-r-con {
    height: 60px
  }

  body .header-container .header-wrap .header-main .nav-r-sec .nav-r-con {
    display: flex;
    height: 60px
  }
}

body .header-container .header-wrap .header-main .nav-container {
  display: flex;
  flex-grow: 1
}

body .header-container .header-wrap .header-main .action-container {
  cursor: pointer;
  display: inline-block;
  position: relative
}

@media (min-width:1024px) {
  body .header-container .header-wrap .header-main .action-container {
    display: none
  }
}

body .header-container .header-wrap .header-main .action-container .header-menu-btn {
  cursor: pointer;
  width: 20px
}

body .header-container .header-wrap .header-main .action-container .header-menu-btn:focus-visible:after {
  border-radius: 4px;
  bottom: 0;
  content: "";
  height: 30px;
  left: 0;
  margin: auto;
  outline: 2px solid #fff;
  outline-offset: 2px;
  position: absolute;
  right: 0;
  top: 0;
  width: 100%
}

body .header-container .header-wrap .header-main .action-container .header-menu-btn.web3-menu-btn {
  width: auto
}

body .header-container .header-wrap .header-main .action-container .header-menu-btn.web3-menu-btn:before {
  background: var(--oxnv-okd-color-background-surface-primary);
  border-radius: 6px;
  margin-top: 12px;
  padding: 8px
}

body .header-container .header-wrap .header-main .action-container .header-menu-btn:before {
  color: var(--oxnv-okd-color-content-primary);
  display: inline-block;
  font-size: 20px;
  padding: 14px 0
}

body .header-container .header-wrap .header-main.active .column-nav-container {
  top: 0;
  width: 100%;
  z-index: 9500
}

@media (min-width:768px) {
  body .header-container .header-wrap .header-main.active .column-nav-container {
    width: 376px
  }
}

body .header-container .header-wrap .header-main.active .column-nav-container .action-container {
  display: inline-block;
  position: fixed;
  right: 20px;
  top: 0
}

@media (min-width:768px) {
  body .header-container .header-wrap .header-main.active .column-nav-container .action-container {
    right: 24px
  }
}

body .header-container .header-wrap .header-main.active .column-nav-container .action-container .header-menu-btn:before {
  color: #909090
}

body .header-container .header-wrap .header-main.active .nav-r-sec .nav-r-con {
  display: flex
}

body .header-main .nav-new-tag {
  align-items: flex-start;
  background: #bcff2f;
  border-radius: 3px;
  color: #000;
  display: inline-flex;
  flex-direction: row;
  flex-shrink: 0;
  font-size: 12px;
  height: 16px;
  justify-content: center;
  line-height: 12px;
  margin: auto 0 auto 2px;
  min-width: 33px;
  padding: 2px 3px;
  transform: scale(.875)
}

body .header-main .nav-hot-tag {
  color: #f1507b;
  font-size: 16px;
  margin-left: 2px
}

body .header-main .nav-hot-tag.only-column,
body .header-main .nav-new-tag.only-column {
  display: none
}

body {
  min-width: auto
}

body .header-container .header-wrap {
  padding-left: 8px;
  padding-right: 8px
}

@media (min-width:768px) {
  body .header-container .header-wrap {
    padding-left: 12px;
    padding-right: 12px
  }
}

@media (min-width:1024px) {
  body .header-container .header-wrap {
    padding-left: calc(50% - 480px);
    padding-right: calc(50% - 480px)
  }
}

@media (min-width:1270px) {
  body .header-container .header-wrap {
    padding-left: calc(50% - 624px);
    padding-right: calc(50% - 624px)
  }
}

@media (max-width:1023px) {
  body .header-container {
    min-height: 60px
  }

  body .header-container .header-wrap {
    background: #000;
    height: 60px;
    position: fixed;
    top: 0;
    width: 100%;
    z-index: 9500
  }

  body .header-container .header-wrap.header-with-banner {
    position: static
  }

  body .header-container .header-wrap .header-main {
    box-sizing: border-box;
    padding-left: 8px;
    padding-right: 8px;
    width: 100%
  }
}

@media (max-width:1023px) and (min-width:768px) {
  body .header-container .header-wrap .header-main {
    box-sizing: border-box;
    padding-left: 12px;
    padding-right: 12px;
    width: 100%
  }
}

@media (max-width:1023px) and (min-width:1024px) {
  body .header-container .header-wrap .header-main {
    box-sizing: border-box;
    padding-left: 12px;
    padding-right: 12px;
    width: 100%
  }
}

@media (max-width:1023px) and (min-width:1270px) {
  body .header-container .header-wrap .header-main {
    box-sizing: border-box;
    padding-left: 12px;
    padding-right: 12px;
    width: 100%
  }
}

@media (min-width:1024px) {
  body .header-container {
    min-height: 60px;
    width: 100%
  }

  body .header-container .header-wrap {
    padding-left: 0;
    padding-right: 0;
    position: relative;
    width: auto
  }

  body .header-container .header-wrap .header-main {
    width: 100%
  }
}

@media (min-width:1270px) {
  body .header-container {
    min-height: 60px;
    width: 100%
  }

  body .header-container .header-wrap {
    padding-left: 0;
    padding-right: 0;
    position: relative;
    width: auto
  }

  body .header-container .header-wrap .header-main {
    width: 100%
  }
}

body .theme-dark .header-container .header-wrap .header-main.active:before {
  background: rgba(8, 13, 21, .65);
  content: "";
  display: block;
  height: 100vh;
  position: absolute;
  right: 0;
  top: 0;
  width: 100vw
}

@media (min-width:1024px) {
  body .theme-dark .header-container .header-wrap .header-main.active:before {
    display: none
  }
}

body .header-container .header-wrap .header-main .header-line {
  background: hsla(0, 0%, 100%, .15)
}

@media (min-width:1024px) {
  body .header-container .header-wrap .header-main .header-line {
    height: 16px;
    margin: 16px 20px;
    width: 1px
  }
}

@media (min-width:1270px) {
  body .header-container .header-wrap .header-main .header-line {
    display: block
  }
}

body .header-container .header-wrap .header-main .asset-bottom-line {
  background: hsla(0, 0%, 100%, .15)
}

@media (min-width:1024px) {
  body .header-container .header-wrap .header-main .asset-bottom-line {
    display: none
  }
}

body .header-container .header-wrap .header-main.is-login .header-line {
  height: 16px;
  margin: 16px 20px;
  width: 1px
}

@media (min-width:1024px) {
  body .header-container .header-wrap .header-main.is-login .header-line {
    height: 16px
  }
}

body .header-container .header-wrap .header-main.is-login .column-nav-container.asset-active .asset-bottom-line {
  border-bottom: none;
  display: block;
  height: 1px;
  margin: 10px 0
}

@media (min-width:1024px) {
  body .header-container .header-wrap .header-main.not-login .header-line {
    display: block
  }
}

body .header-container .header-wrap .header-main .trade-line {
  background: hsla(0, 0%, 100%, .15);
  border-bottom: none;
  height: 1px;
  margin: 6px 0
}

@media (min-width:1024px) {
  body .header-container .header-wrap .header-main .trade-line {
    display: none
  }
}

.header-container[data-transparent=true] {
  background: transparent;
  height: 0
}

.header-container[data-transparent=true] .header-wrap {
  background: transparent
}

.header-container[data-transparent=true][data-scroll=false] .header-wrap,
.header-container[data-transparent=true][data-scroll=true] .header-wrap {
  transition: all .2s
}

.header-container[data-transparent=true][data-scroll=true] .header-wrap {
  background: #000
}

@media (min-width:1024px) {
  .header-container[data-transparent=true] {
    background: transparent;
    min-height: 60px;
    position: absolute;
    top: 0;
    width: 100%;
    z-index: 9500
  }

  .header-container[data-transparent=true][data-scroll=true] .header-wrap {
    background: transparent
  }
}

body .header-container .header-wrap .header-main.web3-header .logo-wrap {
  margin-right: 0
}

body .header-container .header-wrap .header-main .logo-container {
  display: flex;
  flex-shrink: 0
}

body .header-container .header-wrap .header-main .logo-wrap {
  color: #666;
  cursor: pointer;
  height: 36px;
  margin-right: 5px;
  overflow: hidden;
  text-align: left
}

body .header-container .header-wrap .header-main .logo-wrap:focus-visible {
  border-radius: 4px;
  outline: 2px solid #fff;
  outline-offset: 2px
}

body .header-container .header-wrap .header-main .logo-wrap .logo-img {
  height: 36px;
  width: 82px
}

body .header-container .header-wrap .header-main .logo-wrap .logo-img.logo-theme-img {
  display: none
}

body .header-container .header-wrap .header-main .logo-wrap .logo-img.current-logo {
  display: block
}

body .header-container .header-wrap .header-main .logo-wrap.web3-logo-wrap {
  align-items: center;
  display: flex;
  height: auto
}

body .header-container .header-wrap .header-main .logo-wrap.web3-logo-wrap .logo-img {
  height: 16px;
  width: auto
}

body .header-container .header-wrap .header-main .logo-wrap .tr-logo-img {
  height: 27px;
  margin-top: 3px;
  width: 128px
}

body .header-container .header-wrap .header-main .logo-wrap .simulated-sign {
  display: none
}

body .header-container .header-wrap .header-main .mode-logo {
  align-items: center;
  display: flex
}

body .header-container .header-wrap .header-main .mode-logo .nav-text {
  box-sizing: border-box;
  color: var(--oxnv-okd-color-content-primary);
  cursor: pointer;
  display: inline-block;
  font-size: 18px;
  font-weight: 500;
  line-height: 60px
}

@media (min-width:768px) {
  body .header-container .header-wrap .header-main .mode-logo .nav-text {
    display: none
  }
}

body .header-container .header-wrap .header-main .mode-logo .mode-quote {
  background: var(--oxnv-okd-color-content-primary);
  border-radius: 2px;
  display: inline-block;
  height: 4px;
  margin-left: 4px;
  margin-right: 4px;
  margin-top: -5px;
  vertical-align: middle;
  width: 4px
}

body .header-container .header-wrap .header-main .mode-container {
  display: flex;
  line-height: 48px
}

body .header-container .header-wrap .header-main .mode-container .nav-text {
  line-height: 48px
}

body .header-container .header-wrap .header-main .new-mode-tab {
  background: hsla(0, 0%, 100%, .15);
  border: 1px solid hsla(0, 0%, 100%, .25);
  border-radius: 4px;
  cursor: pointer;
  display: none;
  height: 28px;
  margin-left: 20px
}

@media (min-width:768px) {
  body .header-container .header-wrap .header-main .new-mode-tab {
    display: flex;
    flex-grow: 1
  }
}

@media (min-width:1024px) {
  body .header-container .header-wrap .header-main .new-mode-tab {
    height: unset
  }
}

body .header-container .header-wrap .header-main .new-mode-tab .tab-defi,
body .header-container .header-wrap .header-main .new-mode-tab .tab-exchange {
  color: var(--oxnv-okd-color-content-primary);
  font-size: 12px;
  line-height: 16px;
  padding: 5px 12px;
  text-align: justify;
  white-space: nowrap
}

body .header-container .header-wrap .header-main .new-mode-tab .tab-defi:focus-visible,
body .header-container .header-wrap .header-main .new-mode-tab .tab-exchange:focus-visible {
  border-radius: 4px;
  outline: 2px solid #fff;
  outline-offset: 2px
}

body .header-container .header-wrap .header-main .new-mode-tab .active {
  background: #fff;
  border-radius: 3px;
  box-shadow: 0 4px 4px rgba(0, 0, 0, .1);
  color: #000
}

body .header-container .header-wrap .header-main .new-mode-tab.change-order {
  flex-direction: row-reverse
}

body .header-container .header-wrap .header-main .nav-mode .mode-box {
  display: flex;
  justify-content: space-between;
  margin-bottom: 16px;
  padding: 16px 0 4px;
  width: 100%
}

body .header-container .header-wrap .header-main .nav-mode .mode-box .box-item {
  flex: 1 1;
  margin-bottom: 16px
}

body .header-container .header-wrap .header-main .nav-mode .mode-box .box-item:focus-visible {
  border-radius: 4px;
  outline: 2px solid #fff;
  outline-offset: 2px
}

body .header-container .header-wrap .header-main .nav-mode .mode-box .box-item .item-box {
  background: #242424;
  border-radius: 20px;
  padding: 10px 16px
}

body .header-container .header-wrap .header-main .nav-mode .mode-box .box-item .item-box .item-title {
  color: var(--oxnv-okd-color-content-primary);
  font-size: 14px;
  font-weight: 500;
  height: unset;
  line-height: 16px;
  padding: unset;
  text-align: center
}

body .header-container .header-wrap .header-main .nav-mode .mode-box .box-item+.box-item {
  margin-left: 16px
}

body .header-container .header-wrap .header-main .nav-mode .mode-box.change-order {
  flex-direction: row-reverse
}

body .header-container .header-wrap .header-main .nav-mode .mode-box.change-order .box-item+.box-item {
  margin-left: unset;
  margin-right: 16px
}

body .header-container .header-wrap .header-main .nav-mode.mode-chain .box-item .item-chain,
body .header-container .header-wrap .header-main .nav-mode.mode-okex .box-item .item-okex {
  border: 1px solid #fafafa
}

body .header-container .header-wrap .header-main.active.not-login .logo-container {
  display: none
}

@media (min-width:768px) {
  body .header-container .header-wrap .header-main.active.not-login .logo-container {
    display: flex
  }
}

body .header-container .header-wrap .header-main .custom-logo {
  display: none
}

@media (min-width:1024px) {
  body .header-container .header-wrap .header-main .custom-logo {
    align-items: center;
    display: flex;
    line-height: 48px
  }
}

body .header-container .header-wrap .header-main .nav-custom {
  display: none
}

@media (min-width:1024px) {
  body .header-container .header-wrap .header-main .nav-custom {
    display: flex
  }
}

body .header-container .header-wrap .header-main .nav-custom .hide-link {
  display: none !important
}

body .header-container .header-wrap .header-main .nav-custom .extend-link .icon.icon-telegram1,
body .header-container .header-wrap .header-main .nav-custom .extend-link .icon.icon-wechat2 {
  color: var(--oxnv-okd-color-content-primary);
  display: none
}

@media (min-width:1270px) {
  body .header-container .header-wrap .header-main .nav-custom .extend-link .icon.icon-telegram1 {
    display: block
  }
}

body .header-container .header-wrap .header-main .community-item .wechat-box,
body .header-container .header-wrap .header-main .community-link .wechat-box {
  display: none
}

@media (min-width:1024px) {
  body .header-container .header-wrap .header-main .nav-custom {
    position: static
  }

  body .header-container .header-wrap .header-main .nav-custom .drop-c-right-align {
    min-width: 152px;
    padding: 12px;
    right: 0
  }

  body .header-container .header-wrap .header-main .nav-custom .extend-link {
    justify-content: space-between
  }

  body .header-container .header-wrap .header-main .nav-custom .extend-link .icon {
    color: var(--oxnv-okd-color-content-primary);
    font-size: 16px;
    margin-left: 12px
  }

  body .header-container .header-wrap .header-main .nav-custom .extend-link .icon.icon-telegram1,
  body .header-container .header-wrap .header-main .nav-custom .extend-link .icon.icon-wechat2 {
    color: var(--oxnv-okd-color-content-primary);
    display: none
  }

  body .header-container .header-wrap .header-main .nav-custom .extend-link.click-disable {
    cursor: not-allowed;
    opacity: .5
  }

  body .header-container .header-wrap .header-main .nav-custom .extend-link.click-disable:hover {
    background: unset;
    color: #35384a
  }

  body .header-container .header-wrap .header-main .community-item,
  body .header-container .header-wrap .header-main .community-link {
    position: relative
  }

  body .header-container .header-wrap .header-main .community-item .wechat-box,
  body .header-container .header-wrap .header-main .community-link .wechat-box {
    display: none
  }
}

@media (min-width:1024px) and (min-width:1024px) {

  body .header-container .header-wrap .header-main .nav-custom .user-arrow,
  body .header-container .header-wrap .header-main .nav-custom .user-arrow:before,
  body .header-container .header-wrap .header-main .nav-custom .user-support-text {
    display: none
  }

  body .header-container .header-wrap .header-main .nav-custom .vip-con {
    border-bottom: 1px solid #ebebeb;
    margin-bottom: 6px;
    padding-bottom: 6px
  }

  body .header-container .header-wrap .header-main .nav-custom .vip-con .vip-support-btn {
    align-items: center;
    background: #000;
    border: none;
    border-radius: 14px;
    color: #ffe9af;
    cursor: pointer;
    display: flex;
    font-size: 12px;
    font-weight: 400;
    justify-content: center;
    line-height: 16px;
    margin-bottom: 10px;
    margin-top: 12px;
    padding: 6px 16px;
    width: 100%
  }

  body .header-container .header-wrap .header-main .nav-custom .vip-con .vip-support-btn:focus-visible {
    border-radius: 4px;
    outline: 2px solid #fff;
    outline-offset: 2px
  }

  body .header-container .header-wrap .header-main .nav-custom .vip-con .vip-icon {
    font-size: 14px;
    margin-right: 8px
  }
}

@media (min-width:1024px) and (min-width:1270px) {
  body .header-container .header-wrap .header-main .nav-custom .extend-link .icon.icon-telegram1 {
    display: block
  }
}

body .header-container .header-wrap .header-main.active .column-nav-container .nav-custom {
  display: flex;
  flex-direction: row-reverse;
  justify-content: flex-end;
  line-height: unset;
  text-align: left
}

body .header-container .header-wrap .header-main.active .column-nav-container .nav-custom .extend-link .icon {
  display: none
}

@media (min-width:1024px) {
  body .header-container .header-wrap .header-main.active .column-nav-container .nav-custom {
    display: flex
  }

  body .header-container .header-wrap .header-main.active .column-nav-container .nav-custom .custom-logo {
    display: none
  }

  body .header-container .header-wrap .header-main.active .column-nav-container .nav-custom .user-support-text {
    display: flex
  }

  body .header-container .header-wrap .header-main.active .column-nav-container .nav-custom .user-arrow,
  body .header-container .header-wrap .header-main.active .column-nav-container .nav-custom .user-arrow:before {
    display: block
  }
}

body .header-container .header-wrap .header-main .nav-notice {
  display: none
}

@media (min-width:1024px) {
  body .header-container .header-wrap .header-main .nav-notice {
    display: flex
  }
}

body .header-container .header-wrap .header-main .nav-notice {
  position: static
}

body .header-container .header-wrap .header-main .nav-notice .notice-icon {
  line-height: 60px;
  position: relative
}

body .header-container .header-wrap .header-main .nav-notice .notice-icon .notice-new {
  background-color: #ff6e00;
  border-radius: 100px;
  display: none;
  height: 6px;
  position: absolute;
  right: 0;
  top: 14px;
  width: 6px
}

body .header-container .header-wrap .header-main .nav-notice .drop-c-right-align {
  overflow: hidden;
  padding: 8px 0;
  right: 0
}

body .header-container .header-wrap .header-main .nav-notice .drop-c-right-align .notice-box {
  width: 336px
}

body .header-container .header-wrap .header-main .nav-notice .drop-c-right-align .notice-box .notice-title {
  display: none
}

body .header-container .header-wrap .header-main .nav-notice .drop-c-right-align .notice-box .notice-list {
  padding: 0 4px
}

body .header-container .header-wrap .header-main .nav-notice .drop-c-right-align .notice-box .notice-list .notice-item {
  box-sizing: border-box;
  cursor: pointer;
  display: inline-block;
  padding: 12px 16px;
  width: 100%
}

body .header-container .header-wrap .header-main .nav-notice .drop-c-right-align .notice-box .notice-list .notice-item:focus-visible {
  border-radius: 4px;
  outline: 2px solid #000;
  outline-offset: 2px
}

body .header-container .header-wrap .header-main .nav-notice .drop-c-right-align .notice-box .notice-list .notice-item:hover {
  background: #f7f7f7
}

body .header-container .header-wrap .header-main .nav-notice .drop-c-right-align .notice-box .notice-list .notice-item .item-title {
  color: #000;
  font-size: 12px;
  font-weight: 500;
  line-height: 18px
}

body .header-container .header-wrap .header-main .nav-notice .drop-c-right-align .notice-box .notice-list .notice-item .item-date {
  color: #929292;
  font-size: 12px;
  font-weight: 400;
  line-height: 20px;
  margin-top: 2px
}

body .header-container .header-wrap .header-main .nav-notice .drop-c-right-align .notice-box .notice-more {
  color: #000;
  display: inline-block;
  font-size: 12px;
  font-weight: 500;
  line-height: 18px;
  margin: 12px 18px;
  text-decoration: underline
}

body .header-container .header-wrap .header-main .nav-notice .drop-c-right-align .notice-box .notice-more:focus-visible {
  border-radius: 4px;
  outline: 2px solid #000;
  outline-offset: 2px
}

body .header-container .header-wrap .header-main .nav-notice .drop-c-right-align .notice-empty {
  align-items: center;
  display: flex;
  flex-direction: column;
  height: 158px;
  justify-content: center;
  width: 240px
}

body .header-container .header-wrap .header-main .nav-notice .drop-c-right-align .notice-empty .empty-icon {
  display: block;
  height: 80px;
  margin-bottom: 6px;
  width: 80px
}

body .header-container .header-wrap .header-main .nav-notice .drop-c-right-align .notice-empty .empty-desc {
  color: #929292;
  font-size: 12px;
  font-weight: 500;
  line-height: 18px
}

body .header-container .header-wrap .header-main .nav-download {
  display: none;
  margin-left: 0
}

@media (min-width:1024px) {
  body .header-container .header-wrap .header-main .nav-download {
    display: flex
  }
}

body .header-container .header-wrap .header-main .nav-download .drop-c-right-align {
  left: 50%;
  min-width: 250px;
  padding: 16px 16px 8px;
  transform: translateX(-50%)
}

body .header-container .header-wrap .header-main .nav-download .drop-c-right-align.tr-down-drop-align {
  min-width: 200px
}

body .header-container .header-wrap .header-main .nav-download .drop-c-right-align .download-box {
  display: flex;
  flex-direction: column
}

body .header-container .header-wrap .header-main .nav-download .drop-c-right-align .download-box .qr-box {
  align-items: center;
  background-color: #f6f6f6;
  border-radius: 8px;
  display: flex;
  flex-direction: column;
  flex-shrink: 0;
  padding: 12px 12px 16px
}

body .header-container .header-wrap .header-main .nav-download .drop-c-right-align .download-box .qr-box .qr-code-desc {
  color: #000;
  font-size: 12px;
  font-weight: 400;
  line-height: 16px;
  margin-bottom: 16px;
  white-space: nowrap
}

body .header-container .header-wrap .header-main .nav-download .drop-c-right-align .download-box .qr-box .img-box {
  height: 72px;
  width: 72px
}

body .header-container .header-wrap .header-main .nav-download .drop-c-right-align .download-box .qr-box .img-box .qr-code-img {
  display: block;
  height: 100%;
  width: 100%
}

body .header-container .header-wrap .header-main .nav-download .drop-c-right-align .download-box .pc-box {
  align-items: center;
  background: #f7f7f7;
  border-radius: 2px;
  display: flex;
  flex-direction: column;
  padding: 8px
}

body .header-container .header-wrap .header-main .nav-download .drop-c-right-align .download-box .download-btn {
  background: #fff;
  border: 1px solid #4d4d4d;
  border-radius: 14px;
  box-sizing: border-box;
  color: #000;
  display: block;
  font-size: 12px;
  line-height: 16px;
  margin-top: 16px;
  padding: 4px 14px;
  text-align: center;
  width: 100%
}

body .header-container .header-wrap .header-main .nav-download .drop-c-right-align .download-box .download-btn:focus-visible {
  border-radius: 4px;
  outline: 2px solid #000;
  outline-offset: 2px
}

body .header-container .header-wrap .header-main .nav-download .drop-c-right-align .download-box .download-desc {
  color: #5b5b5b;
  font-size: 12px;
  font-weight: 400;
  line-height: 16px;
  margin-top: 12px;
  text-align: center
}

body .header-container .header-wrap .header-main .nav-mobile-download .app-box {
  width: 100%
}

body .header-container .header-wrap .header-main .nav-mobile-download .app-box .download-text {
  border: 1px solid #404040;
  border-radius: 24px;
  color: var(--oxnv-okd-color-content-primary);
  display: block;
  font-size: 16px;
  font-weight: 500;
  height: 48px;
  line-height: 16px;
  margin-bottom: 8px;
  margin-top: 48px;
  padding: 16px 2px;
  text-align: center;
  width: 100%
}

body .header-container .header-wrap .header-main .nav-mobile-download .app-box .download-text:focus-visible {
  border-radius: 4px;
  outline: 2px solid #fff;
  outline-offset: 2px
}

@media (min-width:1024px) {
  body .header-container .header-wrap .header-main .nav-mobile-download {
    display: none
  }
}

body .header-container .header-wrap .header-main.active .nav-mobile-download {
  display: block
}

@media (min-width:1270px) {
  body .header-container .header-wrap .header-main.active .nav-mobile-download {
    display: none
  }
}

body .header-container .header-wrap .header-main .nav-language {
  display: none;
  margin-right: 0;
  position: relative
}

body .header-container .header-wrap .header-main .nav-language .now-language {
  cursor: pointer
}

@media (min-width:1024px) {
  body .header-container .header-wrap .header-main .nav-language {
    display: flex
  }

  body .header-container .header-wrap .header-main .nav-language .now-language {
    display: flex;
    line-height: 48px
  }
}

body .header-container .header-wrap .header-main.active .nav-r-sec .nav-language {
  display: none
}

@media (min-width:1024px) {
  body .header-container .header-wrap .header-main.active .nav-r-sec .nav-language {
    display: flex
  }
}

body .header-container .header-wrap .header-main.active .nav-r-sec .nav-language-column {
  display: flex
}

@media (min-width:1024px) {
  body .header-main .nav-buy {
    order: 1
  }

  body .header-main .nav-deposit,
  body .header-main .nav-market {
    order: 2
  }

  body .header-main .nav-trade {
    order: 3
  }

  body .header-main .nav-earn {
    order: 4
  }

  body .header-main .nav-academy,
  body .header-main .nav-institutions,
  body .header-main .nav-okc,
  body .header-main .nav-smsf {
    order: 5
  }

  body .header-main .nav-more {
    order: 6
  }

  body .header-main .nav-null,
  body .header-main .nav-site-flag {
    order: 7
  }

  body .header-main .header-search-box,
  body .header-main .nav-search {
    order: 8
  }

  body .header-main .deposit-item,
  body .header-main .user-no-login {
    order: 9
  }

  body .header-main .nav-balance {
    order: 10
  }

  body .header-main .nav-user {
    order: 11
  }

  body .header-main .header-line,
  body .header-main .nav-r-sec {
    order: 12
  }

  body .header-main .nav-download {
    order: 13
  }

  body .header-main .nav-im,
  body .header-main .nav-notice {
    order: 14
  }

  body .header-main .nav-custom {
    order: 15
  }

  body .header-main .nav-language {
    order: 16
  }

  body .header-main .nav-language-column {
    order: 13
  }

  body .header-main .nav-dashboard {
    order: 1
  }

  body .header-main .nav-defi-trade {
    order: 2
  }

  body .header-main .nav-defi {
    order: 3
  }

  body .header-main .nav-invest {
    order: 4
  }

  body .header-main .nav-nft {
    order: 3
  }

  body .header-main .nav-discovery {
    order: 4
  }

  body .header-main .nav-explorer {
    order: 5
  }

  body .header-main .nav-doc {
    order: 6
  }

  body .header-main .mode-line,
  body .header-main .mode-xl-line {
    order: 12
  }

  body .header-main .action-container {
    order: 20
  }

  body .header-main .nav-cefi-market {
    order: 1
  }

  body .header-main .nav-meme-pump {
    order: 2
  }

  body .header-main .nav-tracker {
    order: 3
  }

  body .header-main .nav-signal {
    order: 4
  }

  body .header-main .nav-leaderboard {
    order: 5
  }

  body .header-main .nav-swap {
    order: 6
  }

  body .header-main .nav-portfolio {
    order: 7
  }

  body .header-main .nav-referral {
    order: 8
  }

  body .header-main .nav-web3-more {
    order: 9
  }
}

body .header-container .header-wrap .header-main .mode-line {
  background: hsla(0, 0%, 100%, .15);
  height: 16px;
  margin: 16px;
  width: 1px
}

@media (min-width:1024px) {
  body .header-container .header-wrap .header-main .mode-line {
    margin: 16px 20px 16px 10px
  }
}

body .header-container .header-wrap .header-main .nav-address {
  display: flex;
  flex-shrink: 0
}

body .header-container .header-wrap .header-main .mode-search {
  align-items: center;
  display: flex;
  justify-content: center
}

body .header-container .header-wrap .header-main .nav-dashboard,
body .header-container .header-wrap .header-main .nav-defi,
body .header-container .header-wrap .header-main .nav-defi-trade,
body .header-container .header-wrap .header-main .nav-discovery,
body .header-container .header-wrap .header-main .nav-doc,
body .header-container .header-wrap .header-main .nav-explorer,
body .header-container .header-wrap .header-main .nav-invest,
body .header-container .header-wrap .header-main .nav-nft {
  display: none
}

@media (min-width:1024px) {

  body .header-container .header-wrap .header-main .nav-dashboard,
  body .header-container .header-wrap .header-main .nav-defi,
  body .header-container .header-wrap .header-main .nav-defi-trade,
  body .header-container .header-wrap .header-main .nav-discovery,
  body .header-container .header-wrap .header-main .nav-doc,
  body .header-container .header-wrap .header-main .nav-explorer,
  body .header-container .header-wrap .header-main .nav-invest,
  body .header-container .header-wrap .header-main .nav-nft {
    display: flex
  }
}

body .header-container .header-wrap .header-main .nav-cefi-market,
body .header-container .header-wrap .header-main .nav-leaderboard,
body .header-container .header-wrap .header-main .nav-meme-pump,
body .header-container .header-wrap .header-main .nav-portfolio,
body .header-container .header-wrap .header-main .nav-referral,
body .header-container .header-wrap .header-main .nav-signal,
body .header-container .header-wrap .header-main .nav-swap,
body .header-container .header-wrap .header-main .nav-tracker,
body .header-container .header-wrap .header-main .nav-web3-more {
  display: flex
}

body .header-container .header-wrap .header-main .nav-tag-testnet {
  align-items: flex-start;
  background: #3d3d3d;
  border-radius: 3px;
  color: #fff;
  display: flex;
  flex-direction: row;
  flex-shrink: 0;
  font-size: 12px;
  height: 16px;
  justify-content: center;
  line-height: 12px;
  margin: auto 0 auto 2px;
  padding: 2px 3px;
  transform: scale(.875)
}

@media (min-width:1024px) {
  body .header-container .header-wrap .header-main .nav-container .nav-doc .extend-box {
    min-width: 276px
  }

  body .header-container .header-wrap .header-main .nav-container .nav-doc .extend-box .box-item {
    display: flex;
    margin: unset;
    max-width: 342px
  }

  body .header-container .header-wrap .header-main .nav-container .nav-doc .extend-box .box-item .icon-box {
    margin-top: -4px
  }

  body .header-container .header-wrap .header-main .nav-container .nav-doc .extend-box .box-item .item-box {
    display: flex;
    flex-direction: column;
    width: 100%
  }

  body .header-container .header-wrap .header-main .nav-container .nav-doc .extend-box .box-item .item-box .item-title:not(.trade-item-panel-drop-title) {
    white-space: nowrap
  }
}

body .header-container .header-wrap .header-main.active .column-nav-container .mode-no-login,
body .header-container .header-wrap .header-main.active .column-nav-container .nav-cefi-market,
body .header-container .header-wrap .header-main.active .column-nav-container .nav-dashboard,
body .header-container .header-wrap .header-main.active .column-nav-container .nav-defi,
body .header-container .header-wrap .header-main.active .column-nav-container .nav-defi-trade,
body .header-container .header-wrap .header-main.active .column-nav-container .nav-discovery,
body .header-container .header-wrap .header-main.active .column-nav-container .nav-doc,
body .header-container .header-wrap .header-main.active .column-nav-container .nav-explorer,
body .header-container .header-wrap .header-main.active .column-nav-container .nav-invest,
body .header-container .header-wrap .header-main.active .column-nav-container .nav-leaderboard,
body .header-container .header-wrap .header-main.active .column-nav-container .nav-meme-pump,
body .header-container .header-wrap .header-main.active .column-nav-container .nav-nft,
body .header-container .header-wrap .header-main.active .column-nav-container .nav-portfolio,
body .header-container .header-wrap .header-main.active .column-nav-container .nav-referral,
body .header-container .header-wrap .header-main.active .column-nav-container .nav-signal,
body .header-container .header-wrap .header-main.active .column-nav-container .nav-swap,
body .header-container .header-wrap .header-main.active .column-nav-container .nav-tracker,
body .header-container .header-wrap .header-main.active .column-nav-container .nav-web3-more {
  display: flex
}

body .header-container .header-wrap .header-main.active .column-nav-container .nav-cefi-market.nav-web3-more,
body .header-container .header-wrap .header-main.active .column-nav-container .nav-dashboard.nav-web3-more,
body .header-container .header-wrap .header-main.active .column-nav-container .nav-defi-trade.nav-web3-more,
body .header-container .header-wrap .header-main.active .column-nav-container .nav-defi.nav-web3-more,
body .header-container .header-wrap .header-main.active .column-nav-container .nav-discovery.nav-web3-more,
body .header-container .header-wrap .header-main.active .column-nav-container .nav-doc.nav-web3-more,
body .header-container .header-wrap .header-main.active .column-nav-container .nav-explorer.nav-web3-more,
body .header-container .header-wrap .header-main.active .column-nav-container .nav-invest.nav-web3-more,
body .header-container .header-wrap .header-main.active .column-nav-container .nav-leaderboard.nav-web3-more,
body .header-container .header-wrap .header-main.active .column-nav-container .nav-meme-pump.nav-web3-more,
body .header-container .header-wrap .header-main.active .column-nav-container .nav-nft.nav-web3-more,
body .header-container .header-wrap .header-main.active .column-nav-container .nav-portfolio.nav-web3-more,
body .header-container .header-wrap .header-main.active .column-nav-container .nav-referral.nav-web3-more,
body .header-container .header-wrap .header-main.active .column-nav-container .nav-signal.nav-web3-more,
body .header-container .header-wrap .header-main.active .column-nav-container .nav-swap.nav-web3-more,
body .header-container .header-wrap .header-main.active .column-nav-container .nav-tracker.nav-web3-more,
body .header-container .header-wrap .header-main.active .column-nav-container .nav-web3-more.nav-web3-more {
  padding-bottom: 8px
}

body .header-container .header-wrap .header-main.active .nav-address {
  display: none
}

@media (min-width:1024px) {
  body .header-container .header-wrap .header-main.active .nav-address {
    display: flex;
    flex-shrink: 0
  }
}

body .header-container .header-wrap .header-main.active .mode-line.has-address {
  display: none
}

@media (min-width:1024px) {
  body .header-container .header-wrap .header-main.active .mode-line.has-address {
    display: block
  }

  body .header-container .header-wrap .header-main .nav-container .nav-doc .dp-c-l-ag .extend-box,
  body .header-container .header-wrap .header-main .nav-discovery .dp-c-l-ag .extend-box {
    margin-right: 0
  }

  body .header-container .header-wrap .header-main .nav-container .nav-doc .dp-c-l-ag .extend-box .explorer-drop-panel-third-list .box-item.drop-panel-box-item,
  body .header-container .header-wrap .header-main .nav-discovery .dp-c-l-ag .extend-box .explorer-drop-panel-third-list .box-item.drop-panel-box-item {
    display: flex;
    width: unset
  }

  body .header-container .header-wrap .header-main .nav-container .nav-doc .dp-c-l-ag .extend-box .box-item,
  body .header-container .header-wrap .header-main .nav-discovery .dp-c-l-ag .extend-box .box-item {
    display: flex;
    margin: unset;
    max-width: 342px
  }

  body .header-container .header-wrap .header-main .nav-container .nav-doc .dp-c-l-ag .extend-box .box-item.panel-box-item,
  body .header-container .header-wrap .header-main .nav-discovery .dp-c-l-ag .extend-box .box-item.panel-box-item {
    display: inline-flex;
    vertical-align: middle;
    width: 264px
  }
}

@media (min-width:1024px) {

  body .header-container .header-wrap .header-main .nav-container .nav-doc .dp-c-l-ag .extend-box .box-item.panel-box-item:not(:has(+.panel-drop-item-icon)):not(.third-box-item),
  body .header-container .header-wrap .header-main .nav-discovery .dp-c-l-ag .extend-box .box-item.panel-box-item:not(:has(+.panel-drop-item-icon)):not(.third-box-item) {
    width: 288px
  }

  body .header-container .header-wrap .header-main .nav-container .nav-doc .dp-c-l-ag .extend-box .box-item .icon-box,
  body .header-container .header-wrap .header-main .nav-discovery .dp-c-l-ag .extend-box .box-item .icon-box {
    margin-right: 8px;
    margin-top: -4px
  }

  body .header-container .header-wrap .header-main .nav-container .nav-doc .dp-c-l-ag .extend-box .box-item .item-box,
  body .header-container .header-wrap .header-main .nav-discovery .dp-c-l-ag .extend-box .box-item .item-box {
    display: flex;
    flex-direction: column;
    width: 100%
  }

  body .header-container .header-wrap .header-main .nav-container .nav-doc .dp-c-l-ag .extend-box .box-item .item-box.hide,
  body .header-container .header-wrap .header-main .nav-discovery .dp-c-l-ag .extend-box .box-item .item-box.hide {
    display: none
  }

  body .header-container .header-wrap .header-main .nav-container .nav-doc .dp-c-l-ag .extend-box .box-item .item-box.show,
  body .header-container .header-wrap .header-main .nav-container .nav-doc .dp-c-l-ag .only-new-box,
  body .header-container .header-wrap .header-main .nav-discovery .dp-c-l-ag .extend-box .box-item .item-box.show,
  body .header-container .header-wrap .header-main .nav-discovery .dp-c-l-ag .only-new-box {
    display: block
  }

  body .header-container .header-wrap .header-main .nav-container .nav-doc .dp-c-l-ag,
  body .header-container .header-wrap .header-main .nav-discovery .dp-c-l-ag {
    left: 50%;
    padding-bottom: 12px;
    padding-top: 12px;
    transform: translateX(-50%)
  }

  body .header-container .header-wrap .header-main .nav-container .nav-doc .dp-c-l-ag.drop-panel,
  body .header-container .header-wrap .header-main .nav-discovery .dp-c-l-ag.drop-panel {
    overflow: visible
  }

  body .header-container .header-wrap .header-main .nav-container .nav-doc .dp-c-l-ag .extend-box,
  body .header-container .header-wrap .header-main .nav-discovery .dp-c-l-ag .extend-box {
    min-width: 320px
  }

  body .header-container .header-wrap .header-main .nav-container .nav-doc .dp-c-l-ag .extend-box.drop-extend-box,
  body .header-container .header-wrap .header-main .nav-discovery .dp-c-l-ag .extend-box.drop-extend-box {
    min-width: auto
  }

  body .header-container .header-wrap .header-main .nav-container .nav-doc .dp-c-l-ag .extend-box .box-item,
  body .header-container .header-wrap .header-main .nav-discovery .dp-c-l-ag .extend-box .box-item {
    align-items: center;
    max-width: 400px
  }

  body .header-container .header-wrap .header-main .nav-container .nav-doc .dp-c-l-ag .extend-box .box-item.drop-panel-box-item,
  body .header-container .header-wrap .header-main .nav-discovery .dp-c-l-ag .extend-box .box-item.drop-panel-box-item {
    padding: 12px 8px
  }

  body .header-container .header-wrap .header-main .nav-container .nav-doc .dp-c-l-ag .extend-box .box-item .item-box .item-panel-drop-desc,
  body .header-container .header-wrap .header-main .nav-discovery .dp-c-l-ag .extend-box .box-item .item-box .item-panel-drop-desc {
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap
  }

  body .header-container .header-wrap .header-main .nav-container .nav-doc .dp-c-l-ag .extend-box:last-child,
  body .header-container .header-wrap .header-main .nav-discovery .dp-c-l-ag .extend-box:last-child {
    margin-right: 0
  }

  body .header-container .header-wrap .header-main .nav-container .nav-doc .dp-c-l-ag .extend-box .drop-menu-desc-list,
  body .header-container .header-wrap .header-main .nav-discovery .dp-c-l-ag .extend-box .drop-menu-desc-list {
    box-sizing: border-box;
    display: flex;
    padding-left: 52px;
    width: 100%
  }

  body .header-container .header-wrap .header-main .nav-container .nav-doc .dp-c-l-ag .extend-box .drop-menu-desc-list .drop-menu-list-item,
  body .header-container .header-wrap .header-main .nav-discovery .dp-c-l-ag .extend-box .drop-menu-desc-list .drop-menu-list-item {
    width: 172px
  }

  body .header-container .header-wrap .header-main .nav-container .nav-doc .dp-c-l-ag .extend-box .drop-menu-desc-list .drop-menu-list-item.drop-menu-reverse-list,
  body .header-container .header-wrap .header-main .nav-discovery .dp-c-l-ag .extend-box .drop-menu-desc-list .drop-menu-list-item.drop-menu-reverse-list {
    display: flex;
    flex-direction: column-reverse
  }

  body .header-container .header-wrap .header-main .nav-container .nav-doc .dp-c-l-ag .extend-box .drop-menu-desc-list .drop-menu-list-item .drop-menu-item,
  body .header-container .header-wrap .header-main .nav-discovery .dp-c-l-ag .extend-box .drop-menu-desc-list .drop-menu-list-item .drop-menu-item {
    border-radius: 4px;
    box-sizing: border-box;
    color: var(--oxnv-okd-color-content-primary);
    display: block;
    font-size: 14px;
    font-weight: 400;
    line-height: 16px;
    padding: 11px 4px 11px 21px;
    position: relative
  }

  body .header-container .header-wrap .header-main .nav-container .nav-doc .dp-c-l-ag .extend-box .drop-menu-desc-list .drop-menu-list-item .drop-menu-item:focus-visible,
  body .header-container .header-wrap .header-main .nav-discovery .dp-c-l-ag .extend-box .drop-menu-desc-list .drop-menu-list-item .drop-menu-item:focus-visible {
    border-radius: 4px;
    outline: 2px solid #000;
    outline-offset: 2px
  }

  body .header-container .header-wrap .header-main .nav-container .nav-doc .dp-c-l-ag .extend-box .drop-menu-desc-list .drop-menu-list-item .drop-menu-item:before,
  body .header-container .header-wrap .header-main .nav-discovery .dp-c-l-ag .extend-box .drop-menu-desc-list .drop-menu-list-item .drop-menu-item:before {
    background: var(--oxnv-okd-color-content-primary);
    border-radius: 50%;
    content: "";
    display: block;
    font-size: 12px;
    height: 5px;
    left: 8px;
    position: absolute;
    top: 16px;
    width: 5px
  }

  body .header-container .header-wrap .header-main .nav-container .nav-doc .dp-c-l-ag .extend-box .drop-menu-desc-list .drop-menu-list-item .drop-menu-item:hover,
  body .header-container .header-wrap .header-main .nav-discovery .dp-c-l-ag .extend-box .drop-menu-desc-list .drop-menu-list-item .drop-menu-item:hover {
    background: #f9f9f9;
    background: var(--header-lg-drop-box-item-bg-hover)
  }

  body .header-container .header-wrap .header-main .nav-container .nav-doc .dp-c-l-ag .extend-box .drop-menu-desc-list .drop-menu-list-item .drop-menu-item .nav-new-tag,
  body .header-container .header-wrap .header-main .nav-discovery .dp-c-l-ag .extend-box .drop-menu-desc-list .drop-menu-list-item .drop-menu-item .nav-new-tag {
    margin-left: 0
  }

  body .header-container .header-wrap .header-main .nav-container .nav-doc .dp-c-l-ag .extend-box .drop-menu-desc-list .drop-menu-list-item .drop-menu-item .new-tag-title-container,
  body .header-container .header-wrap .header-main .nav-discovery .dp-c-l-ag .extend-box .drop-menu-desc-list .drop-menu-list-item .drop-menu-item .new-tag-title-container {
    margin-right: 5px
  }
}

@media (min-width:1024px) and (min-width:1024px) {

  body .header-container .header-wrap .header-main .nav-container .nav-doc .dp-c-l-ag,
  body .header-container .header-wrap .header-main .nav-discovery .dp-c-l-ag {
    max-width: 700px
  }
}

.dp-c-l-ag .extend-box .drop-menu-desc-list {
  display: none
}

@media (min-width:1024px) {
  body .header-container .header-main .nav-container .nav-more .dp-c-l-ag {
    left: 50%;
    padding-bottom: 12px;
    padding-top: 12px;
    transform: translateX(-50%)
  }

  body .header-container .header-main .nav-container .nav-more .dp-c-l-ag .info-extend-box .extend-box {
    margin-right: 0;
    min-width: 200px
  }

  body .header-container .header-main .nav-container .nav-more .dp-c-l-ag .info-extend-box .extend-box:last-child {
    margin-right: 0
  }

  body .header-container .header-main .nav-container .nav-more .dp-c-l-ag .info-extend-box .extend-small-box .box-item {
    padding-right: 20px
  }

  body .header-container .header-main .nav-container .nav-more .drop-sm-down {
    overflow: visible
  }

  body .header-container .header-main .nav-container .nav-more .drop-sm-down .info-extend-box {
    position: relative
  }

  body .header-container .header-main .nav-container .nav-more .drop-sm-down .drop-explorer-list {
    width: 264px
  }

  body .header-container .header-main .nav-container .nav-more .drop-sm-down .drop-explorer-list .box-item {
    display: inline-flex;
    vertical-align: middle;
    width: 224px
  }

  body .header-container .header-main .nav-container .nav-more .drop-sm-down .drop-explorer-list .explorer-drop-box-list,
  body .header-container .header-main .nav-container .nav-more .drop-sm-down .drop-explorer-list .explorer-drop-panel-box-list {
    background: var(--oxnv-okd-color-container-primary);
    left: 100%;
    position: absolute;
    top: -13px
  }

  body .header-container .header-main .nav-container .nav-more .drop-sm-down .drop-explorer-list .explorer-drop-box-list.explorer-drop-panel-box-list,
  body .header-container .header-main .nav-container .nav-more .drop-sm-down .drop-explorer-list .explorer-drop-panel-box-list.explorer-drop-panel-box-list {
    min-height: 249px;
    min-width: 226px
  }

  body .header-container .header-main .nav-container .nav-more .drop-sm-down .drop-explorer-list .explorer-drop-box-list .drop-panel-box-item:hover,
  body .header-container .header-main .nav-container .nav-more .drop-sm-down .drop-explorer-list .explorer-drop-panel-box-list .drop-panel-box-item:hover {
    border-radius: 4px
  }

  body .header-container .header-main .nav-container .nav-more .drop-sm-down .drop-explorer-list .drop-panel-box-item:hover {
    border-radius: 4px 0 0 4px
  }

  body .header-container .header-main .nav-container .nav-more .drop-sm-down .drop-explorer-list .panel-drop-item-icon {
    border-radius: 0 4px 4px 0;
    display: inline-flex;
    vertical-align: middle
  }

  body .header-container .header-main .nav-container .nav-more .drop-sm-down .drop-explorer-list .hide-drop-panel-box {
    display: none
  }
}

@media (min-width:1024px) and (min-width:1024px) {
  body .header-container .header-main .nav-container .nav-more .dp-c-l-ag {
    max-width: 700px
  }
}

body .header-container .header-main.web3-header .nav-container .nav-more .dp-c-l-ag,
body .header-container .header-main.web3-header .nav-container .nav-web3-more .dp-c-l-ag {
  padding-bottom: 12px;
  padding-top: 12px;
  transform: translateX(-50%)
}

@media (min-width:1024px) {

  body .header-container .header-main.web3-header .nav-container .nav-more .dp-c-l-ag,
  body .header-container .header-main.web3-header .nav-container .nav-web3-more .dp-c-l-ag {
    max-width: 700px
  }
}

body .header-container .header-main.web3-header .nav-container .nav-more .dp-c-l-ag .info-extend-box .extend-box,
body .header-container .header-main.web3-header .nav-container .nav-web3-more .dp-c-l-ag .info-extend-box .extend-box {
  margin-right: 0;
  min-width: 200px
}

body .header-container .header-main.web3-header .nav-container .nav-more .dp-c-l-ag .info-extend-box .extend-box:last-child,
body .header-container .header-main.web3-header .nav-container .nav-web3-more .dp-c-l-ag .info-extend-box .extend-box:last-child {
  margin-right: 0
}

body .header-container .header-main.web3-header .nav-container .nav-more .dp-c-l-ag .info-extend-box .extend-small-box .box-item,
body .header-container .header-main.web3-header .nav-container .nav-web3-more .dp-c-l-ag .info-extend-box .extend-small-box .box-item {
  padding-right: 20px
}

body .header-container .header-main.web3-header .nav-container .nav-more .drop-sm-down,
body .header-container .header-main.web3-header .nav-container .nav-web3-more .drop-sm-down {
  overflow: visible
}

body .header-container .header-main.web3-header .nav-container .nav-more .drop-sm-down .info-extend-box,
body .header-container .header-main.web3-header .nav-container .nav-web3-more .drop-sm-down .info-extend-box {
  position: relative
}

body .header-container .header-main.web3-header .nav-container .nav-more .drop-sm-down .drop-explorer-list,
body .header-container .header-main.web3-header .nav-container .nav-web3-more .drop-sm-down .drop-explorer-list {
  width: 264px
}

body .header-container .header-main.web3-header .nav-container .nav-more .drop-sm-down .drop-explorer-list .box-item,
body .header-container .header-main.web3-header .nav-container .nav-web3-more .drop-sm-down .drop-explorer-list .box-item {
  display: inline-flex;
  vertical-align: middle;
  width: 224px
}

body .header-container .header-main.web3-header .nav-container .nav-more .drop-sm-down .drop-explorer-list .explorer-drop-box-list,
body .header-container .header-main.web3-header .nav-container .nav-more .drop-sm-down .drop-explorer-list .explorer-drop-panel-box-list,
body .header-container .header-main.web3-header .nav-container .nav-web3-more .drop-sm-down .drop-explorer-list .explorer-drop-box-list,
body .header-container .header-main.web3-header .nav-container .nav-web3-more .drop-sm-down .drop-explorer-list .explorer-drop-panel-box-list {
  background: var(--oxnv-okd-color-container-primary);
  left: 100%;
  position: absolute;
  top: -13px
}

body .header-container .header-main.web3-header .nav-container .nav-more .drop-sm-down .drop-explorer-list .explorer-drop-box-list.explorer-drop-panel-box-list,
body .header-container .header-main.web3-header .nav-container .nav-more .drop-sm-down .drop-explorer-list .explorer-drop-panel-box-list.explorer-drop-panel-box-list,
body .header-container .header-main.web3-header .nav-container .nav-web3-more .drop-sm-down .drop-explorer-list .explorer-drop-box-list.explorer-drop-panel-box-list,
body .header-container .header-main.web3-header .nav-container .nav-web3-more .drop-sm-down .drop-explorer-list .explorer-drop-panel-box-list.explorer-drop-panel-box-list {
  min-height: 249px;
  min-width: 226px
}

body .header-container .header-main.web3-header .nav-container .nav-more .drop-sm-down .drop-explorer-list .explorer-drop-box-list .drop-panel-box-item:hover,
body .header-container .header-main.web3-header .nav-container .nav-more .drop-sm-down .drop-explorer-list .explorer-drop-panel-box-list .drop-panel-box-item:hover,
body .header-container .header-main.web3-header .nav-container .nav-web3-more .drop-sm-down .drop-explorer-list .explorer-drop-box-list .drop-panel-box-item:hover,
body .header-container .header-main.web3-header .nav-container .nav-web3-more .drop-sm-down .drop-explorer-list .explorer-drop-panel-box-list .drop-panel-box-item:hover {
  border-radius: 4px
}

body .header-container .header-main.web3-header .nav-container .nav-more .drop-sm-down .drop-explorer-list .drop-panel-box-item:hover,
body .header-container .header-main.web3-header .nav-container .nav-web3-more .drop-sm-down .drop-explorer-list .drop-panel-box-item:hover {
  border-radius: 4px 0 0 4px
}

body .header-container .header-main.web3-header .nav-container .nav-more .drop-sm-down .drop-explorer-list .panel-drop-item-icon,
body .header-container .header-main.web3-header .nav-container .nav-web3-more .drop-sm-down .drop-explorer-list .panel-drop-item-icon {
  border-radius: 0 4px 4px 0;
  display: inline-flex;
  vertical-align: middle
}

body .header-container .header-main.web3-header .nav-container .nav-more .drop-sm-down .drop-explorer-list .hide-drop-panel-box,
body .header-container .header-main.web3-header .nav-container .nav-web3-more .drop-sm-down .drop-explorer-list .hide-drop-panel-box {
  display: none
}

body .header-container .header-main.web3-header .nav-container .nav-more .dp-c-l-ag,
body .header-container .header-main.web3-header .nav-container .nav-web3-more .dp-c-l-ag {
  left: 50%;
  right: 300px
}

@media (min-width:1456px) {

  body .header-container .header-main.web3-header .nav-container .nav-more .dp-c-l-ag,
  body .header-container .header-main.web3-header .nav-container .nav-web3-more .dp-c-l-ag {
    left: auto;
    right: auto
  }
}

body .header-container .header-main.web3-header .nav-container .nav-more .drop-sm-down .drop-explorer-list .box-item.mu-title,
body .header-container .header-main.web3-header .nav-container .nav-web3-more .drop-sm-down .drop-explorer-list .box-item.mu-title {
  width: 240px
}

body .header-container .header-main.web3-header .nav-container .nav-more .drop-sm-down,
body .header-container .header-main.web3-header .nav-container .nav-web3-more .drop-sm-down {
  min-height: 290px;
  position: fixed;
  top: 60px;
  width: -webkit-fit-content;
  width: -moz-fit-content;
  width: fit-content
}

body .header-container .header-main.web3-header .nav-container .nav-more .drop-sm-down .drop-explorer-list .box-item.third-box-item,
body .header-container .header-main.web3-header .nav-container .nav-web3-more .drop-sm-down .drop-explorer-list .box-item.third-box-item {
  max-width: 300px;
  min-width: max(260px, 100%);
  width: auto
}

body .header-container .header-main.web3-header .nav-container .nav-more .drop-sm-down .drop-explorer-list .explorer-drop-panel-box-list.explorer-drop-panel-box-list,
body .header-container .header-main.web3-header .nav-container .nav-web3-more .drop-sm-down .drop-explorer-list .explorer-drop-panel-box-list.explorer-drop-panel-box-list {
  min-height: 290px;
  width: 274px
}

body .header-container .header-main.web3-header .nav-container .nav-more .dp-c-l-ag .extend-box .box-item .item-box .item-title.title-without-desc,
body .header-container .header-main.web3-header .nav-container .nav-web3-more .dp-c-l-ag .extend-box .box-item .item-box .item-title.title-without-desc {
  padding-bottom: 0;
  padding-top: 0
}

body .header-container .header-main.web3-header .nav-container .nav-more.nav-web3-more-column .drop-sm-down,
body .header-container .header-main.web3-header .nav-container .nav-web3-more.nav-web3-more-column .drop-sm-down {
  left: auto;
  right: var(--header-nav-drop-right);
  transform: none
}

body .header-container .header-main.web3-header .nav-container .nav-more.nav-web3-more-column .drop-sm-down .info-extend-box,
body .header-container .header-main.web3-header .nav-container .nav-web3-more.nav-web3-more-column .drop-sm-down .info-extend-box {
  flex-direction: column
}

body .header-container .header-main.web3-header .nav-container .nav-more.nav-web3-more-column .drop-sm-down .info-extend-box .extend-box,
body .header-container .header-main.web3-header .nav-container .nav-web3-more.nav-web3-more-column .drop-sm-down .info-extend-box .extend-box {
  width: 100%
}

body .header-container .header-main.web3-header .nav-container .nav-more.nav-web3-more-column .drop-sm-down .info-extend-box .drop-explorer-list,
body .header-container .header-main.web3-header .nav-container .nav-web3-more.nav-web3-more-column .drop-sm-down .info-extend-box .drop-explorer-list {
  position: relative
}

body .header-container .header-main.web3-header .nav-container .nav-more.nav-web3-more-column .drop-sm-down .info-extend-box .drop-explorer-list .dp-explorer,
body .header-container .header-main.web3-header .nav-container .nav-web3-more.nav-web3-more-column .drop-sm-down .info-extend-box .drop-explorer-list .dp-explorer {
  margin: 0 -12px;
  max-width: unset
}

body .header-container .header-main.web3-header .nav-container .nav-more.nav-web3-more-column .drop-sm-down .info-extend-box .drop-explorer-list .dp-explorer:hover,
body .header-container .header-main.web3-header .nav-container .nav-web3-more.nav-web3-more-column .drop-sm-down .info-extend-box .drop-explorer-list .dp-explorer:hover {
  background: linear-gradient(90deg, transparent 12px, #f9f9f9 0, #f9f9f9 calc(100% - 12px), transparent calc(100% - 12px));
  background: linear-gradient(to right, transparent 12px, var(--header-lg-drop-box-item-bg-hover) 12px, var(--header-lg-drop-box-item-bg-hover) calc(100% - 12px), transparent calc(100% - 12px));
  border-radius: 20px
}

body .header-container .header-main.web3-header .nav-container .nav-more.nav-web3-more-column .drop-sm-down .info-extend-box .drop-explorer-list .dp-explorer .box-item,
body .header-container .header-main.web3-header .nav-container .nav-web3-more.nav-web3-more-column .drop-sm-down .info-extend-box .drop-explorer-list .dp-explorer .box-item {
  margin-left: 12px
}

body .header-container .header-main.web3-header .nav-container .nav-more.nav-web3-more-column .drop-sm-down .info-extend-box .drop-explorer-list .drop-panel-box-list,
body .header-container .header-main.web3-header .nav-container .nav-web3-more.nav-web3-more-column .drop-sm-down .info-extend-box .drop-explorer-list .drop-panel-box-list {
  border-radius: 12px;
  bottom: -12px;
  left: 276px;
  top: auto
}

body .header-container .header-main.web3-header .nav-container .nav-more.nav-web3-more-column .drop-sm-down .info-extend-box .drop-explorer-list .drop-explorer-list .panel-drop-item-icon,
body .header-container .header-main.web3-header .nav-container .nav-web3-more.nav-web3-more-column .drop-sm-down .info-extend-box .drop-explorer-list .drop-explorer-list .panel-drop-item-icon {
  margin-left: 10px
}

body .header-container .header-main .column-nav-container .column-drop-panel-box {
  box-shadow: none;
  position: static
}

body .header-container .header-main.not-login .nav-more .extend-small-box .box-item.item-campaign,
body .header-container .header-main.not-login .nav-more .extend-small-box .box-item.item-rewards,
body .header-container .header-main.not-login .nav-web3-more .extend-small-box .box-item.item-campaign,
body .header-container .header-main.not-login .nav-web3-more .extend-small-box .box-item.item-rewards {
  display: none
}

.keep-ltr {
  direction: ltr
}

.keep-rtl {
  direction: rtl
}

.panel-drop-item-icon:before {
  display: inline-block
}

.web3-header {
  --header-drop-third-bg-color: var(--oxnv-okd-color-container-primary);
  --header-drop-third-border-color: var(--oxnv-okd-color-container-primary);
  --header-lg-drop-box-item-title-hover: var(--oxnv-okd-color-content-contrast);
  --header-lg-drop-box-item-bg-hover: var(--oxnv-okd-color-background-surface-primary);
  --header-drop-container-border-radius: 12px
}

.theme-dark {
  --header-boost-icon-background: rgba(188, 255, 47, .15)
}

.theme-light {
  --header-boost-icon-background: #e9f4d1
}

.web3-root,
.web3-root .header-container {
  background-color: var(--oxnv-okd-color-background-base-primary)
}

:root {
  --global-header-height: 60px
}

.active-nav-web3,
.active-nav-web3:before {
  color: var(--oxnv-okd-color-content-primary)
}

body.brand-web3 .header-container .header-wrap {
  height: auto;
  min-height: 60px
}

body .header-container .header-wrap {
  background-color: var(--oxnv-okd-color-background-base-primary);
  color: var(--oxnv-okd-color-content-primary)
}

body .header-container .header-wrap .web3-header.header-main.active .nav-container .nav-l-container .nav-l-sec,
body .header-container .header-wrap .web3-header.web3-shrink-step-1 .nav-container .nav-l-container,
body .header-container .header-wrap .web3-header.web3-shrink-step-2 .nav-container .nav-l-container {
  opacity: 0;
  visibility: hidden;
  z-index: -1
}

body .header-container .header-wrap .web3-header.web3-shrink-step-1 .nav-container .nav-r-pan-i,
body .header-container .header-wrap .web3-header.web3-shrink-step-2 .nav-container .nav-r-pan-i {
  display: none
}

body .header-container .header-wrap .web3-header.web3-shrink-step-1 .nav-container .action-container,
body .header-container .header-wrap .web3-header.web3-shrink-step-2 .nav-container .action-container {
  display: inline-block
}

body .header-container .header-wrap .web3-header.web3-shrink-step-1.web3-shrink-step-2 .nav-container .nav-r-sec .nav-alert,
body .header-container .header-wrap .web3-header.web3-shrink-step-2.web3-shrink-step-2 .nav-container .nav-r-sec .nav-alert {
  display: none
}

body .header-container .header-wrap .web3-header.web3-shrink-step-1.web3-shrink-step-2 .nav-container .nav-r-sec .nav-boost-item,
body .header-container .header-wrap .web3-header.web3-shrink-step-2.web3-shrink-step-2 .nav-container .nav-r-sec .nav-boost-item {
  margin-right: 8px
}

body .header-container .header-wrap .web3-header.web3-shrink-step-1.web3-shrink-step-2 .column-nav-container .nav-alert,
body .header-container .header-wrap .web3-header.web3-shrink-step-2.web3-shrink-step-2 .column-nav-container .nav-alert {
  display: flex
}

body .header-container .header-wrap .web3-header .nav-container {
  padding-left: 12px
}

body .header-container .header-wrap .web3-header .nav-container .nav-scroll-box .nav-scroll-l,
body .header-container .header-wrap .web3-header .nav-container .nav-scroll-box .nav-scroll-r {
  align-items: center;
  align-self: center;
  color: var(--oxnv-okd-color-content-contrast);
  cursor: pointer;
  font-size: 24px;
  justify-content: center;
  visibility: hidden
}

body .header-container .header-wrap .web3-header .nav-container .nav-scroll-box .nav-scroll-l.nav-scroll-icon,
body .header-container .header-wrap .web3-header .nav-container .nav-scroll-box .nav-scroll-r.nav-scroll-icon {
  display: flex;
  visibility: visible
}

body .header-container .header-wrap .web3-header .nav-container .nav-scroll-box .nav-scroll-l.nav-scroll-icon:after,
body .header-container .header-wrap .web3-header .nav-container .nav-scroll-box .nav-scroll-r.nav-scroll-icon:after {
  visibility: visible
}

body .header-container .header-wrap .web3-header .nav-container .nav-scroll-box .nav-scroll-l:hover,
body .header-container .header-wrap .web3-header .nav-container .nav-scroll-box .nav-scroll-r:hover {
  background-color: var(--oxnv-okd-color-background-surface-primary);
  border-radius: 6px;
  color: var(--oxnv-okd-color-content-primary)
}

body .header-container .header-wrap .web3-header .nav-container .nav-scroll-box .nav-scroll-l.nav-scroll-l,
body .header-container .header-wrap .web3-header .nav-container .nav-scroll-box .nav-scroll-r.nav-scroll-l {
  margin-left: 12px;
  position: relative
}

body .header-container .header-wrap .web3-header .nav-container .nav-scroll-box .nav-scroll-l.nav-scroll-l:after,
body .header-container .header-wrap .web3-header .nav-container .nav-scroll-box .nav-scroll-r.nav-scroll-l:after {
  background: linear-gradient(90deg, var(--oxnv-okd-color-background-base-primary) 0, transparent 100%);
  content: "";
  height: 100%;
  left: 24px;
  pointer-events: none;
  position: absolute;
  top: 0;
  visibility: hidden;
  width: 20px;
  z-index: 1
}

body .header-container .header-wrap .web3-header .nav-container .nav-scroll-box .nav-scroll-l.nav-scroll-l:before,
body .header-container .header-wrap .web3-header .nav-container .nav-scroll-box .nav-scroll-r.nav-scroll-l:before {
  transform: rotate(-90deg)
}

body .header-container .header-wrap .web3-header .nav-container .nav-scroll-box .nav-scroll-l.nav-scroll-r,
body .header-container .header-wrap .web3-header .nav-container .nav-scroll-box .nav-scroll-r.nav-scroll-r {
  margin-left: 16px
}

body .header-container .header-wrap .web3-header .nav-container .nav-scroll-box .nav-scroll-l.nav-scroll-r:before,
body .header-container .header-wrap .web3-header .nav-container .nav-scroll-box .nav-scroll-r.nav-scroll-r:before {
  transform: rotate(90deg)
}

body .header-container .header-wrap .web3-header .nav-container .action-container {
  display: none
}

body .header-container .header-wrap .web3-header .nav-container .nav-l-container {
  align-items: center;
  display: flex;
  position: relative
}

body .header-container .header-wrap .web3-header .nav-container .nav-l-container.nav-l-gradient-show:after {
  visibility: visible
}

body .header-container .header-wrap .web3-header .nav-container .nav-l-container:after {
  background: linear-gradient(270deg, var(--oxnv-okd-color-background-base-primary) 0, transparent 100%);
  content: "";
  height: 100%;
  pointer-events: none;
  position: absolute;
  right: 36px;
  top: 0;
  visibility: hidden;
  width: 20px;
  z-index: 1
}

body .header-container .header-wrap .web3-header .nav-container .nav-l-container .nav-l-sec {
  overflow-x: auto;
  overflow-y: hidden
}

body .header-container .header-wrap .web3-header .nav-container .nav-l-container .nav-l-sec .nav-l-con {
  flex-wrap: nowrap;
  min-width: -webkit-max-content;
  min-width: -moz-max-content;
  min-width: max-content
}

body .header-container .header-wrap .web3-header .nav-container .nav-l-container .nav-l-sec .nav-item:first-child {
  margin-left: 0
}

body .header-container .header-wrap .web3-header .nav-container .nav-l-container .nav-l-sec .nav-item:last-child {
  margin-right: 0
}

body .header-container .header-wrap .web3-header .nav-container .nav-l-container .nav-l-sec .nav-item .nav-link:hover,
body .header-container .header-wrap .web3-header .nav-container .nav-l-container .nav-l-sec .nav-item .nav-link:hover:before,
body .header-container .header-wrap .web3-header .nav-container .nav-l-container .nav-l-sec .nav-item .nav-text:hover,
body .header-container .header-wrap .web3-header .nav-container .nav-l-container .nav-l-sec .nav-item .nav-text:hover:before,
body .header-container .header-wrap .web3-header .nav-container .nav-l-container .nav-l-sec .nav-item.current-active-nav .nav-link,
body .header-container .header-wrap .web3-header .nav-container .nav-l-container .nav-l-sec .nav-item.current-active-nav .nav-link:before,
body .header-container .header-wrap .web3-header .nav-container .nav-l-container .nav-l-sec .nav-item.current-active-nav .nav-text,
body .header-container .header-wrap .web3-header .nav-container .nav-l-container .nav-l-sec .nav-item.current-active-nav .nav-text:before,
body .header-container .header-wrap .web3-header .nav-container .nav-l-container .nav-l-sec .nav-item.current-active-nav.nav-link,
body .header-container .header-wrap .web3-header .nav-container .nav-l-container .nav-l-sec .nav-item.current-active-nav.nav-link:before,
body .header-container .header-wrap .web3-header .nav-container .nav-l-container .nav-l-sec .nav-item.nav-link:hover,
body .header-container .header-wrap .web3-header .nav-container .nav-l-container .nav-l-sec .nav-item.nav-link:hover:before {
  color: var(--oxnv-okd-color-content-primary)
}

body .header-container .header-wrap .web3-header .nav-container .nav-l-container .nav-l-sec .nav-item .nav-link,
body .header-container .header-wrap .web3-header .nav-container .nav-l-container .nav-l-sec .nav-item .nav-text,
body .header-container .header-wrap .web3-header .nav-container .nav-l-container .nav-l-sec .nav-item.nav-link {
  color: var(--oxnv-okd-color-content-contrast);
  font-size: 14px
}

body .header-container .header-wrap .web3-header .nav-container .nav-l-container .nav-l-sec .nav-item .nav-link:before,
body .header-container .header-wrap .web3-header .nav-container .nav-l-container .nav-l-sec .nav-item .nav-text:before,
body .header-container .header-wrap .web3-header .nav-container .nav-l-container .nav-l-sec .nav-item.nav-link:before {
  color: var(--oxnv-okd-color-content-contrast)
}

body .header-container .header-wrap .web3-header .nav-container .nav-r-con,
body .header-container .header-wrap .web3-header .nav-container .nav-r-sec {
  display: flex;
  flex-shrink: 0;
  height: 60px
}

body .header-container .header-wrap .web3-header .nav-container .nav-r-con.nav-r-sec,
body .header-container .header-wrap .web3-header .nav-container .nav-r-sec.nav-r-sec {
  margin-left: 24px
}

body .header-container .header-wrap .web3-header .nav-container .nav-boost-item {
  margin-left: 0
}

@media (min-width:1024px) {
  body .header-container .header-wrap .web3-header .nav-container .nav-boost-item .dp-c-l-ag .extend-box .box-item {
    max-width: 320px
  }
}

body .header-container .header-wrap .web3-header .nav-container .dp-c-l-ag {
  border: 1px solid var(--oxnv-okd-color-border-primary);
  box-shadow: 0 10px 15px -3px rgba(0, 0, 0, .1), 0 4px 6px -2px rgba(0, 0, 0, .05)
}

body .header-container .header-wrap .web3-header .nav-container .dp-c-l-ag .drop-panel-box-list {
  border: 1px solid var(--oxnv-okd-color-border-primary);
  top: -13px
}

body .header-container .header-wrap .web3-header .nav-container .dp-c-l-ag .explorer-drop-box-list {
  max-width: 320px;
  min-height: 290px;
  min-width: 274px;
  width: auto
}

body .header-container .header-wrap .web3-header .nav-container .nav-address {
  align-items: center;
  margin: 0 8px;
  padding: 0
}

@media (max-width:767px) {
  body .header-container .header-wrap .web3-header .nav-container .nav-address {
    margin-right: 0
  }
}

@media (min-width:1024px) {

  body .header-container .header-wrap .web3-header .nav-container .dp-c-l-ag,
  body .header-container .header-wrap .web3-header .nav-container .nav-doc .dp-c-l-ag,
  body .header-container .header-wrap .web3-header .nav-discovery .dp-c-l-ag {
    left: 50%;
    padding-bottom: 12px;
    padding-top: 12px;
    transform: translateX(-50%)
  }

  body .header-container .header-wrap .web3-header .nav-container .dp-c-l-ag.drop-panel,
  body .header-container .header-wrap .web3-header .nav-container .nav-doc .dp-c-l-ag.drop-panel,
  body .header-container .header-wrap .web3-header .nav-discovery .dp-c-l-ag.drop-panel {
    overflow: visible
  }

  body .header-container .header-wrap .web3-header .nav-container .dp-c-l-ag .extend-box,
  body .header-container .header-wrap .web3-header .nav-container .nav-doc .dp-c-l-ag .extend-box,
  body .header-container .header-wrap .web3-header .nav-discovery .dp-c-l-ag .extend-box {
    min-width: 320px
  }

  body .header-container .header-wrap .web3-header .nav-container .dp-c-l-ag .extend-box.drop-extend-box,
  body .header-container .header-wrap .web3-header .nav-container .nav-doc .dp-c-l-ag .extend-box.drop-extend-box,
  body .header-container .header-wrap .web3-header .nav-discovery .dp-c-l-ag .extend-box.drop-extend-box {
    min-width: auto
  }

  body .header-container .header-wrap .web3-header .nav-container .dp-c-l-ag .extend-box .box-item,
  body .header-container .header-wrap .web3-header .nav-container .nav-doc .dp-c-l-ag .extend-box .box-item,
  body .header-container .header-wrap .web3-header .nav-discovery .dp-c-l-ag .extend-box .box-item {
    align-items: center;
    max-width: 400px
  }

  body .header-container .header-wrap .web3-header .nav-container .dp-c-l-ag .extend-box .box-item.drop-panel-box-item,
  body .header-container .header-wrap .web3-header .nav-container .nav-doc .dp-c-l-ag .extend-box .box-item.drop-panel-box-item,
  body .header-container .header-wrap .web3-header .nav-discovery .dp-c-l-ag .extend-box .box-item.drop-panel-box-item {
    padding: 12px 8px
  }

  body .header-container .header-wrap .web3-header .nav-container .dp-c-l-ag .extend-box .box-item .item-box .item-panel-drop-desc,
  body .header-container .header-wrap .web3-header .nav-container .nav-doc .dp-c-l-ag .extend-box .box-item .item-box .item-panel-drop-desc,
  body .header-container .header-wrap .web3-header .nav-discovery .dp-c-l-ag .extend-box .box-item .item-box .item-panel-drop-desc {
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap
  }

  body .header-container .header-wrap .web3-header .nav-container .dp-c-l-ag .extend-box:last-child,
  body .header-container .header-wrap .web3-header .nav-container .nav-doc .dp-c-l-ag .extend-box:last-child,
  body .header-container .header-wrap .web3-header .nav-discovery .dp-c-l-ag .extend-box:last-child {
    margin-right: 0
  }

  body .header-container .header-wrap .web3-header .nav-container .dp-c-l-ag .extend-box .drop-menu-desc-list,
  body .header-container .header-wrap .web3-header .nav-container .nav-doc .dp-c-l-ag .extend-box .drop-menu-desc-list,
  body .header-container .header-wrap .web3-header .nav-discovery .dp-c-l-ag .extend-box .drop-menu-desc-list {
    box-sizing: border-box;
    display: flex;
    padding-left: 52px;
    width: 100%
  }

  body .header-container .header-wrap .web3-header .nav-container .dp-c-l-ag .extend-box .drop-menu-desc-list .drop-menu-list-item,
  body .header-container .header-wrap .web3-header .nav-container .nav-doc .dp-c-l-ag .extend-box .drop-menu-desc-list .drop-menu-list-item,
  body .header-container .header-wrap .web3-header .nav-discovery .dp-c-l-ag .extend-box .drop-menu-desc-list .drop-menu-list-item {
    width: 172px
  }

  body .header-container .header-wrap .web3-header .nav-container .dp-c-l-ag .extend-box .drop-menu-desc-list .drop-menu-list-item.drop-menu-reverse-list,
  body .header-container .header-wrap .web3-header .nav-container .nav-doc .dp-c-l-ag .extend-box .drop-menu-desc-list .drop-menu-list-item.drop-menu-reverse-list,
  body .header-container .header-wrap .web3-header .nav-discovery .dp-c-l-ag .extend-box .drop-menu-desc-list .drop-menu-list-item.drop-menu-reverse-list {
    display: flex;
    flex-direction: column-reverse
  }

  body .header-container .header-wrap .web3-header .nav-container .dp-c-l-ag .extend-box .drop-menu-desc-list .drop-menu-list-item .drop-menu-item,
  body .header-container .header-wrap .web3-header .nav-container .nav-doc .dp-c-l-ag .extend-box .drop-menu-desc-list .drop-menu-list-item .drop-menu-item,
  body .header-container .header-wrap .web3-header .nav-discovery .dp-c-l-ag .extend-box .drop-menu-desc-list .drop-menu-list-item .drop-menu-item {
    border-radius: 4px;
    box-sizing: border-box;
    color: var(--oxnv-okd-color-content-primary);
    display: block;
    font-size: 14px;
    font-weight: 400;
    line-height: 16px;
    padding: 11px 4px 11px 21px;
    position: relative
  }

  body .header-container .header-wrap .web3-header .nav-container .dp-c-l-ag .extend-box .drop-menu-desc-list .drop-menu-list-item .drop-menu-item:focus-visible,
  body .header-container .header-wrap .web3-header .nav-container .nav-doc .dp-c-l-ag .extend-box .drop-menu-desc-list .drop-menu-list-item .drop-menu-item:focus-visible,
  body .header-container .header-wrap .web3-header .nav-discovery .dp-c-l-ag .extend-box .drop-menu-desc-list .drop-menu-list-item .drop-menu-item:focus-visible {
    border-radius: 4px;
    outline: 2px solid #000;
    outline-offset: 2px
  }

  body .header-container .header-wrap .web3-header .nav-container .dp-c-l-ag .extend-box .drop-menu-desc-list .drop-menu-list-item .drop-menu-item:before,
  body .header-container .header-wrap .web3-header .nav-container .nav-doc .dp-c-l-ag .extend-box .drop-menu-desc-list .drop-menu-list-item .drop-menu-item:before,
  body .header-container .header-wrap .web3-header .nav-discovery .dp-c-l-ag .extend-box .drop-menu-desc-list .drop-menu-list-item .drop-menu-item:before {
    background: var(--oxnv-okd-color-content-primary);
    border-radius: 50%;
    content: "";
    display: block;
    font-size: 12px;
    height: 5px;
    left: 8px;
    position: absolute;
    top: 16px;
    width: 5px
  }

  body .header-container .header-wrap .web3-header .nav-container .dp-c-l-ag .extend-box .drop-menu-desc-list .drop-menu-list-item .drop-menu-item:hover,
  body .header-container .header-wrap .web3-header .nav-container .nav-doc .dp-c-l-ag .extend-box .drop-menu-desc-list .drop-menu-list-item .drop-menu-item:hover,
  body .header-container .header-wrap .web3-header .nav-discovery .dp-c-l-ag .extend-box .drop-menu-desc-list .drop-menu-list-item .drop-menu-item:hover {
    background: #f9f9f9;
    background: var(--header-lg-drop-box-item-bg-hover)
  }

  body .header-container .header-wrap .web3-header .nav-container .dp-c-l-ag .extend-box .drop-menu-desc-list .drop-menu-list-item .drop-menu-item .nav-new-tag,
  body .header-container .header-wrap .web3-header .nav-container .nav-doc .dp-c-l-ag .extend-box .drop-menu-desc-list .drop-menu-list-item .drop-menu-item .nav-new-tag,
  body .header-container .header-wrap .web3-header .nav-discovery .dp-c-l-ag .extend-box .drop-menu-desc-list .drop-menu-list-item .drop-menu-item .nav-new-tag {
    margin-left: 0
  }

  body .header-container .header-wrap .web3-header .nav-container .dp-c-l-ag .extend-box .drop-menu-desc-list .drop-menu-list-item .drop-menu-item .new-tag-title-container,
  body .header-container .header-wrap .web3-header .nav-container .nav-doc .dp-c-l-ag .extend-box .drop-menu-desc-list .drop-menu-list-item .drop-menu-item .new-tag-title-container,
  body .header-container .header-wrap .web3-header .nav-discovery .dp-c-l-ag .extend-box .drop-menu-desc-list .drop-menu-list-item .drop-menu-item .new-tag-title-container {
    margin-right: 5px
  }

  body .header-container .header-wrap .web3-header .nav-container .dp-c-l-ag .extend-box,
  body .header-container .header-wrap .web3-header .nav-container .nav-doc .dp-c-l-ag .extend-box,
  body .header-container .header-wrap .web3-header .nav-discovery .dp-c-l-ag .extend-box {
    min-width: 276px
  }
}

@media (min-width:1024px) and (min-width:1024px) {

  body .header-container .header-wrap .web3-header .nav-container .dp-c-l-ag,
  body .header-container .header-wrap .web3-header .nav-container .nav-doc .dp-c-l-ag,
  body .header-container .header-wrap .web3-header .nav-discovery .dp-c-l-ag {
    max-width: 700px
  }
}

@media (min-width:1024px) {

  body .header-container .header-wrap .web3-header .nav-container .nav-web3-market .nav-text,
  body .header-container .header-wrap .web3-header .nav-defi-trade .nav-text {
    display: flex
  }

  body .header-container .header-wrap .web3-header .nav-container .nav-web3-market .dp-c-l-ag,
  body .header-container .header-wrap .web3-header .nav-defi-trade .dp-c-l-ag {
    left: -2px
  }

  body .header-container .header-wrap .web3-header .nav-container .nav-web3-market .dp-c-l-ag .extend-box,
  body .header-container .header-wrap .web3-header .nav-defi-trade .dp-c-l-ag .extend-box {
    margin-right: 0;
    min-width: 320px
  }

  body .header-container .header-wrap .web3-header .nav-container .nav-web3-market .dp-c-l-ag .extend-box .box-item,
  body .header-container .header-wrap .web3-header .nav-defi-trade .dp-c-l-ag .extend-box .box-item {
    display: flex;
    margin: unset;
    max-width: 342px
  }

  body .header-container .header-wrap .web3-header .nav-container .nav-web3-market .dp-c-l-ag .extend-box .box-item .icon-box,
  body .header-container .header-wrap .web3-header .nav-defi-trade .dp-c-l-ag .extend-box .box-item .icon-box {
    margin-right: 8px;
    margin-top: -4px
  }

  body .header-container .header-wrap .web3-header .nav-container .nav-web3-market .dp-c-l-ag .extend-box .box-item .item-box,
  body .header-container .header-wrap .web3-header .nav-defi-trade .dp-c-l-ag .extend-box .box-item .item-box {
    display: flex;
    flex-direction: column;
    width: 100%
  }

  body .header-container .header-wrap .web3-header .nav-container .nav-web3-market .dp-c-l-ag .extend-box .box-item .item-box .item-title,
  body .header-container .header-wrap .web3-header .nav-container .nav-web3-market .dp-c-l-ag .extend-box .box-item .item-box .item-title:not(.trade-item-panel-drop-title),
  body .header-container .header-wrap .web3-header .nav-defi-trade .dp-c-l-ag .extend-box .box-item .item-box .item-title,
  body .header-container .header-wrap .web3-header .nav-defi-trade .dp-c-l-ag .extend-box .box-item .item-box .item-title:not(.trade-item-panel-drop-title) {
    white-space: nowrap
  }

  body .header-container .header-wrap .web3-header .nav-container .nav-web3-market.nav-web3-market .dp-c-l-ag,
  body .header-container .header-wrap .web3-header .nav-defi-trade.nav-web3-market .dp-c-l-ag {
    transform: translateX(-30%)
  }
}

body .header-container .header-wrap .web3-header .action-container .header-menu-btn:before {
  padding: 22px 0
}

body .header-container .header-wrap .web3-header.active .column-nav-container .nav-right-item.nav-boost-item {
  display: flex
}

body .header-container .header-wrap .web3-header .column-nav-container .nav-scroll-box {
  padding: 0 16px 48px
}

body .header-container .header-wrap .web3-header .column-nav-container .nav-right-item {
  margin: 0
}

body .header-container .header-wrap .web3-header .column-nav-container .nav-right-item.nav-boost-item {
  border-top: 1px solid var(--oxnv-okd-color-border-primary);
  display: none;
  padding-top: 8px
}

body .header-container .header-wrap .web3-header .column-nav-container .nav-right-item.nav-boost-item .dp-c-l-ag {
  margin-top: -10px
}

body .header-container .header-wrap .web3-header .column-nav-container .nav-item.nav-alert {
  display: none
}

body .header-container .header-wrap .web3-header .column-nav-container .nav-item.nav-web3-more .dp-explorer .box-item {
  height: auto;
  padding: 0
}

body .header-container .header-wrap .web3-header .column-nav-container .nav-item.nav-web3-more .info-extend-box {
  margin-top: -10px
}

body .header-container .header-wrap .web3-header .column-nav-container .nav-item.nav-web3-more .column-drop-panel-box {
  padding-bottom: 0;
  padding-top: 0;
  width: 100%
}

body .header-container .header-wrap .web3-header .column-nav-container .nav-item.nav-web3-more .column-drop-panel-box .box-item {
  height: auto;
  padding: 0
}

body .header-container .header-wrap .web3-header .column-nav-container .column-drop-panel-box {
  background-color: initial;
  border: none;
  margin: 0
}

#YSF-BTN-HOLDER {
  display: none !important
}

body[data-nav=false] .header-container {
  display: none
}

body[data-nav=true] .header-container {
  display: block
}

.okx-wallet-line-draw {
  --ok-icon-font-family: "ok-3069fce099"
}

.okx-wallet-line-draw:before {
  content: "\e05b";
  font-family: ok-3069fce099
}

.okx-wallet-loading {
  --ok-icon-font-family: "ok-3069fce099"
}

.okx-wallet-loading:before {
  content: "\e05a";
  font-family: ok-3069fce099
}

.okx-wallet-web3-toolkit {
  --ok-icon-font-family: "ok-3069fce099"
}

.okx-wallet-web3-toolkit:before {
  content: "\e059";
  font-family: ok-3069fce099
}

.okx-wallet-web3-liquidity {
  --ok-icon-font-family: "ok-3069fce099"
}

.okx-wallet-web3-liquidity:before {
  content: "\e058";
  font-family: ok-3069fce099
}

.okx-wallet-unlink {
  --ok-icon-font-family: "ok-3069fce099"
}

.okx-wallet-unlink:before {
  content: "\e01c";
  font-family: ok-3069fce099
}

.okx-wallet-setting {
  --ok-icon-font-family: "ok-3069fce099"
}

.okx-wallet-setting:before {
  content: "\e057";
  font-family: ok-3069fce099
}

.okx-wallet-copy {
  --ok-icon-font-family: "ok-3069fce099"
}

.okx-wallet-copy:before {
  content: "\e003";
  font-family: ok-3069fce099
}

.okx-wallet-analysis {
  --ok-icon-font-family: "ok-3069fce099"
}

.okx-wallet-analysis:before {
  content: "\e056";
  font-family: ok-3069fce099
}

.okx-wallet-collapse {
  --ok-icon-font-family: "ok-3069fce099"
}

.okx-wallet-collapse:before {
  content: "\e054";
  font-family: ok-3069fce099
}

.okx-wallet-expand {
  --ok-icon-font-family: "ok-3069fce099"
}

.okx-wallet-expand:before {
  content: "\e055";
  font-family: ok-3069fce099
}

.okx-wallet-web3-voucher {
  --ok-icon-font-family: "ok-3069fce099"
}

.okx-wallet-web3-voucher:before {
  content: "\e053";
  font-family: ok-3069fce099
}

.okx-wallet-web3-filtered {
  --ok-icon-font-family: "ok-3069fce099"
}

.okx-wallet-web3-filtered:before {
  content: "\e052";
  font-family: ok-3069fce099
}

.okx-wallet-reward-filled {
  --ok-icon-font-family: "ok-3069fce099"
}

.okx-wallet-reward-filled:before {
  content: "\e051";
  font-family: ok-3069fce099
}

.okx-wallet-nav-wallet {
  --ok-icon-font-family: "ok-3069fce099"
}

.okx-wallet-nav-wallet:before {
  content: "\e050";
  font-family: ok-3069fce099
}

.okx-wallet-open-link {
  --ok-icon-font-family: "ok-3069fce099"
}

.okx-wallet-open-link:before {
  content: "\e04f";
  font-family: ok-3069fce099
}

.okx-wallet-spot-DCA {
  --ok-icon-font-family: "ok-3069fce099"
}

.okx-wallet-spot-DCA:before {
  content: "\e04e";
  font-family: ok-3069fce099
}

.okx-wallet-wire-transfer {
  --ok-icon-font-family: "ok-3069fce099"
}

.okx-wallet-wire-transfer:before {
  content: "\e04d";
  font-family: ok-3069fce099
}

.okx-wallet-list-filtered {
  --ok-icon-font-family: "ok-3069fce099"
}

.okx-wallet-list-filtered:before {
  content: "\e04c";
  font-family: ok-3069fce099
}

.okx-wallet-list-filter {
  --ok-icon-font-family: "ok-3069fce099"
}

.okx-wallet-list-filter:before {
  content: "\e04b";
  font-family: ok-3069fce099
}

.okx-wallet-security-completed-filled {
  --ok-icon-font-family: "ok-3069fce099"
}

.okx-wallet-security-completed-filled:before {
  content: "\e04a";
  font-family: ok-3069fce099
}

.okx-wallet-rade-simple {
  --ok-icon-font-family: "ok-3069fce099"
}

.okx-wallet-rade-simple:before {
  content: "\e049";
  font-family: ok-3069fce099
}

.okx-wallet-report-filled {
  --ok-icon-font-family: "ok-3069fce099"
}

.okx-wallet-report-filled:before {
  content: "\e048";
  font-family: ok-3069fce099
}

.okx-wallet-risk-filled {
  --ok-icon-font-family: "ok-3069fce099"
}

.okx-wallet-risk-filled:before {
  content: "\e047";
  font-family: ok-3069fce099
}

.okx-wallet-report {
  --ok-icon-font-family: "ok-3069fce099"
}

.okx-wallet-report:before {
  content: "\e046";
  font-family: ok-3069fce099
}

.okx-wallet-paper-filled {
  --ok-icon-font-family: "ok-3069fce099"
}

.okx-wallet-paper-filled:before {
  content: "\e045";
  font-family: ok-3069fce099
}

.okx-wallet-diamond-1 {
  --ok-icon-font-family: "ok-3069fce099"
}

.okx-wallet-diamond-1:before {
  content: "\e044";
  font-family: ok-3069fce099
}

.okx-wallet-kol-filled {
  --ok-icon-font-family: "ok-3069fce099"
}

.okx-wallet-kol-filled:before {
  content: "\e043";
  font-family: ok-3069fce099
}

.okx-wallet-like-filled {
  --ok-icon-font-family: "ok-3069fce099"
}

.okx-wallet-like-filled:before {
  content: "\e041";
  font-family: ok-3069fce099
}

.okx-wallet-like {
  --ok-icon-font-family: "ok-3069fce099"
}

.okx-wallet-like:before {
  content: "\e042";
  font-family: ok-3069fce099
}

.okx-wallet-question-mark {
  --ok-icon-font-family: "ok-3069fce099"
}

.okx-wallet-question-mark:before {
  content: "\e040";
  font-family: ok-3069fce099
}

.okx-wallet-camera {
  --ok-icon-font-family: "ok-3069fce099"
}

.okx-wallet-camera:before {
  content: "\e03e";
  font-family: ok-3069fce099
}

.okx-wallet-pointer-right {
  --ok-icon-font-family: "ok-3069fce099"
}

.okx-wallet-pointer-right:before {
  content: "\e03f";
  font-family: ok-3069fce099
}

.okx-wallet-network {
  --ok-icon-font-family: "ok-3069fce099"
}

.okx-wallet-network:before {
  content: "\e03d";
  font-family: ok-3069fce099
}

.okx-wallet-chevron-right {
  --ok-icon-font-family: "ok-3069fce099"
}

.okx-wallet-chevron-right:before {
  content: "\e03c";
  font-family: ok-3069fce099
}

.okx-wallet-warning {
  --ok-icon-font-family: "ok-3069fce099"
}

.okx-wallet-warning:before {
  content: "\e03b";
  font-family: ok-3069fce099
}

.okx-wallet-pump-smart-money {
  --ok-icon-font-family: "ok-3069fce099"
}

.okx-wallet-pump-smart-money:before {
  content: "\e037";
  font-family: ok-3069fce099
}

.okx-wallet-bot {
  --ok-icon-font-family: "ok-3069fce099"
}

.okx-wallet-bot:before {
  content: "\e038";
  font-family: ok-3069fce099
}

.okx-wallet-gold-dog-expert {
  --ok-icon-font-family: "ok-3069fce099"
}

.okx-wallet-gold-dog-expert:before {
  content: "\e039";
  font-family: ok-3069fce099
}

.okx-wallet-all {
  --ok-icon-font-family: "ok-3069fce099"
}

.okx-wallet-all:before {
  content: "\e03a";
  font-family: ok-3069fce099
}

.okx-wallet-kol {
  --ok-icon-font-family: "ok-3069fce099"
}

.okx-wallet-kol:before {
  content: "\e034";
  font-family: ok-3069fce099
}

.okx-wallet-smart-money {
  --ok-icon-font-family: "ok-3069fce099"
}

.okx-wallet-smart-money:before {
  content: "\e035";
  font-family: ok-3069fce099
}

.okx-wallet-whale {
  --ok-icon-font-family: "ok-3069fce099"
}

.okx-wallet-whale:before {
  content: "\e036";
  font-family: ok-3069fce099
}

.okx-wallet-communities {
  --ok-icon-font-family: "ok-3069fce099"
}

.okx-wallet-communities:before {
  content: "\e033";
  font-family: ok-3069fce099
}

.okx-wallet-toolkit {
  --ok-icon-font-family: "ok-3069fce099"
}

.okx-wallet-toolkit:before {
  content: "\e032";
  font-family: ok-3069fce099
}

.okx-wallet-full-logo {
  --ok-icon-font-family: "ok-3069fce099"
}

.okx-wallet-full-logo:before {
  content: "\e030";
  font-family: ok-3069fce099
}

.okx-wallet-logox {
  --ok-icon-font-family: "ok-3069fce099"
}

.okx-wallet-logox:before {
  content: "\e031";
  font-family: ok-3069fce099
}

.okx-wallet-security {
  --ok-icon-font-family: "ok-3069fce099"
}

.okx-wallet-security:before {
  content: "\e02e";
  font-family: ok-3069fce099
}

.okx-wallet-copiers {
  --ok-icon-font-family: "ok-3069fce099"
}

.okx-wallet-copiers:before {
  content: "\e02f";
  font-family: ok-3069fce099
}

.okx-wallet-suspicious {
  --ok-icon-font-family: "ok-3069fce099"
}

.okx-wallet-suspicious:before {
  content: "\e02d";
  font-family: ok-3069fce099
}

.okx-wallet-thumb {
  --ok-icon-font-family: "ok-3069fce099"
}

.okx-wallet-thumb:before {
  content: "\e02c";
  font-family: ok-3069fce099
}

.okx-wallet-rankings {
  --ok-icon-font-family: "ok-3069fce099"
}

.okx-wallet-rankings:before {
  content: "\e02b";
  font-family: ok-3069fce099
}

.okx-wallet-link {
  --ok-icon-font-family: "ok-3069fce099"
}

.okx-wallet-link:before {
  content: "\e01e";
  font-family: ok-3069fce099
}

.okx-wallet-approvals {
  --ok-icon-font-family: "ok-3069fce099"
}

.okx-wallet-approvals:before {
  content: "\e028";
  font-family: ok-3069fce099
}

.okx-wallet-accounts {
  --ok-icon-font-family: "ok-3069fce099"
}

.okx-wallet-accounts:before {
  content: "\e026";
  font-family: ok-3069fce099
}

.okx-wallet-liquidity {
  --ok-icon-font-family: "ok-3069fce099"
}

.okx-wallet-liquidity:before {
  content: "\e027";
  font-family: ok-3069fce099
}

.okx-wallet-settings {
  --ok-icon-font-family: "ok-3069fce099"
}

.okx-wallet-settings:before {
  content: "\e029";
  font-family: ok-3069fce099
}

.okx-wallet-history {
  --ok-icon-font-family: "ok-3069fce099"
}

.okx-wallet-history:before {
  content: "\e02a";
  font-family: ok-3069fce099
}

.okx-wallet-hamburger-edit {
  --ok-icon-font-family: "ok-3069fce099"
}

.okx-wallet-hamburger-edit:before {
  content: "\e025";
  font-family: ok-3069fce099
}

.okx-wallet-quick {
  --ok-icon-font-family: "ok-3069fce099"
}

.okx-wallet-quick:before {
  content: "\e01d";
  font-family: ok-3069fce099
}

.okx-wallet-draw {
  --ok-icon-font-family: "ok-3069fce099"
}

.okx-wallet-draw:before {
  content: "\e01f";
  font-family: ok-3069fce099
}

.okx-wallet-approve {
  --ok-icon-font-family: "ok-3069fce099"
}

.okx-wallet-approve:before {
  content: "\e020";
  font-family: ok-3069fce099
}

.okx-wallet-mint {
  --ok-icon-font-family: "ok-3069fce099"
}

.okx-wallet-mint:before {
  content: "\e021";
  font-family: ok-3069fce099
}

.okx-wallet-recieve {
  --ok-icon-font-family: "ok-3069fce099"
}

.okx-wallet-recieve:before {
  content: "\e022";
  font-family: ok-3069fce099
}

.okx-wallet-claim {
  --ok-icon-font-family: "ok-3069fce099"
}

.okx-wallet-claim:before {
  content: "\e023";
  font-family: ok-3069fce099
}

.okx-wallet-futures {
  --ok-icon-font-family: "ok-3069fce099"
}

.okx-wallet-futures:before {
  content: "\e024";
  font-family: ok-3069fce099
}

.okx-wallet-send {
  --ok-icon-font-family: "ok-3069fce099"
}

.okx-wallet-send:before {
  content: "\e006";
  font-family: ok-3069fce099
}

.okx-wallet-swap {
  --ok-icon-font-family: "ok-3069fce099"
}

.okx-wallet-swap:before {
  content: "\e004";
  font-family: ok-3069fce099
}

.okx-wallet-trading-data {
  --ok-icon-font-family: "ok-3069fce099"
}

.okx-wallet-trading-data:before {
  content: "\e01b";
  font-family: ok-3069fce099
}

.okx-wallet-web3-network {
  --ok-icon-font-family: "ok-3069fce099"
}

.okx-wallet-web3-network:before {
  content: "\e016";
  font-family: ok-3069fce099
}

.okx-wallet-clear-filled {
  --ok-icon-font-family: "ok-3069fce099"
}

.okx-wallet-clear-filled:before {
  content: "\e01a";
  font-family: ok-3069fce099
}

.okx-wallet-assets {
  --ok-icon-font-family: "ok-3069fce099"
}

.okx-wallet-assets:before {
  content: "\e019";
  font-family: ok-3069fce099
}

.okx-wallet-refresh {
  --ok-icon-font-family: "ok-3069fce099"
}

.okx-wallet-refresh:before {
  content: "\e018";
  font-family: ok-3069fce099
}

.okx-wallet-nonce {
  --ok-icon-font-family: "ok-3069fce099"
}

.okx-wallet-nonce:before {
  content: "\e017";
  font-family: ok-3069fce099
}

.okx-wallet-lock {
  --ok-icon-font-family: "ok-3069fce099"
}

.okx-wallet-lock:before {
  content: "\e013";
  font-family: ok-3069fce099
}

.okx-wallet-wallet-filled {
  --ok-icon-font-family: "ok-3069fce099"
}

.okx-wallet-wallet-filled:before {
  content: "\e014";
  font-family: ok-3069fce099
}

.okx-wallet-rotate {
  --ok-icon-font-family: "ok-3069fce099"
}

.okx-wallet-rotate:before {
  content: "\e015";
  font-family: ok-3069fce099
}

.okx-wallet-token {
  --ok-icon-font-family: "ok-3069fce099"
}

.okx-wallet-token:before {
  content: "\e012";
  font-family: ok-3069fce099
}

.okx-wallet-minus-circle {
  --ok-icon-font-family: "ok-3069fce099"
}

.okx-wallet-minus-circle:before {
  content: "\e00e";
  font-family: ok-3069fce099
}

.okx-wallet-tg {
  --ok-icon-font-family: "ok-3069fce099"
}

.okx-wallet-tg:before {
  content: "\e011";
  font-family: ok-3069fce099
}

.okx-wallet-x {
  --ok-icon-font-family: "ok-3069fce099"
}

.okx-wallet-x:before {
  content: "\e010";
  font-family: ok-3069fce099
}

.okx-wallet-discord {
  --ok-icon-font-family: "ok-3069fce099"
}

.okx-wallet-discord:before {
  content: "\e00f";
  font-family: ok-3069fce099
}

.okx-wallet-blockchain-explorer {
  --ok-icon-font-family: "ok-3069fce099"
}

.okx-wallet-blockchain-explorer:before {
  content: "\e007";
  font-family: ok-3069fce099
}

.okx-wallet-official-website {
  --ok-icon-font-family: "ok-3069fce099"
}

.okx-wallet-official-website:before {
  content: "\e008";
  font-family: ok-3069fce099
}

.okx-wallet-edit {
  --ok-icon-font-family: "ok-3069fce099"
}

.okx-wallet-edit:before {
  content: "\e009";
  font-family: ok-3069fce099
}

.okx-wallet-swap-white-paper {
  --ok-icon-font-family: "ok-3069fce099"
}

.okx-wallet-swap-white-paper:before {
  content: "\e00a";
  font-family: ok-3069fce099
}

.okx-wallet-line-chart {
  --ok-icon-font-family: "ok-3069fce099"
}

.okx-wallet-line-chart:before {
  content: "\e00b";
  font-family: ok-3069fce099
}

.okx-wallet-watch-only {
  --ok-icon-font-family: "ok-3069fce099"
}

.okx-wallet-watch-only:before {
  content: "\e00c";
  font-family: ok-3069fce099
}

.okx-wallet-intermediate {
  --ok-icon-font-family: "ok-3069fce099"
}

.okx-wallet-intermediate:before {
  content: "\e00d";
  font-family: ok-3069fce099
}

.okx-wallet-up {
  --ok-icon-font-family: "ok-3069fce099"
}

.okx-wallet-up:before {
  content: "\e000";
  font-family: ok-3069fce099
}

.okx-wallet-nft {
  --ok-icon-font-family: "ok-3069fce099"
}

.okx-wallet-nft:before {
  content: "\e001";
  font-family: ok-3069fce099
}

.okx-wallet-down {
  --ok-icon-font-family: "ok-3069fce099"
}

.okx-wallet-down:before {
  content: "\e002";
  font-family: ok-3069fce099
}

.okx-wallet-gas {
  --ok-icon-font-family: "ok-3069fce099"
}

.okx-wallet-gas:before {
  content: "\e005";
  font-family: ok-3069fce099
}

@font-face {
  font-display: block;
  font-family: ok-3069fce099;
  font-style: normal;
  src: url(../9079663825d852902682.woff2) format("woff2")
}

.wallet-okds-link {
  --ok-icon-font-family: "wallet-ok-b983c4766d"
}

.wallet-okds-link:before {
  content: "\e053";
  font-family: wallet-ok-b983c4766d
}

.wallet-okds-mail {
  --ok-icon-font-family: "wallet-ok-b983c4766d"
}

.wallet-okds-mail:before {
  content: "\e058";
  font-family: wallet-ok-b983c4766d
}

.wallet-okds-computer-outline {
  --ok-icon-font-family: "wallet-ok-b983c4766d"
}

.wallet-okds-computer-outline:before {
  content: "\e0a9";
  font-family: wallet-ok-b983c4766d
}

.wallet-okds-fire-flame_filled {
  --ok-icon-font-family: "wallet-ok-b983c4766d"
}

.wallet-okds-fire-flame_filled:before {
  content: "\e0a8";
  font-family: wallet-ok-b983c4766d
}

.wallet-okds-trash {
  --ok-icon-font-family: "wallet-ok-b983c4766d"
}

.wallet-okds-trash:before {
  content: "\e089";
  font-family: wallet-ok-b983c4766d
}

.wallet-okds-locked {
  --ok-icon-font-family: "wallet-ok-b983c4766d"
}

.wallet-okds-locked:before {
  content: "\e056";
  font-family: wallet-ok-b983c4766d
}

.wallet-okds-unlocked {
  --ok-icon-font-family: "wallet-ok-b983c4766d"
}

.wallet-okds-unlocked:before {
  content: "\e08a";
  font-family: wallet-ok-b983c4766d
}

.wallet-okds-verified-filled {
  --ok-icon-font-family: "wallet-ok-b983c4766d"
}

.wallet-okds-verified-filled:before {
  content: "\e0a7";
  font-family: wallet-ok-b983c4766d
}

.wallet-okds-trending-up {
  --ok-icon-font-family: "wallet-ok-b983c4766d"
}

.wallet-okds-trending-up:before {
  content: "\e0a6";
  font-family: wallet-ok-b983c4766d
}

.wallet-okds-toggle-units {
  --ok-icon-font-family: "wallet-ok-b983c4766d"
}

.wallet-okds-toggle-units:before {
  content: "\e0a5";
  font-family: wallet-ok-b983c4766d
}

.wallet-okds-chevron-right-text-button {
  --ok-icon-font-family: "wallet-ok-b983c4766d"
}

.wallet-okds-chevron-right-text-button:before {
  content: "\e0a4";
  font-family: wallet-ok-b983c4766d
}

.wallet-okds-calendar {
  --ok-icon-font-family: "wallet-ok-b983c4766d"
}

.wallet-okds-calendar:before {
  content: "\e01e";
  font-family: wallet-ok-b983c4766d
}

.wallet-okds-p2p {
  --ok-icon-font-family: "wallet-ok-b983c4766d"
}

.wallet-okds-p2p:before {
  content: "\e0a3";
  font-family: wallet-ok-b983c4766d
}

.wallet-okds-express-buy {
  --ok-icon-font-family: "wallet-ok-b983c4766d"
}

.wallet-okds-express-buy:before {
  content: "\e0a2";
  font-family: wallet-ok-b983c4766d
}

.wallet-okds-cash-fiat {
  --ok-icon-font-family: "wallet-ok-b983c4766d"
}

.wallet-okds-cash-fiat:before {
  content: "\e0a1";
  font-family: wallet-ok-b983c4766d
}

.wallet-okds-chevron-down {
  --ok-icon-font-family: "wallet-ok-b983c4766d"
}

.wallet-okds-chevron-down:before {
  content: "\e0a0";
  font-family: wallet-ok-b983c4766d
}

.wallet-okds-chevron-up {
  --ok-icon-font-family: "wallet-ok-b983c4766d"
}

.wallet-okds-chevron-up:before {
  content: "\e09f";
  font-family: wallet-ok-b983c4766d
}

.wallet-okds-xbtc {
  --ok-icon-font-family: "wallet-ok-b983c4766d"
}

.wallet-okds-xbtc:before {
  content: "\e09e";
  font-family: wallet-ok-b983c4766d
}

.wallet-okds-selected {
  --ok-icon-font-family: "wallet-ok-b983c4766d"
}

.wallet-okds-selected:before {
  content: "\e09c";
  font-family: wallet-ok-b983c4766d
}

.wallet-okds-unselected {
  --ok-icon-font-family: "wallet-ok-b983c4766d"
}

.wallet-okds-unselected:before {
  content: "\e09d";
  font-family: wallet-ok-b983c4766d
}

.wallet-okds-checkmark {
  --ok-icon-font-family: "wallet-ok-b983c4766d"
}

.wallet-okds-checkmark:before {
  content: "\e022";
  font-family: wallet-ok-b983c4766d
}

.wallet-okds-refresh {
  --ok-icon-font-family: "wallet-ok-b983c4766d"
}

.wallet-okds-refresh:before {
  content: "\e09b";
  font-family: wallet-ok-b983c4766d
}

.wallet-okds-draw {
  --ok-icon-font-family: "wallet-ok-b983c4766d"
}

.wallet-okds-draw:before {
  content: "\e09a";
  font-family: wallet-ok-b983c4766d
}

.wallet-okds-sun {
  --ok-icon-font-family: "wallet-ok-b983c4766d"
}

.wallet-okds-sun:before {
  content: "\e099";
  font-family: wallet-ok-b983c4766d
}

.wallet-okds-moon {
  --ok-icon-font-family: "wallet-ok-b983c4766d"
}

.wallet-okds-moon:before {
  content: "\e098";
  font-family: wallet-ok-b983c4766d
}

.wallet-okds-clear {
  --ok-icon-font-family: "wallet-ok-b983c4766d"
}

.wallet-okds-clear:before {
  content: "\e097";
  font-family: wallet-ok-b983c4766d
}

.wallet-okds-thumb_up {
  --ok-icon-font-family: "wallet-ok-b983c4766d"
}

.wallet-okds-thumb_up:before {
  content: "\e096";
  font-family: wallet-ok-b983c4766d
}

.wallet-okds-thumb_down {
  --ok-icon-font-family: "wallet-ok-b983c4766d"
}

.wallet-okds-thumb_down:before {
  content: "\e095";
  font-family: wallet-ok-b983c4766d
}

.wallet-okds-zoom-out {
  --ok-icon-font-family: "wallet-ok-b983c4766d"
}

.wallet-okds-zoom-out:before {
  content: "\e094";
  font-family: wallet-ok-b983c4766d
}

.wallet-okds-zoom-in {
  --ok-icon-font-family: "wallet-ok-b983c4766d"
}

.wallet-okds-zoom-in:before {
  content: "\e093";
  font-family: wallet-ok-b983c4766d
}

.wallet-okds-information-circle {
  --ok-icon-font-family: "wallet-ok-b983c4766d"
}

.wallet-okds-information-circle:before {
  content: "\e055";
  font-family: wallet-ok-b983c4766d
}

.wallet-okds-warning-circle-fill {
  --ok-icon-font-family: "wallet-ok-b983c4766d"
}

.wallet-okds-warning-circle-fill:before {
  content: "\e07d";
  font-family: wallet-ok-b983c4766d
}

.wallet-okds-success-circle-fill {
  --ok-icon-font-family: "wallet-ok-b983c4766d"
}

.wallet-okds-success-circle-fill:before {
  content: "\e084";
  font-family: wallet-ok-b983c4766d
}

.wallet-okds-information-circle-fill {
  --ok-icon-font-family: "wallet-ok-b983c4766d"
}

.wallet-okds-information-circle-fill:before {
  content: "\e052";
  font-family: wallet-ok-b983c4766d
}

.wallet-okds-fail-circle-fill {
  --ok-icon-font-family: "wallet-ok-b983c4766d"
}

.wallet-okds-fail-circle-fill:before {
  content: "\e02f";
  font-family: wallet-ok-b983c4766d
}

.wallet-okds-arrow-chevron-right-centered-xs {
  --ok-icon-font-family: "wallet-ok-b983c4766d"
}

.wallet-okds-arrow-chevron-right-centered-xs:before {
  content: "\e092";
  font-family: wallet-ok-b983c4766d
}

.wallet-okds-arrow-chevron-right-centered-sm {
  --ok-icon-font-family: "wallet-ok-b983c4766d"
}

.wallet-okds-arrow-chevron-right-centered-sm:before {
  content: "\e015";
  font-family: wallet-ok-b983c4766d
}

.wallet-okds-arrow-chevron-right-centered-md {
  --ok-icon-font-family: "wallet-ok-b983c4766d"
}

.wallet-okds-arrow-chevron-right-centered-md:before {
  content: "\e014";
  font-family: wallet-ok-b983c4766d
}

.wallet-okds-arrow-pointer-right-xs {
  --ok-icon-font-family: "wallet-ok-b983c4766d"
}

.wallet-okds-arrow-pointer-right-xs:before {
  content: "\e091";
  font-family: wallet-ok-b983c4766d
}

.wallet-okds-arrow-pointer-right-sm {
  --ok-icon-font-family: "wallet-ok-b983c4766d"
}

.wallet-okds-arrow-pointer-right-sm:before {
  content: "\e00e";
  font-family: wallet-ok-b983c4766d
}

.wallet-okds-arrow-pointer-right-md {
  --ok-icon-font-family: "wallet-ok-b983c4766d"
}

.wallet-okds-arrow-pointer-right-md:before {
  content: "\e00d";
  font-family: wallet-ok-b983c4766d
}

.wallet-okds-user {
  --ok-icon-font-family: "wallet-ok-b983c4766d"
}

.wallet-okds-user:before {
  content: "\e07b";
  font-family: wallet-ok-b983c4766d
}

.wallet-okds-plus-circle-filled {
  --ok-icon-font-family: "wallet-ok-b983c4766d"
}

.wallet-okds-plus-circle-filled:before {
  content: "\e065";
  font-family: wallet-ok-b983c4766d
}

.wallet-okds-intermediate {
  --ok-icon-font-family: "wallet-ok-b983c4766d"
}

.wallet-okds-intermediate:before {
  content: "\e090";
  font-family: wallet-ok-b983c4766d
}

.wallet-okds-arrow-chevron-left-centered-sm {
  --ok-icon-font-family: "wallet-ok-b983c4766d"
}

.wallet-okds-arrow-chevron-left-centered-sm:before {
  content: "\e013";
  font-family: wallet-ok-b983c4766d
}

.wallet-okds-eye-hide {
  --ok-icon-font-family: "wallet-ok-b983c4766d"
}

.wallet-okds-eye-hide:before {
  content: "\e03d";
  font-family: wallet-ok-b983c4766d
}

.wallet-okds-eye-show {
  --ok-icon-font-family: "wallet-ok-b983c4766d"
}

.wallet-okds-eye-show:before {
  content: "\e03f";
  font-family: wallet-ok-b983c4766d
}

.wallet-okds-copy {
  --ok-icon-font-family: "wallet-ok-b983c4766d"
}

.wallet-okds-copy:before {
  content: "\e033";
  font-family: wallet-ok-b983c4766d
}

.wallet-okds-history {
  --ok-icon-font-family: "wallet-ok-b983c4766d"
}

.wallet-okds-history:before {
  content: "\e04f";
  font-family: wallet-ok-b983c4766d
}

.wallet-okds-back-to-top {
  --ok-icon-font-family: "wallet-ok-b983c4766d"
}

.wallet-okds-back-to-top:before {
  content: "\e08f";
  font-family: wallet-ok-b983c4766d
}

.wallet-okds-clock {
  --ok-icon-font-family: "wallet-ok-b983c4766d"
}

.wallet-okds-clock:before {
  content: "\e028";
  font-family: wallet-ok-b983c4766d
}

.wallet-okds-hamburger-setting {
  --ok-icon-font-family: "wallet-ok-b983c4766d"
}

.wallet-okds-hamburger-setting:before {
  content: "\e04c";
  font-family: wallet-ok-b983c4766d
}

.wallet-okds-fees {
  --ok-icon-font-family: "wallet-ok-b983c4766d"
}

.wallet-okds-fees:before {
  content: "\e040";
  font-family: wallet-ok-b983c4766d
}

.wallet-okds-open-link {
  --ok-icon-font-family: "wallet-ok-b983c4766d"
}

.wallet-okds-open-link:before {
  content: "\e05d";
  font-family: wallet-ok-b983c4766d
}

.wallet-okds-setting {
  --ok-icon-font-family: "wallet-ok-b983c4766d"
}

.wallet-okds-setting:before {
  content: "\e074";
  font-family: wallet-ok-b983c4766d
}

.wallet-okds-crown {
  --ok-icon-font-family: "wallet-ok-b983c4766d"
}

.wallet-okds-crown:before {
  content: "\e08e";
  font-family: wallet-ok-b983c4766d
}

.wallet-okds-share {
  --ok-icon-font-family: "wallet-ok-b983c4766d"
}

.wallet-okds-share:before {
  content: "\e078";
  font-family: wallet-ok-b983c4766d
}

.wallet-okds-support {
  --ok-icon-font-family: "wallet-ok-b983c4766d"
}

.wallet-okds-support:before {
  content: "\e086";
  font-family: wallet-ok-b983c4766d
}

.wallet-okds-analysis {
  --ok-icon-font-family: "wallet-ok-b983c4766d"
}

.wallet-okds-analysis:before {
  content: "\e003";
  font-family: wallet-ok-b983c4766d
}

.wallet-okds-academy {
  --ok-icon-font-family: "wallet-ok-b983c4766d"
}

.wallet-okds-academy:before {
  content: "\e000";
  font-family: wallet-ok-b983c4766d
}

.wallet-okds-action-reverse {
  --ok-icon-font-family: "wallet-ok-b983c4766d"
}

.wallet-okds-action-reverse:before {
  content: "\e001";
  font-family: wallet-ok-b983c4766d
}

.wallet-okds-aed {
  --ok-icon-font-family: "wallet-ok-b983c4766d"
}

.wallet-okds-aed:before {
  content: "\e002";
  font-family: wallet-ok-b983c4766d
}

.wallet-okds-arrow-cheveron-alignleft-md {
  --ok-icon-font-family: "wallet-ok-b983c4766d"
}

.wallet-okds-arrow-cheveron-alignleft-md:before {
  content: "\e004";
  font-family: wallet-ok-b983c4766d
}

.wallet-okds-arrow-cheveron-first-md {
  --ok-icon-font-family: "wallet-ok-b983c4766d"
}

.wallet-okds-arrow-cheveron-first-md:before {
  content: "\e005";
  font-family: wallet-ok-b983c4766d
}

.wallet-okds-arrow-cheveron-last-md {
  --ok-icon-font-family: "wallet-ok-b983c4766d"
}

.wallet-okds-arrow-cheveron-last-md:before {
  content: "\e006";
  font-family: wallet-ok-b983c4766d
}

.wallet-okds-arrow-chevron-down-md {
  --ok-icon-font-family: "wallet-ok-b983c4766d"
}

.wallet-okds-arrow-chevron-down-md:before {
  content: "\e007";
  font-family: wallet-ok-b983c4766d
}

.wallet-okds-arrow-chevron-down-sm {
  --ok-icon-font-family: "wallet-ok-b983c4766d"
}

.wallet-okds-arrow-chevron-down-sm:before {
  content: "\e008";
  font-family: wallet-ok-b983c4766d
}

.wallet-okds-arrow-pointer-down-md {
  --ok-icon-font-family: "wallet-ok-b983c4766d"
}

.wallet-okds-arrow-pointer-down-md:before {
  content: "\e009";
  font-family: wallet-ok-b983c4766d
}

.wallet-okds-arrow-pointer-down-sm {
  --ok-icon-font-family: "wallet-ok-b983c4766d"
}

.wallet-okds-arrow-pointer-down-sm:before {
  content: "\e00a";
  font-family: wallet-ok-b983c4766d
}

.wallet-okds-arrow-pointer-left-md {
  --ok-icon-font-family: "wallet-ok-b983c4766d"
}

.wallet-okds-arrow-pointer-left-md:before {
  content: "\e00b";
  font-family: wallet-ok-b983c4766d
}

.wallet-okds-arrow-pointer-left-sm {
  --ok-icon-font-family: "wallet-ok-b983c4766d"
}

.wallet-okds-arrow-pointer-left-sm:before {
  content: "\e00c";
  font-family: wallet-ok-b983c4766d
}

.wallet-okds-arrow-pointer-up-md {
  --ok-icon-font-family: "wallet-ok-b983c4766d"
}

.wallet-okds-arrow-pointer-up-md:before {
  content: "\e00f";
  font-family: wallet-ok-b983c4766d
}

.wallet-okds-arrow-pointer-up-sm {
  --ok-icon-font-family: "wallet-ok-b983c4766d"
}

.wallet-okds-arrow-pointer-up-sm:before {
  content: "\e010";
  font-family: wallet-ok-b983c4766d
}

.wallet-okds-arrow-chevron-up-md {
  --ok-icon-font-family: "wallet-ok-b983c4766d"
}

.wallet-okds-arrow-chevron-up-md:before {
  content: "\e011";
  font-family: wallet-ok-b983c4766d
}

.wallet-okds-arrow-chevron-left-centered-md {
  --ok-icon-font-family: "wallet-ok-b983c4766d"
}

.wallet-okds-arrow-chevron-left-centered-md:before {
  content: "\e012";
  font-family: wallet-ok-b983c4766d
}

.wallet-okds-arrow-chevron-up-sm {
  --ok-icon-font-family: "wallet-ok-b983c4766d"
}

.wallet-okds-arrow-chevron-up-sm:before {
  content: "\e016";
  font-family: wallet-ok-b983c4766d
}

.wallet-okds-bell {
  --ok-icon-font-family: "wallet-ok-b983c4766d"
}

.wallet-okds-bell:before {
  content: "\e017";
  font-family: wallet-ok-b983c4766d
}

.wallet-okds-authenticator {
  --ok-icon-font-family: "wallet-ok-b983c4766d"
}

.wallet-okds-authenticator:before {
  content: "\e018";
  font-family: wallet-ok-b983c4766d
}

.wallet-okds-borrow {
  --ok-icon-font-family: "wallet-ok-b983c4766d"
}

.wallet-okds-borrow:before {
  content: "\e019";
  font-family: wallet-ok-b983c4766d
}

.wallet-okds-brl {
  --ok-icon-font-family: "wallet-ok-b983c4766d"
}

.wallet-okds-brl:before {
  content: "\e01a";
  font-family: wallet-ok-b983c4766d
}

.wallet-okds-brush {
  --ok-icon-font-family: "wallet-ok-b983c4766d"
}

.wallet-okds-brush:before {
  content: "\e01b";
  font-family: wallet-ok-b983c4766d
}

.wallet-okds-cancel-order {
  --ok-icon-font-family: "wallet-ok-b983c4766d"
}

.wallet-okds-cancel-order:before {
  content: "\e01c";
  font-family: wallet-ok-b983c4766d
}

.wallet-okds-candlestick {
  --ok-icon-font-family: "wallet-ok-b983c4766d"
}

.wallet-okds-candlestick:before {
  content: "\e01d";
  font-family: wallet-ok-b983c4766d
}

.wallet-okds-carets-filled-down {
  --ok-icon-font-family: "wallet-ok-b983c4766d"
}

.wallet-okds-carets-filled-down:before {
  content: "\e01f";
  font-family: wallet-ok-b983c4766d
}

.wallet-okds-chat-bubble {
  --ok-icon-font-family: "wallet-ok-b983c4766d"
}

.wallet-okds-chat-bubble:before {
  content: "\e020";
  font-family: wallet-ok-b983c4766d
}

.wallet-okds-carets-filled-up {
  --ok-icon-font-family: "wallet-ok-b983c4766d"
}

.wallet-okds-carets-filled-up:before {
  content: "\e021";
  font-family: wallet-ok-b983c4766d
}

.wallet-okds-clear-fill {
  --ok-icon-font-family: "wallet-ok-b983c4766d"
}

.wallet-okds-clear-fill:before {
  content: "\e023";
  font-family: wallet-ok-b983c4766d
}

.wallet-okds-assets {
  --ok-icon-font-family: "wallet-ok-b983c4766d"
}

.wallet-okds-assets:before {
  content: "\e024";
  font-family: wallet-ok-b983c4766d
}

.wallet-okds-bank {
  --ok-icon-font-family: "wallet-ok-b983c4766d"
}

.wallet-okds-bank:before {
  content: "\e025";
  font-family: wallet-ok-b983c4766d
}

.wallet-okds-clock-filled {
  --ok-icon-font-family: "wallet-ok-b983c4766d"
}

.wallet-okds-clock-filled:before {
  content: "\e026";
  font-family: wallet-ok-b983c4766d
}

.wallet-okds-clock-outline {
  --ok-icon-font-family: "wallet-ok-b983c4766d"
}

.wallet-okds-clock-outline:before {
  content: "\e027";
  font-family: wallet-ok-b983c4766d
}

.wallet-okds-close {
  --ok-icon-font-family: "wallet-ok-b983c4766d"
}

.wallet-okds-close:before {
  content: "\e029";
  font-family: wallet-ok-b983c4766d
}

.wallet-okds-communication-call {
  --ok-icon-font-family: "wallet-ok-b983c4766d"
}

.wallet-okds-communication-call:before {
  content: "\e02a";
  font-family: wallet-ok-b983c4766d
}

.wallet-okds-communication-idcard {
  --ok-icon-font-family: "wallet-ok-b983c4766d"
}

.wallet-okds-communication-idcard:before {
  content: "\e02b";
  font-family: wallet-ok-b983c4766d
}

.wallet-okds-communication-img-failed {
  --ok-icon-font-family: "wallet-ok-b983c4766d"
}

.wallet-okds-communication-img-failed:before {
  content: "\e02c";
  font-family: wallet-ok-b983c4766d
}

.wallet-okds-communications-faceid {
  --ok-icon-font-family: "wallet-ok-b983c4766d"
}

.wallet-okds-communications-faceid:before {
  content: "\e02d";
  font-family: wallet-ok-b983c4766d
}

.wallet-okds-eye-show-filled {
  --ok-icon-font-family: "wallet-ok-b983c4766d"
}

.wallet-okds-eye-show-filled:before {
  content: "\e02e";
  font-family: wallet-ok-b983c4766d
}

.wallet-okds-communication-img {
  --ok-icon-font-family: "wallet-ok-b983c4766d"
}

.wallet-okds-communication-img:before {
  content: "\e030";
  font-family: wallet-ok-b983c4766d
}

.wallet-okds-convertokb {
  --ok-icon-font-family: "wallet-ok-b983c4766d"
}

.wallet-okds-convertokb:before {
  content: "\e031";
  font-family: wallet-ok-b983c4766d
}

.wallet-okds-cursor-drag {
  --ok-icon-font-family: "wallet-ok-b983c4766d"
}

.wallet-okds-cursor-drag:before {
  content: "\e032";
  font-family: wallet-ok-b983c4766d
}

.wallet-okds-data-line-chart {
  --ok-icon-font-family: "wallet-ok-b983c4766d"
}

.wallet-okds-data-line-chart:before {
  content: "\e034";
  font-family: wallet-ok-b983c4766d
}

.wallet-okds-deposit {
  --ok-icon-font-family: "wallet-ok-b983c4766d"
}

.wallet-okds-deposit:before {
  content: "\e035";
  font-family: wallet-ok-b983c4766d
}

.wallet-okds-cursor-zoom {
  --ok-icon-font-family: "wallet-ok-b983c4766d"
}

.wallet-okds-cursor-zoom:before {
  content: "\e036";
  font-family: wallet-ok-b983c4766d
}

.wallet-okds-download {
  --ok-icon-font-family: "wallet-ok-b983c4766d"
}

.wallet-okds-download:before {
  content: "\e037";
  font-family: wallet-ok-b983c4766d
}

.wallet-okds-exchange {
  --ok-icon-font-family: "wallet-ok-b983c4766d"
}

.wallet-okds-exchange:before {
  content: "\e038";
  font-family: wallet-ok-b983c4766d
}

.wallet-okds-developers {
  --ok-icon-font-family: "wallet-ok-b983c4766d"
}

.wallet-okds-developers:before {
  content: "\e039";
  font-family: wallet-ok-b983c4766d
}

.wallet-okds-eur {
  --ok-icon-font-family: "wallet-ok-b983c4766d"
}

.wallet-okds-eur:before {
  content: "\e03a";
  font-family: wallet-ok-b983c4766d
}

.wallet-okds-edit {
  --ok-icon-font-family: "wallet-ok-b983c4766d"
}

.wallet-okds-edit:before {
  content: "\e03b";
  font-family: wallet-ok-b983c4766d
}

.wallet-okds-expand {
  --ok-icon-font-family: "wallet-ok-b983c4766d"
}

.wallet-okds-expand:before {
  content: "\e03c";
  font-family: wallet-ok-b983c4766d
}

.wallet-okds-eye-hide-filled {
  --ok-icon-font-family: "wallet-ok-b983c4766d"
}

.wallet-okds-eye-hide-filled:before {
  content: "\e03e";
  font-family: wallet-ok-b983c4766d
}

.wallet-okds-fail-circle {
  --ok-icon-font-family: "wallet-ok-b983c4766d"
}

.wallet-okds-fail-circle:before {
  content: "\e041";
  font-family: wallet-ok-b983c4766d
}

.wallet-okds-filter {
  --ok-icon-font-family: "wallet-ok-b983c4766d"
}

.wallet-okds-filter:before {
  content: "\e042";
  font-family: wallet-ok-b983c4766d
}

.wallet-okds-finance-bank {
  --ok-icon-font-family: "wallet-ok-b983c4766d"
}

.wallet-okds-finance-bank:before {
  content: "\e043";
  font-family: wallet-ok-b983c4766d
}

.wallet-okds-finance-seagull {
  --ok-icon-font-family: "wallet-ok-b983c4766d"
}

.wallet-okds-finance-seagull:before {
  content: "\e044";
  font-family: wallet-ok-b983c4766d
}

.wallet-okds-finance-earn {
  --ok-icon-font-family: "wallet-ok-b983c4766d"
}

.wallet-okds-finance-earn:before {
  content: "\e045";
  font-family: wallet-ok-b983c4766d
}

.wallet-okds-futures {
  --ok-icon-font-family: "wallet-ok-b983c4766d"
}

.wallet-okds-futures:before {
  content: "\e046";
  font-family: wallet-ok-b983c4766d
}

.wallet-okds-funding-rates {
  --ok-icon-font-family: "wallet-ok-b983c4766d"
}

.wallet-okds-funding-rates:before {
  content: "\e047";
  font-family: wallet-ok-b983c4766d
}

.wallet-okds-gbp {
  --ok-icon-font-family: "wallet-ok-b983c4766d"
}

.wallet-okds-gbp:before {
  content: "\e048";
  font-family: wallet-ok-b983c4766d
}

.wallet-okds-guide {
  --ok-icon-font-family: "wallet-ok-b983c4766d"
}

.wallet-okds-guide:before {
  content: "\e049";
  font-family: wallet-ok-b983c4766d
}

.wallet-okds-hamburger-edit {
  --ok-icon-font-family: "wallet-ok-b983c4766d"
}

.wallet-okds-hamburger-edit:before {
  content: "\e04a";
  font-family: wallet-ok-b983c4766d
}

.wallet-okds-hamburger-search {
  --ok-icon-font-family: "wallet-ok-b983c4766d"
}

.wallet-okds-hamburger-search:before {
  content: "\e04b";
  font-family: wallet-ok-b983c4766d
}

.wallet-okds-hamburger {
  --ok-icon-font-family: "wallet-ok-b983c4766d"
}

.wallet-okds-hamburger:before {
  content: "\e04d";
  font-family: wallet-ok-b983c4766d
}

.wallet-okds-hierachy {
  --ok-icon-font-family: "wallet-ok-b983c4766d"
}

.wallet-okds-hierachy:before {
  content: "\e04e";
  font-family: wallet-ok-b983c4766d
}

.wallet-okds-id-card {
  --ok-icon-font-family: "wallet-ok-b983c4766d"
}

.wallet-okds-id-card:before {
  content: "\e050";
  font-family: wallet-ok-b983c4766d
}

.wallet-okds-img {
  --ok-icon-font-family: "wallet-ok-b983c4766d"
}

.wallet-okds-img:before {
  content: "\e051";
  font-family: wallet-ok-b983c4766d
}

.wallet-okds-insurance-fund {
  --ok-icon-font-family: "wallet-ok-b983c4766d"
}

.wallet-okds-insurance-fund:before {
  content: "\e054";
  font-family: wallet-ok-b983c4766d
}

.wallet-okds-language {
  --ok-icon-font-family: "wallet-ok-b983c4766d"
}

.wallet-okds-language:before {
  content: "\e057";
  font-family: wallet-ok-b983c4766d
}

.wallet-okds-margin {
  --ok-icon-font-family: "wallet-ok-b983c4766d"
}

.wallet-okds-margin:before {
  content: "\e059";
  font-family: wallet-ok-b983c4766d
}

.wallet-okds-logout {
  --ok-icon-font-family: "wallet-ok-b983c4766d"
}

.wallet-okds-logout:before {
  content: "\e05a";
  font-family: wallet-ok-b983c4766d
}

.wallet-okds-minus {
  --ok-icon-font-family: "wallet-ok-b983c4766d"
}

.wallet-okds-minus:before {
  content: "\e05b";
  font-family: wallet-ok-b983c4766d
}

.wallet-okds-more {
  --ok-icon-font-family: "wallet-ok-b983c4766d"
}

.wallet-okds-more:before {
  content: "\e05c";
  font-family: wallet-ok-b983c4766d
}

.wallet-okds-network-fee-standard {
  --ok-icon-font-family: "wallet-ok-b983c4766d"
}

.wallet-okds-network-fee-standard:before {
  content: "\e05e";
  font-family: wallet-ok-b983c4766d
}

.wallet-okds-option {
  --ok-icon-font-family: "wallet-ok-b983c4766d"
}

.wallet-okds-option:before {
  content: "\e05f";
  font-family: wallet-ok-b983c4766d
}

.wallet-okds-orders {
  --ok-icon-font-family: "wallet-ok-b983c4766d"
}

.wallet-okds-orders:before {
  content: "\e060";
  font-family: wallet-ok-b983c4766d
}

.wallet-okds-pending-circle {
  --ok-icon-font-family: "wallet-ok-b983c4766d"
}

.wallet-okds-pending-circle:before {
  content: "\e061";
  font-family: wallet-ok-b983c4766d
}

.wallet-okds-pie-chart {
  --ok-icon-font-family: "wallet-ok-b983c4766d"
}

.wallet-okds-pie-chart:before {
  content: "\e062";
  font-family: wallet-ok-b983c4766d
}

.wallet-okds-place-order {
  --ok-icon-font-family: "wallet-ok-b983c4766d"
}

.wallet-okds-place-order:before {
  content: "\e063";
  font-family: wallet-ok-b983c4766d
}

.wallet-okds-play {
  --ok-icon-font-family: "wallet-ok-b983c4766d"
}

.wallet-okds-play:before {
  content: "\e064";
  font-family: wallet-ok-b983c4766d
}

.wallet-okds-plus-circle {
  --ok-icon-font-family: "wallet-ok-b983c4766d"
}

.wallet-okds-plus-circle:before {
  content: "\e066";
  font-family: wallet-ok-b983c4766d
}

.wallet-okds-plus {
  --ok-icon-font-family: "wallet-ok-b983c4766d"
}

.wallet-okds-plus:before {
  content: "\e067";
  font-family: wallet-ok-b983c4766d
}

.wallet-okds-profile {
  --ok-icon-font-family: "wallet-ok-b983c4766d"
}

.wallet-okds-profile:before {
  content: "\e068";
  font-family: wallet-ok-b983c4766d
}

.wallet-okds-qrcode {
  --ok-icon-font-family: "wallet-ok-b983c4766d"
}

.wallet-okds-qrcode:before {
  content: "\e069";
  font-family: wallet-ok-b983c4766d
}

.wallet-okds-question-mark-circle-fill {
  --ok-icon-font-family: "wallet-ok-b983c4766d"
}

.wallet-okds-question-mark-circle-fill:before {
  content: "\e06a";
  font-family: wallet-ok-b983c4766d
}

.wallet-okds-question-mark-circle {
  --ok-icon-font-family: "wallet-ok-b983c4766d"
}

.wallet-okds-question-mark-circle:before {
  content: "\e06b";
  font-family: wallet-ok-b983c4766d
}

.wallet-okds-sort-up-center-aligned {
  --ok-icon-font-family: "wallet-ok-b983c4766d"
}

.wallet-okds-sort-up-center-aligned:before {
  content: "\e06c";
  font-family: wallet-ok-b983c4766d
}

.wallet-okds-records {
  --ok-icon-font-family: "wallet-ok-b983c4766d"
}

.wallet-okds-records:before {
  content: "\e06d";
  font-family: wallet-ok-b983c4766d
}

.wallet-okds-red-packe {
  --ok-icon-font-family: "wallet-ok-b983c4766d"
}

.wallet-okds-red-packe:before {
  content: "\e06e";
  font-family: wallet-ok-b983c4766d
}

.wallet-okds-scan {
  --ok-icon-font-family: "wallet-ok-b983c4766d"
}

.wallet-okds-scan:before {
  content: "\e06f";
  font-family: wallet-ok-b983c4766d
}

.wallet-okds-report-centre {
  --ok-icon-font-family: "wallet-ok-b983c4766d"
}

.wallet-okds-report-centre:before {
  content: "\e070";
  font-family: wallet-ok-b983c4766d
}

.wallet-okds-security-fill {
  --ok-icon-font-family: "wallet-ok-b983c4766d"
}

.wallet-okds-security-fill:before {
  content: "\e071";
  font-family: wallet-ok-b983c4766d
}

.wallet-okds-search {
  --ok-icon-font-family: "wallet-ok-b983c4766d"
}

.wallet-okds-search:before {
  content: "\e072";
  font-family: wallet-ok-b983c4766d
}

.wallet-okds-security {
  --ok-icon-font-family: "wallet-ok-b983c4766d"
}

.wallet-okds-security:before {
  content: "\e073";
  font-family: wallet-ok-b983c4766d
}

.wallet-okds-transfer {
  --ok-icon-font-family: "wallet-ok-b983c4766d"
}

.wallet-okds-transfer:before {
  content: "\e075";
  font-family: wallet-ok-b983c4766d
}

.wallet-okds-settlement-history {
  --ok-icon-font-family: "wallet-ok-b983c4766d"
}

.wallet-okds-settlement-history:before {
  content: "\e076";
  font-family: wallet-ok-b983c4766d
}

.wallet-okds-trends {
  --ok-icon-font-family: "wallet-ok-b983c4766d"
}

.wallet-okds-trends:before {
  content: "\e077";
  font-family: wallet-ok-b983c4766d
}

.wallet-okds-sort-default-center-aligned {
  --ok-icon-font-family: "wallet-ok-b983c4766d"
}

.wallet-okds-sort-default-center-aligned:before {
  content: "\e079";
  font-family: wallet-ok-b983c4766d
}

.wallet-okds-sort-default {
  --ok-icon-font-family: "wallet-ok-b983c4766d"
}

.wallet-okds-sort-default:before {
  content: "\e07a";
  font-family: wallet-ok-b983c4766d
}

.wallet-okds-sort-down-center-aligned-svg {
  --ok-icon-font-family: "wallet-ok-b983c4766d"
}

.wallet-okds-sort-down-center-aligned-svg:before {
  content: "\e07c";
  font-family: wallet-ok-b983c4766d
}

.wallet-okds-withdraw {
  --ok-icon-font-family: "wallet-ok-b983c4766d"
}

.wallet-okds-withdraw:before {
  content: "\e07e";
  font-family: wallet-ok-b983c4766d
}

.wallet-okds-sort-down {
  --ok-icon-font-family: "wallet-ok-b983c4766d"
}

.wallet-okds-sort-down:before {
  content: "\e07f";
  font-family: wallet-ok-b983c4766d
}

.wallet-okds-sort-up {
  --ok-icon-font-family: "wallet-ok-b983c4766d"
}

.wallet-okds-sort-up:before {
  content: "\e080";
  font-family: wallet-ok-b983c4766d
}

.wallet-okds-star-filled {
  --ok-icon-font-family: "wallet-ok-b983c4766d"
}

.wallet-okds-star-filled:before {
  content: "\e081";
  font-family: wallet-ok-b983c4766d
}

.wallet-okds-star {
  --ok-icon-font-family: "wallet-ok-b983c4766d"
}

.wallet-okds-star:before {
  content: "\e082";
  font-family: wallet-ok-b983c4766d
}

.wallet-okds-strong-alert {
  --ok-icon-font-family: "wallet-ok-b983c4766d"
}

.wallet-okds-strong-alert:before {
  content: "\e083";
  font-family: wallet-ok-b983c4766d
}

.wallet-okds-success-circle {
  --ok-icon-font-family: "wallet-ok-b983c4766d"
}

.wallet-okds-success-circle:before {
  content: "\e085";
  font-family: wallet-ok-b983c4766d
}

.wallet-okds-trade-1 {
  --ok-icon-font-family: "wallet-ok-b983c4766d"
}

.wallet-okds-trade-1:before {
  content: "\e087";
  font-family: wallet-ok-b983c4766d
}

.wallet-okds-transfer-circle {
  --ok-icon-font-family: "wallet-ok-b983c4766d"
}

.wallet-okds-transfer-circle:before {
  content: "\e088";
  font-family: wallet-ok-b983c4766d
}

.wallet-okds-unlink {
  --ok-icon-font-family: "wallet-ok-b983c4766d"
}

.wallet-okds-unlink:before {
  content: "\e08b";
  font-family: wallet-ok-b983c4766d
}

.wallet-okds-usd {
  --ok-icon-font-family: "wallet-ok-b983c4766d"
}

.wallet-okds-usd:before {
  content: "\e08c";
  font-family: wallet-ok-b983c4766d
}

.wallet-okds-warning-circle {
  --ok-icon-font-family: "wallet-ok-b983c4766d"
}

.wallet-okds-warning-circle:before {
  content: "\e08d";
  font-family: wallet-ok-b983c4766d
}

.iconfont {
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
  font-size: 16px;
  font-style: normal
}

.iconfont:before {
  display: inline-block
}

@font-face {
  font-display: block;
  font-family: wallet-ok-b983c4766d;
  font-style: normal;
  src: url(../font/7037698b1d9e17ea03b4.woff2) format("woff2")
}

[dir=rtl] .wallet-okds-arrow-cheveron-alignleft-md:before,
[dir=rtl] .wallet-okds-arrow-cheveron-first-md:before,
[dir=rtl] .wallet-okds-arrow-cheveron-last-md:before,
[dir=rtl] .wallet-okds-arrow-chevron-left-centered-md:before,
[dir=rtl] .wallet-okds-arrow-chevron-left-centered-sm:before,
[dir=rtl] .wallet-okds-arrow-chevron-right-centered-md:before,
[dir=rtl] .wallet-okds-arrow-chevron-right-centered-sm:before,
[dir=rtl] .wallet-okds-arrow-chevron-right-centered-xs:before,
[dir=rtl] .wallet-okds-arrow-pointer-left-md:before,
[dir=rtl] .wallet-okds-arrow-pointer-left-sm:before,
[dir=rtl] .wallet-okds-arrow-pointer-right-md:before,
[dir=rtl] .wallet-okds-arrow-pointer-right-sm:before,
[dir=rtl] .wallet-okds-arrow-pointer-right-xs:before,
[dir=rtl] .wallet-okds-communication-idcard:before,
[dir=rtl] .wallet-okds-copy:before,
[dir=rtl] .wallet-okds-eye-hide-filled:before,
[dir=rtl] .wallet-okds-eye-hide:before,
[dir=rtl] .wallet-okds-guide:before,
[dir=rtl] .wallet-okds-logout:before,
[dir=rtl] .wallet-okds-network-fee-standard:before,
[dir=rtl] .wallet-okds-open-link:before,
[dir=rtl] .wallet-okds-orders:before,
[dir=rtl] .wallet-okds-question-mark-circle-fill:before,
[dir=rtl] .wallet-okds-question-mark-circle:before,
[dir=rtl] .wallet-okds-report-centre:before {
  transform: scaleX(-1)
}

#headerModeGas {
  justify-content: center
}

body[data-nav=false] .footer-container,
body[data-nav=false] .header-container {
  display: none
}

body[data-nav=true] .footer-container,
body[data-nav=true] .header-container {
  display: block
}

body .footer-container[data-hide=true] {
  display: none
}

body .footer-container[data-hide=false] {
  display: block
}

.footer-alert-container {
  background: #1a1a1a;
  border-radius: var(--oxnv-okd-alert-box-border-radius);
  box-sizing: border-box;
  display: inline-flex;
  padding: 8px 16px;
  position: relative;
  width: 100%
}

.footer-alert-container .footer-alert-icon {
  align-items: center;
  color: #fafafa;
  display: flex;
  font-size: 20px;
  height: 20px;
  justify-content: center;
  width: 20px
}

.footer-alert-container .footer-alert-msg-box {
  display: flex;
  flex-direction: column;
  flex-grow: 1;
  margin-left: 8px
}

.footer-alert-container .footer-alert-msg-box .footer-alert-title {
  color: #fafafa;
  font-size: 14px;
  font-weight: 500;
  line-height: 20px
}

.keep-ltr {
  direction: ltr
}

.keep-rtl {
  direction: rtl
}

:root {
  --nav-footer-main-bg: #000;
  --nav-footer-copy-right: #6c6c6c;
  --nav-footer-selected-text: #e3e3e3;
  --nav-footer-selected-icon: #909090;
  --nav-footer-language-bg: #242424;
  --nav-footer-language-border: #2e2e2e;
  --nav-footer-title-color: #fafafa;
  --nav-footer-link-color: #909090;
  --nav-footer-link-hover-color: #fafafa;
  --nav-footer-language-bg-hover: #2e2e2e;
  --nav-footer-list-text: #909090;
  --nav-footer-list-text-selected: #fafafa;
  --nav-footer-language--box-border: #404040
}

.web3-footer-wrap {
  --nav-footer-main-bg: var(--oxnv-okd-color-background-base-secondary);
  --nav-footer-copy-right: var(--oxnv-okd-color-content-disabled);
  --nav-footer-selected-text: var(--oxnv-okd-color-content-secondary);
  --nav-footer-selected-icon: var(--oxnv-okd-color-content-primary);
  --nav-footer-language-bg: var(--oxnv-okd-color-modal-primary);
  --nav-footer-language-border: var(--oxnv-okd-color-border-primary);
  --nav-footer-language--box-border: var(--oxnv-okd-color-border-primary);
  --nav-footer-title-color: var(--oxnv-okd-color-content-primary);
  --nav-footer-link-color: var(--oxnv-okd-color-content-contrast);
  --nav-footer-link-hover-color: var(--oxnv-okd-color-content-primary);
  --nav-footer-language-bg-hover: var(--oxnv-okd-color-background-base-secondary);
  --nav-footer-list-text: var(--oxnv-okd-color-content-contrast);
  --nav-footer-list-text-selected: var(--oxnv-okd-color-content-primary)
}

.footer-container {
  min-width: 320px;
  width: 100%
}

.footer-container .footer-wrap {
  background: #000;
  background: var(--nav-footer-main-bg);
  padding-bottom: 47px;
  padding-top: 67px
}

.footer-container .f-l {
  box-sizing: border-box;
  margin-top: 50px;
  min-height: 46px;
  min-width: 150px;
  position: relative;
  width: -webkit-max-content;
  width: -moz-max-content;
  width: max-content
}

@media (min-width:768px) {
  .footer-container .f-l {
    margin-left: 12px
  }
}

.footer-container .f-l .show-language-list {
  opacity: 1;
  visibility: visible
}

.footer-container .f-l .arrow-icon.show-arrow {
  transform: rotate(-180deg)
}

.footer-container .f-l .now-language {
  align-items: center;
  border: 1px solid #404040;
  border: 1px solid var(--nav-footer-language--box-border);
  border-radius: 2px;
  box-sizing: border-box;
  cursor: pointer;
  display: flex;
  font-size: 14px;
  font-weight: 400;
  line-height: 20px;
  min-height: 40px;
  padding: 12px;
  white-space: nowrap;
  width: -webkit-max-content;
  width: -moz-max-content;
  width: max-content
}

.footer-container .f-l .now-language:focus-visible {
  border-radius: 4px;
  outline: 2px solid #fff;
  outline-offset: 2px
}

.footer-container .f-l .now-language:before {
  color: #909090;
  color: var(--nav-footer-selected-icon);
  display: inline-block;
  font-size: 16px;
  height: 16px;
  line-height: 16px;
  opacity: .75;
  width: 16px
}

.footer-container .f-l .now-language .arrow-icon {
  color: #909090;
  color: var(--nav-footer-selected-icon);
  display: inline-block;
  font-size: 12px;
  height: 12px;
  line-height: 12px;
  position: relative;
  width: 12px
}

.footer-container .f-l .now-language .text {
  color: #e3e3e3;
  color: var(--nav-footer-selected-text);
  margin-left: 8px;
  margin-right: 16px;
  min-width: 80px;
  vertical-align: bottom
}

.footer-container .f-l .drop-animation {
  transition: all .3s cubic-bezier(.645, .045, .355, 1)
}

.footer-container .language-list {
  background: #242424;
  background: var(--nav-footer-language-bg);
  border: 1px solid #2e2e2e;
  border: 1px solid var(--nav-footer-language-border);
  border-radius: 4px;
  bottom: 57px;
  box-shadow: 0 10px 10px 0 rgba(3, 6, 18, .5);
  box-sizing: border-box;
  display: flex;
  left: 0;
  opacity: 0;
  overflow: hidden;
  padding-top: 12px;
  position: absolute;
  visibility: hidden;
  z-index: 20000
}

.footer-container .language-list .ul-title {
  color: #909090;
  font-size: 12px;
  font-weight: 400;
  line-height: 16px;
  margin-bottom: 4px;
  padding-left: 12px
}

.footer-container .language-list .list-ul {
  box-sizing: border-box;
  height: 100%;
  max-height: 308px;
  overflow-y: hidden
}

.footer-container .language-list .list-ul::-webkit-scrollbar {
  width: 2px
}

.footer-container .language-list .list-ul::-webkit-scrollbar-track {
  background: transparent
}

.footer-container .language-list .list-ul::-webkit-scrollbar-thumb {
  background: #6c6c6c;
  border-radius: 1px
}

.footer-container .language-list .item {
  align-items: center;
  box-sizing: border-box;
  color: #909090;
  color: var(--nav-footer-list-text);
  cursor: pointer;
  display: flex;
  font-size: 16px;
  font-weight: 500;
  height: 48px;
  padding: 0 12px;
  position: relative;
  white-space: nowrap
}

.footer-container .language-list .item:hover {
  background: #2e2e2e;
  background: var(--nav-footer-language-bg-hover)
}

.footer-container .language-list .item.selected,
.footer-container .language-list .item:hover {
  color: #fafafa;
  color: var(--nav-footer-list-text-selected)
}

.footer-container .language-list .item .now-select,
.footer-container .language-list .item .select-icon {
  height: 10px;
  position: absolute;
  right: 6px;
  top: 50%;
  transform: translateY(-50%)
}

.footer-container .language-list .item .select-icon {
  color: #fafafa;
  color: var(--nav-footer-list-text-selected);
  font-size: 12px;
  line-height: 10px;
  opacity: .75;
  width: 10px
}

.footer-container .language-list .list-ul {
  max-height: 288px;
  width: 146px
}

.footer-container .language-list .language-li .item {
  padding-right: 16px
}

.footer-container .language-list .language-li .item:focus-visible {
  border-radius: 4px;
  outline: 2px solid #fff;
  outline-offset: 2px
}

.footer-container .language-list .language-li .item:focus-visible {
  outline-offset: -4px
}

.footer-container .language-list .currency-list {
  width: 136px
}

.footer-container .language-list .currency-list .item:focus-visible {
  border-radius: 4px;
  outline: 2px solid #fff;
  outline-offset: 2px
}

.footer-container .language-list .currency-list .item:focus-visible {
  outline-offset: -4px
}

.footer-container .language-list.placement-top {
  bottom: 47px
}

.footer-container .language-list.placement-bottom {
  bottom: unset
}

.footer-container .footer-section {
  position: relative
}

@media (min-width:768px) {
  .footer-container .footer-section {
    box-sizing: border-box;
    padding-left: 8px;
    padding-right: 8px;
    width: 100%
  }
}

@media (min-width:768px) and (min-width:768px) {
  .footer-container .footer-section {
    box-sizing: border-box;
    padding-left: 12px;
    padding-right: 12px;
    width: 100%
  }
}

@media (min-width:768px) and (min-width:1024px) {
  .footer-container .footer-section {
    box-sizing: border-box;
    padding-left: 12px;
    padding-right: 12px;
    width: 100%
  }
}

@media (min-width:768px) and (min-width:1270px) {
  .footer-container .footer-section {
    box-sizing: border-box;
    padding-left: 12px;
    padding-right: 12px;
    width: 100%
  }
}

.footer-container .footer-section .footer-top-logo {
  background-position: 0 !important;
  background-repeat: no-repeat;
  background-size: 82px 36px;
  height: 36px
}

.footer-container .footer-section .footer-top-logo.web3-footer-logo {
  background-size: 100% 100%;
  height: 16px;
  margin-bottom: 16px;
  width: 118.3px
}

.footer-container .footer-section .footer-top-logo.web3-footer-logo.web3-f-lo-d {
  background-image: url(/cdn/assets/imgs/259/74C91BBA876F37D5.png)
}

.footer-container .footer-section .footer-top-logo.web3-footer-logo.web3-f-lo-l {
  background-image: url(/cdn/assets/imgs/259/03AB6F8EA43998D7.png)
}

.footer-container .footer-section .logo-tr {
  background-image: url(/cdn/assets/imgs/258/B3ED08233ECE6C7C.png);
  background-size: 128px 27px
}

.footer-container .footer-section .logo-c {
  background-image: url(/cdn/assets/imgs/221/02D05B5ABB57940A.png)
}

.footer-container .footer-section .logo-web3 {
  background-image: url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAA4cAAACrCAYAAADVa+lGAAAACXBIWXMAACE4AAAhOAFFljFgAAAAAXNSR0IArs4c6QAAAARnQU1BAACxjwv8YQUAACK7SURBVHgB7d3tdWRFlu7x587i+2UsIMYCaAsILBjaArItACyoxALAgkos6LkWVLQFNBbotAXQFnC179G5UqkklZTKeE68/H9rxaiqqJ7KPK+xY++IkAAAAAAAAAAAAADgfwlA69J1y/Iq120RnvLFTavtj+v2P8JTstb7xGXReo8A93193T5VffFM+EN1JXnePf+8aQAakq/bu+v25yDt1+t20DyS1vP3u/o6T4+1q+v2Rtgk+c/BUfiYt/KdD0dns2fv5L0/3gp42JU812BSfQdJju9yFICmZHlfqs72ncaX5HsZudtbYXMl77F/J3yM85x8LTwmAuc/zS0LeNiVPNdgUn0HSY7vchSAZvyHxs7QjPzdNhEAJ43pIDphm/8jryiXJFv1uDg+ST5ZeEyWXxEAAAOK4DBrXNG5TRrb5xpbEoJ7zlncO475dL3K8vpv4THuY1MEAMCg/kMAehCT9WsvPnAfpYyPcwckSQyUPCbL6xcBADAogkOgDxEYuldz+1J4SGRVs/wI1j/kLu8NRQAADIrgEOgH8w7bkLWPLNznLn2OAZpFAAAMiuAQ6Mcee92RrfrQXvP/yOR+yH0u/iEAAAZGcAj0Y5E/a0FA8qGsfexVztqyLK89BmgAALAhOAT64i4tJXP4vj3muN2VhU2Wt+w55v0WAQAwsE8EoCeRufhWPtuWFu7FcFqVtS8yubeyvCgpBYC5xd7ijkHJ6Ovt1u8iOAT6sm1p4cyYZBEcbvbebzBrPffubU1a5A6UKSkFgLnF4HxSfYt27HdRVgr0ZY8tLdiAfdXKnL8s7HEuigAAGBzBIdCfPba0QDvHIQtZXmxhAQCYAsEh0B93eRurZK6+URvI5LKFBQAAVRAcAv1Z5M9iZCGrDUn7rpjagiwv5hsCAKZAcAj0yV1aOvsqmUltBWQzbzGS5D0XbGEBAJgGwSHQJ3cmI8u7Qmprstoyc2lplhclpQCAaRAcAn3atrRwyppXa8HYzIsEuc8FJaUAgGkQHAJ92mNLi6x5ZbVl5kWCsryKAACYBMEh0C/3vMNZSxmz2iypnXHeYZb3XLCFBQBgKgSHQL/c5W5Jc66S2WoQ9rnm4y6nZb4hAGAqBIdAvxb5sxozZqtaXak1a75FgphvCABARQSHQN/cpaWzZauS2l78ZaZg3T3Pki0sAADTITgE+ubObMyWOcxq20z7T1JSCgBAZQSHQN/cW1rMtkpm64vwzBSsu78rJaUAgOkQHAJ922NLi5n22MtqWwTrSXNwZ0mLAACYDMEh0D+2tKgjq48FX2bIHiZ5ByXYwgIAMCWCQ6B/7vK36KTPsEpmL0HXDMF6lhfzDQEAUyI4BPq3yJvliMBwhtLSXhZ7mSFYd58L5hsCAKZEcAiMwV1aOnopY1I/AfAMwXqWD1tYAACmRXAIjMGd6Rh9C4WsvowcrEfgm+RDSSkAYFoEh8AY3FtajF7K2FvwO3KwnuVFSSkAYFoEh8AY9tjSYuRsVVZfRg7W3QvuFAEAMCmCQ2Ac7nmHo2arsvrcO3DUYD3Lhy0sAABTIzgExlHkNWow0uviLiMG61lezDcEAEyN4BAYh3veYZQxJo2n130DRwzW3d+J+YYAgKkRHAJj+UVeowUkEfBm9WnELS2c2VC2sAAATI/gEBhLkVevWbbHZPUtaxxJ3mCXklIAwPQIDoGxFHmNlqnqPdgdKVh3X1uUlAIApkdwCIzFXRrXcxnmQ7L6NtKWFmxhAQCAGcEhMB73lhZZY4jAKqlvI807zPJhCwsAAERwCIyoyGuULRSyxjDCIkHuQN09oAIAQJM+EYDRbFtauMoL882/5dxGo4ZR5uvF9/hOfcvyKppH0u02NJ/eaR/zx01bbn6/iGwr4LLds0m392v6yP+GexZnITgExhRbWnwrn6y+F/RwzJ2MoN1R8pnUf7DuDNQXjRccJt1mXz/X7VzUpMtbblpc3/+6+enecxUYRdKH9278+pKDvdv9efeeLRrLcwe9WvW/tc80l/83oEBwCIypiODwJbLqi9LFP0z/VpSWntQv57zJov5lrcfsS91m8l3STcv3/nybxxnXfREZC+AhSevzOgLBLE9AsD1f870/L1rv23/c/LrnAZ74ju/Ur59umtvfrtuJ4BAYU5FX76WMjkxVufmZVV8ECSf1Kcsb3PS4v2Ecn+hQxnWb1eYI+Rc3bZsDu2i9B34RK8NiblnrvRv3RlI78k3b3uVFt/frIkyDBWmAMbm3tEjqe6XPrLq281Hk8bX65f7sRX2IAPCgdTT89+v2Vuux6qV0Kun2819p/fxJwBziPn2j9dqPeyACsKS2Za336faZD+KenQLBITAud0ak14Akqf4LbzsXRZ5SHcccylo+l09R+yPi+br9qNuAKqt/SWtHc+t09jyYATwl63ZA56h+g6us20CRgZ3BERwC4yrycnbqLymrvrvzMV3bJmT1xx3UtlxSmrV2KrcsQ8+LKzwlX7e/a+10HgSM4aDb+zdrLAfdDuxkYTgEh8C4irwTynsd/f9G9ZVHfl1Tj/tPZnkVtSdr3E7lU5JuMxPOBYmAS8oaK8v/lKw5n1XDIzgExubc3LvXUsasuha9X7roWtU1q79s08xbWCStGbTZO1rpuv0qStfQl6zbQClpLlnr9+aeHQTBITC2Iq/eRvyz6iv3fr/tL+XA+XhcUTti25kIiJh7d+ug20UwgFbFAFzMCSZ7dltu+kboWgSHrk7KHhaNv/zubxrbIryGK0u1cWZ+LsHRGX8oe+ua69ZTsJHkHXVuYb5h0tqp/Ekadk7haySt2Qg6m2hR1jqo0/M2TjUctQaJSehSBIc/aFy/aHzRqXDOK3MqYj+s13JvaRGZqp46uY55eeWBP3MF7T0F61leRfuKua7RsczCxxy1HqskYH93s4VJeEgSWcRuRXAYnZS/aawMTXSIv9f6Qhndct3+ovEywKfr9lfhEpwZknhp9lLKmFT/sxY9PHjzT3kGdZL66bw4A9mifd950bE8iWzhS8S9Smcce0u6XUEYH3cU9213Prn5ebppSWNY7v1+23x0lPkci9as6OnO7yNA/FRjdDb+0LjZ0D0UeUfvvlYfGd+s+h5bEGibd5hVX5yPn9S+LB/nQk13xfM5Fp3JwjmS1o7mV2LKAfyy1vuXQZ2XyeK+RWOS1tT2nwM2Rq7wXLEBr+u6/FV9iJd87WORn/j3vzP8+9Hc807PkeU5FlvbI7sdHcpf5f2eo7YrtTuYHZ/NcQyS6jtIcnyXo9oXi0b9SXtVi36IK0mT1f/x2qMd4uDNsFrpG42bzo7vxggWnsOZKell3mFWXR+b7+kK2r5U+7J8FvnL8JPWwLCXkuvWJVGqBp/oa/VQfdG6rXKCxEbjZggOR34Z9zS/C/sq8mq9hDurfgD7sbmeizwlNj3sP+kMYIu8tg5REi4paT2uQE0RGB6FS4o512+EZs0QHJJZA/ylha1nqxzB63OOuSujm9Uud/Dqnm/4Vgzi1RLH9UcBdRAY1nMUAWKzZggOAfi3tGg9c+gIXsuF/s4ltBysZ3kV+UTnZ5SF0FoVJWocY1wagWF9R61b+qAxBIfAPNxbWiS1Kal+JifmtC3P+HtFHlntVlG4t7BwrYR8EJ1Ll8jOUiWESyEw9DmJ1ZubQ3AIzKPIq9XR/Kz6nrvgiTOjm9UmZ8mlq6Q0iZIpp227KuC14r11FJyYk92YTwRgFkVrMOIaYc9qc4U3R6bqlxf83cjoZtWX1d62Fkne4LDIIzJZSe1atA5gxPPgX3p8b9mk9XnxmW4XQGs1QxflpRH8FwHnSVrv3ZbFfbpovX//fef39yX1c+/G54rVh2O/bldlB55AcAjMJTpPrhr/Vue5OYKR52YOQ5En6xFBcWtLiGf5LPJsYXFQW1naLTv9j5ufi17XAYv7J2nNsHyptoLguI+KgJfbApTWAqi4V+O5tQ18vOYZ1vK9m7QuLvU3AQZX6msDype2LOD5Dpr7+syq/53f6eV+N3yuaEltiXKiP03trepLauOdE9dTHNus+p3d6HCe1M67NmtfruOQVN9BkuO7HLW/CEz+bKi903r8a96/rd270S41gJml6p91xHaIg0fmEJhLlBW+lU9WWyP5WfWdM6/NldGNEeOWSn2zfBzzDeMcJu0nsgw/az3HrvKsyGQcbn4dP99o32MQ/34R8HwHtVFV4b5/W7t3dfMZop+y6HVqzed3lecu8uyD/NC/O4Ur9RW1v7RlAS/zTr7r853a4vju55StHgyfq7XzkeX5zlur/UJP8mWAH2pHtVMSd9R+xyFa1n6u5PmOSfUdJDm+y1H7SWqjnxgBYQv370H7H493apfr2By0I1YrBebj3NIiq50Oq2Oz9UXnzQlxLRTjmG/5XO6FaGqPxH+jfa71uN5iIYej2lnM4Xjd/kv7jUJ/LeB53mjfbFnRev9G5rKF+/ek9d79QfvJ4h7eFcEhMJ8ir6w2ZNX3m86zLTpQmyNAfi7n/oaOktKD/KIE7St5rp2XWrR2el0DH3ftFaijLwftm6H5Xu3ev0ftO8ATc0C5h3dCcAjMp8g7QpnVBkcw8pqOsCujm7U/d5BaVNdB/uxDjOy3km14THy2v+plW7tcwrZ0P/CUN9rHojUobGn+90MWrQHiz/JLam917WkQHAJzcm0GHpwZoqdk1Vd0PleG5Uvtz9lxX1R/ZP4beUVgeFQ/DvJXLLjPCfpy0D7lpIvWwLCoHxGk7VFm+q3IHu6C4BCYU5FP0v4roG37O9UUAcii822bkteWtf8L1zmfpKiuJG8WtLfAcBMZxEU+zFnCY5L2yRpu84MX9ecof4AY7ymyhzsgOATm5J4HlLWvrPpeWxbqmncY9u44O7OXtbPkWT6L+gwMQ1zfzg2uKS3FYyKrnOS1aM0YtlwG/jFH+QNEsoc7IDgE5lRrD6DH7F3K2Pp8w42r3HfP85HkX6m0JmfZ9FfqW5F3/mEW8KGDvBb1HxhujvIOLpM93AHBITAv55YWe2aqXIufFL2e66W75/nI8imq3yHL8ogR+0X9O8rncwHvO8ifNYzAcNE4ogJgkQ/ZQzOCQ2BeRT57lnhl1Vd0GYs8L904H0n7GK2k1NFpiQD3pDEs8g2CZAHvc881jO0qFo1ljxLxg2BDcAjMq2iOLS0cZX+XDEJcpaV7ZQ+zfIrqcg14RDC1aByupfGTyDjgVjzzknxOan+7inMVebe4aGXV8ykQHAJzm2FLi6z6ii6nyGOP8+FYNXazqP4CP0ke7n0CayvyDUwRHGKzx5YzIzvKdx9n7b/q+TQIDoG5FflEYODuqDmCkUWXDUKKPPY4H1k+RfU55rQt6mtPtOdyDUyxYilCkrdaYpQ5wk+JwNCZPTwIFgSHwNzcq465O2pZ9RVdlmsl2T3OhzNb6Qg+HMfvN42pdlZ3kwSw5UwtUTbryh7uver5ND4RgJltgUiWx9fyZkEcwUiNVV/j/2dWfe7zkeVTVN/3qs8VRLm5vhdlpQjfymf0ctK7tuyhY6GfrHWwZxGqIjgE4ApEgntp+az6ii6vyPOydY7EZvkUeUazT8K5Fnl8Jswuaay9VVsT2UPXKrBfa9xFfppBWSmAIp8s30h+Vn2R/Vh0eUWe4MY579A538e50BLOswjwyPI5ab5r2zUVIrBqqQHBIYAi75YWriDBsTJdjZLSzWhbWjizlEXAKgmzc65SOtrKws/lXGCKUvHKCA4BhCIfV3mP49+puaBPkYcjaEvynfdF487TA/AyEUhkeSyad2DqJI89FlKbDsEhgFAzA3afoywkyfMCKarHtZKsI3PIfB8Ae+DZ4xHVR65BOYLDyggOAYSTfJLql3pl1VdUl+tl6xiJHW0LCwB9cM51dg6ytsj1/bNQFcEhgOAc9Qu1X9iOYMQRhIzyss3yKQKAlXOF7NnL2V3f373q+XQIDgFsnKOeWXVl1VdUn6u0tGYwHVnJJI8i7+JKANrmKkF0D7C2qMgjiUVpqiI4BLBxBSKh5iIoWfVfHIs8HYH4N3rf0iLLh5JSABvnypYsgrW+F12Dc0mohuAQwKbI92CvuYKcY45JkccI8w6dW1g4BzgAtC3J599CcPUhWJSmok8EALeKfBP4s+oEWY5gxFmCG9mwrPrivBddXpbHIjZWP0cSMCZnABGl+X8KLkmohuAQwF0R9PS8KXpS/1tY3BfZsB9VX43zkeUr6yqaV9Jt9jd+fnbzM+m2E/WpmKeDubBwybg+E6ohOARw10meQCRkrZ3VS5ahZNUXZZ6LfJabllTXFlhc8nw4l5H/RXOI85S1dny3xX4I+oAPJWFUSaiG4BDAXdscN1c5Tvw7RZfj2MJij72sorT0W9UXwdxJl+McuS8aU9aa1Y2fzgU2gN4lYVRJqIYFaQDc5wx+Lp1Zyqpvj0VPijwuWVpac9Gh+4rGsR23t9ft9+v27rod5S3RBXpHGfXYOLcVERwCuM8Z/Fwy05dV/4URmdUivyKPSwbrWT4jlJRmrSXdV1oDwoPoAAHnSsLIeDZWRHAI4D7X3noh6XIP+az69trLyhWUXjLb5yjx3RT1KwLydzftO9HpAS6B+2h8nONKCA4B3OfaW29zqWyVYwuLPTdZd5X7Xmq+aZbHoj63sDhozRL+Xd4sKzADAofxcY4rITgE8BBnEHSJoC7J08Eu2k+RxyUyfkm+sq6ivuTr9qvWOYVJAGogcADORHAI4CHOeYeXyBxm1bdov7LSUOQp973EiphZPr3MN4xjGlnCKB91rQYMzCoJwFkIDgE8ZJGvVG/bvPs1HCWlRftzZHQvcT6Yb/i+GAC5knffRwAAXozgEMBjnKWlWa+TVd+e8w03RR6vDWKyPIraFyuQRsaQMjcAQPMIDgE8ppctLSLLlVTfniWlG9c5ec35yPIFQi2XlMYx2FYgBQBclmtV9ekQHAJ4jHNLi9fMc8uqL47Fov25VpJNOj/gzvIpalPSuuhMFgCgBoLDSggOATzGuaXFa+a5Oea3ubaReA7XZzm3tNQx/zO0ErDfl7RmDJMAADUQGFZEcAjgKc55ducEI5fctP0pzhLbj3F9ls/1cq7zEVoK2DdJBIYAUNsiVDNDcNjCPKGaGD1BTc6g6JxgJKu+uMeK2uEq9z0nWM/yaSlg38TCM0kAgJro+1Y0Q3D4s8YVnaPRg1/sa5FvhC7r5fMOZyspDa5y33OygK4tLFoL2MMbsX8hADgsQjUzBIflun2v8S6kct3+JqC+lktLs+prMUPlOidZL+MKjloL2A/X7SgArViEkf1LqOaTm58xQvytXrdiYEtiVD0yhsvN73+6bieNM6q76MMH33daF4IY4fxFViDOXxFaEMHRt/J4yT060xYW98U5+VH1vWRxmSTfM7algD1pzRoCmNNJDNZjIBEcJo03gT5rHcn9SrcduxbLkC4lzl/WWCKDFBnfn4S9bXPcHAMPUZb43TP/blZ9i9oMDpebllRX1nrenzO/I8unqB0RGCa155837d9ar5U/dDuo+IfamLNzJaCOFq5voEsRHLb6Ynut6NDEyPpXGttB4+6lFefvJB7ye9vmuGXVl27a8oy/65jfVtSuKC11ZHSznpepc803bGkLi6T1GdyCovWa2IJCnpuY2SIAZ4k5hweNK2v8leNcHbK9vHQOGupobd6ha8sE5/d+qSKP/My/N+N8Q0dp71MiAPzhuv2n1oHQqLQoIjAEnPfAfwoYCPsc9m+EOYZon3OOV77Q37mEonYVeTxnAMo1/zO0Mt8wab/Bq0XrHKfolB5FMAjct8jnMwEDITgE8ByLfC/b5yyC4iopbbnT7ZpHnfTxwC/Lo6W543stQhOLdf1Fa8k9gMct8mCQHkMhOATwXK4Sy+eUjH7sv19Ca9slPMT1GT+WIXOVt7dyTpL2mZIR2cJYsIlMIfBxrsXEkggQMRCCQwDP1UppaZKnhLGofUUe+Yn/5pr/GVopKc3yizmFJwF4LudeeASHGAbBIYDncq6A+FRpaVZ9vWx9U+Q5J0+dD9dCNKGoDd/IK7b1KRoLnWnU5sochixgEASHAJ5r29LCIevxzqOjhLGHktKNo9z3qeyga1GWVrawcGZKw0lj7veaBNTlDA6dg2RAVQSHAF7CubXDYy/brPpaKV98jiKP/MifP2cBoUtoJWDP8lm0blUxoiSgrkU+nwsYBMEhgJdwBk0PZaSyPOVoRf1wnZOHgsAk34j5jPMNf9G4m3knAXU5q13iOUipNIZAcAjgJRb5OqsPlY86ShgX9dUhd3WAsj7s/GR5tDQH1JkhOGlcrowz5uaqOIhnI6WlGALBIYCXcpWWJn0YjDg6lEX92WtLi9lKSkOWR9xni8aVBNRX5OOafw1U9YkA4GWivO9becTL9nTz6yTPyKxzXuWluM7J/eOf5dFKSemMK7PWkESWBR5FPrGK8Xea10EeJ6EqgkMAL7VtaeGYXxGZqdPNr7M8ivrjOidR6rt1fqJzn+RR1AbnnCLnSotuWYDHVpKeVd+2knHRfPJ1e6v64rl4EqqirBTASzkn+d8t03FsYVHk28vxklznJOk2IMzyaGULi5DkM3JwyHxDODnL0t9oTs4tjVAZwSGAc7hKL+9O8s+qr6f9De9znZOtE+AI1kNL5yTJ4w/1OUjxHHFPMzcLTkU+WXOuWjrj+2BYBIcAzuGcA5bFFhbP4TonWycgy6OV+YZOowaGIQLDGTvP2E+Rt/pgtnmHWb6BMzKHBgSHAM6xyLulhSPT0NJ2CedY5Dknkcl1ZX5aOydJeK1Zy+6wr1/kE4uDzTQA8o08FhEcWhAcAjiXq4wxghFHycoI5SqOcxKdHlcHnxKisWQRYGMfP8knnpE/ag5JvlVKi2BBcAjgXK5yv3jRJtU3QvlikccX8pixpDSMmnVwrGYIPMRdhXDQHKvyOisBnNnfqREcAjjXaOUdRf0rGkvRnD7VeAHiQWQNsa8f5BWDISOXl8b0goM8FpE5tCE4BHCu3ufo3bWone0SXmOkc9LSFhYb50IxruysQxJzDbG/Iu89nDTude8unS2aS9KOCA4BvIZr3mFtReMYZZ5ei9/D2bHMGkd0kJOA/f0sr1i51LVgi5P7np6tpPQz7YjgEMBrFI1hlCA3FI2hxfmGi3xG6VDGyo0HAW2IhWncW8XEvzlSJUDc087tOhbNlznM2hHBIYDXiNK/EfZkKxpHUf/npNXyWHdJWlbfokPsXCXyITNtKYCPi3vYnT2Ma/Cdxsie73FPu+eKPmWRR9KO1wvBIYDX6r3co2i8Tcd7z4S2WhrrXoSp5/lK6br9XfsjOMR9e2QPRwgQIzB8J6/lup3UDud1c9BOCA4BvFZR30YqKd30vpJsq1tYLPLPO3SWb13K1olM2l8SASLeF/fwHtmodN1+VZ8VAVnrPe2+l1rKGoZ/yyfKd3d5dhEcAnitor71Hkg95KS+FbVrj+xhUj+y2suQfC3gfZE93OPZv2UQe6oKiCBlj8BwUXvvskU+7hVh/z+CQwCv1fP2CT1/9qfE91rUpxa3sLjrN3n1VI4WHd49OpEfM+JqkXi977Wfo9ay66R2xX0cn3GvecOtZQ3DIq+DdhhIIDgEcAm9lmaOsu3DQ3o9J61/7j1KXpPaDhCT1s93VJuy2GcRHyryL05zV2S0475psXT8cN2utF/WfVGbFTB7rE9w1Housoz+HLwlje2d+jofL20HoQcxx6in62qG6yurr3Oxtaz2/a59js2V2loSPzILb7Tf8Xhpe6v6x+9KkuO7JNV3kOT4LkftJ67hK/mvxfstPsNB+8tqo1+Z1Ka4Xva+To5az1O1Co1PBACvt21p0dvCD0Xj6vGcLOrjnMQKvd/KL2ld0OKoNeOx1yq7cU1te531dH0dbloct4+VL/9NmEFcC3Gu32lfSevgxRut5ZRFvhLGuIcP1+2/1cbgXDzbFrXpD+37Xk1ar5E3d/5s0WUt8X/+HLwlje2d+jofL20HoRcn9XVt/arxvVNf5+St+pC1/7G60vp8dHZSsvrKFL6mnevK8NmiJdV3kOT4Lkft7yjPd31Ji/l+B9U51/HcyFqfuS3dz1dqf8Apzksrx6vKOSBzCOBSivpa+GHEVUrvi/l7Wf3oZQ5ouWlZ+0m6zTQUrdnMosvL1+3Lm59ZwJiOur3OW/G1buf8xfuqaF0Qa9FtZchzRLCVtJZUf37zM6tNf1X7+w7He2roFZAJDgFcSizU8Vb9GHF/w/vinOyyFPaZivoRpU9Z+0t6v1yyaO28/FMv60AmrZ3Iux3IL+QZxS8i8MT+IjCJipKk9mz3411biePyyP8mab1/eyn9jnLaHgZte3uvvhjBIYBL2TqmWX0oGt+ifuYdFvW1/UZ0EKIj84XaEef5brZhs+i2I3lXuvdzD4vWTmEWsK+4P77SGiD28MzcAr+k/sXz9Kg+LDctaVBsZQHgknoqC2y9dOVSflEfetxWZM990l4i6baU7G5L2r+D85WAdixar8lZ3g8tWNTfAlC9vFfPQnAI4JKK+jBDSemml7mVRf0pmiMDXUtkDBf1lTHG+OKZ2cvAT+8W9RmMnzQwgkMAl1TUx0O+aB7/o/Yt6vecxIg3WYaXizmbx5tfc/zQmpPYzqS2RWtguKg/iwbuRxAcAri01rNyi+ZYqXSzzQVtWVG/FtGJfKlF788vempRDWAvJ/WxemaPFvUbGG5+0KAIDgFcWlHbftN8Wp/P1+N8w7siOztsR+HCFj1cRjbTgA36Efd270FMaxaNcUyLBs0eEhwCuLTWyxh7KLO8tKK2jXBOjhp8kYILWPR4p7D3AQKMKwYuCBAvY9FYx3LIqhGCQwCX1noZY9F8itotjSoap2zrO5EBe8yipzuFMw7aoB+L1uuX6/R85br9RWMF2YsGrBohOARQQ6tZgOi4L5pTq3NBR1o5dtsnjQDxfYs+ni2I/1YEtGvROgeREvKXiwWoRt0i5KjBnl0EhwBqKGrTzKVrrQYsRWOJzk+Mjv8shEXPLyPjmKEHx+v2X6LM9DnieRill99pbPEdFw2C4BBADUVtjhDOXBJ0UnsWjZtli87Q7BmGuN9eUkYWf78IaN+iNUAki/i4ovX+P2l8iwaaS0lwCKCWFssFZy73a3G7gKKxHTXvQhaxifg52wDQ2UZPjlqDRErJb8U9H/f/bM++RYN8Z4JDALUUtaWI/apaC9hHmm/4mKK1wzDLSqaL1u/7k85TtHYsgV4sWjNkQ5UWnumkNVg+9/7v3aIB5p0THAKopbUSzhkCkY9p7ZwUzWG5bgeN33mMOYPRSS56nehYkkFEb05aA6MZg8SiNSiK7z77IOyi9TnY7TOM4BBALa1taVGEGM1s5cVdNF8n4qQxO49F6/eKeZaXOqdHESCiTyfNEyQWrUHhV+Ide99R63VQ1BmCQwA1tbI66CLmhITouLdyHGbO5J40Ruex6LZjuOjyjmJVSPTrpPX6Ha2sPN4j29YUBIVPW9ThcYrgcPSR29G/3780ttnLE3pX1IYibFoJyopwUn+dx3gmR3myq8OzaN5SPYyhaC0r367joj4VrfOBtyqBIjxX0fq8jGMXz/pFjTtetz8HbW81vqy+zslL2pUwgt+1/7V0EDZJ3NutSlqv1b9r/3N0v73T2iH8VPvKWoPquIZqft9z1f5cW0uq7yDJ8V2Omk/S7b3ewjvyY/d9Ei4ta7324xi3dA1cbR/wp4Y+1CUv6L1fYi5H9XVunntxJmEEJ+1/PSXhrr1fRG+F58ha38/v5D9HcY1Ex7WFgPAx6bp9rfUdGJ81jtOVLnN9n+vqAv92K8+0gyTHdzkKWeu9FtfxlTzH/aH2q9ZnzkHz9KFb8YVun2dvtT7PLvlMe267+r9NhCdhimkDrQAAAABJRU5ErkJggg==);
  background-size: 82px auto
}

.footer-container .footer-section .logo-e {
  background-image: url(/cdn/assets/imgs/221/187957948BD02D97.png)
}

.footer-container .footer-section .footer-company-address,
.footer-container .footer-section .footer-copyright,
.footer-container .footer-section .footer-copyright-fr {
  color: #6c6c6c;
  color: var(--nav-footer-copy-right);
  font-size: 14px;
  font-weight: 400;
  line-height: 16px;
  margin-top: 8px
}

.footer-container .footer-section .footer-company-address {
  line-height: 22px;
  margin-top: unset
}

@media (min-width:768px) {
  .footer-container .footer-section .footer-company-address {
    line-height: 16px
  }
}

.footer-container .footer-section .footer-company-us {
  margin-top: 10px
}

.footer-container .footer-section .footer-copyright-fr {
  display: flex;
  flex-direction: column;
  margin-top: 14px
}

@media (min-width:768px) {
  .footer-container .footer-section .footer-copyright-fr {
    flex-direction: row;
    flex-wrap: wrap
  }
}

.footer-container .footer-section .footer-copyright-fr .copy-item {
  margin-bottom: 8px
}

@media (min-width:768px) {
  .footer-container .footer-section .footer-copyright-fr .copy-item {
    margin-bottom: 12px;
    margin-right: 24px
  }
}

.footer-container .f-m {
  align-items: center;
  display: flex;
  margin-top: 44px
}

@media (min-width:768px) {
  .footer-container .f-m {
    box-sizing: border-box;
    padding-left: 8px;
    padding-right: 8px;
    width: 100%
  }
}

@media (min-width:768px) and (min-width:768px) {
  .footer-container .f-m {
    box-sizing: border-box;
    padding-left: 12px;
    padding-right: 12px;
    width: 100%
  }
}

@media (min-width:768px) and (min-width:1024px) {
  .footer-container .f-m {
    box-sizing: border-box;
    padding-left: 12px;
    padding-right: 12px;
    width: 100%
  }
}

@media (min-width:768px) and (min-width:1270px) {
  .footer-container .f-m {
    box-sizing: border-box;
    padding-left: 12px;
    padding-right: 12px;
    width: 100%
  }
}

.footer-container .f-m .f-m-title {
  color: #fafafa;
  font-size: 20px;
  font-weight: 700;
  margin-right: 30px
}

.footer-container .f-m .f-m-list {
  word-wrap: break-word;
  box-sizing: border-box;
  display: block;
  line-height: 22px;
  word-break: break-word
}

.footer-container .f-m .icon-some-chat {
  color: #909090;
  color: var(--nav-footer-link-color);
  cursor: pointer;
  display: inline-block;
  font-size: 18px;
  margin-right: 17px;
  position: relative
}

.footer-container .f-m .icon-some-chat:focus-visible {
  border-radius: 4px;
  outline: 2px solid #fff;
  outline-offset: 2px
}

.footer-container .f-m .icon-some-chat:hover {
  color: #fafafa;
  color: var(--nav-footer-link-hover-color);
  opacity: 1
}

.footer-container .f-c-main[data-sg=true] .link[data-hide=sg] {
  display: none
}

.footer-container .web3-footer-wrap .language-list {
  box-shadow: none
}

.theme-dark .footer-container .footer-section .logo-web3 {
  background-image: url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAA4cAAACqCAYAAAAeNzrjAAAACXBIWXMAACE4AAAhOAFFljFgAAAAAXNSR0IArs4c6QAAAARnQU1BAACxjwv8YQUAACUpSURBVHgB7d3tlRRH0obhh/fwf0cWqGQByIJNLFiwgMYCIQsYLBCygJEFYi0gZcEiC1SyYFkLeCums0RrmBn6KyO/7uucOj1I2qV7qqsqIyMy44EWnz59ulheNsvxSH34czmuHjx4MGsQyzl8urz8S334uBw/j3T+7rOc27C8vJevH5ff/xvhTst5sd/PD8rv43IuvhHutJyLX5eXp/Lz7+WceP59aMTyXfxjeZmU33e5n5HLZ9ksL2+V3+vls1wKQBUeLhf/pO3Ac1Jfni+f7ckIAcbyOe3mvVFfXi6fiwBlsfwO4vK7sID5Qn56mSjK6Z/ycWETBPY9EO4S5OudAADo0P8txyv1FxiaST4zXkWlmb2N+vQqZbWxZCrki6zIPdKk2mP5CcKtUmbd+z4RBQBAhyw47HkQGAYILnopJb2NnTuClK0oXxdp0I3bBfnyylK2yPse8YGSdwBAryw47D144vOhByXK2DwzY63xnpQZYaLrWN4l0L8JAIBO/Z8AVG/JVNiawyhfPWelTxXkLwh/kwLmIF+sNwQAdIvgEGiHd8biMdmqLxVa42aCcFOQr49sDAQA6BnBIdCOKF8WAFFa+qVS62DJ5H7J+3dC1hAA0DWCQ6ARKWPxUb7YEOhLpdp8TGmXVHwW5Iv1hgCArhEcAm3xbmnBLpk7UnAWVA7BepLOxSRfUQAAdOyhALQkLsdz+bled5g2xEH5dX9WRvlGMEG+Ii0sAGBcjtU7H0uOuwgOgbbYmqe38mXZqivBlM6ksgb0M+/1hpSUAsDY3sunYuWFCo67KCsFGlKopQWlpZ8FlXWRdktFgcyhAADoHMEh0B7vDAbr3HRdTmJZu0nlBQ2uQDuRmRYWAIAREBwC7YnydcEumdeC6kAml6whAABZEBwCjaGlRTG19BkMtkmQxuYdILPeEAAwBIJDoE3eLS2GbsCegrGgegwbrBc6F1EAAAyA4BBoU5Sv0XfJDKrLyOcjyBctLAAAwyA4BNr0Tr5G3yWztsypZ6/L2tDCAgCATAgOgQYVamkRNK6guoy8SZB31jQKAIBBEBwC7fLOaAy5S2ZFLSxuGm7dYQqIPYNDWlgAAIZCcAi0K8rXqLtkBtVpxE2CgnxFAQAwEIJDoFGFWloEjafWIOzxgMG697nw3hUYAICiCA6BtkX5ChpIhS0sdtl7G23X0iBfUQAADITgEGib97rD0UoZg+o2zLrDtPbTM1Ma08ZPAAAMg+AQaNuVfE2D7ZJZezA80iZBQb4oKQUADIfgEGhYymx8kK+RdskMqttI6w69A/UoAAAGQ3AItM+7tPSRBpAypJPq132wXmDtp7Ww8J50AQCgOIJDoH3v5GuUzGFQG0YoLaXxPQAADggOgcYVaGlxkTYH6d1ztWGEYN37M7LeEAAwJIJDoA9RvoL610oAPEKw7p0djQIAYEAEh0AfaGlxRkuwFeTbNuFUQZ1Kaz89g19aWAAAhkVwCPThSr563yWztVLNnoP1IF+UlAIAhkVwCHSgQEsLCwx7LmVsbZOXnoN1SkoBAHBCcAj0w7u0tMuNUAqUMZ5Dz8F6kB9aWAAAhkZwCPTDu6VFry0UgtrUXbCeNtqZ5CcKAICBERwC/bCMh+dGGr2WMra6fq/HYD3IF+sNAQBDIzgEOlFg3aHpsbQ0qE09BuvegXoUAAADIzgE+uKd+egqW9VgC4ubegvWg/zQwgIAMDyCQ6Av3usOg/rSenDVTbCeAnVPlJQCAIZHcAh0ZMl8zMvLLD9T2t2zF60HVz1lDr0/SxQAAIMjOAT6450B6SIgabSFxU0XBTJuuXgG6rSwAABABIdAjygtPU5QH5rvd1ggUI8CAAB6KAC9WVtaeG2s0ss6t14+h+3w+UZt8w5wh1xvmHa3Xe8Tuz/v+piOtWwdQGE7yznuum7n9PqRjbZwKIJDoDP2IFgeHBYgBvm4LmVc/t6otgXl5RWwX7e0aHxAQAuLM9jJwNrrI22/f9PO66H/f+uPczo+ptc/lSalKM8FTpeu3aDtdfpterXjrmDwvv8ve5l1+zX7geARNxEcAn2yTEiQn6CGB9hpnd6kvKzcNzj8PTZwsIAgql1BfrpoYbEzmHykz9+zXJMRk+74Hi/vY+23asdvokUIcK+UwX+q7bX7OB3nvnYn3X3Nzvp8vX7oYKLXPpP9Dn/S+U3y8cPyGZ7L38/L+X9HcAj0yQKRHDfGu7RekhmUnwXs/1uOH5SfDTSiGpQe6pP8NFlSujOg/Gd69Soj/xp7HyEdL+0fpEqGuBz/7mHgCZwqTUjatRtUfr37lI7rzeV2Jnh+0XZyZ1Z71vtQq0rtHWDnnMwh0CO7mafZwEk+QuOljB7BbdS2pMcjOLSyzJdqk/dDMaoRKSDcaHt+g9qxZkNepvtSXI5fCBQxkp2A0O7NtUzm3GZ3gsfed1TbgSIOxG6lQL+8MyKlZrpOkgbcQXmtpXXrZkG5tdx/0nO9YRMtLGxQuRy/Lj/+oW1FQFC7Jm0D3PfLZ/pjOTYCOmXPl+WwSZH3yx/tuFTdgeFtwnK8XQ67Xn9djqdC1wgOgX69k69WHxhB+dlaDu0EiB44H18XVak0qNzsDCprKh09l2k53qYg8VXDExrA36Tr95X6mNDZZfehX5nY6RvBIdAvryzVynuHyXPxeN9x52evjO4jNSaVXXkGQFWuN9wZVNpsfVD/Jm0zKu/TZweadCMovFR/EzqrSZ8ndjZCVwgOgU45Z6nMlEo0WxOU18cba6uifLSYOfR+z1EVsXItG2yp70HlfabluGTAidYMFBTeNIkgsTsEh0DfvDMjTQUkTjtj/rb7h7TGzSOje5EycS3xzHZW02LByilT+aitK5yESdsB51tKTVG7dJ/9j8ad1DGTPgeJk9A0Cw5b3V1wX71/vj/Vt97PX27e6w5ba2kRlN9t58AraA9qhNPGQLuqKCldPrftXmsDyyDctNG21DQIqEzKFtp6QpvYmQQzabtxDeXhDbPg8Gf162qA5rtX6pftJOgd3HQlbTs9y09rpYze6w3v+2c5tBSsB/mKKmgnW/hG42Yb9jGJtYiozE628KVwm0uyiO2y4NAeTL+oP3E5XqtzaS1Tj59zXo5nwjl4ZkguUqlm9ZwyVR/u6AvlNekRGloHOkwLizSwtMAwCPu6TFkaoCiyhXubRBaxSQ9TZs22y77Stk9Z6zOY15tw3Gyumx7GQX2YtdOMdHm9TOevl63O5+V4N0DW14sFIh6N11dBvhvhHCsov1t/D/bdTo2Fg/IL8i8vPkaQn6hCUhnpG+EY1i/uYrl+XghwlibabF1wEA5xmX53rxnXteHh+kMKpqI6ZIvatV270JN5+VzP1tnvFCgy4MBt1g1QvCYOLAPUwnfRI1N1X9bWNqoJyi+o8uAwlR5N8lOkWibNoF8Kp7DJ7Gl55j0R4CTdo8gWHs/Kb2035id3VNOgIt3vVpq21t2oP5O2M1jAvQq0tHjcSCljUH7xyH93Ti30nwxydLOyxAOB4VmFNOkLZJeWStj6wkk4xaTt+uFJqNoIrSyeq19TK+u7UJzrukNtS9Sr5dTC4t5WCSlA8SixmRp4GHsGsFHOCAyz2LCWCbntrA9m06jzmESAWL0RgsNJfeOGhX14lxXWvmupR/C6T0Ae5aP28xHkx7WklMAwK1vL1PMEMApavlt23yQwPL9JBIhVGyE4BIZXoKWFZzPzY3gMKPcp5f1NPoIqlWbmPQdfUU7S4PJSyOkNg0ycW6ouoXQ5n0kEiNUiOATG4VlaWnsLhaC8Pu65rs0ro1tzv8MgP7PXZghp0MPgMj+7z/B7xtnsbD5DxjCvSQSIVSI4BMZBaan+ylTltldG0DGje+H0uY/hGbhG+WFw6ccmo14KOBGBobtpOX5tZBO7YTwUgFF4t7SodVMaj6D1kEDcMroefSiDKmtXlAYEQX5c1humdYaT6jffeF03SNq9R0xq47O8sn6/9FHDsdL9qKV2FbO21+x6mBavXRsr2D3zR6EKBIfAIFLjdQsQg3zYDpQ1zuZ7ZKriAf+tBZIewWGNpaVBjjxaWKTMw6Xqsraz+T29Rm1Ln/cOpHZ6UdpA7p/pdVI9bFDMABOnqHlSJ2p7/drrh0PK42+5doPqy4y+XN7nn8vneiMUR3AIjMWyVEE+ptSselYl0kMyd0bzw4Gf2Suje70OtLLMSo8tLN6rDnaeLVNqkw8fTj3vOyXQcTmuB3Bp046NtudxUnk2wPyZJts41PK9sQm6miYz7XqN2l7D8ZTrt5Fr11j23z7rPpu5ISPWHAJjGX3dYVB+B+1Amh76Xg/D2s6HZ+lx9pLSZWCzUfmBVtQ2e/bd8t16adnSXBMCNohLf8d3yx+fqY6y5RqrFVCxyrL9dq2+1vb6fbYc73Jcvzeu3SdybvFzBzaXqgTBITCQAi0tgurikak6JgD32knWMxi7l1MWd1dUfiWbss/L8WS5xu14450hToNYG2Q+ke895qbnbG6BA9WwAc28HC+Wa+ib5bj0vH7TBNJm+dECxdJB4uPl+r3UidJnOjv53dtePCjjyv5ygkNgPJ4tLWpb5xaU3zFZwCgfnmWcXxPkJ3sLi8JZw9fL5/vugcOayq95sB2U2SDztcqwQT7ZQ+ylgs2j1kzh9+vAvBS7Rz74HCTOKudVKntFIQSHwHg8S0uraaHg1Gz9qBK+B9s1Fh4zxVNFPaU8A1WPCZESWcNZ20HlpSqT3tP3KjPIrGkSBJVK98KSEwlR6fp9UNFa8BQklpzgMT8JxRAcAuPxXuwdVAeP9XanBCFeGd1a1h16zgxnnRBJEw+TfNl1/P2DijdvSO+tRJnp44r7eqIeNqFTqpzUNk568qDizZPSBE+pLGLgGi6H4BAYTJqhjPJTS2lpbS0szvm/PUTxrEoqGZrk46NDueVz+boOumrKNtwlDX5LBIhBwB1S4LFRGS+W66KJ0ued67fEJBSb0xRCcAiMyXPdYSi9QYTT5ifziVkcr3LfxxVs2BHk56DdY4/kmY2d1UhguEoDzGfyRWkp7lMi8LBrtvjawkMVDBCntJYbzggOgTFF+Sq9uDwov6gTOGZ0LTAsfT48B+65S0otMPQKtmc1Fhiu0sSJZ4P6GiZBUKFCm0fZNfuk5jLw+6R7TokAseQO0MMiOAQG5LgByqr0OjePYOQcGSqPLJcpfT6C/ETl5Rnovq55jdLXLO/9jXwnpmpZX4u6lAg4XrQaGK5SgGgVALP8kD0sgOAQGJdnP6PSJV5B+UWdLsrHIxXivMnAB4dgKsjHVWvlaHfw3AGxdIYclUmZ/km+bFLHa9lAVoVKxL3XdA+P4BAYV5SfqVSJl1MLi7MEIWnjFI+Mbsl1oJ7ZnKyZ2LSWdZKPktvKn036jkf5qK3PKsr7Qb6uamw1c4oCJeLsXOqM4BAYV5SvUiVeQfmdMwiJ8lHqfHgO2HPP1ntlpmLL5aS38NoQaxKQpMmcID+zfIMoNwVKxMkeOiI4BAY1UEsLj7/3nEGI17pD9/PhtGvsyqOFRZAPzxJwD1fyyZBfpO8cYLzXGr5ucfOoA3hWMzxlgyk/BIfA2DxbWrhnqrxmis8chHitTSmROQzy4xFku6zd7GSt4V/SgNlrcw7WHWIV5KeXNcJ3Ss89r4krCww3gguCQ2BsUX4uUvNzTx5/X9QZpfLBWfmVOB89lZQaj5nsqD55TUyRbUCJ9hVdrBHew6X80LvUyUMBGJYtLF8emjaL7zWACvLtk+TxMMkxyLX/T4+NE4J8z0eQn6j8PEqzeyspXc3yMQnwDSyuOlsjfCf7nMsYwibiPCpRrjdS67xUtwoEhwAsEPFa7G0P6DfyE5Rf1PnZw9YjOHQ7HylLOcmHRwsLGxg9EY7lNSnxrTC0tFbNs4x+lKzh6mf5/X7t77kSsqKsFECUn8dei8qdgpE5U2Njt/VYjov8g/x4beqD4zH7Dy+egWFvOwt/VVp76PXMoj2NA4JDAF4boBgLRLzWuQXlF5WB406ynufDs6zL8zuNIziWhk3C6DwDil7LwL/Gaw1xqRZMQyE4BAZXoKWF183dIxjJmaHq7WEb5MOjhQWAdgT5GXViyutz057GAcEhAONZhpd9+/9UKhmUX1Q+3ZTpLOcjyA8lpQCuOa91jqNulpKWV8zyEYSsCA4BmCg/wWGdW1B+WTc9Sdkvj4GGx7pDz1IgSkoBrIL8ePYNrpHXxBzrDjMjOATgGYiscgcLrZeUrnopLfV8mEcBwJbnvcezLVCN3DZSE7IiOASw8pz1zH1zD8rPI0MV5SPbACqtD/F6mH8YbadAAPdyCyRY6+z2vCI4zIzgEMAqyk+2zJ7XGhOngYBXiWTOzKHng5z1hgCupXL5ST5GzxqaWU7YlCYvgkMAK8+1WlPGm3tQflEOPFtapKA6B1pYACjBc2LqTw0uPa9m+QhCNg8FANre2JcAIcrvpmvZqjc6P49gxLME93f5nJOgPLPfQT5oYQFgl2dw+Gh5fr4Xcm9u5v33DIngEMAuK8sL8hGUJzgMyi/Kj2XDflB+FlSf9Xw4byM/fElpKqNbS+mm9LMd/9DnwdSFGFhhDJ6b0Uzyu9fBoSXWyAgOAeyKy/FKPs7+4Hbqpzennk4uLBu2fC4r18k9oL9uaXHmPl2eM/fDlJTu9PGctB0k2e/Zc30V0AImQfr1jZANwSGAvzgGIsbWuYUzlwI+V35R/iwYDcrLzrkFGVHn47neMKpTKQMbtA0E7XUSgK9hV8t+fStkw4Y0AG7yXE8XdF5B+ZVodNxqv8MgH121sLDMoE2cLMfb5fjv8o/+sxw/LcdGBIbAvsgc9otzmxHBIYCbovycrbQ07X46Kb8SW5Z7lUyeLdOXSny9HuBdrDdcA8Llxz+Wwza32IhBEHAwWh10bxKyITgEcJPn2q3Haf3UOQTlVyRDlf7OWflNjZ2PVbPrDVOW8FXKEBIQAucxCcBRCA4B/I1jbz2zrnM7B4/1bSUzVK2VlnrtFNhkC4s1KNQ2S3gpAkLgnLieOkd2OB+CQwC38QyCzhWMBOVXMkPl9XefHNTt7KbpoamSUoJCwAXXFXAkgkMAt4nyc45gJCj/YKB0hsprreM5gvUgP82UlC7fU/vd2uYyl2LwCuTE9QUcieAQwBdSEHTOfnf3Oce6w3PvsnmbEhvR/MWx3PfiDP0iaWGxI2ULbT3hr2ItFOCB4BA4EsEhgLt4tmw4NbjzWN9WooWFCr2HoNME+ai+hUUKtC1bGAQAQOUIDgHcJcrP0cFdWpTu0ew4qjyv7OWp52OSj6rXGy6/ix+03YF0EgAADSA4BHAXz7Vcp2QOg/KblwxV0bJS41juG04o9Q3yU+16w7TpzBsBAM6u9qqRlhEcAriVd0uLZTB9bPbPY31bVD28SktrPh9mrrWFRWpkfykAABpDcAjgPp5le0HHCcqvhvWGqygfx2Zzg3xEVWgJDH/StpE9ACCPWchmhOBwFoBjRfk5OOPk1MLCRNXDq5Sy5vNhqltvmEpJXwoAkNMsZDNCcNhUg+QDVVtWhT400NLCo4VFTCW2VXAs953S5jKH8NgYaBVVkeV3tRGlpADg4X9CNt0Hh8tA6nJ5+UX9sQHiMwH5eZVUWmB4aHDh0cLid9XH6z0dGnx7rTeMNW1GkILonwSgFtVM6CGLWcjm4fpDKgea1Ie/ZdSWnzfL57M/28DzH2qfDQyvdrMZKePikUXx8HH5bNXuQjiguBzP5SNoz4yQYwuLGr+L9p5+UH5Be+64me5BQT5qqwixdhU03Qbq4Rkc2v3oUvA0C9lcB4dpZ7WNOrJ8Jtt2/skaQC2vV+pU6qXV1Zbpy2eal5dnNbQPwHUg8lY+DskEBuX3scbSbXtPyzVi97bcAUlt52MVVYlUTjqpXvPOYf5UPV4JyMMzOPyDJT7oycO0gH6j/lhGwQa0XZdepu3/e+ylNS3Hr8vn+76m9V4jst9/yrwH5XfdX2/Pc+5RUlrzmmWbOAnKy1qMhD0HPsO1sEjZ65oCnKhtZYl9N6oqvb1NGn8AOcwCcBRbc7hRv56e0Mi5FR6lZaVM8s1G4G41trTY9787Rc3lzV5rQcOe/53XZjRR9bDgZlJZcTl+XI5vlmDQqmVeWqUMDaIxOM9J5W8EdMSCw0l96z04nNQ31vHUIcpP+Np/kDLmk/KruazZK3D9aobWcf2nqSKbmz7zRuVEbZdO2PGGCgvgM+fJkR72sgD+MkIrCwAncm5psU95YlB+c81rXtPgZ1Z+YY8KjCA/UXXw2qTpplmfg8IoAHeZ5WMS0BGCQwD78ipj3Ke/nsf6tqj61VJaOmILi438WVum7wkKgb14TWhOAjpCcAhgX1F+7mzL4tgywSvwOoVXaWn4yr8fraTUvp+TfL22tkyUjwJ7c+tRu8eEJtAMgkMA+/LcnOXRPf8uyEdU/bzKXu/MDDqu/zS1bBDklSld/bwEhZfqyACbxaE8z2UBXhNkQHYEhwD2kjIWXg/bp/f8O5eS0hYyNOk9RuV3X6lvkI+a1oA+lR/73C/Vn0lAXp73i0lAJwgOARzCq6zvur/eHf8uKL+a+xve5FX+eldA5LbeUBVI30vPrNcT9YnMIXLzDA6DgE4QHAI4hGdZ3xdlOo4ljFHtKF1aGuSjljWgQX567ldIGR6ySpUVs3x8teUP0AqCQwB7q6ClRVB+H1vaDdLxnNwWrAf5iaqD5yDwtfo1CcjPs9qFCQ90geAQwKGifDy+ZdMKjxLGlkpKVx5ZtdtKfb3W3tW0BtRrAPih46yheSQgP8/SUs+1yEA2BIcADuU2E6udgbhjC4tadsQ8RJSPcOPPXlm0KkpK03fQa61cC61UThEE5Od5P6e0FF0gOARwqCv52Z2JDfIR1R6vAdBfg5+0e6lXFi2qDp5lY1Gdci5HxsBS9n2WjzBqv0P73J98/CFkR3AI4CDOLS12Z2I9SkrnFkv5HFtahJ1S3yAfNbWw8Nxhs5bPnMNzAX48s/AbjSnIx+9CdgSHAI7hVVr62DkYiWqX10NzzeZ6lVBF1WOSj48t9Nk8QRDgx7O09IdPX66VH4HXhE8UsiM4BHAMz4ft01SqMym/ltd5eZeWBvmo6Zx4Dfq6DQxTSekkwInzLtt2j9hoIOn5HOSj54qKahAcAjiY88PWgpEgH1GNcjwnTx37TZqoeoyYETg3SkpRwi/yM1r28JV8NNVmqmUEhwCOFeXDyhg9BpQ1tUs4lsesqufMeG3nhODwBCnDsBHgz7PaZVqOlxqAc9awxTZTTSI4BHAsz5YWQfn18ODxKsH8QT56b+cwGq8MA/A3KeM0y88o2UObuJ3ko8U2U00iOARwrN5u1FHt45z0YVJnyBqiAp6lpRYYvlXH0jV9KT9RcEFwCOAozv2jcutiLUNn56SmFhbu0rrOnvwqoKw38t3sydZn97zG1rMSILbYZuoEkwoiOARwil7K/npay9DLOYmqzyw/QZ1YBshWhtxbsIvGpPXLntlD8yZl2LqSrumN/Hift9K+VUEEhwBO0UsZY0/lmL18lhqDXM+sw7/UgTQwfiOgDt7fRSsvfd/T+sMC5aRWRXKlsRSdTCM4BHAKK/vroSdbVD96KcWMqo/ndz20nnFI7/+9ymKHWfwllSZ6Z6EmdRIg7lzTnp8lqh5ez4DHJb8vBIcAjpbKdFoPRj70tJYhnZOottXaVsT7u+61K+zZpYGNrTOcVBbBIW66lD/LBDUdIKb3boHhJF+vVQ/P59JGhRAcAjhV62vcetz0pPVzUuv7n+XrZYsb0+wMImt475OAHWky8Gf5WwPESY3ZyRhO8nVV2eTtn/JTbGkBwSGAU7W+xq3HXnqtB7xRFUrZzFm+3raUbdgZRFYT1C7vKQj4u0uVWRLRXIBY+JquKWtovJcWvFQBBIcATtJB+4SozqS2HK2uBa29hYX3ZIINyH5SA1KWs6rAMOm5nQCOkCZ6SgUe03L8p9TA/xCpFcd/VCYDX1vW0Mzy9VOJdigEhwDOodXsW61r286h2XOiupUIXDfLAMGzp9jB0tb2JcrO9rEhe4iblnv/G5W731g1gA3839aYRbRqheWwNcNXKrNud1Z9WUMzy9+V9/2f4BDAObRaWtpjSekqqk21n5NS3/VLG6zVVmJqQddyWFBoA+2ay1/td7cR8Hc/qqzNcvxhg/8agsQUFFog8sdyPFU5ryvdKK5UVYvd/9fvSfbKjAfLX/JJffuup50Ib0oP5aB+vRiwv01z0oDVHiat7cT2JJVgdiedk/+qPd/Uns0tfN+dtf3eziooDWRtELlRW2ZtJ05+Tz/f+l079r5gAzj5ZE+zj21SMP1W+VkgcKlCUnlnDaXbs7bfTffAKD0vLPtvv4vSz3FbWvCdKrX8ruy5Wvp3tO4Uv66D/5/O5+NDAcCJbDC/3DDtRhXUjo+9BoZm55zUtv7rPq2U+dpOh0FlTNpmGq5UZhAZtB1ElswqnGLSfgHtA2EIVl66fK9tZ8igsiZtv5tWBh217cf4Ltc9MQWE9nyw6zmonsndJ6pbDWOdi4zvYaasFMC5tFai+Zv619pnbOU7FFV+w5+NtkHi29zr6VLp6KuUFbOsaauBIXCXF6prY7Wgbdb2v1apsByX6To8OoBLJaPXO2Cm6ofd67mWwLDWctJdv6tzZA4BnIutxWpiV8Wk1XWSh7DP2FIj9agGpKysZQ9r2CRmo22mYdb292cB9odjB1hp8DlpOzh9pLoGjkAWdr0s3/1n2u7MWZuQjuv7zfI+15LCWZ/77s03/jdTev1W2+v3serv+fmuZHnxAVp7rh6M4BDAWaSH66x2mk5H9W9dk9DC4L72FhY3vdF2gFDL73ZSChTtDzsDyJtrUuznC31+3//Q58HjGhh6svdnm4J4rG0D7mT3n+W6se9i7ZOcOUsKS5lVfnOgvdhylHR/7XbSjOAQwDlZ1qKFGbUPDZSunKyxtaBRDakse3ibVgaQtl39LKACaf2hXTtVt47pjAVaxTfZOpCNdbrtn8qaQwDn1Eqp5gjrDVetrONrsa2IZQ9n4VhXqdfcLKASqbSxxh57vXrR4GTtlTpGcAjgnNYyttqNsN5w1cpnjWpM2kXwhXCMWZ/LyFq4Z2AgBIhuflx+1809j9NO5y0tgzgIwSGAs0mD5RZumN3e1G9KM7Kz6tZKC4svpEHCz8Ih1jKy63OeXgkQURUCxOxep8qBVv2iThEcAji32ssDmw1ETlD7OWmxpPQvy/fppQaacDiDZ7eUkfH7Q3UIELN53cjOpHfquSSe4BDAudVeItJ0IHKkqLpFtc+2wZ+Fr3mRsq03dd87DG1KQUwTO2k24kXrgeGOLr8XBIcAzqqBMsao8UTVq7UWFrdK3/snIkC8j2ULru74dyOtA0ZjUpboe3F9n2ItJ79SJ9J6yajOEBwCyKHW7FwXgcihUhltVJ2iOkGAeK8f78sWpGwi6w5RrfTssOubEujDzcvx/R1VA62zTcm6uncRHALIodYswMila7W27+hqUT8B4heud3Tdc+MJNvZB1ez6Xg7LILIOcX92j/++197C6XM9U0cIDgHkUGtLi5FL16Iq1ONM8k6AOHqGYdZhZWQWQJI9RPVSFvw7MQl0H7uWrWJg0/smcOk51s36Q4JDAGdXcUuLqEFVWrYX1amdDMOo2bDrErxDyrjTfYOMDJqQrnELEPnOfilqmy1suVXFQdJn7eK7QHAIIJfa1h1+6LWs5QC1nZNu+0StUpsLW5Myaxw/W2B8zPWWBlhRQCN2sojd38/2sJaRPxnxeZu+C1Zi2nSmlOAQQC61lXDWuubOU1RdogaQyiqtzLT3weOsbbbwpU5jgys2/UAzUhZxo22QGDWeNev/XU+7kR4j7WDa9M62BIcAsqiwpQVb5df1O5hHmlm+MXjs7bt4PTC0ErtzrCFN5aWs2URz0nVu390RJoPMblB42fvawn21XnJMcAggp2rKGB/0uYX2QSpbCxo1oDRosMyYDR6j2va3gaHOyL6r7AqJVtnzZmcyyILEWX0hKNxDqyXHFhz2fkL5fG3jhtO2WjIkUVjVUl479PqcNHi0AHEdOLR0r3MbGLY6uALMWjGQski29jiqbVHbsm+Cwj3dqBqxHU1nVc6Cw57LNj4M8MWttdn4uVBW1LZaWlr0fp0cooqAnUzu1s7g8RttB481l5xGbQc3rgPDG4OrHrMwGICtxduZEGopUIzaTgZ9kzaaeUdQeLh0H3uTJgrse2A7WVc5xn2o7Rf0/XJM6ot9cbtqSnkbu9l8+vQpLD8+V39ej7jbVU/sAbJ8P+3mF1RWFFZrwH6hcqLwhbSRg93T7dyE5Xi6HP9UuefzWoZskytXpQeE6XmwsZ/Tc++xPv9+HgtoQPoeX6Vj/S7btf5I5Z+Vxq5zm6SyKhMCwQzS5KgdSvd7u38Fbb8D65+LPaMfaPvGJm3fVA8Bhn2Jf9f2QTZrEMs53Cwv/1LZAd+5zMvxC5mFPizfTbvJFR24jb572k3LObGBSMl7xYdD+t+NLj2j1+vIgqF18HBus7bB4G/ptanqmzTImvT5u32hI7/nx94zHK+t7IP2nbFhbtwPduxMfEzaBgs5A4V1Auj39BqZlK9HugannX909D3tAB8fCAAANCdNvKwB0ZR+/ofuH0DM6fV/6ed1cDiTIQDqdGPiY9L+1/tHfV7a8Wf6eV4Prnnc5v8BZ/kbVPjh6f0AAAAASUVORK5CYII=)
}

.footer-wrap {
  padding-left: 8px;
  padding-right: 8px
}

@media (min-width:768px) {
  .footer-wrap {
    padding-left: 12px;
    padding-right: 12px
  }
}

@media (min-width:1024px) {
  .footer-wrap {
    padding-left: calc(50% - 480px);
    padding-right: calc(50% - 480px)
  }
}

@media (min-width:1270px) {
  .footer-wrap {
    padding-left: calc(50% - 624px);
    padding-right: calc(50% - 624px)
  }
}

.footer-wrap .f-c-main {
  width: 100% !important
}

@media (min-width:768px) {
  .footer-wrap .f-c-main {
    box-sizing: border-box;
    padding-left: 12px;
    padding-right: 12px;
    width: 83.33333333%
  }
}

@media (min-width:1024px) {
  .footer-wrap .f-c-main {
    box-sizing: border-box;
    padding-left: 12px;
    padding-right: 12px;
    width: 83.33333333%
  }
}

@media (min-width:1270px) {
  .footer-wrap .f-c-main {
    box-sizing: border-box;
    padding-left: 12px;
    padding-right: 12px;
    width: 83.33333333%
  }
}

.footer-wrap .footer-download {
  box-sizing: border-box;
  padding-left: 8px;
  padding-right: 8px;
  width: 50%;
  width: 20% !important
}

@media (min-width:768px) {
  .footer-wrap .footer-download {
    box-sizing: border-box;
    padding-left: 12px;
    padding-right: 12px;
    width: 16.66666667%
  }
}

@media (min-width:1024px) {
  .footer-wrap .footer-download {
    box-sizing: border-box;
    padding-left: 12px;
    padding-right: 12px;
    width: 16.66666667%
  }
}

@media (min-width:1270px) {
  .footer-wrap .footer-download {
    box-sizing: border-box;
    padding-left: 12px;
    padding-right: 12px;
    width: 16.66666667%
  }
}

.footer-wrap .footer-download .footer-link-box,
.footer-wrap .footer-download .footer-register-box {
  cursor: pointer
}

.footer-container .hide-link {
  display: none
}

.footer-ru-container {
  align-items: start;
  display: flex
}

@media (max-width:767px) {
  .footer-ru-container {
    flex-direction: column
  }
}

.footer-ru-container .footer-ru-tip {
  flex: 8 1
}

@media (max-width:767px) {
  .footer-ru-container .footer-ru-tip {
    margin-left: 0;
    margin-top: 20px
  }
}

.footer-ru-container .footer-top-box {
  flex: 2 1
}

.ru-tip-bottom {
  margin-top: 50px
}

@media (min-width:1024px) {
  .ru-tip-bottom {
    margin-top: 0
  }
}

@media (max-width:767px) {
  .footer-container .f-b {
    display: flex;
    flex-direction: column;
    position: relative
  }

  .footer-container .f-l {
    margin-bottom: 12px;
    position: relative;
    width: -webkit-fit-content;
    width: -moz-fit-content;
    width: fit-content
  }

  .footer-container .f-l .now-language {
    font-size: 16px
  }

  .footer-container .f-l.active .arrow-icon {
    transform: rotate(-180deg)
  }

  .footer-container .f-l.active .language-list {
    opacity: 1;
    visibility: visible
  }

  .footer-container .language-list .item {
    font-size: 16px;
    font-weight: 500;
    height: 48px;
    white-space: normal;
    word-break: break-all
  }

  .footer-container .language-list .ul-box .list-ul {
    max-height: 288px;
    overflow-y: auto
  }

  .footer-container .language-list .currency-list-ul {
    width: 136px
  }

  .footer-container .language-list .language-li {
    width: 163px
  }

  .footer-container .language-list.placement-top {
    bottom: 47px
  }

  .footer-container .language-list.placement-bottom {
    bottom: unset
  }

  .footer-container .f-c {
    padding: 36px 0 45px
  }

  .footer-container .footer-download {
    display: none
  }

  .footer-container .f-c-list .title-box {
    align-items: center;
    color: #fafafa;
    color: var(--nav-footer-title-color);
    cursor: pointer;
    display: flex;
    font-size: 18px;
    height: 52px;
    justify-content: space-between
  }

  .footer-container .f-c-list .user-arrow {
    color: #909090;
    font-size: 12px
  }

  .footer-container .f-c-list .user-arrow .footer-icon,
  .footer-container .f-c-list .user-arrow .iconfont {
    font-size: 12px
  }

  .footer-container .f-c-list .item-box {
    display: none;
    margin-bottom: 4px;
    margin-top: 4px
  }

  .footer-container .f-c-list .item-box .link {
    align-items: center;
    color: #909090;
    color: var(--nav-footer-link-color);
    cursor: pointer;
    display: flex;
    height: 44px;
    padding: 0 13px;
    width: -webkit-fit-content;
    width: -moz-fit-content;
    width: fit-content
  }

  .footer-container .f-c-list .item-box .link:focus-visible {
    border-radius: 4px;
    outline: 2px solid #fff;
    outline-offset: 2px
  }

  .footer-container .f-c-list .item-box .link:hover {
    color: #fafafa;
    color: var(--nav-footer-link-hover-color)
  }

  .footer-container .f-c-list.active .user-arrow {
    transform: rotate(180deg)
  }

  .footer-container .f-c-list.active .item-box {
    display: block
  }

  .footer-container .f-m-title {
    display: none
  }
}

@media (max-width:767px) and (max-width:767px) {
  .footer-container .f-b {
    box-sizing: border-box;
    padding-left: 8px;
    padding-right: 8px;
    width: 100%
  }
}

@media (max-width:767px) and (max-width:374px) {
  .footer-container .language-list .language-li {
    width: 150px
  }
}

@media (min-width:768px) and (max-width:1023px) {
  .footer-container .f-b {
    position: relative
  }

  .footer-container .f-l {
    bottom: unset;
    left: unset;
    order: 1;
    position: relative;
    width: -webkit-fit-content;
    width: -moz-fit-content;
    width: fit-content
  }

  .footer-container .f-l .item {
    font-size: 14px;
    font-weight: 400;
    height: 44px
  }

  .footer-container .f-l .language-li {
    min-width: 146px;
    width: -webkit-fit-content;
    width: -moz-fit-content;
    width: fit-content
  }

  .footer-container .f-l .currency-list {
    width: 132px
  }

  .footer-container .f-l.active .arrow-icon,
  .footer-container .f-l:hover .arrow-icon {
    transform: rotate(-180deg)
  }

  .footer-container .f-l.active .language-list,
  .footer-container .f-l:hover .language-list {
    opacity: 1;
    visibility: visible
  }

  .footer-container .f-l.active .list-ul,
  .footer-container .f-l:hover .list-ul {
    overflow-y: auto
  }

  .footer-container .f-c {
    margin-bottom: 48px;
    padding-top: 48px
  }

  .footer-container .f-c-main {
    box-sizing: border-box;
    display: flex;
    padding-left: 8px;
    padding-right: 8px;
    width: 100%
  }

  .footer-container .f-c-main .f-c-list {
    flex: 1 1;
    padding-right: 4%
  }

  .footer-container .f-c-main .f-c-list:last-child {
    padding-right: 0
  }

  .footer-container .f-c-main .f-c-list .title-box {
    color: #fafafa;
    color: var(--nav-footer-title-color);
    cursor: pointer;
    font-size: 20px;
    font-weight: 500;
    margin-bottom: 16px
  }

  .footer-container .f-c-main .f-c-list .link {
    color: #909090;
    color: var(--nav-footer-link-color);
    cursor: pointer;
    display: block;
    font-size: 14px;
    line-height: 16px;
    text-align: left;
    width: -webkit-fit-content;
    width: -moz-fit-content;
    width: fit-content
  }

  .footer-container .f-c-main .f-c-list .link:focus-visible {
    border-radius: 4px;
    outline: 2px solid #fff;
    outline-offset: 2px
  }

  .footer-container .f-c-main .f-c-list .link:hover {
    color: #fafafa;
    color: var(--nav-footer-link-hover-color)
  }

  .footer-container .f-c-main .f-c-list .link:not(:last-child),
  .footer-container .f-c-main .f-c-list:not(:last-child) {
    margin-bottom: 16px
  }

  .footer-container .f-c-main .list-container .f-c-list {
    margin-bottom: 40px;
    padding-right: 0;
    width: 100%
  }

  .footer-container .f-c-main .list-container .f-c-list:last-child {
    margin-bottom: 0
  }

  .footer-container .footer-download {
    display: none
  }
}

@media (min-width:768px) and (max-width:1023px) and (min-width:768px) {
  .footer-container .f-c-main {
    box-sizing: border-box;
    padding-left: 12px;
    padding-right: 12px;
    width: 100%
  }
}

@media (min-width:768px) and (max-width:1023px) and (min-width:1024px) {
  .footer-container .f-c-main {
    box-sizing: border-box;
    padding-left: 12px;
    padding-right: 12px;
    width: 100%
  }
}

@media (min-width:768px) and (max-width:1023px) and (min-width:1270px) {
  .footer-container .f-c-main {
    box-sizing: border-box;
    padding-left: 12px;
    padding-right: 12px;
    width: 100%
  }
}

@media (min-width:1024px) {
  .footer-container .f-b {
    box-sizing: border-box;
    padding-bottom: 48px
  }

  .footer-container .f-l {
    margin-top: 50px
  }

  .footer-container .f-l .item {
    font-size: 14px;
    font-weight: 400;
    height: 44px
  }

  .footer-container .f-l .language-li {
    min-width: 146px;
    width: -webkit-fit-content;
    width: -moz-fit-content;
    width: fit-content
  }

  .footer-container .f-l .currency-list {
    width: 132px
  }

  .footer-container .f-l:hover .arrow-icon {
    transform: rotate(-180deg)
  }

  .footer-container .f-l:hover .language-list {
    opacity: 1;
    visibility: visible
  }

  .footer-container .f-l:hover .language-list .list-ul {
    overflow-y: auto
  }

  .footer-container .f-c {
    display: flex;
    justify-content: space-between;
    margin-top: 32px
  }

  .footer-container .f-c .title-box {
    color: #fafafa;
    color: var(--nav-footer-title-color);
    display: inline-block;
    font-size: 20px;
    font-weight: 500;
    line-height: 24px;
    margin-bottom: 18px;
    vertical-align: top
  }

  .footer-container .f-c .user-arrow {
    display: none
  }

  .footer-container .f-c .f-c-main {
    display: flex
  }

  .footer-container .f-c-list {
    flex: 1 1;
    padding-right: 32px
  }

  .footer-container .f-c-list.list-container .f-c-list {
    margin-bottom: 40px;
    padding-right: 0;
    width: 100%
  }

  .footer-container .f-c-list.list-container .f-c-list:last-child {
    margin-bottom: 0
  }

  .footer-container .f-c-list .title-box {
    color: #fafafa;
    color: var(--nav-footer-title-color);
    display: inline-block;
    font-size: 20px;
    font-weight: 500;
    line-height: 24px;
    margin-bottom: 18px;
    vertical-align: top
  }

  .footer-container .f-c-list .link {
    color: #909090;
    color: var(--nav-footer-link-color);
    cursor: pointer;
    display: block;
    font-size: 14px;
    font-weight: 400;
    line-height: 16px;
    margin-bottom: 16px;
    text-align: left;
    width: -webkit-fit-content;
    width: -moz-fit-content;
    width: fit-content
  }

  .footer-container .f-c-list .link:focus-visible {
    border-radius: 4px;
    outline: 2px solid #fff;
    outline-offset: 2px
  }

  .footer-container .f-c-list .link:hover {
    color: #fafafa;
    color: var(--nav-footer-link-hover-color);
    opacity: 1
  }

  .footer-container .f-c-list .link:not(:last-child) {
    margin-bottom: 16px
  }

  .footer-container .footer-download .footer-download-title {
    color: #fafafa;
    font-size: 20px;
    font-weight: 700;
    line-height: 28px
  }

  .footer-container .footer-download .footer-register-link,
  .footer-container .footer-download .footer-trade-link {
    background: #fafafa;
    border-radius: 25px;
    color: #000;
    display: block;
    font-size: 18px;
    font-weight: 700;
    margin-top: 40px;
    padding: 16px;
    text-align: center
  }

  .footer-container .footer-download .footer-register-link:focus-visible,
  .footer-container .footer-download .footer-trade-link:focus-visible {
    border-radius: 4px;
    outline: 2px solid #fff;
    outline-offset: 2px
  }

  .footer-container .footer-download .footer-register-link:focus-visible,
  .footer-container .footer-download .footer-trade-link:focus-visible {
    border-radius: 25px
  }

  .footer-container .footer-download .footer-scan-box {
    margin-top: 40px;
    text-align: center
  }

  .footer-container .footer-download .footer-scan-box .footer-qrcode-img {
    background: #fff;
    box-sizing: border-box;
    display: inline-block;
    height: 110px;
    padding: 2px;
    width: 110px
  }

  .footer-container .footer-download .footer-scan-box .footer-scan-desc {
    color: #fff;
    font-size: 14px;
    font-weight: 400;
    margin-top: 10px
  }

  .footer-container .no_link {
    color: hsla(0, 0%, 100%, .65);
    font-size: 12px;
    font-weight: 400;
    line-height: 18px;
    margin-bottom: 8px
  }
}

@media (min-width:1024px) and (min-width:1270px) {
  .footer-container .footer-download .footer-download-title {
    font-size: 19px
  }
}

body[data-nav=false] .footer-container {
  display: none
}

body[data-nav=true] .footer-container {
  display: block
}

body .footer-container[data-hide=true] {
  display: none
}

body .footer-container[data-hide=false] {
  display: block
}

.dex-form-item-no-style-hidden {
  display: none
}

.dex-form-item {
  flex: auto;
  max-width: 100%;
  min-height: auto
}

.dex-form-item.dex-form-item-hidden {
  display: none !important
}

.dex-form-item .dex-form-item-label {
  color: var(--dex-okd-input-label-color);
  position: relative
}

.dex-form-item .dex-form-item-label-text {
  font-weight: 500
}

.dex-form-item .dex-form-item-label.dex-form-item-label-required:before {
  color: #da252f;
  color: var(--dex-okd-form-item-label-required-color, #da252f);
  content: "*";
  margin-right: 4px;
  margin-right: var(--dex-okd-form-item-label-required-margin-horizontal, 4px)
}

.dex-form-item .dex-form-item-label-action {
  color: var(--dex-okd-input-action-color);
  position: absolute;
  right: 0;
  top: 50%;
  transform: translateY(-50%)
}

.dex-form-item .dex-form-item-control-input-content {
  flex: auto;
  max-width: 100%
}

.dex-form-item .dex-form-item-control-explain {
  margin-top: 4px;
  margin-top: var(--dex-okd-input-md-tip-margin, 4px);
  position: relative
}

.dex-form-item .dex-form-item-control-explain-error {
  color: var(--dex-okd-input-error-tips-color)
}

.dex-form-item .dex-form-item-control-explain-tip {
  color: var(--dex-okd-input-tips-text-color)
}

.dex-form-item .dex-form-item-control-extra {
  color: var(--dex-okd-input-tips-text-color);
  margin-top: 4px;
  margin-top: var(--dex-okd-input-md-tip-margin, 4px)
}

.dex-form * {
  box-sizing: border-box
}

.dex-form .dex-form-item {
  display: flex;
  vertical-align: top
}

.dex-form .dex-form-item.dex-form-item-no-margin,
.dex-form .dex-form-item:not(.dex-form-item-has-error-preserve-margin).dex-form-item-has-error,
.dex-form .dex-form-item:not(.dex-form-item-has-error-preserve-margin).dex-form-item-has-tip {
  margin-bottom: 0 !important
}

.dex-form .dex-form-item.dex-form-item-xs,
.dex-form .dex-form-item.dex-form-line.dex-form-item-has-name {
  margin-bottom: calc(var(--dex-okd-input-xs-tip-line-height) + var(--dex-okd-input-xs-tip-margin, 4px) + 5px)
}

.dex-form .dex-form-item.dex-form-item-xs .dex-form-item-label,
.dex-form .dex-form-item.dex-form-line.dex-form-item-has-name .dex-form-item-label {
  font-size: var(--dex-okd-input-xs-label-font-size)
}

.dex-form .dex-form-item.dex-form-item-xs.dex-form-item-has-error .dex-form-item-control-explain,
.dex-form .dex-form-item.dex-form-item-xs.dex-form-item-has-tip .dex-form-item-control-explain,
.dex-form .dex-form-item.dex-form-line.dex-form-item-has-name.dex-form-item-has-error .dex-form-item-control-explain,
.dex-form .dex-form-item.dex-form-line.dex-form-item-has-name.dex-form-item-has-tip .dex-form-item-control-explain {
  line-height: 1.6;
  min-height: calc(var(--dex-okd-input-xs-tip-line-height) + 9px);
  min-height: calc(var(--dex-okd-input-xs-tip-line-height) + var(--dex-okd-input-xs-tip-margin, 4px) + 5px)
}

.dex-form .dex-form-item.dex-form-item-xs .dex-form-item-control-extra,
.dex-form .dex-form-item.dex-form-line.dex-form-item-has-name .dex-form-item-control-extra {
  font-size: var(--dex-okd-input-xs-tip-font-size)
}

.dex-form .dex-form-item.dex-form-item-xs .dex-form-item-control-explain-error,
.dex-form .dex-form-item.dex-form-line.dex-form-item-has-name .dex-form-item-control-explain-error {
  font-size: var(--dex-okd-input-xs-error-font-size)
}

.dex-form .dex-form-item.dex-form-item-xs .dex-form-item-control-explain-tip,
.dex-form .dex-form-item.dex-form-line.dex-form-item-has-name .dex-form-item-control-explain-tip {
  font-size: var(--dex-okd-input-xs-tip-font-size)
}

.dex-form .dex-form-item.dex-form-item-sm,
.dex-form .dex-form-item.dex-form-line.dex-form-item-has-name {
  margin-bottom: calc(var(--dex-okd-input-sm-tip-line-height) + var(--dex-okd-input-sm-tip-margin, 4px) + 5px)
}

.dex-form .dex-form-item.dex-form-item-sm .dex-form-item-label,
.dex-form .dex-form-item.dex-form-line.dex-form-item-has-name .dex-form-item-label {
  font-size: var(--dex-okd-input-sm-label-font-size)
}

.dex-form .dex-form-item.dex-form-item-sm.dex-form-item-has-error .dex-form-item-control-explain,
.dex-form .dex-form-item.dex-form-item-sm.dex-form-item-has-tip .dex-form-item-control-explain,
.dex-form .dex-form-item.dex-form-line.dex-form-item-has-name.dex-form-item-has-error .dex-form-item-control-explain,
.dex-form .dex-form-item.dex-form-line.dex-form-item-has-name.dex-form-item-has-tip .dex-form-item-control-explain {
  line-height: 1.6;
  min-height: calc(var(--dex-okd-input-sm-tip-line-height) + 9px);
  min-height: calc(var(--dex-okd-input-sm-tip-line-height) + var(--dex-okd-input-sm-tip-margin, 4px) + 5px)
}

.dex-form .dex-form-item.dex-form-item-sm .dex-form-item-control-extra,
.dex-form .dex-form-item.dex-form-line.dex-form-item-has-name .dex-form-item-control-extra {
  font-size: var(--dex-okd-input-sm-tip-font-size)
}

.dex-form .dex-form-item.dex-form-item-sm .dex-form-item-control-explain-error,
.dex-form .dex-form-item.dex-form-line.dex-form-item-has-name .dex-form-item-control-explain-error {
  font-size: var(--dex-okd-input-sm-error-font-size)
}

.dex-form .dex-form-item.dex-form-item-sm .dex-form-item-control-explain-tip,
.dex-form .dex-form-item.dex-form-line.dex-form-item-has-name .dex-form-item-control-explain-tip {
  font-size: var(--dex-okd-input-sm-tip-font-size)
}

.dex-form .dex-form-item.dex-form-item-md,
.dex-form .dex-form-item.dex-form-line.dex-form-item-has-name {
  margin-bottom: calc(var(--dex-okd-input-md-tip-line-height) + var(--dex-okd-input-md-tip-margin, 4px) + 5px)
}

.dex-form .dex-form-item.dex-form-item-md .dex-form-item-label,
.dex-form .dex-form-item.dex-form-line.dex-form-item-has-name .dex-form-item-label {
  font-size: var(--dex-okd-input-md-label-font-size)
}

.dex-form .dex-form-item.dex-form-item-md.dex-form-item-has-error .dex-form-item-control-explain,
.dex-form .dex-form-item.dex-form-item-md.dex-form-item-has-tip .dex-form-item-control-explain,
.dex-form .dex-form-item.dex-form-line.dex-form-item-has-name.dex-form-item-has-error .dex-form-item-control-explain,
.dex-form .dex-form-item.dex-form-line.dex-form-item-has-name.dex-form-item-has-tip .dex-form-item-control-explain {
  line-height: 1.6;
  min-height: calc(var(--dex-okd-input-md-tip-line-height) + 9px);
  min-height: calc(var(--dex-okd-input-md-tip-line-height) + var(--dex-okd-input-md-tip-margin, 4px) + 5px)
}

.dex-form .dex-form-item.dex-form-item-md .dex-form-item-control-extra,
.dex-form .dex-form-item.dex-form-line.dex-form-item-has-name .dex-form-item-control-extra {
  font-size: var(--dex-okd-input-md-tip-font-size)
}

.dex-form .dex-form-item.dex-form-item-md .dex-form-item-control-explain-error,
.dex-form .dex-form-item.dex-form-line.dex-form-item-has-name .dex-form-item-control-explain-error {
  font-size: var(--dex-okd-input-md-error-font-size)
}

.dex-form .dex-form-item.dex-form-item-md .dex-form-item-control-explain-tip,
.dex-form .dex-form-item.dex-form-line.dex-form-item-has-name .dex-form-item-control-explain-tip {
  font-size: var(--dex-okd-input-md-tip-font-size)
}

.dex-form .dex-form-item.dex-form-item-lg,
.dex-form .dex-form-item.dex-form-line.dex-form-item-has-name {
  margin-bottom: calc(var(--dex-okd-input-lg-tip-line-height) + var(--dex-okd-input-lg-tip-margin, 6px) + 5px)
}

.dex-form .dex-form-item.dex-form-item-lg .dex-form-item-label,
.dex-form .dex-form-item.dex-form-line.dex-form-item-has-name .dex-form-item-label {
  font-size: var(--dex-okd-input-lg-label-font-size)
}

.dex-form .dex-form-item.dex-form-item-lg.dex-form-item-has-error .dex-form-item-control-explain,
.dex-form .dex-form-item.dex-form-item-lg.dex-form-item-has-tip .dex-form-item-control-explain,
.dex-form .dex-form-item.dex-form-line.dex-form-item-has-name.dex-form-item-has-error .dex-form-item-control-explain,
.dex-form .dex-form-item.dex-form-line.dex-form-item-has-name.dex-form-item-has-tip .dex-form-item-control-explain {
  line-height: 1.6;
  min-height: calc(var(--dex-okd-input-lg-tip-line-height) + 11px);
  min-height: calc(var(--dex-okd-input-lg-tip-line-height) + var(--dex-okd-input-lg-tip-margin, 6px) + 5px)
}

.dex-form .dex-form-item.dex-form-item-lg .dex-form-item-control-extra,
.dex-form .dex-form-item.dex-form-line.dex-form-item-has-name .dex-form-item-control-extra {
  font-size: var(--dex-okd-input-lg-tip-font-size)
}

.dex-form .dex-form-item.dex-form-item-lg .dex-form-item-control-explain-error,
.dex-form .dex-form-item.dex-form-line.dex-form-item-has-name .dex-form-item-control-explain-error {
  font-size: var(--dex-okd-input-lg-error-font-size)
}

.dex-form .dex-form-item.dex-form-item-lg .dex-form-item-control-explain-tip,
.dex-form .dex-form-item.dex-form-line.dex-form-item-has-name .dex-form-item-control-explain-tip {
  font-size: var(--dex-okd-input-lg-tip-font-size)
}

.dex-form .dex-form-item.dex-form-item-xl,
.dex-form .dex-form-item.dex-form-line.dex-form-item-has-name {
  margin-bottom: calc(var(--dex-okd-input-xl-tip-line-height) + var(--dex-okd-input-xl-tip-margin, 6px) + 5px)
}

.dex-form .dex-form-item.dex-form-item-xl .dex-form-item-label,
.dex-form .dex-form-item.dex-form-line.dex-form-item-has-name .dex-form-item-label {
  font-size: var(--dex-okd-input-xl-label-font-size)
}

.dex-form .dex-form-item.dex-form-item-xl.dex-form-item-has-error .dex-form-item-control-explain,
.dex-form .dex-form-item.dex-form-item-xl.dex-form-item-has-tip .dex-form-item-control-explain,
.dex-form .dex-form-item.dex-form-line.dex-form-item-has-name.dex-form-item-has-error .dex-form-item-control-explain,
.dex-form .dex-form-item.dex-form-line.dex-form-item-has-name.dex-form-item-has-tip .dex-form-item-control-explain {
  line-height: 1.6;
  min-height: calc(var(--dex-okd-input-xl-tip-line-height) + 11px);
  min-height: calc(var(--dex-okd-input-xl-tip-line-height) + var(--dex-okd-input-xl-tip-margin, 6px) + 5px)
}

.dex-form .dex-form-item.dex-form-item-xl .dex-form-item-control-extra,
.dex-form .dex-form-item.dex-form-line.dex-form-item-has-name .dex-form-item-control-extra {
  font-size: var(--dex-okd-input-xl-tip-font-size)
}

.dex-form .dex-form-item.dex-form-item-xl .dex-form-item-control-explain-error,
.dex-form .dex-form-item.dex-form-line.dex-form-item-has-name .dex-form-item-control-explain-error {
  font-size: var(--dex-okd-input-xl-error-font-size)
}

.dex-form .dex-form-item.dex-form-item-xl .dex-form-item-control-explain-tip,
.dex-form .dex-form-item.dex-form-line.dex-form-item-has-name .dex-form-item-control-explain-tip {
  font-size: var(--dex-okd-input-xl-tip-font-size)
}

.dex-form .dex-form-item.dex-form-line {
  margin-bottom: 0
}

.dex-form.dex-form-vertical .dex-form-item {
  flex-direction: column
}

.dex-form.dex-form-vertical .dex-form-item.dex-form-item-xs .dex-form-item-label {
  line-height: var(--dex-okd-input-xs-label-line-height);
  margin-bottom: 4px;
  margin-bottom: var(--dex-okd-input-xs-label-margin, 4px)
}

.dex-form.dex-form-vertical .dex-form-item.dex-form-item-sm .dex-form-item-label {
  line-height: var(--dex-okd-input-sm-label-line-height);
  margin-bottom: 4px;
  margin-bottom: var(--dex-okd-input-sm-label-margin, 4px)
}

.dex-form.dex-form-vertical .dex-form-item.dex-form-item-md .dex-form-item-label {
  line-height: var(--dex-okd-input-md-label-line-height);
  margin-bottom: 4px;
  margin-bottom: var(--dex-okd-input-md-label-margin, 4px)
}

.dex-form.dex-form-vertical .dex-form-item.dex-form-item-lg .dex-form-item-label {
  line-height: var(--dex-okd-input-lg-label-line-height);
  margin-bottom: 6px;
  margin-bottom: var(--dex-okd-input-lg-label-margin, 6px)
}

.dex-form.dex-form-vertical .dex-form-item.dex-form-item-xl .dex-form-item-label {
  line-height: var(--dex-okd-input-xl-label-line-height);
  margin-bottom: 6px;
  margin-bottom: var(--dex-okd-input-xl-label-margin, 6px)
}

.dex-form.dex-form-horizontal .dex-form-item-no-label .dex-form-item-control {
  margin-left: 16.66666667%;
  margin-left: var(--dex-okd-form-item-label-width-horizontal, 16.66666667%)
}

.dex-form.dex-form-horizontal .dex-form-item .dex-form-item-label {
  flex: 0 0 16.66666667%;
  flex: 0 0 var(--dex-okd-form-item-label-width-horizontal, 16.66666667%);
  overflow: hidden;
  white-space: nowrap;
  width: 16.66666667%;
  width: var(--dex-okd-form-item-label-width-horizontal, 16.66666667%)
}

.dex-form.dex-form-horizontal .dex-form-item .dex-form-item-label:after {
  content: ":";
  margin: 0 8px 0 2px
}

.dex-form.dex-form-horizontal .dex-form-item .dex-form-item-label.dex-form-item-label-no-colon:after {
  content: ""
}

.dex-form.dex-form-horizontal .dex-form-item .dex-form-item-label.dex-form-item-label-align-left {
  text-align: left
}

.dex-form.dex-form-horizontal .dex-form-item .dex-form-item-label.dex-form-item-label-align-right {
  text-align: right
}

.dex-form.dex-form-horizontal .dex-form-item .dex-form-item-label-action {
  display: none
}

.dex-form.dex-form-horizontal .dex-form-item .dex-form-item-control {
  flex: 1 1
}

.dex-form.dex-form-horizontal .dex-form-item.dex-form-item-xs .dex-form-item-label {
  line-height: var(--dex-okd-input-xs-height)
}

.dex-form.dex-form-horizontal .dex-form-item.dex-form-item-xs .dex-form-item-control-input {
  align-items: center;
  display: flex;
  min-height: var(--dex-okd-input-xs-height)
}

.dex-form.dex-form-horizontal .dex-form-item.dex-form-item-xs .dex-form-item-control-input-content {
  width: 100%
}

.dex-form.dex-form-horizontal .dex-form-item.dex-form-item-sm .dex-form-item-label {
  line-height: var(--dex-okd-input-sm-height)
}

.dex-form.dex-form-horizontal .dex-form-item.dex-form-item-sm .dex-form-item-control-input {
  align-items: center;
  display: flex;
  min-height: var(--dex-okd-input-sm-height)
}

.dex-form.dex-form-horizontal .dex-form-item.dex-form-item-sm .dex-form-item-control-input-content {
  width: 100%
}

.dex-form.dex-form-horizontal .dex-form-item.dex-form-item-md .dex-form-item-label {
  line-height: var(--dex-okd-input-md-height)
}

.dex-form.dex-form-horizontal .dex-form-item.dex-form-item-md .dex-form-item-control-input {
  align-items: center;
  display: flex;
  min-height: var(--dex-okd-input-md-height)
}

.dex-form.dex-form-horizontal .dex-form-item.dex-form-item-md .dex-form-item-control-input-content {
  width: 100%
}

.dex-form.dex-form-horizontal .dex-form-item.dex-form-item-lg .dex-form-item-label {
  line-height: var(--dex-okd-input-lg-height)
}

.dex-form.dex-form-horizontal .dex-form-item.dex-form-item-lg .dex-form-item-control-input {
  align-items: center;
  display: flex;
  min-height: var(--dex-okd-input-lg-height)
}

.dex-form.dex-form-horizontal .dex-form-item.dex-form-item-lg .dex-form-item-control-input-content {
  width: 100%
}

.dex-form.dex-form-horizontal .dex-form-item.dex-form-item-xl .dex-form-item-label {
  line-height: var(--dex-okd-input-xl-height)
}

.dex-form.dex-form-horizontal .dex-form-item.dex-form-item-xl .dex-form-item-control-input {
  align-items: center;
  display: flex;
  min-height: var(--dex-okd-input-xl-height)
}

.dex-form.dex-form-horizontal .dex-form-item.dex-form-item-xl .dex-form-item-control-input-content {
  width: 100%
}

.dex-form.dex-form-horizontal .dex-form-line .dex-form-item-no-label .dex-form-item-control {
  margin-left: 0
}

.dex-form.dex-form-inline {
  display: flex;
  flex-wrap: wrap
}

.dex-form.dex-form-inline .dex-form-item {
  display: flex;
  flex: none;
  margin-right: 16px;
  margin-right: var(--dex-okd-form-item-margin-inline, 16px)
}

.dex-form.dex-form-inline .dex-form-item .dex-form-item-label {
  width: auto
}

.dex-form.dex-form-inline .dex-form-item .dex-form-item-label:after {
  content: ":";
  margin: 0 8px 0 2px
}

.dex-form.dex-form-inline .dex-form-item .dex-form-item-label .dex-form-item-label-action,
.dex-form.dex-form-inline .dex-form-item .dex-form-item-label-action {
  display: none
}

.dex-form.dex-form-inline .dex-form-item.dex-form-item-xs .dex-form-item-label {
  line-height: var(--dex-okd-input-xs-height)
}

.dex-form.dex-form-inline .dex-form-item.dex-form-item-xs .dex-form-item-control-input {
  align-items: center;
  display: flex;
  min-height: var(--dex-okd-input-xs-height)
}

.dex-form.dex-form-inline .dex-form-item.dex-form-item-sm .dex-form-item-label {
  line-height: var(--dex-okd-input-sm-height)
}

.dex-form.dex-form-inline .dex-form-item.dex-form-item-sm .dex-form-item-control-input {
  align-items: center;
  display: flex;
  min-height: var(--dex-okd-input-sm-height)
}

.dex-form.dex-form-inline .dex-form-item.dex-form-item-md .dex-form-item-label {
  line-height: var(--dex-okd-input-md-height)
}

.dex-form.dex-form-inline .dex-form-item.dex-form-item-md .dex-form-item-control-input {
  align-items: center;
  display: flex;
  min-height: var(--dex-okd-input-md-height)
}

.dex-form.dex-form-inline .dex-form-item.dex-form-item-lg .dex-form-item-label {
  line-height: var(--dex-okd-input-lg-height)
}

.dex-form.dex-form-inline .dex-form-item.dex-form-item-lg .dex-form-item-control-input {
  align-items: center;
  display: flex;
  min-height: var(--dex-okd-input-lg-height)
}

.dex-form.dex-form-inline .dex-form-item.dex-form-item-xl .dex-form-item-label {
  line-height: var(--dex-okd-input-xl-height)
}

.dex-form.dex-form-inline .dex-form-item.dex-form-item-xl .dex-form-item-control-input {
  align-items: center;
  display: flex;
  min-height: var(--dex-okd-input-xl-height)
}

.dex-icon.icon {
  font-family: var(--ok-icon-font-family) !important
}

.dex-plain-button {
  color: inherit;
  cursor: pointer;
  font: inherit;
  text-align: unset
}

.dex-plain-button:focus-visible {
  border-radius: 4px;
  outline: 2px solid var(--dex-okd-color-border-focus);
  outline-color: var(--dex-okd-color-border-focus);
  outline-offset: 2px;
  outline-style: solid;
  outline-width: 2px
}

.dex-plain-button[disabled] {
  cursor: not-allowed
}

.dex-plain-button-as-div {
  display: block;
  line-height: inherit;
  width: 100%
}

.dex-a11y-text {
  clip: rect(0, 0, 0, 0);
  border-width: 0;
  height: 1px;
  margin: -1px;
  overflow: hidden;
  padding: 0;
  position: absolute;
  white-space: nowrap;
  width: 1px
}

@keyframes loadingLine {
  to {
    left: 100%
  }
}

.dex-loader-line {
  background: var(--dex-okd-loader-line-inactive-color);
  height: var(--dex-okd-loader-line-size);
  overflow: hidden;
  position: relative;
  width: 100%
}

.dex-loader-line,
.dex-loader-line .dex-loader-mark {
  border-radius: calc(var(--dex-okd-loader-line-size)/2)
}

.dex-loader-line .dex-loader-mark {
  background: var(--dex-okd-loader-line-active-color);
  height: 100%
}

.dex-loader-line.dex-loader-loading .dex-loader-mark {
  animation: loadingLine 2s linear infinite;
  left: -25%;
  position: absolute;
  top: 0
}

@keyframes okui-loader-rotation {
  0% {
    transform: rotate(0deg)
  }

  to {
    transform: rotate(1turn)
  }
}

.dex-loader-box {
  position: relative
}

.dex-loader-mask {
  align-items: center;
  background: var(--dex-okd-loader-mask-bg-color);
  display: flex;
  flex-direction: column;
  height: 100%;
  justify-content: center;
  left: 0;
  position: absolute;
  top: 0;
  width: 100%
}

.dex-loader-mask-text {
  color: var(--dex-okd-loader-mask-text-color);
  font-size: var(--dex-okd-loader-mask-text-font-size);
  font-weight: var(--dex-okd-loader-mask-text-font-weight);
  line-height: var(--dex-okd-loader-mask-text-line-height);
  margin-top: var(--dex-okd-loader-mask-text-margin-top)
}

.dex-loader-spin {
  animation: okui-loader-rotation 1s linear infinite;
  background-color: initial;
  border-style: solid;
  box-sizing: border-box;
  display: inline-flex
}

.dex-loader-spin-xl {
  border-radius: var(--dex-okd-loader-circle-xl-size);
  border-width: var(--dex-okd-loader-circle-xl-track-width);
  height: var(--dex-okd-loader-circle-xl-size);
  width: var(--dex-okd-loader-circle-xl-size)
}

.dex-loader-spin-lg {
  border-radius: var(--dex-okd-loader-circle-lg-size);
  border-width: var(--dex-okd-loader-circle-lg-track-width);
  height: var(--dex-okd-loader-circle-lg-size);
  width: var(--dex-okd-loader-circle-lg-size)
}

.dex-loader-spin-md {
  border-radius: var(--dex-okd-loader-circle-md-size);
  border-width: var(--dex-okd-loader-circle-md-track-width);
  height: var(--dex-okd-loader-circle-md-size);
  width: var(--dex-okd-loader-circle-md-size)
}

.dex-loader-spin-sm {
  border-radius: var(--dex-okd-loader-circle-sm-size);
  border-width: var(--dex-okd-loader-circle-sm-track-width);
  height: var(--dex-okd-loader-circle-sm-size);
  width: var(--dex-okd-loader-circle-sm-size)
}

.dex-loader-spin-primary {
  border-color: var(--dex-okd-loader-primary-inactive-color);
  border-top-color: var(--dex-okd-loader-primary-active-color)
}

.dex-loader-spin-neutral {
  border-color: var(--dex-okd-loader-neutral-inactive-color);
  border-top-color: var(--dex-okd-loader-neutral-active-color)
}

.dex-loader-inner-circle {
  border: none;
  border-radius: 0;
  overflow: hidden;
  transform: rotate(180deg)
}

.dex-loader-inner-fill-primary {
  background: var(--dex-okd-loader-primary-active-color)
}

.dex-loader-inner-fill-neutral {
  background: var(--dex-okd-loader-neutral-active-color)
}

.dex-loader-inner-track-primary {
  background: var(--dex-okd-loader-primary-inactive-color)
}

.dex-loader-inner-track-neutral {
  background: var(--dex-okd-loader-neutral-inactive-color)
}

.dex-loader-inner-track-right {
  height: 100%;
  overflow: hidden;
  position: absolute;
  right: 0
}

.dex-loader-inner-track-right-content {
  content: "";
  height: 100%;
  position: absolute;
  transform: rotate(0deg);
  transform-origin: left center;
  width: 100%
}

.dex-loader-inner-track-left {
  height: 100%;
  overflow: hidden;
  position: absolute
}

.dex-loader-inner-track-left-content {
  content: "";
  height: 100%;
  position: absolute;
  transform: rotate(0deg);
  transform-origin: right center;
  width: 100%
}

.dex-loader-inner-xl {
  border-radius: var(--dex-okd-loader-circle-xl-size);
  height: var(--dex-okd-loader-circle-xl-size);
  width: var(--dex-okd-loader-circle-xl-size)
}

.dex-loader-inner-xl-cover {
  background-color: var(--dex-okd-loader-circle-cover-background);
  border-radius: 100%;
  height: calc(var(--dex-okd-loader-circle-xl-size) - var(--dex-okd-loader-circle-xl-track-width)*2);
  left: 50%;
  position: absolute;
  top: 50%;
  transform: translate(-50%, -50%);
  width: calc(var(--dex-okd-loader-circle-xl-size) - var(--dex-okd-loader-circle-xl-track-width)*2)
}

.dex-loader-inner-track-xl {
  width: calc(var(--dex-okd-loader-circle-xl-size)/2)
}

.dex-loader-inner-track-xl-inner-track-left-content {
  border-radius: calc(var(--dex-okd-loader-circle-xl-size)/2) 0 0 calc(var(--dex-okd-loader-circle-xl-size)/2);
  width: 100%
}

.dex-loader-inner-track-xl-inner-track-right-content {
  border-radius: 0 calc(var(--dex-okd-loader-circle-xl-size)/2) calc(var(--dex-okd-loader-circle-xl-size)/2) 0;
  width: 100%
}

.dex-loader-inner-lg {
  border-radius: var(--dex-okd-loader-circle-lg-size);
  height: var(--dex-okd-loader-circle-lg-size);
  width: var(--dex-okd-loader-circle-lg-size)
}

.dex-loader-inner-lg-cover {
  background-color: var(--dex-okd-loader-circle-cover-background);
  border-radius: 100%;
  height: calc(var(--dex-okd-loader-circle-lg-size) - var(--dex-okd-loader-circle-lg-track-width)*2);
  left: 50%;
  position: absolute;
  top: 50%;
  transform: translate(-50%, -50%);
  width: calc(var(--dex-okd-loader-circle-lg-size) - var(--dex-okd-loader-circle-lg-track-width)*2)
}

.dex-loader-inner-track-lg {
  width: calc(var(--dex-okd-loader-circle-lg-size)/2)
}

.dex-loader-inner-track-lg-inner-track-left-content {
  border-radius: calc(var(--dex-okd-loader-circle-lg-size)/2) 0 0 calc(var(--dex-okd-loader-circle-lg-size)/2);
  width: 100%
}

.dex-loader-inner-track-lg-inner-track-right-content {
  border-radius: 0 calc(var(--dex-okd-loader-circle-lg-size)/2) calc(var(--dex-okd-loader-circle-lg-size)/2) 0;
  width: 100%
}

.dex-loader-inner-md {
  border-radius: var(--dex-okd-loader-circle-md-size);
  height: var(--dex-okd-loader-circle-md-size);
  width: var(--dex-okd-loader-circle-md-size)
}

.dex-loader-inner-md-cover {
  background-color: var(--dex-okd-loader-circle-cover-background);
  border-radius: 100%;
  height: calc(var(--dex-okd-loader-circle-md-size) - var(--dex-okd-loader-circle-md-track-width)*2);
  left: 50%;
  position: absolute;
  top: 50%;
  transform: translate(-50%, -50%);
  width: calc(var(--dex-okd-loader-circle-md-size) - var(--dex-okd-loader-circle-md-track-width)*2)
}

.dex-loader-inner-track-md {
  width: calc(var(--dex-okd-loader-circle-md-size)/2)
}

.dex-loader-inner-track-md-inner-track-left-content {
  border-radius: calc(var(--dex-okd-loader-circle-md-size)/2) 0 0 calc(var(--dex-okd-loader-circle-md-size)/2);
  width: 100%
}

.dex-loader-inner-track-md-inner-track-right-content {
  border-radius: 0 calc(var(--dex-okd-loader-circle-md-size)/2) calc(var(--dex-okd-loader-circle-md-size)/2) 0;
  width: 100%
}

.dex-loader-inner-sm {
  border-radius: var(--dex-okd-loader-circle-sm-size);
  height: var(--dex-okd-loader-circle-sm-size);
  width: var(--dex-okd-loader-circle-sm-size)
}

.dex-loader-inner-sm-cover {
  background-color: var(--dex-okd-loader-circle-cover-background);
  border-radius: 100%;
  height: calc(var(--dex-okd-loader-circle-sm-size) - var(--dex-okd-loader-circle-sm-track-width)*2);
  left: 50%;
  position: absolute;
  top: 50%;
  transform: translate(-50%, -50%);
  width: calc(var(--dex-okd-loader-circle-sm-size) - var(--dex-okd-loader-circle-sm-track-width)*2)
}

.dex-loader-inner-track-sm {
  width: calc(var(--dex-okd-loader-circle-sm-size)/2)
}

.dex-loader-inner-track-sm-inner-track-left-content {
  border-radius: calc(var(--dex-okd-loader-circle-sm-size)/2) 0 0 calc(var(--dex-okd-loader-circle-sm-size)/2);
  width: 100%
}

.dex-loader-inner-track-sm-inner-track-right-content {
  border-radius: 0 calc(var(--dex-okd-loader-circle-sm-size)/2) calc(var(--dex-okd-loader-circle-sm-size)/2) 0;
  width: 100%
}

.dex-a11y-button:focus-visible {
  border-radius: 4px;
  outline: 2px solid var(--dex-okd-color-border-focus);
  outline-color: var(--dex-okd-color-border-focus);
  outline-offset: 2px;
  outline-style: solid;
  outline-width: 2px
}

.dex-mask {
  background: rgba(0, 0, 0, .65);
  background: var(--dex-okd-dialog-window-mask-color, rgba(0, 0, 0, .65));
  bottom: 0;
  left: 0;
  position: fixed;
  right: 0;
  top: 0
}

.dex-picture {
  display: inline-block
}

.dex-picture-font {
  font-size: 0;
  line-height: 1
}

.dex-picture-cover {
  object-fit: cover
}

.dex-picture-contain {
  object-fit: contain
}

.dex-empty {
  align-items: center;
  display: flex;
  flex-direction: column;
  width: 100%
}

.dex-empty-img {
  height: var(--dex-okd-empty-img-height);
  margin-bottom: var(--dex-okd-empty-img-margin-bottom);
  width: var(--dex-okd-empty-img-width)
}

.dex-empty-title {
  color: var(--dex-okd-empty-title-color);
  font-size: var(--dex-okd-empty-title-font-size);
  font-weight: 400;
  font-weight: var(--dex-okd-empty-title-font-weight, 400);
  line-height: var(--dex-okd-empty-title-light-height);
  margin-bottom: var(--dex-okd-empty-title-margin-bottom);
  text-align: center
}

.dex-empty-title:last-child {
  margin-bottom: 0
}

.dex-empty-only-title {
  margin-bottom: var(--dex-okd-empty-desc-margin-bottom)
}

.dex-empty-only-title:last-child {
  margin-bottom: 0
}

.dex-empty-description {
  color: var(--dex-okd-empty-desc-color);
  font-size: var(--dex-okd-empty-desc-font-size);
  font-weight: 400;
  font-weight: var(--dex-okd-empty-desc-font-weight, 400);
  line-height: var(--dex-okd-empty-desc-light-height);
  margin-bottom: var(--dex-okd-empty-desc-margin-bottom);
  text-align: center
}

.dex-empty-description:last-child {
  margin-bottom: 0
}

.dex-empty-sm .dex-empty-title {
  font-size: 14px;
  font-size: var(--dex-okd-empty-sm-title-font-size, 14px);
  line-height: 16px;
  line-height: var(--dex-okd-empty-sm-title-line-height, 16px);
  margin-bottom: 4px;
  margin-bottom: var(--dex-okd-empty-sm-title-margin-bottom, 4px)
}

.dex-empty-sm .dex-empty-description {
  font-size: 12px;
  font-size: var(--dex-okd-empty-sm-desc-font-size, 12px);
  line-height: 18px;
  line-height: var(--dex-okd-empty-sm-desc-line-height, 18px)
}

.dex-empty-sm .dex-empty-description,
.dex-empty-sm .dex-empty-only-title {
  margin-bottom: 4px;
  margin-bottom: var(--dex-okd-empty-sm-desc-margin-bottom, 4px)
}

.dex-datepicker-reference {
  position: relative
}

.dex-datepicker-reference-native {
  background: transparent;
  color: transparent;
  height: 100%;
  left: 0;
  outline: none;
  padding-right: 8px;
  position: absolute;
  top: 0;
  width: calc(100% - 42px);
  z-index: 100
}

.dex-datepicker-input-custom-icon {
  color: var(--dex-okd-color-gray-400);
  color: var(--dex-okd-datepicker-input-icon-color, var(--dex-okd-color-gray-400));
  cursor: pointer
}

.dex-datepicker-input-icon-disabled {
  cursor: not-allowed
}

.dex-datepicker .dex-datepicker-input-xs-icon-size {
  font-size: 16px;
  font-size: var(--dex-okd-datepicker-xs-icon-font-size, 16px)
}

.dex-datepicker .dex-datepicker-input-sm-icon-size {
  font-size: 16px;
  font-size: var(--dex-okd-datepicker-sm-icon-font-size, 16px)
}

.dex-datepicker .dex-datepicker-input-md-icon-size {
  font-size: 16px;
  font-size: var(--dex-okd-datepicker-md-icon-font-size, 16px)
}

.dex-datepicker .dex-datepicker-input-lg-icon-size {
  font-size: 18px;
  font-size: var(--dex-okd-datepicker-lg-icon-font-size, 18px)
}

.dex-datepicker .dex-datepicker-input-xl-icon-size {
  font-size: 20px;
  font-size: var(--dex-okd-datepicker-xl-icon-font-size, 20px)
}

.dex-datepicker-header {
  color: var(--dex-okd-datepicker-title-default-color);
  color: var(--dex-okd-datepicker-panel-header-default-text-color, var(--dex-okd-datepicker-title-default-color));
  display: flex;
  font-size: 16px;
  font-weight: 500;
  height: 36px;
  justify-content: space-between;
  line-height: 36px;
  padding: 0 16px
}

.dex-datepicker-header-block {
  align-items: center;
  display: flex;
  font-size: 14px
}

.dex-datepicker-header .text-box {
  border-radius: 4px;
  cursor: pointer;
  padding: 8px
}

.dex-datepicker-header .text-box:hover {
  background-color: var(--dex-okd-color-gray-100);
  background-color: var(--dex-okd-datepicker-panel-header-hover-text-bg-color, var(--dex-okd-color-gray-100))
}

.dex-datepicker-header .header-icon {
  margin-left: 4px;
  transition: transform .2s;
  vertical-align: middle
}

.dex-datepicker-header .arrow-up {
  transform: rotate(180deg)
}

.dex-datepicker-header .display-year {
  align-items: center;
  display: flex;
  margin-left: 8px
}

.dex-datepicker-header .nav-box .nav-icon {
  color: var(--dex-okd-datepicker-icon-default-color);
  color: var(--dex-okd-datepicker-panel-header-default-icon-color, var(--dex-okd-datepicker-icon-default-color));
  font-size: 20px
}

.dex-datepicker-header .nav-box .nav-item {
  align-items: center;
  border-radius: 50%;
  cursor: pointer;
  display: flex;
  height: 32px;
  justify-content: center;
  width: 32px
}

.dex-datepicker-header .nav-box .nav-item:hover {
  background-color: var(--dex-okd-color-gray-100);
  background-color: var(--dex-okd-datepicker-panel-header-hover-icon-bg-color, var(--dex-okd-color-gray-100))
}

.dex-datepicker-header .nav-box .nav-item:last-child {
  margin-left: 4px
}

.dex-datepicker-panel-day {
  color: var(--dex-okd-datepicker-day-default-text-color)
}

.dex-datepicker-panel-day:not(.dex-datepicker-panel-day-disabled):not(.dex-datepicker-panel-day-active):hover .item-inner {
  background-color: var(--dex-okd-datepicker-day-hover-background)
}

.dex-datepicker-panel-day-active:not(.dex-datepicker-panel-day-disable) .item-inner {
  background-color: var(--dex-okd-datepicker-day-selected-background);
  color: var(--dex-okd-datepicker-day-selected-text-color);
  font-weight: 500
}

.dex-datepicker-panel-day-disabled:not(.dex-datepicker-panel-day-notSelectable) {
  background-color: var(--dex-okd-datepicker-day-disable-background);
  color: var(--dex-okd-datepicker-day-disable-text-color);
  cursor: not-allowed
}

.dex-datepicker-panel-day-disabled:not(.dex-datepicker-panel-day-notSelectable) .dex-datepicker-panel-today {
  border-color: var(--dex-okd-datepicker-today-border-disable-color)
}

.dex-datepicker-panel-day-notSelectable {
  cursor: not-allowed
}

.dex-datepicker-panel-month {
  color: var(--dex-okd-datepicker-month-default-text-color)
}

.dex-datepicker-panel-month:not(.dex-datepicker-panel-month-disabled):not(.dex-datepicker-panel-month-active):hover .item-inner {
  background-color: var(--dex-okd-datepicker-month-hover-background)
}

.dex-datepicker-panel-month-active:not(.dex-datepicker-panel-month-disable) .item-inner {
  background-color: var(--dex-okd-datepicker-month-selected-background);
  color: var(--dex-okd-datepicker-month-selected-text-color);
  font-weight: 500
}

.dex-datepicker-panel-month-disabled:not(.dex-datepicker-panel-month-notSelectable) {
  background-color: var(--dex-okd-datepicker-month-disable-background);
  color: var(--dex-okd-datepicker-month-disable-text-color);
  cursor: not-allowed
}

.dex-datepicker-panel-month-disabled:not(.dex-datepicker-panel-month-notSelectable) .dex-datepicker-panel-today {
  border-color: var(--dex-okd-datepicker-today-border-disable-color)
}

.dex-datepicker-panel-month-notSelectable {
  cursor: not-allowed
}

.dex-datepicker-panel-year {
  color: var(--dex-okd-datepicker-year-default-text-color)
}

.dex-datepicker-panel-year:not(.dex-datepicker-panel-year-disabled):not(.dex-datepicker-panel-year-active):hover .item-inner {
  background-color: var(--dex-okd-datepicker-year-hover-background)
}

.dex-datepicker-panel-cover:before {
  background-color: var(--dex-okd-datepicker-day-range-background)
}

.dex-datepicker-panel-year-active:not(.dex-datepicker-panel-year-disable) .item-inner {
  background-color: var(--dex-okd-datepicker-year-selected-background);
  color: var(--dex-okd-datepicker-year-selected-text-color);
  font-weight: 500
}

.dex-datepicker-panel-year-disabled:not(.dex-datepicker-panel-year-notSelectable) {
  background-color: var(--dex-okd-datepicker-year-disable-background);
  color: var(--dex-okd-datepicker-year-disable-text-color);
  cursor: not-allowed
}

.dex-datepicker-panel-year-disabled:not(.dex-datepicker-panel-year-notSelectable) .dex-datepicker-panel-today {
  border-color: var(--dex-okd-datepicker-today-border-disable-color)
}

.dex-datepicker-panel-year-notSelectable {
  cursor: not-allowed
}

.dex-datepicker-panel {
  display: flex;
  flex-direction: column;
  font-size: 14px;
  height: 100%;
  padding: 0 16px 16px;
  width: 100%
}

.dex-datepicker-panel-header {
  border-bottom: 1px solid var(--dex-okd-color-line-muted);
  display: flex;
  height: 36px;
  margin-bottom: 8px
}

.dex-datepicker-panel-footer {
  border-top: 1px solid var(--dex-okd-color-line-muted);
  display: flex;
  justify-content: flex-end;
  padding: 12px 22px
}

.dex-datepicker-panel-footer .confirm-button {
  margin-left: 12px
}

.dex-datepicker-panel-week {
  align-items: center;
  color: var(--dex-okd-datepicker-week-default-text-color);
  display: flex;
  flex: 1 1;
  font-size: 12px;
  justify-content: center;
  text-align: center
}

.dex-datepicker-panel-main {
  cursor: pointer;
  display: flex;
  flex: 1 1;
  flex-direction: column
}

.dex-datepicker-panel-row {
  align-items: center;
  display: flex;
  justify-content: space-between;
  margin-bottom: 4px;
  width: 100%
}

.dex-datepicker-panel-row:last-child {
  margin-bottom: 0
}

.dex-datepicker-panel-row-week:hover .dex-datepicker-panel-day:not(.dex-datepicker-panel-day-disabled):before {
  background-color: var(--dex-okd-datepicker-day-range-background)
}

.dex-datepicker-panel-item {
  flex: 1 1;
  flex-direction: column
}

.dex-datepicker-panel-item,
.dex-datepicker-panel-item .item-inner {
  align-items: center;
  display: flex;
  justify-content: center;
  position: relative
}

.dex-datepicker-panel-item .item-inner {
  border-radius: 50%;
  height: 32px;
  width: 32px;
  z-index: 2
}

.dex-datepicker-panel-item:before {
  content: "";
  height: 100%;
  left: 0;
  position: absolute;
  right: 0;
  top: 50%;
  transform: translateY(-50%);
  z-index: 1
}

.dex-datepicker-panel-item.range-start:before {
  border-radius: 50% 0 0 50%
}

.dex-datepicker-panel-item.range-end:before {
  border-radius: 0 50% 50% 0
}

.dex-datepicker-panel-hidden {
  visibility: hidden
}

.dex-datepicker-panel-today .item-inner {
  background-color: var(--dex-okd-color-gray-050);
  background-color: var(--dex-okd-datepicker-today-bg-color, var(--dex-okd-color-gray-050));
  color: var(--dex-okd-datepicker-today-border-color);
  color: var(--dex-okd-datepicker-today-text-color, var(--dex-okd-datepicker-today-border-color));
  font-weight: 500
}

.dex-datepicker-panel-second {
  color: var(--dex-okd-datepicker-day-second-color);
  font-weight: 400
}

.dex-datepicker-panel-second .dex-datepicker-panel-today {
  border-color: var(--dex-okd-datepicker-today-border-disable-color)
}

.dex-datepicker-panel.no-padding {
  padding: 0
}

.dex-datepicker-panel .picker-scroll-view {
  direction: ltr;
  height: 260px;
  height: var(--dex-okd-datepicker-scroll-container-height, 260px);
  padding: 0;
  padding: var(--dex-okd-datepicker-scroll-container-padding-vertical, 0) var(--dex-okd-datepicker-scroll-container-padding-horizontal, 0)
}

.dex-datepicker-panel .picker-scroll-view .scroll-view-mask {
  background-color: initial;
  background-color: var(--dex-okd-datepicker-scroll-item-active-background, transparent);
  border-bottom: 1px solid #ebebeb;
  border-bottom: 1px solid var(--dex-okd-datepicker-scroll-item-active-border-color, #ebebeb);
  border-radius: 0;
  border-radius: var(--dex-okd-datepicker-scroll-item-active-radius, 0);
  border-top: 1px solid #ebebeb;
  border-top: 1px solid var(--dex-okd-datepicker-scroll-item-active-border-color, #ebebeb);
  height: 36px;
  height: var(--dex-okd-datepicker-scroll-item-default-height, 36px);
  margin: 0;
  margin: 0 var(--dex-okd-datepicker-scroll-container-padding-horizontal, 0)
}

.dex-datepicker-panel .picker-scroll-view .scroll-view-item {
  color: #929292;
  color: var(--dex-okd-datepicker-scroll-item-default-font-color, #929292);
  font-size: 14px;
  font-size: var(--dex-okd-datepicker-scroll-item-default-font-size, 14px);
  font-weight: 400;
  font-weight: var(--dex-okd-datepicker-scroll-item-default-font-weight, 400);
  height: 36px;
  height: var(--dex-okd-datepicker-scroll-item-default-height, 36px);
  line-height: 36px;
  line-height: var(--dex-okd-datepicker-scroll-item-default-height, 36px)
}

.dex-datepicker-panel .picker-scroll-view .scroll-view-item-active {
  color: #000;
  color: var(--dex-okd-datepicker-scroll-item-active-font-color, #000);
  font-size: 16px;
  font-size: var(--dex-okd-datepicker-scroll-item-active-font-size, 16px);
  font-weight: 500;
  font-weight: var(--dex-okd-datepicker-scroll-item-active-font-weight, 500)
}

@media (max-width:767px) {
  .dex-datepicker-panel-footer .confirm-button {
    flex: 1 1
  }

  .dex-datepicker-panel-footer .cancel-button {
    min-width: 100px
  }
}

.dex-datepicker-footer {
  align-items: center;
  border-top: 1px solid var(--dex-okd-datepicker-footer-border-color);
  display: flex;
  font-size: 14px;
  justify-content: space-between;
  padding: 20px
}

.dex-datepicker-footer-clear {
  color: var(--dex-okd-datepicker-footer-button-color);
  cursor: pointer;
  font-weight: 500;
  height: 100%
}

.dex-datepicker-footer-confirm {
  color: var(--dex-okd-datepicker-footer-button-color);
  justify-content: space-between;
  padding: 13px 16px
}

.dex-datepicker-footer-confirm .pc-confirm-button {
  margin-left: 12px
}

.dex-datepicker-footer-confirm-desc {
  font-size: 16px
}

.dex-datepicker-footer-confirm-desc .footer-confirm-desc-selected {
  padding-right: 4px
}

.dex-datepicker-footer-confirm-desc .footer-confirm-desc-to {
  padding: 0 4px
}

.dex-datepicker-footer-confirm-mobile {
  padding: 12px 16px
}

.dex-datepicker-footer-confirm-mobile .confirm-button {
  margin-left: 12px
}

@media (max-width:767px) {
  .dex-datepicker-footer-confirm-mobile .confirm-button {
    flex: 1 1
  }

  .dex-datepicker-footer-confirm-mobile .cancel-button {
    min-width: 100px
  }
}

.dex-datepicker-popup {
  display: flex
}

.dex-datepicker-dialog {
  background-color: var(--dex-okd-datepicker-default-background) !important
}

.dex-datepicker-inner {
  min-width: 284px;
  padding-top: 16px
}

.dex-datepicker-board {
  background: var(--dex-okd-datepicker-default-background);
  display: flex;
  flex-direction: column
}

.dex-datepicker-picker-group {
  display: flex;
  flex-direction: column;
  width: -webkit-min-content;
  width: -moz-min-content;
  width: min-content
}

.dex-datepicker-picker-group .picker-group-box {
  display: flex;
  position: relative
}

.dex-datepicker-picker-group .picker-group-split-line {
  background-color: var(--dex-okd-color-line-muted);
  height: 100%;
  left: 50%;
  position: absolute;
  top: 0;
  width: 1px
}

.dex-datepicker-picker-group .picker-group-shortcut {
  box-sizing: border-box;
  max-width: 568px;
  padding: 0 16px 26px
}

.dex-datepicker-range-mobile-reference {
  padding: 0 16px
}

.dex-datepicker-shortcut-mobile {
  padding: 0 16px;
  padding: var(--dex-okd-datepicker-shortcut-button-container-padding-horizontal, 0) var(--dex-okd-datepicker-shortcut-button-container-padding-vertical, 16px)
}

.dex-datepicker-range-reference {
  cursor: pointer
}

.dex-datepicker-range-reference .custom-clear-icon {
  color: var(--dex-okd-color-gray-400);
  color: var(--dex-okd-datepicker-input-icon-color, var(--dex-okd-color-gray-400));
  cursor: pointer
}

.dex-datepicker-range-reference-input {
  display: flex
}

.dex-datepicker-range-reference-container {
  align-items: center;
  display: flex;
  flex: 1 1;
  height: 100%;
  position: relative
}

.dex-datepicker-range-reference-container .disabled {
  color: var(--dex-okd-input-disabled-text-color);
  cursor: not-allowed
}

.dex-datepicker-range-reference-place {
  opacity: 0;
  position: absolute;
  z-index: -999999
}

.dex-datepicker-range-reference-item {
  align-items: center;
  display: flex;
  height: 100%;
  width: 100%
}

.dex-datepicker-range-reference-item-input {
  border: none;
  caret-color: var(--dex-okd-datepicker-input-caret-color);
  color: var(--dex-okd-datepicker-default-font-color);
  cursor: pointer;
  height: 100%;
  outline: none;
  width: 100%
}

.dex-datepicker-range-reference-item-input::-webkit-input-placeholder {
  color: var(--dex-okd-datepicker-input-placeholder-color)
}

.dex-datepicker-range-reference-item-input:-moz-placeholder {
  color: var(--dex-okd-datepicker-input-placeholder-color);
  opacity: 1
}

.dex-datepicker-range-reference-item-input::-ms-input-placeholder {
  color: var(--dex-okd-datepicker-input-placeholder-color)
}

.dex-datepicker-range-reference-connection.icon-pointer {
  color: var(--dex-okd-datepicker-day-second-color);
  font-size: 20px;
  margin-right: 8px
}

.dex-datepicker-range-reference-focus {
  border-bottom: 2px solid var(--dex-okd-datepicker-input-border-color);
  margin-bottom: -2px
}

.dex-datepicker-range-reference-input-group {
  justify-content: center;
  margin-top: 20px
}

.dex-datepicker-range-reference-input-group .dex-datepicker-range-reference-item-input {
  border-radius: 4px;
  font-size: 14px;
  font-weight: 500;
  height: 36px;
  text-align: center;
  width: 100% !important
}

.dex-datepicker-range-reference-input-group .dex-datepicker-range-reference-connection {
  margin: 0 10px
}

.dex-datepicker-range-reference-input-group .dex-datepicker-range-reference-item {
  border: 1px solid var(--dex-okd-color-gray-200);
  border-radius: 4px
}

.dex-datepicker-range-reference-input-group .dex-datepicker-range-reference-focus {
  border: 1px solid var(--dex-okd-datepicker-input-mobile-border-color, var(--dex-okd-color-fq-blue-lv1));
  margin: 0
}

.dex-datepicker-range-reference-xs {
  font-size: var(--dex-okd-datepicker-xs-range-input-font-size)
}

.dex-datepicker-range-reference-sm {
  font-size: var(--dex-okd-datepicker-sm-range-input-font-size)
}

.dex-datepicker-range-reference-md {
  font-size: var(--dex-okd-datepicker-md-range-input-font-size)
}

.dex-datepicker-range-reference-lg {
  font-size: 16px;
  font-size: var(--dex-okd-datepicker-lg-range-input-font-size, 16px)
}

.dex-datepicker-range-reference-xl {
  font-size: 16px;
  font-size: var(--dex-okd-datepicker-xl-range-input-font-size, 16px)
}

.dex-datepicker-range-board {
  background: #fff;
  background: var(--dex-okd-datepicker-range-board-background-color, #fff)
}

.dex-datepicker-shortcut {
  display: flex;
  flex-direction: row;
  flex-wrap: wrap;
  margin-bottom: -6px;
  margin-top: 12px;
  margin-top: var(--dex-okd-datepicker-shortcut-margin-top, 12px);
  width: 100%
}

.dex-datepicker-shortcut-button {
  align-items: center;
  background-color: var(--dex-okd-color-background-2);
  background-color: var(--dex-okd-datepicker-shortcut-button-bg-color, var(--dex-okd-color-background-2));
  border-radius: 4px;
  color: var(--dex-okd-datepicker-shortcut-text-default-color);
  cursor: pointer;
  display: flex;
  font-size: 12px;
  font-size: var(--dex-okd-datepicker-shortcut-button-font-size, 12px);
  font-weight: 500;
  justify-content: center;
  margin-bottom: 8px;
  margin-right: 8px;
  padding: 8px;
  padding: var(--dex-okd-datepicker-shortcut-button-padding-horizontal, 8px) var(--dex-okd-datepicker-shortcut-button-padding-vertical, 8px)
}

.dex-datepicker-shortcut-active {
  background-color: var(--dex-okd-datepicker-shortcut-active-background);
  color: var(--dex-okd-datepicker-shortcut-text-active-color)
}

.dex-datepicker-dateinput-title {
  color: var(--dex-okd-datepicker-dateinput-title-color);
  font-size: 14px;
  font-weight: 500;
  margin-bottom: 8px
}

.dex-datepicker-dateinput-body {
  align-items: center;
  direction: ltr;
  display: flex;
  justify-content: start
}

.dex-datepicker-dateinput-connector {
  color: var(--dex-okd-datepicker-dateinput-connector-color);
  padding: 0 4px
}

.dex-datepicker-dateinput-input-small {
  width: 48px
}

.dex-datepicker-dateinput-input-large {
  width: 72px
}

.dex-datepicker-dateinput-placeholder {
  color: var(--dex-okd-datepicker-dateinput-placeholder-color);
  font-size: 14px;
  margin-top: 8px
}

.dex-popup {
  display: inline-flex;
  position: relative;
  width: -webkit-fit-content;
  width: -moz-fit-content;
  width: fit-content
}

.dex-popup-layer {
  display: none;
  opacity: 0;
  outline: none;
  position: absolute;
  transition: opacity .3s
}

.dex-popup-layer-visible {
  display: block;
  opacity: 1
}

.dex-popup-layer-arrow-inner {
  border: 1px solid transparent;
  border-radius: 2px;
  box-sizing: border-box;
  display: block;
  height: 100%;
  transform: rotate(45deg);
  transform-origin: center;
  width: 100%
}

.dex-popup-layer.dex-popup-overflow[data-popper-reference-hidden] {
  pointer-events: none;
  visibility: hidden
}

.dex-popup-white-board .dex-popup-layer-arrow-inner,
.dex-popup-white-board-content {
  background-color: var(--dex-okd-popup-white-board-background);
  border: 1px solid rgba(0, 0, 0, .05)
}

.dex-popup-white-board-content {
  border-radius: 4px;
  box-shadow: var(--dex-okd-popup-white-board-shadow)
}

.dex-popup-placement-lg-top {
  padding-bottom: 9px
}

.dex-popup-placement-lg-bottom {
  padding-top: 9px
}

.dex-popup-placement-lg-left {
  padding-right: 9px
}

.dex-popup-placement-lg-right {
  padding-left: 9px
}

.dex-popup-arrow-lg .dex-popup-layer-arrow {
  height: 14px;
  width: 14px
}

.dex-popup-arrow-lg[data-popper-placement*=top] {
  padding: 0 0 9px
}

.dex-popup-arrow-lg[data-popper-placement*=bottom] {
  padding: 9px 0 0
}

.dex-popup-arrow-lg[data-popper-placement*=left] {
  padding: 0 9px 0 0
}

.dex-popup-arrow-lg[data-popper-placement*=right] {
  padding: 0 0 0 9px
}

.dex-popup-arrow-lg[data-popper-placement*=top] .dex-popup-layer-arrow {
  margin-top: -17px;
  top: 100%
}

.dex-popup-arrow-lg[data-popper-placement*=top] .dex-popup-layer-arrow-inner {
  border-left-color: transparent !important;
  border-top-color: transparent !important
}

.dex-popup-arrow-lg[data-popper-placement*=right] .dex-popup-layer-arrow {
  margin-right: -17px;
  right: 100%
}

.dex-popup-arrow-lg[data-popper-placement*=right] .dex-popup-layer-arrow-inner {
  border-right-color: transparent !important;
  border-top-color: transparent !important
}

.dex-popup-arrow-lg[data-popper-placement*=bottom] .dex-popup-layer-arrow {
  bottom: 100%;
  margin-bottom: -17px
}

.dex-popup-arrow-lg[data-popper-placement*=bottom] .dex-popup-layer-arrow-inner {
  border-bottom-color: transparent !important;
  border-right-color: transparent !important
}

.dex-popup-arrow-lg[data-popper-placement*=left] .dex-popup-layer-arrow {
  left: 100%;
  margin-left: -17px
}

.dex-popup-arrow-lg[data-popper-placement*=left] .dex-popup-layer-arrow-inner {
  border-bottom-color: transparent !important;
  border-left-color: transparent !important
}

.dex-popup-placement-md-top {
  padding-bottom: 7px
}

.dex-popup-placement-md-bottom {
  padding-top: 7px
}

.dex-popup-placement-md-left {
  padding-right: 7px
}

.dex-popup-placement-md-right {
  padding-left: 7px
}

.dex-popup-arrow-md .dex-popup-layer-arrow {
  height: 10px;
  width: 10px
}

.dex-popup-arrow-md[data-popper-placement*=top] {
  padding: 0 0 7px
}

.dex-popup-arrow-md[data-popper-placement*=bottom] {
  padding: 7px 0 0
}

.dex-popup-arrow-md[data-popper-placement*=left] {
  padding: 0 7px 0 0
}

.dex-popup-arrow-md[data-popper-placement*=right] {
  padding: 0 0 0 7px
}

.dex-popup-arrow-md[data-popper-placement*=top] .dex-popup-layer-arrow {
  margin-top: -13px;
  top: 100%
}

.dex-popup-arrow-md[data-popper-placement*=top] .dex-popup-layer-arrow-inner {
  border-left-color: transparent !important;
  border-top-color: transparent !important
}

.dex-popup-arrow-md[data-popper-placement*=right] .dex-popup-layer-arrow {
  margin-right: -13px;
  right: 100%
}

.dex-popup-arrow-md[data-popper-placement*=right] .dex-popup-layer-arrow-inner {
  border-right-color: transparent !important;
  border-top-color: transparent !important
}

.dex-popup-arrow-md[data-popper-placement*=bottom] .dex-popup-layer-arrow {
  bottom: 100%;
  margin-bottom: -13px
}

.dex-popup-arrow-md[data-popper-placement*=bottom] .dex-popup-layer-arrow-inner {
  border-bottom-color: transparent !important;
  border-right-color: transparent !important
}

.dex-popup-arrow-md[data-popper-placement*=left] .dex-popup-layer-arrow {
  left: 100%;
  margin-left: -13px
}

.dex-popup-arrow-md[data-popper-placement*=left] .dex-popup-layer-arrow-inner {
  border-bottom-color: transparent !important;
  border-left-color: transparent !important
}

.dex-checkbox-wrapper-indeterminate .dex-checkbox-inner {
  background-color: var(--dex-okd-checkbox-selected-background);
  border-color: var(--dex-okd-checkbox-selected-border-color)
}

.dex-checkbox-wrapper-indeterminate .dex-checkbox-inner:after {
  background-color: var(--dex-okd-checkbox-selected-inner-color);
  box-sizing: border-box;
  content: " ";
  height: 2px;
  left: 50%;
  position: absolute;
  top: 50%;
  transform: translate(-50%, -50%);
  transition: transform .2s cubic-bezier(.12, .4, .29, 1.46) .1s;
  width: 10px
}

.dex-checkbox-wrapper.dex-checkbox-circular .dex-checkbox-inner,
.dex-checkbox-wrapper.dex-checkbox-circular .dex-checkbox-input {
  border-radius: 50px
}

.dex-checkbox-inner {
  background-color: var(--dex-okd-checkbox-default-background);
  border: 1px solid var(--dex-okd-checkbox-default-border-color);
  border-radius: var(--dex-okd-checkbox-common-border-radius);
  box-shadow: var(--dex-okd-checkbox-default-shadow);
  box-sizing: border-box;
  cursor: pointer;
  direction: ltr;
  display: block;
  height: 12px;
  left: 0;
  position: relative;
  top: 0;
  width: 12px
}

.dex-checkbox-input {
  cursor: pointer;
  height: 100%;
  left: 0;
  margin: 0;
  opacity: 0;
  position: absolute;
  width: 100%;
  z-index: 1
}

.dex-checkbox-input:focus-visible {
  border-radius: var(--dex-okd-checkbox-common-border-radius);
  opacity: 1;
  outline: 2px solid var(--dex-okd-color-border-focus);
  outline-color: var(--dex-okd-color-border-focus);
  outline-offset: 2px;
  outline-style: solid;
  outline-width: 2px
}

.dex-checkbox-children {
  cursor: pointer;
  display: inline-block;
  font-size: var(--dex-okd-checkbox-common-label-font-size);
  margin-left: 4px;
  vertical-align: top;
  white-space: normal;
  word-break: break-word
}

.dex-checkbox-wrapper {
  cursor: pointer;
  display: inline-block;
  font-size: 0;
  margin-right: 8px;
  -webkit-user-select: none;
  -moz-user-select: none;
  -ms-user-select: none;
  user-select: none;
  white-space: nowrap
}

.dex-checkbox-wrapper .dex-checkbox-children {
  color: var(--dex-okd-checkbox-default-text-color)
}

.dex-checkbox-wrapper .dex-checkbox {
  cursor: pointer;
  display: inline-block;
  margin-top: 2px;
  position: relative;
  vertical-align: top
}

.dex-checkbox-wrapper.hover-status .dex-checkbox-inner {
  border-color: var(--dex-okd-checkbox-default-hover-border-color);
  box-shadow: var(--dex-okd-checkbox-default-hover-shadow)
}

.dex-checkbox-wrapper-checked .dex-checkbox-children {
  color: var(--dex-okd-checkbox-selected-text-color)
}

.dex-checkbox-wrapper-checked .dex-checkbox-inner {
  background-color: var(--dex-okd-checkbox-selected-background);
  border-color: var(--dex-okd-checkbox-selected-border-color);
  box-shadow: var(--dex-okd-checkbox-selected-shadow)
}

.dex-checkbox-wrapper-checked .dex-checkbox-inner:after {
  background-color: initial;
  border: 2px solid var(--dex-okd-checkbox-selected-inner-color);
  border-left: 0;
  border-top: 0;
  box-sizing: border-box;
  content: " ";
  height: 8px;
  left: 50%;
  position: absolute;
  top: calc(50% - 1px);
  transform: translate(-50%, -50%) rotate(45deg);
  transition: transform .2s cubic-bezier(.12, .4, .29, 1.46) .1s;
  width: 5px
}

.dex-checkbox-wrapper-checked.hover-status .dex-checkbox-inner {
  border-color: var(--dex-okd-checkbox-selected-hover-border-color);
  box-shadow: var(--dex-okd-checkbox-selected-hover-shadow)
}

.dex-checkbox-wrapper-error .dex-checkbox-children {
  color: var(--dex-okd-checkbox-error-text-color)
}

.dex-checkbox-wrapper-error .dex-checkbox-inner {
  border-color: var(--dex-okd-checkbox-error-border-color);
  box-shadow: var(--dex-okd-checkbox-error-shadow)
}

.dex-checkbox-wrapper-error.hover-status .dex-checkbox-inner {
  border-color: var(--dex-okd-checkbox-error-hover-border-color);
  box-shadow: var(--dex-okd-checkbox-error-hover-shadow)
}

.dex-checkbox-wrapper-error.dex-checkbox-wrapper-checked .dex-checkbox-inner {
  background-color: var(--dex-okd-checkbox-error-background);
  border-color: var(--dex-okd-checkbox-error-border-color)
}

.dex-checkbox-wrapper-error.dex-checkbox-wrapper-checked .dex-checkbox-inner:after {
  border-color: var(--dex-okd-checkbox-error-inner-color)
}

.dex-checkbox-wrapper-disabled {
  cursor: not-allowed
}

.dex-checkbox-wrapper-disabled .dex-checkbox-children {
  color: var(--dex-okd-checkbox-disabled-text-color);
  cursor: not-allowed
}

.dex-checkbox-wrapper-disabled .dex-checkbox,
.dex-checkbox-wrapper-disabled .dex-checkbox .dex-checkbox-input {
  cursor: default
}

.dex-checkbox-wrapper-disabled .dex-checkbox .dex-checkbox-inner {
  background-color: var(--dex-okd-checkbox-disabled-background);
  border-color: var(--dex-okd-checkbox-disabled-border-color);
  cursor: default
}

.dex-checkbox-wrapper-disabled.hover-status .dex-checkbox-inner {
  border-color: var(--dex-okd-checkbox-disabled-hover-border-color);
  box-shadow: unset
}

.dex-checkbox-wrapper-disabled.dex-checkbox-wrapper-checked .dex-checkbox-inner {
  background-color: var(--dex-okd-checkbox-disabled-background);
  border-color: var(--dex-okd-checkbox-disabled-border-color)
}

.dex-checkbox-wrapper-disabled.dex-checkbox-wrapper-checked .dex-checkbox-inner:after {
  border-color: var(--dex-okd-checkbox-disabled-inner-color)
}

.dex-checkbox-wrapper-disabled.dex-checkbox-wrapper-indeterminate .dex-checkbox-inner {
  background-color: var(--dex-okd-checkbox-disabled-background);
  border-color: var(--dex-okd-checkbox-disabled-border-color)
}

.dex-checkbox-wrapper-disabled.dex-checkbox-wrapper-indeterminate .dex-checkbox-inner:after {
  background-color: var(--dex-okd-checkbox-disabled-inner-color)
}

.dex-checkbox-sm .dex-checkbox-inner {
  border-radius: 2px;
  border-radius: var(--dex-okd-checkbox-sm-border-radius, 2px);
  height: var(--dex-okd-checkbox-sm-height);
  width: var(--dex-okd-checkbox-sm-width)
}

.dex-checkbox-sm .dex-checkbox-children {
  font-size: var(--dex-okd-checkbox-sm-font-size);
  margin-left: var(--dex-okd-checkbox-sm-margin)
}

.dex-checkbox-sm.dex-checkbox-wrapper {
  line-height: var(--dex-okd-checkbox-sm-line-height);
  padding-bottom: var(--dex-okd-checkbox-sm-padding);
  padding-top: var(--dex-okd-checkbox-sm-padding)
}

.dex-checkbox-md .dex-checkbox-inner {
  border-radius: 4px;
  border-radius: var(--dex-okd-checkbox-md-border-radius, 4px);
  height: var(--dex-okd-checkbox-md-height);
  width: var(--dex-okd-checkbox-md-width)
}

.dex-checkbox-md .dex-checkbox-children {
  font-size: var(--dex-okd-checkbox-md-font-size);
  margin-left: var(--dex-okd-checkbox-md-margin)
}

.dex-checkbox-md.dex-checkbox-wrapper {
  line-height: var(--dex-okd-checkbox-md-line-height);
  padding-bottom: var(--dex-okd-checkbox-md-padding);
  padding-top: var(--dex-okd-checkbox-md-padding)
}

@media (min-width:768px) {

  .dex-checkbox-wrapper-disabled.dex-checkbox-wrapper-checked:hover .dex-checkbox-inner,
  .dex-checkbox-wrapper-disabled:hover .dex-checkbox-inner {
    border-color: var(--dex-okd-checkbox-disabled-hover-border-color);
    box-shadow: unset
  }

  .dex-checkbox-wrapper:not(.dex-checkbox-wrapper-disabled):hover .dex-checkbox-inner {
    border-color: var(--dex-okd-checkbox-default-hover-border-color);
    box-shadow: var(--dex-okd-checkbox-default-hover-shadow)
  }

  .dex-checkbox-wrapper-checked:not(.dex-checkbox-wrapper-disabled):hover .dex-checkbox-inner {
    border-color: var(--dex-okd-checkbox-selected-hover-border-color);
    box-shadow: var(--dex-okd-checkbox-selected-hover-shadow)
  }

  .dex-checkbox-wrapper-error:not(.dex-checkbox-wrapper-disabled):hover .dex-checkbox-inner {
    border-color: var(--dex-okd-checkbox-error-hover-border-color);
    box-shadow: var(--dex-okd-checkbox-error-hover-shadow)
  }
}

.dex-checkbox-reversed.dex-checkbox-wrapper-indeterminate .dex-checkbox-inner {
  background-color: var(--dex-okd-checkbox-reversed-selected-background);
  border-color: var(--dex-okd-checkbox-reversed-selected-border-color)
}

.dex-checkbox-reversed.dex-checkbox-wrapper-indeterminate .dex-checkbox-inner:after {
  background-color: var(--dex-okd-checkbox-reversed-selected-inner-color)
}

.dex-checkbox-reversed .dex-checkbox-inner {
  background-color: var(--dex-okd-checkbox-reversed-default-background);
  border-color: var(--dex-okd-checkbox-reversed-default-border-color);
  box-shadow: var(--dex-okd-checkbox-reversed-default-shadow)
}

.dex-checkbox-reversed.dex-checkbox-wrapper .dex-checkbox-children {
  color: var(--dex-okd-checkbox-reversed-default-text-color)
}

.dex-checkbox-reversed.dex-checkbox-wrapper.hover-status .dex-checkbox-inner,
.dex-checkbox-reversed.dex-checkbox-wrapper:hover .dex-checkbox-inner {
  border-color: var(--dex-okd-checkbox-reversed-default-hover-border-color);
  box-shadow: var(--dex-okd-checkbox-reversed-default-hover-shadow)
}

.dex-checkbox-reversed.dex-checkbox-wrapper-checked .dex-checkbox-children {
  color: var(--dex-okd-checkbox-reversed-selected-text-color)
}

.dex-checkbox-reversed.dex-checkbox-wrapper-checked .dex-checkbox-inner {
  background-color: var(--dex-okd-checkbox-reversed-selected-background);
  border-color: var(--dex-okd-checkbox-reversed-selected-border-color);
  box-shadow: var(--dex-okd-checkbox-reversed-selected-shadow)
}

.dex-checkbox-reversed.dex-checkbox-wrapper-checked .dex-checkbox-inner:after {
  border-color: var(--dex-okd-checkbox-reversed-selected-inner-color)
}

.dex-checkbox-reversed.dex-checkbox-wrapper-checked.hover-status .dex-checkbox-inner,
.dex-checkbox-reversed.dex-checkbox-wrapper-checked:hover .dex-checkbox-inner {
  border-color: var(--dex-okd-checkbox-reversed-selected-hover-border-color);
  box-shadow: var(--dex-okd-checkbox-reversed-selected-hover-shadow)
}

.dex-checkbox-reversed.dex-checkbox-wrapper-error .dex-checkbox-children {
  color: var(--dex-okd-checkbox-reversed-error-text-color)
}

.dex-checkbox-reversed.dex-checkbox-wrapper-error .dex-checkbox-inner {
  border-color: var(--dex-okd-checkbox-reversed-error-border-color);
  box-shadow: var(--dex-okd-checkbox-reversed-error-shadow)
}

.dex-checkbox-reversed.dex-checkbox-wrapper-error.hover-status .dex-checkbox-inner,
.dex-checkbox-reversed.dex-checkbox-wrapper-error:hover .dex-checkbox-inner {
  border-color: var(--dex-okd-checkbox-reversed-error-hover-border-color);
  box-shadow: var(--dex-okd-checkbox-reversed-error-hover-shadow)
}

.dex-checkbox-reversed.dex-checkbox-wrapper-error.dex-checkbox-wrapper-checked .dex-checkbox-inner {
  background-color: var(--dex-okd-checkbox-reversed-error-background);
  border-color: var(--dex-okd-checkbox-reversed-error-border-color)
}

.dex-checkbox-reversed.dex-checkbox-wrapper-error.dex-checkbox-wrapper-checked .dex-checkbox-inner:after {
  border-color: var(--dex-okd-checkbox-reversed-error-inner-color)
}

.dex-checkbox-reversed.dex-checkbox-wrapper-disabled .dex-checkbox-children {
  color: var(--dex-okd-checkbox-reversed-disabled-text-color)
}

.dex-checkbox-reversed.dex-checkbox-wrapper-disabled .dex-checkbox .dex-checkbox-inner {
  background-color: var(--dex-okd-checkbox-reversed-disabled-background);
  border-color: var(--dex-okd-checkbox-reversed-disabled-border-color)
}

.dex-checkbox-reversed.dex-checkbox-wrapper-disabled.hover-status .dex-checkbox-inner,
.dex-checkbox-reversed.dex-checkbox-wrapper-disabled:hover .dex-checkbox-inner {
  border-color: var(--dex-okd-checkbox-reversed-disabled-hover-border-color)
}

.dex-checkbox-reversed.dex-checkbox-wrapper-disabled.dex-checkbox-wrapper-checked .dex-checkbox-inner {
  background-color: var(--dex-okd-checkbox-reversed-disabled-background);
  border-color: var(--dex-okd-checkbox-reversed-disabled-border-color)
}

.dex-checkbox-reversed.dex-checkbox-wrapper-disabled.dex-checkbox-wrapper-checked .dex-checkbox-inner:after {
  border-color: var(--dex-okd-checkbox-reversed-disabled-inner-color)
}

.dex-checkbox-circle {
  align-items: center;
  background-color: initial;
  background-color: var(--dex-okd-checkbox-circle-default-background-color, transparent);
  border: 1px solid #dbdbdb;
  border: 1px solid var(--dex-okd-checkbox-circle-default-border-color, #dbdbdb);
  border-radius: 100%;
  cursor: pointer;
  display: inline-block;
  height: 18px;
  justify-content: center;
  overflow: hidden;
  position: relative;
  width: 18px
}

.dex-checkbox-circle:after {
  background-color: initial;
  border: 2px solid #fff;
  border: 2px solid var(--dex-okd-checkbox-circle-inner-color, #fff);
  border-left: 0;
  border-top: 0;
  box-sizing: border-box;
  content: " ";
  display: none;
  height: 8px;
  left: 50%;
  position: absolute;
  top: calc(50% - 1px);
  transform: translate(-50%, -50%) rotate(45deg);
  transition: transform .2s cubic-bezier(.12, .4, .29, 1.46) .1s;
  width: 5px
}

.dex-checkbox-circle-checked {
  background-color: #000;
  background-color: var(--dex-okd-checkbox-circle-checked-background-color, #000);
  border-color: #000;
  border-color: var(--dex-okd-checkbox-circle-checked-border-color, #000)
}

.dex-checkbox-circle-checked .dex-checkbox-circle-icon {
  visibility: visible
}

.dex-checkbox-circle-checked:after {
  display: block
}

.dex-checkbox-circle-disabled {
  background-color: #f9f9f9;
  background-color: var(--dex-okd-checkbox-circle-default-disabled-background-color, #f9f9f9);
  border-color: #ebebeb;
  border-color: var(--dex-okd-checkbox-circle-default-disabled-border-color, #ebebeb);
  cursor: not-allowed
}

.dex-checkbox-circle-disabled.dex-checkbox-circle-checked {
  background-color: #bdbdbd;
  background-color: var(--dex-okd-checkbox-circle-checked-disabled-background-color, #bdbdbd);
  border-color: #bdbdbd;
  border-color: var(--dex-okd-checkbox-circle-checked-disabled-border-color, #bdbdbd)
}

.dex-btn .btn-content {
  align-items: center;
  display: flex
}

.dex-btn .dex-btn-ellipsis {
  display: block;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  width: 100%
}

.dex-btn.loading .btn-content {
  opacity: 0
}

.dex-btn.loading .btn-content-position {
  display: none
}

.dex-btn.loading .dex-btn-loader {
  line-height: 0;
  position: absolute
}

.dex-btn.loading .btn-loader-position-absolute {
  position: relative
}

.dex-btn-loader-container {
  height: 100%;
  position: relative
}

.dex-btn .btn-icon+.btn-content {
  margin-left: 4px
}

.dex-btn.btn-xxs .btn-icon {
  font-size: var(--dex-okd-button-xxs-icon-size)
}

.dex-btn.btn-xxs .btn-icon-leading {
  margin-right: var(--dex-okd-button-xxs-icon-margin)
}

.dex-btn.btn-xxs .btn-icon-tailing {
  margin-left: var(--dex-okd-button-xxs-icon-margin)
}

.dex-btn.btn-xxs .dex-btn-loader-size {
  border-radius: var(--dex-okd-button-xxs-loader-size);
  height: var(--dex-okd-button-xxs-loader-size);
  width: var(--dex-okd-button-xxs-loader-size)
}

.dex-btn.btn-xs .btn-icon {
  font-size: var(--dex-okd-button-xs-icon-size)
}

.dex-btn.btn-xs .btn-icon-leading {
  margin-right: var(--dex-okd-button-xs-icon-margin)
}

.dex-btn.btn-xs .btn-icon-tailing {
  margin-left: var(--dex-okd-button-xs-icon-margin)
}

.dex-btn.btn-xs .dex-btn-loader-size {
  border-radius: var(--dex-okd-button-xs-loader-size);
  height: var(--dex-okd-button-xs-loader-size);
  width: var(--dex-okd-button-xs-loader-size)
}

.dex-btn.btn-s .btn-icon {
  font-size: var(--dex-okd-button-s-icon-size)
}

.dex-btn.btn-s .btn-icon-leading {
  margin-right: var(--dex-okd-button-s-icon-margin)
}

.dex-btn.btn-s .btn-icon-tailing {
  margin-left: var(--dex-okd-button-s-icon-margin)
}

.dex-btn.btn-s .dex-btn-loader-size {
  border-radius: var(--dex-okd-button-s-loader-size);
  height: var(--dex-okd-button-s-loader-size);
  width: var(--dex-okd-button-s-loader-size)
}

.dex-btn.btn-sm .btn-icon {
  font-size: var(--dex-okd-button-sm-icon-size)
}

.dex-btn.btn-sm .btn-icon-leading {
  margin-right: var(--dex-okd-button-sm-icon-margin)
}

.dex-btn.btn-sm .btn-icon-tailing {
  margin-left: var(--dex-okd-button-sm-icon-margin)
}

.dex-btn.btn-sm .dex-btn-loader-size {
  border-radius: var(--dex-okd-button-sm-loader-size);
  height: var(--dex-okd-button-sm-loader-size);
  width: var(--dex-okd-button-sm-loader-size)
}

.dex-btn.btn-md .btn-icon {
  font-size: var(--dex-okd-button-md-icon-size)
}

.dex-btn.btn-md .btn-icon-leading {
  margin-right: var(--dex-okd-button-md-icon-margin)
}

.dex-btn.btn-md .btn-icon-tailing {
  margin-left: var(--dex-okd-button-md-icon-margin)
}

.dex-btn.btn-md .dex-btn-loader-size {
  border-radius: var(--dex-okd-button-md-loader-size);
  height: var(--dex-okd-button-md-loader-size);
  width: var(--dex-okd-button-md-loader-size)
}

.dex-btn.btn-lg .btn-icon {
  font-size: var(--dex-okd-button-lg-icon-size)
}

.dex-btn.btn-lg .btn-icon-leading {
  margin-right: var(--dex-okd-button-lg-icon-margin)
}

.dex-btn.btn-lg .btn-icon-tailing {
  margin-left: var(--dex-okd-button-lg-icon-margin)
}

.dex-btn.btn-lg .dex-btn-loader-size {
  border-radius: var(--dex-okd-button-lg-loader-size);
  height: var(--dex-okd-button-lg-loader-size);
  width: var(--dex-okd-button-lg-loader-size)
}

.dex-btn.btn-xl .btn-icon {
  font-size: var(--dex-okd-button-xl-icon-size)
}

.dex-btn.btn-xl .btn-icon-leading {
  margin-right: var(--dex-okd-button-xl-icon-margin)
}

.dex-btn.btn-xl .btn-icon-tailing {
  margin-left: var(--dex-okd-button-xl-icon-margin)
}

.dex-btn.btn-xl .dex-btn-loader-size {
  border-radius: var(--dex-okd-button-xl-loader-size);
  height: var(--dex-okd-button-xl-loader-size);
  width: var(--dex-okd-button-xl-loader-size)
}

.dex-btn .dex-btn-outline-primary-loader {
  border-color: var(--dex-okd-button-outline-primary-loader-track-color);
  border-top-color: var(--dex-okd-button-outline-primary-loader-mark-color)
}

.dex-btn {
  -webkit-tap-highlight-color: transparent;
  align-items: center;
  -webkit-appearance: none;
  box-sizing: border-box;
  cursor: pointer;
  display: inline-flex;
  font-family: inherit;
  font-weight: 500;
  justify-content: center;
  outline: none;
  position: relative;
  text-decoration: none;
  touch-action: manipulation;
  -webkit-user-select: none;
  -moz-user-select: none;
  -ms-user-select: none;
  user-select: none
}

.dex-btn:focus-visible {
  outline: 2px solid var(--dex-okd-color-border-focus);
  outline-color: var(--dex-okd-color-border-focus);
  outline-offset: 2px;
  outline-style: solid;
  outline-width: 2px
}

.dex-btn.btn-outline-primary {
  background: var(--dex-okd-button-outline-primary-default-background);
  border-color: var(--dex-okd-button-outline-primary-default-border-color);
  border-style: solid;
  border-width: var(--dex-okd-button-outline-primary-border-size);
  box-shadow: var(--dex-okd-button-outline-primary-default-shadow);
  color: var(--dex-okd-button-outline-primary-default-font-color)
}

.dex-btn.btn-outline-primary.hover,
.dex-btn.btn-outline-primary:not(:disabled):not(.btn-disabled):not(.mobile):hover {
  background: var(--dex-okd-button-outline-primary-hover-background);
  border-color: var(--dex-okd-button-outline-primary-hover-border-color);
  box-shadow: var(--dex-okd-button-outline-primary-hover-shadow);
  color: var(--dex-okd-button-outline-primary-hover-font-color)
}

.dex-btn.btn-outline-primary.hover .btn-icon,
.dex-btn.btn-outline-primary:not(:disabled):not(.btn-disabled):not(.mobile):hover .btn-icon {
  color: var(--dex-okd-button-outline-primary-hover-icon-color)
}

.dex-btn.btn-outline-primary.active,
.dex-btn.btn-outline-primary:not(:disabled):active {
  background: var(--dex-okd-button-outline-primary-active-background);
  border-color: var(--dex-okd-button-outline-primary-active-border-color);
  box-shadow: var(--dex-okd-button-outline-primary-active-shadow);
  color: var(--dex-okd-button-outline-primary-active-font-color)
}

.dex-btn.btn-outline-primary.active .btn-icon,
.dex-btn.btn-outline-primary:not(:disabled):active .btn-icon {
  color: var(--dex-okd-button-outline-primary-active-icon-color)
}

.dex-btn.btn-outline-primary:not(.loading).btn-disabled,
.dex-btn.btn-outline-primary:not(.loading):disabled {
  background: var(--dex-okd-button-outline-primary-disabled-background);
  border-color: var(--dex-okd-button-outline-primary-disabled-border-color);
  box-shadow: var(--dex-okd-button-outline-primary-disabled-shadow);
  color: var(--dex-okd-button-outline-primary-disabled-font-color)
}

.dex-btn.btn-outline-primary:not(.loading).btn-disabled .btn-icon,
.dex-btn.btn-outline-primary:not(.loading):disabled .btn-icon {
  color: var(--dex-okd-button-outline-primary-disabled-icon-color)
}

.dex-btn.btn-outline-primary.loading {
  cursor: pointer
}

.dex-btn.btn-outline-primary .btn-icon {
  color: var(--dex-okd-button-outline-primary-default-icon-color)
}

.dex-btn.btn-outline-primary .dex-btn-loader-text {
  color: var(--dex-okd-button-outline-primary-default-font-color)
}

.dex-btn.btn-outline-primary.btn-xxs {
  padding: calc(var(--dex-okd-button-xxs-padding-vertical) + 1px - var(--dex-okd-button-outline-primary-border-size)) var(--dex-okd-button-xxs-padding-horizontal)
}

.dex-btn.btn-outline-primary.btn-xxs.dex-btn-strict-circle {
  border-radius: 100px;
  height: calc(var(--dex-okd-button-xxs-padding-vertical)*2 + 2px - var(--dex-okd-button-outline-primary-border-size)*2 + var(--dex-okd-button-xxs-line-height) + var(--dex-okd-button-outline-primary-border-size)*2);
  min-width: 0;
  overflow: hidden;
  padding: 0;
  width: calc(var(--dex-okd-button-xxs-padding-vertical)*2 + 2px - var(--dex-okd-button-outline-primary-border-size)*2 + var(--dex-okd-button-xxs-line-height) + var(--dex-okd-button-outline-primary-border-size)*2)
}

.dex-btn.btn-outline-primary.btn-xxs.dex-btn-strict-circle .btn-content {
  display: block;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  width: 100%
}

.dex-btn.btn-outline-primary.btn-xs {
  padding: calc(var(--dex-okd-button-xs-padding-vertical) + 1px - var(--dex-okd-button-outline-primary-border-size)) var(--dex-okd-button-xs-padding-horizontal)
}

.dex-btn.btn-outline-primary.btn-xs.dex-btn-strict-circle {
  border-radius: 100px;
  height: calc(var(--dex-okd-button-xs-padding-vertical)*2 + 2px - var(--dex-okd-button-outline-primary-border-size)*2 + var(--dex-okd-button-xs-line-height) + var(--dex-okd-button-outline-primary-border-size)*2);
  min-width: 0;
  overflow: hidden;
  padding: 0;
  width: calc(var(--dex-okd-button-xs-padding-vertical)*2 + 2px - var(--dex-okd-button-outline-primary-border-size)*2 + var(--dex-okd-button-xs-line-height) + var(--dex-okd-button-outline-primary-border-size)*2)
}

.dex-btn.btn-outline-primary.btn-xs.dex-btn-strict-circle .btn-content {
  display: block;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  width: 100%
}

.dex-btn.btn-outline-primary.btn-s {
  padding: calc(var(--dex-okd-button-s-padding-vertical) + 1px - var(--dex-okd-button-outline-primary-border-size)) var(--dex-okd-button-s-padding-horizontal)
}

.dex-btn.btn-outline-primary.btn-s.dex-btn-strict-circle {
  border-radius: 100px;
  height: calc(var(--dex-okd-button-s-padding-vertical)*2 + 2px - var(--dex-okd-button-outline-primary-border-size)*2 + var(--dex-okd-button-s-line-height) + var(--dex-okd-button-outline-primary-border-size)*2);
  min-width: 0;
  overflow: hidden;
  padding: 0;
  width: calc(var(--dex-okd-button-s-padding-vertical)*2 + 2px - var(--dex-okd-button-outline-primary-border-size)*2 + var(--dex-okd-button-s-line-height) + var(--dex-okd-button-outline-primary-border-size)*2)
}

.dex-btn.btn-outline-primary.btn-s.dex-btn-strict-circle .btn-content {
  display: block;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  width: 100%
}

.dex-btn.btn-outline-primary.btn-sm {
  padding: calc(var(--dex-okd-button-sm-padding-vertical) + 1px - var(--dex-okd-button-outline-primary-border-size)) var(--dex-okd-button-sm-padding-horizontal)
}

.dex-btn.btn-outline-primary.btn-sm.dex-btn-strict-circle {
  border-radius: 100px;
  height: calc(var(--dex-okd-button-sm-padding-vertical)*2 + 2px - var(--dex-okd-button-outline-primary-border-size)*2 + var(--dex-okd-button-sm-line-height) + var(--dex-okd-button-outline-primary-border-size)*2);
  min-width: 0;
  overflow: hidden;
  padding: 0;
  width: calc(var(--dex-okd-button-sm-padding-vertical)*2 + 2px - var(--dex-okd-button-outline-primary-border-size)*2 + var(--dex-okd-button-sm-line-height) + var(--dex-okd-button-outline-primary-border-size)*2)
}

.dex-btn.btn-outline-primary.btn-sm.dex-btn-strict-circle .btn-content {
  display: block;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  width: 100%
}

.dex-btn.btn-outline-primary.btn-md {
  padding: calc(var(--dex-okd-button-md-padding-vertical) + 1px - var(--dex-okd-button-outline-primary-border-size)) var(--dex-okd-button-md-padding-horizontal)
}

.dex-btn.btn-outline-primary.btn-md.dex-btn-strict-circle {
  border-radius: 100px;
  height: calc(var(--dex-okd-button-md-padding-vertical)*2 + 2px - var(--dex-okd-button-outline-primary-border-size)*2 + var(--dex-okd-button-md-line-height) + var(--dex-okd-button-outline-primary-border-size)*2);
  min-width: 0;
  overflow: hidden;
  padding: 0;
  width: calc(var(--dex-okd-button-md-padding-vertical)*2 + 2px - var(--dex-okd-button-outline-primary-border-size)*2 + var(--dex-okd-button-md-line-height) + var(--dex-okd-button-outline-primary-border-size)*2)
}

.dex-btn.btn-outline-primary.btn-md.dex-btn-strict-circle .btn-content {
  display: block;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  width: 100%
}

.dex-btn.btn-outline-primary.btn-lg {
  padding: calc(var(--dex-okd-button-lg-padding-vertical) + 1px - var(--dex-okd-button-outline-primary-border-size)) var(--dex-okd-button-lg-padding-horizontal)
}

.dex-btn.btn-outline-primary.btn-lg.dex-btn-strict-circle {
  border-radius: 100px;
  height: calc(var(--dex-okd-button-lg-padding-vertical)*2 + 2px - var(--dex-okd-button-outline-primary-border-size)*2 + var(--dex-okd-button-lg-line-height) + var(--dex-okd-button-outline-primary-border-size)*2);
  min-width: 0;
  overflow: hidden;
  padding: 0;
  width: calc(var(--dex-okd-button-lg-padding-vertical)*2 + 2px - var(--dex-okd-button-outline-primary-border-size)*2 + var(--dex-okd-button-lg-line-height) + var(--dex-okd-button-outline-primary-border-size)*2)
}

.dex-btn.btn-outline-primary.btn-lg.dex-btn-strict-circle .btn-content {
  display: block;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  width: 100%
}

.dex-btn.btn-outline-primary.btn-xl {
  padding: calc(var(--dex-okd-button-xl-padding-vertical) + 1px - var(--dex-okd-button-outline-primary-border-size)) var(--dex-okd-button-xl-padding-horizontal)
}

.dex-btn.btn-outline-primary.btn-xl.dex-btn-strict-circle {
  border-radius: 100px;
  height: calc(var(--dex-okd-button-xl-padding-vertical)*2 + 2px - var(--dex-okd-button-outline-primary-border-size)*2 + var(--dex-okd-button-xl-line-height) + var(--dex-okd-button-outline-primary-border-size)*2);
  min-width: 0;
  overflow: hidden;
  padding: 0;
  width: calc(var(--dex-okd-button-xl-padding-vertical)*2 + 2px - var(--dex-okd-button-outline-primary-border-size)*2 + var(--dex-okd-button-xl-line-height) + var(--dex-okd-button-outline-primary-border-size)*2)
}

.dex-btn.btn-outline-primary.btn-xl.dex-btn-strict-circle .btn-content {
  display: block;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  width: 100%
}

.dex-btn.btn-xxs {
  border-radius: var(--dex-okd-button-xxs-border-radius);
  font-weight: 500;
  font-weight: var(--dex-okd-button-xxs-font-weight, 500);
  min-width: var(--dex-okd-button-xxs-min-width)
}

.dex-btn.btn-xxs,
.dex-btn.btn-xxs .dex-btn-loader-text {
  font-size: var(--dex-okd-button-xxs-font-size);
  line-height: var(--dex-okd-button-xxs-line-height)
}

.dex-btn.btn-xxs .dex-btn-loader-text {
  margin-left: var(--dex-okd-button-xxs-loader-text-margin-left)
}

.dex-btn.btn-xxs.btn-rect {
  border-radius: 4px;
  border-radius: var(--dex-okd-button-rect-xxs-border-radius, 4px)
}

.dex-btn.btn-xs {
  border-radius: var(--dex-okd-button-xs-border-radius);
  font-weight: 500;
  font-weight: var(--dex-okd-button-xs-font-weight, 500);
  min-width: var(--dex-okd-button-xs-min-width)
}

.dex-btn.btn-xs,
.dex-btn.btn-xs .dex-btn-loader-text {
  font-size: var(--dex-okd-button-xs-font-size);
  line-height: var(--dex-okd-button-xs-line-height)
}

.dex-btn.btn-xs .dex-btn-loader-text {
  margin-left: var(--dex-okd-button-xs-loader-text-margin-left)
}

.dex-btn.btn-xs.btn-rect {
  border-radius: 4px;
  border-radius: var(--dex-okd-button-rect-xs-border-radius, 4px)
}

.dex-btn.btn-s {
  border-radius: var(--dex-okd-button-s-border-radius);
  font-weight: 500;
  font-weight: var(--dex-okd-button-s-font-weight, 500);
  min-width: var(--dex-okd-button-s-min-width)
}

.dex-btn.btn-s,
.dex-btn.btn-s .dex-btn-loader-text {
  font-size: var(--dex-okd-button-s-font-size);
  line-height: var(--dex-okd-button-s-line-height)
}

.dex-btn.btn-s .dex-btn-loader-text {
  margin-left: var(--dex-okd-button-s-loader-text-margin-left)
}

.dex-btn.btn-s.btn-rect {
  border-radius: 4px;
  border-radius: var(--dex-okd-button-rect-s-border-radius, 4px)
}

.dex-btn.btn-sm {
  border-radius: var(--dex-okd-button-sm-border-radius);
  font-weight: 500;
  font-weight: var(--dex-okd-button-sm-font-weight, 500);
  min-width: var(--dex-okd-button-sm-min-width)
}

.dex-btn.btn-sm,
.dex-btn.btn-sm .dex-btn-loader-text {
  font-size: var(--dex-okd-button-sm-font-size);
  line-height: var(--dex-okd-button-sm-line-height)
}

.dex-btn.btn-sm .dex-btn-loader-text {
  margin-left: var(--dex-okd-button-sm-loader-text-margin-left)
}

.dex-btn.btn-sm.btn-rect {
  border-radius: 4px;
  border-radius: var(--dex-okd-button-rect-sm-border-radius, 4px)
}

.dex-btn.btn-md {
  border-radius: var(--dex-okd-button-md-border-radius);
  font-weight: 500;
  font-weight: var(--dex-okd-button-md-font-weight, 500);
  min-width: var(--dex-okd-button-md-min-width)
}

.dex-btn.btn-md,
.dex-btn.btn-md .dex-btn-loader-text {
  font-size: var(--dex-okd-button-md-font-size);
  line-height: var(--dex-okd-button-md-line-height)
}

.dex-btn.btn-md .dex-btn-loader-text {
  margin-left: var(--dex-okd-button-md-loader-text-margin-left)
}

.dex-btn.btn-md.btn-rect {
  border-radius: 4px;
  border-radius: var(--dex-okd-button-rect-md-border-radius, 4px)
}

.dex-btn.btn-lg {
  border-radius: var(--dex-okd-button-lg-border-radius);
  font-weight: 500;
  font-weight: var(--dex-okd-button-lg-font-weight, 500);
  min-width: var(--dex-okd-button-lg-min-width)
}

.dex-btn.btn-lg,
.dex-btn.btn-lg .dex-btn-loader-text {
  font-size: var(--dex-okd-button-lg-font-size);
  line-height: var(--dex-okd-button-lg-line-height)
}

.dex-btn.btn-lg .dex-btn-loader-text {
  margin-left: var(--dex-okd-button-lg-loader-text-margin-left)
}

.dex-btn.btn-lg.btn-rect {
  border-radius: 8px;
  border-radius: var(--dex-okd-button-rect-lg-border-radius, 8px)
}

.dex-btn.btn-xl {
  border-radius: var(--dex-okd-button-xl-border-radius);
  font-weight: 500;
  font-weight: var(--dex-okd-button-xl-font-weight, 500);
  min-width: var(--dex-okd-button-xl-min-width)
}

.dex-btn.btn-xl,
.dex-btn.btn-xl .dex-btn-loader-text {
  font-size: var(--dex-okd-button-xl-font-size);
  line-height: var(--dex-okd-button-xl-line-height)
}

.dex-btn.btn-xl .dex-btn-loader-text {
  margin-left: var(--dex-okd-button-xl-loader-text-margin-left)
}

.dex-btn.btn-xl.btn-rect {
  border-radius: 8px;
  border-radius: var(--dex-okd-button-rect-xl-border-radius, 8px)
}

.dex-btn.btn-disabled,
.dex-btn:disabled {
  cursor: not-allowed
}

.dex-btn.block {
  display: flex;
  width: 100%
}

.dex-btn.btn-circle {
  border-radius: 100px !important
}

.dex-datepicker-body {
  display: flex
}

.dex-picker-view {
  box-sizing: border-box;
  display: flex;
  height: 100%;
  justify-content: center;
  position: relative;
  width: 100%
}

.dex-picker-view-button {
  box-sizing: border-box;
  height: 56px;
  padding-right: 23px;
  padding-top: 12px;
  text-align: right
}

.dex-picker-view-wheel-column {
  flex: 1 1;
  height: 100%;
  overflow-y: scroll;
  scrollbar-width: none
}

.dex-picker-view-wheel-column::-webkit-scrollbar {
  display: none
}

.dex-picker-view-wheel-column .column-item-container {
  height: 100%
}

.dex-picker-view-wheel-column-item {
  color: #929292;
  color: var(--dex-okd-pickerview-item-default-font-color, #929292);
  cursor: pointer;
  font-size: 14px;
  font-size: var(--dex-okd-pickerview-item-default-font-size, 14px);
  font-weight: 400;
  font-weight: var(--dex-okd-pickerview-item-default-font-weight, 400);
  height: 36px;
  height: var(--dex-okd-pickerview-item-default-height, 36px);
  line-height: 36px;
  line-height: var(--dex-okd-pickerview-item-default-height, 36px);
  text-align: center;
  -webkit-user-select: none;
  -moz-user-select: none;
  -ms-user-select: none;
  user-select: none;
  width: 100%
}

.dex-picker-view-wheel-column-item-active {
  color: #000;
  color: var(--dex-okd-pickerview-item-active-font-color, #000);
  font-weight: 500;
  font-weight: var(--dex-okd-pickerview-item-active-font-weight, 500)
}

@media (max-width:767px) {
  .dex-picker-view-wheel-column-item {
    font-size: 16px;
    font-size: var(--dex-okd-pickerview-sm-item-default-font-size, 16px)
  }
}

.dex-picker-view-wheel-column-empty {
  height: calc(50% - 18px);
  height: calc(50% - var(--dex-okd-pickerview-item-default-height, 36px)/2)
}

.dex-picker-view-mask {
  display: flex;
  flex-direction: column;
  height: 100%;
  justify-content: center;
  left: 0;
  pointer-events: none;
  position: absolute;
  top: 0;
  width: 100%;
  z-index: 1000
}

.dex-picker-view-mask-middle {
  border-bottom: 1px solid #ebebeb;
  border-bottom: 1px solid var(--dex-okd-pickerview-item-active-border-color, #ebebeb);
  border-top: 1px solid #ebebeb;
  border-top: 1px solid var(--dex-okd-pickerview-item-active-border-color, #ebebeb);
  box-sizing: border-box;
  flex: none;
  height: 36px;
  height: var(--dex-okd-pickerview-item-default-height, 36px)
}

.dex-coach-popover .dex-popup-layer-content {
  padding: 0
}

.dex-coach-popover .dex-popup-layer-arrow-inner {
  background-color: #fff;
  background-color: var(--dex-okd-coachmark-popover-arrow-background-color, #fff);
  border-color: #ebebeb;
  border-color: var(--dex-okd-coachmark-popover-arrow-border-color, #ebebeb)
}

.dex-coach-con {
  background-color: #fff;
  background-color: var(--dex-okd-coachmark-popover-background-color, #fff);
  border: thin solid #ebebeb;
  border: thin solid var(--dex-okd-coachmark-popover-border-color, #ebebeb);
  border-radius: 8px;
  border-radius: var(--dex-okd-coachmark-popover-border-radius, 8px);
  box-shadow: 8px 8px 16px #00000014;
  box-shadow: var(--dex-okd-coachmark-popover-border-shadow, 8px 8px 16px #00000014);
  box-sizing: border-box;
  overflow: hidden;
  padding: 16px;
  padding: var(--dex-okd-coachmark-popover-padding, 16px);
  width: 250px;
  width: var(--dex-okd-coachmark-popover-width, 250px)
}

.dex-coach-con .dex-coach-title {
  align-items: center;
  color: #000;
  color: var(--dex-okd-coachmark-popover-title-color, #000);
  display: flex;
  font-size: 16px;
  font-size: var(--dex-okd-coachmark-popover-title-font-size, 16px);
  font-weight: 700;
  font-weight: var(--dex-okd-coachmark-popover-title-font-weight, 700);
  justify-content: space-between;
  line-height: 20px;
  line-height: var(--dex-okd-coachmark-popover-title-line-height, 20px)
}

.dex-coach-con .dex-coach-title .dex-coach-title-close {
  align-self: flex-start;
  color: #929292;
  color: var(--dex-okd-coachmark-popover-close-color, #929292);
  cursor: pointer;
  display: inline-block;
  font-size: 20px;
  font-size: var(--dex-okd-coachmark-popover-close-font-size, 20px);
  margin-left: 12px;
  margin-left: var(--dex-okd-coachmark-popover-close-margin-left, 12px);
  position: relative;
  vertical-align: middle;
  z-index: 1
}

.dex-coach-con .dex-coach-title+.dex-coach-desc {
  margin-top: 8px;
  margin-top: var(--dex-okd-coachmark-popover-desc-margin-top, 8px)
}

.dex-coach-con .dex-coach-desc {
  color: #000;
  color: var(--dex-okd-coachmark-popover-desc-color, #000);
  font-size: 14px;
  font-size: var(--dex-okd-coachmark-popover-desc-font-size, 14px);
  line-height: 20px;
  line-height: var(--dex-okd-coachmark-popover-desc-line-height, 20px)
}

.dex-coach-con .dex-coach-desc+.dex-coach-footer {
  margin-top: 16px;
  margin-top: var(--dex-okd-coachmark-popover-footer-margin-top, 16px)
}

.dex-coach-con .dex-coach-tour-footer {
  align-items: center;
  color: #929292;
  color: var(--dex-okd-coachmark-tour-footer-color, #929292);
  display: flex;
  font-size: 14px;
  font-size: var(--dex-okd-coachmark-tour-footer-font-size, 14px);
  justify-content: space-between;
  line-height: 16px
}

.dex-coach-con .dex-coach-tour-footer .dex-coach-tour-footer-right {
  align-items: center;
  display: flex
}

.dex-coach-con .dex-coach-tour-footer .dex-coach-tour-footer-confirm {
  margin-left: 8px;
  margin-left: var(--dex-okd-okd-coachmark-tour-footer-margin-left, 8px)
}

.dex-coach-con .dex-coach-tour-footer .dex-coach-tour-footer-button.dex-coach-tour-footer-cancel,
.dex-coach-con .dex-coach-tour-footer .dex-coach-tour-footer-button.dex-coach-tour-footer-confirm {
  min-width: unset
}

.dex-coach-con .dex-coach-standalone-footer {
  display: flex;
  justify-content: flex-end
}

.dex-coach-con .dex-coach-standalone-footer .dex-coach-standalone-footer-button+.dex-coach-standalone-footer-button {
  margin-left: 8px;
  margin-left: var(--dex-okd-okd-coachmark-standalone-footer-margin-left, 8px)
}

@media (min-width:768px) {
  .dex-coach-con {
    max-width: 375px;
    max-width: var(--dex-okd-coachmark-popover-max-width, 375px)
  }
}

.dex-coach-mask {
  color: rgba(0, 0, 0, .65);
  color: var(--dex-okd-coachmark-mask-color, rgba(0, 0, 0, .65));
  inset: 0;
  pointer-events: none;
  position: fixed
}

.dex-negativebutton-xxs {
  font-size: 12px;
  font-size: var(--dex-okd-negativebutton-xxs-font-size, 12px);
  font-weight: 400;
  font-weight: var(--dex-okd-negativebutton-xxs-font-weight, 400);
  line-height: 16px;
  line-height: var(--dex-okd-negativebutton-xxs-line-height, 16px);
  min-width: 63px;
  min-width: var(--dex-okd-negativebutton-xxs-min-width, 63px);
  padding: 4px 12px;
  padding: var(--dex-okd-negativebutton-xxs-padding-vertical, 4px) var(--dex-okd-negativebutton-xxs-padding-horizontal, 12px)
}

.dex-negativebutton-xxs .dex-negativebutton-loader-circle {
  height: 14px;
  height: var(--dex-okd-negativebutton-xxs-loader-width, 14px);
  width: 14px;
  width: var(--dex-okd-negativebutton-xxs-loader-width, 14px)
}

.dex-negativebutton-xxs .dex-negativebutton-icon {
  font-size: 14px;
  font-size: var(--dex-okd-negativebutton-xxs-icon-size, 14px);
  font-weight: 400;
  font-weight: var(--dex-okd-negativebutton-xxs-font-weight, 400)
}

.dex-negativebutton-xxs .dex-negativebutton-icon-leading {
  margin-right: 6px;
  margin-right: var(--dex-okd-negativebutton-xxs-icon-margin-right, 6px)
}

.dex-negativebutton-xxs .dex-negativebutton-icon-tailing {
  margin-left: 6px;
  margin-left: var(--dex-okd-negativebutton-xxs-icon-margin-right, 6px)
}

.dex-negativebutton-loading-text .dex-negativebutton-loader {
  margin-right: var(--dex-okd-negativebutton-xxs-loader-margin-right, 6px)
}

.dex-negativebutton-xs {
  font-size: 12px;
  font-size: var(--dex-okd-negativebutton-xs-font-size, 12px);
  font-weight: 400;
  font-weight: var(--dex-okd-negativebutton-xs-font-weight, 400);
  line-height: 16px;
  line-height: var(--dex-okd-negativebutton-xs-line-height, 16px);
  min-width: 63px;
  min-width: var(--dex-okd-negativebutton-xs-min-width, 63px);
  padding: 6px 12px;
  padding: var(--dex-okd-negativebutton-xs-padding-vertical, 6px) var(--dex-okd-negativebutton-xs-padding-horizontal, 12px)
}

.dex-negativebutton-xs .dex-negativebutton-loader-circle {
  height: 14px;
  height: var(--dex-okd-negativebutton-xs-loader-width, 14px);
  width: 14px;
  width: var(--dex-okd-negativebutton-xs-loader-width, 14px)
}

.dex-negativebutton-xs .dex-negativebutton-icon {
  font-size: 14px;
  font-size: var(--dex-okd-negativebutton-xs-icon-size, 14px);
  font-weight: 400;
  font-weight: var(--dex-okd-negativebutton-xs-font-weight, 400)
}

.dex-negativebutton-xs .dex-negativebutton-icon-leading {
  margin-right: 6px;
  margin-right: var(--dex-okd-negativebutton-xs-icon-margin-right, 6px)
}

.dex-negativebutton-xs .dex-negativebutton-icon-tailing {
  margin-left: 6px;
  margin-left: var(--dex-okd-negativebutton-xs-icon-margin-right, 6px)
}

.dex-negativebutton-loading-text .dex-negativebutton-loader {
  margin-right: var(--dex-okd-negativebutton-xs-loader-margin-right, 6px)
}

.dex-negativebutton-s {
  font-size: 14px;
  font-size: var(--dex-okd-negativebutton-s-font-size, 14px);
  font-weight: 400;
  font-weight: var(--dex-okd-negativebutton-s-font-weight, 400);
  line-height: 16px;
  line-height: var(--dex-okd-negativebutton-s-line-height, 16px);
  min-width: 72px;
  min-width: var(--dex-okd-negativebutton-s-min-width, 72px);
  padding: 8px 12px;
  padding: var(--dex-okd-negativebutton-s-padding-vertical, 8px) var(--dex-okd-negativebutton-s-padding-horizontal, 12px)
}

.dex-negativebutton-s .dex-negativebutton-loader-circle {
  height: 14px;
  height: var(--dex-okd-negativebutton-s-loader-width, 14px);
  width: 14px;
  width: var(--dex-okd-negativebutton-s-loader-width, 14px)
}

.dex-negativebutton-s .dex-negativebutton-icon {
  font-size: 14px;
  font-size: var(--dex-okd-negativebutton-s-icon-size, 14px);
  font-weight: 400;
  font-weight: var(--dex-okd-negativebutton-s-font-weight, 400)
}

.dex-negativebutton-s .dex-negativebutton-icon-leading {
  margin-right: 6px;
  margin-right: var(--dex-okd-negativebutton-s-icon-margin-right, 6px)
}

.dex-negativebutton-s .dex-negativebutton-icon-tailing {
  margin-left: 6px;
  margin-left: var(--dex-okd-negativebutton-s-icon-margin-right, 6px)
}

.dex-negativebutton-loading-text .dex-negativebutton-loader {
  margin-right: var(--dex-okd-negativebutton-s-loader-margin-right, 6px)
}

.dex-negativebutton-sm {
  font-size: 14px;
  font-size: var(--dex-okd-negativebutton-sm-font-size, 14px);
  font-weight: 400;
  font-weight: var(--dex-okd-negativebutton-sm-font-weight, 400);
  line-height: 16px;
  line-height: var(--dex-okd-negativebutton-sm-line-height, 16px);
  min-width: 81px;
  min-width: var(--dex-okd-negativebutton-sm-min-width, 81px);
  padding: 10px 16px;
  padding: var(--dex-okd-negativebutton-sm-padding-vertical, 10px) var(--dex-okd-negativebutton-sm-padding-horizontal, 16px)
}

.dex-negativebutton-sm .dex-negativebutton-loader-circle {
  height: 16px;
  height: var(--dex-okd-negativebutton-sm-loader-width, 16px);
  width: 16px;
  width: var(--dex-okd-negativebutton-sm-loader-width, 16px)
}

.dex-negativebutton-sm .dex-negativebutton-icon {
  font-size: 16px;
  font-size: var(--dex-okd-negativebutton-sm-icon-size, 16px);
  font-weight: 400;
  font-weight: var(--dex-okd-negativebutton-sm-font-weight, 400)
}

.dex-negativebutton-sm .dex-negativebutton-icon-leading {
  margin-right: 6px;
  margin-right: var(--dex-okd-negativebutton-sm-icon-margin-right, 6px)
}

.dex-negativebutton-sm .dex-negativebutton-icon-tailing {
  margin-left: 6px;
  margin-left: var(--dex-okd-negativebutton-sm-icon-margin-right, 6px)
}

.dex-negativebutton-loading-text .dex-negativebutton-loader {
  margin-right: var(--dex-okd-negativebutton-sm-loader-margin-right, 6px)
}

.dex-negativebutton-md {
  font-size: 14px;
  font-size: var(--dex-okd-negativebutton-md-font-size, 14px);
  font-weight: 400;
  font-weight: var(--dex-okd-negativebutton-md-font-weight, 400);
  line-height: 16px;
  line-height: var(--dex-okd-negativebutton-md-line-height, 16px);
  min-width: 90px;
  min-width: var(--dex-okd-negativebutton-md-min-width, 90px);
  padding: 12px 16px;
  padding: var(--dex-okd-negativebutton-md-padding-vertical, 12px) var(--dex-okd-negativebutton-md-padding-horizontal, 16px)
}

.dex-negativebutton-md .dex-negativebutton-loader-circle {
  height: 16px;
  height: var(--dex-okd-negativebutton-md-loader-width, 16px);
  width: 16px;
  width: var(--dex-okd-negativebutton-md-loader-width, 16px)
}

.dex-negativebutton-md .dex-negativebutton-icon {
  font-size: 16px;
  font-size: var(--dex-okd-negativebutton-md-icon-size, 16px);
  font-weight: 400;
  font-weight: var(--dex-okd-negativebutton-md-font-weight, 400)
}

.dex-negativebutton-md .dex-negativebutton-icon-leading {
  margin-right: 6px;
  margin-right: var(--dex-okd-negativebutton-md-icon-margin-right, 6px)
}

.dex-negativebutton-md .dex-negativebutton-icon-tailing {
  margin-left: 6px;
  margin-left: var(--dex-okd-negativebutton-md-icon-margin-right, 6px)
}

.dex-negativebutton-loading-text .dex-negativebutton-loader {
  margin-right: 6px;
  margin-right: var(--dex-okd-negativebutton-md-loader-margin-right, 6px)
}

.dex-negativebutton-lg {
  font-size: 16px;
  font-size: var(--dex-okd-negativebutton-lg-font-size, 16px);
  font-weight: 500;
  font-weight: var(--dex-okd-negativebutton-lg-font-weight, 500);
  line-height: 20px;
  line-height: var(--dex-okd-negativebutton-lg-line-height, 20px);
  min-width: 108px;
  min-width: var(--dex-okd-negativebutton-lg-min-width, 108px);
  padding: 14px 24px;
  padding: var(--dex-okd-negativebutton-lg-padding-vertical, 14px) var(--dex-okd-negativebutton-lg-padding-horizontal, 24px)
}

.dex-negativebutton-lg .dex-negativebutton-loader-circle {
  height: 20px;
  height: var(--dex-okd-negativebutton-lg-loader-width, 20px);
  width: 20px;
  width: var(--dex-okd-negativebutton-lg-loader-width, 20px)
}

.dex-negativebutton-lg .dex-negativebutton-icon {
  font-size: 20px;
  font-size: var(--dex-okd-negativebutton-lg-icon-size, 20px);
  font-weight: 500;
  font-weight: var(--dex-okd-negativebutton-lg-font-weight, 500)
}

.dex-negativebutton-lg .dex-negativebutton-icon-leading {
  margin-right: 8px;
  margin-right: var(--dex-okd-negativebutton-lg-icon-margin-right, 8px)
}

.dex-negativebutton-lg .dex-negativebutton-icon-tailing {
  margin-left: 8px;
  margin-left: var(--dex-okd-negativebutton-lg-icon-margin-right, 8px)
}

.dex-negativebutton-loading-text .dex-negativebutton-loader {
  margin-right: var(--dex-okd-negativebutton-lg-loader-margin-right, 8px)
}

.dex-negativebutton-xl {
  font-size: 18px;
  font-size: var(--dex-okd-negativebutton-xl-font-size, 18px);
  font-weight: 500;
  font-weight: var(--dex-okd-negativebutton-xl-font-weight, 500);
  line-height: 24px;
  line-height: var(--dex-okd-negativebutton-xl-line-height, 24px);
  min-width: 126px;
  min-width: var(--dex-okd-negativebutton-xl-min-width, 126px);
  padding: 16px 44px;
  padding: var(--dex-okd-negativebutton-xl-padding-vertical, 16px) var(--dex-okd-negativebutton-xl-padding-horizontal, 44px)
}

.dex-negativebutton-xl .dex-negativebutton-loader-circle {
  height: 20px;
  height: var(--dex-okd-negativebutton-xl-loader-width, 20px);
  width: 20px;
  width: var(--dex-okd-negativebutton-xl-loader-width, 20px)
}

.dex-negativebutton-xl .dex-negativebutton-icon {
  font-size: 20px;
  font-size: var(--dex-okd-negativebutton-xl-icon-size, 20px);
  font-weight: 500;
  font-weight: var(--dex-okd-negativebutton-xl-font-weight, 500)
}

.dex-negativebutton-xl .dex-negativebutton-icon-leading {
  margin-right: 8px;
  margin-right: var(--dex-okd-negativebutton-xl-icon-margin-right, 8px)
}

.dex-negativebutton-xl .dex-negativebutton-icon-tailing {
  margin-left: 8px;
  margin-left: var(--dex-okd-negativebutton-xl-icon-margin-right, 8px)
}

.dex-negativebutton-loading-text .dex-negativebutton-loader {
  margin-right: 8px;
  margin-right: var(--dex-okd-negativebutton-xl-loader-margin-right, 8px)
}

.dex-negativebutton {
  align-items: center;
  background-color: var(--dex-okd-color-surface-pnl-loss-default);
  background-color: var(--dex-okd-negativebutton-default-background, var(--dex-okd-color-surface-pnl-loss-default));
  border-radius: 50px;
  border-radius: var(--dex-okd-negativebutton-border-radius, 50px);
  box-sizing: border-box;
  color: var(--dex-okd-color-content-pnl-loss-oncolor);
  color: var(--dex-okd-negativebutton-default-color, var(--dex-okd-color-content-pnl-loss-oncolor));
  cursor: pointer;
  display: inline-flex;
  justify-content: center;
  outline: none;
  position: relative;
  text-decoration: none;
  touch-action: manipulation;
  -webkit-user-select: none;
  -moz-user-select: none;
  -ms-user-select: none;
  user-select: none
}

.dex-negativebutton:focus-visible {
  border-radius: 50px;
  border-radius: var(--dex-okd-negativebutton-border-radius, 50px);
  outline: 2px solid var(--dex-okd-color-border-focus);
  outline-color: var(--dex-okd-color-border-focus);
  outline-offset: 2px;
  outline-style: solid;
  outline-width: 2px
}

.dex-negativebutton.hover,
.dex-negativebutton:not(.dex-negativebutton-disabled):not(.dex-negativebutton-loading):hover {
  background-color: var(--dex-okd-color-surface-pnl-loss-hovered);
  background-color: var(--dex-okd-negativebutton-hover-background, var(--dex-okd-color-surface-pnl-loss-hovered))
}

.dex-negativebutton.active,
.dex-negativebutton:not(.dex-negativebutton-disabled):not(.dex-negativebutton-loading):active {
  background-color: var(--dex-okd-color-surface-pnl-loss-pressed);
  background-color: var(--dex-okd-negativebutton-active-background, var(--dex-okd-color-surface-pnl-loss-pressed))
}

.dex-negativebutton-disabled,
.dex-negativebutton.disabled {
  background-color: var(--dex-okd-color-surface-interactive-disabled);
  background-color: var(--dex-okd-negativebutton-disabled-background, var(--dex-okd-color-surface-interactive-disabled));
  color: var(--dex-okd-color-content-interactive-disabled);
  color: var(--dex-okd-negativebutton-disabled-color, var(--dex-okd-color-content-interactive-disabled));
  cursor: not-allowed
}

.dex-negativebutton-loading,
.dex-negativebutton.loading {
  background-color: var(--dex-okd-color-surface-pnl-loss-pressed);
  background-color: var(--dex-okd-negativebutton-loading-background, var(--dex-okd-color-surface-pnl-loss-pressed));
  color: transparent
}

.dex-negativebutton-loading .dex-negativebutton-loader,
.dex-negativebutton.loading .dex-negativebutton-loader {
  display: flex;
  position: absolute
}

.dex-negativebutton-loading-text {
  background-color: var(--dex-okd-color-surface-pnl-loss-pressed);
  background-color: var(--dex-okd-negativebutton-loading-background, var(--dex-okd-color-surface-pnl-loss-pressed));
  display: flex
}

.dex-negativebutton-block,
.dex-negativebutton.block {
  display: flex;
  width: 100%
}

.dex-negativebutton-ellipsis {
  display: block;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  width: 100%
}

.dex-negativebutton-loader-circle {
  border-color: var(--dex-okd-negativebutton-loader-track-color, var(--dex-okd-color-border-interactive-oncolor));
  border-top-color: var(--dex-okd-negativebutton-loader-mark-color, var(--dex-okd-color-content-static-inverse));
  border-width: 2px;
  border-width: var(--dex-okd-negativebutton-loader-border-width, 2px)
}

.dex-notification-default {
  height: 100vh;
  position: fixed;
  width: 100vw
}

.dex-notification-default,
.dex-notification-wrap {
  box-sizing: border-box;
  display: flex;
  flex-direction: column;
  left: 0;
  line-height: 1;
  margin: 0;
  padding: 0;
  pointer-events: none;
  top: 0
}

.dex-notification-wrap {
  height: 100%;
  position: absolute;
  width: 100%
}

.dex-notification * {
  box-sizing: border-box
}

.dex-notification-container.container-remove {
  animation-duration: .55s;
  animation-name: NotificationOutTop
}

.dex-notification-box {
  animation-duration: .3s;
  background: var(--dex-okd-notification-box-background);
  border: thin solid var(--dex-okd-notification-box-border-color);
  border-radius: var(--dex-okd-notification-box-border-radius);
  box-shadow: var(--dex-okd-notification-box-shadow);
  display: inline-flex;
  line-height: 1;
  margin: calc(var(--dex-okd-notification-box-each-margin)/2) 0;
  max-width: var(--dex-okd-notification-box-max-width);
  min-width: var(--dex-okd-notification-box-min-width);
  overflow: hidden;
  padding: var(--dex-okd-notification-box-padding);
  pointer-events: all;
  position: relative
}

.dex-notification-box.auto-width {
  min-width: var(--dex-okd-notification-box-auto-width-min-width)
}

.dex-notification-box .dex-notification-icon-circle-container {
  display: inline-block;
  height: 20px;
  margin-right: var(--dex-okd-notification-box-icon-text-margin);
  position: relative;
  vertical-align: top;
  width: 20px
}

.dex-notification-box .dex-notification-icon-new {
  font-size: 20px;
  height: 100%;
  width: 100%
}

.dex-notification-box .dex-notification-content {
  display: inline-flex;
  flex: 1 1;
  flex-direction: column;
  flex-wrap: wrap;
  word-break: break-word
}

.dex-notification-box .dex-notification-inline {
  flex-direction: unset
}

.dex-notification-box .dex-notification-inline .dex-notification-action {
  margin-top: 0;
  width: auto
}

.dex-notification-box .dex-notification-title-box {
  display: inline-flex;
  flex: 1 1;
  flex-direction: column;
  flex-wrap: wrap
}

.dex-notification-box .dex-notification-title {
  color: var(--dex-okd-notification-title-color);
  flex: 1 1;
  flex-shrink: 0;
  font-size: var(--dex-okd-notification-title-font-size);
  font-weight: 500;
  line-height: var(--dex-okd-notification-title-line-height);
  text-align: left
}

.dex-notification-box .dex-notification-desc,
.dex-notification-box .dex-notification-text {
  color: var(--dex-okd-notification-text-color);
  font-size: var(--dex-okd-notification-text-font-size);
  line-height: var(--dex-okd-notification-text-line-height)
}

.dex-notification-box .dex-notification-desc {
  margin-top: 4px;
  text-align: left;
  width: 100%
}

.dex-notification-box .dex-notification-action {
  display: inline-block;
  margin-top: 12px;
  pointer-events: auto;
  text-align: left;
  width: 100%
}

.dex-notification-box .dex-notification-action .action-undo {
  color: var(--dex-okd-notification-action-confirm-btn-color)
}

.dex-notification-box .dex-notification-action .action-dismiss,
.dex-notification-box .dex-notification-action .action-undo {
  cursor: pointer;
  font-size: var(--dex-okd-notification-action-font-size);
  font-weight: 500;
  line-height: var(--dex-okd-notification-action-line-height)
}

.dex-notification-box .dex-notification-action .action-dismiss {
  color: var(--dex-okd-notification-action-cancel-btn-color)
}

.dex-notification-box .dex-notification-action .action-undo+.action-dismiss {
  margin-left: 16px
}

.dex-notification-box .dex-notification-close {
  -webkit-tap-highlight-color: transparent;
  color: var(--dex-okd-notification-box-close-icon-color);
  cursor: pointer;
  font-size: 22px;
  height: 22px;
  margin-left: 15px;
  pointer-events: auto;
  position: relative;
  top: -2px;
  width: 22px
}

.dex-notification-box.success .dex-notification-icon-new {
  color: var(--dex-okd-notification-success-icon-color)
}

.dex-notification-box.info .dex-notification-icon-new {
  color: var(--dex-okd-notification-info-icon-color)
}

.dex-notification-box.warn .dex-notification-icon-new {
  color: var(--dex-okd-notification-warn-icon-color)
}

.dex-notification-box.error .dex-notification-icon-new {
  color: var(--dex-okd-notification-error-icon-color)
}

.dex-notification-box.pending .dex-notification-icon-new {
  color: var(--dex-okd-notification-pending-icon-color)
}

.dex-notification.dex-notification-bottom,
.dex-notification.dex-notification-bottom-left,
.dex-notification.dex-notification-bottom-right {
  justify-content: flex-end
}

.dex-notification.dex-notification-bottom .container-remove,
.dex-notification.dex-notification-bottom-left .container-remove,
.dex-notification.dex-notification-bottom-right .container-remove {
  animation-name: NotificationOutBottom
}

.dex-notification.dex-notification-bottom-right .dex-notification-container,
.dex-notification.dex-notification-top-right .dex-notification-container {
  text-align: right
}

.dex-notification.dex-notification-bottom .dex-notification-container,
.dex-notification.dex-notification-top .dex-notification-container {
  text-align: center
}

.dex-notification.dex-notification-bottom-left .dex-notification-box,
.dex-notification.dex-notification-top-left .dex-notification-box {
  animation-name: NotificationInLeft
}

.dex-notification.dex-notification-bottom-right .dex-notification-box,
.dex-notification.dex-notification-top-right .dex-notification-box {
  animation-name: NotificationInRight
}

.dex-notification.dex-notification-top .dex-notification-box {
  animation-name: NotificationInTop
}

.dex-notification.dex-notification-bottom .dex-notification-box {
  animation-name: NotificationInBottom
}

@media (max-width:767px) {

  .dex-notification.dex-notification-bottom-left .dex-notification-container,
  .dex-notification.dex-notification-bottom-right .dex-notification-container,
  .dex-notification.dex-notification-top-left .dex-notification-container,
  .dex-notification.dex-notification-top-right .dex-notification-container {
    text-align: center
  }

  .dex-notification-box {
    min-width: unset;
    width: 100%
  }

  .dex-notification-box.auto-width {
    width: auto
  }
}

.dex-notification-box .dex-notification-icon-pending-poster,
.dex-notification-box .dex-notification-icon-success-poster {
  color: var(--dex-okd-notification-success-icon-color);
  color: var(--dex-okd-color-surface-success-default, var(--dex-okd-notification-success-icon-color));
  font-size: 20px;
  left: 50%;
  position: absolute;
  top: 50%;
  transform: translate(-50%, -50%)
}

.dex-notification-box .dex-notification-icon-error-poster {
  color: var(--dex-okd-notification-error-icon-color);
  color: var(--dex-okd-color-surface-danger-default, var(--dex-okd-notification-error-icon-color));
  font-size: 20px;
  left: 50%;
  position: absolute;
  top: 50%;
  transform: translate(-50%, -50%)
}

@keyframes NotificationInLeft {
  0% {
    opacity: 0;
    transform: translate3d(-30px, 0, 0)
  }

  to {
    opacity: 1;
    transform: translateZ(0)
  }
}

@keyframes NotificationInRight {
  0% {
    opacity: 0;
    transform: translate3d(30px, 0, 0)
  }

  to {
    opacity: 1;
    transform: translateZ(0)
  }
}

@keyframes NotificationInTop {
  0% {
    opacity: 0;
    transform: translate3d(0, -30px, 0)
  }

  to {
    opacity: 1;
    transform: translateZ(0)
  }
}

@keyframes NotificationInBottom {
  0% {
    opacity: 0;
    transform: translate3d(0, 30px, 0)
  }

  to {
    opacity: 1;
    transform: translateZ(0)
  }
}

@keyframes NotificationOutBottom {
  0% {
    max-height: 150px;
    opacity: 1;
    transform: translateZ(0)
  }

  to {
    max-height: 0;
    opacity: 0;
    transform: translate3d(0, 30px, 0)
  }
}

@keyframes NotificationOutTop {
  0% {
    max-height: 150px;
    opacity: 1;
    transform: translateZ(0)
  }

  to {
    max-height: 0;
    opacity: 0;
    transform: translate3d(0, -30px, 0)
  }
}

.dex-popover .dex-popup-layer-content {
  padding: 0
}

.dex-popover .dex-popup-layer-arrow-inner {
  background-color: var(--dex-okd-popover-layer-background);
  border-color: var(--dex-okd-popover-layer-border-color)
}

.dex-popover-arrow-special .dex-popup-layer-arrow[change-color] .dex-popup-layer-arrow-inner {
  background-color: var(--dex-okd-popover-title-background)
}

.dex-popover-arrow-special[data-popper-placement*=bottom] .dex-popup-layer-arrow-inner {
  background-color: var(--dex-okd-popover-title-background) !important
}

.dex-popover-content {
  background-color: var(--dex-okd-popover-layer-background);
  border: 1px solid var(--dex-okd-popover-layer-border-color);
  border-radius: 4px;
  box-shadow: var(--dex-okd-popover-common-layer-shadow);
  max-width: var(--dex-okd-popover-common-layer-width)
}

.dex-popover-content-title {
  background-color: var(--dex-okd-popover-title-background);
  border-top-left-radius: 4px;
  border-top-right-radius: 4px;
  color: var(--dex-okd-popover-title-color);
  font-weight: 500;
  line-height: 20px;
  padding: 8px 12px;
  position: relative
}

.dex-popover-content-desc {
  background-color: var(--dex-okd-popover-desc-background);
  border-bottom-left-radius: 4px;
  border-bottom-right-radius: 4px;
  color: var(--dex-okd-popover-desc-color);
  overflow: hidden;
  padding: var(--dex-okd-popover-common-padding)
}

.dex-popover-content-desc .dex-popover-content-desc-link {
  color: var(--dex-okd-popover-link-color);
  cursor: pointer;
  font-weight: 500;
  padding-left: 4px;
  text-decoration: underline
}

.dex-popover-content-desc-button {
  color: var(--dex-okd-popover-action-color);
  cursor: pointer;
  float: right;
  font-weight: 500;
  margin-top: 20px;
  overflow: hidden;
  padding: 0 10px;
  text-align: right
}

.dex-popover-content-desc-radius {
  border-top-left-radius: 4px;
  border-top-right-radius: 4px
}

.dex-popover-md .dex-popover-content {
  font-size: var(--dex-okd-popover-md-font-size);
  line-height: var(--dex-okd-popover-md-line-height)
}

.dex-popover-md .dex-popover-content-title {
  font-size: var(--dex-okd-popover-md-title-font-size)
}

.dex-popover-sm .dex-popover-content {
  font-size: var(--dex-okd-popover-sm-font-size);
  line-height: var(--dex-okd-popover-sm-line-height)
}

.dex-popover-sm .dex-popover-content-title {
  font-size: var(--dex-okd-popover-sm-title-font-size)
}

.dex-alert {
  border-radius: var(--dex-okd-alert-box-border-radius);
  box-sizing: border-box;
  display: inline-flex;
  padding: var(--dex-okd-alert-box-padding-vertical) var(--dex-okd-alert-box-padding-horizontal);
  position: relative;
  width: 100%
}

.dex-alert.closable {
  padding-right: 44px
}

.dex-alert * {
  box-sizing: border-box
}

.dex-alert .dex-alert-icon {
  align-items: center;
  display: flex;
  font-size: 20px;
  font-size: var(--dex-okd-alert-icon-tip-size, 20px);
  height: 20px;
  height: var(--dex-okd-alert-icon-tip-size, 20px);
  justify-content: center;
  width: 20px;
  width: var(--dex-okd-alert-icon-tip-size, 20px)
}

.dex-alert-msg-box {
  display: flex;
  flex-direction: column;
  flex-grow: 1
}

.dex-alert-icon+.dex-alert-msg-box {
  margin-left: 15px;
  margin-left: var(--dex-okd-alert-box-margin-left, 15px)
}

.dex-alert-title {
  font-size: var(--dex-okd-alert-title-font-size);
  font-weight: 500;
  line-height: var(--dex-okd-alert-title-line-height)
}

.dex-alert-desc {
  font-size: var(--dex-okd-alert-text-font-size);
  font-weight: 400;
  line-height: var(--dex-okd-alert-text-line-height)
}

.dex-alert-title+.dex-alert-desc {
  margin-top: 4px;
  margin-top: var(--dex-okd-alert-desc-margin-top, 4px)
}

.dex-alert-link {
  font-weight: 500;
  text-decoration: none
}

.dex-alert-desc-list {
  -webkit-padding-start: 17px;
  -moz-padding-start: 17px;
  -webkit-margin-before: 4px;
  -webkit-margin-after: 0;
  margin-block-end: 0;
  margin-block-start: 4px;
  padding-inline-start: 17px
}

.dex-alert-action-box {
  margin-bottom: 8px;
  margin-bottom: var(--dex-okd-alert-action-box-margin-bottom, 8px);
  margin-top: 21px;
  margin-top: var(--dex-okd-alert-action-box-margin-top, 21px)
}

.dex-alert-action {
  background: transparent;
  border: 0;
  cursor: pointer;
  font-family: inherit;
  font-size: var(--dex-okd-alert-action-font-size);
  font-weight: 500;
  line-height: var(--dex-okd-alert-action-line-height);
  outline: 0;
  padding: 0
}

.dex-alert-action:focus-visible {
  border-radius: 4px;
  outline: 2px solid var(--dex-okd-color-border-focus);
  outline-color: var(--dex-okd-color-border-focus);
  outline-offset: 2px;
  outline-style: solid;
  outline-width: 2px
}

.dex-alert-action+.dex-alert-action {
  margin-left: 32px;
  margin-left: var(--dex-okd-alert-action-margin-left, 32px)
}

.dex-alert .dex-alert-close {
  cursor: pointer;
  font-size: 20px;
  font-size: var(--dex-okd-alert-icon-close-size, 20px);
  line-height: 1;
  position: absolute;
  right: 12px
}

.dex-alert.normal-alert {
  background: var(--dex-okd-alert-normal-background)
}

.dex-alert.normal-alert .dex-alert-icon {
  color: var(--dex-okd-alert-normal-icon-color)
}

.dex-alert.normal-alert .dex-alert-title {
  color: var(--dex-okd-alert-normal-title-color)
}

.dex-alert.normal-alert .dex-alert-desc {
  color: var(--dex-okd-alert-normal-desc-color)
}

.dex-alert.normal-alert .dex-alert-close {
  color: var(--dex-okd-color-gray-300);
  color: var(--dex-okd-alert-normal-close-color, var(--dex-okd-color-gray-300))
}

.dex-alert.normal-alert .dex-alert-link {
  border-bottom: 1px solid var(--dex-okd-alert-normal-link-color);
  color: var(--dex-okd-alert-normal-link-color);
  text-decoration: none
}

.dex-alert.normal-alert .dex-alert-action {
  color: var(--dex-okd-alert-normal-action-color)
}

.dex-alert.success-alert {
  background: var(--dex-okd-alert-success-background)
}

.dex-alert.success-alert .dex-alert-icon {
  color: var(--dex-okd-alert-success-icon-color)
}

.dex-alert.success-alert .dex-alert-title {
  color: var(--dex-okd-alert-success-title-color)
}

.dex-alert.success-alert .dex-alert-desc {
  color: var(--dex-okd-alert-success-desc-color)
}

.dex-alert.success-alert .dex-alert-close {
  color: var(--dex-okd-color-gray-300);
  color: var(--dex-okd-alert-success-close-color, var(--dex-okd-color-gray-300))
}

.dex-alert.success-alert .dex-alert-link {
  border-bottom: 1px solid var(--dex-okd-alert-success-link-color);
  color: var(--dex-okd-alert-success-link-color);
  text-decoration: none
}

.dex-alert.success-alert .dex-alert-action {
  color: var(--dex-okd-alert-success-action-color)
}

.dex-alert.info-alert {
  background: var(--dex-okd-alert-info-background)
}

.dex-alert.info-alert .dex-alert-icon {
  color: var(--dex-okd-alert-info-icon-color)
}

.dex-alert.info-alert .dex-alert-title {
  color: var(--dex-okd-alert-info-title-color)
}

.dex-alert.info-alert .dex-alert-desc {
  color: var(--dex-okd-alert-info-desc-color)
}

.dex-alert.info-alert .dex-alert-close {
  color: var(--dex-okd-color-gray-300);
  color: var(--dex-okd-alert-info-close-color, var(--dex-okd-color-gray-300))
}

.dex-alert.info-alert .dex-alert-link {
  border-bottom: 1px solid var(--dex-okd-alert-info-link-color);
  color: var(--dex-okd-alert-info-link-color);
  text-decoration: none
}

.dex-alert.info-alert .dex-alert-action {
  color: var(--dex-okd-alert-info-action-color)
}

.dex-alert.warn-alert {
  background: var(--dex-okd-alert-warn-background)
}

.dex-alert.warn-alert .dex-alert-icon {
  color: var(--dex-okd-alert-warn-icon-color)
}

.dex-alert.warn-alert .dex-alert-title {
  color: var(--dex-okd-alert-warn-title-color)
}

.dex-alert.warn-alert .dex-alert-desc {
  color: var(--dex-okd-alert-warn-desc-color)
}

.dex-alert.warn-alert .dex-alert-close {
  color: var(--dex-okd-color-gray-300);
  color: var(--dex-okd-alert-warn-close-color, var(--dex-okd-color-gray-300))
}

.dex-alert.warn-alert .dex-alert-link {
  border-bottom: 1px solid var(--dex-okd-alert-warn-link-color);
  color: var(--dex-okd-alert-warn-link-color);
  text-decoration: none
}

.dex-alert.warn-alert .dex-alert-action {
  color: var(--dex-okd-alert-warn-action-color)
}

.dex-alert.error-alert {
  background: var(--dex-okd-alert-error-background)
}

.dex-alert.error-alert .dex-alert-icon {
  color: var(--dex-okd-alert-error-icon-color)
}

.dex-alert.error-alert .dex-alert-title {
  color: var(--dex-okd-alert-error-title-color)
}

.dex-alert.error-alert .dex-alert-desc {
  color: var(--dex-okd-alert-error-desc-color)
}

.dex-alert.error-alert .dex-alert-close {
  color: var(--dex-okd-color-gray-300);
  color: var(--dex-okd-alert-error-close-color, var(--dex-okd-color-gray-300))
}

.dex-alert.error-alert .dex-alert-link {
  border-bottom: 1px solid var(--dex-okd-alert-error-link-color);
  color: var(--dex-okd-alert-error-link-color);
  text-decoration: none
}

.dex-alert.error-alert .dex-alert-action {
  color: var(--dex-okd-alert-error-action-color)
}

.dex-accordion {
  border-bottom: 1px solid #ebebeb;
  border-bottom: 1px solid var(--dex-okd-accordion-main-border-color, #ebebeb);
  display: flex;
  flex-direction: column
}

.dex-accordion-header {
  align-items: center;
  cursor: pointer;
  display: flex;
  justify-content: space-between;
  padding: 32px 0;
  padding: var(--dex-okd-accordion-header-padding-vertical, 32px) var(--dex-okd-accordion-header-padding-horizontal, 0)
}

.dex-accordion-header-title {
  color: #000;
  color: var(--dex-okd-accordion-header-title-color, #000);
  font-size: 18px;
  font-size: var(--dex-okd-accordion-header-title-font-size, 18px);
  font-weight: 500;
  font-weight: var(--dex-okd-accordion-header-title-font-weight, 500);
  line-height: 24px;
  line-height: var(--dex-okd-accordion-header-title-line-height, 24px)
}

.dex-accordion-header .dex-accordion-header-icon {
  color: #929292;
  color: var(--dex-okd-accordion-header-icon-color, #929292);
  font-size: 20px;
  font-size: var(--dex-okd-accordion-header-icon-size, 20px);
  transition: all .2s cubic-bezier(.34, .69, .1, 1)
}

.dex-accordion-header-icon-expanded {
  transform: rotate(180deg)
}

.dex-accordion-content {
  color: #929292;
  color: var(--dex-okd-accordion-content-color, #929292);
  display: none;
  font-size: 14px;
  font-size: var(--dex-okd-accordion-content-font-size, 14px);
  font-weight: 400;
  font-weight: var(--dex-okd-accordion-content-font-weight, 400);
  line-height: 1.58;
  line-height: var(--dex-okd-accordion-content-line-height, 1.58);
  overflow: hidden
}

.dex-accordion-content-transition-out {
  margin-bottom: 0;
  max-height: 0;
  opacity: 0;
  transform: translateY(-30px);
  transition: all .2s;
  will-change: transform, opacity, max-height
}

.dex-accordion-content-transition-in {
  max-height: -webkit-max-content;
  max-height: -moz-max-content;
  max-height: max-content;
  opacity: 1;
  transform: translateY(0)
}

.dex-accordion-content-expanded {
  display: block;
  margin-bottom: 32px;
  margin-bottom: var(--dex-okd-accordion-header-padding-vertical, 32px)
}

@media (max-width:767px) {
  .dex-accordion-header-title {
    font-size: 14px;
    font-size: var(--dex-okd-accordion-header-title-sm-font-size, 14px);
    font-weight: 500;
    font-weight: var(--dex-okd-accordion-header-title-sm-font-weight, 500);
    line-height: 16px;
    line-height: var(--dex-okd-accordion-header-title-sm-line-height, 16px)
  }

  .dex-accordion-header .dex-accordion-header-icon {
    font-size: 16px;
    font-size: var(--dex-okd-accordion-header-icon-sm-size, 16px)
  }

  .dex-accordion-content {
    font-size: 12px;
    font-size: var(--dex-okd-accordion-content-sm-font-size, 12px);
    font-weight: 400;
    font-weight: var(--dex-okd-accordion-content-sm-font-weight, 400);
    line-height: 1.58;
    line-height: var(--dex-okd-accordion-content-sm-line-height, 1.58)
  }
}

.dex-overflow {
  overflow: hidden
}

.dex-overflow-hidden {
  height: 0;
  opacity: 0;
  overflow-y: hidden;
  pointer-events: none;
  position: absolute
}

.dex-form-line>.dex-form-item-control>.dex-form-item-control-input>.dex-form-item-control-input-content {
  display: flex
}

.dex-form-line>.dex-form-item-control>.dex-form-item-control-input>.dex-form-item-control-input-content>.dex-form-item {
  margin-right: 16px
}

.dex-form-line>.dex-form-item-control>.dex-form-item-control-input>.dex-form-item-control-input-content>.dex-form-item:last-child {
  margin-right: 0
}

.dex-form-line.dex-form-line-column>.dex-form-item-control>.dex-form-item-control-input>.dex-form-item-control-input-content {
  flex-direction: column
}

.dex-form-line.dex-form-line-column>.dex-form-item-control>.dex-form-item-control-input>.dex-form-item-control-input-content>.dex-form-item {
  margin-right: 0
}

.dex-form-line.dex-form-line-hidden {
  display: none !important
}

.dex-a11y-selection {
  display: none
}

.dex-btn {
  -webkit-tap-highlight-color: transparent;
  align-items: center;
  -webkit-appearance: none;
  box-sizing: border-box;
  cursor: pointer;
  display: inline-flex;
  font-family: inherit;
  font-weight: 500;
  justify-content: center;
  outline: none;
  position: relative;
  text-decoration: none;
  touch-action: manipulation;
  -webkit-user-select: none;
  -moz-user-select: none;
  -ms-user-select: none;
  user-select: none
}

.dex-btn:focus-visible {
  outline: 2px solid var(--dex-okd-color-border-focus);
  outline-color: var(--dex-okd-color-border-focus);
  outline-offset: 2px;
  outline-style: solid;
  outline-width: 2px
}

.dex-btn.btn-fill-highlight {
  background: var(--dex-okd-button-fill-highlight-default-background);
  border-color: var(--dex-okd-button-fill-highlight-default-border-color);
  border-style: solid;
  border-width: var(--dex-okd-button-fill-highlight-border-size);
  box-shadow: var(--dex-okd-button-fill-highlight-default-shadow);
  color: var(--dex-okd-button-fill-highlight-default-font-color)
}

.dex-btn.btn-fill-highlight.hover,
.dex-btn.btn-fill-highlight:not(:disabled):not(.btn-disabled):not(.mobile):hover {
  background: var(--dex-okd-button-fill-highlight-hover-background);
  border-color: var(--dex-okd-button-fill-highlight-hover-border-color);
  box-shadow: var(--dex-okd-button-fill-highlight-hover-shadow);
  color: var(--dex-okd-button-fill-highlight-hover-font-color)
}

.dex-btn.btn-fill-highlight.hover .btn-icon,
.dex-btn.btn-fill-highlight:not(:disabled):not(.btn-disabled):not(.mobile):hover .btn-icon {
  color: var(--dex-okd-button-fill-highlight-hover-icon-color)
}

.dex-btn.btn-fill-highlight.active,
.dex-btn.btn-fill-highlight:not(:disabled):active {
  background: var(--dex-okd-button-fill-highlight-active-background);
  border-color: var(--dex-okd-button-fill-highlight-active-border-color);
  box-shadow: var(--dex-okd-button-fill-highlight-active-shadow);
  color: var(--dex-okd-button-fill-highlight-active-font-color)
}

.dex-btn.btn-fill-highlight.active .btn-icon,
.dex-btn.btn-fill-highlight:not(:disabled):active .btn-icon {
  color: var(--dex-okd-button-fill-highlight-active-icon-color)
}

.dex-btn.btn-fill-highlight:not(.loading).btn-disabled,
.dex-btn.btn-fill-highlight:not(.loading):disabled {
  background: var(--dex-okd-button-fill-highlight-disabled-background);
  border-color: var(--dex-okd-button-fill-highlight-disabled-border-color);
  box-shadow: var(--dex-okd-button-fill-highlight-disabled-shadow);
  color: var(--dex-okd-button-fill-highlight-disabled-font-color)
}

.dex-btn.btn-fill-highlight:not(.loading).btn-disabled .btn-icon,
.dex-btn.btn-fill-highlight:not(.loading):disabled .btn-icon {
  color: var(--dex-okd-button-fill-highlight-disabled-icon-color)
}

.dex-btn.btn-fill-highlight.loading {
  cursor: pointer
}

.dex-btn.btn-fill-highlight .btn-icon {
  color: var(--dex-okd-button-fill-highlight-default-icon-color)
}

.dex-btn.btn-fill-highlight .dex-btn-loader-text {
  color: var(--dex-okd-button-fill-highlight-default-font-color)
}

.dex-btn.btn-fill-highlight.btn-xxs {
  padding: calc(var(--dex-okd-button-xxs-padding-vertical) + 1px - var(--dex-okd-button-fill-highlight-border-size)) var(--dex-okd-button-xxs-padding-horizontal)
}

.dex-btn.btn-fill-highlight.btn-xxs.dex-btn-strict-circle {
  border-radius: 100px;
  height: calc(var(--dex-okd-button-xxs-padding-vertical)*2 + 2px - var(--dex-okd-button-fill-highlight-border-size)*2 + var(--dex-okd-button-xxs-line-height) + var(--dex-okd-button-fill-highlight-border-size)*2);
  min-width: 0;
  overflow: hidden;
  padding: 0;
  width: calc(var(--dex-okd-button-xxs-padding-vertical)*2 + 2px - var(--dex-okd-button-fill-highlight-border-size)*2 + var(--dex-okd-button-xxs-line-height) + var(--dex-okd-button-fill-highlight-border-size)*2)
}

.dex-btn.btn-fill-highlight.btn-xxs.dex-btn-strict-circle .btn-content {
  display: block;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  width: 100%
}

.dex-btn.btn-fill-highlight.btn-xs {
  padding: calc(var(--dex-okd-button-xs-padding-vertical) + 1px - var(--dex-okd-button-fill-highlight-border-size)) var(--dex-okd-button-xs-padding-horizontal)
}

.dex-btn.btn-fill-highlight.btn-xs.dex-btn-strict-circle {
  border-radius: 100px;
  height: calc(var(--dex-okd-button-xs-padding-vertical)*2 + 2px - var(--dex-okd-button-fill-highlight-border-size)*2 + var(--dex-okd-button-xs-line-height) + var(--dex-okd-button-fill-highlight-border-size)*2);
  min-width: 0;
  overflow: hidden;
  padding: 0;
  width: calc(var(--dex-okd-button-xs-padding-vertical)*2 + 2px - var(--dex-okd-button-fill-highlight-border-size)*2 + var(--dex-okd-button-xs-line-height) + var(--dex-okd-button-fill-highlight-border-size)*2)
}

.dex-btn.btn-fill-highlight.btn-xs.dex-btn-strict-circle .btn-content {
  display: block;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  width: 100%
}

.dex-btn.btn-fill-highlight.btn-s {
  padding: calc(var(--dex-okd-button-s-padding-vertical) + 1px - var(--dex-okd-button-fill-highlight-border-size)) var(--dex-okd-button-s-padding-horizontal)
}

.dex-btn.btn-fill-highlight.btn-s.dex-btn-strict-circle {
  border-radius: 100px;
  height: calc(var(--dex-okd-button-s-padding-vertical)*2 + 2px - var(--dex-okd-button-fill-highlight-border-size)*2 + var(--dex-okd-button-s-line-height) + var(--dex-okd-button-fill-highlight-border-size)*2);
  min-width: 0;
  overflow: hidden;
  padding: 0;
  width: calc(var(--dex-okd-button-s-padding-vertical)*2 + 2px - var(--dex-okd-button-fill-highlight-border-size)*2 + var(--dex-okd-button-s-line-height) + var(--dex-okd-button-fill-highlight-border-size)*2)
}

.dex-btn.btn-fill-highlight.btn-s.dex-btn-strict-circle .btn-content {
  display: block;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  width: 100%
}

.dex-btn.btn-fill-highlight.btn-sm {
  padding: calc(var(--dex-okd-button-sm-padding-vertical) + 1px - var(--dex-okd-button-fill-highlight-border-size)) var(--dex-okd-button-sm-padding-horizontal)
}

.dex-btn.btn-fill-highlight.btn-sm.dex-btn-strict-circle {
  border-radius: 100px;
  height: calc(var(--dex-okd-button-sm-padding-vertical)*2 + 2px - var(--dex-okd-button-fill-highlight-border-size)*2 + var(--dex-okd-button-sm-line-height) + var(--dex-okd-button-fill-highlight-border-size)*2);
  min-width: 0;
  overflow: hidden;
  padding: 0;
  width: calc(var(--dex-okd-button-sm-padding-vertical)*2 + 2px - var(--dex-okd-button-fill-highlight-border-size)*2 + var(--dex-okd-button-sm-line-height) + var(--dex-okd-button-fill-highlight-border-size)*2)
}

.dex-btn.btn-fill-highlight.btn-sm.dex-btn-strict-circle .btn-content {
  display: block;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  width: 100%
}

.dex-btn.btn-fill-highlight.btn-md {
  padding: calc(var(--dex-okd-button-md-padding-vertical) + 1px - var(--dex-okd-button-fill-highlight-border-size)) var(--dex-okd-button-md-padding-horizontal)
}

.dex-btn.btn-fill-highlight.btn-md.dex-btn-strict-circle {
  border-radius: 100px;
  height: calc(var(--dex-okd-button-md-padding-vertical)*2 + 2px - var(--dex-okd-button-fill-highlight-border-size)*2 + var(--dex-okd-button-md-line-height) + var(--dex-okd-button-fill-highlight-border-size)*2);
  min-width: 0;
  overflow: hidden;
  padding: 0;
  width: calc(var(--dex-okd-button-md-padding-vertical)*2 + 2px - var(--dex-okd-button-fill-highlight-border-size)*2 + var(--dex-okd-button-md-line-height) + var(--dex-okd-button-fill-highlight-border-size)*2)
}

.dex-btn.btn-fill-highlight.btn-md.dex-btn-strict-circle .btn-content {
  display: block;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  width: 100%
}

.dex-btn.btn-fill-highlight.btn-lg {
  padding: calc(var(--dex-okd-button-lg-padding-vertical) + 1px - var(--dex-okd-button-fill-highlight-border-size)) var(--dex-okd-button-lg-padding-horizontal)
}

.dex-btn.btn-fill-highlight.btn-lg.dex-btn-strict-circle {
  border-radius: 100px;
  height: calc(var(--dex-okd-button-lg-padding-vertical)*2 + 2px - var(--dex-okd-button-fill-highlight-border-size)*2 + var(--dex-okd-button-lg-line-height) + var(--dex-okd-button-fill-highlight-border-size)*2);
  min-width: 0;
  overflow: hidden;
  padding: 0;
  width: calc(var(--dex-okd-button-lg-padding-vertical)*2 + 2px - var(--dex-okd-button-fill-highlight-border-size)*2 + var(--dex-okd-button-lg-line-height) + var(--dex-okd-button-fill-highlight-border-size)*2)
}

.dex-btn.btn-fill-highlight.btn-lg.dex-btn-strict-circle .btn-content {
  display: block;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  width: 100%
}

.dex-btn.btn-fill-highlight.btn-xl {
  padding: calc(var(--dex-okd-button-xl-padding-vertical) + 1px - var(--dex-okd-button-fill-highlight-border-size)) var(--dex-okd-button-xl-padding-horizontal)
}

.dex-btn.btn-fill-highlight.btn-xl.dex-btn-strict-circle {
  border-radius: 100px;
  height: calc(var(--dex-okd-button-xl-padding-vertical)*2 + 2px - var(--dex-okd-button-fill-highlight-border-size)*2 + var(--dex-okd-button-xl-line-height) + var(--dex-okd-button-fill-highlight-border-size)*2);
  min-width: 0;
  overflow: hidden;
  padding: 0;
  width: calc(var(--dex-okd-button-xl-padding-vertical)*2 + 2px - var(--dex-okd-button-fill-highlight-border-size)*2 + var(--dex-okd-button-xl-line-height) + var(--dex-okd-button-fill-highlight-border-size)*2)
}

.dex-btn.btn-fill-highlight.btn-xl.dex-btn-strict-circle .btn-content {
  display: block;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  width: 100%
}

.dex-btn.btn-fill-primary {
  background: var(--dex-okd-button-fill-primary-default-background);
  border-color: var(--dex-okd-button-fill-primary-default-border-color);
  border-style: solid;
  border-width: var(--dex-okd-button-fill-primary-border-size);
  box-shadow: var(--dex-okd-button-fill-primary-default-shadow);
  color: var(--dex-okd-button-fill-primary-default-font-color)
}

.dex-btn.btn-fill-primary.hover,
.dex-btn.btn-fill-primary:not(:disabled):not(.btn-disabled):not(.mobile):hover {
  background: var(--dex-okd-button-fill-primary-hover-background);
  border-color: var(--dex-okd-button-fill-primary-hover-border-color);
  box-shadow: var(--dex-okd-button-fill-primary-hover-shadow);
  color: var(--dex-okd-button-fill-primary-hover-font-color)
}

.dex-btn.btn-fill-primary.hover .btn-icon,
.dex-btn.btn-fill-primary:not(:disabled):not(.btn-disabled):not(.mobile):hover .btn-icon {
  color: var(--dex-okd-button-fill-primary-hover-icon-color)
}

.dex-btn.btn-fill-primary.active,
.dex-btn.btn-fill-primary:not(:disabled):active {
  background: var(--dex-okd-button-fill-primary-active-background);
  border-color: var(--dex-okd-button-fill-primary-active-border-color);
  box-shadow: var(--dex-okd-button-fill-primary-active-shadow);
  color: var(--dex-okd-button-fill-primary-active-font-color)
}

.dex-btn.btn-fill-primary.active .btn-icon,
.dex-btn.btn-fill-primary:not(:disabled):active .btn-icon {
  color: var(--dex-okd-button-fill-primary-active-icon-color)
}

.dex-btn.btn-fill-primary:not(.loading).btn-disabled,
.dex-btn.btn-fill-primary:not(.loading):disabled {
  background: var(--dex-okd-button-fill-primary-disabled-background);
  border-color: var(--dex-okd-button-fill-primary-disabled-border-color);
  box-shadow: var(--dex-okd-button-fill-primary-disabled-shadow);
  color: var(--dex-okd-button-fill-primary-disabled-font-color)
}

.dex-btn.btn-fill-primary:not(.loading).btn-disabled .btn-icon,
.dex-btn.btn-fill-primary:not(.loading):disabled .btn-icon {
  color: var(--dex-okd-button-fill-primary-disabled-icon-color)
}

.dex-btn.btn-fill-primary.loading {
  cursor: pointer
}

.dex-btn.btn-fill-primary .btn-icon {
  color: var(--dex-okd-button-fill-primary-default-icon-color)
}

.dex-btn.btn-fill-primary .dex-btn-loader-text {
  color: var(--dex-okd-button-fill-primary-default-font-color)
}

.dex-btn.btn-fill-primary.btn-xxs {
  padding: calc(var(--dex-okd-button-xxs-padding-vertical) + 1px - var(--dex-okd-button-fill-primary-border-size)) var(--dex-okd-button-xxs-padding-horizontal)
}

.dex-btn.btn-fill-primary.btn-xxs.dex-btn-strict-circle {
  border-radius: 100px;
  height: calc(var(--dex-okd-button-xxs-padding-vertical)*2 + 2px - var(--dex-okd-button-fill-primary-border-size)*2 + var(--dex-okd-button-xxs-line-height) + var(--dex-okd-button-fill-primary-border-size)*2);
  min-width: 0;
  overflow: hidden;
  padding: 0;
  width: calc(var(--dex-okd-button-xxs-padding-vertical)*2 + 2px - var(--dex-okd-button-fill-primary-border-size)*2 + var(--dex-okd-button-xxs-line-height) + var(--dex-okd-button-fill-primary-border-size)*2)
}

.dex-btn.btn-fill-primary.btn-xxs.dex-btn-strict-circle .btn-content {
  display: block;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  width: 100%
}

.dex-btn.btn-fill-primary.btn-xs {
  padding: calc(var(--dex-okd-button-xs-padding-vertical) + 1px - var(--dex-okd-button-fill-primary-border-size)) var(--dex-okd-button-xs-padding-horizontal)
}

.dex-btn.btn-fill-primary.btn-xs.dex-btn-strict-circle {
  border-radius: 100px;
  height: calc(var(--dex-okd-button-xs-padding-vertical)*2 + 2px - var(--dex-okd-button-fill-primary-border-size)*2 + var(--dex-okd-button-xs-line-height) + var(--dex-okd-button-fill-primary-border-size)*2);
  min-width: 0;
  overflow: hidden;
  padding: 0;
  width: calc(var(--dex-okd-button-xs-padding-vertical)*2 + 2px - var(--dex-okd-button-fill-primary-border-size)*2 + var(--dex-okd-button-xs-line-height) + var(--dex-okd-button-fill-primary-border-size)*2)
}

.dex-btn.btn-fill-primary.btn-xs.dex-btn-strict-circle .btn-content {
  display: block;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  width: 100%
}

.dex-btn.btn-fill-primary.btn-s {
  padding: calc(var(--dex-okd-button-s-padding-vertical) + 1px - var(--dex-okd-button-fill-primary-border-size)) var(--dex-okd-button-s-padding-horizontal)
}

.dex-btn.btn-fill-primary.btn-s.dex-btn-strict-circle {
  border-radius: 100px;
  height: calc(var(--dex-okd-button-s-padding-vertical)*2 + 2px - var(--dex-okd-button-fill-primary-border-size)*2 + var(--dex-okd-button-s-line-height) + var(--dex-okd-button-fill-primary-border-size)*2);
  min-width: 0;
  overflow: hidden;
  padding: 0;
  width: calc(var(--dex-okd-button-s-padding-vertical)*2 + 2px - var(--dex-okd-button-fill-primary-border-size)*2 + var(--dex-okd-button-s-line-height) + var(--dex-okd-button-fill-primary-border-size)*2)
}

.dex-btn.btn-fill-primary.btn-s.dex-btn-strict-circle .btn-content {
  display: block;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  width: 100%
}

.dex-btn.btn-fill-primary.btn-sm {
  padding: calc(var(--dex-okd-button-sm-padding-vertical) + 1px - var(--dex-okd-button-fill-primary-border-size)) var(--dex-okd-button-sm-padding-horizontal)
}

.dex-btn.btn-fill-primary.btn-sm.dex-btn-strict-circle {
  border-radius: 100px;
  height: calc(var(--dex-okd-button-sm-padding-vertical)*2 + 2px - var(--dex-okd-button-fill-primary-border-size)*2 + var(--dex-okd-button-sm-line-height) + var(--dex-okd-button-fill-primary-border-size)*2);
  min-width: 0;
  overflow: hidden;
  padding: 0;
  width: calc(var(--dex-okd-button-sm-padding-vertical)*2 + 2px - var(--dex-okd-button-fill-primary-border-size)*2 + var(--dex-okd-button-sm-line-height) + var(--dex-okd-button-fill-primary-border-size)*2)
}

.dex-btn.btn-fill-primary.btn-sm.dex-btn-strict-circle .btn-content {
  display: block;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  width: 100%
}

.dex-btn.btn-fill-primary.btn-md {
  padding: calc(var(--dex-okd-button-md-padding-vertical) + 1px - var(--dex-okd-button-fill-primary-border-size)) var(--dex-okd-button-md-padding-horizontal)
}

.dex-btn.btn-fill-primary.btn-md.dex-btn-strict-circle {
  border-radius: 100px;
  height: calc(var(--dex-okd-button-md-padding-vertical)*2 + 2px - var(--dex-okd-button-fill-primary-border-size)*2 + var(--dex-okd-button-md-line-height) + var(--dex-okd-button-fill-primary-border-size)*2);
  min-width: 0;
  overflow: hidden;
  padding: 0;
  width: calc(var(--dex-okd-button-md-padding-vertical)*2 + 2px - var(--dex-okd-button-fill-primary-border-size)*2 + var(--dex-okd-button-md-line-height) + var(--dex-okd-button-fill-primary-border-size)*2)
}

.dex-btn.btn-fill-primary.btn-md.dex-btn-strict-circle .btn-content {
  display: block;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  width: 100%
}

.dex-btn.btn-fill-primary.btn-lg {
  padding: calc(var(--dex-okd-button-lg-padding-vertical) + 1px - var(--dex-okd-button-fill-primary-border-size)) var(--dex-okd-button-lg-padding-horizontal)
}

.dex-btn.btn-fill-primary.btn-lg.dex-btn-strict-circle {
  border-radius: 100px;
  height: calc(var(--dex-okd-button-lg-padding-vertical)*2 + 2px - var(--dex-okd-button-fill-primary-border-size)*2 + var(--dex-okd-button-lg-line-height) + var(--dex-okd-button-fill-primary-border-size)*2);
  min-width: 0;
  overflow: hidden;
  padding: 0;
  width: calc(var(--dex-okd-button-lg-padding-vertical)*2 + 2px - var(--dex-okd-button-fill-primary-border-size)*2 + var(--dex-okd-button-lg-line-height) + var(--dex-okd-button-fill-primary-border-size)*2)
}

.dex-btn.btn-fill-primary.btn-lg.dex-btn-strict-circle .btn-content {
  display: block;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  width: 100%
}

.dex-btn.btn-fill-primary.btn-xl {
  padding: calc(var(--dex-okd-button-xl-padding-vertical) + 1px - var(--dex-okd-button-fill-primary-border-size)) var(--dex-okd-button-xl-padding-horizontal)
}

.dex-btn.btn-fill-primary.btn-xl.dex-btn-strict-circle {
  border-radius: 100px;
  height: calc(var(--dex-okd-button-xl-padding-vertical)*2 + 2px - var(--dex-okd-button-fill-primary-border-size)*2 + var(--dex-okd-button-xl-line-height) + var(--dex-okd-button-fill-primary-border-size)*2);
  min-width: 0;
  overflow: hidden;
  padding: 0;
  width: calc(var(--dex-okd-button-xl-padding-vertical)*2 + 2px - var(--dex-okd-button-fill-primary-border-size)*2 + var(--dex-okd-button-xl-line-height) + var(--dex-okd-button-fill-primary-border-size)*2)
}

.dex-btn.btn-fill-primary.btn-xl.dex-btn-strict-circle .btn-content {
  display: block;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  width: 100%
}

.dex-btn.btn-fill-secondary {
  background: var(--dex-okd-button-fill-secondary-default-background);
  border-color: var(--dex-okd-button-fill-secondary-default-border-color);
  border-style: solid;
  border-width: var(--dex-okd-button-fill-secondary-border-size);
  box-shadow: var(--dex-okd-button-fill-secondary-default-shadow);
  color: var(--dex-okd-button-fill-secondary-default-font-color)
}

.dex-btn.btn-fill-secondary.hover,
.dex-btn.btn-fill-secondary:not(:disabled):not(.btn-disabled):not(.mobile):hover {
  background: var(--dex-okd-button-fill-secondary-hover-background);
  border-color: var(--dex-okd-button-fill-secondary-hover-border-color);
  box-shadow: var(--dex-okd-button-fill-secondary-hover-shadow);
  color: var(--dex-okd-button-fill-secondary-hover-font-color)
}

.dex-btn.btn-fill-secondary.hover .btn-icon,
.dex-btn.btn-fill-secondary:not(:disabled):not(.btn-disabled):not(.mobile):hover .btn-icon {
  color: var(--dex-okd-button-fill-secondary-hover-icon-color)
}

.dex-btn.btn-fill-secondary.active,
.dex-btn.btn-fill-secondary:not(:disabled):active {
  background: var(--dex-okd-button-fill-secondary-active-background);
  border-color: var(--dex-okd-button-fill-secondary-active-border-color);
  box-shadow: var(--dex-okd-button-fill-secondary-active-shadow);
  color: var(--dex-okd-button-fill-secondary-active-font-color)
}

.dex-btn.btn-fill-secondary.active .btn-icon,
.dex-btn.btn-fill-secondary:not(:disabled):active .btn-icon {
  color: var(--dex-okd-button-fill-secondary-active-icon-color)
}

.dex-btn.btn-fill-secondary:not(.loading).btn-disabled,
.dex-btn.btn-fill-secondary:not(.loading):disabled {
  background: var(--dex-okd-button-fill-secondary-disabled-background);
  border-color: var(--dex-okd-button-fill-secondary-disabled-border-color);
  box-shadow: var(--dex-okd-button-fill-secondary-disabled-shadow);
  color: var(--dex-okd-button-fill-secondary-disabled-font-color)
}

.dex-btn.btn-fill-secondary:not(.loading).btn-disabled .btn-icon,
.dex-btn.btn-fill-secondary:not(.loading):disabled .btn-icon {
  color: var(--dex-okd-button-fill-secondary-disabled-icon-color)
}

.dex-btn.btn-fill-secondary.loading {
  cursor: pointer
}

.dex-btn.btn-fill-secondary .btn-icon {
  color: var(--dex-okd-button-fill-secondary-default-icon-color)
}

.dex-btn.btn-fill-secondary .dex-btn-loader-text {
  color: var(--dex-okd-button-fill-secondary-default-font-color)
}

.dex-btn.btn-fill-secondary.btn-xxs {
  padding: calc(var(--dex-okd-button-xxs-padding-vertical) + 1px - var(--dex-okd-button-fill-secondary-border-size)) var(--dex-okd-button-xxs-padding-horizontal)
}

.dex-btn.btn-fill-secondary.btn-xxs.dex-btn-strict-circle {
  border-radius: 100px;
  height: calc(var(--dex-okd-button-xxs-padding-vertical)*2 + 2px - var(--dex-okd-button-fill-secondary-border-size)*2 + var(--dex-okd-button-xxs-line-height) + var(--dex-okd-button-fill-secondary-border-size)*2);
  min-width: 0;
  overflow: hidden;
  padding: 0;
  width: calc(var(--dex-okd-button-xxs-padding-vertical)*2 + 2px - var(--dex-okd-button-fill-secondary-border-size)*2 + var(--dex-okd-button-xxs-line-height) + var(--dex-okd-button-fill-secondary-border-size)*2)
}

.dex-btn.btn-fill-secondary.btn-xxs.dex-btn-strict-circle .btn-content {
  display: block;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  width: 100%
}

.dex-btn.btn-fill-secondary.btn-xs {
  padding: calc(var(--dex-okd-button-xs-padding-vertical) + 1px - var(--dex-okd-button-fill-secondary-border-size)) var(--dex-okd-button-xs-padding-horizontal)
}

.dex-btn.btn-fill-secondary.btn-xs.dex-btn-strict-circle {
  border-radius: 100px;
  height: calc(var(--dex-okd-button-xs-padding-vertical)*2 + 2px - var(--dex-okd-button-fill-secondary-border-size)*2 + var(--dex-okd-button-xs-line-height) + var(--dex-okd-button-fill-secondary-border-size)*2);
  min-width: 0;
  overflow: hidden;
  padding: 0;
  width: calc(var(--dex-okd-button-xs-padding-vertical)*2 + 2px - var(--dex-okd-button-fill-secondary-border-size)*2 + var(--dex-okd-button-xs-line-height) + var(--dex-okd-button-fill-secondary-border-size)*2)
}

.dex-btn.btn-fill-secondary.btn-xs.dex-btn-strict-circle .btn-content {
  display: block;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  width: 100%
}

.dex-btn.btn-fill-secondary.btn-s {
  padding: calc(var(--dex-okd-button-s-padding-vertical) + 1px - var(--dex-okd-button-fill-secondary-border-size)) var(--dex-okd-button-s-padding-horizontal)
}

.dex-btn.btn-fill-secondary.btn-s.dex-btn-strict-circle {
  border-radius: 100px;
  height: calc(var(--dex-okd-button-s-padding-vertical)*2 + 2px - var(--dex-okd-button-fill-secondary-border-size)*2 + var(--dex-okd-button-s-line-height) + var(--dex-okd-button-fill-secondary-border-size)*2);
  min-width: 0;
  overflow: hidden;
  padding: 0;
  width: calc(var(--dex-okd-button-s-padding-vertical)*2 + 2px - var(--dex-okd-button-fill-secondary-border-size)*2 + var(--dex-okd-button-s-line-height) + var(--dex-okd-button-fill-secondary-border-size)*2)
}

.dex-btn.btn-fill-secondary.btn-s.dex-btn-strict-circle .btn-content {
  display: block;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  width: 100%
}

.dex-btn.btn-fill-secondary.btn-sm {
  padding: calc(var(--dex-okd-button-sm-padding-vertical) + 1px - var(--dex-okd-button-fill-secondary-border-size)) var(--dex-okd-button-sm-padding-horizontal)
}

.dex-btn.btn-fill-secondary.btn-sm.dex-btn-strict-circle {
  border-radius: 100px;
  height: calc(var(--dex-okd-button-sm-padding-vertical)*2 + 2px - var(--dex-okd-button-fill-secondary-border-size)*2 + var(--dex-okd-button-sm-line-height) + var(--dex-okd-button-fill-secondary-border-size)*2);
  min-width: 0;
  overflow: hidden;
  padding: 0;
  width: calc(var(--dex-okd-button-sm-padding-vertical)*2 + 2px - var(--dex-okd-button-fill-secondary-border-size)*2 + var(--dex-okd-button-sm-line-height) + var(--dex-okd-button-fill-secondary-border-size)*2)
}

.dex-btn.btn-fill-secondary.btn-sm.dex-btn-strict-circle .btn-content {
  display: block;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  width: 100%
}

.dex-btn.btn-fill-secondary.btn-md {
  padding: calc(var(--dex-okd-button-md-padding-vertical) + 1px - var(--dex-okd-button-fill-secondary-border-size)) var(--dex-okd-button-md-padding-horizontal)
}

.dex-btn.btn-fill-secondary.btn-md.dex-btn-strict-circle {
  border-radius: 100px;
  height: calc(var(--dex-okd-button-md-padding-vertical)*2 + 2px - var(--dex-okd-button-fill-secondary-border-size)*2 + var(--dex-okd-button-md-line-height) + var(--dex-okd-button-fill-secondary-border-size)*2);
  min-width: 0;
  overflow: hidden;
  padding: 0;
  width: calc(var(--dex-okd-button-md-padding-vertical)*2 + 2px - var(--dex-okd-button-fill-secondary-border-size)*2 + var(--dex-okd-button-md-line-height) + var(--dex-okd-button-fill-secondary-border-size)*2)
}

.dex-btn.btn-fill-secondary.btn-md.dex-btn-strict-circle .btn-content {
  display: block;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  width: 100%
}

.dex-btn.btn-fill-secondary.btn-lg {
  padding: calc(var(--dex-okd-button-lg-padding-vertical) + 1px - var(--dex-okd-button-fill-secondary-border-size)) var(--dex-okd-button-lg-padding-horizontal)
}

.dex-btn.btn-fill-secondary.btn-lg.dex-btn-strict-circle {
  border-radius: 100px;
  height: calc(var(--dex-okd-button-lg-padding-vertical)*2 + 2px - var(--dex-okd-button-fill-secondary-border-size)*2 + var(--dex-okd-button-lg-line-height) + var(--dex-okd-button-fill-secondary-border-size)*2);
  min-width: 0;
  overflow: hidden;
  padding: 0;
  width: calc(var(--dex-okd-button-lg-padding-vertical)*2 + 2px - var(--dex-okd-button-fill-secondary-border-size)*2 + var(--dex-okd-button-lg-line-height) + var(--dex-okd-button-fill-secondary-border-size)*2)
}

.dex-btn.btn-fill-secondary.btn-lg.dex-btn-strict-circle .btn-content {
  display: block;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  width: 100%
}

.dex-btn.btn-fill-secondary.btn-xl {
  padding: calc(var(--dex-okd-button-xl-padding-vertical) + 1px - var(--dex-okd-button-fill-secondary-border-size)) var(--dex-okd-button-xl-padding-horizontal)
}

.dex-btn.btn-fill-secondary.btn-xl.dex-btn-strict-circle {
  border-radius: 100px;
  height: calc(var(--dex-okd-button-xl-padding-vertical)*2 + 2px - var(--dex-okd-button-fill-secondary-border-size)*2 + var(--dex-okd-button-xl-line-height) + var(--dex-okd-button-fill-secondary-border-size)*2);
  min-width: 0;
  overflow: hidden;
  padding: 0;
  width: calc(var(--dex-okd-button-xl-padding-vertical)*2 + 2px - var(--dex-okd-button-fill-secondary-border-size)*2 + var(--dex-okd-button-xl-line-height) + var(--dex-okd-button-fill-secondary-border-size)*2)
}

.dex-btn.btn-fill-secondary.btn-xl.dex-btn-strict-circle .btn-content {
  display: block;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  width: 100%
}

.dex-btn.btn-fill-tertiary {
  background: var(--dex-okd-button-fill-tertiary-default-background);
  border-color: var(--dex-okd-button-fill-tertiary-default-border-color);
  border-style: solid;
  border-width: var(--dex-okd-button-fill-tertiary-border-size);
  box-shadow: var(--dex-okd-button-fill-tertiary-default-shadow);
  color: var(--dex-okd-button-fill-tertiary-default-font-color)
}

.dex-btn.btn-fill-tertiary.hover,
.dex-btn.btn-fill-tertiary:not(:disabled):not(.btn-disabled):not(.mobile):hover {
  background: var(--dex-okd-button-fill-tertiary-hover-background);
  border-color: var(--dex-okd-button-fill-tertiary-hover-border-color);
  box-shadow: var(--dex-okd-button-fill-tertiary-hover-shadow);
  color: var(--dex-okd-button-fill-tertiary-hover-font-color)
}

.dex-btn.btn-fill-tertiary.hover .btn-icon,
.dex-btn.btn-fill-tertiary:not(:disabled):not(.btn-disabled):not(.mobile):hover .btn-icon {
  color: var(--dex-okd-button-fill-tertiary-hover-icon-color)
}

.dex-btn.btn-fill-tertiary.active,
.dex-btn.btn-fill-tertiary:not(:disabled):active {
  background: var(--dex-okd-button-fill-tertiary-active-background);
  border-color: var(--dex-okd-button-fill-tertiary-active-border-color);
  box-shadow: var(--dex-okd-button-fill-tertiary-active-shadow);
  color: var(--dex-okd-button-fill-tertiary-active-font-color)
}

.dex-btn.btn-fill-tertiary.active .btn-icon,
.dex-btn.btn-fill-tertiary:not(:disabled):active .btn-icon {
  color: var(--dex-okd-button-fill-tertiary-active-icon-color)
}

.dex-btn.btn-fill-tertiary:not(.loading).btn-disabled,
.dex-btn.btn-fill-tertiary:not(.loading):disabled {
  background: var(--dex-okd-button-fill-tertiary-disabled-background);
  border-color: var(--dex-okd-button-fill-tertiary-disabled-border-color);
  box-shadow: var(--dex-okd-button-fill-tertiary-disabled-shadow);
  color: var(--dex-okd-button-fill-tertiary-disabled-font-color)
}

.dex-btn.btn-fill-tertiary:not(.loading).btn-disabled .btn-icon,
.dex-btn.btn-fill-tertiary:not(.loading):disabled .btn-icon {
  color: var(--dex-okd-button-fill-tertiary-disabled-icon-color)
}

.dex-btn.btn-fill-tertiary.loading {
  cursor: pointer
}

.dex-btn.btn-fill-tertiary .btn-icon {
  color: var(--dex-okd-button-fill-tertiary-default-icon-color)
}

.dex-btn.btn-fill-tertiary .dex-btn-loader-text {
  color: var(--dex-okd-button-fill-tertiary-default-font-color)
}

.dex-btn.btn-fill-tertiary.btn-xxs {
  padding: calc(var(--dex-okd-button-xxs-padding-vertical) + 1px - var(--dex-okd-button-fill-tertiary-border-size)) var(--dex-okd-button-xxs-padding-horizontal)
}

.dex-btn.btn-fill-tertiary.btn-xxs.dex-btn-strict-circle {
  border-radius: 100px;
  height: calc(var(--dex-okd-button-xxs-padding-vertical)*2 + 2px - var(--dex-okd-button-fill-tertiary-border-size)*2 + var(--dex-okd-button-xxs-line-height) + var(--dex-okd-button-fill-tertiary-border-size)*2);
  min-width: 0;
  overflow: hidden;
  padding: 0;
  width: calc(var(--dex-okd-button-xxs-padding-vertical)*2 + 2px - var(--dex-okd-button-fill-tertiary-border-size)*2 + var(--dex-okd-button-xxs-line-height) + var(--dex-okd-button-fill-tertiary-border-size)*2)
}

.dex-btn.btn-fill-tertiary.btn-xxs.dex-btn-strict-circle .btn-content {
  display: block;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  width: 100%
}

.dex-btn.btn-fill-tertiary.btn-xs {
  padding: calc(var(--dex-okd-button-xs-padding-vertical) + 1px - var(--dex-okd-button-fill-tertiary-border-size)) var(--dex-okd-button-xs-padding-horizontal)
}

.dex-btn.btn-fill-tertiary.btn-xs.dex-btn-strict-circle {
  border-radius: 100px;
  height: calc(var(--dex-okd-button-xs-padding-vertical)*2 + 2px - var(--dex-okd-button-fill-tertiary-border-size)*2 + var(--dex-okd-button-xs-line-height) + var(--dex-okd-button-fill-tertiary-border-size)*2);
  min-width: 0;
  overflow: hidden;
  padding: 0;
  width: calc(var(--dex-okd-button-xs-padding-vertical)*2 + 2px - var(--dex-okd-button-fill-tertiary-border-size)*2 + var(--dex-okd-button-xs-line-height) + var(--dex-okd-button-fill-tertiary-border-size)*2)
}

.dex-btn.btn-fill-tertiary.btn-xs.dex-btn-strict-circle .btn-content {
  display: block;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  width: 100%
}

.dex-btn.btn-fill-tertiary.btn-s {
  padding: calc(var(--dex-okd-button-s-padding-vertical) + 1px - var(--dex-okd-button-fill-tertiary-border-size)) var(--dex-okd-button-s-padding-horizontal)
}

.dex-btn.btn-fill-tertiary.btn-s.dex-btn-strict-circle {
  border-radius: 100px;
  height: calc(var(--dex-okd-button-s-padding-vertical)*2 + 2px - var(--dex-okd-button-fill-tertiary-border-size)*2 + var(--dex-okd-button-s-line-height) + var(--dex-okd-button-fill-tertiary-border-size)*2);
  min-width: 0;
  overflow: hidden;
  padding: 0;
  width: calc(var(--dex-okd-button-s-padding-vertical)*2 + 2px - var(--dex-okd-button-fill-tertiary-border-size)*2 + var(--dex-okd-button-s-line-height) + var(--dex-okd-button-fill-tertiary-border-size)*2)
}

.dex-btn.btn-fill-tertiary.btn-s.dex-btn-strict-circle .btn-content {
  display: block;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  width: 100%
}

.dex-btn.btn-fill-tertiary.btn-sm {
  padding: calc(var(--dex-okd-button-sm-padding-vertical) + 1px - var(--dex-okd-button-fill-tertiary-border-size)) var(--dex-okd-button-sm-padding-horizontal)
}

.dex-btn.btn-fill-tertiary.btn-sm.dex-btn-strict-circle {
  border-radius: 100px;
  height: calc(var(--dex-okd-button-sm-padding-vertical)*2 + 2px - var(--dex-okd-button-fill-tertiary-border-size)*2 + var(--dex-okd-button-sm-line-height) + var(--dex-okd-button-fill-tertiary-border-size)*2);
  min-width: 0;
  overflow: hidden;
  padding: 0;
  width: calc(var(--dex-okd-button-sm-padding-vertical)*2 + 2px - var(--dex-okd-button-fill-tertiary-border-size)*2 + var(--dex-okd-button-sm-line-height) + var(--dex-okd-button-fill-tertiary-border-size)*2)
}

.dex-btn.btn-fill-tertiary.btn-sm.dex-btn-strict-circle .btn-content {
  display: block;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  width: 100%
}

.dex-btn.btn-fill-tertiary.btn-md {
  padding: calc(var(--dex-okd-button-md-padding-vertical) + 1px - var(--dex-okd-button-fill-tertiary-border-size)) var(--dex-okd-button-md-padding-horizontal)
}

.dex-btn.btn-fill-tertiary.btn-md.dex-btn-strict-circle {
  border-radius: 100px;
  height: calc(var(--dex-okd-button-md-padding-vertical)*2 + 2px - var(--dex-okd-button-fill-tertiary-border-size)*2 + var(--dex-okd-button-md-line-height) + var(--dex-okd-button-fill-tertiary-border-size)*2);
  min-width: 0;
  overflow: hidden;
  padding: 0;
  width: calc(var(--dex-okd-button-md-padding-vertical)*2 + 2px - var(--dex-okd-button-fill-tertiary-border-size)*2 + var(--dex-okd-button-md-line-height) + var(--dex-okd-button-fill-tertiary-border-size)*2)
}

.dex-btn.btn-fill-tertiary.btn-md.dex-btn-strict-circle .btn-content {
  display: block;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  width: 100%
}

.dex-btn.btn-fill-tertiary.btn-lg {
  padding: calc(var(--dex-okd-button-lg-padding-vertical) + 1px - var(--dex-okd-button-fill-tertiary-border-size)) var(--dex-okd-button-lg-padding-horizontal)
}

.dex-btn.btn-fill-tertiary.btn-lg.dex-btn-strict-circle {
  border-radius: 100px;
  height: calc(var(--dex-okd-button-lg-padding-vertical)*2 + 2px - var(--dex-okd-button-fill-tertiary-border-size)*2 + var(--dex-okd-button-lg-line-height) + var(--dex-okd-button-fill-tertiary-border-size)*2);
  min-width: 0;
  overflow: hidden;
  padding: 0;
  width: calc(var(--dex-okd-button-lg-padding-vertical)*2 + 2px - var(--dex-okd-button-fill-tertiary-border-size)*2 + var(--dex-okd-button-lg-line-height) + var(--dex-okd-button-fill-tertiary-border-size)*2)
}

.dex-btn.btn-fill-tertiary.btn-lg.dex-btn-strict-circle .btn-content {
  display: block;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  width: 100%
}

.dex-btn.btn-fill-tertiary.btn-xl {
  padding: calc(var(--dex-okd-button-xl-padding-vertical) + 1px - var(--dex-okd-button-fill-tertiary-border-size)) var(--dex-okd-button-xl-padding-horizontal)
}

.dex-btn.btn-fill-tertiary.btn-xl.dex-btn-strict-circle {
  border-radius: 100px;
  height: calc(var(--dex-okd-button-xl-padding-vertical)*2 + 2px - var(--dex-okd-button-fill-tertiary-border-size)*2 + var(--dex-okd-button-xl-line-height) + var(--dex-okd-button-fill-tertiary-border-size)*2);
  min-width: 0;
  overflow: hidden;
  padding: 0;
  width: calc(var(--dex-okd-button-xl-padding-vertical)*2 + 2px - var(--dex-okd-button-fill-tertiary-border-size)*2 + var(--dex-okd-button-xl-line-height) + var(--dex-okd-button-fill-tertiary-border-size)*2)
}

.dex-btn.btn-fill-tertiary.btn-xl.dex-btn-strict-circle .btn-content {
  display: block;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  width: 100%
}

.dex-btn.btn-fill-quaternary {
  background: var(--dex-okd-button-fill-quaternary-default-background);
  border-color: var(--dex-okd-button-fill-quaternary-default-border-color);
  border-style: solid;
  border-width: var(--dex-okd-button-fill-quaternary-border-size);
  box-shadow: var(--dex-okd-button-fill-quaternary-default-shadow);
  color: var(--dex-okd-button-fill-quaternary-default-font-color)
}

.dex-btn.btn-fill-quaternary.hover,
.dex-btn.btn-fill-quaternary:not(:disabled):not(.btn-disabled):not(.mobile):hover {
  background: var(--dex-okd-button-fill-quaternary-hover-background);
  border-color: var(--dex-okd-button-fill-quaternary-hover-border-color);
  box-shadow: var(--dex-okd-button-fill-quaternary-hover-shadow);
  color: var(--dex-okd-button-fill-quaternary-hover-font-color)
}

.dex-btn.btn-fill-quaternary.hover .btn-icon,
.dex-btn.btn-fill-quaternary:not(:disabled):not(.btn-disabled):not(.mobile):hover .btn-icon {
  color: var(--dex-okd-button-fill-quaternary-hover-icon-color)
}

.dex-btn.btn-fill-quaternary.active,
.dex-btn.btn-fill-quaternary:not(:disabled):active {
  background: var(--dex-okd-button-fill-quaternary-active-background);
  border-color: var(--dex-okd-button-fill-quaternary-active-border-color);
  box-shadow: var(--dex-okd-button-fill-quaternary-active-shadow);
  color: var(--dex-okd-button-fill-quaternary-active-font-color)
}

.dex-btn.btn-fill-quaternary.active .btn-icon,
.dex-btn.btn-fill-quaternary:not(:disabled):active .btn-icon {
  color: var(--dex-okd-button-fill-quaternary-active-icon-color)
}

.dex-btn.btn-fill-quaternary:not(.loading).btn-disabled,
.dex-btn.btn-fill-quaternary:not(.loading):disabled {
  background: var(--dex-okd-button-fill-quaternary-disabled-background);
  border-color: var(--dex-okd-button-fill-quaternary-disabled-border-color);
  box-shadow: var(--dex-okd-button-fill-quaternary-disabled-shadow);
  color: var(--dex-okd-button-fill-quaternary-disabled-font-color)
}

.dex-btn.btn-fill-quaternary:not(.loading).btn-disabled .btn-icon,
.dex-btn.btn-fill-quaternary:not(.loading):disabled .btn-icon {
  color: var(--dex-okd-button-fill-quaternary-disabled-icon-color)
}

.dex-btn.btn-fill-quaternary.loading {
  cursor: pointer
}

.dex-btn.btn-fill-quaternary .btn-icon {
  color: var(--dex-okd-button-fill-quaternary-default-icon-color)
}

.dex-btn.btn-fill-quaternary .dex-btn-loader-text {
  color: var(--dex-okd-button-fill-quaternary-default-font-color)
}

.dex-btn.btn-fill-quaternary.btn-xxs {
  padding: calc(var(--dex-okd-button-xxs-padding-vertical) + 1px - var(--dex-okd-button-fill-quaternary-border-size)) var(--dex-okd-button-xxs-padding-horizontal)
}

.dex-btn.btn-fill-quaternary.btn-xxs.dex-btn-strict-circle {
  border-radius: 100px;
  height: calc(var(--dex-okd-button-xxs-padding-vertical)*2 + 2px - var(--dex-okd-button-fill-quaternary-border-size)*2 + var(--dex-okd-button-xxs-line-height) + var(--dex-okd-button-fill-quaternary-border-size)*2);
  min-width: 0;
  overflow: hidden;
  padding: 0;
  width: calc(var(--dex-okd-button-xxs-padding-vertical)*2 + 2px - var(--dex-okd-button-fill-quaternary-border-size)*2 + var(--dex-okd-button-xxs-line-height) + var(--dex-okd-button-fill-quaternary-border-size)*2)
}

.dex-btn.btn-fill-quaternary.btn-xxs.dex-btn-strict-circle .btn-content {
  display: block;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  width: 100%
}

.dex-btn.btn-fill-quaternary.btn-xs {
  padding: calc(var(--dex-okd-button-xs-padding-vertical) + 1px - var(--dex-okd-button-fill-quaternary-border-size)) var(--dex-okd-button-xs-padding-horizontal)
}

.dex-btn.btn-fill-quaternary.btn-xs.dex-btn-strict-circle {
  border-radius: 100px;
  height: calc(var(--dex-okd-button-xs-padding-vertical)*2 + 2px - var(--dex-okd-button-fill-quaternary-border-size)*2 + var(--dex-okd-button-xs-line-height) + var(--dex-okd-button-fill-quaternary-border-size)*2);
  min-width: 0;
  overflow: hidden;
  padding: 0;
  width: calc(var(--dex-okd-button-xs-padding-vertical)*2 + 2px - var(--dex-okd-button-fill-quaternary-border-size)*2 + var(--dex-okd-button-xs-line-height) + var(--dex-okd-button-fill-quaternary-border-size)*2)
}

.dex-btn.btn-fill-quaternary.btn-xs.dex-btn-strict-circle .btn-content {
  display: block;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  width: 100%
}

.dex-btn.btn-fill-quaternary.btn-s {
  padding: calc(var(--dex-okd-button-s-padding-vertical) + 1px - var(--dex-okd-button-fill-quaternary-border-size)) var(--dex-okd-button-s-padding-horizontal)
}

.dex-btn.btn-fill-quaternary.btn-s.dex-btn-strict-circle {
  border-radius: 100px;
  height: calc(var(--dex-okd-button-s-padding-vertical)*2 + 2px - var(--dex-okd-button-fill-quaternary-border-size)*2 + var(--dex-okd-button-s-line-height) + var(--dex-okd-button-fill-quaternary-border-size)*2);
  min-width: 0;
  overflow: hidden;
  padding: 0;
  width: calc(var(--dex-okd-button-s-padding-vertical)*2 + 2px - var(--dex-okd-button-fill-quaternary-border-size)*2 + var(--dex-okd-button-s-line-height) + var(--dex-okd-button-fill-quaternary-border-size)*2)
}

.dex-btn.btn-fill-quaternary.btn-s.dex-btn-strict-circle .btn-content {
  display: block;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  width: 100%
}

.dex-btn.btn-fill-quaternary.btn-sm {
  padding: calc(var(--dex-okd-button-sm-padding-vertical) + 1px - var(--dex-okd-button-fill-quaternary-border-size)) var(--dex-okd-button-sm-padding-horizontal)
}

.dex-btn.btn-fill-quaternary.btn-sm.dex-btn-strict-circle {
  border-radius: 100px;
  height: calc(var(--dex-okd-button-sm-padding-vertical)*2 + 2px - var(--dex-okd-button-fill-quaternary-border-size)*2 + var(--dex-okd-button-sm-line-height) + var(--dex-okd-button-fill-quaternary-border-size)*2);
  min-width: 0;
  overflow: hidden;
  padding: 0;
  width: calc(var(--dex-okd-button-sm-padding-vertical)*2 + 2px - var(--dex-okd-button-fill-quaternary-border-size)*2 + var(--dex-okd-button-sm-line-height) + var(--dex-okd-button-fill-quaternary-border-size)*2)
}

.dex-btn.btn-fill-quaternary.btn-sm.dex-btn-strict-circle .btn-content {
  display: block;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  width: 100%
}

.dex-btn.btn-fill-quaternary.btn-md {
  padding: calc(var(--dex-okd-button-md-padding-vertical) + 1px - var(--dex-okd-button-fill-quaternary-border-size)) var(--dex-okd-button-md-padding-horizontal)
}

.dex-btn.btn-fill-quaternary.btn-md.dex-btn-strict-circle {
  border-radius: 100px;
  height: calc(var(--dex-okd-button-md-padding-vertical)*2 + 2px - var(--dex-okd-button-fill-quaternary-border-size)*2 + var(--dex-okd-button-md-line-height) + var(--dex-okd-button-fill-quaternary-border-size)*2);
  min-width: 0;
  overflow: hidden;
  padding: 0;
  width: calc(var(--dex-okd-button-md-padding-vertical)*2 + 2px - var(--dex-okd-button-fill-quaternary-border-size)*2 + var(--dex-okd-button-md-line-height) + var(--dex-okd-button-fill-quaternary-border-size)*2)
}

.dex-btn.btn-fill-quaternary.btn-md.dex-btn-strict-circle .btn-content {
  display: block;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  width: 100%
}

.dex-btn.btn-fill-quaternary.btn-lg {
  padding: calc(var(--dex-okd-button-lg-padding-vertical) + 1px - var(--dex-okd-button-fill-quaternary-border-size)) var(--dex-okd-button-lg-padding-horizontal)
}

.dex-btn.btn-fill-quaternary.btn-lg.dex-btn-strict-circle {
  border-radius: 100px;
  height: calc(var(--dex-okd-button-lg-padding-vertical)*2 + 2px - var(--dex-okd-button-fill-quaternary-border-size)*2 + var(--dex-okd-button-lg-line-height) + var(--dex-okd-button-fill-quaternary-border-size)*2);
  min-width: 0;
  overflow: hidden;
  padding: 0;
  width: calc(var(--dex-okd-button-lg-padding-vertical)*2 + 2px - var(--dex-okd-button-fill-quaternary-border-size)*2 + var(--dex-okd-button-lg-line-height) + var(--dex-okd-button-fill-quaternary-border-size)*2)
}

.dex-btn.btn-fill-quaternary.btn-lg.dex-btn-strict-circle .btn-content {
  display: block;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  width: 100%
}

.dex-btn.btn-fill-quaternary.btn-xl {
  padding: calc(var(--dex-okd-button-xl-padding-vertical) + 1px - var(--dex-okd-button-fill-quaternary-border-size)) var(--dex-okd-button-xl-padding-horizontal)
}

.dex-btn.btn-fill-quaternary.btn-xl.dex-btn-strict-circle {
  border-radius: 100px;
  height: calc(var(--dex-okd-button-xl-padding-vertical)*2 + 2px - var(--dex-okd-button-fill-quaternary-border-size)*2 + var(--dex-okd-button-xl-line-height) + var(--dex-okd-button-fill-quaternary-border-size)*2);
  min-width: 0;
  overflow: hidden;
  padding: 0;
  width: calc(var(--dex-okd-button-xl-padding-vertical)*2 + 2px - var(--dex-okd-button-fill-quaternary-border-size)*2 + var(--dex-okd-button-xl-line-height) + var(--dex-okd-button-fill-quaternary-border-size)*2)
}

.dex-btn.btn-fill-quaternary.btn-xl.dex-btn-strict-circle .btn-content {
  display: block;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  width: 100%
}

.dex-btn.btn-fill-red {
  background: var(--dex-okd-button-fill-red-default-background);
  border-color: var(--dex-okd-button-fill-red-default-border-color);
  border-style: solid;
  border-width: var(--dex-okd-button-fill-red-border-size);
  box-shadow: var(--dex-okd-button-fill-red-default-shadow);
  color: var(--dex-okd-button-fill-red-default-font-color)
}

.dex-btn.btn-fill-red.hover,
.dex-btn.btn-fill-red:not(:disabled):not(.btn-disabled):not(.mobile):hover {
  background: var(--dex-okd-button-fill-red-hover-background);
  border-color: var(--dex-okd-button-fill-red-hover-border-color);
  box-shadow: var(--dex-okd-button-fill-red-hover-shadow);
  color: var(--dex-okd-button-fill-red-hover-font-color)
}

.dex-btn.btn-fill-red.hover .btn-icon,
.dex-btn.btn-fill-red:not(:disabled):not(.btn-disabled):not(.mobile):hover .btn-icon {
  color: var(--dex-okd-button-fill-red-hover-icon-color)
}

.dex-btn.btn-fill-red.active,
.dex-btn.btn-fill-red:not(:disabled):active {
  background: var(--dex-okd-button-fill-red-active-background);
  border-color: var(--dex-okd-button-fill-red-active-border-color);
  box-shadow: var(--dex-okd-button-fill-red-active-shadow);
  color: var(--dex-okd-button-fill-red-active-font-color)
}

.dex-btn.btn-fill-red.active .btn-icon,
.dex-btn.btn-fill-red:not(:disabled):active .btn-icon {
  color: var(--dex-okd-button-fill-red-active-icon-color)
}

.dex-btn.btn-fill-red:not(.loading).btn-disabled,
.dex-btn.btn-fill-red:not(.loading):disabled {
  background: var(--dex-okd-button-fill-red-disabled-background);
  border-color: var(--dex-okd-button-fill-red-disabled-border-color);
  box-shadow: var(--dex-okd-button-fill-red-disabled-shadow);
  color: var(--dex-okd-button-fill-red-disabled-font-color)
}

.dex-btn.btn-fill-red:not(.loading).btn-disabled .btn-icon,
.dex-btn.btn-fill-red:not(.loading):disabled .btn-icon {
  color: var(--dex-okd-button-fill-red-disabled-icon-color)
}

.dex-btn.btn-fill-red.loading {
  cursor: pointer
}

.dex-btn.btn-fill-red .btn-icon {
  color: var(--dex-okd-button-fill-red-default-icon-color)
}

.dex-btn.btn-fill-red .dex-btn-loader-text {
  color: var(--dex-okd-button-fill-red-default-font-color)
}

.dex-btn.btn-fill-red.btn-xxs {
  padding: calc(var(--dex-okd-button-xxs-padding-vertical) + 1px - var(--dex-okd-button-fill-red-border-size)) var(--dex-okd-button-xxs-padding-horizontal)
}

.dex-btn.btn-fill-red.btn-xxs.dex-btn-strict-circle {
  border-radius: 100px;
  height: calc(var(--dex-okd-button-xxs-padding-vertical)*2 + 2px - var(--dex-okd-button-fill-red-border-size)*2 + var(--dex-okd-button-xxs-line-height) + var(--dex-okd-button-fill-red-border-size)*2);
  min-width: 0;
  overflow: hidden;
  padding: 0;
  width: calc(var(--dex-okd-button-xxs-padding-vertical)*2 + 2px - var(--dex-okd-button-fill-red-border-size)*2 + var(--dex-okd-button-xxs-line-height) + var(--dex-okd-button-fill-red-border-size)*2)
}

.dex-btn.btn-fill-red.btn-xxs.dex-btn-strict-circle .btn-content {
  display: block;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  width: 100%
}

.dex-btn.btn-fill-red.btn-xs {
  padding: calc(var(--dex-okd-button-xs-padding-vertical) + 1px - var(--dex-okd-button-fill-red-border-size)) var(--dex-okd-button-xs-padding-horizontal)
}

.dex-btn.btn-fill-red.btn-xs.dex-btn-strict-circle {
  border-radius: 100px;
  height: calc(var(--dex-okd-button-xs-padding-vertical)*2 + 2px - var(--dex-okd-button-fill-red-border-size)*2 + var(--dex-okd-button-xs-line-height) + var(--dex-okd-button-fill-red-border-size)*2);
  min-width: 0;
  overflow: hidden;
  padding: 0;
  width: calc(var(--dex-okd-button-xs-padding-vertical)*2 + 2px - var(--dex-okd-button-fill-red-border-size)*2 + var(--dex-okd-button-xs-line-height) + var(--dex-okd-button-fill-red-border-size)*2)
}

.dex-btn.btn-fill-red.btn-xs.dex-btn-strict-circle .btn-content {
  display: block;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  width: 100%
}

.dex-btn.btn-fill-red.btn-s {
  padding: calc(var(--dex-okd-button-s-padding-vertical) + 1px - var(--dex-okd-button-fill-red-border-size)) var(--dex-okd-button-s-padding-horizontal)
}

.dex-btn.btn-fill-red.btn-s.dex-btn-strict-circle {
  border-radius: 100px;
  height: calc(var(--dex-okd-button-s-padding-vertical)*2 + 2px - var(--dex-okd-button-fill-red-border-size)*2 + var(--dex-okd-button-s-line-height) + var(--dex-okd-button-fill-red-border-size)*2);
  min-width: 0;
  overflow: hidden;
  padding: 0;
  width: calc(var(--dex-okd-button-s-padding-vertical)*2 + 2px - var(--dex-okd-button-fill-red-border-size)*2 + var(--dex-okd-button-s-line-height) + var(--dex-okd-button-fill-red-border-size)*2)
}

.dex-btn.btn-fill-red.btn-s.dex-btn-strict-circle .btn-content {
  display: block;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  width: 100%
}

.dex-btn.btn-fill-red.btn-sm {
  padding: calc(var(--dex-okd-button-sm-padding-vertical) + 1px - var(--dex-okd-button-fill-red-border-size)) var(--dex-okd-button-sm-padding-horizontal)
}

.dex-btn.btn-fill-red.btn-sm.dex-btn-strict-circle {
  border-radius: 100px;
  height: calc(var(--dex-okd-button-sm-padding-vertical)*2 + 2px - var(--dex-okd-button-fill-red-border-size)*2 + var(--dex-okd-button-sm-line-height) + var(--dex-okd-button-fill-red-border-size)*2);
  min-width: 0;
  overflow: hidden;
  padding: 0;
  width: calc(var(--dex-okd-button-sm-padding-vertical)*2 + 2px - var(--dex-okd-button-fill-red-border-size)*2 + var(--dex-okd-button-sm-line-height) + var(--dex-okd-button-fill-red-border-size)*2)
}

.dex-btn.btn-fill-red.btn-sm.dex-btn-strict-circle .btn-content {
  display: block;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  width: 100%
}

.dex-btn.btn-fill-red.btn-md {
  padding: calc(var(--dex-okd-button-md-padding-vertical) + 1px - var(--dex-okd-button-fill-red-border-size)) var(--dex-okd-button-md-padding-horizontal)
}

.dex-btn.btn-fill-red.btn-md.dex-btn-strict-circle {
  border-radius: 100px;
  height: calc(var(--dex-okd-button-md-padding-vertical)*2 + 2px - var(--dex-okd-button-fill-red-border-size)*2 + var(--dex-okd-button-md-line-height) + var(--dex-okd-button-fill-red-border-size)*2);
  min-width: 0;
  overflow: hidden;
  padding: 0;
  width: calc(var(--dex-okd-button-md-padding-vertical)*2 + 2px - var(--dex-okd-button-fill-red-border-size)*2 + var(--dex-okd-button-md-line-height) + var(--dex-okd-button-fill-red-border-size)*2)
}

.dex-btn.btn-fill-red.btn-md.dex-btn-strict-circle .btn-content {
  display: block;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  width: 100%
}

.dex-btn.btn-fill-red.btn-lg {
  padding: calc(var(--dex-okd-button-lg-padding-vertical) + 1px - var(--dex-okd-button-fill-red-border-size)) var(--dex-okd-button-lg-padding-horizontal)
}

.dex-btn.btn-fill-red.btn-lg.dex-btn-strict-circle {
  border-radius: 100px;
  height: calc(var(--dex-okd-button-lg-padding-vertical)*2 + 2px - var(--dex-okd-button-fill-red-border-size)*2 + var(--dex-okd-button-lg-line-height) + var(--dex-okd-button-fill-red-border-size)*2);
  min-width: 0;
  overflow: hidden;
  padding: 0;
  width: calc(var(--dex-okd-button-lg-padding-vertical)*2 + 2px - var(--dex-okd-button-fill-red-border-size)*2 + var(--dex-okd-button-lg-line-height) + var(--dex-okd-button-fill-red-border-size)*2)
}

.dex-btn.btn-fill-red.btn-lg.dex-btn-strict-circle .btn-content {
  display: block;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  width: 100%
}

.dex-btn.btn-fill-red.btn-xl {
  padding: calc(var(--dex-okd-button-xl-padding-vertical) + 1px - var(--dex-okd-button-fill-red-border-size)) var(--dex-okd-button-xl-padding-horizontal)
}

.dex-btn.btn-fill-red.btn-xl.dex-btn-strict-circle {
  border-radius: 100px;
  height: calc(var(--dex-okd-button-xl-padding-vertical)*2 + 2px - var(--dex-okd-button-fill-red-border-size)*2 + var(--dex-okd-button-xl-line-height) + var(--dex-okd-button-fill-red-border-size)*2);
  min-width: 0;
  overflow: hidden;
  padding: 0;
  width: calc(var(--dex-okd-button-xl-padding-vertical)*2 + 2px - var(--dex-okd-button-fill-red-border-size)*2 + var(--dex-okd-button-xl-line-height) + var(--dex-okd-button-fill-red-border-size)*2)
}

.dex-btn.btn-fill-red.btn-xl.dex-btn-strict-circle .btn-content {
  display: block;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  width: 100%
}

.dex-btn.btn-fill-green {
  background: var(--dex-okd-button-fill-green-default-background);
  border-color: var(--dex-okd-button-fill-green-default-border-color);
  border-style: solid;
  border-width: var(--dex-okd-button-fill-green-border-size);
  box-shadow: var(--dex-okd-button-fill-green-default-shadow);
  color: var(--dex-okd-button-fill-green-default-font-color)
}

.dex-btn.btn-fill-green.hover,
.dex-btn.btn-fill-green:not(:disabled):not(.btn-disabled):not(.mobile):hover {
  background: var(--dex-okd-button-fill-green-hover-background);
  border-color: var(--dex-okd-button-fill-green-hover-border-color);
  box-shadow: var(--dex-okd-button-fill-green-hover-shadow);
  color: var(--dex-okd-button-fill-green-hover-font-color)
}

.dex-btn.btn-fill-green.hover .btn-icon,
.dex-btn.btn-fill-green:not(:disabled):not(.btn-disabled):not(.mobile):hover .btn-icon {
  color: var(--dex-okd-button-fill-green-hover-icon-color)
}

.dex-btn.btn-fill-green.active,
.dex-btn.btn-fill-green:not(:disabled):active {
  background: var(--dex-okd-button-fill-green-active-background);
  border-color: var(--dex-okd-button-fill-green-active-border-color);
  box-shadow: var(--dex-okd-button-fill-green-active-shadow);
  color: var(--dex-okd-button-fill-green-active-font-color)
}

.dex-btn.btn-fill-green.active .btn-icon,
.dex-btn.btn-fill-green:not(:disabled):active .btn-icon {
  color: var(--dex-okd-button-fill-green-active-icon-color)
}

.dex-btn.btn-fill-green:not(.loading).btn-disabled,
.dex-btn.btn-fill-green:not(.loading):disabled {
  background: var(--dex-okd-button-fill-green-disabled-background);
  border-color: var(--dex-okd-button-fill-green-disabled-border-color);
  box-shadow: var(--dex-okd-button-fill-green-disabled-shadow);
  color: var(--dex-okd-button-fill-green-disabled-font-color)
}

.dex-btn.btn-fill-green:not(.loading).btn-disabled .btn-icon,
.dex-btn.btn-fill-green:not(.loading):disabled .btn-icon {
  color: var(--dex-okd-button-fill-green-disabled-icon-color)
}

.dex-btn.btn-fill-green.loading {
  cursor: pointer
}

.dex-btn.btn-fill-green .btn-icon {
  color: var(--dex-okd-button-fill-green-default-icon-color)
}

.dex-btn.btn-fill-green .dex-btn-loader-text {
  color: var(--dex-okd-button-fill-green-default-font-color)
}

.dex-btn.btn-fill-green.btn-xxs {
  padding: calc(var(--dex-okd-button-xxs-padding-vertical) + 1px - var(--dex-okd-button-fill-green-border-size)) var(--dex-okd-button-xxs-padding-horizontal)
}

.dex-btn.btn-fill-green.btn-xxs.dex-btn-strict-circle {
  border-radius: 100px;
  height: calc(var(--dex-okd-button-xxs-padding-vertical)*2 + 2px - var(--dex-okd-button-fill-green-border-size)*2 + var(--dex-okd-button-xxs-line-height) + var(--dex-okd-button-fill-green-border-size)*2);
  min-width: 0;
  overflow: hidden;
  padding: 0;
  width: calc(var(--dex-okd-button-xxs-padding-vertical)*2 + 2px - var(--dex-okd-button-fill-green-border-size)*2 + var(--dex-okd-button-xxs-line-height) + var(--dex-okd-button-fill-green-border-size)*2)
}

.dex-btn.btn-fill-green.btn-xxs.dex-btn-strict-circle .btn-content {
  display: block;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  width: 100%
}

.dex-btn.btn-fill-green.btn-xs {
  padding: calc(var(--dex-okd-button-xs-padding-vertical) + 1px - var(--dex-okd-button-fill-green-border-size)) var(--dex-okd-button-xs-padding-horizontal)
}

.dex-btn.btn-fill-green.btn-xs.dex-btn-strict-circle {
  border-radius: 100px;
  height: calc(var(--dex-okd-button-xs-padding-vertical)*2 + 2px - var(--dex-okd-button-fill-green-border-size)*2 + var(--dex-okd-button-xs-line-height) + var(--dex-okd-button-fill-green-border-size)*2);
  min-width: 0;
  overflow: hidden;
  padding: 0;
  width: calc(var(--dex-okd-button-xs-padding-vertical)*2 + 2px - var(--dex-okd-button-fill-green-border-size)*2 + var(--dex-okd-button-xs-line-height) + var(--dex-okd-button-fill-green-border-size)*2)
}

.dex-btn.btn-fill-green.btn-xs.dex-btn-strict-circle .btn-content {
  display: block;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  width: 100%
}

.dex-btn.btn-fill-green.btn-s {
  padding: calc(var(--dex-okd-button-s-padding-vertical) + 1px - var(--dex-okd-button-fill-green-border-size)) var(--dex-okd-button-s-padding-horizontal)
}

.dex-btn.btn-fill-green.btn-s.dex-btn-strict-circle {
  border-radius: 100px;
  height: calc(var(--dex-okd-button-s-padding-vertical)*2 + 2px - var(--dex-okd-button-fill-green-border-size)*2 + var(--dex-okd-button-s-line-height) + var(--dex-okd-button-fill-green-border-size)*2);
  min-width: 0;
  overflow: hidden;
  padding: 0;
  width: calc(var(--dex-okd-button-s-padding-vertical)*2 + 2px - var(--dex-okd-button-fill-green-border-size)*2 + var(--dex-okd-button-s-line-height) + var(--dex-okd-button-fill-green-border-size)*2)
}

.dex-btn.btn-fill-green.btn-s.dex-btn-strict-circle .btn-content {
  display: block;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  width: 100%
}

.dex-btn.btn-fill-green.btn-sm {
  padding: calc(var(--dex-okd-button-sm-padding-vertical) + 1px - var(--dex-okd-button-fill-green-border-size)) var(--dex-okd-button-sm-padding-horizontal)
}

.dex-btn.btn-fill-green.btn-sm.dex-btn-strict-circle {
  border-radius: 100px;
  height: calc(var(--dex-okd-button-sm-padding-vertical)*2 + 2px - var(--dex-okd-button-fill-green-border-size)*2 + var(--dex-okd-button-sm-line-height) + var(--dex-okd-button-fill-green-border-size)*2);
  min-width: 0;
  overflow: hidden;
  padding: 0;
  width: calc(var(--dex-okd-button-sm-padding-vertical)*2 + 2px - var(--dex-okd-button-fill-green-border-size)*2 + var(--dex-okd-button-sm-line-height) + var(--dex-okd-button-fill-green-border-size)*2)
}

.dex-btn.btn-fill-green.btn-sm.dex-btn-strict-circle .btn-content {
  display: block;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  width: 100%
}

.dex-btn.btn-fill-green.btn-md {
  padding: calc(var(--dex-okd-button-md-padding-vertical) + 1px - var(--dex-okd-button-fill-green-border-size)) var(--dex-okd-button-md-padding-horizontal)
}

.dex-btn.btn-fill-green.btn-md.dex-btn-strict-circle {
  border-radius: 100px;
  height: calc(var(--dex-okd-button-md-padding-vertical)*2 + 2px - var(--dex-okd-button-fill-green-border-size)*2 + var(--dex-okd-button-md-line-height) + var(--dex-okd-button-fill-green-border-size)*2);
  min-width: 0;
  overflow: hidden;
  padding: 0;
  width: calc(var(--dex-okd-button-md-padding-vertical)*2 + 2px - var(--dex-okd-button-fill-green-border-size)*2 + var(--dex-okd-button-md-line-height) + var(--dex-okd-button-fill-green-border-size)*2)
}

.dex-btn.btn-fill-green.btn-md.dex-btn-strict-circle .btn-content {
  display: block;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  width: 100%
}

.dex-btn.btn-fill-green.btn-lg {
  padding: calc(var(--dex-okd-button-lg-padding-vertical) + 1px - var(--dex-okd-button-fill-green-border-size)) var(--dex-okd-button-lg-padding-horizontal)
}

.dex-btn.btn-fill-green.btn-lg.dex-btn-strict-circle {
  border-radius: 100px;
  height: calc(var(--dex-okd-button-lg-padding-vertical)*2 + 2px - var(--dex-okd-button-fill-green-border-size)*2 + var(--dex-okd-button-lg-line-height) + var(--dex-okd-button-fill-green-border-size)*2);
  min-width: 0;
  overflow: hidden;
  padding: 0;
  width: calc(var(--dex-okd-button-lg-padding-vertical)*2 + 2px - var(--dex-okd-button-fill-green-border-size)*2 + var(--dex-okd-button-lg-line-height) + var(--dex-okd-button-fill-green-border-size)*2)
}

.dex-btn.btn-fill-green.btn-lg.dex-btn-strict-circle .btn-content {
  display: block;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  width: 100%
}

.dex-btn.btn-fill-green.btn-xl {
  padding: calc(var(--dex-okd-button-xl-padding-vertical) + 1px - var(--dex-okd-button-fill-green-border-size)) var(--dex-okd-button-xl-padding-horizontal)
}

.dex-btn.btn-fill-green.btn-xl.dex-btn-strict-circle {
  border-radius: 100px;
  height: calc(var(--dex-okd-button-xl-padding-vertical)*2 + 2px - var(--dex-okd-button-fill-green-border-size)*2 + var(--dex-okd-button-xl-line-height) + var(--dex-okd-button-fill-green-border-size)*2);
  min-width: 0;
  overflow: hidden;
  padding: 0;
  width: calc(var(--dex-okd-button-xl-padding-vertical)*2 + 2px - var(--dex-okd-button-fill-green-border-size)*2 + var(--dex-okd-button-xl-line-height) + var(--dex-okd-button-fill-green-border-size)*2)
}

.dex-btn.btn-fill-green.btn-xl.dex-btn-strict-circle .btn-content {
  display: block;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  width: 100%
}

.dex-btn.btn-fill-grey {
  background: var(--dex-okd-button-fill-grey-default-background);
  border-color: var(--dex-okd-button-fill-grey-default-border-color);
  border-style: solid;
  border-width: var(--dex-okd-button-fill-grey-border-size);
  box-shadow: var(--dex-okd-button-fill-grey-default-shadow);
  color: var(--dex-okd-button-fill-grey-default-font-color)
}

.dex-btn.btn-fill-grey.hover,
.dex-btn.btn-fill-grey:not(:disabled):not(.btn-disabled):not(.mobile):hover {
  background: var(--dex-okd-button-fill-grey-hover-background);
  border-color: var(--dex-okd-button-fill-grey-hover-border-color);
  box-shadow: var(--dex-okd-button-fill-grey-hover-shadow);
  color: var(--dex-okd-button-fill-grey-hover-font-color)
}

.dex-btn.btn-fill-grey.hover .btn-icon,
.dex-btn.btn-fill-grey:not(:disabled):not(.btn-disabled):not(.mobile):hover .btn-icon {
  color: var(--dex-okd-button-fill-grey-hover-icon-color)
}

.dex-btn.btn-fill-grey.active,
.dex-btn.btn-fill-grey:not(:disabled):active {
  background: var(--dex-okd-button-fill-grey-active-background);
  border-color: var(--dex-okd-button-fill-grey-active-border-color);
  box-shadow: var(--dex-okd-button-fill-grey-active-shadow);
  color: var(--dex-okd-button-fill-grey-active-font-color)
}

.dex-btn.btn-fill-grey.active .btn-icon,
.dex-btn.btn-fill-grey:not(:disabled):active .btn-icon {
  color: var(--dex-okd-button-fill-grey-active-icon-color)
}

.dex-btn.btn-fill-grey:not(.loading).btn-disabled,
.dex-btn.btn-fill-grey:not(.loading):disabled {
  background: var(--dex-okd-button-fill-grey-disabled-background);
  border-color: var(--dex-okd-button-fill-grey-disabled-border-color);
  box-shadow: var(--dex-okd-button-fill-grey-disabled-shadow);
  color: var(--dex-okd-button-fill-grey-disabled-font-color)
}

.dex-btn.btn-fill-grey:not(.loading).btn-disabled .btn-icon,
.dex-btn.btn-fill-grey:not(.loading):disabled .btn-icon {
  color: var(--dex-okd-button-fill-grey-disabled-icon-color)
}

.dex-btn.btn-fill-grey.loading {
  cursor: pointer
}

.dex-btn.btn-fill-grey .btn-icon {
  color: var(--dex-okd-button-fill-grey-default-icon-color)
}

.dex-btn.btn-fill-grey .dex-btn-loader-text {
  color: var(--dex-okd-button-fill-grey-default-font-color)
}

.dex-btn.btn-fill-grey.btn-xxs {
  padding: calc(var(--dex-okd-button-xxs-padding-vertical) + 1px - var(--dex-okd-button-fill-grey-border-size)) var(--dex-okd-button-xxs-padding-horizontal)
}

.dex-btn.btn-fill-grey.btn-xxs.dex-btn-strict-circle {
  border-radius: 100px;
  height: calc(var(--dex-okd-button-xxs-padding-vertical)*2 + 2px - var(--dex-okd-button-fill-grey-border-size)*2 + var(--dex-okd-button-xxs-line-height) + var(--dex-okd-button-fill-grey-border-size)*2);
  min-width: 0;
  overflow: hidden;
  padding: 0;
  width: calc(var(--dex-okd-button-xxs-padding-vertical)*2 + 2px - var(--dex-okd-button-fill-grey-border-size)*2 + var(--dex-okd-button-xxs-line-height) + var(--dex-okd-button-fill-grey-border-size)*2)
}

.dex-btn.btn-fill-grey.btn-xxs.dex-btn-strict-circle .btn-content {
  display: block;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  width: 100%
}

.dex-btn.btn-fill-grey.btn-xs {
  padding: calc(var(--dex-okd-button-xs-padding-vertical) + 1px - var(--dex-okd-button-fill-grey-border-size)) var(--dex-okd-button-xs-padding-horizontal)
}

.dex-btn.btn-fill-grey.btn-xs.dex-btn-strict-circle {
  border-radius: 100px;
  height: calc(var(--dex-okd-button-xs-padding-vertical)*2 + 2px - var(--dex-okd-button-fill-grey-border-size)*2 + var(--dex-okd-button-xs-line-height) + var(--dex-okd-button-fill-grey-border-size)*2);
  min-width: 0;
  overflow: hidden;
  padding: 0;
  width: calc(var(--dex-okd-button-xs-padding-vertical)*2 + 2px - var(--dex-okd-button-fill-grey-border-size)*2 + var(--dex-okd-button-xs-line-height) + var(--dex-okd-button-fill-grey-border-size)*2)
}

.dex-btn.btn-fill-grey.btn-xs.dex-btn-strict-circle .btn-content {
  display: block;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  width: 100%
}

.dex-btn.btn-fill-grey.btn-s {
  padding: calc(var(--dex-okd-button-s-padding-vertical) + 1px - var(--dex-okd-button-fill-grey-border-size)) var(--dex-okd-button-s-padding-horizontal)
}

.dex-btn.btn-fill-grey.btn-s.dex-btn-strict-circle {
  border-radius: 100px;
  height: calc(var(--dex-okd-button-s-padding-vertical)*2 + 2px - var(--dex-okd-button-fill-grey-border-size)*2 + var(--dex-okd-button-s-line-height) + var(--dex-okd-button-fill-grey-border-size)*2);
  min-width: 0;
  overflow: hidden;
  padding: 0;
  width: calc(var(--dex-okd-button-s-padding-vertical)*2 + 2px - var(--dex-okd-button-fill-grey-border-size)*2 + var(--dex-okd-button-s-line-height) + var(--dex-okd-button-fill-grey-border-size)*2)
}

.dex-btn.btn-fill-grey.btn-s.dex-btn-strict-circle .btn-content {
  display: block;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  width: 100%
}

.dex-btn.btn-fill-grey.btn-sm {
  padding: calc(var(--dex-okd-button-sm-padding-vertical) + 1px - var(--dex-okd-button-fill-grey-border-size)) var(--dex-okd-button-sm-padding-horizontal)
}

.dex-btn.btn-fill-grey.btn-sm.dex-btn-strict-circle {
  border-radius: 100px;
  height: calc(var(--dex-okd-button-sm-padding-vertical)*2 + 2px - var(--dex-okd-button-fill-grey-border-size)*2 + var(--dex-okd-button-sm-line-height) + var(--dex-okd-button-fill-grey-border-size)*2);
  min-width: 0;
  overflow: hidden;
  padding: 0;
  width: calc(var(--dex-okd-button-sm-padding-vertical)*2 + 2px - var(--dex-okd-button-fill-grey-border-size)*2 + var(--dex-okd-button-sm-line-height) + var(--dex-okd-button-fill-grey-border-size)*2)
}

.dex-btn.btn-fill-grey.btn-sm.dex-btn-strict-circle .btn-content {
  display: block;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  width: 100%
}

.dex-btn.btn-fill-grey.btn-md {
  padding: calc(var(--dex-okd-button-md-padding-vertical) + 1px - var(--dex-okd-button-fill-grey-border-size)) var(--dex-okd-button-md-padding-horizontal)
}

.dex-btn.btn-fill-grey.btn-md.dex-btn-strict-circle {
  border-radius: 100px;
  height: calc(var(--dex-okd-button-md-padding-vertical)*2 + 2px - var(--dex-okd-button-fill-grey-border-size)*2 + var(--dex-okd-button-md-line-height) + var(--dex-okd-button-fill-grey-border-size)*2);
  min-width: 0;
  overflow: hidden;
  padding: 0;
  width: calc(var(--dex-okd-button-md-padding-vertical)*2 + 2px - var(--dex-okd-button-fill-grey-border-size)*2 + var(--dex-okd-button-md-line-height) + var(--dex-okd-button-fill-grey-border-size)*2)
}

.dex-btn.btn-fill-grey.btn-md.dex-btn-strict-circle .btn-content {
  display: block;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  width: 100%
}

.dex-btn.btn-fill-grey.btn-lg {
  padding: calc(var(--dex-okd-button-lg-padding-vertical) + 1px - var(--dex-okd-button-fill-grey-border-size)) var(--dex-okd-button-lg-padding-horizontal)
}

.dex-btn.btn-fill-grey.btn-lg.dex-btn-strict-circle {
  border-radius: 100px;
  height: calc(var(--dex-okd-button-lg-padding-vertical)*2 + 2px - var(--dex-okd-button-fill-grey-border-size)*2 + var(--dex-okd-button-lg-line-height) + var(--dex-okd-button-fill-grey-border-size)*2);
  min-width: 0;
  overflow: hidden;
  padding: 0;
  width: calc(var(--dex-okd-button-lg-padding-vertical)*2 + 2px - var(--dex-okd-button-fill-grey-border-size)*2 + var(--dex-okd-button-lg-line-height) + var(--dex-okd-button-fill-grey-border-size)*2)
}

.dex-btn.btn-fill-grey.btn-lg.dex-btn-strict-circle .btn-content {
  display: block;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  width: 100%
}

.dex-btn.btn-fill-grey.btn-xl {
  padding: calc(var(--dex-okd-button-xl-padding-vertical) + 1px - var(--dex-okd-button-fill-grey-border-size)) var(--dex-okd-button-xl-padding-horizontal)
}

.dex-btn.btn-fill-grey.btn-xl.dex-btn-strict-circle {
  border-radius: 100px;
  height: calc(var(--dex-okd-button-xl-padding-vertical)*2 + 2px - var(--dex-okd-button-fill-grey-border-size)*2 + var(--dex-okd-button-xl-line-height) + var(--dex-okd-button-fill-grey-border-size)*2);
  min-width: 0;
  overflow: hidden;
  padding: 0;
  width: calc(var(--dex-okd-button-xl-padding-vertical)*2 + 2px - var(--dex-okd-button-fill-grey-border-size)*2 + var(--dex-okd-button-xl-line-height) + var(--dex-okd-button-fill-grey-border-size)*2)
}

.dex-btn.btn-fill-grey.btn-xl.dex-btn-strict-circle .btn-content {
  display: block;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  width: 100%
}

.dex-btn.btn-outline-highlight {
  background: var(--dex-okd-button-outline-highlight-default-background);
  border-color: var(--dex-okd-button-outline-highlight-default-border-color);
  border-style: solid;
  border-width: var(--dex-okd-button-outline-highlight-border-size);
  box-shadow: var(--dex-okd-button-outline-highlight-default-shadow);
  color: var(--dex-okd-button-outline-highlight-default-font-color)
}

.dex-btn.btn-outline-highlight.hover,
.dex-btn.btn-outline-highlight:not(:disabled):not(.btn-disabled):not(.mobile):hover {
  background: var(--dex-okd-button-outline-highlight-hover-background);
  border-color: var(--dex-okd-button-outline-highlight-hover-border-color);
  box-shadow: var(--dex-okd-button-outline-highlight-hover-shadow);
  color: var(--dex-okd-button-outline-highlight-hover-font-color)
}

.dex-btn.btn-outline-highlight.hover .btn-icon,
.dex-btn.btn-outline-highlight:not(:disabled):not(.btn-disabled):not(.mobile):hover .btn-icon {
  color: var(--dex-okd-button-outline-highlight-hover-icon-color)
}

.dex-btn.btn-outline-highlight.active,
.dex-btn.btn-outline-highlight:not(:disabled):active {
  background: var(--dex-okd-button-outline-highlight-active-background);
  border-color: var(--dex-okd-button-outline-highlight-active-border-color);
  box-shadow: var(--dex-okd-button-outline-highlight-active-shadow);
  color: var(--dex-okd-button-outline-highlight-active-font-color)
}

.dex-btn.btn-outline-highlight.active .btn-icon,
.dex-btn.btn-outline-highlight:not(:disabled):active .btn-icon {
  color: var(--dex-okd-button-outline-highlight-active-icon-color)
}

.dex-btn.btn-outline-highlight:not(.loading).btn-disabled,
.dex-btn.btn-outline-highlight:not(.loading):disabled {
  background: var(--dex-okd-button-outline-highlight-disabled-background);
  border-color: var(--dex-okd-button-outline-highlight-disabled-border-color);
  box-shadow: var(--dex-okd-button-outline-highlight-disabled-shadow);
  color: var(--dex-okd-button-outline-highlight-disabled-font-color)
}

.dex-btn.btn-outline-highlight:not(.loading).btn-disabled .btn-icon,
.dex-btn.btn-outline-highlight:not(.loading):disabled .btn-icon {
  color: var(--dex-okd-button-outline-highlight-disabled-icon-color)
}

.dex-btn.btn-outline-highlight.loading {
  cursor: pointer
}

.dex-btn.btn-outline-highlight .btn-icon {
  color: var(--dex-okd-button-outline-highlight-default-icon-color)
}

.dex-btn.btn-outline-highlight .dex-btn-loader-text {
  color: var(--dex-okd-button-outline-highlight-default-font-color)
}

.dex-btn.btn-outline-highlight.btn-xxs {
  padding: calc(var(--dex-okd-button-xxs-padding-vertical) + 1px - var(--dex-okd-button-outline-highlight-border-size)) var(--dex-okd-button-xxs-padding-horizontal)
}

.dex-btn.btn-outline-highlight.btn-xxs.dex-btn-strict-circle {
  border-radius: 100px;
  height: calc(var(--dex-okd-button-xxs-padding-vertical)*2 + 2px - var(--dex-okd-button-outline-highlight-border-size)*2 + var(--dex-okd-button-xxs-line-height) + var(--dex-okd-button-outline-highlight-border-size)*2);
  min-width: 0;
  overflow: hidden;
  padding: 0;
  width: calc(var(--dex-okd-button-xxs-padding-vertical)*2 + 2px - var(--dex-okd-button-outline-highlight-border-size)*2 + var(--dex-okd-button-xxs-line-height) + var(--dex-okd-button-outline-highlight-border-size)*2)
}

.dex-btn.btn-outline-highlight.btn-xxs.dex-btn-strict-circle .btn-content {
  display: block;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  width: 100%
}

.dex-btn.btn-outline-highlight.btn-xs {
  padding: calc(var(--dex-okd-button-xs-padding-vertical) + 1px - var(--dex-okd-button-outline-highlight-border-size)) var(--dex-okd-button-xs-padding-horizontal)
}

.dex-btn.btn-outline-highlight.btn-xs.dex-btn-strict-circle {
  border-radius: 100px;
  height: calc(var(--dex-okd-button-xs-padding-vertical)*2 + 2px - var(--dex-okd-button-outline-highlight-border-size)*2 + var(--dex-okd-button-xs-line-height) + var(--dex-okd-button-outline-highlight-border-size)*2);
  min-width: 0;
  overflow: hidden;
  padding: 0;
  width: calc(var(--dex-okd-button-xs-padding-vertical)*2 + 2px - var(--dex-okd-button-outline-highlight-border-size)*2 + var(--dex-okd-button-xs-line-height) + var(--dex-okd-button-outline-highlight-border-size)*2)
}

.dex-btn.btn-outline-highlight.btn-xs.dex-btn-strict-circle .btn-content {
  display: block;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  width: 100%
}

.dex-btn.btn-outline-highlight.btn-s {
  padding: calc(var(--dex-okd-button-s-padding-vertical) + 1px - var(--dex-okd-button-outline-highlight-border-size)) var(--dex-okd-button-s-padding-horizontal)
}

.dex-btn.btn-outline-highlight.btn-s.dex-btn-strict-circle {
  border-radius: 100px;
  height: calc(var(--dex-okd-button-s-padding-vertical)*2 + 2px - var(--dex-okd-button-outline-highlight-border-size)*2 + var(--dex-okd-button-s-line-height) + var(--dex-okd-button-outline-highlight-border-size)*2);
  min-width: 0;
  overflow: hidden;
  padding: 0;
  width: calc(var(--dex-okd-button-s-padding-vertical)*2 + 2px - var(--dex-okd-button-outline-highlight-border-size)*2 + var(--dex-okd-button-s-line-height) + var(--dex-okd-button-outline-highlight-border-size)*2)
}

.dex-btn.btn-outline-highlight.btn-s.dex-btn-strict-circle .btn-content {
  display: block;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  width: 100%
}

.dex-btn.btn-outline-highlight.btn-sm {
  padding: calc(var(--dex-okd-button-sm-padding-vertical) + 1px - var(--dex-okd-button-outline-highlight-border-size)) var(--dex-okd-button-sm-padding-horizontal)
}

.dex-btn.btn-outline-highlight.btn-sm.dex-btn-strict-circle {
  border-radius: 100px;
  height: calc(var(--dex-okd-button-sm-padding-vertical)*2 + 2px - var(--dex-okd-button-outline-highlight-border-size)*2 + var(--dex-okd-button-sm-line-height) + var(--dex-okd-button-outline-highlight-border-size)*2);
  min-width: 0;
  overflow: hidden;
  padding: 0;
  width: calc(var(--dex-okd-button-sm-padding-vertical)*2 + 2px - var(--dex-okd-button-outline-highlight-border-size)*2 + var(--dex-okd-button-sm-line-height) + var(--dex-okd-button-outline-highlight-border-size)*2)
}

.dex-btn.btn-outline-highlight.btn-sm.dex-btn-strict-circle .btn-content {
  display: block;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  width: 100%
}

.dex-btn.btn-outline-highlight.btn-md {
  padding: calc(var(--dex-okd-button-md-padding-vertical) + 1px - var(--dex-okd-button-outline-highlight-border-size)) var(--dex-okd-button-md-padding-horizontal)
}

.dex-btn.btn-outline-highlight.btn-md.dex-btn-strict-circle {
  border-radius: 100px;
  height: calc(var(--dex-okd-button-md-padding-vertical)*2 + 2px - var(--dex-okd-button-outline-highlight-border-size)*2 + var(--dex-okd-button-md-line-height) + var(--dex-okd-button-outline-highlight-border-size)*2);
  min-width: 0;
  overflow: hidden;
  padding: 0;
  width: calc(var(--dex-okd-button-md-padding-vertical)*2 + 2px - var(--dex-okd-button-outline-highlight-border-size)*2 + var(--dex-okd-button-md-line-height) + var(--dex-okd-button-outline-highlight-border-size)*2)
}

.dex-btn.btn-outline-highlight.btn-md.dex-btn-strict-circle .btn-content {
  display: block;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  width: 100%
}

.dex-btn.btn-outline-highlight.btn-lg {
  padding: calc(var(--dex-okd-button-lg-padding-vertical) + 1px - var(--dex-okd-button-outline-highlight-border-size)) var(--dex-okd-button-lg-padding-horizontal)
}

.dex-btn.btn-outline-highlight.btn-lg.dex-btn-strict-circle {
  border-radius: 100px;
  height: calc(var(--dex-okd-button-lg-padding-vertical)*2 + 2px - var(--dex-okd-button-outline-highlight-border-size)*2 + var(--dex-okd-button-lg-line-height) + var(--dex-okd-button-outline-highlight-border-size)*2);
  min-width: 0;
  overflow: hidden;
  padding: 0;
  width: calc(var(--dex-okd-button-lg-padding-vertical)*2 + 2px - var(--dex-okd-button-outline-highlight-border-size)*2 + var(--dex-okd-button-lg-line-height) + var(--dex-okd-button-outline-highlight-border-size)*2)
}

.dex-btn.btn-outline-highlight.btn-lg.dex-btn-strict-circle .btn-content {
  display: block;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  width: 100%
}

.dex-btn.btn-outline-highlight.btn-xl {
  padding: calc(var(--dex-okd-button-xl-padding-vertical) + 1px - var(--dex-okd-button-outline-highlight-border-size)) var(--dex-okd-button-xl-padding-horizontal)
}

.dex-btn.btn-outline-highlight.btn-xl.dex-btn-strict-circle {
  border-radius: 100px;
  height: calc(var(--dex-okd-button-xl-padding-vertical)*2 + 2px - var(--dex-okd-button-outline-highlight-border-size)*2 + var(--dex-okd-button-xl-line-height) + var(--dex-okd-button-outline-highlight-border-size)*2);
  min-width: 0;
  overflow: hidden;
  padding: 0;
  width: calc(var(--dex-okd-button-xl-padding-vertical)*2 + 2px - var(--dex-okd-button-outline-highlight-border-size)*2 + var(--dex-okd-button-xl-line-height) + var(--dex-okd-button-outline-highlight-border-size)*2)
}

.dex-btn.btn-outline-highlight.btn-xl.dex-btn-strict-circle .btn-content {
  display: block;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  width: 100%
}

.dex-btn.btn-outline-primary {
  background: var(--dex-okd-button-outline-primary-default-background);
  border-color: var(--dex-okd-button-outline-primary-default-border-color);
  border-style: solid;
  border-width: var(--dex-okd-button-outline-primary-border-size);
  box-shadow: var(--dex-okd-button-outline-primary-default-shadow);
  color: var(--dex-okd-button-outline-primary-default-font-color)
}

.dex-btn.btn-outline-primary.hover,
.dex-btn.btn-outline-primary:not(:disabled):not(.btn-disabled):not(.mobile):hover {
  background: var(--dex-okd-button-outline-primary-hover-background);
  border-color: var(--dex-okd-button-outline-primary-hover-border-color);
  box-shadow: var(--dex-okd-button-outline-primary-hover-shadow);
  color: var(--dex-okd-button-outline-primary-hover-font-color)
}

.dex-btn.btn-outline-primary.hover .btn-icon,
.dex-btn.btn-outline-primary:not(:disabled):not(.btn-disabled):not(.mobile):hover .btn-icon {
  color: var(--dex-okd-button-outline-primary-hover-icon-color)
}

.dex-btn.btn-outline-primary.active,
.dex-btn.btn-outline-primary:not(:disabled):active {
  background: var(--dex-okd-button-outline-primary-active-background);
  border-color: var(--dex-okd-button-outline-primary-active-border-color);
  box-shadow: var(--dex-okd-button-outline-primary-active-shadow);
  color: var(--dex-okd-button-outline-primary-active-font-color)
}

.dex-btn.btn-outline-primary.active .btn-icon,
.dex-btn.btn-outline-primary:not(:disabled):active .btn-icon {
  color: var(--dex-okd-button-outline-primary-active-icon-color)
}

.dex-btn.btn-outline-primary:not(.loading).btn-disabled,
.dex-btn.btn-outline-primary:not(.loading):disabled {
  background: var(--dex-okd-button-outline-primary-disabled-background);
  border-color: var(--dex-okd-button-outline-primary-disabled-border-color);
  box-shadow: var(--dex-okd-button-outline-primary-disabled-shadow);
  color: var(--dex-okd-button-outline-primary-disabled-font-color)
}

.dex-btn.btn-outline-primary:not(.loading).btn-disabled .btn-icon,
.dex-btn.btn-outline-primary:not(.loading):disabled .btn-icon {
  color: var(--dex-okd-button-outline-primary-disabled-icon-color)
}

.dex-btn.btn-outline-primary.loading {
  cursor: pointer
}

.dex-btn.btn-outline-primary .btn-icon {
  color: var(--dex-okd-button-outline-primary-default-icon-color)
}

.dex-btn.btn-outline-primary .dex-btn-loader-text {
  color: var(--dex-okd-button-outline-primary-default-font-color)
}

.dex-btn.btn-outline-primary.btn-xxs {
  padding: calc(var(--dex-okd-button-xxs-padding-vertical) + 1px - var(--dex-okd-button-outline-primary-border-size)) var(--dex-okd-button-xxs-padding-horizontal)
}

.dex-btn.btn-outline-primary.btn-xxs.dex-btn-strict-circle {
  border-radius: 100px;
  height: calc(var(--dex-okd-button-xxs-padding-vertical)*2 + 2px - var(--dex-okd-button-outline-primary-border-size)*2 + var(--dex-okd-button-xxs-line-height) + var(--dex-okd-button-outline-primary-border-size)*2);
  min-width: 0;
  overflow: hidden;
  padding: 0;
  width: calc(var(--dex-okd-button-xxs-padding-vertical)*2 + 2px - var(--dex-okd-button-outline-primary-border-size)*2 + var(--dex-okd-button-xxs-line-height) + var(--dex-okd-button-outline-primary-border-size)*2)
}

.dex-btn.btn-outline-primary.btn-xxs.dex-btn-strict-circle .btn-content {
  display: block;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  width: 100%
}

.dex-btn.btn-outline-primary.btn-xs {
  padding: calc(var(--dex-okd-button-xs-padding-vertical) + 1px - var(--dex-okd-button-outline-primary-border-size)) var(--dex-okd-button-xs-padding-horizontal)
}

.dex-btn.btn-outline-primary.btn-xs.dex-btn-strict-circle {
  border-radius: 100px;
  height: calc(var(--dex-okd-button-xs-padding-vertical)*2 + 2px - var(--dex-okd-button-outline-primary-border-size)*2 + var(--dex-okd-button-xs-line-height) + var(--dex-okd-button-outline-primary-border-size)*2);
  min-width: 0;
  overflow: hidden;
  padding: 0;
  width: calc(var(--dex-okd-button-xs-padding-vertical)*2 + 2px - var(--dex-okd-button-outline-primary-border-size)*2 + var(--dex-okd-button-xs-line-height) + var(--dex-okd-button-outline-primary-border-size)*2)
}

.dex-btn.btn-outline-primary.btn-xs.dex-btn-strict-circle .btn-content {
  display: block;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  width: 100%
}

.dex-btn.btn-outline-primary.btn-s {
  padding: calc(var(--dex-okd-button-s-padding-vertical) + 1px - var(--dex-okd-button-outline-primary-border-size)) var(--dex-okd-button-s-padding-horizontal)
}

.dex-btn.btn-outline-primary.btn-s.dex-btn-strict-circle {
  border-radius: 100px;
  height: calc(var(--dex-okd-button-s-padding-vertical)*2 + 2px - var(--dex-okd-button-outline-primary-border-size)*2 + var(--dex-okd-button-s-line-height) + var(--dex-okd-button-outline-primary-border-size)*2);
  min-width: 0;
  overflow: hidden;
  padding: 0;
  width: calc(var(--dex-okd-button-s-padding-vertical)*2 + 2px - var(--dex-okd-button-outline-primary-border-size)*2 + var(--dex-okd-button-s-line-height) + var(--dex-okd-button-outline-primary-border-size)*2)
}

.dex-btn.btn-outline-primary.btn-s.dex-btn-strict-circle .btn-content {
  display: block;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  width: 100%
}

.dex-btn.btn-outline-primary.btn-sm {
  padding: calc(var(--dex-okd-button-sm-padding-vertical) + 1px - var(--dex-okd-button-outline-primary-border-size)) var(--dex-okd-button-sm-padding-horizontal)
}

.dex-btn.btn-outline-primary.btn-sm.dex-btn-strict-circle {
  border-radius: 100px;
  height: calc(var(--dex-okd-button-sm-padding-vertical)*2 + 2px - var(--dex-okd-button-outline-primary-border-size)*2 + var(--dex-okd-button-sm-line-height) + var(--dex-okd-button-outline-primary-border-size)*2);
  min-width: 0;
  overflow: hidden;
  padding: 0;
  width: calc(var(--dex-okd-button-sm-padding-vertical)*2 + 2px - var(--dex-okd-button-outline-primary-border-size)*2 + var(--dex-okd-button-sm-line-height) + var(--dex-okd-button-outline-primary-border-size)*2)
}

.dex-btn.btn-outline-primary.btn-sm.dex-btn-strict-circle .btn-content {
  display: block;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  width: 100%
}

.dex-btn.btn-outline-primary.btn-md {
  padding: calc(var(--dex-okd-button-md-padding-vertical) + 1px - var(--dex-okd-button-outline-primary-border-size)) var(--dex-okd-button-md-padding-horizontal)
}

.dex-btn.btn-outline-primary.btn-md.dex-btn-strict-circle {
  border-radius: 100px;
  height: calc(var(--dex-okd-button-md-padding-vertical)*2 + 2px - var(--dex-okd-button-outline-primary-border-size)*2 + var(--dex-okd-button-md-line-height) + var(--dex-okd-button-outline-primary-border-size)*2);
  min-width: 0;
  overflow: hidden;
  padding: 0;
  width: calc(var(--dex-okd-button-md-padding-vertical)*2 + 2px - var(--dex-okd-button-outline-primary-border-size)*2 + var(--dex-okd-button-md-line-height) + var(--dex-okd-button-outline-primary-border-size)*2)
}

.dex-btn.btn-outline-primary.btn-md.dex-btn-strict-circle .btn-content {
  display: block;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  width: 100%
}

.dex-btn.btn-outline-primary.btn-lg {
  padding: calc(var(--dex-okd-button-lg-padding-vertical) + 1px - var(--dex-okd-button-outline-primary-border-size)) var(--dex-okd-button-lg-padding-horizontal)
}

.dex-btn.btn-outline-primary.btn-lg.dex-btn-strict-circle {
  border-radius: 100px;
  height: calc(var(--dex-okd-button-lg-padding-vertical)*2 + 2px - var(--dex-okd-button-outline-primary-border-size)*2 + var(--dex-okd-button-lg-line-height) + var(--dex-okd-button-outline-primary-border-size)*2);
  min-width: 0;
  overflow: hidden;
  padding: 0;
  width: calc(var(--dex-okd-button-lg-padding-vertical)*2 + 2px - var(--dex-okd-button-outline-primary-border-size)*2 + var(--dex-okd-button-lg-line-height) + var(--dex-okd-button-outline-primary-border-size)*2)
}

.dex-btn.btn-outline-primary.btn-lg.dex-btn-strict-circle .btn-content {
  display: block;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  width: 100%
}

.dex-btn.btn-outline-primary.btn-xl {
  padding: calc(var(--dex-okd-button-xl-padding-vertical) + 1px - var(--dex-okd-button-outline-primary-border-size)) var(--dex-okd-button-xl-padding-horizontal)
}

.dex-btn.btn-outline-primary.btn-xl.dex-btn-strict-circle {
  border-radius: 100px;
  height: calc(var(--dex-okd-button-xl-padding-vertical)*2 + 2px - var(--dex-okd-button-outline-primary-border-size)*2 + var(--dex-okd-button-xl-line-height) + var(--dex-okd-button-outline-primary-border-size)*2);
  min-width: 0;
  overflow: hidden;
  padding: 0;
  width: calc(var(--dex-okd-button-xl-padding-vertical)*2 + 2px - var(--dex-okd-button-outline-primary-border-size)*2 + var(--dex-okd-button-xl-line-height) + var(--dex-okd-button-outline-primary-border-size)*2)
}

.dex-btn.btn-outline-primary.btn-xl.dex-btn-strict-circle .btn-content {
  display: block;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  width: 100%
}

.dex-btn.btn-outline-secondary {
  background: var(--dex-okd-button-outline-secondary-default-background);
  border-color: var(--dex-okd-button-outline-secondary-default-border-color);
  border-style: solid;
  border-width: var(--dex-okd-button-outline-secondary-border-size);
  box-shadow: var(--dex-okd-button-outline-secondary-default-shadow);
  color: var(--dex-okd-button-outline-secondary-default-font-color)
}

.dex-btn.btn-outline-secondary.hover,
.dex-btn.btn-outline-secondary:not(:disabled):not(.btn-disabled):not(.mobile):hover {
  background: var(--dex-okd-button-outline-secondary-hover-background);
  border-color: var(--dex-okd-button-outline-secondary-hover-border-color);
  box-shadow: var(--dex-okd-button-outline-secondary-hover-shadow);
  color: var(--dex-okd-button-outline-secondary-hover-font-color)
}

.dex-btn.btn-outline-secondary.hover .btn-icon,
.dex-btn.btn-outline-secondary:not(:disabled):not(.btn-disabled):not(.mobile):hover .btn-icon {
  color: var(--dex-okd-button-outline-secondary-hover-icon-color)
}

.dex-btn.btn-outline-secondary.active,
.dex-btn.btn-outline-secondary:not(:disabled):active {
  background: var(--dex-okd-button-outline-secondary-active-background);
  border-color: var(--dex-okd-button-outline-secondary-active-border-color);
  box-shadow: var(--dex-okd-button-outline-secondary-active-shadow);
  color: var(--dex-okd-button-outline-secondary-active-font-color)
}

.dex-btn.btn-outline-secondary.active .btn-icon,
.dex-btn.btn-outline-secondary:not(:disabled):active .btn-icon {
  color: var(--dex-okd-button-outline-secondary-active-icon-color)
}

.dex-btn.btn-outline-secondary:not(.loading).btn-disabled,
.dex-btn.btn-outline-secondary:not(.loading):disabled {
  background: var(--dex-okd-button-outline-secondary-disabled-background);
  border-color: var(--dex-okd-button-outline-secondary-disabled-border-color);
  box-shadow: var(--dex-okd-button-outline-secondary-disabled-shadow);
  color: var(--dex-okd-button-outline-secondary-disabled-font-color)
}

.dex-btn.btn-outline-secondary:not(.loading).btn-disabled .btn-icon,
.dex-btn.btn-outline-secondary:not(.loading):disabled .btn-icon {
  color: var(--dex-okd-button-outline-secondary-disabled-icon-color)
}

.dex-btn.btn-outline-secondary.loading {
  cursor: pointer
}

.dex-btn.btn-outline-secondary .btn-icon {
  color: var(--dex-okd-button-outline-secondary-default-icon-color)
}

.dex-btn.btn-outline-secondary .dex-btn-loader-text {
  color: var(--dex-okd-button-outline-secondary-default-font-color)
}

.dex-btn.btn-outline-secondary.btn-xxs {
  padding: calc(var(--dex-okd-button-xxs-padding-vertical) + 1px - var(--dex-okd-button-outline-secondary-border-size)) var(--dex-okd-button-xxs-padding-horizontal)
}

.dex-btn.btn-outline-secondary.btn-xxs.dex-btn-strict-circle {
  border-radius: 100px;
  height: calc(var(--dex-okd-button-xxs-padding-vertical)*2 + 2px - var(--dex-okd-button-outline-secondary-border-size)*2 + var(--dex-okd-button-xxs-line-height) + var(--dex-okd-button-outline-secondary-border-size)*2);
  min-width: 0;
  overflow: hidden;
  padding: 0;
  width: calc(var(--dex-okd-button-xxs-padding-vertical)*2 + 2px - var(--dex-okd-button-outline-secondary-border-size)*2 + var(--dex-okd-button-xxs-line-height) + var(--dex-okd-button-outline-secondary-border-size)*2)
}

.dex-btn.btn-outline-secondary.btn-xxs.dex-btn-strict-circle .btn-content {
  display: block;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  width: 100%
}

.dex-btn.btn-outline-secondary.btn-xs {
  padding: calc(var(--dex-okd-button-xs-padding-vertical) + 1px - var(--dex-okd-button-outline-secondary-border-size)) var(--dex-okd-button-xs-padding-horizontal)
}

.dex-btn.btn-outline-secondary.btn-xs.dex-btn-strict-circle {
  border-radius: 100px;
  height: calc(var(--dex-okd-button-xs-padding-vertical)*2 + 2px - var(--dex-okd-button-outline-secondary-border-size)*2 + var(--dex-okd-button-xs-line-height) + var(--dex-okd-button-outline-secondary-border-size)*2);
  min-width: 0;
  overflow: hidden;
  padding: 0;
  width: calc(var(--dex-okd-button-xs-padding-vertical)*2 + 2px - var(--dex-okd-button-outline-secondary-border-size)*2 + var(--dex-okd-button-xs-line-height) + var(--dex-okd-button-outline-secondary-border-size)*2)
}

.dex-btn.btn-outline-secondary.btn-xs.dex-btn-strict-circle .btn-content {
  display: block;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  width: 100%
}

.dex-btn.btn-outline-secondary.btn-s {
  padding: calc(var(--dex-okd-button-s-padding-vertical) + 1px - var(--dex-okd-button-outline-secondary-border-size)) var(--dex-okd-button-s-padding-horizontal)
}

.dex-btn.btn-outline-secondary.btn-s.dex-btn-strict-circle {
  border-radius: 100px;
  height: calc(var(--dex-okd-button-s-padding-vertical)*2 + 2px - var(--dex-okd-button-outline-secondary-border-size)*2 + var(--dex-okd-button-s-line-height) + var(--dex-okd-button-outline-secondary-border-size)*2);
  min-width: 0;
  overflow: hidden;
  padding: 0;
  width: calc(var(--dex-okd-button-s-padding-vertical)*2 + 2px - var(--dex-okd-button-outline-secondary-border-size)*2 + var(--dex-okd-button-s-line-height) + var(--dex-okd-button-outline-secondary-border-size)*2)
}

.dex-btn.btn-outline-secondary.btn-s.dex-btn-strict-circle .btn-content {
  display: block;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  width: 100%
}

.dex-btn.btn-outline-secondary.btn-sm {
  padding: calc(var(--dex-okd-button-sm-padding-vertical) + 1px - var(--dex-okd-button-outline-secondary-border-size)) var(--dex-okd-button-sm-padding-horizontal)
}

.dex-btn.btn-outline-secondary.btn-sm.dex-btn-strict-circle {
  border-radius: 100px;
  height: calc(var(--dex-okd-button-sm-padding-vertical)*2 + 2px - var(--dex-okd-button-outline-secondary-border-size)*2 + var(--dex-okd-button-sm-line-height) + var(--dex-okd-button-outline-secondary-border-size)*2);
  min-width: 0;
  overflow: hidden;
  padding: 0;
  width: calc(var(--dex-okd-button-sm-padding-vertical)*2 + 2px - var(--dex-okd-button-outline-secondary-border-size)*2 + var(--dex-okd-button-sm-line-height) + var(--dex-okd-button-outline-secondary-border-size)*2)
}

.dex-btn.btn-outline-secondary.btn-sm.dex-btn-strict-circle .btn-content {
  display: block;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  width: 100%
}

.dex-btn.btn-outline-secondary.btn-md {
  padding: calc(var(--dex-okd-button-md-padding-vertical) + 1px - var(--dex-okd-button-outline-secondary-border-size)) var(--dex-okd-button-md-padding-horizontal)
}

.dex-btn.btn-outline-secondary.btn-md.dex-btn-strict-circle {
  border-radius: 100px;
  height: calc(var(--dex-okd-button-md-padding-vertical)*2 + 2px - var(--dex-okd-button-outline-secondary-border-size)*2 + var(--dex-okd-button-md-line-height) + var(--dex-okd-button-outline-secondary-border-size)*2);
  min-width: 0;
  overflow: hidden;
  padding: 0;
  width: calc(var(--dex-okd-button-md-padding-vertical)*2 + 2px - var(--dex-okd-button-outline-secondary-border-size)*2 + var(--dex-okd-button-md-line-height) + var(--dex-okd-button-outline-secondary-border-size)*2)
}

.dex-btn.btn-outline-secondary.btn-md.dex-btn-strict-circle .btn-content {
  display: block;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  width: 100%
}

.dex-btn.btn-outline-secondary.btn-lg {
  padding: calc(var(--dex-okd-button-lg-padding-vertical) + 1px - var(--dex-okd-button-outline-secondary-border-size)) var(--dex-okd-button-lg-padding-horizontal)
}

.dex-btn.btn-outline-secondary.btn-lg.dex-btn-strict-circle {
  border-radius: 100px;
  height: calc(var(--dex-okd-button-lg-padding-vertical)*2 + 2px - var(--dex-okd-button-outline-secondary-border-size)*2 + var(--dex-okd-button-lg-line-height) + var(--dex-okd-button-outline-secondary-border-size)*2);
  min-width: 0;
  overflow: hidden;
  padding: 0;
  width: calc(var(--dex-okd-button-lg-padding-vertical)*2 + 2px - var(--dex-okd-button-outline-secondary-border-size)*2 + var(--dex-okd-button-lg-line-height) + var(--dex-okd-button-outline-secondary-border-size)*2)
}

.dex-btn.btn-outline-secondary.btn-lg.dex-btn-strict-circle .btn-content {
  display: block;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  width: 100%
}

.dex-btn.btn-outline-secondary.btn-xl {
  padding: calc(var(--dex-okd-button-xl-padding-vertical) + 1px - var(--dex-okd-button-outline-secondary-border-size)) var(--dex-okd-button-xl-padding-horizontal)
}

.dex-btn.btn-outline-secondary.btn-xl.dex-btn-strict-circle {
  border-radius: 100px;
  height: calc(var(--dex-okd-button-xl-padding-vertical)*2 + 2px - var(--dex-okd-button-outline-secondary-border-size)*2 + var(--dex-okd-button-xl-line-height) + var(--dex-okd-button-outline-secondary-border-size)*2);
  min-width: 0;
  overflow: hidden;
  padding: 0;
  width: calc(var(--dex-okd-button-xl-padding-vertical)*2 + 2px - var(--dex-okd-button-outline-secondary-border-size)*2 + var(--dex-okd-button-xl-line-height) + var(--dex-okd-button-outline-secondary-border-size)*2)
}

.dex-btn.btn-outline-secondary.btn-xl.dex-btn-strict-circle .btn-content {
  display: block;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  width: 100%
}

.dex-btn.btn-outline-tertiary {
  background: var(--dex-okd-button-outline-tertiary-default-background);
  border-color: var(--dex-okd-button-outline-tertiary-default-border-color);
  border-style: solid;
  border-width: var(--dex-okd-button-outline-tertiary-border-size);
  box-shadow: var(--dex-okd-button-outline-tertiary-default-shadow);
  color: var(--dex-okd-button-outline-tertiary-default-font-color)
}

.dex-btn.btn-outline-tertiary.hover,
.dex-btn.btn-outline-tertiary:not(:disabled):not(.btn-disabled):not(.mobile):hover {
  background: var(--dex-okd-button-outline-tertiary-hover-background);
  border-color: var(--dex-okd-button-outline-tertiary-hover-border-color);
  box-shadow: var(--dex-okd-button-outline-tertiary-hover-shadow);
  color: var(--dex-okd-button-outline-tertiary-hover-font-color)
}

.dex-btn.btn-outline-tertiary.hover .btn-icon,
.dex-btn.btn-outline-tertiary:not(:disabled):not(.btn-disabled):not(.mobile):hover .btn-icon {
  color: var(--dex-okd-button-outline-tertiary-hover-icon-color)
}

.dex-btn.btn-outline-tertiary.active,
.dex-btn.btn-outline-tertiary:not(:disabled):active {
  background: var(--dex-okd-button-outline-tertiary-active-background);
  border-color: var(--dex-okd-button-outline-tertiary-active-border-color);
  box-shadow: var(--dex-okd-button-outline-tertiary-active-shadow);
  color: var(--dex-okd-button-outline-tertiary-active-font-color)
}

.dex-btn.btn-outline-tertiary.active .btn-icon,
.dex-btn.btn-outline-tertiary:not(:disabled):active .btn-icon {
  color: var(--dex-okd-button-outline-tertiary-active-icon-color)
}

.dex-btn.btn-outline-tertiary:not(.loading).btn-disabled,
.dex-btn.btn-outline-tertiary:not(.loading):disabled {
  background: var(--dex-okd-button-outline-tertiary-disabled-background);
  border-color: var(--dex-okd-button-outline-tertiary-disabled-border-color);
  box-shadow: var(--dex-okd-button-outline-tertiary-disabled-shadow);
  color: var(--dex-okd-button-outline-tertiary-disabled-font-color)
}

.dex-btn.btn-outline-tertiary:not(.loading).btn-disabled .btn-icon,
.dex-btn.btn-outline-tertiary:not(.loading):disabled .btn-icon {
  color: var(--dex-okd-button-outline-tertiary-disabled-icon-color)
}

.dex-btn.btn-outline-tertiary.loading {
  cursor: pointer
}

.dex-btn.btn-outline-tertiary .btn-icon {
  color: var(--dex-okd-button-outline-tertiary-default-icon-color)
}

.dex-btn.btn-outline-tertiary .dex-btn-loader-text {
  color: var(--dex-okd-button-outline-tertiary-default-font-color)
}

.dex-btn.btn-outline-tertiary.btn-xxs {
  padding: calc(var(--dex-okd-button-xxs-padding-vertical) + 1px - var(--dex-okd-button-outline-tertiary-border-size)) var(--dex-okd-button-xxs-padding-horizontal)
}

.dex-btn.btn-outline-tertiary.btn-xxs.dex-btn-strict-circle {
  border-radius: 100px;
  height: calc(var(--dex-okd-button-xxs-padding-vertical)*2 + 2px - var(--dex-okd-button-outline-tertiary-border-size)*2 + var(--dex-okd-button-xxs-line-height) + var(--dex-okd-button-outline-tertiary-border-size)*2);
  min-width: 0;
  overflow: hidden;
  padding: 0;
  width: calc(var(--dex-okd-button-xxs-padding-vertical)*2 + 2px - var(--dex-okd-button-outline-tertiary-border-size)*2 + var(--dex-okd-button-xxs-line-height) + var(--dex-okd-button-outline-tertiary-border-size)*2)
}

.dex-btn.btn-outline-tertiary.btn-xxs.dex-btn-strict-circle .btn-content {
  display: block;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  width: 100%
}

.dex-btn.btn-outline-tertiary.btn-xs {
  padding: calc(var(--dex-okd-button-xs-padding-vertical) + 1px - var(--dex-okd-button-outline-tertiary-border-size)) var(--dex-okd-button-xs-padding-horizontal)
}

.dex-btn.btn-outline-tertiary.btn-xs.dex-btn-strict-circle {
  border-radius: 100px;
  height: calc(var(--dex-okd-button-xs-padding-vertical)*2 + 2px - var(--dex-okd-button-outline-tertiary-border-size)*2 + var(--dex-okd-button-xs-line-height) + var(--dex-okd-button-outline-tertiary-border-size)*2);
  min-width: 0;
  overflow: hidden;
  padding: 0;
  width: calc(var(--dex-okd-button-xs-padding-vertical)*2 + 2px - var(--dex-okd-button-outline-tertiary-border-size)*2 + var(--dex-okd-button-xs-line-height) + var(--dex-okd-button-outline-tertiary-border-size)*2)
}

.dex-btn.btn-outline-tertiary.btn-xs.dex-btn-strict-circle .btn-content {
  display: block;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  width: 100%
}

.dex-btn.btn-outline-tertiary.btn-s {
  padding: calc(var(--dex-okd-button-s-padding-vertical) + 1px - var(--dex-okd-button-outline-tertiary-border-size)) var(--dex-okd-button-s-padding-horizontal)
}

.dex-btn.btn-outline-tertiary.btn-s.dex-btn-strict-circle {
  border-radius: 100px;
  height: calc(var(--dex-okd-button-s-padding-vertical)*2 + 2px - var(--dex-okd-button-outline-tertiary-border-size)*2 + var(--dex-okd-button-s-line-height) + var(--dex-okd-button-outline-tertiary-border-size)*2);
  min-width: 0;
  overflow: hidden;
  padding: 0;
  width: calc(var(--dex-okd-button-s-padding-vertical)*2 + 2px - var(--dex-okd-button-outline-tertiary-border-size)*2 + var(--dex-okd-button-s-line-height) + var(--dex-okd-button-outline-tertiary-border-size)*2)
}

.dex-btn.btn-outline-tertiary.btn-s.dex-btn-strict-circle .btn-content {
  display: block;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  width: 100%
}

.dex-btn.btn-outline-tertiary.btn-sm {
  padding: calc(var(--dex-okd-button-sm-padding-vertical) + 1px - var(--dex-okd-button-outline-tertiary-border-size)) var(--dex-okd-button-sm-padding-horizontal)
}

.dex-btn.btn-outline-tertiary.btn-sm.dex-btn-strict-circle {
  border-radius: 100px;
  height: calc(var(--dex-okd-button-sm-padding-vertical)*2 + 2px - var(--dex-okd-button-outline-tertiary-border-size)*2 + var(--dex-okd-button-sm-line-height) + var(--dex-okd-button-outline-tertiary-border-size)*2);
  min-width: 0;
  overflow: hidden;
  padding: 0;
  width: calc(var(--dex-okd-button-sm-padding-vertical)*2 + 2px - var(--dex-okd-button-outline-tertiary-border-size)*2 + var(--dex-okd-button-sm-line-height) + var(--dex-okd-button-outline-tertiary-border-size)*2)
}

.dex-btn.btn-outline-tertiary.btn-sm.dex-btn-strict-circle .btn-content {
  display: block;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  width: 100%
}

.dex-btn.btn-outline-tertiary.btn-md {
  padding: calc(var(--dex-okd-button-md-padding-vertical) + 1px - var(--dex-okd-button-outline-tertiary-border-size)) var(--dex-okd-button-md-padding-horizontal)
}

.dex-btn.btn-outline-tertiary.btn-md.dex-btn-strict-circle {
  border-radius: 100px;
  height: calc(var(--dex-okd-button-md-padding-vertical)*2 + 2px - var(--dex-okd-button-outline-tertiary-border-size)*2 + var(--dex-okd-button-md-line-height) + var(--dex-okd-button-outline-tertiary-border-size)*2);
  min-width: 0;
  overflow: hidden;
  padding: 0;
  width: calc(var(--dex-okd-button-md-padding-vertical)*2 + 2px - var(--dex-okd-button-outline-tertiary-border-size)*2 + var(--dex-okd-button-md-line-height) + var(--dex-okd-button-outline-tertiary-border-size)*2)
}

.dex-btn.btn-outline-tertiary.btn-md.dex-btn-strict-circle .btn-content {
  display: block;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  width: 100%
}

.dex-btn.btn-outline-tertiary.btn-lg {
  padding: calc(var(--dex-okd-button-lg-padding-vertical) + 1px - var(--dex-okd-button-outline-tertiary-border-size)) var(--dex-okd-button-lg-padding-horizontal)
}

.dex-btn.btn-outline-tertiary.btn-lg.dex-btn-strict-circle {
  border-radius: 100px;
  height: calc(var(--dex-okd-button-lg-padding-vertical)*2 + 2px - var(--dex-okd-button-outline-tertiary-border-size)*2 + var(--dex-okd-button-lg-line-height) + var(--dex-okd-button-outline-tertiary-border-size)*2);
  min-width: 0;
  overflow: hidden;
  padding: 0;
  width: calc(var(--dex-okd-button-lg-padding-vertical)*2 + 2px - var(--dex-okd-button-outline-tertiary-border-size)*2 + var(--dex-okd-button-lg-line-height) + var(--dex-okd-button-outline-tertiary-border-size)*2)
}

.dex-btn.btn-outline-tertiary.btn-lg.dex-btn-strict-circle .btn-content {
  display: block;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  width: 100%
}

.dex-btn.btn-outline-tertiary.btn-xl {
  padding: calc(var(--dex-okd-button-xl-padding-vertical) + 1px - var(--dex-okd-button-outline-tertiary-border-size)) var(--dex-okd-button-xl-padding-horizontal)
}

.dex-btn.btn-outline-tertiary.btn-xl.dex-btn-strict-circle {
  border-radius: 100px;
  height: calc(var(--dex-okd-button-xl-padding-vertical)*2 + 2px - var(--dex-okd-button-outline-tertiary-border-size)*2 + var(--dex-okd-button-xl-line-height) + var(--dex-okd-button-outline-tertiary-border-size)*2);
  min-width: 0;
  overflow: hidden;
  padding: 0;
  width: calc(var(--dex-okd-button-xl-padding-vertical)*2 + 2px - var(--dex-okd-button-outline-tertiary-border-size)*2 + var(--dex-okd-button-xl-line-height) + var(--dex-okd-button-outline-tertiary-border-size)*2)
}

.dex-btn.btn-outline-tertiary.btn-xl.dex-btn-strict-circle .btn-content {
  display: block;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  width: 100%
}

.dex-btn.btn-text-primary {
  background: var(--dex-okd-button-text-primary-default-background);
  border-color: var(--dex-okd-button-text-primary-default-border-color);
  border-style: solid;
  border-width: var(--dex-okd-button-text-primary-border-size);
  box-shadow: var(--dex-okd-button-text-primary-default-shadow);
  color: var(--dex-okd-button-text-primary-default-font-color)
}

.dex-btn.btn-text-primary.hover,
.dex-btn.btn-text-primary:not(:disabled):not(.btn-disabled):not(.mobile):hover {
  background: var(--dex-okd-button-text-primary-hover-background);
  border-color: var(--dex-okd-button-text-primary-hover-border-color);
  box-shadow: var(--dex-okd-button-text-primary-hover-shadow);
  color: var(--dex-okd-button-text-primary-hover-font-color)
}

.dex-btn.btn-text-primary.hover .btn-icon,
.dex-btn.btn-text-primary:not(:disabled):not(.btn-disabled):not(.mobile):hover .btn-icon {
  color: var(--dex-okd-button-text-primary-hover-icon-color)
}

.dex-btn.btn-text-primary.active,
.dex-btn.btn-text-primary:not(:disabled):active {
  background: var(--dex-okd-button-text-primary-active-background);
  border-color: var(--dex-okd-button-text-primary-active-border-color);
  box-shadow: var(--dex-okd-button-text-primary-active-shadow);
  color: var(--dex-okd-button-text-primary-active-font-color)
}

.dex-btn.btn-text-primary.active .btn-icon,
.dex-btn.btn-text-primary:not(:disabled):active .btn-icon {
  color: var(--dex-okd-button-text-primary-active-icon-color)
}

.dex-btn.btn-text-primary:not(.loading).btn-disabled,
.dex-btn.btn-text-primary:not(.loading):disabled {
  background: var(--dex-okd-button-text-primary-disabled-background);
  border-color: var(--dex-okd-button-text-primary-disabled-border-color);
  box-shadow: var(--dex-okd-button-text-primary-disabled-shadow);
  color: var(--dex-okd-button-text-primary-disabled-font-color)
}

.dex-btn.btn-text-primary:not(.loading).btn-disabled .btn-icon,
.dex-btn.btn-text-primary:not(.loading):disabled .btn-icon {
  color: var(--dex-okd-button-text-primary-disabled-icon-color)
}

.dex-btn.btn-text-primary.loading {
  cursor: pointer
}

.dex-btn.btn-text-primary .btn-icon {
  color: var(--dex-okd-button-text-primary-default-icon-color)
}

.dex-btn.btn-text-primary .dex-btn-loader-text {
  color: var(--dex-okd-button-text-primary-default-font-color)
}

.dex-btn.btn-text-primary.btn-xxs {
  padding: calc(var(--dex-okd-button-xxs-padding-vertical) + 1px - var(--dex-okd-button-text-primary-border-size)) var(--dex-okd-button-xxs-padding-horizontal)
}

.dex-btn.btn-text-primary.btn-xxs.dex-btn-strict-circle {
  border-radius: 100px;
  height: calc(var(--dex-okd-button-xxs-padding-vertical)*2 + 2px - var(--dex-okd-button-text-primary-border-size)*2 + var(--dex-okd-button-xxs-line-height) + var(--dex-okd-button-text-primary-border-size)*2);
  min-width: 0;
  overflow: hidden;
  padding: 0;
  width: calc(var(--dex-okd-button-xxs-padding-vertical)*2 + 2px - var(--dex-okd-button-text-primary-border-size)*2 + var(--dex-okd-button-xxs-line-height) + var(--dex-okd-button-text-primary-border-size)*2)
}

.dex-btn.btn-text-primary.btn-xxs.dex-btn-strict-circle .btn-content {
  display: block;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  width: 100%
}

.dex-btn.btn-text-primary.btn-xs {
  padding: calc(var(--dex-okd-button-xs-padding-vertical) + 1px - var(--dex-okd-button-text-primary-border-size)) var(--dex-okd-button-xs-padding-horizontal)
}

.dex-btn.btn-text-primary.btn-xs.dex-btn-strict-circle {
  border-radius: 100px;
  height: calc(var(--dex-okd-button-xs-padding-vertical)*2 + 2px - var(--dex-okd-button-text-primary-border-size)*2 + var(--dex-okd-button-xs-line-height) + var(--dex-okd-button-text-primary-border-size)*2);
  min-width: 0;
  overflow: hidden;
  padding: 0;
  width: calc(var(--dex-okd-button-xs-padding-vertical)*2 + 2px - var(--dex-okd-button-text-primary-border-size)*2 + var(--dex-okd-button-xs-line-height) + var(--dex-okd-button-text-primary-border-size)*2)
}

.dex-btn.btn-text-primary.btn-xs.dex-btn-strict-circle .btn-content {
  display: block;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  width: 100%
}

.dex-btn.btn-text-primary.btn-s {
  padding: calc(var(--dex-okd-button-s-padding-vertical) + 1px - var(--dex-okd-button-text-primary-border-size)) var(--dex-okd-button-s-padding-horizontal)
}

.dex-btn.btn-text-primary.btn-s.dex-btn-strict-circle {
  border-radius: 100px;
  height: calc(var(--dex-okd-button-s-padding-vertical)*2 + 2px - var(--dex-okd-button-text-primary-border-size)*2 + var(--dex-okd-button-s-line-height) + var(--dex-okd-button-text-primary-border-size)*2);
  min-width: 0;
  overflow: hidden;
  padding: 0;
  width: calc(var(--dex-okd-button-s-padding-vertical)*2 + 2px - var(--dex-okd-button-text-primary-border-size)*2 + var(--dex-okd-button-s-line-height) + var(--dex-okd-button-text-primary-border-size)*2)
}

.dex-btn.btn-text-primary.btn-s.dex-btn-strict-circle .btn-content {
  display: block;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  width: 100%
}

.dex-btn.btn-text-primary.btn-sm {
  padding: calc(var(--dex-okd-button-sm-padding-vertical) + 1px - var(--dex-okd-button-text-primary-border-size)) var(--dex-okd-button-sm-padding-horizontal)
}

.dex-btn.btn-text-primary.btn-sm.dex-btn-strict-circle {
  border-radius: 100px;
  height: calc(var(--dex-okd-button-sm-padding-vertical)*2 + 2px - var(--dex-okd-button-text-primary-border-size)*2 + var(--dex-okd-button-sm-line-height) + var(--dex-okd-button-text-primary-border-size)*2);
  min-width: 0;
  overflow: hidden;
  padding: 0;
  width: calc(var(--dex-okd-button-sm-padding-vertical)*2 + 2px - var(--dex-okd-button-text-primary-border-size)*2 + var(--dex-okd-button-sm-line-height) + var(--dex-okd-button-text-primary-border-size)*2)
}

.dex-btn.btn-text-primary.btn-sm.dex-btn-strict-circle .btn-content {
  display: block;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  width: 100%
}

.dex-btn.btn-text-primary.btn-md {
  padding: calc(var(--dex-okd-button-md-padding-vertical) + 1px - var(--dex-okd-button-text-primary-border-size)) var(--dex-okd-button-md-padding-horizontal)
}

.dex-btn.btn-text-primary.btn-md.dex-btn-strict-circle {
  border-radius: 100px;
  height: calc(var(--dex-okd-button-md-padding-vertical)*2 + 2px - var(--dex-okd-button-text-primary-border-size)*2 + var(--dex-okd-button-md-line-height) + var(--dex-okd-button-text-primary-border-size)*2);
  min-width: 0;
  overflow: hidden;
  padding: 0;
  width: calc(var(--dex-okd-button-md-padding-vertical)*2 + 2px - var(--dex-okd-button-text-primary-border-size)*2 + var(--dex-okd-button-md-line-height) + var(--dex-okd-button-text-primary-border-size)*2)
}

.dex-btn.btn-text-primary.btn-md.dex-btn-strict-circle .btn-content {
  display: block;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  width: 100%
}

.dex-btn.btn-text-primary.btn-lg {
  padding: calc(var(--dex-okd-button-lg-padding-vertical) + 1px - var(--dex-okd-button-text-primary-border-size)) var(--dex-okd-button-lg-padding-horizontal)
}

.dex-btn.btn-text-primary.btn-lg.dex-btn-strict-circle {
  border-radius: 100px;
  height: calc(var(--dex-okd-button-lg-padding-vertical)*2 + 2px - var(--dex-okd-button-text-primary-border-size)*2 + var(--dex-okd-button-lg-line-height) + var(--dex-okd-button-text-primary-border-size)*2);
  min-width: 0;
  overflow: hidden;
  padding: 0;
  width: calc(var(--dex-okd-button-lg-padding-vertical)*2 + 2px - var(--dex-okd-button-text-primary-border-size)*2 + var(--dex-okd-button-lg-line-height) + var(--dex-okd-button-text-primary-border-size)*2)
}

.dex-btn.btn-text-primary.btn-lg.dex-btn-strict-circle .btn-content {
  display: block;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  width: 100%
}

.dex-btn.btn-text-primary.btn-xl {
  padding: calc(var(--dex-okd-button-xl-padding-vertical) + 1px - var(--dex-okd-button-text-primary-border-size)) var(--dex-okd-button-xl-padding-horizontal)
}

.dex-btn.btn-text-primary.btn-xl.dex-btn-strict-circle {
  border-radius: 100px;
  height: calc(var(--dex-okd-button-xl-padding-vertical)*2 + 2px - var(--dex-okd-button-text-primary-border-size)*2 + var(--dex-okd-button-xl-line-height) + var(--dex-okd-button-text-primary-border-size)*2);
  min-width: 0;
  overflow: hidden;
  padding: 0;
  width: calc(var(--dex-okd-button-xl-padding-vertical)*2 + 2px - var(--dex-okd-button-text-primary-border-size)*2 + var(--dex-okd-button-xl-line-height) + var(--dex-okd-button-text-primary-border-size)*2)
}

.dex-btn.btn-text-primary.btn-xl.dex-btn-strict-circle .btn-content {
  display: block;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  width: 100%
}

.dex-btn.btn-text-secondary {
  background: var(--dex-okd-button-text-secondary-default-background);
  border-color: var(--dex-okd-button-text-secondary-default-border-color);
  border-style: solid;
  border-width: var(--dex-okd-button-text-secondary-border-size);
  box-shadow: var(--dex-okd-button-text-secondary-default-shadow);
  color: var(--dex-okd-button-text-secondary-default-font-color)
}

.dex-btn.btn-text-secondary.hover,
.dex-btn.btn-text-secondary:not(:disabled):not(.btn-disabled):not(.mobile):hover {
  background: var(--dex-okd-button-text-secondary-hover-background);
  border-color: var(--dex-okd-button-text-secondary-hover-border-color);
  box-shadow: var(--dex-okd-button-text-secondary-hover-shadow);
  color: var(--dex-okd-button-text-secondary-hover-font-color)
}

.dex-btn.btn-text-secondary.hover .btn-icon,
.dex-btn.btn-text-secondary:not(:disabled):not(.btn-disabled):not(.mobile):hover .btn-icon {
  color: var(--dex-okd-button-text-secondary-hover-icon-color)
}

.dex-btn.btn-text-secondary.active,
.dex-btn.btn-text-secondary:not(:disabled):active {
  background: var(--dex-okd-button-text-secondary-active-background);
  border-color: var(--dex-okd-button-text-secondary-active-border-color);
  box-shadow: var(--dex-okd-button-text-secondary-active-shadow);
  color: var(--dex-okd-button-text-secondary-active-font-color)
}

.dex-btn.btn-text-secondary.active .btn-icon,
.dex-btn.btn-text-secondary:not(:disabled):active .btn-icon {
  color: var(--dex-okd-button-text-secondary-active-icon-color)
}

.dex-btn.btn-text-secondary:not(.loading).btn-disabled,
.dex-btn.btn-text-secondary:not(.loading):disabled {
  background: var(--dex-okd-button-text-secondary-disabled-background);
  border-color: var(--dex-okd-button-text-secondary-disabled-border-color);
  box-shadow: var(--dex-okd-button-text-secondary-disabled-shadow);
  color: var(--dex-okd-button-text-secondary-disabled-font-color)
}

.dex-btn.btn-text-secondary:not(.loading).btn-disabled .btn-icon,
.dex-btn.btn-text-secondary:not(.loading):disabled .btn-icon {
  color: var(--dex-okd-button-text-secondary-disabled-icon-color)
}

.dex-btn.btn-text-secondary.loading {
  cursor: pointer
}

.dex-btn.btn-text-secondary .btn-icon {
  color: var(--dex-okd-button-text-secondary-default-icon-color)
}

.dex-btn.btn-text-secondary .dex-btn-loader-text {
  color: var(--dex-okd-button-text-secondary-default-font-color)
}

.dex-btn.btn-text-secondary.btn-xxs {
  padding: calc(var(--dex-okd-button-xxs-padding-vertical) + 1px - var(--dex-okd-button-text-secondary-border-size)) var(--dex-okd-button-xxs-padding-horizontal)
}

.dex-btn.btn-text-secondary.btn-xxs.dex-btn-strict-circle {
  border-radius: 100px;
  height: calc(var(--dex-okd-button-xxs-padding-vertical)*2 + 2px - var(--dex-okd-button-text-secondary-border-size)*2 + var(--dex-okd-button-xxs-line-height) + var(--dex-okd-button-text-secondary-border-size)*2);
  min-width: 0;
  overflow: hidden;
  padding: 0;
  width: calc(var(--dex-okd-button-xxs-padding-vertical)*2 + 2px - var(--dex-okd-button-text-secondary-border-size)*2 + var(--dex-okd-button-xxs-line-height) + var(--dex-okd-button-text-secondary-border-size)*2)
}

.dex-btn.btn-text-secondary.btn-xxs.dex-btn-strict-circle .btn-content {
  display: block;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  width: 100%
}

.dex-btn.btn-text-secondary.btn-xs {
  padding: calc(var(--dex-okd-button-xs-padding-vertical) + 1px - var(--dex-okd-button-text-secondary-border-size)) var(--dex-okd-button-xs-padding-horizontal)
}

.dex-btn.btn-text-secondary.btn-xs.dex-btn-strict-circle {
  border-radius: 100px;
  height: calc(var(--dex-okd-button-xs-padding-vertical)*2 + 2px - var(--dex-okd-button-text-secondary-border-size)*2 + var(--dex-okd-button-xs-line-height) + var(--dex-okd-button-text-secondary-border-size)*2);
  min-width: 0;
  overflow: hidden;
  padding: 0;
  width: calc(var(--dex-okd-button-xs-padding-vertical)*2 + 2px - var(--dex-okd-button-text-secondary-border-size)*2 + var(--dex-okd-button-xs-line-height) + var(--dex-okd-button-text-secondary-border-size)*2)
}

.dex-btn.btn-text-secondary.btn-xs.dex-btn-strict-circle .btn-content {
  display: block;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  width: 100%
}

.dex-btn.btn-text-secondary.btn-s {
  padding: calc(var(--dex-okd-button-s-padding-vertical) + 1px - var(--dex-okd-button-text-secondary-border-size)) var(--dex-okd-button-s-padding-horizontal)
}

.dex-btn.btn-text-secondary.btn-s.dex-btn-strict-circle {
  border-radius: 100px;
  height: calc(var(--dex-okd-button-s-padding-vertical)*2 + 2px - var(--dex-okd-button-text-secondary-border-size)*2 + var(--dex-okd-button-s-line-height) + var(--dex-okd-button-text-secondary-border-size)*2);
  min-width: 0;
  overflow: hidden;
  padding: 0;
  width: calc(var(--dex-okd-button-s-padding-vertical)*2 + 2px - var(--dex-okd-button-text-secondary-border-size)*2 + var(--dex-okd-button-s-line-height) + var(--dex-okd-button-text-secondary-border-size)*2)
}

.dex-btn.btn-text-secondary.btn-s.dex-btn-strict-circle .btn-content {
  display: block;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  width: 100%
}

.dex-btn.btn-text-secondary.btn-sm {
  padding: calc(var(--dex-okd-button-sm-padding-vertical) + 1px - var(--dex-okd-button-text-secondary-border-size)) var(--dex-okd-button-sm-padding-horizontal)
}

.dex-btn.btn-text-secondary.btn-sm.dex-btn-strict-circle {
  border-radius: 100px;
  height: calc(var(--dex-okd-button-sm-padding-vertical)*2 + 2px - var(--dex-okd-button-text-secondary-border-size)*2 + var(--dex-okd-button-sm-line-height) + var(--dex-okd-button-text-secondary-border-size)*2);
  min-width: 0;
  overflow: hidden;
  padding: 0;
  width: calc(var(--dex-okd-button-sm-padding-vertical)*2 + 2px - var(--dex-okd-button-text-secondary-border-size)*2 + var(--dex-okd-button-sm-line-height) + var(--dex-okd-button-text-secondary-border-size)*2)
}

.dex-btn.btn-text-secondary.btn-sm.dex-btn-strict-circle .btn-content {
  display: block;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  width: 100%
}

.dex-btn.btn-text-secondary.btn-md {
  padding: calc(var(--dex-okd-button-md-padding-vertical) + 1px - var(--dex-okd-button-text-secondary-border-size)) var(--dex-okd-button-md-padding-horizontal)
}

.dex-btn.btn-text-secondary.btn-md.dex-btn-strict-circle {
  border-radius: 100px;
  height: calc(var(--dex-okd-button-md-padding-vertical)*2 + 2px - var(--dex-okd-button-text-secondary-border-size)*2 + var(--dex-okd-button-md-line-height) + var(--dex-okd-button-text-secondary-border-size)*2);
  min-width: 0;
  overflow: hidden;
  padding: 0;
  width: calc(var(--dex-okd-button-md-padding-vertical)*2 + 2px - var(--dex-okd-button-text-secondary-border-size)*2 + var(--dex-okd-button-md-line-height) + var(--dex-okd-button-text-secondary-border-size)*2)
}

.dex-btn.btn-text-secondary.btn-md.dex-btn-strict-circle .btn-content {
  display: block;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  width: 100%
}

.dex-btn.btn-text-secondary.btn-lg {
  padding: calc(var(--dex-okd-button-lg-padding-vertical) + 1px - var(--dex-okd-button-text-secondary-border-size)) var(--dex-okd-button-lg-padding-horizontal)
}

.dex-btn.btn-text-secondary.btn-lg.dex-btn-strict-circle {
  border-radius: 100px;
  height: calc(var(--dex-okd-button-lg-padding-vertical)*2 + 2px - var(--dex-okd-button-text-secondary-border-size)*2 + var(--dex-okd-button-lg-line-height) + var(--dex-okd-button-text-secondary-border-size)*2);
  min-width: 0;
  overflow: hidden;
  padding: 0;
  width: calc(var(--dex-okd-button-lg-padding-vertical)*2 + 2px - var(--dex-okd-button-text-secondary-border-size)*2 + var(--dex-okd-button-lg-line-height) + var(--dex-okd-button-text-secondary-border-size)*2)
}

.dex-btn.btn-text-secondary.btn-lg.dex-btn-strict-circle .btn-content {
  display: block;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  width: 100%
}

.dex-btn.btn-text-secondary.btn-xl {
  padding: calc(var(--dex-okd-button-xl-padding-vertical) + 1px - var(--dex-okd-button-text-secondary-border-size)) var(--dex-okd-button-xl-padding-horizontal)
}

.dex-btn.btn-text-secondary.btn-xl.dex-btn-strict-circle {
  border-radius: 100px;
  height: calc(var(--dex-okd-button-xl-padding-vertical)*2 + 2px - var(--dex-okd-button-text-secondary-border-size)*2 + var(--dex-okd-button-xl-line-height) + var(--dex-okd-button-text-secondary-border-size)*2);
  min-width: 0;
  overflow: hidden;
  padding: 0;
  width: calc(var(--dex-okd-button-xl-padding-vertical)*2 + 2px - var(--dex-okd-button-text-secondary-border-size)*2 + var(--dex-okd-button-xl-line-height) + var(--dex-okd-button-text-secondary-border-size)*2)
}

.dex-btn.btn-text-secondary.btn-xl.dex-btn-strict-circle .btn-content {
  display: block;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  width: 100%
}

.dex-btn.btn-text-red {
  background: var(--dex-okd-button-text-red-default-background);
  border-color: var(--dex-okd-button-text-red-default-border-color);
  border-style: solid;
  border-width: var(--dex-okd-button-text-red-border-size);
  box-shadow: var(--dex-okd-button-text-red-default-shadow);
  color: var(--dex-okd-button-text-red-default-font-color)
}

.dex-btn.btn-text-red.hover,
.dex-btn.btn-text-red:not(:disabled):not(.btn-disabled):not(.mobile):hover {
  background: var(--dex-okd-button-text-red-hover-background);
  border-color: var(--dex-okd-button-text-red-hover-border-color);
  box-shadow: var(--dex-okd-button-text-red-hover-shadow);
  color: var(--dex-okd-button-text-red-hover-font-color)
}

.dex-btn.btn-text-red.hover .btn-icon,
.dex-btn.btn-text-red:not(:disabled):not(.btn-disabled):not(.mobile):hover .btn-icon {
  color: var(--dex-okd-button-text-red-hover-icon-color)
}

.dex-btn.btn-text-red.active,
.dex-btn.btn-text-red:not(:disabled):active {
  background: var(--dex-okd-button-text-red-active-background);
  border-color: var(--dex-okd-button-text-red-active-border-color);
  box-shadow: var(--dex-okd-button-text-red-active-shadow);
  color: var(--dex-okd-button-text-red-active-font-color)
}

.dex-btn.btn-text-red.active .btn-icon,
.dex-btn.btn-text-red:not(:disabled):active .btn-icon {
  color: var(--dex-okd-button-text-red-active-icon-color)
}

.dex-btn.btn-text-red:not(.loading).btn-disabled,
.dex-btn.btn-text-red:not(.loading):disabled {
  background: var(--dex-okd-button-text-red-disabled-background);
  border-color: var(--dex-okd-button-text-red-disabled-border-color);
  box-shadow: var(--dex-okd-button-text-red-disabled-shadow);
  color: var(--dex-okd-button-text-red-disabled-font-color)
}

.dex-btn.btn-text-red:not(.loading).btn-disabled .btn-icon,
.dex-btn.btn-text-red:not(.loading):disabled .btn-icon {
  color: var(--dex-okd-button-text-red-disabled-icon-color)
}

.dex-btn.btn-text-red.loading {
  cursor: pointer
}

.dex-btn.btn-text-red .btn-icon {
  color: var(--dex-okd-button-text-red-default-icon-color)
}

.dex-btn.btn-text-red .dex-btn-loader-text {
  color: var(--dex-okd-button-text-red-default-font-color)
}

.dex-btn.btn-text-red.btn-xxs {
  padding: calc(var(--dex-okd-button-xxs-padding-vertical) + 1px - var(--dex-okd-button-text-red-border-size)) var(--dex-okd-button-xxs-padding-horizontal)
}

.dex-btn.btn-text-red.btn-xxs.dex-btn-strict-circle {
  border-radius: 100px;
  height: calc(var(--dex-okd-button-xxs-padding-vertical)*2 + 2px - var(--dex-okd-button-text-red-border-size)*2 + var(--dex-okd-button-xxs-line-height) + var(--dex-okd-button-text-red-border-size)*2);
  min-width: 0;
  overflow: hidden;
  padding: 0;
  width: calc(var(--dex-okd-button-xxs-padding-vertical)*2 + 2px - var(--dex-okd-button-text-red-border-size)*2 + var(--dex-okd-button-xxs-line-height) + var(--dex-okd-button-text-red-border-size)*2)
}

.dex-btn.btn-text-red.btn-xxs.dex-btn-strict-circle .btn-content {
  display: block;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  width: 100%
}

.dex-btn.btn-text-red.btn-xs {
  padding: calc(var(--dex-okd-button-xs-padding-vertical) + 1px - var(--dex-okd-button-text-red-border-size)) var(--dex-okd-button-xs-padding-horizontal)
}

.dex-btn.btn-text-red.btn-xs.dex-btn-strict-circle {
  border-radius: 100px;
  height: calc(var(--dex-okd-button-xs-padding-vertical)*2 + 2px - var(--dex-okd-button-text-red-border-size)*2 + var(--dex-okd-button-xs-line-height) + var(--dex-okd-button-text-red-border-size)*2);
  min-width: 0;
  overflow: hidden;
  padding: 0;
  width: calc(var(--dex-okd-button-xs-padding-vertical)*2 + 2px - var(--dex-okd-button-text-red-border-size)*2 + var(--dex-okd-button-xs-line-height) + var(--dex-okd-button-text-red-border-size)*2)
}

.dex-btn.btn-text-red.btn-xs.dex-btn-strict-circle .btn-content {
  display: block;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  width: 100%
}

.dex-btn.btn-text-red.btn-s {
  padding: calc(var(--dex-okd-button-s-padding-vertical) + 1px - var(--dex-okd-button-text-red-border-size)) var(--dex-okd-button-s-padding-horizontal)
}

.dex-btn.btn-text-red.btn-s.dex-btn-strict-circle {
  border-radius: 100px;
  height: calc(var(--dex-okd-button-s-padding-vertical)*2 + 2px - var(--dex-okd-button-text-red-border-size)*2 + var(--dex-okd-button-s-line-height) + var(--dex-okd-button-text-red-border-size)*2);
  min-width: 0;
  overflow: hidden;
  padding: 0;
  width: calc(var(--dex-okd-button-s-padding-vertical)*2 + 2px - var(--dex-okd-button-text-red-border-size)*2 + var(--dex-okd-button-s-line-height) + var(--dex-okd-button-text-red-border-size)*2)
}

.dex-btn.btn-text-red.btn-s.dex-btn-strict-circle .btn-content {
  display: block;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  width: 100%
}

.dex-btn.btn-text-red.btn-sm {
  padding: calc(var(--dex-okd-button-sm-padding-vertical) + 1px - var(--dex-okd-button-text-red-border-size)) var(--dex-okd-button-sm-padding-horizontal)
}

.dex-btn.btn-text-red.btn-sm.dex-btn-strict-circle {
  border-radius: 100px;
  height: calc(var(--dex-okd-button-sm-padding-vertical)*2 + 2px - var(--dex-okd-button-text-red-border-size)*2 + var(--dex-okd-button-sm-line-height) + var(--dex-okd-button-text-red-border-size)*2);
  min-width: 0;
  overflow: hidden;
  padding: 0;
  width: calc(var(--dex-okd-button-sm-padding-vertical)*2 + 2px - var(--dex-okd-button-text-red-border-size)*2 + var(--dex-okd-button-sm-line-height) + var(--dex-okd-button-text-red-border-size)*2)
}

.dex-btn.btn-text-red.btn-sm.dex-btn-strict-circle .btn-content {
  display: block;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  width: 100%
}

.dex-btn.btn-text-red.btn-md {
  padding: calc(var(--dex-okd-button-md-padding-vertical) + 1px - var(--dex-okd-button-text-red-border-size)) var(--dex-okd-button-md-padding-horizontal)
}

.dex-btn.btn-text-red.btn-md.dex-btn-strict-circle {
  border-radius: 100px;
  height: calc(var(--dex-okd-button-md-padding-vertical)*2 + 2px - var(--dex-okd-button-text-red-border-size)*2 + var(--dex-okd-button-md-line-height) + var(--dex-okd-button-text-red-border-size)*2);
  min-width: 0;
  overflow: hidden;
  padding: 0;
  width: calc(var(--dex-okd-button-md-padding-vertical)*2 + 2px - var(--dex-okd-button-text-red-border-size)*2 + var(--dex-okd-button-md-line-height) + var(--dex-okd-button-text-red-border-size)*2)
}

.dex-btn.btn-text-red.btn-md.dex-btn-strict-circle .btn-content {
  display: block;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  width: 100%
}

.dex-btn.btn-text-red.btn-lg {
  padding: calc(var(--dex-okd-button-lg-padding-vertical) + 1px - var(--dex-okd-button-text-red-border-size)) var(--dex-okd-button-lg-padding-horizontal)
}

.dex-btn.btn-text-red.btn-lg.dex-btn-strict-circle {
  border-radius: 100px;
  height: calc(var(--dex-okd-button-lg-padding-vertical)*2 + 2px - var(--dex-okd-button-text-red-border-size)*2 + var(--dex-okd-button-lg-line-height) + var(--dex-okd-button-text-red-border-size)*2);
  min-width: 0;
  overflow: hidden;
  padding: 0;
  width: calc(var(--dex-okd-button-lg-padding-vertical)*2 + 2px - var(--dex-okd-button-text-red-border-size)*2 + var(--dex-okd-button-lg-line-height) + var(--dex-okd-button-text-red-border-size)*2)
}

.dex-btn.btn-text-red.btn-lg.dex-btn-strict-circle .btn-content {
  display: block;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  width: 100%
}

.dex-btn.btn-text-red.btn-xl {
  padding: calc(var(--dex-okd-button-xl-padding-vertical) + 1px - var(--dex-okd-button-text-red-border-size)) var(--dex-okd-button-xl-padding-horizontal)
}

.dex-btn.btn-text-red.btn-xl.dex-btn-strict-circle {
  border-radius: 100px;
  height: calc(var(--dex-okd-button-xl-padding-vertical)*2 + 2px - var(--dex-okd-button-text-red-border-size)*2 + var(--dex-okd-button-xl-line-height) + var(--dex-okd-button-text-red-border-size)*2);
  min-width: 0;
  overflow: hidden;
  padding: 0;
  width: calc(var(--dex-okd-button-xl-padding-vertical)*2 + 2px - var(--dex-okd-button-text-red-border-size)*2 + var(--dex-okd-button-xl-line-height) + var(--dex-okd-button-text-red-border-size)*2)
}

.dex-btn.btn-text-red.btn-xl.dex-btn-strict-circle .btn-content {
  display: block;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  width: 100%
}

.dex-btn.btn-text-green {
  background: var(--dex-okd-button-text-green-default-background);
  border-color: var(--dex-okd-button-text-green-default-border-color);
  border-style: solid;
  border-width: var(--dex-okd-button-text-green-border-size);
  box-shadow: var(--dex-okd-button-text-green-default-shadow);
  color: var(--dex-okd-button-text-green-default-font-color)
}

.dex-btn.btn-text-green.hover,
.dex-btn.btn-text-green:not(:disabled):not(.btn-disabled):not(.mobile):hover {
  background: var(--dex-okd-button-text-green-hover-background);
  border-color: var(--dex-okd-button-text-green-hover-border-color);
  box-shadow: var(--dex-okd-button-text-green-hover-shadow);
  color: var(--dex-okd-button-text-green-hover-font-color)
}

.dex-btn.btn-text-green.hover .btn-icon,
.dex-btn.btn-text-green:not(:disabled):not(.btn-disabled):not(.mobile):hover .btn-icon {
  color: var(--dex-okd-button-text-green-hover-icon-color)
}

.dex-btn.btn-text-green.active,
.dex-btn.btn-text-green:not(:disabled):active {
  background: var(--dex-okd-button-text-green-active-background);
  border-color: var(--dex-okd-button-text-green-active-border-color);
  box-shadow: var(--dex-okd-button-text-green-active-shadow);
  color: var(--dex-okd-button-text-green-active-font-color)
}

.dex-btn.btn-text-green.active .btn-icon,
.dex-btn.btn-text-green:not(:disabled):active .btn-icon {
  color: var(--dex-okd-button-text-green-active-icon-color)
}

.dex-btn.btn-text-green:not(.loading).btn-disabled,
.dex-btn.btn-text-green:not(.loading):disabled {
  background: var(--dex-okd-button-text-green-disabled-background);
  border-color: var(--dex-okd-button-text-green-disabled-border-color);
  box-shadow: var(--dex-okd-button-text-green-disabled-shadow);
  color: var(--dex-okd-button-text-green-disabled-font-color)
}

.dex-btn.btn-text-green:not(.loading).btn-disabled .btn-icon,
.dex-btn.btn-text-green:not(.loading):disabled .btn-icon {
  color: var(--dex-okd-button-text-green-disabled-icon-color)
}

.dex-btn.btn-text-green.loading {
  cursor: pointer
}

.dex-btn.btn-text-green .btn-icon {
  color: var(--dex-okd-button-text-green-default-icon-color)
}

.dex-btn.btn-text-green .dex-btn-loader-text {
  color: var(--dex-okd-button-text-green-default-font-color)
}

.dex-btn.btn-text-green.btn-xxs {
  padding: calc(var(--dex-okd-button-xxs-padding-vertical) + 1px - var(--dex-okd-button-text-green-border-size)) var(--dex-okd-button-xxs-padding-horizontal)
}

.dex-btn.btn-text-green.btn-xxs.dex-btn-strict-circle {
  border-radius: 100px;
  height: calc(var(--dex-okd-button-xxs-padding-vertical)*2 + 2px - var(--dex-okd-button-text-green-border-size)*2 + var(--dex-okd-button-xxs-line-height) + var(--dex-okd-button-text-green-border-size)*2);
  min-width: 0;
  overflow: hidden;
  padding: 0;
  width: calc(var(--dex-okd-button-xxs-padding-vertical)*2 + 2px - var(--dex-okd-button-text-green-border-size)*2 + var(--dex-okd-button-xxs-line-height) + var(--dex-okd-button-text-green-border-size)*2)
}

.dex-btn.btn-text-green.btn-xxs.dex-btn-strict-circle .btn-content {
  display: block;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  width: 100%
}

.dex-btn.btn-text-green.btn-xs {
  padding: calc(var(--dex-okd-button-xs-padding-vertical) + 1px - var(--dex-okd-button-text-green-border-size)) var(--dex-okd-button-xs-padding-horizontal)
}

.dex-btn.btn-text-green.btn-xs.dex-btn-strict-circle {
  border-radius: 100px;
  height: calc(var(--dex-okd-button-xs-padding-vertical)*2 + 2px - var(--dex-okd-button-text-green-border-size)*2 + var(--dex-okd-button-xs-line-height) + var(--dex-okd-button-text-green-border-size)*2);
  min-width: 0;
  overflow: hidden;
  padding: 0;
  width: calc(var(--dex-okd-button-xs-padding-vertical)*2 + 2px - var(--dex-okd-button-text-green-border-size)*2 + var(--dex-okd-button-xs-line-height) + var(--dex-okd-button-text-green-border-size)*2)
}

.dex-btn.btn-text-green.btn-xs.dex-btn-strict-circle .btn-content {
  display: block;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  width: 100%
}

.dex-btn.btn-text-green.btn-s {
  padding: calc(var(--dex-okd-button-s-padding-vertical) + 1px - var(--dex-okd-button-text-green-border-size)) var(--dex-okd-button-s-padding-horizontal)
}

.dex-btn.btn-text-green.btn-s.dex-btn-strict-circle {
  border-radius: 100px;
  height: calc(var(--dex-okd-button-s-padding-vertical)*2 + 2px - var(--dex-okd-button-text-green-border-size)*2 + var(--dex-okd-button-s-line-height) + var(--dex-okd-button-text-green-border-size)*2);
  min-width: 0;
  overflow: hidden;
  padding: 0;
  width: calc(var(--dex-okd-button-s-padding-vertical)*2 + 2px - var(--dex-okd-button-text-green-border-size)*2 + var(--dex-okd-button-s-line-height) + var(--dex-okd-button-text-green-border-size)*2)
}

.dex-btn.btn-text-green.btn-s.dex-btn-strict-circle .btn-content {
  display: block;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  width: 100%
}

.dex-btn.btn-text-green.btn-sm {
  padding: calc(var(--dex-okd-button-sm-padding-vertical) + 1px - var(--dex-okd-button-text-green-border-size)) var(--dex-okd-button-sm-padding-horizontal)
}

.dex-btn.btn-text-green.btn-sm.dex-btn-strict-circle {
  border-radius: 100px;
  height: calc(var(--dex-okd-button-sm-padding-vertical)*2 + 2px - var(--dex-okd-button-text-green-border-size)*2 + var(--dex-okd-button-sm-line-height) + var(--dex-okd-button-text-green-border-size)*2);
  min-width: 0;
  overflow: hidden;
  padding: 0;
  width: calc(var(--dex-okd-button-sm-padding-vertical)*2 + 2px - var(--dex-okd-button-text-green-border-size)*2 + var(--dex-okd-button-sm-line-height) + var(--dex-okd-button-text-green-border-size)*2)
}

.dex-btn.btn-text-green.btn-sm.dex-btn-strict-circle .btn-content {
  display: block;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  width: 100%
}

.dex-btn.btn-text-green.btn-md {
  padding: calc(var(--dex-okd-button-md-padding-vertical) + 1px - var(--dex-okd-button-text-green-border-size)) var(--dex-okd-button-md-padding-horizontal)
}

.dex-btn.btn-text-green.btn-md.dex-btn-strict-circle {
  border-radius: 100px;
  height: calc(var(--dex-okd-button-md-padding-vertical)*2 + 2px - var(--dex-okd-button-text-green-border-size)*2 + var(--dex-okd-button-md-line-height) + var(--dex-okd-button-text-green-border-size)*2);
  min-width: 0;
  overflow: hidden;
  padding: 0;
  width: calc(var(--dex-okd-button-md-padding-vertical)*2 + 2px - var(--dex-okd-button-text-green-border-size)*2 + var(--dex-okd-button-md-line-height) + var(--dex-okd-button-text-green-border-size)*2)
}

.dex-btn.btn-text-green.btn-md.dex-btn-strict-circle .btn-content {
  display: block;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  width: 100%
}

.dex-btn.btn-text-green.btn-lg {
  padding: calc(var(--dex-okd-button-lg-padding-vertical) + 1px - var(--dex-okd-button-text-green-border-size)) var(--dex-okd-button-lg-padding-horizontal)
}

.dex-btn.btn-text-green.btn-lg.dex-btn-strict-circle {
  border-radius: 100px;
  height: calc(var(--dex-okd-button-lg-padding-vertical)*2 + 2px - var(--dex-okd-button-text-green-border-size)*2 + var(--dex-okd-button-lg-line-height) + var(--dex-okd-button-text-green-border-size)*2);
  min-width: 0;
  overflow: hidden;
  padding: 0;
  width: calc(var(--dex-okd-button-lg-padding-vertical)*2 + 2px - var(--dex-okd-button-text-green-border-size)*2 + var(--dex-okd-button-lg-line-height) + var(--dex-okd-button-text-green-border-size)*2)
}

.dex-btn.btn-text-green.btn-lg.dex-btn-strict-circle .btn-content {
  display: block;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  width: 100%
}

.dex-btn.btn-text-green.btn-xl {
  padding: calc(var(--dex-okd-button-xl-padding-vertical) + 1px - var(--dex-okd-button-text-green-border-size)) var(--dex-okd-button-xl-padding-horizontal)
}

.dex-btn.btn-text-green.btn-xl.dex-btn-strict-circle {
  border-radius: 100px;
  height: calc(var(--dex-okd-button-xl-padding-vertical)*2 + 2px - var(--dex-okd-button-text-green-border-size)*2 + var(--dex-okd-button-xl-line-height) + var(--dex-okd-button-text-green-border-size)*2);
  min-width: 0;
  overflow: hidden;
  padding: 0;
  width: calc(var(--dex-okd-button-xl-padding-vertical)*2 + 2px - var(--dex-okd-button-text-green-border-size)*2 + var(--dex-okd-button-xl-line-height) + var(--dex-okd-button-text-green-border-size)*2)
}

.dex-btn.btn-text-green.btn-xl.dex-btn-strict-circle .btn-content {
  display: block;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  width: 100%
}

.dex-btn.btn-text-orange {
  background: var(--dex-okd-button-text-orange-default-background);
  border-color: var(--dex-okd-button-text-orange-default-border-color);
  border-style: solid;
  border-width: var(--dex-okd-button-text-orange-border-size);
  box-shadow: var(--dex-okd-button-text-orange-default-shadow);
  color: var(--dex-okd-button-text-orange-default-font-color)
}

.dex-btn.btn-text-orange.hover,
.dex-btn.btn-text-orange:not(:disabled):not(.btn-disabled):not(.mobile):hover {
  background: var(--dex-okd-button-text-orange-hover-background);
  border-color: var(--dex-okd-button-text-orange-hover-border-color);
  box-shadow: var(--dex-okd-button-text-orange-hover-shadow);
  color: var(--dex-okd-button-text-orange-hover-font-color)
}

.dex-btn.btn-text-orange.hover .btn-icon,
.dex-btn.btn-text-orange:not(:disabled):not(.btn-disabled):not(.mobile):hover .btn-icon {
  color: var(--dex-okd-button-text-orange-hover-icon-color)
}

.dex-btn.btn-text-orange.active,
.dex-btn.btn-text-orange:not(:disabled):active {
  background: var(--dex-okd-button-text-orange-active-background);
  border-color: var(--dex-okd-button-text-orange-active-border-color);
  box-shadow: var(--dex-okd-button-text-orange-active-shadow);
  color: var(--dex-okd-button-text-orange-active-font-color)
}

.dex-btn.btn-text-orange.active .btn-icon,
.dex-btn.btn-text-orange:not(:disabled):active .btn-icon {
  color: var(--dex-okd-button-text-orange-active-icon-color)
}

.dex-btn.btn-text-orange:not(.loading).btn-disabled,
.dex-btn.btn-text-orange:not(.loading):disabled {
  background: var(--dex-okd-button-text-orange-disabled-background);
  border-color: var(--dex-okd-button-text-orange-disabled-border-color);
  box-shadow: var(--dex-okd-button-text-orange-disabled-shadow);
  color: var(--dex-okd-button-text-orange-disabled-font-color)
}

.dex-btn.btn-text-orange:not(.loading).btn-disabled .btn-icon,
.dex-btn.btn-text-orange:not(.loading):disabled .btn-icon {
  color: var(--dex-okd-button-text-orange-disabled-icon-color)
}

.dex-btn.btn-text-orange.loading {
  cursor: pointer
}

.dex-btn.btn-text-orange .btn-icon {
  color: var(--dex-okd-button-text-orange-default-icon-color)
}

.dex-btn.btn-text-orange .dex-btn-loader-text {
  color: var(--dex-okd-button-text-orange-default-font-color)
}

.dex-btn.btn-text-orange.btn-xxs {
  padding: calc(var(--dex-okd-button-xxs-padding-vertical) + 1px - var(--dex-okd-button-text-orange-border-size)) var(--dex-okd-button-xxs-padding-horizontal)
}

.dex-btn.btn-text-orange.btn-xxs.dex-btn-strict-circle {
  border-radius: 100px;
  height: calc(var(--dex-okd-button-xxs-padding-vertical)*2 + 2px - var(--dex-okd-button-text-orange-border-size)*2 + var(--dex-okd-button-xxs-line-height) + var(--dex-okd-button-text-orange-border-size)*2);
  min-width: 0;
  overflow: hidden;
  padding: 0;
  width: calc(var(--dex-okd-button-xxs-padding-vertical)*2 + 2px - var(--dex-okd-button-text-orange-border-size)*2 + var(--dex-okd-button-xxs-line-height) + var(--dex-okd-button-text-orange-border-size)*2)
}

.dex-btn.btn-text-orange.btn-xxs.dex-btn-strict-circle .btn-content {
  display: block;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  width: 100%
}

.dex-btn.btn-text-orange.btn-xs {
  padding: calc(var(--dex-okd-button-xs-padding-vertical) + 1px - var(--dex-okd-button-text-orange-border-size)) var(--dex-okd-button-xs-padding-horizontal)
}

.dex-btn.btn-text-orange.btn-xs.dex-btn-strict-circle {
  border-radius: 100px;
  height: calc(var(--dex-okd-button-xs-padding-vertical)*2 + 2px - var(--dex-okd-button-text-orange-border-size)*2 + var(--dex-okd-button-xs-line-height) + var(--dex-okd-button-text-orange-border-size)*2);
  min-width: 0;
  overflow: hidden;
  padding: 0;
  width: calc(var(--dex-okd-button-xs-padding-vertical)*2 + 2px - var(--dex-okd-button-text-orange-border-size)*2 + var(--dex-okd-button-xs-line-height) + var(--dex-okd-button-text-orange-border-size)*2)
}

.dex-btn.btn-text-orange.btn-xs.dex-btn-strict-circle .btn-content {
  display: block;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  width: 100%
}

.dex-btn.btn-text-orange.btn-s {
  padding: calc(var(--dex-okd-button-s-padding-vertical) + 1px - var(--dex-okd-button-text-orange-border-size)) var(--dex-okd-button-s-padding-horizontal)
}

.dex-btn.btn-text-orange.btn-s.dex-btn-strict-circle {
  border-radius: 100px;
  height: calc(var(--dex-okd-button-s-padding-vertical)*2 + 2px - var(--dex-okd-button-text-orange-border-size)*2 + var(--dex-okd-button-s-line-height) + var(--dex-okd-button-text-orange-border-size)*2);
  min-width: 0;
  overflow: hidden;
  padding: 0;
  width: calc(var(--dex-okd-button-s-padding-vertical)*2 + 2px - var(--dex-okd-button-text-orange-border-size)*2 + var(--dex-okd-button-s-line-height) + var(--dex-okd-button-text-orange-border-size)*2)
}

.dex-btn.btn-text-orange.btn-s.dex-btn-strict-circle .btn-content {
  display: block;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  width: 100%
}

.dex-btn.btn-text-orange.btn-sm {
  padding: calc(var(--dex-okd-button-sm-padding-vertical) + 1px - var(--dex-okd-button-text-orange-border-size)) var(--dex-okd-button-sm-padding-horizontal)
}

.dex-btn.btn-text-orange.btn-sm.dex-btn-strict-circle {
  border-radius: 100px;
  height: calc(var(--dex-okd-button-sm-padding-vertical)*2 + 2px - var(--dex-okd-button-text-orange-border-size)*2 + var(--dex-okd-button-sm-line-height) + var(--dex-okd-button-text-orange-border-size)*2);
  min-width: 0;
  overflow: hidden;
  padding: 0;
  width: calc(var(--dex-okd-button-sm-padding-vertical)*2 + 2px - var(--dex-okd-button-text-orange-border-size)*2 + var(--dex-okd-button-sm-line-height) + var(--dex-okd-button-text-orange-border-size)*2)
}

.dex-btn.btn-text-orange.btn-sm.dex-btn-strict-circle .btn-content {
  display: block;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  width: 100%
}

.dex-btn.btn-text-orange.btn-md {
  padding: calc(var(--dex-okd-button-md-padding-vertical) + 1px - var(--dex-okd-button-text-orange-border-size)) var(--dex-okd-button-md-padding-horizontal)
}

.dex-btn.btn-text-orange.btn-md.dex-btn-strict-circle {
  border-radius: 100px;
  height: calc(var(--dex-okd-button-md-padding-vertical)*2 + 2px - var(--dex-okd-button-text-orange-border-size)*2 + var(--dex-okd-button-md-line-height) + var(--dex-okd-button-text-orange-border-size)*2);
  min-width: 0;
  overflow: hidden;
  padding: 0;
  width: calc(var(--dex-okd-button-md-padding-vertical)*2 + 2px - var(--dex-okd-button-text-orange-border-size)*2 + var(--dex-okd-button-md-line-height) + var(--dex-okd-button-text-orange-border-size)*2)
}

.dex-btn.btn-text-orange.btn-md.dex-btn-strict-circle .btn-content {
  display: block;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  width: 100%
}

.dex-btn.btn-text-orange.btn-lg {
  padding: calc(var(--dex-okd-button-lg-padding-vertical) + 1px - var(--dex-okd-button-text-orange-border-size)) var(--dex-okd-button-lg-padding-horizontal)
}

.dex-btn.btn-text-orange.btn-lg.dex-btn-strict-circle {
  border-radius: 100px;
  height: calc(var(--dex-okd-button-lg-padding-vertical)*2 + 2px - var(--dex-okd-button-text-orange-border-size)*2 + var(--dex-okd-button-lg-line-height) + var(--dex-okd-button-text-orange-border-size)*2);
  min-width: 0;
  overflow: hidden;
  padding: 0;
  width: calc(var(--dex-okd-button-lg-padding-vertical)*2 + 2px - var(--dex-okd-button-text-orange-border-size)*2 + var(--dex-okd-button-lg-line-height) + var(--dex-okd-button-text-orange-border-size)*2)
}

.dex-btn.btn-text-orange.btn-lg.dex-btn-strict-circle .btn-content {
  display: block;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  width: 100%
}

.dex-btn.btn-text-orange.btn-xl {
  padding: calc(var(--dex-okd-button-xl-padding-vertical) + 1px - var(--dex-okd-button-text-orange-border-size)) var(--dex-okd-button-xl-padding-horizontal)
}

.dex-btn.btn-text-orange.btn-xl.dex-btn-strict-circle {
  border-radius: 100px;
  height: calc(var(--dex-okd-button-xl-padding-vertical)*2 + 2px - var(--dex-okd-button-text-orange-border-size)*2 + var(--dex-okd-button-xl-line-height) + var(--dex-okd-button-text-orange-border-size)*2);
  min-width: 0;
  overflow: hidden;
  padding: 0;
  width: calc(var(--dex-okd-button-xl-padding-vertical)*2 + 2px - var(--dex-okd-button-text-orange-border-size)*2 + var(--dex-okd-button-xl-line-height) + var(--dex-okd-button-text-orange-border-size)*2)
}

.dex-btn.btn-text-orange.btn-xl.dex-btn-strict-circle .btn-content {
  display: block;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  width: 100%
}

.dex-btn.btn-text-yellow {
  background: var(--dex-okd-button-text-yellow-default-background);
  border-color: var(--dex-okd-button-text-yellow-default-border-color);
  border-style: solid;
  border-width: var(--dex-okd-button-text-yellow-border-size);
  box-shadow: var(--dex-okd-button-text-yellow-default-shadow);
  color: var(--dex-okd-button-text-yellow-default-font-color)
}

.dex-btn.btn-text-yellow.hover,
.dex-btn.btn-text-yellow:not(:disabled):not(.btn-disabled):not(.mobile):hover {
  background: var(--dex-okd-button-text-yellow-hover-background);
  border-color: var(--dex-okd-button-text-yellow-hover-border-color);
  box-shadow: var(--dex-okd-button-text-yellow-hover-shadow);
  color: var(--dex-okd-button-text-yellow-hover-font-color)
}

.dex-btn.btn-text-yellow.hover .btn-icon,
.dex-btn.btn-text-yellow:not(:disabled):not(.btn-disabled):not(.mobile):hover .btn-icon {
  color: var(--dex-okd-button-text-yellow-hover-icon-color)
}

.dex-btn.btn-text-yellow.active,
.dex-btn.btn-text-yellow:not(:disabled):active {
  background: var(--dex-okd-button-text-yellow-active-background);
  border-color: var(--dex-okd-button-text-yellow-active-border-color);
  box-shadow: var(--dex-okd-button-text-yellow-active-shadow);
  color: var(--dex-okd-button-text-yellow-active-font-color)
}

.dex-btn.btn-text-yellow.active .btn-icon,
.dex-btn.btn-text-yellow:not(:disabled):active .btn-icon {
  color: var(--dex-okd-button-text-yellow-active-icon-color)
}

.dex-btn.btn-text-yellow:not(.loading).btn-disabled,
.dex-btn.btn-text-yellow:not(.loading):disabled {
  background: var(--dex-okd-button-text-yellow-disabled-background);
  border-color: var(--dex-okd-button-text-yellow-disabled-border-color);
  box-shadow: var(--dex-okd-button-text-yellow-disabled-shadow);
  color: var(--dex-okd-button-text-yellow-disabled-font-color)
}

.dex-btn.btn-text-yellow:not(.loading).btn-disabled .btn-icon,
.dex-btn.btn-text-yellow:not(.loading):disabled .btn-icon {
  color: var(--dex-okd-button-text-yellow-disabled-icon-color)
}

.dex-btn.btn-text-yellow.loading {
  cursor: pointer
}

.dex-btn.btn-text-yellow .btn-icon {
  color: var(--dex-okd-button-text-yellow-default-icon-color)
}

.dex-btn.btn-text-yellow .dex-btn-loader-text {
  color: var(--dex-okd-button-text-yellow-default-font-color)
}

.dex-btn.btn-text-yellow.btn-xxs {
  padding: calc(var(--dex-okd-button-xxs-padding-vertical) + 1px - var(--dex-okd-button-text-yellow-border-size)) var(--dex-okd-button-xxs-padding-horizontal)
}

.dex-btn.btn-text-yellow.btn-xxs.dex-btn-strict-circle {
  border-radius: 100px;
  height: calc(var(--dex-okd-button-xxs-padding-vertical)*2 + 2px - var(--dex-okd-button-text-yellow-border-size)*2 + var(--dex-okd-button-xxs-line-height) + var(--dex-okd-button-text-yellow-border-size)*2);
  min-width: 0;
  overflow: hidden;
  padding: 0;
  width: calc(var(--dex-okd-button-xxs-padding-vertical)*2 + 2px - var(--dex-okd-button-text-yellow-border-size)*2 + var(--dex-okd-button-xxs-line-height) + var(--dex-okd-button-text-yellow-border-size)*2)
}

.dex-btn.btn-text-yellow.btn-xxs.dex-btn-strict-circle .btn-content {
  display: block;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  width: 100%
}

.dex-btn.btn-text-yellow.btn-xs {
  padding: calc(var(--dex-okd-button-xs-padding-vertical) + 1px - var(--dex-okd-button-text-yellow-border-size)) var(--dex-okd-button-xs-padding-horizontal)
}

.dex-btn.btn-text-yellow.btn-xs.dex-btn-strict-circle {
  border-radius: 100px;
  height: calc(var(--dex-okd-button-xs-padding-vertical)*2 + 2px - var(--dex-okd-button-text-yellow-border-size)*2 + var(--dex-okd-button-xs-line-height) + var(--dex-okd-button-text-yellow-border-size)*2);
  min-width: 0;
  overflow: hidden;
  padding: 0;
  width: calc(var(--dex-okd-button-xs-padding-vertical)*2 + 2px - var(--dex-okd-button-text-yellow-border-size)*2 + var(--dex-okd-button-xs-line-height) + var(--dex-okd-button-text-yellow-border-size)*2)
}

.dex-btn.btn-text-yellow.btn-xs.dex-btn-strict-circle .btn-content {
  display: block;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  width: 100%
}

.dex-btn.btn-text-yellow.btn-s {
  padding: calc(var(--dex-okd-button-s-padding-vertical) + 1px - var(--dex-okd-button-text-yellow-border-size)) var(--dex-okd-button-s-padding-horizontal)
}

.dex-btn.btn-text-yellow.btn-s.dex-btn-strict-circle {
  border-radius: 100px;
  height: calc(var(--dex-okd-button-s-padding-vertical)*2 + 2px - var(--dex-okd-button-text-yellow-border-size)*2 + var(--dex-okd-button-s-line-height) + var(--dex-okd-button-text-yellow-border-size)*2);
  min-width: 0;
  overflow: hidden;
  padding: 0;
  width: calc(var(--dex-okd-button-s-padding-vertical)*2 + 2px - var(--dex-okd-button-text-yellow-border-size)*2 + var(--dex-okd-button-s-line-height) + var(--dex-okd-button-text-yellow-border-size)*2)
}

.dex-btn.btn-text-yellow.btn-s.dex-btn-strict-circle .btn-content {
  display: block;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  width: 100%
}

.dex-btn.btn-text-yellow.btn-sm {
  padding: calc(var(--dex-okd-button-sm-padding-vertical) + 1px - var(--dex-okd-button-text-yellow-border-size)) var(--dex-okd-button-sm-padding-horizontal)
}

.dex-btn.btn-text-yellow.btn-sm.dex-btn-strict-circle {
  border-radius: 100px;
  height: calc(var(--dex-okd-button-sm-padding-vertical)*2 + 2px - var(--dex-okd-button-text-yellow-border-size)*2 + var(--dex-okd-button-sm-line-height) + var(--dex-okd-button-text-yellow-border-size)*2);
  min-width: 0;
  overflow: hidden;
  padding: 0;
  width: calc(var(--dex-okd-button-sm-padding-vertical)*2 + 2px - var(--dex-okd-button-text-yellow-border-size)*2 + var(--dex-okd-button-sm-line-height) + var(--dex-okd-button-text-yellow-border-size)*2)
}

.dex-btn.btn-text-yellow.btn-sm.dex-btn-strict-circle .btn-content {
  display: block;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  width: 100%
}

.dex-btn.btn-text-yellow.btn-md {
  padding: calc(var(--dex-okd-button-md-padding-vertical) + 1px - var(--dex-okd-button-text-yellow-border-size)) var(--dex-okd-button-md-padding-horizontal)
}

.dex-btn.btn-text-yellow.btn-md.dex-btn-strict-circle {
  border-radius: 100px;
  height: calc(var(--dex-okd-button-md-padding-vertical)*2 + 2px - var(--dex-okd-button-text-yellow-border-size)*2 + var(--dex-okd-button-md-line-height) + var(--dex-okd-button-text-yellow-border-size)*2);
  min-width: 0;
  overflow: hidden;
  padding: 0;
  width: calc(var(--dex-okd-button-md-padding-vertical)*2 + 2px - var(--dex-okd-button-text-yellow-border-size)*2 + var(--dex-okd-button-md-line-height) + var(--dex-okd-button-text-yellow-border-size)*2)
}

.dex-btn.btn-text-yellow.btn-md.dex-btn-strict-circle .btn-content {
  display: block;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  width: 100%
}

.dex-btn.btn-text-yellow.btn-lg {
  padding: calc(var(--dex-okd-button-lg-padding-vertical) + 1px - var(--dex-okd-button-text-yellow-border-size)) var(--dex-okd-button-lg-padding-horizontal)
}

.dex-btn.btn-text-yellow.btn-lg.dex-btn-strict-circle {
  border-radius: 100px;
  height: calc(var(--dex-okd-button-lg-padding-vertical)*2 + 2px - var(--dex-okd-button-text-yellow-border-size)*2 + var(--dex-okd-button-lg-line-height) + var(--dex-okd-button-text-yellow-border-size)*2);
  min-width: 0;
  overflow: hidden;
  padding: 0;
  width: calc(var(--dex-okd-button-lg-padding-vertical)*2 + 2px - var(--dex-okd-button-text-yellow-border-size)*2 + var(--dex-okd-button-lg-line-height) + var(--dex-okd-button-text-yellow-border-size)*2)
}

.dex-btn.btn-text-yellow.btn-lg.dex-btn-strict-circle .btn-content {
  display: block;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  width: 100%
}

.dex-btn.btn-text-yellow.btn-xl {
  padding: calc(var(--dex-okd-button-xl-padding-vertical) + 1px - var(--dex-okd-button-text-yellow-border-size)) var(--dex-okd-button-xl-padding-horizontal)
}

.dex-btn.btn-text-yellow.btn-xl.dex-btn-strict-circle {
  border-radius: 100px;
  height: calc(var(--dex-okd-button-xl-padding-vertical)*2 + 2px - var(--dex-okd-button-text-yellow-border-size)*2 + var(--dex-okd-button-xl-line-height) + var(--dex-okd-button-text-yellow-border-size)*2);
  min-width: 0;
  overflow: hidden;
  padding: 0;
  width: calc(var(--dex-okd-button-xl-padding-vertical)*2 + 2px - var(--dex-okd-button-text-yellow-border-size)*2 + var(--dex-okd-button-xl-line-height) + var(--dex-okd-button-text-yellow-border-size)*2)
}

.dex-btn.btn-text-yellow.btn-xl.dex-btn-strict-circle .btn-content {
  display: block;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  width: 100%
}

.dex-btn.btn-xxs {
  border-radius: var(--dex-okd-button-xxs-border-radius);
  font-weight: 500;
  font-weight: var(--dex-okd-button-xxs-font-weight, 500);
  min-width: var(--dex-okd-button-xxs-min-width)
}

.dex-btn.btn-xxs,
.dex-btn.btn-xxs .dex-btn-loader-text {
  font-size: var(--dex-okd-button-xxs-font-size);
  line-height: var(--dex-okd-button-xxs-line-height)
}

.dex-btn.btn-xxs .dex-btn-loader-text {
  margin-left: var(--dex-okd-button-xxs-loader-text-margin-left)
}

.dex-btn.btn-xxs.btn-rect {
  border-radius: 4px;
  border-radius: var(--dex-okd-button-rect-xxs-border-radius, 4px)
}

.dex-btn.btn-xs {
  border-radius: var(--dex-okd-button-xs-border-radius);
  font-weight: 500;
  font-weight: var(--dex-okd-button-xs-font-weight, 500);
  min-width: var(--dex-okd-button-xs-min-width)
}

.dex-btn.btn-xs,
.dex-btn.btn-xs .dex-btn-loader-text {
  font-size: var(--dex-okd-button-xs-font-size);
  line-height: var(--dex-okd-button-xs-line-height)
}

.dex-btn.btn-xs .dex-btn-loader-text {
  margin-left: var(--dex-okd-button-xs-loader-text-margin-left)
}

.dex-btn.btn-xs.btn-rect {
  border-radius: 4px;
  border-radius: var(--dex-okd-button-rect-xs-border-radius, 4px)
}

.dex-btn.btn-s {
  border-radius: var(--dex-okd-button-s-border-radius);
  font-weight: 500;
  font-weight: var(--dex-okd-button-s-font-weight, 500);
  min-width: var(--dex-okd-button-s-min-width)
}

.dex-btn.btn-s,
.dex-btn.btn-s .dex-btn-loader-text {
  font-size: var(--dex-okd-button-s-font-size);
  line-height: var(--dex-okd-button-s-line-height)
}

.dex-btn.btn-s .dex-btn-loader-text {
  margin-left: var(--dex-okd-button-s-loader-text-margin-left)
}

.dex-btn.btn-s.btn-rect {
  border-radius: 4px;
  border-radius: var(--dex-okd-button-rect-s-border-radius, 4px)
}

.dex-btn.btn-sm {
  border-radius: var(--dex-okd-button-sm-border-radius);
  font-weight: 500;
  font-weight: var(--dex-okd-button-sm-font-weight, 500);
  min-width: var(--dex-okd-button-sm-min-width)
}

.dex-btn.btn-sm,
.dex-btn.btn-sm .dex-btn-loader-text {
  font-size: var(--dex-okd-button-sm-font-size);
  line-height: var(--dex-okd-button-sm-line-height)
}

.dex-btn.btn-sm .dex-btn-loader-text {
  margin-left: var(--dex-okd-button-sm-loader-text-margin-left)
}

.dex-btn.btn-sm.btn-rect {
  border-radius: 4px;
  border-radius: var(--dex-okd-button-rect-sm-border-radius, 4px)
}

.dex-btn.btn-md {
  border-radius: var(--dex-okd-button-md-border-radius);
  font-weight: 500;
  font-weight: var(--dex-okd-button-md-font-weight, 500);
  min-width: var(--dex-okd-button-md-min-width)
}

.dex-btn.btn-md,
.dex-btn.btn-md .dex-btn-loader-text {
  font-size: var(--dex-okd-button-md-font-size);
  line-height: var(--dex-okd-button-md-line-height)
}

.dex-btn.btn-md .dex-btn-loader-text {
  margin-left: var(--dex-okd-button-md-loader-text-margin-left)
}

.dex-btn.btn-md.btn-rect {
  border-radius: 4px;
  border-radius: var(--dex-okd-button-rect-md-border-radius, 4px)
}

.dex-btn.btn-lg {
  border-radius: var(--dex-okd-button-lg-border-radius);
  font-weight: 500;
  font-weight: var(--dex-okd-button-lg-font-weight, 500);
  min-width: var(--dex-okd-button-lg-min-width)
}

.dex-btn.btn-lg,
.dex-btn.btn-lg .dex-btn-loader-text {
  font-size: var(--dex-okd-button-lg-font-size);
  line-height: var(--dex-okd-button-lg-line-height)
}

.dex-btn.btn-lg .dex-btn-loader-text {
  margin-left: var(--dex-okd-button-lg-loader-text-margin-left)
}

.dex-btn.btn-lg.btn-rect {
  border-radius: 8px;
  border-radius: var(--dex-okd-button-rect-lg-border-radius, 8px)
}

.dex-btn.btn-xl {
  border-radius: var(--dex-okd-button-xl-border-radius);
  font-weight: 500;
  font-weight: var(--dex-okd-button-xl-font-weight, 500);
  min-width: var(--dex-okd-button-xl-min-width)
}

.dex-btn.btn-xl,
.dex-btn.btn-xl .dex-btn-loader-text {
  font-size: var(--dex-okd-button-xl-font-size);
  line-height: var(--dex-okd-button-xl-line-height)
}

.dex-btn.btn-xl .dex-btn-loader-text {
  margin-left: var(--dex-okd-button-xl-loader-text-margin-left)
}

.dex-btn.btn-xl.btn-rect {
  border-radius: 8px;
  border-radius: var(--dex-okd-button-rect-xl-border-radius, 8px)
}

.dex-btn.btn-disabled,
.dex-btn:disabled {
  cursor: not-allowed
}

.dex-btn.block {
  display: flex;
  width: 100%
}

.dex-btn.btn-circle {
  border-radius: 100px !important
}

.dex-btn .btn-content {
  align-items: center;
  display: flex
}

.dex-btn .dex-btn-ellipsis {
  display: block;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  width: 100%
}

.dex-btn.loading .btn-content {
  opacity: 0
}

.dex-btn.loading .btn-content-position {
  display: none
}

.dex-btn.loading .dex-btn-loader {
  line-height: 0;
  position: absolute
}

.dex-btn.loading .btn-loader-position-absolute {
  position: relative
}

.dex-btn-loader-container {
  height: 100%;
  position: relative
}

.dex-btn .btn-icon+.btn-content {
  margin-left: 4px
}

.dex-btn.btn-xxs .btn-icon {
  font-size: var(--dex-okd-button-xxs-icon-size)
}

.dex-btn.btn-xxs .btn-icon-leading {
  margin-right: var(--dex-okd-button-xxs-icon-margin)
}

.dex-btn.btn-xxs .btn-icon-tailing {
  margin-left: var(--dex-okd-button-xxs-icon-margin)
}

.dex-btn.btn-xxs .dex-btn-loader-size {
  border-radius: var(--dex-okd-button-xxs-loader-size);
  height: var(--dex-okd-button-xxs-loader-size);
  width: var(--dex-okd-button-xxs-loader-size)
}

.dex-btn.btn-xs .btn-icon {
  font-size: var(--dex-okd-button-xs-icon-size)
}

.dex-btn.btn-xs .btn-icon-leading {
  margin-right: var(--dex-okd-button-xs-icon-margin)
}

.dex-btn.btn-xs .btn-icon-tailing {
  margin-left: var(--dex-okd-button-xs-icon-margin)
}

.dex-btn.btn-xs .dex-btn-loader-size {
  border-radius: var(--dex-okd-button-xs-loader-size);
  height: var(--dex-okd-button-xs-loader-size);
  width: var(--dex-okd-button-xs-loader-size)
}

.dex-btn.btn-s .btn-icon {
  font-size: var(--dex-okd-button-s-icon-size)
}

.dex-btn.btn-s .btn-icon-leading {
  margin-right: var(--dex-okd-button-s-icon-margin)
}

.dex-btn.btn-s .btn-icon-tailing {
  margin-left: var(--dex-okd-button-s-icon-margin)
}

.dex-btn.btn-s .dex-btn-loader-size {
  border-radius: var(--dex-okd-button-s-loader-size);
  height: var(--dex-okd-button-s-loader-size);
  width: var(--dex-okd-button-s-loader-size)
}

.dex-btn.btn-sm .btn-icon {
  font-size: var(--dex-okd-button-sm-icon-size)
}

.dex-btn.btn-sm .btn-icon-leading {
  margin-right: var(--dex-okd-button-sm-icon-margin)
}

.dex-btn.btn-sm .btn-icon-tailing {
  margin-left: var(--dex-okd-button-sm-icon-margin)
}

.dex-btn.btn-sm .dex-btn-loader-size {
  border-radius: var(--dex-okd-button-sm-loader-size);
  height: var(--dex-okd-button-sm-loader-size);
  width: var(--dex-okd-button-sm-loader-size)
}

.dex-btn.btn-md .btn-icon {
  font-size: var(--dex-okd-button-md-icon-size)
}

.dex-btn.btn-md .btn-icon-leading {
  margin-right: var(--dex-okd-button-md-icon-margin)
}

.dex-btn.btn-md .btn-icon-tailing {
  margin-left: var(--dex-okd-button-md-icon-margin)
}

.dex-btn.btn-md .dex-btn-loader-size {
  border-radius: var(--dex-okd-button-md-loader-size);
  height: var(--dex-okd-button-md-loader-size);
  width: var(--dex-okd-button-md-loader-size)
}

.dex-btn.btn-lg .btn-icon {
  font-size: var(--dex-okd-button-lg-icon-size)
}

.dex-btn.btn-lg .btn-icon-leading {
  margin-right: var(--dex-okd-button-lg-icon-margin)
}

.dex-btn.btn-lg .btn-icon-tailing {
  margin-left: var(--dex-okd-button-lg-icon-margin)
}

.dex-btn.btn-lg .dex-btn-loader-size {
  border-radius: var(--dex-okd-button-lg-loader-size);
  height: var(--dex-okd-button-lg-loader-size);
  width: var(--dex-okd-button-lg-loader-size)
}

.dex-btn.btn-xl .btn-icon {
  font-size: var(--dex-okd-button-xl-icon-size)
}

.dex-btn.btn-xl .btn-icon-leading {
  margin-right: var(--dex-okd-button-xl-icon-margin)
}

.dex-btn.btn-xl .btn-icon-tailing {
  margin-left: var(--dex-okd-button-xl-icon-margin)
}

.dex-btn.btn-xl .dex-btn-loader-size {
  border-radius: var(--dex-okd-button-xl-loader-size);
  height: var(--dex-okd-button-xl-loader-size);
  width: var(--dex-okd-button-xl-loader-size)
}

.dex-btn .dex-btn-fill-highlight-loader {
  border-color: var(--dex-okd-button-fill-highlight-loader-track-color);
  border-top-color: var(--dex-okd-button-fill-highlight-loader-mark-color)
}

.dex-btn .dex-btn-fill-primary-loader {
  border-color: var(--dex-okd-button-fill-primary-loader-track-color);
  border-top-color: var(--dex-okd-button-fill-primary-loader-mark-color)
}

.dex-btn .dex-btn-fill-secondary-loader {
  border-color: var(--dex-okd-button-fill-secondary-loader-track-color);
  border-top-color: var(--dex-okd-button-fill-secondary-loader-mark-color)
}

.dex-btn .dex-btn-fill-tertiary-loader {
  border-color: var(--dex-okd-button-fill-tertiary-loader-track-color);
  border-top-color: var(--dex-okd-button-fill-tertiary-loader-mark-color)
}

.dex-btn .dex-btn-fill-quaternary-loader {
  border-color: var(--dex-okd-button-fill-quaternary-loader-track-color);
  border-top-color: var(--dex-okd-button-fill-quaternary-loader-mark-color)
}

.dex-btn .dex-btn-fill-red-loader {
  border-color: var(--dex-okd-button-fill-red-loader-track-color);
  border-top-color: var(--dex-okd-button-fill-red-loader-mark-color)
}

.dex-btn .dex-btn-fill-green-loader {
  border-color: var(--dex-okd-button-fill-green-loader-track-color);
  border-top-color: var(--dex-okd-button-fill-green-loader-mark-color)
}

.dex-btn .dex-btn-fill-grey-loader {
  border-color: var(--dex-okd-button-fill-grey-loader-track-color);
  border-top-color: var(--dex-okd-button-fill-grey-loader-mark-color)
}

.dex-btn .dex-btn-outline-highlight-loader {
  border-color: var(--dex-okd-button-outline-highlight-loader-track-color);
  border-top-color: var(--dex-okd-button-outline-highlight-loader-mark-color)
}

.dex-btn .dex-btn-outline-primary-loader {
  border-color: var(--dex-okd-button-outline-primary-loader-track-color);
  border-top-color: var(--dex-okd-button-outline-primary-loader-mark-color)
}

.dex-btn .dex-btn-outline-secondary-loader {
  border-color: var(--dex-okd-button-outline-secondary-loader-track-color);
  border-top-color: var(--dex-okd-button-outline-secondary-loader-mark-color)
}

.dex-btn .dex-btn-outline-tertiary-loader {
  border-color: var(--dex-okd-button-outline-tertiary-loader-track-color);
  border-top-color: var(--dex-okd-button-outline-tertiary-loader-mark-color)
}

.dex-dialog {
  --inner-okd-dialog-close-btn-padding: var(--dex-okd-dialog-window-action-fixed-padding, 16px);
  height: 100%;
  pointer-events: none;
  width: 100%
}

.dex-dialog-float {
  left: 0;
  position: fixed;
  top: 0
}

.dex-dialog * {
  -webkit-tap-highlight-color: transparent;
  box-sizing: border-box
}

.dex-dialog-window-float {
  left: 50%;
  position: absolute;
  top: 50%;
  transform: translate(-50%, -50%)
}

@supports (bottom:constant(safe-area-inset-bottom)) or (bottom:env(safe-area-inset-bottom)) {
  .dex-dialog-window-safe {
    padding-bottom: env(safe-area-inset-bottom)
  }
}

.dex-dialog-window {
  border-radius: var(--dex-okd-dialog-window-border-radius);
  box-shadow: var(--dex-okd-dialog-window-box-shadow);
  display: flex;
  flex-direction: column;
  margin-left: auto;
  margin-right: auto;
  max-height: calc(100% - 48px);
  outline: none;
  pointer-events: auto;
  width: calc(100% - 32px)
}

.dex-dialog-window-border {
  border: 1px solid transparent;
  border: 1px solid var(--dex-okd-dialog-window-border-color, transparent)
}

.dex-dialog-title-container {
  align-items: center;
  display: flex;
  flex-direction: row;
  flex-shrink: 0;
  justify-content: space-between
}

.dex-dialog-title-container .title-center {
  text-align: center
}

.dex-dialog-title-container .title-center .modal-title {
  justify-content: center
}

.dex-dialog .title-center .dex-dialog-top-l {
  margin-right: 32px;
  margin-right: var(--dex-okd-dialog-title-icon-close-margin-left, 32px)
}

.dex-dialog-title-block {
  display: flex;
  flex-direction: column;
  flex-grow: 1
}

.dex-dialog-title-block .modal-title {
  font-size: 16px;
  font-size: var(--dex-okd-dialog-title-font-size, 16px);
  font-weight: 700;
  font-weight: var(--dex-okd-dialog-title-font-weight, 700);
  line-height: var(--dex-okd-dialog-title-line-height);
  padding-top: 2px
}

.dex-dialog-title-block .modal-sub-title {
  font-size: var(--dex-okd-dialog-sub-title-font-size);
  font-weight: 400;
  line-height: var(--dex-okd-dialog-sub-title-line-height);
  margin-top: 2px
}

.dex-dialog-b-btn,
.dex-dialog-c-btn {
  cursor: pointer;
  display: inline-block;
  height: var(--dex-okd-dialog-window-close-icon-size);
  justify-content: center;
  line-height: 1;
  position: relative;
  vertical-align: middle;
  width: var(--dex-okd-dialog-window-close-icon-size);
  z-index: 1
}

.dex-dialog-b-btn.icon,
.dex-dialog-c-btn.icon {
  font-size: var(--dex-okd-dialog-window-close-icon-size)
}

.dex-dialog-b-btn:after,
.dex-dialog-c-btn:after {
  content: " ";
  display: block;
  height: calc(var(--dex-okd-dialog-window-close-icon-size)*1.5);
  left: -25%;
  position: absolute;
  top: -25%;
  width: calc(var(--dex-okd-dialog-window-close-icon-size)*1.5)
}

.dex-dialog-b-btn {
  height: var(--dex-okd-dialog-window-back-icon-size);
  margin-right: 16px;
  margin-right: var(--dex-okd-dialog-title-icon-back-margin-right, 16px);
  width: var(--dex-okd-dialog-window-back-icon-size)
}

.dex-dialog-b-btn.icon {
  font-size: var(--dex-okd-dialog-window-back-icon-size)
}

.dex-dialog-c-btn {
  margin-left: 32px;
  margin-left: var(--dex-okd-dialog-title-icon-close-margin-left, 32px)
}

.dex-dialog-top-action-fixed {
  padding: var(--inner-okd-dialog-close-btn-padding);
  position: absolute;
  top: 0
}

.dex-dialog-top-action-fixed .dex-dialog-b-btn,
.dex-dialog-top-action-fixed .dex-dialog-c-btn {
  margin: 0
}

.dex-dialog-top-l {
  align-self: flex-start;
  left: 0
}

.dex-dialog-top-r {
  align-self: flex-start;
  right: 0
}

.dex-dialog-top-hidden-for-t-center {
  pointer-events: none;
  visibility: hidden
}

.dex-dialog-top-action-hidden {
  display: none;
  pointer-events: none
}

.dex-dialog-scroll-box {
  flex-grow: 1;
  overflow-y: auto
}

.dex-dialog-scroll-box.scroll-disable {
  overflow-y: unset
}

.dex-dialog-container,
.dex-dialog-customer-box {
  height: 100%
}

.dex-dialog-container.no-padding,
.dex-dialog-customer-box.no-padding {
  padding: 0
}

.dex-dialog .dex-dialog-footer-line {
  border-top: thin solid var(--dex-okd-dialog-window-split-line-border-color)
}

.dex-dialog .dex-dialog-header-line {
  border-bottom: thin solid var(--dex-okd-dialog-window-split-line-border-color)
}

.dex-dialog-btn-box {
  display: flex
}

.dex-dialog-btn-box.layout-right {
  justify-content: flex-end
}

.dex-dialog-btn-box.layout-left {
  justify-content: flex-start
}

.dex-dialog-btn-box.layout-full .dialog-btn {
  flex: 1 1
}

.dex-dialog .dex-dialog-window {
  background: var(--dex-okd-dialog-window-background);
  color: var(--dex-okd-dialog-window-default-text-color)
}

.dex-dialog .dex-dialog-window.container-mode {
  background: transparent;
  box-shadow: none
}

.dex-dialog .dex-dialog-title-container .modal-title {
  align-items: center;
  color: var(--dex-okd-dialog-title-color);
  display: flex
}

.dex-dialog .dex-dialog-title-container .modal-sub-title {
  color: var(--dex-okd-dialog-sub-title-color)
}

.dex-dialog .dex-dialog-c-btn {
  color: var(--dex-okd-color-gray-400);
  color: var(--dex-okd-dialog-title-icon-close-color, var(--dex-okd-color-gray-400))
}

.dex-dialog .dex-dialog-c-btn:hover {
  background-color: var(--dex-okd-color-background-hover);
  background-color: var(--dex-okd-dialog-title-icon-hover-background-color, var(--dex-okd-color-background-hover));
  border-radius: 4px;
  border-radius: var(--dex-okd-dialog-title-icon-hover-border-radius, 4px);
  color: var(--dex-okd-color-gray-900);
  color: var(--dex-okd-dialog-title-icon-close-hover-color, var(--dex-okd-color-gray-900))
}

.dex-dialog .dex-dialog-b-btn {
  color: var(--dex-okd-color-gray-900);
  color: var(--dex-okd-dialog-title-icon-back-color, var(--dex-okd-color-gray-900))
}

.dex-dialog .dex-dialog-b-btn:hover {
  background-color: var(--dex-okd-color-background-hover);
  background-color: var(--dex-okd-dialog-title-icon-hover-background-color, var(--dex-okd-color-background-hover));
  border-radius: 4px;
  border-radius: var(--dex-okd-dialog-title-icon-hover-border-radius, 4px)
}

.dex-dialog-mask {
  background: var(--dex-okd-dialog-window-mask-color)
}

.dex-dialog-scroll-bar-end::-webkit-scrollbar,
.dex-dialog-scroll-bar-start::-webkit-scrollbar {
  background-color: initial
}

.dex-dialog-scroll-bar-start::-webkit-scrollbar-button:vertical:start:increment {
  background-color: initial;
  display: block;
  height: var(--dex-okd-dialog-window-border-radius)
}

.dex-dialog-scroll-bar-end::-webkit-scrollbar-button:vertical:end:increment {
  background-color: initial;
  display: block;
  height: var(--dex-okd-dialog-window-border-radius)
}

@media (min-width:768px) {
  .dex-dialog-window {
    min-width: var(--dex-okd-dialog-window-min-width);
    width: auto
  }

  .dex-dialog-title-container {
    padding: var(--dex-okd-dialog-title-box-md-padding-vertical) var(--dex-okd-dialog-container-md-padding-horizontal)
  }

  .dex-dialog-container {
    padding: var(--dex-okd-dialog-container-md-padding-vertical) var(--dex-okd-dialog-container-md-padding-horizontal)
  }

  .dex-dialog-customer-box {
    padding: 0 var(--dex-okd-dialog-container-md-padding-horizontal)
  }

  .dex-dialog-footer-box {
    padding: var(--dex-okd-dialog-footer-box-md-padding-vertical) var(--dex-okd-dialog-container-md-padding-horizontal)
  }

  .dex-dialog-btn-box .dialog-btn.double-btn {
    width: auto
  }

  .dex-dialog-btn-box.layout-full {
    flex-direction: row
  }

  .dex-dialog-btn-box .dialog-btn+.dialog-btn {
    margin-left: 16px;
    margin-left: var(--dex-okd-dialog-footer-btn-md-margin-left, 16px)
  }
}

@media (max-width:767px) {
  .dex-dialog-title-container {
    padding: var(--dex-okd-dialog-title-box-sm-padding-vertical) var(--dex-okd-dialog-container-sm-padding-horizontal)
  }

  .dex-dialog-container {
    padding: var(--dex-okd-dialog-container-sm-padding-vertical) var(--dex-okd-dialog-container-sm-padding-horizontal)
  }

  .dex-dialog-customer-box {
    padding: 0 var(--dex-okd-dialog-container-sm-padding-horizontal)
  }

  .dex-dialog-footer-box {
    padding: var(--dex-okd-dialog-footer-box-sm-padding-top, 12px) var(--dex-okd-dialog-container-sm-padding-horizontal) var(--dex-okd-dialog-footer-box-sm-padding-bottom, 20px)
  }

  .dex-dialog-btn-box .dialog-btn {
    width: 100%
  }

  .dex-dialog-btn-box .dialog-btn+.dialog-btn {
    margin-left: 12px;
    margin-left: var(--dex-okd-dialog-footer-btn-sm-margin-left, 12px)
  }

  .dex-dialog-btn-box.layout-full {
    flex-direction: column-reverse
  }

  .dex-dialog-btn-box.layout-full .dialog-btn+.dialog-btn {
    margin-left: 0
  }

  .dex-dialog-btn-box.layout-full .double-btn:first-child {
    margin-top: 8px;
    margin-top: var(--dex-okd-dialog-footer-btn-full-sm-margin-top, 8px)
  }

  .dex-dialog-window {
    border-radius: 8px;
    border-radius: var(--dex-okd-dialog-window-sm-border-radius, 8px)
  }

  .dex-dialog-window.full-page {
    height: auto !important;
    min-height: calc(100% - 48px) !important
  }

  .dex-dialog-window.full-page-with-show-header {
    height: auto !important
  }

  .dex-dialog-window.bottom-align {
    border-radius: var(--dex-okd-dialog-window-border-radius) var(--dex-okd-dialog-window-border-radius) 0 0;
    bottom: 0;
    top: auto;
    transform: translate(-50%)
  }

  .dex-dialog-window.no-margin {
    min-width: unset;
    width: 100%
  }
}

.dex-dialog-mobile-mode .dex-dialog-title-container {
  padding: var(--dex-okd-dialog-title-box-sm-padding-vertical) var(--dex-okd-dialog-container-sm-padding-horizontal)
}

.dex-dialog-mobile-mode .dex-dialog-container {
  padding: var(--dex-okd-dialog-container-sm-padding-vertical) var(--dex-okd-dialog-container-sm-padding-horizontal)
}

.dex-dialog-mobile-mode .dex-dialog-customer-box {
  padding: 0 var(--dex-okd-dialog-container-sm-padding-horizontal)
}

.dex-dialog-mobile-mode .dex-dialog-footer-box {
  padding: var(--dex-okd-dialog-footer-box-sm-padding-top, 12px) var(--dex-okd-dialog-container-sm-padding-horizontal) var(--dex-okd-dialog-footer-box-sm-padding-bottom, 20px)
}

.dex-dialog-mobile-mode .dex-dialog-btn-box .dialog-btn {
  width: 100%
}

.dex-dialog-mobile-mode .dex-dialog-btn-box .dialog-btn+.dialog-btn {
  margin-left: 12px;
  margin-left: var(--dex-okd-dialog-footer-btn-sm-margin-left, 12px)
}

.dex-dialog-mobile-mode .dex-dialog-btn-box.layout-full {
  flex-direction: column-reverse
}

.dex-dialog-mobile-mode .dex-dialog-btn-box.layout-full .dialog-btn+.dialog-btn {
  margin-left: 0
}

.dex-dialog-mobile-mode .dex-dialog-btn-box.layout-full .double-btn:first-child {
  margin-top: 8px;
  margin-top: var(--dex-okd-dialog-footer-btn-full-sm-margin-top, 8px)
}

.dex-dialog-mobile-mode .dex-dialog-window {
  border-radius: 8px;
  border-radius: var(--dex-okd-dialog-window-sm-border-radius, 8px)
}

.dex-dialog-mobile-mode .dex-dialog-window.full-page {
  height: auto !important;
  min-height: calc(100% - 48px) !important
}

.dex-dialog-mobile-mode .dex-dialog-window.full-page-with-show-header {
  height: auto !important
}

.dex-dialog-mobile-mode .dex-dialog-window.bottom-align {
  border-radius: var(--dex-okd-dialog-window-border-radius) var(--dex-okd-dialog-window-border-radius) 0 0;
  bottom: 0;
  top: auto;
  transform: translate(-50%)
}

.dex-dialog-mobile-mode .dex-dialog-window.no-margin {
  min-width: unset;
  width: 100%
}

.dex-dialog-mobile-mode .dex-dialog-container.no-padding,
.dex-dialog-mobile-mode .dex-dialog-customer-box.no-padding {
  padding: 0
}

.dex-dialog-mobile-mode .dex-dialog-window {
  min-width: unset;
  width: calc(100% - 32px)
}

.dex-dialog.dex-action-dialog .dex-dialog-window.no-radius {
  border-radius: 0
}

.dex-dialog-group {
  overflow: hidden
}

.dex-dialog-group-window {
  display: flex;
  flex-direction: column
}

.dex-dialog.dex-tip-dialog .dex-dialog-tip-content {
  align-items: center;
  display: flex;
  flex-direction: column;
  justify-content: center;
  text-align: center
}

.dex-dialog.dex-tip-dialog .dex-dialog-tip-content .tip-title-box {
  width: 100%
}

.dex-dialog.dex-tip-dialog .dex-dialog-tip-content .tip-title {
  font-size: var(--dex-okd-dialog-tip-title-font-size);
  font-weight: 500;
  line-height: var(--dex-okd-dialog-tip-title-line-height);
  min-height: var(--dex-okd-dialog-tip-title-line-height)
}

.dex-dialog.dex-tip-dialog .dex-dialog-tip-content .tip-detail {
  font-size: var(--dex-okd-dialog-tip-detail-font-size);
  font-weight: 400;
  line-height: var(--dex-okd-dialog-tip-detail-line-height);
  margin-top: 8px
}

.dex-dialog.dex-tip-dialog .dex-dialog-tip-content .tip-detail+.tip-detail {
  margin-top: 2px
}

.dex-dialog.dex-tip-dialog .dex-dialog-tip-content .tip-title {
  color: var(--dex-okd-dialog-tip-title-color)
}

.dex-dialog.dex-tip-dialog .dex-dialog-tip-content .tip-detail {
  color: var(--dex-okd-dialog-tip-detail-color)
}

.dex-dialog.dex-tip-dialog .dex-dialog-footer-box {
  border-top: none
}

@media (max-width:767px) {
  .dex-dialog.dex-tip-dialog .dex-dialog-window.bottom-align {
    border-radius: var(--dex-okd-dialog-window-border-radius);
    bottom: 16px
  }

  .dex-dialog.dex-tip-dialog .dex-dialog-container {
    padding: var(--dex-okd-dialog-tip-container-sm-padding-top, 20px) var(--dex-okd-dialog-container-sm-padding-horizontal) var(--dex-okd-dialog-tip-container-sm-padding-bottom, 24px)
  }

  .dex-dialog.dex-tip-dialog .dex-dialog-footer-box {
    padding: 0 var(--dex-okd-dialog-container-sm-padding-horizontal) var(--dex-okd-dialog-tip-footer-box-sm-padding-vertical) var(--dex-okd-dialog-container-sm-padding-horizontal)
  }
}

@media (min-width:768px) {
  .dex-dialog.dex-tip-dialog .dex-dialog-tip-content {
    margin-left: auto;
    margin-right: auto;
    max-width: var(--dex-okd-dialog-tip-window-min-width)
  }

  .dex-dialog.dex-tip-dialog .dex-dialog-tip-content.two-btn {
    max-width: var(--dex-okd-dialog-tip-window-2btn-min-width)
  }

  .dex-dialog.dex-tip-dialog .dex-dialog-container {
    padding: var(--dex-okd-dialog-tip-container-md-padding-top, 28px) var(--dex-okd-dialog-container-sm-padding-horizontal) var(--dex-okd-dialog-tip-container-md-padding-bottom, 24px)
  }

  .dex-dialog.dex-tip-dialog .dex-dialog-footer-box {
    padding: 0 var(--dex-okd-dialog-container-md-padding-horizontal) var(--dex-okd-dialog-tip-footer-box-md-padding-vertical) var(--dex-okd-dialog-container-md-padding-horizontal)
  }
}

.dex-dialog-tip-icon-bg {
  align-items: center;
  display: flex;
  justify-content: center;
  margin-bottom: 12px
}

.dex-dialog-tip-icon-bg .tip-icon {
  font-size: var(--dex-okd-dialog-tip-icon-font-size)
}

.dex-dialog-alert-icon {
  margin-top: -6px
}

.dex-dialog .dex-dialog-window-tip {
  background-color: var(--dex-okd-dialog-window-background);
  background-color: var(--dex-okd-dialog-confirm-window-background, var(--dex-okd-dialog-window-background))
}

.dex-dialog.dex-new-tip-dialog .dex-dialog-new-tip-top {
  padding: 24px 24px 0;
  padding: var(--dex-okd-dialog-confirm-title-padding-top, 24px) var(--dex-okd-dialog-confirm-title-padding-horizontal, 24px) var(--dex-okd-dialog-confirm-title-padding-bottom, 0)
}

.dex-dialog.dex-new-tip-dialog .dex-dialog-container.dex-dialog-new-tip-container {
  color: #000;
  color: var(--dex-okd-dialog-confirm-container-color, #000);
  font-size: 14px;
  font-size: var(--dex-okd-dialog-confirm-container-font-size, 14px);
  line-height: 20px;
  line-height: var(--dex-okd-dialog-confirm-container-line-height, 20px)
}

@media (min-width:768px) {
  .dex-dialog.dex-new-tip-dialog .dex-dialog-window {
    max-width: 520px;
    max-width: var(--dex-okd-dialog-confirm-max-width, 520px);
    min-width: 280px;
    min-width: var(--dex-okd-dialog-confirm-min-width, 280px)
  }

  .dex-dialog.dex-new-tip-dialog .dex-dialog-container.dex-dialog-new-tip-container {
    padding-bottom: 32px;
    padding-bottom: var(--dex-okd-dialog-confirm-container-padding-bottom, 32px);
    padding-top: 32px;
    padding-top: var(--dex-okd-dialog-confirm-container-padding-top, 32px)
  }

  .dex-dialog.dex-new-tip-dialog .dex-dialog-footer-box {
    padding-bottom: 24px;
    padding-bottom: var(--dex-okd-dialog-confirm-footer-padding-bottom, 24px);
    padding-top: 0;
    padding-top: var(--dex-okd-dialog-confirm-footer-padding-top, 0)
  }
}

@media (max-width:767px) {
  .dex-dialog.dex-new-tip-dialog .dex-dialog-window {
    width: calc(100% - 64px)
  }

  .dex-dialog.dex-new-tip-dialog .dex-dialog-container.dex-dialog-new-tip-container {
    padding: 8px 24px 24px;
    padding: var(--dex-okd-dialog-confirm-container-sm-padding-top, 8px) var(--dex-okd-dialog-confirm-container-sm-padding-horizontal, 24px) var(--dex-okd-dialog-confirm-container-sm-padding-bottom, 24px)
  }

  .dex-dialog.dex-new-tip-dialog .dex-dialog-container.dex-dialog-no-title {
    padding-top: 24px;
    padding-top: var(--dex-okd-dialog-confirm-no-title-padding-top, 24px)
  }

  .dex-dialog.dex-new-tip-dialog .dex-dialog-footer-box.dex-dialog-new-tip-footer {
    padding: 0
  }

  .dex-dialog.dex-new-tip-dialog .dex-dialog-footer-box.dex-dialog-new-tip-footer .dex-dialog-tip-button {
    border: 0;
    border-radius: 0;
    border-top: thin solid #dbdbdb;
    border-top: thin solid var(--dex-okd-dialog-confirm-footer-sm-button-border-color, #dbdbdb)
  }

  .dex-dialog.dex-new-tip-dialog .dex-dialog-footer-box.dex-dialog-new-tip-footer .dex-dialog-tip-button-color {
    color: var(--dex-okd-color-blue-800);
    color: var(--dex-okd-dialog-confirm-footer-sm-button-color, var(--dex-okd-color-blue-800))
  }

  .dex-dialog.dex-new-tip-dialog .dex-dialog-footer-box.dex-dialog-new-tip-footer .dex-dialog-tip-button-confirm {
    font-weight: 700
  }

  .dex-dialog.dex-new-tip-dialog .dex-dialog-footer-box.dex-dialog-new-tip-footer .dex-dialog-tip-button-cancel {
    font-weight: 400
  }

  .dex-dialog.dex-new-tip-dialog .dex-dialog-footer-box.dex-dialog-new-tip-footer .dex-dialog-tip-only-one {
    border-radius: 0 0 var(--dex-okd-dialog-window-sm-border-radius) var(--dex-okd-dialog-window-sm-border-radius)
  }

  .dex-dialog.dex-new-tip-dialog .dex-dialog-footer-box.dex-dialog-new-tip-footer .dex-dialog-tip-border-top:first-child {
    border-radius: 0 0 var(--dex-okd-dialog-window-sm-border-radius) var(--dex-okd-dialog-window-sm-border-radius);
    margin-top: 0
  }

  .dex-dialog.dex-new-tip-dialog .dex-dialog-footer-box.dex-dialog-new-tip-footer .dex-dialog-tip-border-left:first-child {
    border-radius: 0 0 0 var(--dex-okd-dialog-window-sm-border-radius)
  }

  .dex-dialog.dex-new-tip-dialog .dex-dialog-footer-box.dex-dialog-new-tip-footer .dex-dialog-tip-border-left+.dex-dialog-tip-border-left {
    border-left: thin solid #dbdbdb;
    border-left: thin solid var(--dex-okd-dialog-confirm-footer-sm-button-border-color, #dbdbdb);
    border-radius: 0 0 var(--dex-okd-dialog-window-sm-border-radius) 0;
    margin-left: 0
  }
}

.dex-dialog-mobile-mode.dex-new-tip-dialog .dex-dialog-window {
  width: calc(100% - 64px)
}

.dex-dialog-mobile-mode.dex-new-tip-dialog .dex-dialog-container.dex-dialog-new-tip-container {
  padding: 8px 24px 24px;
  padding: var(--dex-okd-dialog-confirm-container-sm-padding-top, 8px) var(--dex-okd-dialog-confirm-container-sm-padding-horizontal, 24px) var(--dex-okd-dialog-confirm-container-sm-padding-bottom, 24px)
}

.dex-dialog-mobile-mode.dex-new-tip-dialog .dex-dialog-container.dex-dialog-no-title {
  padding-top: 24px;
  padding-top: var(--dex-okd-dialog-confirm-no-title-padding-top, 24px)
}

.dex-dialog-mobile-mode.dex-new-tip-dialog .dex-dialog-footer-box.dex-dialog-new-tip-footer {
  padding: 0
}

.dex-dialog-mobile-mode.dex-new-tip-dialog .dex-dialog-footer-box.dex-dialog-new-tip-footer .dex-dialog-tip-button {
  border: 0;
  border-radius: 0;
  border-top: thin solid #dbdbdb;
  border-top: thin solid var(--dex-okd-dialog-confirm-footer-sm-button-border-color, #dbdbdb)
}

.dex-dialog-mobile-mode.dex-new-tip-dialog .dex-dialog-footer-box.dex-dialog-new-tip-footer .dex-dialog-tip-button-color {
  color: var(--dex-okd-color-blue-800);
  color: var(--dex-okd-dialog-confirm-footer-sm-button-color, var(--dex-okd-color-blue-800))
}

.dex-dialog-mobile-mode.dex-new-tip-dialog .dex-dialog-footer-box.dex-dialog-new-tip-footer .dex-dialog-tip-button-confirm {
  font-weight: 700
}

.dex-dialog-mobile-mode.dex-new-tip-dialog .dex-dialog-footer-box.dex-dialog-new-tip-footer .dex-dialog-tip-button-cancel {
  font-weight: 400
}

.dex-dialog-mobile-mode.dex-new-tip-dialog .dex-dialog-footer-box.dex-dialog-new-tip-footer .dex-dialog-tip-only-one {
  border-radius: 0 0 var(--dex-okd-dialog-window-sm-border-radius) var(--dex-okd-dialog-window-sm-border-radius)
}

.dex-dialog-mobile-mode.dex-new-tip-dialog .dex-dialog-footer-box.dex-dialog-new-tip-footer .dex-dialog-tip-border-top:first-child {
  border-radius: 0 0 var(--dex-okd-dialog-window-sm-border-radius) var(--dex-okd-dialog-window-sm-border-radius);
  margin-top: 0
}

.dex-dialog-mobile-mode.dex-new-tip-dialog .dex-dialog-footer-box.dex-dialog-new-tip-footer .dex-dialog-tip-border-left:first-child {
  border-radius: 0 0 0 var(--dex-okd-dialog-window-sm-border-radius)
}

.dex-dialog-mobile-mode.dex-new-tip-dialog .dex-dialog-footer-box.dex-dialog-new-tip-footer .dex-dialog-tip-border-left+.dex-dialog-tip-border-left {
  border-left: thin solid #dbdbdb;
  border-left: thin solid var(--dex-okd-dialog-confirm-footer-sm-button-border-color, #dbdbdb);
  border-radius: 0 0 var(--dex-okd-dialog-window-sm-border-radius) 0;
  margin-left: 0
}

.iconfont.dex-dialog-tip-icon {
  align-self: flex-start;
  font-size: 22px;
  font-size: var(--dex-okd-dialog-confirm-icon-font-size, 22px);
  font-weight: 400;
  line-height: 22px;
  line-height: var(--dex-okd-dialog-confirm-icon-line-height, 22px);
  margin-right: 10px;
  margin-right: var(--dex-okd-dialog-confirm-icon-margin-right, 10px)
}

.dex-dialog-success-icon,
.dex-dialog-success-tip-icon {
  color: var(--dex-okd-dialog-tip-success-icon-color)
}

.dex-dialog-info-icon,
.dex-dialog-info-tip-icon {
  color: var(--dex-okd-dialog-tip-info-icon-color)
}

.dex-dialog-prompt-icon,
.dex-dialog-prompt-tip-icon {
  color: var(--dex-okd-dialog-tip-prompt-icon-color)
}

.dex-dialog-warn-icon,
.dex-dialog-warn-tip-icon {
  color: var(--dex-okd-dialog-tip-warn-icon-color)
}

.dex-dialog-alert-icon,
.dex-dialog-alert-tip-icon {
  color: var(--dex-okd-dialog-tip-alert-icon-color)
}

.dex-dialog-error-icon,
.dex-dialog-error-tip-icon {
  color: var(--dex-okd-dialog-tip-error-icon-color)
}

.dex-dialog .dex-dialog-confirmation-window {
  background-color: var(--dex-okd-dialog-window-background);
  background-color: var(--dex-okd-dialog-confirmation-window-background, var(--dex-okd-dialog-window-background))
}

.dex-dialog-confirmation {
  --inner-okd-dialog-close-btn-padding: 22px
}

.dex-dialog-confirmation-header {
  font-size: 16px;
  font-size: var(--dex-okd-dialog-title-font-size, 16px);
  font-weight: 700;
  font-weight: var(--dex-okd-dialog-title-font-weight, 700);
  line-height: var(--dex-okd-dialog-title-line-height);
  padding: 24px;
  padding: var(--dex-okd-dialog-confirmation-header-padding-top, 24px) var(--dex-okd-dialog-confirmation-padding-right, 24px) var(--dex-okd-dialog-confirmation-header-padding-top, 24px) var(--dex-okd-dialog-confirmation-padding-left, 24px)
}

.dex-dialog-confirmation-header-margin {
  margin-right: 36px
}

.dex-dialog-confirmation-container {
  flex-grow: 1;
  line-height: 22px;
  overflow-y: auto;
  padding-bottom: 8px;
  padding-left: 24px;
  padding-left: var(--dex-okd-dialog-confirmation-padding-left, 24px);
  padding-right: 24px;
  padding-right: var(--dex-okd-dialog-confirmation-padding-right, 24px);
  padding-top: 8px
}

.dex-dialog-confirmation-container-no-header {
  padding-top: 32px;
  padding-top: var(--dex-okd-dialog-confirmation-container-padding-top, 32px)
}

.dex-dialog-confirmation-container-no-footer {
  padding-bottom: 32px;
  padding-bottom: var(--dex-okd-dialog-confirmation-container-padding-bottom, 32px)
}

.dex-dialog-confirmation-footer {
  padding: 24px;
  padding: var(--dex-okd-dialog-confirmation-footer-padding-bottom, 24px) var(--dex-okd-dialog-confirmation-padding-right, 24px) var(--dex-okd-dialog-confirmation-footer-padding-bottom, 24px) var(--dex-okd-dialog-confirmation-padding-left, 24px)
}

.dex-input-reversed .dex-input-box {
  background: var(--dex-okd-input-reversed-default-background);
  border: thin solid var(--dex-okd-input-reversed-default-border-color);
  box-shadow: var(--dex-okd-input-reversed-default-shadow);
  transition: border-color .3s, box-shadow .3s
}

.dex-input-reversed .dex-input-input {
  color: var(--dex-okd-input-reversed-default-text-color)
}

.dex-input-reversed .dex-input-input::-webkit-input-placeholder {
  -webkit-text-fill-color: var(--dex-okd-input-reversed-default-placeholder-color);
  color: var(--dex-okd-input-reversed-default-placeholder-color)
}

.dex-input-reversed .dex-input-input:-moz-placeholder {
  -webkit-text-fill-color: var(--dex-okd-input-reversed-default-placeholder-color);
  color: var(--dex-okd-input-reversed-default-placeholder-color);
  opacity: 1
}

.dex-input-reversed .dex-input-input::-ms-input-placeholder {
  -webkit-text-fill-color: var(--dex-okd-input-reversed-default-placeholder-color);
  color: var(--dex-okd-input-reversed-default-placeholder-color)
}

.dex-input-reversed .dex-input-input:-webkit-autofill {
  -webkit-text-fill-color: var(--dex-okd-input-reversed-default-text-color) !important;
  border: none;
  -webkit-box-shadow: 0 0 0 30px var(--dex-okd-input-reversed-default-background) inset
}

.dex-input-reversed .dex-input-error {
  color: var(--dex-okd-input-reversed-error-tips-color)
}

.dex-input-reversed .dex-input-help-text,
.dex-input-reversed .dex-input-tips {
  color: var(--dex-okd-input-reversed-tips-text-color)
}

.dex-input.dex-input-reversed.hover .dex-input-box,
.dex-input.dex-input-reversed:hover .dex-input-box {
  background: var(--dex-okd-input-reversed-hover-background);
  border: thin solid var(--dex-okd-input-reversed-hover-border-color);
  box-shadow: var(--dex-okd-input-reversed-hover-shadow)
}

.dex-input.dex-input-reversed.hover .dex-input-box .dex-input-input,
.dex-input.dex-input-reversed:hover .dex-input-box .dex-input-input {
  -webkit-text-fill-color: var(--dex-okd-input-reversed-hover-text-color);
  caret-color: var(--dex-okd-input-reversed-hover-caret-color);
  color: var(--dex-okd-input-reversed-hover-text-color)
}

.dex-input.dex-input-reversed.hover .dex-input-box .dex-input-input::-webkit-input-placeholder,
.dex-input.dex-input-reversed:hover .dex-input-box .dex-input-input::-webkit-input-placeholder {
  -webkit-text-fill-color: var(--dex-okd-input-reversed-hover-placeholder-color);
  color: var(--dex-okd-input-reversed-hover-placeholder-color)
}

.dex-input.dex-input-reversed.hover .dex-input-box .dex-input-input:-moz-placeholder,
.dex-input.dex-input-reversed:hover .dex-input-box .dex-input-input:-moz-placeholder {
  -webkit-text-fill-color: var(--dex-okd-input-reversed-hover-placeholder-color);
  color: var(--dex-okd-input-reversed-hover-placeholder-color);
  opacity: 1
}

.dex-input.dex-input-reversed.hover .dex-input-box .dex-input-input::-ms-input-placeholder,
.dex-input.dex-input-reversed:hover .dex-input-box .dex-input-input::-ms-input-placeholder {
  -webkit-text-fill-color: var(--dex-okd-input-reversed-hover-placeholder-color);
  color: var(--dex-okd-input-reversed-hover-placeholder-color)
}

.dex-input.dex-input-reversed.focus .dex-input-box {
  background: var(--dex-okd-input-reversed-focus-background);
  border: thin solid var(--dex-okd-input-reversed-focus-border-color);
  box-shadow: var(--dex-okd-input-reversed-focus-shadow)
}

.dex-input.dex-input-reversed.focus .dex-input-box .dex-input-input {
  -webkit-text-fill-color: var(--dex-okd-input-reversed-focus-text-color);
  caret-color: var(--dex-okd-input-reversed-focus-caret-color);
  color: var(--dex-okd-input-reversed-focus-text-color)
}

.dex-input.dex-input-reversed.focus .dex-input-box .dex-input-input::-webkit-input-placeholder {
  -webkit-text-fill-color: var(--dex-okd-input-reversed-focus-placeholder-color);
  color: var(--dex-okd-input-reversed-focus-placeholder-color)
}

.dex-input.dex-input-reversed.focus .dex-input-box .dex-input-input:-moz-placeholder {
  -webkit-text-fill-color: var(--dex-okd-input-reversed-focus-placeholder-color);
  color: var(--dex-okd-input-reversed-focus-placeholder-color);
  opacity: 1
}

.dex-input.dex-input-reversed.focus .dex-input-box .dex-input-input::-ms-input-placeholder {
  -webkit-text-fill-color: var(--dex-okd-input-reversed-focus-placeholder-color);
  color: var(--dex-okd-input-reversed-focus-placeholder-color)
}

.dex-input.dex-input-reversed.disabled .dex-input-box {
  background: var(--dex-okd-input-reversed-disabled-background);
  border: thin solid var(--dex-okd-input-reversed-disabled-border-color);
  box-shadow: var(--dex-okd-input-reversed-disabled-shadow)
}

.dex-input.dex-input-reversed.disabled .dex-input-box .dex-input-input {
  -webkit-text-fill-color: var(--dex-okd-input-reversed-disabled-text-color);
  caret-color: var(--dex-okd-input-reversed-disabled-caret-color);
  color: var(--dex-okd-input-reversed-disabled-text-color)
}

.dex-input.dex-input-reversed.disabled .dex-input-box .dex-input-input::-webkit-input-placeholder {
  -webkit-text-fill-color: var(--dex-okd-input-reversed-disabled-placeholder-color);
  color: var(--dex-okd-input-reversed-disabled-placeholder-color)
}

.dex-input.dex-input-reversed.disabled .dex-input-box .dex-input-input:-moz-placeholder {
  -webkit-text-fill-color: var(--dex-okd-input-reversed-disabled-placeholder-color);
  color: var(--dex-okd-input-reversed-disabled-placeholder-color);
  opacity: 1
}

.dex-input.dex-input-reversed.disabled .dex-input-box .dex-input-input::-ms-input-placeholder {
  -webkit-text-fill-color: var(--dex-okd-input-reversed-disabled-placeholder-color);
  color: var(--dex-okd-input-reversed-disabled-placeholder-color)
}

.dex-input.dex-input-reversed.disabled .dex-input-input:-webkit-autofill {
  -webkit-text-fill-color: var(--dex-okd-input-reversed-disabled-text-color) !important;
  -webkit-box-shadow: 0 0 0 30px var(--dex-okd-input-reversed-disabled-background) inset
}

.dex-input.dex-input-reversed.error .dex-input-box {
  background: var(--dex-okd-input-reversed-error-background);
  border: thin solid var(--dex-okd-input-reversed-error-border-color);
  box-shadow: var(--dex-okd-input-reversed-error-shadow)
}

.dex-input.dex-input-reversed.error .dex-input-box .dex-input-input {
  -webkit-text-fill-color: var(--dex-okd-input-reversed-error-text-color);
  caret-color: var(--dex-okd-input-reversed-error-caret-color);
  color: var(--dex-okd-input-reversed-error-text-color)
}

.dex-input.dex-input-reversed.error .dex-input-box .dex-input-input::-webkit-input-placeholder {
  -webkit-text-fill-color: var(--dex-okd-input-reversed-error-placeholder-color);
  color: var(--dex-okd-input-reversed-error-placeholder-color)
}

.dex-input.dex-input-reversed.error .dex-input-box .dex-input-input:-moz-placeholder {
  -webkit-text-fill-color: var(--dex-okd-input-reversed-error-placeholder-color);
  color: var(--dex-okd-input-reversed-error-placeholder-color);
  opacity: 1
}

.dex-input.dex-input-reversed.error .dex-input-box .dex-input-input::-ms-input-placeholder {
  -webkit-text-fill-color: var(--dex-okd-input-reversed-error-placeholder-color);
  color: var(--dex-okd-input-reversed-error-placeholder-color)
}

.dex-label-reversed .dex-label-text {
  color: var(--dex-okd-input-reversed-label-color)
}

.dex-label-reversed .dex-label-action {
  color: var(--dex-okd-input-reversed-action-color)
}

.dex-input-reversed .dex-input-prefix .prefix-icon,
.dex-input-reversed .dex-input-suffix .suffix-icon,
.dex-input-reversed .dex-input-suffix .suffix-icon:hover {
  color: var(--dex-okd-input-reversed-icon-color)
}

.dex-input-reversed .dex-input-suffix .error-icon {
  color: var(--dex-okd-input-reversed-error-tips-color)
}

.dex-input-reversed .dex-input-number-suffix {
  border-left: 1px solid var(--dex-okd-input-reversed-default-border-color)
}

.dex-input-reversed .dex-input-number-suffix-part {
  background: var(--dex-okd-input-number-reversed-default-add-icon-background)
}

.dex-input-reversed .dex-input-number-suffix-part .icon {
  color: var(--dex-okd-input-number-reversed-default-add-icon-color)
}

.dex-input-reversed .dex-input-number-suffix-part .hover,
.dex-input-reversed .dex-input-number-suffix-part:hover {
  background: var(--dex-okd-input-number-reversed-hover-add-icon-background)
}

.dex-input-reversed .dex-input-number-suffix-part .hover .icon,
.dex-input-reversed .dex-input-number-suffix-part:hover .icon {
  color: var(--dex-okd-input-number-reversed-hover-add-icon-color)
}

.dex-input-reversed .dex-input-number-suffix-part .active,
.dex-input-reversed .dex-input-number-suffix-part:active {
  background: var(--dex-okd-input-number-reversed-active-add-icon-background)
}

.dex-input-reversed .dex-input-number-suffix-part .active .icon,
.dex-input-reversed .dex-input-number-suffix-part:active .icon {
  color: var(--dex-okd-input-number-reversed-active-add-icon-color)
}

.dex-input-reversed .dex-input-number-suffix-part .disabled,
.dex-input-reversed .dex-input-number-suffix-part-disabled {
  background: var(--dex-okd-input-number-reversed-disabled-add-icon-background)
}

.dex-input-reversed .dex-input-number-suffix-part .disabled .icon,
.dex-input-reversed .dex-input-number-suffix-part .disabled:hover .icon,
.dex-input-reversed .dex-input-number-suffix-part-disabled .icon,
.dex-input-reversed .dex-input-number-suffix-part-disabled:hover .icon {
  color: var(--dex-okd-input-number-reversed-disabled-add-icon-color)
}

.dex-input-reversed .dex-input-number-suffix-line {
  background: var(--dex-okd-input-reversed-default-border-color)
}

.dex-input-reversed.dex-input .dex-input-code-btn {
  color: var(--dex-okd-input-code-reversed-common-btn-color)
}

.dex-input-reversed.dex-input .dex-input-code-btn.disabled {
  color: var(--dex-okd-input-code-reversed-common-btn-disabled-color)
}

.dex-input-reversed.dex-input .dex-input-count-down {
  color: var(--dex-okd-input-code-reversed-common-count-color)
}

.dex-input-reversed.dex-input-search .dex-input-prefix .dex-input-search-prefix-icon {
  color: var(--dex-okd-input-search-reversed-prefix-icon-color)
}

.dex-input-reversed.dex-input-search .dex-input-error {
  color: var(--dex-okd-input-search-reversed-error-tips-color)
}

.dex-input-reversed.dex-input-search .dex-input-box {
  background-color: var(--dex-okd-input-search-reversed-default-background);
  border-color: var(--dex-okd-input-search-reversed-default-border-color);
  box-shadow: var(--dex-okd-input-search-reversed-default-shadow)
}

.dex-input-reversed.dex-input-search .dex-input-input {
  color: var(--dex-okd-input-search-reversed-default-text-color)
}

.dex-input-reversed.dex-input-search .dex-input-input::-webkit-input-placeholder {
  -webkit-text-fill-color: var(--dex-okd-input-search-reversed-default-placeholder-color);
  color: var(--dex-okd-input-search-reversed-default-placeholder-color)
}

.dex-input-reversed.dex-input-search .dex-input-input:-moz-placeholder {
  -webkit-text-fill-color: var(--dex-okd-input-search-reversed-default-placeholder-color);
  color: var(--dex-okd-input-search-reversed-default-placeholder-color);
  opacity: 1
}

.dex-input-reversed.dex-input-search .dex-input-input::-ms-input-placeholder {
  -webkit-text-fill-color: var(--dex-okd-input-search-reversed-default-placeholder-color);
  color: var(--dex-okd-input-search-reversed-default-placeholder-color)
}

.dex-input-reversed.dex-input-search.hover .dex-input-box,
.dex-input-reversed.dex-input-search:hover .dex-input-box {
  background: var(--dex-okd-input-search-reversed-hover-background);
  border: thin solid var(--dex-okd-input-search-reversed-hover-border-color);
  box-shadow: var(--dex-okd-input-search-reversed-hover-shadow)
}

.dex-input-reversed.dex-input-search.hover .dex-input-box .dex-input-input,
.dex-input-reversed.dex-input-search:hover .dex-input-box .dex-input-input {
  -webkit-text-fill-color: var(--dex-okd-input-search-reversed-hover-text-color);
  caret-color: var(--dex-okd-input-search-reversed-hover-caret-color);
  color: var(--dex-okd-input-search-reversed-hover-text-color)
}

.dex-input-reversed.dex-input-search.hover .dex-input-box .dex-input-input::-webkit-input-placeholder,
.dex-input-reversed.dex-input-search:hover .dex-input-box .dex-input-input::-webkit-input-placeholder {
  -webkit-text-fill-color: var(--dex-okd-input-search-reversed-hover-placeholder-color);
  color: var(--dex-okd-input-search-reversed-hover-placeholder-color)
}

.dex-input-reversed.dex-input-search.hover .dex-input-box .dex-input-input:-moz-placeholder,
.dex-input-reversed.dex-input-search:hover .dex-input-box .dex-input-input:-moz-placeholder {
  -webkit-text-fill-color: var(--dex-okd-input-search-reversed-hover-placeholder-color);
  color: var(--dex-okd-input-search-reversed-hover-placeholder-color);
  opacity: 1
}

.dex-input-reversed.dex-input-search.hover .dex-input-box .dex-input-input::-ms-input-placeholder,
.dex-input-reversed.dex-input-search:hover .dex-input-box .dex-input-input::-ms-input-placeholder {
  -webkit-text-fill-color: var(--dex-okd-input-search-reversed-hover-placeholder-color);
  color: var(--dex-okd-input-search-reversed-hover-placeholder-color)
}

.dex-input-reversed.dex-input-search.focus .dex-input-box {
  background: var(--dex-okd-input-search-reversed-focus-background);
  border: thin solid var(--dex-okd-input-search-reversed-focus-border-color);
  box-shadow: var(--dex-okd-input-search-reversed-focus-shadow)
}

.dex-input-reversed.dex-input-search.focus .dex-input-box .dex-input-input {
  -webkit-text-fill-color: var(--dex-okd-input-search-reversed-focus-text-color);
  caret-color: var(--dex-okd-input-search-reversed-focus-caret-color);
  color: var(--dex-okd-input-search-reversed-focus-text-color)
}

.dex-input-reversed.dex-input-search.focus .dex-input-box .dex-input-input::-webkit-input-placeholder {
  -webkit-text-fill-color: var(--dex-okd-input-search-reversed-focus-placeholder-color);
  color: var(--dex-okd-input-search-reversed-focus-placeholder-color)
}

.dex-input-reversed.dex-input-search.focus .dex-input-box .dex-input-input:-moz-placeholder {
  -webkit-text-fill-color: var(--dex-okd-input-search-reversed-focus-placeholder-color);
  color: var(--dex-okd-input-search-reversed-focus-placeholder-color);
  opacity: 1
}

.dex-input-reversed.dex-input-search.focus .dex-input-box .dex-input-input::-ms-input-placeholder {
  -webkit-text-fill-color: var(--dex-okd-input-search-reversed-focus-placeholder-color);
  color: var(--dex-okd-input-search-reversed-focus-placeholder-color)
}

.dex-input-reversed.dex-input-search.disabled .dex-input-box {
  background: var(--dex-okd-input-search-reversed-disabled-background);
  border: thin solid var(--dex-okd-input-search-reversed-disabled-border-color);
  box-shadow: var(--dex-okd-input-search-reversed-disabled-shadow)
}

.dex-input-reversed.dex-input-search.disabled .dex-input-box .dex-input-input {
  -webkit-text-fill-color: var(--dex-okd-input-search-reversed-disabled-text-color);
  caret-color: var(--dex-okd-input-search-reversed-disabled-caret-color);
  color: var(--dex-okd-input-search-reversed-disabled-text-color)
}

.dex-input-reversed.dex-input-search.disabled .dex-input-box .dex-input-input::-webkit-input-placeholder {
  -webkit-text-fill-color: var(--dex-okd-input-search-reversed-disabled-placeholder-color);
  color: var(--dex-okd-input-search-reversed-disabled-placeholder-color)
}

.dex-input-reversed.dex-input-search.disabled .dex-input-box .dex-input-input:-moz-placeholder {
  -webkit-text-fill-color: var(--dex-okd-input-search-reversed-disabled-placeholder-color);
  color: var(--dex-okd-input-search-reversed-disabled-placeholder-color);
  opacity: 1
}

.dex-input-reversed.dex-input-search.disabled .dex-input-box .dex-input-input::-ms-input-placeholder {
  -webkit-text-fill-color: var(--dex-okd-input-search-reversed-disabled-placeholder-color);
  color: var(--dex-okd-input-search-reversed-disabled-placeholder-color)
}

.dex-input-reversed.dex-input-search.error .dex-input-box {
  background: var(--dex-okd-input-search-reversed-error-background);
  border: thin solid var(--dex-okd-input-search-reversed-error-border-color);
  box-shadow: var(--dex-okd-input-search-reversed-error-shadow)
}

.dex-input-reversed.dex-input-search.error .dex-input-box .dex-input-input {
  -webkit-text-fill-color: var(--dex-okd-input-search-reversed-error-text-color);
  caret-color: var(--dex-okd-input-search-reversed-error-caret-color);
  color: var(--dex-okd-input-search-reversed-error-text-color)
}

.dex-input-reversed.dex-input-search.error .dex-input-box .dex-input-input::-webkit-input-placeholder {
  -webkit-text-fill-color: var(--dex-okd-input-search-reversed-error-placeholder-color);
  color: var(--dex-okd-input-search-reversed-error-placeholder-color)
}

.dex-input-reversed.dex-input-search.error .dex-input-box .dex-input-input:-moz-placeholder {
  -webkit-text-fill-color: var(--dex-okd-input-search-reversed-error-placeholder-color);
  color: var(--dex-okd-input-search-reversed-error-placeholder-color);
  opacity: 1
}

.dex-input-reversed.dex-input-search.error .dex-input-box .dex-input-input::-ms-input-placeholder {
  -webkit-text-fill-color: var(--dex-okd-input-search-reversed-error-placeholder-color);
  color: var(--dex-okd-input-search-reversed-error-placeholder-color)
}

.dex-label {
  display: flex;
  width: 100%
}

.dex-label.top-right {
  justify-content: flex-end
}

.dex-label.top-between {
  justify-content: space-between
}

.dex-label-text {
  color: var(--dex-okd-input-label-color);
  font-weight: 500
}

.dex-label-action {
  color: var(--dex-okd-input-action-color);
  cursor: pointer;
  font-weight: 500
}

.dex-label.label-xl .dex-label-text {
  font-size: var(--dex-okd-input-xl-label-font-size);
  line-height: var(--dex-okd-input-xl-label-line-height);
  margin-bottom: 6px;
  margin-bottom: var(--dex-okd-input-xl-label-margin, 6px)
}

.dex-label.label-xl .dex-label-action {
  font-size: var(--dex-okd-input-xl-action-font-size);
  line-height: var(--dex-okd-input-xl-action-line-height);
  margin-bottom: 6px;
  margin-bottom: var(--dex-okd-input-xl-label-margin, 6px)
}

.dex-label.label-xl .dex-label-place {
  min-height: var(--dex-okd-input-xl-label-line-height)
}

.dex-label.label-lg .dex-label-text {
  font-size: var(--dex-okd-input-lg-label-font-size);
  line-height: var(--dex-okd-input-lg-label-line-height);
  margin-bottom: 6px;
  margin-bottom: var(--dex-okd-input-lg-label-margin, 6px)
}

.dex-label.label-lg .dex-label-action {
  font-size: var(--dex-okd-input-lg-action-font-size);
  line-height: var(--dex-okd-input-lg-action-line-height);
  margin-bottom: 6px;
  margin-bottom: var(--dex-okd-input-lg-label-margin, 6px)
}

.dex-label.label-lg .dex-label-place {
  min-height: var(--dex-okd-input-lg-label-line-height)
}

.dex-label.label-xs .dex-label-text {
  font-size: var(--dex-okd-input-xs-label-font-size);
  line-height: var(--dex-okd-input-xs-label-line-height);
  margin-bottom: 4px;
  margin-bottom: var(--dex-okd-input-xs-label-margin, 4px)
}

.dex-label.label-xs .dex-label-action {
  font-size: var(--dex-okd-input-xs-action-font-size);
  line-height: var(--dex-okd-input-xs-action-line-height);
  margin-bottom: 4px;
  margin-bottom: var(--dex-okd-input-xs-label-margin, 4px)
}

.dex-label.label-xs .dex-label-place {
  min-height: var(--dex-okd-input-xs-label-line-height)
}

.dex-label.label-sm .dex-label-text {
  font-size: var(--dex-okd-input-sm-label-font-size);
  line-height: var(--dex-okd-input-sm-label-line-height);
  margin-bottom: 4px;
  margin-bottom: var(--dex-okd-input-sm-label-margin, 4px)
}

.dex-label.label-sm .dex-label-action {
  font-size: var(--dex-okd-input-sm-action-font-size);
  line-height: var(--dex-okd-input-sm-action-line-height);
  margin-bottom: 4px;
  margin-bottom: var(--dex-okd-input-sm-label-margin, 4px)
}

.dex-label.label-sm .dex-label-place {
  min-height: var(--dex-okd-input-sm-label-line-height)
}

.dex-label.label-md .dex-label-text {
  font-size: var(--dex-okd-input-md-label-font-size);
  line-height: var(--dex-okd-input-md-label-line-height);
  margin-bottom: 4px;
  margin-bottom: var(--dex-okd-input-md-label-margin, 4px)
}

.dex-label.label-md .dex-label-action {
  font-size: var(--dex-okd-input-md-action-font-size);
  line-height: var(--dex-okd-input-md-action-line-height);
  margin-bottom: 4px;
  margin-bottom: var(--dex-okd-input-md-label-margin, 4px)
}

.dex-label.label-md .dex-label-place {
  min-height: var(--dex-okd-input-md-label-line-height)
}

.dex-input-caret-color {
  caret-color: var(--dex-okd-input-focus-caret-color)
}

.dex-input-caret-color input[type=search]::-webkit-search-cancel-button {
  -webkit-appearance: none;
  appearance: none
}

.dex-input-caret-color input[type=search]::-moz-search-cancel-button {
  -moz-appearance: none;
  appearance: none
}

.dex-input-caret-color input::-ms-clear,
.dex-input-caret-color input::-ms-reveal {
  display: none
}

.dex-input-caret-color input::-o-clear {
  display: none
}

.dex-input {
  align-items: flex-start;
  display: flex;
  flex-direction: column;
  position: relative
}

.dex-input input[type=search]::-webkit-search-cancel-button {
  -webkit-appearance: none;
  appearance: none
}

.dex-input input[type=search]::-moz-search-cancel-button {
  -moz-appearance: none;
  appearance: none
}

.dex-input input::-ms-clear,
.dex-input input::-ms-reveal {
  display: none
}

.dex-input input::-o-clear {
  display: none
}

.dex-input * {
  box-sizing: border-box
}

.dex-input-prefix,
.dex-input-suffix {
  align-items: center;
  display: flex;
  flex-shrink: 1;
  white-space: nowrap
}

.dex-input-input {
  background: transparent;
  border: none;
  color: var(--dex-okd-input-default-text-color);
  flex-grow: 1;
  font-family: inherit;
  height: 100%;
  outline: none;
  width: 100%
}

.dex-input-input::-webkit-input-placeholder {
  -webkit-text-fill-color: var(--dex-okd-input-default-placeholder-color);
  color: var(--dex-okd-input-default-placeholder-color)
}

.dex-input-input:-moz-placeholder {
  -webkit-text-fill-color: var(--dex-okd-input-default-placeholder-color);
  color: var(--dex-okd-input-default-placeholder-color);
  opacity: 1
}

.dex-input-input::-ms-input-placeholder {
  -webkit-text-fill-color: var(--dex-okd-input-default-placeholder-color);
  color: var(--dex-okd-input-default-placeholder-color)
}

.dex-input-input:-webkit-autofill {
  -webkit-text-fill-color: var(--dex-okd-input-default-text-color) !important;
  border: none;
  -webkit-box-shadow: 0 0 0 30px var(--dex-okd-input-default-background) inset
}

.dex-input-input.input-textarea {
  box-shadow: none;
  outline: none;
  resize: none
}

.dex-input-custom-placeholder {
  position: relative;
  width: 100%
}

.dex-input-ellipsis {
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap
}

.dex-input-placeholder {
  bottom: 0;
  color: var(--dex-okd-input-default-placeholder-color);
  left: 0;
  pointer-events: none;
  position: absolute;
  right: 0;
  top: 50%;
  transform: translateY(-50%)
}

.dex-input-tips-box {
  display: flex;
  width: 100%
}

.dex-input-error {
  color: var(--dex-okd-input-error-tips-color)
}

.dex-input-tips {
  display: inline-block
}

.dex-input-help-text,
.dex-input-tips {
  color: var(--dex-okd-input-tips-text-color)
}

.dex-input-help-text {
  flex-grow: 1;
  flex-shrink: 0;
  text-align: right
}

.dex-input.hover,
.dex-input:hover {
  cursor: text
}

.dex-input.hover .dex-input-box,
.dex-input:hover .dex-input-box {
  background: var(--dex-okd-input-hover-background);
  border: thin solid var(--dex-okd-input-hover-border-color);
  box-shadow: var(--dex-okd-input-hover-shadow)
}

.dex-input.hover .dex-input-box .dex-input-input,
.dex-input:hover .dex-input-box .dex-input-input {
  -webkit-text-fill-color: var(--dex-okd-input-hover-text-color);
  caret-color: var(--dex-okd-input-hover-caret-color);
  color: var(--dex-okd-input-hover-text-color)
}

.dex-input.hover .dex-input-box .dex-input-input::-webkit-input-placeholder,
.dex-input:hover .dex-input-box .dex-input-input::-webkit-input-placeholder {
  -webkit-text-fill-color: var(--dex-okd-input-hover-placeholder-color);
  color: var(--dex-okd-input-hover-placeholder-color)
}

.dex-input.hover .dex-input-box .dex-input-input:-moz-placeholder,
.dex-input:hover .dex-input-box .dex-input-input:-moz-placeholder {
  -webkit-text-fill-color: var(--dex-okd-input-hover-placeholder-color);
  color: var(--dex-okd-input-hover-placeholder-color);
  opacity: 1
}

.dex-input.hover .dex-input-box .dex-input-input::-ms-input-placeholder,
.dex-input:hover .dex-input-box .dex-input-input::-ms-input-placeholder {
  -webkit-text-fill-color: var(--dex-okd-input-hover-placeholder-color);
  color: var(--dex-okd-input-hover-placeholder-color)
}

.dex-input.focus .dex-input-box {
  background: var(--dex-okd-input-focus-background);
  border: thin solid var(--dex-okd-input-focus-border-color);
  box-shadow: var(--dex-okd-input-focus-shadow)
}

.dex-input.focus .dex-input-box .dex-input-input {
  -webkit-text-fill-color: var(--dex-okd-input-focus-text-color);
  caret-color: var(--dex-okd-input-focus-caret-color);
  color: var(--dex-okd-input-focus-text-color)
}

.dex-input.focus .dex-input-box .dex-input-input::-webkit-input-placeholder {
  -webkit-text-fill-color: var(--dex-okd-input-focus-placeholder-color);
  color: var(--dex-okd-input-focus-placeholder-color)
}

.dex-input.focus .dex-input-box .dex-input-input:-moz-placeholder {
  -webkit-text-fill-color: var(--dex-okd-input-focus-placeholder-color);
  color: var(--dex-okd-input-focus-placeholder-color);
  opacity: 1
}

.dex-input.focus .dex-input-box .dex-input-input::-ms-input-placeholder {
  -webkit-text-fill-color: var(--dex-okd-input-focus-placeholder-color);
  color: var(--dex-okd-input-focus-placeholder-color)
}

.dex-input.readonly .dex-input-box {
  background: var(--dex-okd-input-default-background);
  background: var(--dex-okd-input-readonly-background, var(--dex-okd-input-default-background));
  border: thin solid var(--dex-okd-input-readonly-border-color, var(--dex-okd-input-default-border-color));
  box-shadow: var(--dex-okd-input-default-shadow);
  box-shadow: var(--dex-okd-input-readonly-shadow, var(--dex-okd-input-default-shadow))
}

.dex-input.readonly .dex-input-box .dex-input-input {
  -webkit-text-fill-color: var(--dex-okd-input-default-text-color);
  -webkit-text-fill-color: var(--dex-okd-input-readonly-text-color, var(--dex-okd-input-default-text-color));
  caret-color: var(--dex-okd-input-default-caret-color);
  caret-color: var(--dex-okd-input-readonly-caret-color, var(--dex-okd-input-default-caret-color));
  color: var(--dex-okd-input-default-text-color);
  color: var(--dex-okd-input-readonly-text-color, var(--dex-okd-input-default-text-color))
}

.dex-input.readonly .dex-input-box .dex-input-input::-webkit-input-placeholder {
  -webkit-text-fill-color: var(--dex-okd-input-default-placeholder-color);
  -webkit-text-fill-color: var(--dex-okd-input-readonly-placeholder-color, var(--dex-okd-input-default-placeholder-color));
  color: var(--dex-okd-input-default-placeholder-color);
  color: var(--dex-okd-input-readonly-placeholder-color, var(--dex-okd-input-default-placeholder-color))
}

.dex-input.readonly .dex-input-box .dex-input-input:-moz-placeholder {
  -webkit-text-fill-color: var(--dex-okd-input-default-placeholder-color);
  -webkit-text-fill-color: var(--dex-okd-input-readonly-placeholder-color, var(--dex-okd-input-default-placeholder-color));
  color: var(--dex-okd-input-default-placeholder-color);
  color: var(--dex-okd-input-readonly-placeholder-color, var(--dex-okd-input-default-placeholder-color));
  opacity: 1
}

.dex-input.readonly .dex-input-box .dex-input-input::-ms-input-placeholder {
  -webkit-text-fill-color: var(--dex-okd-input-default-placeholder-color);
  -webkit-text-fill-color: var(--dex-okd-input-readonly-placeholder-color, var(--dex-okd-input-default-placeholder-color));
  color: var(--dex-okd-input-default-placeholder-color);
  color: var(--dex-okd-input-readonly-placeholder-color, var(--dex-okd-input-default-placeholder-color))
}

.dex-input.readonly.focus .dex-input-box {
  border-color: var(--dex-okd-input-focus-border-color)
}

.dex-input.disabled {
  cursor: not-allowed
}

.dex-input.disabled .dex-input-box {
  background: var(--dex-okd-input-disabled-background);
  border: thin solid var(--dex-okd-input-disabled-border-color);
  box-shadow: var(--dex-okd-input-disabled-shadow)
}

.dex-input.disabled .dex-input-box .dex-input-input {
  -webkit-text-fill-color: var(--dex-okd-input-disabled-text-color);
  caret-color: var(--dex-okd-input-disabled-caret-color);
  color: var(--dex-okd-input-disabled-text-color)
}

.dex-input.disabled .dex-input-box .dex-input-input::-webkit-input-placeholder {
  -webkit-text-fill-color: var(--dex-okd-input-disabled-placeholder-color);
  color: var(--dex-okd-input-disabled-placeholder-color)
}

.dex-input.disabled .dex-input-box .dex-input-input:-moz-placeholder {
  -webkit-text-fill-color: var(--dex-okd-input-disabled-placeholder-color);
  color: var(--dex-okd-input-disabled-placeholder-color);
  opacity: 1
}

.dex-input.disabled .dex-input-box .dex-input-input::-ms-input-placeholder {
  -webkit-text-fill-color: var(--dex-okd-input-disabled-placeholder-color);
  color: var(--dex-okd-input-disabled-placeholder-color)
}

.dex-input.disabled .dex-input-input {
  cursor: not-allowed;
  opacity: 1
}

.dex-input.disabled .dex-input-input:-webkit-autofill {
  -webkit-text-fill-color: var(--dex-okd-input-disabled-text-color) !important;
  -webkit-box-shadow: 0 0 0 30px var(--dex-okd-input-disabled-background) inset
}

.dex-input.error .dex-input-box {
  background: var(--dex-okd-input-error-background);
  border: thin solid var(--dex-okd-input-error-border-color);
  box-shadow: var(--dex-okd-input-error-shadow)
}

.dex-input.error .dex-input-box .dex-input-input {
  -webkit-text-fill-color: var(--dex-okd-input-error-text-color);
  caret-color: var(--dex-okd-input-error-caret-color);
  color: var(--dex-okd-input-error-text-color)
}

.dex-input.error .dex-input-box .dex-input-input::-webkit-input-placeholder {
  -webkit-text-fill-color: var(--dex-okd-input-error-placeholder-color);
  color: var(--dex-okd-input-error-placeholder-color)
}

.dex-input.error .dex-input-box .dex-input-input:-moz-placeholder {
  -webkit-text-fill-color: var(--dex-okd-input-error-placeholder-color);
  color: var(--dex-okd-input-error-placeholder-color);
  opacity: 1
}

.dex-input.error .dex-input-box .dex-input-input::-ms-input-placeholder {
  -webkit-text-fill-color: var(--dex-okd-input-error-placeholder-color);
  color: var(--dex-okd-input-error-placeholder-color)
}

.dex-input.error .dex-input-error {
  display: inline-block
}

.dex-input.no-border .dex-input-box {
  background: transparent;
  border: thin solid transparent;
  box-shadow: none
}

.dex-input-textarea-resize-virtual-dom::-webkit-scrollbar {
  display: none;
  height: 0;
  width: 0
}

.dex-input-box {
  align-items: center;
  background: var(--dex-okd-input-default-background);
  border: thin solid var(--dex-okd-input-default-border-color);
  box-shadow: var(--dex-okd-input-default-shadow);
  display: flex;
  transition: border-color .3s, box-shadow .3s;
  width: 100%
}

.dex-input-xl>.dex-input-box {
  border-radius: var(--dex-okd-input-xl-border-radius);
  height: var(--dex-okd-input-xl-height);
  padding: 0 8px;
  padding: 0 var(--dex-okd-input-xl-padding-horizontal, 8px)
}

.dex-input-xl>.dex-input-box.auto-size {
  height: -webkit-fit-content;
  height: -moz-fit-content;
  height: fit-content;
  min-height: var(--dex-okd-input-xl-height)
}

.dex-input-xl>.dex-input-box.no-padding-left {
  padding-left: 0
}

.dex-input-xl>.dex-input-box.no-padding-right {
  padding-right: 0
}

.dex-input-xl>.dex-input-box.ta {
  height: 100%;
  padding: 8px
}

.dex-input-xl>.dex-input-box.auto-resize-auto-height {
  height: -webkit-fit-content;
  height: -moz-fit-content;
  height: fit-content;
  min-height: var(--dex-okd-input-xl-height)
}

.dex-input-xl>.dex-input-box.input-circle {
  border-radius: 100px
}

.dex-input-xl .dex-input-input {
  font-size: var(--dex-okd-input-xl-text-font-size);
  padding: calc(var(--dex-okd-input-xl-height)/2 - var(--dex-okd-input-xl-text-font-size)/2 - 2px) 0
}

.dex-input-xl .dex-input-input::-webkit-input-placeholder {
  font-size: var(--dex-okd-input-xl-text-font-size);
  font-weight: 400;
  text-overflow: ellipsis
}

.dex-input-xl .dex-input-input:-moz-placeholder {
  font-size: var(--dex-okd-input-xl-text-font-size);
  font-weight: 400;
  text-overflow: ellipsis
}

.dex-input-xl .dex-input-input::-ms-input-placeholder {
  font-size: var(--dex-okd-input-xl-text-font-size);
  font-weight: 400;
  text-overflow: ellipsis
}

.dex-input-xl .dex-input-input.ta {
  padding: 0
}

.dex-input-xl .dex-input-input.textarea-auto-resize {
  line-height: var(--dex-okd-input-xl-text-font-size)
}

.dex-input-xl .dex-input-placeholder {
  font-size: var(--dex-okd-input-xl-text-font-size);
  height: calc(var(--dex-okd-input-xl-text-font-size) + 2px);
  line-height: calc(var(--dex-okd-input-xl-text-font-size) + 2px)
}

.dex-input-xl .dex-input.dex-input-place-mode .dex-input-tips-box {
  min-height: calc(var(--dex-okd-input-xl-tip-line-height) + 6px);
  min-height: calc(var(--dex-okd-input-xl-tip-line-height) + var(--dex-okd-input-xl-tip-margin, 6px))
}

.dex-input-xl .dex-input-error {
  font-size: var(--dex-okd-input-xl-error-font-size);
  line-height: var(--dex-okd-input-xl-error-line-height);
  margin-top: 6px;
  margin-top: var(--dex-okd-input-xl-tip-margin, 6px)
}

.dex-input-xl .dex-input-help-text,
.dex-input-xl .dex-input-tips {
  font-size: var(--dex-okd-input-xl-tip-font-size);
  line-height: var(--dex-okd-input-xl-tip-line-height);
  margin-top: 6px;
  margin-top: var(--dex-okd-input-xl-tip-margin, 6px)
}

.dex-input-lg>.dex-input-box {
  border-radius: var(--dex-okd-input-lg-border-radius);
  height: var(--dex-okd-input-lg-height);
  padding: 0 8px;
  padding: 0 var(--dex-okd-input-lg-padding-horizontal, 8px)
}

.dex-input-lg>.dex-input-box.auto-size {
  height: -webkit-fit-content;
  height: -moz-fit-content;
  height: fit-content;
  min-height: var(--dex-okd-input-lg-height)
}

.dex-input-lg>.dex-input-box.no-padding-left {
  padding-left: 0
}

.dex-input-lg>.dex-input-box.no-padding-right {
  padding-right: 0
}

.dex-input-lg>.dex-input-box.ta {
  height: 100%;
  padding: 8px
}

.dex-input-lg>.dex-input-box.auto-resize-auto-height {
  height: -webkit-fit-content;
  height: -moz-fit-content;
  height: fit-content;
  min-height: var(--dex-okd-input-lg-height)
}

.dex-input-lg>.dex-input-box.input-circle {
  border-radius: 100px
}

.dex-input-lg .dex-input-input {
  font-size: var(--dex-okd-input-lg-text-font-size);
  padding: calc(var(--dex-okd-input-lg-height)/2 - var(--dex-okd-input-lg-text-font-size)/2 - 2px) 0
}

.dex-input-lg .dex-input-input::-webkit-input-placeholder {
  font-size: var(--dex-okd-input-lg-text-font-size);
  font-weight: 400;
  text-overflow: ellipsis
}

.dex-input-lg .dex-input-input:-moz-placeholder {
  font-size: var(--dex-okd-input-lg-text-font-size);
  font-weight: 400;
  text-overflow: ellipsis
}

.dex-input-lg .dex-input-input::-ms-input-placeholder {
  font-size: var(--dex-okd-input-lg-text-font-size);
  font-weight: 400;
  text-overflow: ellipsis
}

.dex-input-lg .dex-input-input.ta {
  padding: 0
}

.dex-input-lg .dex-input-input.textarea-auto-resize {
  line-height: var(--dex-okd-input-lg-text-font-size)
}

.dex-input-lg .dex-input-placeholder {
  font-size: var(--dex-okd-input-lg-text-font-size);
  height: calc(var(--dex-okd-input-lg-text-font-size) + 2px);
  line-height: calc(var(--dex-okd-input-lg-text-font-size) + 2px)
}

.dex-input-lg .dex-input.dex-input-place-mode .dex-input-tips-box {
  min-height: calc(var(--dex-okd-input-lg-tip-line-height) + 6px);
  min-height: calc(var(--dex-okd-input-lg-tip-line-height) + var(--dex-okd-input-lg-tip-margin, 6px))
}

.dex-input-lg .dex-input-error {
  font-size: var(--dex-okd-input-lg-error-font-size);
  line-height: var(--dex-okd-input-lg-error-line-height);
  margin-top: 6px;
  margin-top: var(--dex-okd-input-lg-tip-margin, 6px)
}

.dex-input-lg .dex-input-help-text,
.dex-input-lg .dex-input-tips {
  font-size: var(--dex-okd-input-lg-tip-font-size);
  line-height: var(--dex-okd-input-lg-tip-line-height);
  margin-top: 6px;
  margin-top: var(--dex-okd-input-lg-tip-margin, 6px)
}

.dex-input-xs>.dex-input-box {
  border-radius: var(--dex-okd-input-xs-border-radius);
  height: var(--dex-okd-input-xs-height);
  padding: 0 8px;
  padding: 0 var(--dex-okd-input-xs-padding-horizontal, 8px)
}

.dex-input-xs>.dex-input-box.auto-size {
  height: -webkit-fit-content;
  height: -moz-fit-content;
  height: fit-content;
  min-height: var(--dex-okd-input-xs-height)
}

.dex-input-xs>.dex-input-box.no-padding-left {
  padding-left: 0
}

.dex-input-xs>.dex-input-box.no-padding-right {
  padding-right: 0
}

.dex-input-xs>.dex-input-box.ta {
  height: 100%;
  padding: 8px
}

.dex-input-xs>.dex-input-box.auto-resize-auto-height {
  height: -webkit-fit-content;
  height: -moz-fit-content;
  height: fit-content;
  min-height: var(--dex-okd-input-xs-height)
}

.dex-input-xs>.dex-input-box.input-circle {
  border-radius: 100px
}

.dex-input-xs .dex-input-input {
  font-size: var(--dex-okd-input-xs-text-font-size);
  padding: calc(var(--dex-okd-input-xs-height)/2 - var(--dex-okd-input-xs-text-font-size)/2 - 2px) 0
}

.dex-input-xs .dex-input-input::-webkit-input-placeholder {
  font-size: var(--dex-okd-input-xs-text-font-size);
  font-weight: 400;
  text-overflow: ellipsis
}

.dex-input-xs .dex-input-input:-moz-placeholder {
  font-size: var(--dex-okd-input-xs-text-font-size);
  font-weight: 400;
  text-overflow: ellipsis
}

.dex-input-xs .dex-input-input::-ms-input-placeholder {
  font-size: var(--dex-okd-input-xs-text-font-size);
  font-weight: 400;
  text-overflow: ellipsis
}

.dex-input-xs .dex-input-input.ta {
  padding: 0
}

.dex-input-xs .dex-input-input.textarea-auto-resize {
  line-height: var(--dex-okd-input-xs-text-font-size)
}

.dex-input-xs .dex-input-placeholder {
  font-size: var(--dex-okd-input-xs-text-font-size);
  height: calc(var(--dex-okd-input-xs-text-font-size) + 2px);
  line-height: calc(var(--dex-okd-input-xs-text-font-size) + 2px)
}

.dex-input-xs .dex-input.dex-input-place-mode .dex-input-tips-box {
  min-height: calc(var(--dex-okd-input-xs-tip-line-height) + 4px);
  min-height: calc(var(--dex-okd-input-xs-tip-line-height) + var(--dex-okd-input-xs-tip-margin, 4px))
}

.dex-input-xs .dex-input-error {
  font-size: var(--dex-okd-input-xs-error-font-size);
  line-height: var(--dex-okd-input-xs-error-line-height);
  margin-top: 4px;
  margin-top: var(--dex-okd-input-xs-tip-margin, 4px)
}

.dex-input-xs .dex-input-help-text,
.dex-input-xs .dex-input-tips {
  font-size: var(--dex-okd-input-xs-tip-font-size);
  line-height: var(--dex-okd-input-xs-tip-line-height);
  margin-top: 4px;
  margin-top: var(--dex-okd-input-xs-tip-margin, 4px)
}

.dex-input-sm>.dex-input-box {
  border-radius: var(--dex-okd-input-sm-border-radius);
  height: var(--dex-okd-input-sm-height);
  padding: 0 8px;
  padding: 0 var(--dex-okd-input-sm-padding-horizontal, 8px)
}

.dex-input-sm>.dex-input-box.auto-size {
  height: -webkit-fit-content;
  height: -moz-fit-content;
  height: fit-content;
  min-height: var(--dex-okd-input-sm-height)
}

.dex-input-sm>.dex-input-box.no-padding-left {
  padding-left: 0
}

.dex-input-sm>.dex-input-box.no-padding-right {
  padding-right: 0
}

.dex-input-sm>.dex-input-box.ta {
  height: 100%;
  padding: 8px
}

.dex-input-sm>.dex-input-box.auto-resize-auto-height {
  height: -webkit-fit-content;
  height: -moz-fit-content;
  height: fit-content;
  min-height: var(--dex-okd-input-sm-height)
}

.dex-input-sm>.dex-input-box.input-circle {
  border-radius: 100px
}

.dex-input-sm .dex-input-input {
  font-size: var(--dex-okd-input-sm-text-font-size);
  padding: calc(var(--dex-okd-input-sm-height)/2 - var(--dex-okd-input-sm-text-font-size)/2 - 2px) 0
}

.dex-input-sm .dex-input-input::-webkit-input-placeholder {
  font-size: var(--dex-okd-input-sm-text-font-size);
  font-weight: 400;
  text-overflow: ellipsis
}

.dex-input-sm .dex-input-input:-moz-placeholder {
  font-size: var(--dex-okd-input-sm-text-font-size);
  font-weight: 400;
  text-overflow: ellipsis
}

.dex-input-sm .dex-input-input::-ms-input-placeholder {
  font-size: var(--dex-okd-input-sm-text-font-size);
  font-weight: 400;
  text-overflow: ellipsis
}

.dex-input-sm .dex-input-input.ta {
  padding: 0
}

.dex-input-sm .dex-input-input.textarea-auto-resize {
  line-height: var(--dex-okd-input-sm-text-font-size)
}

.dex-input-sm .dex-input-placeholder {
  font-size: var(--dex-okd-input-sm-text-font-size);
  height: calc(var(--dex-okd-input-sm-text-font-size) + 2px);
  line-height: calc(var(--dex-okd-input-sm-text-font-size) + 2px)
}

.dex-input-sm .dex-input.dex-input-place-mode .dex-input-tips-box {
  min-height: calc(var(--dex-okd-input-sm-tip-line-height) + 4px);
  min-height: calc(var(--dex-okd-input-sm-tip-line-height) + var(--dex-okd-input-sm-tip-margin, 4px))
}

.dex-input-sm .dex-input-error {
  font-size: var(--dex-okd-input-sm-error-font-size);
  line-height: var(--dex-okd-input-sm-error-line-height);
  margin-top: 4px;
  margin-top: var(--dex-okd-input-sm-tip-margin, 4px)
}

.dex-input-sm .dex-input-help-text,
.dex-input-sm .dex-input-tips {
  font-size: var(--dex-okd-input-sm-tip-font-size);
  line-height: var(--dex-okd-input-sm-tip-line-height);
  margin-top: 4px;
  margin-top: var(--dex-okd-input-sm-tip-margin, 4px)
}

.dex-input-md>.dex-input-box {
  border-radius: var(--dex-okd-input-md-border-radius);
  height: var(--dex-okd-input-md-height);
  padding: 0 8px;
  padding: 0 var(--dex-okd-input-md-padding-horizontal, 8px)
}

.dex-input-md>.dex-input-box.auto-size {
  height: -webkit-fit-content;
  height: -moz-fit-content;
  height: fit-content;
  min-height: var(--dex-okd-input-md-height)
}

.dex-input-md>.dex-input-box.no-padding-left {
  padding-left: 0
}

.dex-input-md>.dex-input-box.no-padding-right {
  padding-right: 0
}

.dex-input-md>.dex-input-box.ta {
  height: 100%;
  padding: 8px
}

.dex-input-md>.dex-input-box.auto-resize-auto-height {
  height: -webkit-fit-content;
  height: -moz-fit-content;
  height: fit-content;
  min-height: var(--dex-okd-input-md-height)
}

.dex-input-md>.dex-input-box.input-circle {
  border-radius: 100px
}

.dex-input-md .dex-input-input {
  font-size: var(--dex-okd-input-md-text-font-size);
  padding: calc(var(--dex-okd-input-md-height)/2 - var(--dex-okd-input-md-text-font-size)/2 - 2px) 0
}

.dex-input-md .dex-input-input::-webkit-input-placeholder {
  font-size: var(--dex-okd-input-md-text-font-size);
  font-weight: 400;
  text-overflow: ellipsis
}

.dex-input-md .dex-input-input:-moz-placeholder {
  font-size: var(--dex-okd-input-md-text-font-size);
  font-weight: 400;
  text-overflow: ellipsis
}

.dex-input-md .dex-input-input::-ms-input-placeholder {
  font-size: var(--dex-okd-input-md-text-font-size);
  font-weight: 400;
  text-overflow: ellipsis
}

.dex-input-md .dex-input-input.ta {
  padding: 0
}

.dex-input-md .dex-input-input.textarea-auto-resize {
  line-height: var(--dex-okd-input-md-text-font-size)
}

.dex-input-md .dex-input-placeholder {
  font-size: var(--dex-okd-input-md-text-font-size);
  height: calc(var(--dex-okd-input-md-text-font-size) + 2px);
  line-height: calc(var(--dex-okd-input-md-text-font-size) + 2px)
}

.dex-input-md .dex-input.dex-input-place-mode .dex-input-tips-box {
  min-height: calc(var(--dex-okd-input-md-tip-line-height) + 4px);
  min-height: calc(var(--dex-okd-input-md-tip-line-height) + var(--dex-okd-input-md-tip-margin, 4px))
}

.dex-input-md .dex-input-error {
  font-size: var(--dex-okd-input-md-error-font-size);
  line-height: var(--dex-okd-input-md-error-line-height);
  margin-top: 4px;
  margin-top: var(--dex-okd-input-md-tip-margin, 4px)
}

.dex-input-md .dex-input-help-text,
.dex-input-md .dex-input-tips {
  font-size: var(--dex-okd-input-md-tip-font-size);
  line-height: var(--dex-okd-input-md-tip-line-height);
  margin-top: 4px;
  margin-top: var(--dex-okd-input-md-tip-margin, 4px)
}

.dex-input-prefix {
  height: 100%
}

.dex-input-prefix .prefix-icon {
  color: var(--dex-okd-input-icon-color)
}

.dex-input-prefix .select {
  padding-right: 8px
}

.dex-input-suffix {
  height: 100%
}

.dex-input-suffix .suffix-icon {
  color: var(--dex-okd-input-icon-color)
}

.dex-input-suffix .clean-icon {
  cursor: pointer
}

.dex-input-suffix .clean-icon:hover {
  color: #000;
  color: var(--dex-okd-input-search-suffix-icon-hover-color, #000)
}

.dex-input-suffix .error-icon {
  color: var(--dex-okd-input-error-tips-color)
}

.dex-input-xl .dex-input-prefix .prefix-icon {
  font-size: var(--dex-okd-input-xl-icon-size);
  margin-left: 0;
  margin-right: var(--dex-okd-input-xl-icon-margin)
}

.dex-input-xl .dex-input-suffix .suffix-icon {
  font-size: var(--dex-okd-input-xl-icon-size);
  margin-left: var(--dex-okd-input-xl-icon-margin);
  margin-right: 0
}

.dex-input-lg .dex-input-prefix .prefix-icon {
  font-size: var(--dex-okd-input-lg-icon-size);
  margin-left: 0;
  margin-right: var(--dex-okd-input-lg-icon-margin)
}

.dex-input-lg .dex-input-suffix .suffix-icon {
  font-size: var(--dex-okd-input-lg-icon-size);
  margin-left: var(--dex-okd-input-lg-icon-margin);
  margin-right: 0
}

.dex-input-xs .dex-input-prefix .prefix-icon {
  font-size: var(--dex-okd-input-xs-icon-size);
  margin-left: 0;
  margin-right: var(--dex-okd-input-xs-icon-margin)
}

.dex-input-xs .dex-input-suffix .suffix-icon {
  font-size: var(--dex-okd-input-xs-icon-size);
  margin-left: var(--dex-okd-input-xs-icon-margin);
  margin-right: 0
}

.dex-input-sm .dex-input-prefix .prefix-icon {
  font-size: var(--dex-okd-input-sm-icon-size);
  margin-left: 0;
  margin-right: var(--dex-okd-input-sm-icon-margin)
}

.dex-input-sm .dex-input-suffix .suffix-icon {
  font-size: var(--dex-okd-input-sm-icon-size);
  margin-left: var(--dex-okd-input-sm-icon-margin);
  margin-right: 0
}

.dex-input-md .dex-input-prefix .prefix-icon {
  font-size: var(--dex-okd-input-md-icon-size);
  margin-left: 0;
  margin-right: var(--dex-okd-input-md-icon-margin)
}

.dex-input-md .dex-input-suffix .suffix-icon {
  font-size: var(--dex-okd-input-md-icon-size);
  margin-left: var(--dex-okd-input-md-icon-margin);
  margin-right: 0
}

.dex-input:hover .dex-input-number-suffix:not(.operation-always) {
  opacity: 1
}

.dex-input-number-inner {
  overflow: hidden
}

.dex-input-number-suffix {
  align-items: center;
  border-left: 1px solid var(--dex-okd-input-number-suffix-border-color, var(--dex-okd-input-default-border-color));
  cursor: pointer;
  display: flex;
  flex-direction: column;
  height: 100%;
  justify-content: center;
  line-height: 0;
  margin-left: 6px;
  overflow: hidden;
  text-align: center;
  transition: opacity .5s;
  width: 24px
}

.dex-input-number-suffix:not(.operation-always) {
  opacity: 0
}

.dex-input-number-suffix-part {
  align-items: center;
  background: var(--dex-okd-input-number-default-add-icon-background);
  box-sizing: border-box;
  display: flex;
  flex: 1 1;
  justify-content: center;
  width: 100%
}

.dex-input-number-suffix-part .icon {
  color: var(--dex-okd-input-number-default-add-icon-color);
  font-size: 13px
}

.dex-input-number-suffix-part .hover,
.dex-input-number-suffix-part:not(.dex-input-number-suffix-part-disabled):hover {
  background: var(--dex-okd-input-number-hover-add-icon-background)
}

.dex-input-number-suffix-part .hover .icon,
.dex-input-number-suffix-part:not(.dex-input-number-suffix-part-disabled):hover .icon {
  color: var(--dex-okd-input-number-hover-add-icon-color)
}

.dex-input-number-suffix-part .active,
.dex-input-number-suffix-part:not(.dex-input-number-suffix-part-disabled):active {
  background: var(--dex-okd-input-number-active-add-icon-background)
}

.dex-input-number-suffix-part .active .icon,
.dex-input-number-suffix-part:not(.dex-input-number-suffix-part-disabled):active .icon {
  color: var(--dex-okd-input-number-active-add-icon-color)
}

.dex-input-number-suffix-part-disabled {
  cursor: not-allowed
}

.dex-input-number-suffix-line {
  background: var(--dex-okd-input-default-border-color);
  background: var(--dex-okd-input-number-suffix-border-color, var(--dex-okd-input-default-border-color));
  height: 1px;
  width: 100%
}

.dex-input-number-suffix .up {
  transform: rotate(180deg)
}

.dex-input-number-localization {
  text-align: right
}

.dex-input-number-localization-percent {
  color: var(--dex-okd-input-default-text-color);
  display: inline-block
}

.dex-input-xl .dex-input-number-suffix.xl {
  border-bottom-right-radius: calc(var(--dex-okd-input-xl-border-radius) - 1px);
  border-top-right-radius: calc(var(--dex-okd-input-xl-border-radius) - 1px)
}

.dex-input-lg .dex-input-number-suffix.lg {
  border-bottom-right-radius: calc(var(--dex-okd-input-lg-border-radius) - 1px);
  border-top-right-radius: calc(var(--dex-okd-input-lg-border-radius) - 1px)
}

.dex-input-xs .dex-input-number-suffix.xs {
  border-bottom-right-radius: calc(var(--dex-okd-input-xs-border-radius) - 1px);
  border-top-right-radius: calc(var(--dex-okd-input-xs-border-radius) - 1px)
}

.dex-input-sm .dex-input-number-suffix.sm {
  border-bottom-right-radius: calc(var(--dex-okd-input-sm-border-radius) - 1px);
  border-top-right-radius: calc(var(--dex-okd-input-sm-border-radius) - 1px)
}

.dex-input-md .dex-input-number-suffix.md {
  border-bottom-right-radius: calc(var(--dex-okd-input-md-border-radius) - 1px);
  border-top-right-radius: calc(var(--dex-okd-input-md-border-radius) - 1px)
}

.dex-label {
  display: flex;
  width: 100%
}

.dex-label.top-right {
  justify-content: flex-end
}

.dex-label.top-between {
  justify-content: space-between
}

.dex-label-text {
  color: var(--dex-okd-input-label-color);
  font-weight: 500
}

.dex-label-action {
  color: var(--dex-okd-input-action-color);
  cursor: pointer;
  font-weight: 500
}

.dex-label.label-xl .dex-label-text {
  font-size: var(--dex-okd-input-xl-label-font-size);
  line-height: var(--dex-okd-input-xl-label-line-height);
  margin-bottom: 6px;
  margin-bottom: var(--dex-okd-input-xl-label-margin, 6px)
}

.dex-label.label-xl .dex-label-action {
  font-size: var(--dex-okd-input-xl-action-font-size);
  line-height: var(--dex-okd-input-xl-action-line-height);
  margin-bottom: 6px;
  margin-bottom: var(--dex-okd-input-xl-label-margin, 6px)
}

.dex-label.label-xl .dex-label-place {
  min-height: var(--dex-okd-input-xl-label-line-height)
}

.dex-label.label-lg .dex-label-text {
  font-size: var(--dex-okd-input-lg-label-font-size);
  line-height: var(--dex-okd-input-lg-label-line-height);
  margin-bottom: 6px;
  margin-bottom: var(--dex-okd-input-lg-label-margin, 6px)
}

.dex-label.label-lg .dex-label-action {
  font-size: var(--dex-okd-input-lg-action-font-size);
  line-height: var(--dex-okd-input-lg-action-line-height);
  margin-bottom: 6px;
  margin-bottom: var(--dex-okd-input-lg-label-margin, 6px)
}

.dex-label.label-lg .dex-label-place {
  min-height: var(--dex-okd-input-lg-label-line-height)
}

.dex-label.label-xs .dex-label-text {
  font-size: var(--dex-okd-input-xs-label-font-size);
  line-height: var(--dex-okd-input-xs-label-line-height);
  margin-bottom: 4px;
  margin-bottom: var(--dex-okd-input-xs-label-margin, 4px)
}

.dex-label.label-xs .dex-label-action {
  font-size: var(--dex-okd-input-xs-action-font-size);
  line-height: var(--dex-okd-input-xs-action-line-height);
  margin-bottom: 4px;
  margin-bottom: var(--dex-okd-input-xs-label-margin, 4px)
}

.dex-label.label-xs .dex-label-place {
  min-height: var(--dex-okd-input-xs-label-line-height)
}

.dex-label.label-sm .dex-label-text {
  font-size: var(--dex-okd-input-sm-label-font-size);
  line-height: var(--dex-okd-input-sm-label-line-height);
  margin-bottom: 4px;
  margin-bottom: var(--dex-okd-input-sm-label-margin, 4px)
}

.dex-label.label-sm .dex-label-action {
  font-size: var(--dex-okd-input-sm-action-font-size);
  line-height: var(--dex-okd-input-sm-action-line-height);
  margin-bottom: 4px;
  margin-bottom: var(--dex-okd-input-sm-label-margin, 4px)
}

.dex-label.label-sm .dex-label-place {
  min-height: var(--dex-okd-input-sm-label-line-height)
}

.dex-label.label-md .dex-label-text {
  font-size: var(--dex-okd-input-md-label-font-size);
  line-height: var(--dex-okd-input-md-label-line-height);
  margin-bottom: 4px;
  margin-bottom: var(--dex-okd-input-md-label-margin, 4px)
}

.dex-label.label-md .dex-label-action {
  font-size: var(--dex-okd-input-md-action-font-size);
  line-height: var(--dex-okd-input-md-action-line-height);
  margin-bottom: 4px;
  margin-bottom: var(--dex-okd-input-md-label-margin, 4px)
}

.dex-label.label-md .dex-label-place {
  min-height: var(--dex-okd-input-md-label-line-height)
}

.dex-input-caret-color {
  caret-color: var(--dex-okd-input-focus-caret-color)
}

.dex-input-caret-color input[type=search]::-webkit-search-cancel-button {
  -webkit-appearance: none;
  appearance: none
}

.dex-input-caret-color input[type=search]::-moz-search-cancel-button {
  -moz-appearance: none;
  appearance: none
}

.dex-input-caret-color input::-ms-clear,
.dex-input-caret-color input::-ms-reveal {
  display: none
}

.dex-input-caret-color input::-o-clear {
  display: none
}

.dex-input {
  align-items: flex-start;
  display: flex;
  flex-direction: column;
  position: relative
}

.dex-input input[type=search]::-webkit-search-cancel-button {
  -webkit-appearance: none;
  appearance: none
}

.dex-input input[type=search]::-moz-search-cancel-button {
  -moz-appearance: none;
  appearance: none
}

.dex-input input::-ms-clear,
.dex-input input::-ms-reveal {
  display: none
}

.dex-input input::-o-clear {
  display: none
}

.dex-input * {
  box-sizing: border-box
}

.dex-input-prefix,
.dex-input-suffix {
  align-items: center;
  display: flex;
  flex-shrink: 1;
  white-space: nowrap
}

.dex-input-input {
  background: transparent;
  border: none;
  color: var(--dex-okd-input-default-text-color);
  flex-grow: 1;
  font-family: inherit;
  height: 100%;
  outline: none;
  width: 100%
}

.dex-input-input::-webkit-input-placeholder {
  -webkit-text-fill-color: var(--dex-okd-input-default-placeholder-color);
  color: var(--dex-okd-input-default-placeholder-color)
}

.dex-input-input:-moz-placeholder {
  -webkit-text-fill-color: var(--dex-okd-input-default-placeholder-color);
  color: var(--dex-okd-input-default-placeholder-color);
  opacity: 1
}

.dex-input-input::-ms-input-placeholder {
  -webkit-text-fill-color: var(--dex-okd-input-default-placeholder-color);
  color: var(--dex-okd-input-default-placeholder-color)
}

.dex-input-input:-webkit-autofill {
  -webkit-text-fill-color: var(--dex-okd-input-default-text-color) !important;
  border: none;
  -webkit-box-shadow: 0 0 0 30px var(--dex-okd-input-default-background) inset
}

.dex-input-input.input-textarea {
  box-shadow: none;
  outline: none;
  resize: none
}

.dex-input-custom-placeholder {
  position: relative;
  width: 100%
}

.dex-input-ellipsis {
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap
}

.dex-input-placeholder {
  bottom: 0;
  color: var(--dex-okd-input-default-placeholder-color);
  left: 0;
  pointer-events: none;
  position: absolute;
  right: 0;
  top: 50%;
  transform: translateY(-50%)
}

.dex-input-tips-box {
  display: flex;
  width: 100%
}

.dex-input-error {
  color: var(--dex-okd-input-error-tips-color)
}

.dex-input-tips {
  display: inline-block
}

.dex-input-help-text,
.dex-input-tips {
  color: var(--dex-okd-input-tips-text-color)
}

.dex-input-help-text {
  flex-grow: 1;
  flex-shrink: 0;
  text-align: right
}

.dex-input.hover,
.dex-input:hover {
  cursor: text
}

.dex-input.hover .dex-input-box,
.dex-input:hover .dex-input-box {
  background: var(--dex-okd-input-hover-background);
  border: thin solid var(--dex-okd-input-hover-border-color);
  box-shadow: var(--dex-okd-input-hover-shadow)
}

.dex-input.hover .dex-input-box .dex-input-input,
.dex-input:hover .dex-input-box .dex-input-input {
  -webkit-text-fill-color: var(--dex-okd-input-hover-text-color);
  caret-color: var(--dex-okd-input-hover-caret-color);
  color: var(--dex-okd-input-hover-text-color)
}

.dex-input.hover .dex-input-box .dex-input-input::-webkit-input-placeholder,
.dex-input:hover .dex-input-box .dex-input-input::-webkit-input-placeholder {
  -webkit-text-fill-color: var(--dex-okd-input-hover-placeholder-color);
  color: var(--dex-okd-input-hover-placeholder-color)
}

.dex-input.hover .dex-input-box .dex-input-input:-moz-placeholder,
.dex-input:hover .dex-input-box .dex-input-input:-moz-placeholder {
  -webkit-text-fill-color: var(--dex-okd-input-hover-placeholder-color);
  color: var(--dex-okd-input-hover-placeholder-color);
  opacity: 1
}

.dex-input.hover .dex-input-box .dex-input-input::-ms-input-placeholder,
.dex-input:hover .dex-input-box .dex-input-input::-ms-input-placeholder {
  -webkit-text-fill-color: var(--dex-okd-input-hover-placeholder-color);
  color: var(--dex-okd-input-hover-placeholder-color)
}

.dex-input.focus .dex-input-box {
  background: var(--dex-okd-input-focus-background);
  border: thin solid var(--dex-okd-input-focus-border-color);
  box-shadow: var(--dex-okd-input-focus-shadow)
}

.dex-input.focus .dex-input-box .dex-input-input {
  -webkit-text-fill-color: var(--dex-okd-input-focus-text-color);
  caret-color: var(--dex-okd-input-focus-caret-color);
  color: var(--dex-okd-input-focus-text-color)
}

.dex-input.focus .dex-input-box .dex-input-input::-webkit-input-placeholder {
  -webkit-text-fill-color: var(--dex-okd-input-focus-placeholder-color);
  color: var(--dex-okd-input-focus-placeholder-color)
}

.dex-input.focus .dex-input-box .dex-input-input:-moz-placeholder {
  -webkit-text-fill-color: var(--dex-okd-input-focus-placeholder-color);
  color: var(--dex-okd-input-focus-placeholder-color);
  opacity: 1
}

.dex-input.focus .dex-input-box .dex-input-input::-ms-input-placeholder {
  -webkit-text-fill-color: var(--dex-okd-input-focus-placeholder-color);
  color: var(--dex-okd-input-focus-placeholder-color)
}

.dex-input.readonly .dex-input-box {
  background: var(--dex-okd-input-default-background);
  background: var(--dex-okd-input-readonly-background, var(--dex-okd-input-default-background));
  border: thin solid var(--dex-okd-input-readonly-border-color, var(--dex-okd-input-default-border-color));
  box-shadow: var(--dex-okd-input-default-shadow);
  box-shadow: var(--dex-okd-input-readonly-shadow, var(--dex-okd-input-default-shadow))
}

.dex-input.readonly .dex-input-box .dex-input-input {
  -webkit-text-fill-color: var(--dex-okd-input-default-text-color);
  -webkit-text-fill-color: var(--dex-okd-input-readonly-text-color, var(--dex-okd-input-default-text-color));
  caret-color: var(--dex-okd-input-default-caret-color);
  caret-color: var(--dex-okd-input-readonly-caret-color, var(--dex-okd-input-default-caret-color));
  color: var(--dex-okd-input-default-text-color);
  color: var(--dex-okd-input-readonly-text-color, var(--dex-okd-input-default-text-color))
}

.dex-input.readonly .dex-input-box .dex-input-input::-webkit-input-placeholder {
  -webkit-text-fill-color: var(--dex-okd-input-default-placeholder-color);
  -webkit-text-fill-color: var(--dex-okd-input-readonly-placeholder-color, var(--dex-okd-input-default-placeholder-color));
  color: var(--dex-okd-input-default-placeholder-color);
  color: var(--dex-okd-input-readonly-placeholder-color, var(--dex-okd-input-default-placeholder-color))
}

.dex-input.readonly .dex-input-box .dex-input-input:-moz-placeholder {
  -webkit-text-fill-color: var(--dex-okd-input-default-placeholder-color);
  -webkit-text-fill-color: var(--dex-okd-input-readonly-placeholder-color, var(--dex-okd-input-default-placeholder-color));
  color: var(--dex-okd-input-default-placeholder-color);
  color: var(--dex-okd-input-readonly-placeholder-color, var(--dex-okd-input-default-placeholder-color));
  opacity: 1
}

.dex-input.readonly .dex-input-box .dex-input-input::-ms-input-placeholder {
  -webkit-text-fill-color: var(--dex-okd-input-default-placeholder-color);
  -webkit-text-fill-color: var(--dex-okd-input-readonly-placeholder-color, var(--dex-okd-input-default-placeholder-color));
  color: var(--dex-okd-input-default-placeholder-color);
  color: var(--dex-okd-input-readonly-placeholder-color, var(--dex-okd-input-default-placeholder-color))
}

.dex-input.readonly.focus .dex-input-box {
  border-color: var(--dex-okd-input-focus-border-color)
}

.dex-input.disabled {
  cursor: not-allowed
}

.dex-input.disabled .dex-input-box {
  background: var(--dex-okd-input-disabled-background);
  border: thin solid var(--dex-okd-input-disabled-border-color);
  box-shadow: var(--dex-okd-input-disabled-shadow)
}

.dex-input.disabled .dex-input-box .dex-input-input {
  -webkit-text-fill-color: var(--dex-okd-input-disabled-text-color);
  caret-color: var(--dex-okd-input-disabled-caret-color);
  color: var(--dex-okd-input-disabled-text-color)
}

.dex-input.disabled .dex-input-box .dex-input-input::-webkit-input-placeholder {
  -webkit-text-fill-color: var(--dex-okd-input-disabled-placeholder-color);
  color: var(--dex-okd-input-disabled-placeholder-color)
}

.dex-input.disabled .dex-input-box .dex-input-input:-moz-placeholder {
  -webkit-text-fill-color: var(--dex-okd-input-disabled-placeholder-color);
  color: var(--dex-okd-input-disabled-placeholder-color);
  opacity: 1
}

.dex-input.disabled .dex-input-box .dex-input-input::-ms-input-placeholder {
  -webkit-text-fill-color: var(--dex-okd-input-disabled-placeholder-color);
  color: var(--dex-okd-input-disabled-placeholder-color)
}

.dex-input.disabled .dex-input-input {
  cursor: not-allowed;
  opacity: 1
}

.dex-input.disabled .dex-input-input:-webkit-autofill {
  -webkit-text-fill-color: var(--dex-okd-input-disabled-text-color) !important;
  -webkit-box-shadow: 0 0 0 30px var(--dex-okd-input-disabled-background) inset
}

.dex-input.error .dex-input-box {
  background: var(--dex-okd-input-error-background);
  border: thin solid var(--dex-okd-input-error-border-color);
  box-shadow: var(--dex-okd-input-error-shadow)
}

.dex-input.error .dex-input-box .dex-input-input {
  -webkit-text-fill-color: var(--dex-okd-input-error-text-color);
  caret-color: var(--dex-okd-input-error-caret-color);
  color: var(--dex-okd-input-error-text-color)
}

.dex-input.error .dex-input-box .dex-input-input::-webkit-input-placeholder {
  -webkit-text-fill-color: var(--dex-okd-input-error-placeholder-color);
  color: var(--dex-okd-input-error-placeholder-color)
}

.dex-input.error .dex-input-box .dex-input-input:-moz-placeholder {
  -webkit-text-fill-color: var(--dex-okd-input-error-placeholder-color);
  color: var(--dex-okd-input-error-placeholder-color);
  opacity: 1
}

.dex-input.error .dex-input-box .dex-input-input::-ms-input-placeholder {
  -webkit-text-fill-color: var(--dex-okd-input-error-placeholder-color);
  color: var(--dex-okd-input-error-placeholder-color)
}

.dex-input.error .dex-input-error {
  display: inline-block
}

.dex-input.no-border .dex-input-box {
  background: transparent;
  border: thin solid transparent;
  box-shadow: none
}

.dex-input-textarea-resize-virtual-dom::-webkit-scrollbar {
  display: none;
  height: 0;
  width: 0
}

.dex-input-box {
  align-items: center;
  background: var(--dex-okd-input-default-background);
  border: thin solid var(--dex-okd-input-default-border-color);
  box-shadow: var(--dex-okd-input-default-shadow);
  display: flex;
  transition: border-color .3s, box-shadow .3s;
  width: 100%
}

.dex-input-xl>.dex-input-box {
  border-radius: var(--dex-okd-input-xl-border-radius);
  height: var(--dex-okd-input-xl-height);
  padding: 0 8px;
  padding: 0 var(--dex-okd-input-xl-padding-horizontal, 8px)
}

.dex-input-xl>.dex-input-box.auto-size {
  height: -webkit-fit-content;
  height: -moz-fit-content;
  height: fit-content;
  min-height: var(--dex-okd-input-xl-height)
}

.dex-input-xl>.dex-input-box.no-padding-left {
  padding-left: 0
}

.dex-input-xl>.dex-input-box.no-padding-right {
  padding-right: 0
}

.dex-input-xl>.dex-input-box.ta {
  height: 100%;
  padding: 8px
}

.dex-input-xl>.dex-input-box.auto-resize-auto-height {
  height: -webkit-fit-content;
  height: -moz-fit-content;
  height: fit-content;
  min-height: var(--dex-okd-input-xl-height)
}

.dex-input-xl>.dex-input-box.input-circle {
  border-radius: 100px
}

.dex-input-xl .dex-input-input {
  font-size: var(--dex-okd-input-xl-text-font-size);
  padding: calc(var(--dex-okd-input-xl-height)/2 - var(--dex-okd-input-xl-text-font-size)/2 - 2px) 0
}

.dex-input-xl .dex-input-input::-webkit-input-placeholder {
  font-size: var(--dex-okd-input-xl-text-font-size);
  font-weight: 400;
  text-overflow: ellipsis
}

.dex-input-xl .dex-input-input:-moz-placeholder {
  font-size: var(--dex-okd-input-xl-text-font-size);
  font-weight: 400;
  text-overflow: ellipsis
}

.dex-input-xl .dex-input-input::-ms-input-placeholder {
  font-size: var(--dex-okd-input-xl-text-font-size);
  font-weight: 400;
  text-overflow: ellipsis
}

.dex-input-xl .dex-input-input.ta {
  padding: 0
}

.dex-input-xl .dex-input-input.textarea-auto-resize {
  line-height: var(--dex-okd-input-xl-text-font-size)
}

.dex-input-xl .dex-input-placeholder {
  font-size: var(--dex-okd-input-xl-text-font-size);
  height: calc(var(--dex-okd-input-xl-text-font-size) + 2px);
  line-height: calc(var(--dex-okd-input-xl-text-font-size) + 2px)
}

.dex-input-xl .dex-input.dex-input-place-mode .dex-input-tips-box {
  min-height: calc(var(--dex-okd-input-xl-tip-line-height) + 6px);
  min-height: calc(var(--dex-okd-input-xl-tip-line-height) + var(--dex-okd-input-xl-tip-margin, 6px))
}

.dex-input-xl .dex-input-error {
  font-size: var(--dex-okd-input-xl-error-font-size);
  line-height: var(--dex-okd-input-xl-error-line-height);
  margin-top: 6px;
  margin-top: var(--dex-okd-input-xl-tip-margin, 6px)
}

.dex-input-xl .dex-input-help-text,
.dex-input-xl .dex-input-tips {
  font-size: var(--dex-okd-input-xl-tip-font-size);
  line-height: var(--dex-okd-input-xl-tip-line-height);
  margin-top: 6px;
  margin-top: var(--dex-okd-input-xl-tip-margin, 6px)
}

.dex-input-lg>.dex-input-box {
  border-radius: var(--dex-okd-input-lg-border-radius);
  height: var(--dex-okd-input-lg-height);
  padding: 0 8px;
  padding: 0 var(--dex-okd-input-lg-padding-horizontal, 8px)
}

.dex-input-lg>.dex-input-box.auto-size {
  height: -webkit-fit-content;
  height: -moz-fit-content;
  height: fit-content;
  min-height: var(--dex-okd-input-lg-height)
}

.dex-input-lg>.dex-input-box.no-padding-left {
  padding-left: 0
}

.dex-input-lg>.dex-input-box.no-padding-right {
  padding-right: 0
}

.dex-input-lg>.dex-input-box.ta {
  height: 100%;
  padding: 8px
}

.dex-input-lg>.dex-input-box.auto-resize-auto-height {
  height: -webkit-fit-content;
  height: -moz-fit-content;
  height: fit-content;
  min-height: var(--dex-okd-input-lg-height)
}

.dex-input-lg>.dex-input-box.input-circle {
  border-radius: 100px
}

.dex-input-lg .dex-input-input {
  font-size: var(--dex-okd-input-lg-text-font-size);
  padding: calc(var(--dex-okd-input-lg-height)/2 - var(--dex-okd-input-lg-text-font-size)/2 - 2px) 0
}

.dex-input-lg .dex-input-input::-webkit-input-placeholder {
  font-size: var(--dex-okd-input-lg-text-font-size);
  font-weight: 400;
  text-overflow: ellipsis
}

.dex-input-lg .dex-input-input:-moz-placeholder {
  font-size: var(--dex-okd-input-lg-text-font-size);
  font-weight: 400;
  text-overflow: ellipsis
}

.dex-input-lg .dex-input-input::-ms-input-placeholder {
  font-size: var(--dex-okd-input-lg-text-font-size);
  font-weight: 400;
  text-overflow: ellipsis
}

.dex-input-lg .dex-input-input.ta {
  padding: 0
}

.dex-input-lg .dex-input-input.textarea-auto-resize {
  line-height: var(--dex-okd-input-lg-text-font-size)
}

.dex-input-lg .dex-input-placeholder {
  font-size: var(--dex-okd-input-lg-text-font-size);
  height: calc(var(--dex-okd-input-lg-text-font-size) + 2px);
  line-height: calc(var(--dex-okd-input-lg-text-font-size) + 2px)
}

.dex-input-lg .dex-input.dex-input-place-mode .dex-input-tips-box {
  min-height: calc(var(--dex-okd-input-lg-tip-line-height) + 6px);
  min-height: calc(var(--dex-okd-input-lg-tip-line-height) + var(--dex-okd-input-lg-tip-margin, 6px))
}

.dex-input-lg .dex-input-error {
  font-size: var(--dex-okd-input-lg-error-font-size);
  line-height: var(--dex-okd-input-lg-error-line-height);
  margin-top: 6px;
  margin-top: var(--dex-okd-input-lg-tip-margin, 6px)
}

.dex-input-lg .dex-input-help-text,
.dex-input-lg .dex-input-tips {
  font-size: var(--dex-okd-input-lg-tip-font-size);
  line-height: var(--dex-okd-input-lg-tip-line-height);
  margin-top: 6px;
  margin-top: var(--dex-okd-input-lg-tip-margin, 6px)
}

.dex-input-xs>.dex-input-box {
  border-radius: var(--dex-okd-input-xs-border-radius);
  height: var(--dex-okd-input-xs-height);
  padding: 0 8px;
  padding: 0 var(--dex-okd-input-xs-padding-horizontal, 8px)
}

.dex-input-xs>.dex-input-box.auto-size {
  height: -webkit-fit-content;
  height: -moz-fit-content;
  height: fit-content;
  min-height: var(--dex-okd-input-xs-height)
}

.dex-input-xs>.dex-input-box.no-padding-left {
  padding-left: 0
}

.dex-input-xs>.dex-input-box.no-padding-right {
  padding-right: 0
}

.dex-input-xs>.dex-input-box.ta {
  height: 100%;
  padding: 8px
}

.dex-input-xs>.dex-input-box.auto-resize-auto-height {
  height: -webkit-fit-content;
  height: -moz-fit-content;
  height: fit-content;
  min-height: var(--dex-okd-input-xs-height)
}

.dex-input-xs>.dex-input-box.input-circle {
  border-radius: 100px
}

.dex-input-xs .dex-input-input {
  font-size: var(--dex-okd-input-xs-text-font-size);
  padding: calc(var(--dex-okd-input-xs-height)/2 - var(--dex-okd-input-xs-text-font-size)/2 - 2px) 0
}

.dex-input-xs .dex-input-input::-webkit-input-placeholder {
  font-size: var(--dex-okd-input-xs-text-font-size);
  font-weight: 400;
  text-overflow: ellipsis
}

.dex-input-xs .dex-input-input:-moz-placeholder {
  font-size: var(--dex-okd-input-xs-text-font-size);
  font-weight: 400;
  text-overflow: ellipsis
}

.dex-input-xs .dex-input-input::-ms-input-placeholder {
  font-size: var(--dex-okd-input-xs-text-font-size);
  font-weight: 400;
  text-overflow: ellipsis
}

.dex-input-xs .dex-input-input.ta {
  padding: 0
}

.dex-input-xs .dex-input-input.textarea-auto-resize {
  line-height: var(--dex-okd-input-xs-text-font-size)
}

.dex-input-xs .dex-input-placeholder {
  font-size: var(--dex-okd-input-xs-text-font-size);
  height: calc(var(--dex-okd-input-xs-text-font-size) + 2px);
  line-height: calc(var(--dex-okd-input-xs-text-font-size) + 2px)
}

.dex-input-xs .dex-input.dex-input-place-mode .dex-input-tips-box {
  min-height: calc(var(--dex-okd-input-xs-tip-line-height) + 4px);
  min-height: calc(var(--dex-okd-input-xs-tip-line-height) + var(--dex-okd-input-xs-tip-margin, 4px))
}

.dex-input-xs .dex-input-error {
  font-size: var(--dex-okd-input-xs-error-font-size);
  line-height: var(--dex-okd-input-xs-error-line-height);
  margin-top: 4px;
  margin-top: var(--dex-okd-input-xs-tip-margin, 4px)
}

.dex-input-xs .dex-input-help-text,
.dex-input-xs .dex-input-tips {
  font-size: var(--dex-okd-input-xs-tip-font-size);
  line-height: var(--dex-okd-input-xs-tip-line-height);
  margin-top: 4px;
  margin-top: var(--dex-okd-input-xs-tip-margin, 4px)
}

.dex-input-sm>.dex-input-box {
  border-radius: var(--dex-okd-input-sm-border-radius);
  height: var(--dex-okd-input-sm-height);
  padding: 0 8px;
  padding: 0 var(--dex-okd-input-sm-padding-horizontal, 8px)
}

.dex-input-sm>.dex-input-box.auto-size {
  height: -webkit-fit-content;
  height: -moz-fit-content;
  height: fit-content;
  min-height: var(--dex-okd-input-sm-height)
}

.dex-input-sm>.dex-input-box.no-padding-left {
  padding-left: 0
}

.dex-input-sm>.dex-input-box.no-padding-right {
  padding-right: 0
}

.dex-input-sm>.dex-input-box.ta {
  height: 100%;
  padding: 8px
}

.dex-input-sm>.dex-input-box.auto-resize-auto-height {
  height: -webkit-fit-content;
  height: -moz-fit-content;
  height: fit-content;
  min-height: var(--dex-okd-input-sm-height)
}

.dex-input-sm>.dex-input-box.input-circle {
  border-radius: 100px
}

.dex-input-sm .dex-input-input {
  font-size: var(--dex-okd-input-sm-text-font-size);
  padding: calc(var(--dex-okd-input-sm-height)/2 - var(--dex-okd-input-sm-text-font-size)/2 - 2px) 0
}

.dex-input-sm .dex-input-input::-webkit-input-placeholder {
  font-size: var(--dex-okd-input-sm-text-font-size);
  font-weight: 400;
  text-overflow: ellipsis
}

.dex-input-sm .dex-input-input:-moz-placeholder {
  font-size: var(--dex-okd-input-sm-text-font-size);
  font-weight: 400;
  text-overflow: ellipsis
}

.dex-input-sm .dex-input-input::-ms-input-placeholder {
  font-size: var(--dex-okd-input-sm-text-font-size);
  font-weight: 400;
  text-overflow: ellipsis
}

.dex-input-sm .dex-input-input.ta {
  padding: 0
}

.dex-input-sm .dex-input-input.textarea-auto-resize {
  line-height: var(--dex-okd-input-sm-text-font-size)
}

.dex-input-sm .dex-input-placeholder {
  font-size: var(--dex-okd-input-sm-text-font-size);
  height: calc(var(--dex-okd-input-sm-text-font-size) + 2px);
  line-height: calc(var(--dex-okd-input-sm-text-font-size) + 2px)
}

.dex-input-sm .dex-input.dex-input-place-mode .dex-input-tips-box {
  min-height: calc(var(--dex-okd-input-sm-tip-line-height) + 4px);
  min-height: calc(var(--dex-okd-input-sm-tip-line-height) + var(--dex-okd-input-sm-tip-margin, 4px))
}

.dex-input-sm .dex-input-error {
  font-size: var(--dex-okd-input-sm-error-font-size);
  line-height: var(--dex-okd-input-sm-error-line-height);
  margin-top: 4px;
  margin-top: var(--dex-okd-input-sm-tip-margin, 4px)
}

.dex-input-sm .dex-input-help-text,
.dex-input-sm .dex-input-tips {
  font-size: var(--dex-okd-input-sm-tip-font-size);
  line-height: var(--dex-okd-input-sm-tip-line-height);
  margin-top: 4px;
  margin-top: var(--dex-okd-input-sm-tip-margin, 4px)
}

.dex-input-md>.dex-input-box {
  border-radius: var(--dex-okd-input-md-border-radius);
  height: var(--dex-okd-input-md-height);
  padding: 0 8px;
  padding: 0 var(--dex-okd-input-md-padding-horizontal, 8px)
}

.dex-input-md>.dex-input-box.auto-size {
  height: -webkit-fit-content;
  height: -moz-fit-content;
  height: fit-content;
  min-height: var(--dex-okd-input-md-height)
}

.dex-input-md>.dex-input-box.no-padding-left {
  padding-left: 0
}

.dex-input-md>.dex-input-box.no-padding-right {
  padding-right: 0
}

.dex-input-md>.dex-input-box.ta {
  height: 100%;
  padding: 8px
}

.dex-input-md>.dex-input-box.auto-resize-auto-height {
  height: -webkit-fit-content;
  height: -moz-fit-content;
  height: fit-content;
  min-height: var(--dex-okd-input-md-height)
}

.dex-input-md>.dex-input-box.input-circle {
  border-radius: 100px
}

.dex-input-md .dex-input-input {
  font-size: var(--dex-okd-input-md-text-font-size);
  padding: calc(var(--dex-okd-input-md-height)/2 - var(--dex-okd-input-md-text-font-size)/2 - 2px) 0
}

.dex-input-md .dex-input-input::-webkit-input-placeholder {
  font-size: var(--dex-okd-input-md-text-font-size);
  font-weight: 400;
  text-overflow: ellipsis
}

.dex-input-md .dex-input-input:-moz-placeholder {
  font-size: var(--dex-okd-input-md-text-font-size);
  font-weight: 400;
  text-overflow: ellipsis
}

.dex-input-md .dex-input-input::-ms-input-placeholder {
  font-size: var(--dex-okd-input-md-text-font-size);
  font-weight: 400;
  text-overflow: ellipsis
}

.dex-input-md .dex-input-input.ta {
  padding: 0
}

.dex-input-md .dex-input-input.textarea-auto-resize {
  line-height: var(--dex-okd-input-md-text-font-size)
}

.dex-input-md .dex-input-placeholder {
  font-size: var(--dex-okd-input-md-text-font-size);
  height: calc(var(--dex-okd-input-md-text-font-size) + 2px);
  line-height: calc(var(--dex-okd-input-md-text-font-size) + 2px)
}

.dex-input-md .dex-input.dex-input-place-mode .dex-input-tips-box {
  min-height: calc(var(--dex-okd-input-md-tip-line-height) + 4px);
  min-height: calc(var(--dex-okd-input-md-tip-line-height) + var(--dex-okd-input-md-tip-margin, 4px))
}

.dex-input-md .dex-input-error {
  font-size: var(--dex-okd-input-md-error-font-size);
  line-height: var(--dex-okd-input-md-error-line-height);
  margin-top: 4px;
  margin-top: var(--dex-okd-input-md-tip-margin, 4px)
}

.dex-input-md .dex-input-help-text,
.dex-input-md .dex-input-tips {
  font-size: var(--dex-okd-input-md-tip-font-size);
  line-height: var(--dex-okd-input-md-tip-line-height);
  margin-top: 4px;
  margin-top: var(--dex-okd-input-md-tip-margin, 4px)
}

.dex-input-prefix {
  height: 100%
}

.dex-input-prefix .prefix-icon {
  color: var(--dex-okd-input-icon-color)
}

.dex-input-prefix .select {
  padding-right: 8px
}

.dex-input-suffix {
  height: 100%
}

.dex-input-suffix .suffix-icon {
  color: var(--dex-okd-input-icon-color)
}

.dex-input-suffix .clean-icon:hover {
  color: #000;
  color: var(--dex-okd-input-search-suffix-icon-hover-color, #000)
}

.dex-input-suffix .error-icon {
  color: var(--dex-okd-input-error-tips-color)
}

.dex-input-xl .dex-input-prefix .prefix-icon {
  font-size: var(--dex-okd-input-xl-icon-size);
  margin-left: 0;
  margin-right: var(--dex-okd-input-xl-icon-margin)
}

.dex-input-xl .dex-input-suffix .suffix-icon {
  font-size: var(--dex-okd-input-xl-icon-size);
  margin-left: var(--dex-okd-input-xl-icon-margin);
  margin-right: 0
}

.dex-input-lg .dex-input-prefix .prefix-icon {
  font-size: var(--dex-okd-input-lg-icon-size);
  margin-left: 0;
  margin-right: var(--dex-okd-input-lg-icon-margin)
}

.dex-input-lg .dex-input-suffix .suffix-icon {
  font-size: var(--dex-okd-input-lg-icon-size);
  margin-left: var(--dex-okd-input-lg-icon-margin);
  margin-right: 0
}

.dex-input-xs .dex-input-prefix .prefix-icon {
  font-size: var(--dex-okd-input-xs-icon-size);
  margin-left: 0;
  margin-right: var(--dex-okd-input-xs-icon-margin)
}

.dex-input-xs .dex-input-suffix .suffix-icon {
  font-size: var(--dex-okd-input-xs-icon-size);
  margin-left: var(--dex-okd-input-xs-icon-margin);
  margin-right: 0
}

.dex-input-sm .dex-input-prefix .prefix-icon {
  font-size: var(--dex-okd-input-sm-icon-size);
  margin-left: 0;
  margin-right: var(--dex-okd-input-sm-icon-margin)
}

.dex-input-sm .dex-input-suffix .suffix-icon {
  font-size: var(--dex-okd-input-sm-icon-size);
  margin-left: var(--dex-okd-input-sm-icon-margin);
  margin-right: 0
}

.dex-input-md .dex-input-prefix .prefix-icon {
  font-size: var(--dex-okd-input-md-icon-size);
  margin-left: 0;
  margin-right: var(--dex-okd-input-md-icon-margin)
}

.dex-input-md .dex-input-suffix .suffix-icon {
  font-size: var(--dex-okd-input-md-icon-size);
  margin-left: var(--dex-okd-input-md-icon-margin);
  margin-right: 0
}

.dex-input:hover .dex-input-number-suffix:not(.operation-always) {
  opacity: 1
}

.dex-input-number-inner {
  overflow: hidden
}

.dex-input-number-suffix {
  align-items: center;
  border-left: 1px solid var(--dex-okd-input-number-suffix-border-color, var(--dex-okd-input-default-border-color));
  cursor: pointer;
  display: flex;
  flex-direction: column;
  height: 100%;
  justify-content: center;
  line-height: 0;
  margin-left: 6px;
  overflow: hidden;
  text-align: center;
  transition: opacity .5s;
  width: 24px
}

.dex-input-number-suffix:not(.operation-always) {
  opacity: 0
}

.dex-input-number-suffix-part {
  align-items: center;
  background: var(--dex-okd-input-number-default-add-icon-background);
  box-sizing: border-box;
  display: flex;
  flex: 1 1;
  justify-content: center;
  width: 100%
}

.dex-input-number-suffix-part .icon {
  color: var(--dex-okd-input-number-default-add-icon-color);
  font-size: 13px
}

.dex-input-number-suffix-part .hover,
.dex-input-number-suffix-part:not(.dex-input-number-suffix-part-disabled):hover {
  background: var(--dex-okd-input-number-hover-add-icon-background)
}

.dex-input-number-suffix-part .hover .icon,
.dex-input-number-suffix-part:not(.dex-input-number-suffix-part-disabled):hover .icon {
  color: var(--dex-okd-input-number-hover-add-icon-color)
}

.dex-input-number-suffix-part .active,
.dex-input-number-suffix-part:not(.dex-input-number-suffix-part-disabled):active {
  background: var(--dex-okd-input-number-active-add-icon-background)
}

.dex-input-number-suffix-part .active .icon,
.dex-input-number-suffix-part:not(.dex-input-number-suffix-part-disabled):active .icon {
  color: var(--dex-okd-input-number-active-add-icon-color)
}

.dex-input-number-suffix-part-disabled {
  cursor: not-allowed
}

.dex-input-number-suffix-line {
  background: var(--dex-okd-input-default-border-color);
  background: var(--dex-okd-input-number-suffix-border-color, var(--dex-okd-input-default-border-color));
  height: 1px;
  width: 100%
}

.dex-input-number-suffix .up {
  transform: rotate(180deg)
}

.dex-input-number-localization {
  text-align: right
}

.dex-input-number-localization-percent {
  color: var(--dex-okd-input-default-text-color);
  display: inline-block
}

.dex-input-xl .dex-input-number-suffix.xl {
  border-bottom-right-radius: calc(var(--dex-okd-input-xl-border-radius) - 1px);
  border-top-right-radius: calc(var(--dex-okd-input-xl-border-radius) - 1px)
}

.dex-input-lg .dex-input-number-suffix.lg {
  border-bottom-right-radius: calc(var(--dex-okd-input-lg-border-radius) - 1px);
  border-top-right-radius: calc(var(--dex-okd-input-lg-border-radius) - 1px)
}

.dex-input-xs .dex-input-number-suffix.xs {
  border-bottom-right-radius: calc(var(--dex-okd-input-xs-border-radius) - 1px);
  border-top-right-radius: calc(var(--dex-okd-input-xs-border-radius) - 1px)
}

.dex-input-sm .dex-input-number-suffix.sm {
  border-bottom-right-radius: calc(var(--dex-okd-input-sm-border-radius) - 1px);
  border-top-right-radius: calc(var(--dex-okd-input-sm-border-radius) - 1px)
}

.dex-input-md .dex-input-number-suffix.md {
  border-bottom-right-radius: calc(var(--dex-okd-input-md-border-radius) - 1px);
  border-top-right-radius: calc(var(--dex-okd-input-md-border-radius) - 1px)
}

.dex-input-suffix .suffix-icon+.dex-input-code-btn,
.dex-input-suffix .suffix-icon+.dex-input-count-down {
  margin-left: var(--dex-okd-input-md-icon-margin)
}

.dex-input-count-down {
  color: var(--dex-okd-input-code-common-count-color)
}

.dex-input input::-webkit-inner-spin-button,
.dex-input input::-webkit-outer-spin-button {
  -webkit-appearance: none !important;
  margin: 0
}

.dex-input input[type=number] {
  -moz-appearance: textfield
}

.dex-input-xl .dex-input-count-down {
  font-size: var(--dex-okd-input-code-xl-count-font-size);
  line-height: var(--dex-okd-input-code-xl-count-line-height)
}

.dex-input-lg .dex-input-count-down {
  font-size: var(--dex-okd-input-code-lg-count-font-size);
  line-height: var(--dex-okd-input-code-lg-count-line-height)
}

.dex-input-xs .dex-input-count-down {
  font-size: var(--dex-okd-input-code-xs-count-font-size);
  line-height: var(--dex-okd-input-code-xs-count-line-height)
}

.dex-input-sm .dex-input-count-down {
  font-size: var(--dex-okd-input-code-sm-count-font-size);
  line-height: var(--dex-okd-input-code-sm-count-line-height)
}

.dex-input-md .dex-input-count-down {
  font-size: var(--dex-okd-input-code-md-count-font-size);
  line-height: var(--dex-okd-input-code-md-count-line-height)
}

.dex-input-switch-icon.icon {
  cursor: pointer
}

.dex-input-prefix .dex-input-search-prefix-icon {
  color: var(--dex-okd-input-search-prefix-icon-color);
  cursor: pointer;
  font-size: var(--dex-okd-input-search-prefix-icon-size);
  margin-right: 8px
}

.dex-input-suffix .clean-icon {
  color: var(--dex-okd-input-search-suffix-icon-color);
  cursor: pointer;
  font-size: var(--dex-okd-input-search-suffix-icon-size)
}

.dex-input-search .dex-input-error {
  color: var(--dex-okd-input-search-error-tips-color)
}

.dex-input-search .dex-input-box {
  background-color: var(--dex-okd-input-search-default-background);
  border-color: var(--dex-okd-input-search-default-border-color);
  box-shadow: var(--dex-okd-input-search-default-shadow)
}

.dex-input-search .dex-input-input {
  color: var(--dex-okd-input-search-default-text-color)
}

.dex-input-search .dex-input-input::-webkit-input-placeholder {
  -webkit-text-fill-color: var(--dex-okd-input-search-default-placeholder-color);
  color: var(--dex-okd-input-search-default-placeholder-color)
}

.dex-input-search .dex-input-input:-moz-placeholder {
  -webkit-text-fill-color: var(--dex-okd-input-search-default-placeholder-color);
  color: var(--dex-okd-input-search-default-placeholder-color);
  opacity: 1
}

.dex-input-search .dex-input-input::-ms-input-placeholder {
  -webkit-text-fill-color: var(--dex-okd-input-search-default-placeholder-color);
  color: var(--dex-okd-input-search-default-placeholder-color)
}

.dex-input-search.hover .dex-input-box,
.dex-input-search:hover .dex-input-box {
  background: var(--dex-okd-input-search-hover-background);
  border: thin solid var(--dex-okd-input-search-hover-border-color);
  box-shadow: var(--dex-okd-input-search-hover-shadow)
}

.dex-input-search.hover .dex-input-box .dex-input-input,
.dex-input-search:hover .dex-input-box .dex-input-input {
  -webkit-text-fill-color: var(--dex-okd-input-search-hover-text-color);
  caret-color: var(--dex-okd-input-search-hover-caret-color);
  color: var(--dex-okd-input-search-hover-text-color)
}

.dex-input-search.hover .dex-input-box .dex-input-input::-webkit-input-placeholder,
.dex-input-search:hover .dex-input-box .dex-input-input::-webkit-input-placeholder {
  -webkit-text-fill-color: var(--dex-okd-input-search-hover-placeholder-color);
  color: var(--dex-okd-input-search-hover-placeholder-color)
}

.dex-input-search.hover .dex-input-box .dex-input-input:-moz-placeholder,
.dex-input-search:hover .dex-input-box .dex-input-input:-moz-placeholder {
  -webkit-text-fill-color: var(--dex-okd-input-search-hover-placeholder-color);
  color: var(--dex-okd-input-search-hover-placeholder-color);
  opacity: 1
}

.dex-input-search.hover .dex-input-box .dex-input-input::-ms-input-placeholder,
.dex-input-search:hover .dex-input-box .dex-input-input::-ms-input-placeholder {
  -webkit-text-fill-color: var(--dex-okd-input-search-hover-placeholder-color);
  color: var(--dex-okd-input-search-hover-placeholder-color)
}

.dex-input-search.focus .dex-input-box {
  background: var(--dex-okd-input-search-focus-background);
  border: thin solid var(--dex-okd-input-search-focus-border-color);
  box-shadow: var(--dex-okd-input-search-focus-shadow)
}

.dex-input-search.focus .dex-input-box .dex-input-input {
  -webkit-text-fill-color: var(--dex-okd-input-search-focus-text-color);
  caret-color: var(--dex-okd-input-search-focus-caret-color);
  color: var(--dex-okd-input-search-focus-text-color)
}

.dex-input-search.focus .dex-input-box .dex-input-input::-webkit-input-placeholder {
  -webkit-text-fill-color: var(--dex-okd-input-search-focus-placeholder-color);
  color: var(--dex-okd-input-search-focus-placeholder-color)
}

.dex-input-search.focus .dex-input-box .dex-input-input:-moz-placeholder {
  -webkit-text-fill-color: var(--dex-okd-input-search-focus-placeholder-color);
  color: var(--dex-okd-input-search-focus-placeholder-color);
  opacity: 1
}

.dex-input-search.focus .dex-input-box .dex-input-input::-ms-input-placeholder {
  -webkit-text-fill-color: var(--dex-okd-input-search-focus-placeholder-color);
  color: var(--dex-okd-input-search-focus-placeholder-color)
}

.dex-input-search.disabled .dex-input-box {
  background: var(--dex-okd-input-search-disabled-background);
  border: thin solid var(--dex-okd-input-search-disabled-border-color);
  box-shadow: var(--dex-okd-input-search-disabled-shadow)
}

.dex-input-search.disabled .dex-input-box .dex-input-input {
  -webkit-text-fill-color: var(--dex-okd-input-search-disabled-text-color);
  caret-color: var(--dex-okd-input-search-disabled-caret-color);
  color: var(--dex-okd-input-search-disabled-text-color)
}

.dex-input-search.disabled .dex-input-box .dex-input-input::-webkit-input-placeholder {
  -webkit-text-fill-color: var(--dex-okd-input-search-disabled-placeholder-color);
  color: var(--dex-okd-input-search-disabled-placeholder-color)
}

.dex-input-search.disabled .dex-input-box .dex-input-input:-moz-placeholder {
  -webkit-text-fill-color: var(--dex-okd-input-search-disabled-placeholder-color);
  color: var(--dex-okd-input-search-disabled-placeholder-color);
  opacity: 1
}

.dex-input-search.disabled .dex-input-box .dex-input-input::-ms-input-placeholder {
  -webkit-text-fill-color: var(--dex-okd-input-search-disabled-placeholder-color);
  color: var(--dex-okd-input-search-disabled-placeholder-color)
}

.dex-input-search.error .dex-input-box {
  background: var(--dex-okd-input-search-error-background);
  border: thin solid var(--dex-okd-input-search-error-border-color);
  box-shadow: var(--dex-okd-input-search-error-shadow)
}

.dex-input-search.error .dex-input-box .dex-input-input {
  -webkit-text-fill-color: var(--dex-okd-input-search-error-text-color);
  caret-color: var(--dex-okd-input-search-error-caret-color);
  color: var(--dex-okd-input-search-error-text-color)
}

.dex-input-search.error .dex-input-box .dex-input-input::-webkit-input-placeholder {
  -webkit-text-fill-color: var(--dex-okd-input-search-error-placeholder-color);
  color: var(--dex-okd-input-search-error-placeholder-color)
}

.dex-input-search.error .dex-input-box .dex-input-input:-moz-placeholder {
  -webkit-text-fill-color: var(--dex-okd-input-search-error-placeholder-color);
  color: var(--dex-okd-input-search-error-placeholder-color);
  opacity: 1
}

.dex-input-search.error .dex-input-box .dex-input-input::-ms-input-placeholder {
  -webkit-text-fill-color: var(--dex-okd-input-search-error-placeholder-color);
  color: var(--dex-okd-input-search-error-placeholder-color)
}

.dex-input-verify {
  display: flex;
  flex-direction: row;
  position: relative
}

.dex-input-verify * {
  box-sizing: border-box
}

.dex-input-verify .dex-input-verify-input:focus {
  border: 1px solid var(--dex-okd-input-focus-border-color);
  box-shadow: var(--dex-okd-input-focus-shadow)
}

.dex-input-verify .dex-input-verify-input {
  align-items: center;
  background: transparent;
  background: var(--dex-okd-input-default-background);
  border: thin solid var(--dex-okd-input-default-border-color);
  box-shadow: var(--dex-okd-input-default-shadow);
  caret-color: var(--dex-okd-input-focus-caret-color);
  color: var(--dex-okd-input-default-text-color);
  display: flex;
  font-family: inherit;
  outline: none;
  text-align: center;
  transition: border-color .3s, box-shadow .3s
}

.dex-input-verify .dex-input-verify-input:-webkit-autofill {
  -webkit-text-fill-color: var(--dex-okd-input-default-text-color) !important;
  border: none;
  -webkit-box-shadow: 0 0 0 30px var(--dex-okd-input-default-background) inset
}

.dex-input-verify .dex-input-verify-input.input-xl {
  border-radius: 6px;
  font-size: 26px;
  height: 44px;
  margin-right: 8px;
  width: 40px
}

.dex-input-verify .dex-input-verify-input.input-xl.auto-size {
  height: -webkit-fit-content;
  height: -moz-fit-content;
  height: fit-content;
  min-height: 44px
}

.dex-input-verify .dex-input-verify-input.input-xl:last-child {
  margin-right: unset
}

.dex-input-verify .dex-input-verify-input.input-lg {
  border-radius: 6px;
  font-size: 26px;
  height: 44px;
  margin-right: 8px;
  width: 40px
}

.dex-input-verify .dex-input-verify-input.input-lg.auto-size {
  height: -webkit-fit-content;
  height: -moz-fit-content;
  height: fit-content;
  min-height: 44px
}

.dex-input-verify .dex-input-verify-input.input-lg:last-child {
  margin-right: unset
}

.dex-input-verify .dex-input-verify-input.input-xs {
  border-radius: 6px;
  font-size: 26px;
  height: 44px;
  margin-right: 8px;
  width: 40px
}

.dex-input-verify .dex-input-verify-input.input-xs.auto-size {
  height: -webkit-fit-content;
  height: -moz-fit-content;
  height: fit-content;
  min-height: 44px
}

.dex-input-verify .dex-input-verify-input.input-xs:last-child {
  margin-right: unset
}

.dex-input-verify .dex-input-verify-input.input-sm {
  border-radius: 6px;
  font-size: 20px;
  height: 40px;
  margin-right: 10px;
  width: 40px
}

.dex-input-verify .dex-input-verify-input.input-sm.auto-size {
  height: -webkit-fit-content;
  height: -moz-fit-content;
  height: fit-content;
  min-height: 40px
}

.dex-input-verify .dex-input-verify-input.input-sm:last-child {
  margin-right: unset
}

.dex-input-verify .dex-input-verify-input.input-md {
  border-radius: 6px;
  font-size: 26px;
  height: 44px;
  margin-right: 8px;
  width: 40px
}

.dex-input-verify .dex-input-verify-input.input-md.auto-size {
  height: -webkit-fit-content;
  height: -moz-fit-content;
  height: fit-content;
  min-height: 44px
}

.dex-input-verify .dex-input-verify-input.input-md:last-child {
  margin-right: unset
}

.dex-input-verify .dex-input-verify-input.error {
  border-color: var(--dex-okd-input-verify-error-border-color, var(--dex-okd-input-error-border-color))
}

.dex-input-verify .dex-input-verify-input.disabled {
  -webkit-text-fill-color: var(--dex-okd-input-disabled-text-color);
  background: var(--dex-okd-input-disabled-background);
  border: thin solid var(--dex-okd-input-disabled-border-color);
  box-shadow: var(--dex-okd-input-disabled-shadow);
  caret-color: var(--dex-okd-input-disabled-caret-color);
  color: var(--dex-okd-input-disabled-text-color);
  cursor: not-allowed
}

.dex-tooltip .dex-popup-layer-content {
  word-wrap: break-word;
  border-radius: 2px;
  color: var(--dex-okd-tooltip-default-font-color);
  font-size: 12px;
  line-height: 16px;
  max-width: 160px;
  padding: 8px
}

.dex-tooltip .dex-popup-layer-arrow-inner,
.dex-tooltip .dex-popup-layer-content {
  background-color: var(--dex-okd-tooltip-neutral-background)
}

.dex-tooltip-negative .dex-popup-layer-arrow-inner,
.dex-tooltip-negative .dex-popup-layer-content {
  background-color: var(--dex-okd-tooltip-negative-background)
}

.dex-tooltip-positive .dex-popup-layer-arrow-inner,
.dex-tooltip-positive .dex-popup-layer-content {
  background-color: var(--dex-okd-tooltip-positive-background)
}

.dex-tooltip-informative .dex-popup-layer-arrow-inner,
.dex-tooltip-informative .dex-popup-layer-content {
  background-color: var(--dex-okd-tooltip-informative-background)
}

.dex-tag {
  align-items: center;
  border-style: solid;
  box-sizing: border-box;
  display: inline-flex
}

.dex-tag-ellipsis {
  max-width: 200px;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap
}

.dex-tag-icon {
  padding-right: 2px
}

.dex-tag-sm {
  --dex-okd-tag-inner-height: var(--dex-okd-tag-sm-height, 16px);
  border-radius: 4px;
  border-radius: var(--dex-okd-tag-sm-border-radius, 4px);
  border-width: 1px;
  border-width: var(--dex-okd-tag-sm-border-width, 1px);
  font-size: 12px;
  font-size: var(--dex-okd-tag-sm-font-size, 12px);
  font-weight: 400;
  font-weight: var(--dex-okd-tag-sm-font-weight, 400);
  line-height: 16px;
  line-height: var(--dex-okd-tag-sm-line-height, 16px);
  padding: 2px 4px;
  padding: var(--dex-okd-tag-sm-padding-vertical, 2px) var(--dex-okd-tag-sm-padding-horizontal, 4px)
}

.dex-tag-sm .dex-tag-icon {
  font-size: 12px;
  font-size: var(--dex-okd-tag-sm-icon-size, 12px)
}

.dex-tag-md {
  --dex-okd-tag-inner-height: var(--dex-okd-tag-md-height, 20px);
  border-radius: 4px;
  border-radius: var(--dex-okd-tag-md-border-radius, 4px);
  border-width: 1px;
  border-width: var(--dex-okd-tag-md-border-width, 1px);
  font-size: 12px;
  font-size: var(--dex-okd-tag-md-font-size, 12px);
  font-weight: 400;
  font-weight: var(--dex-okd-tag-md-font-weight, 400);
  line-height: 16px;
  line-height: var(--dex-okd-tag-md-line-height, 16px);
  padding: 2px 4px;
  padding: var(--dex-okd-tag-md-padding-vertical, 2px) var(--dex-okd-tag-md-padding-horizontal, 4px)
}

.dex-tag-md .dex-tag-icon {
  font-size: 16px;
  font-size: var(--dex-okd-tag-md-icon-size, 16px)
}

.dex-tag-lg {
  --dex-okd-tag-inner-height: var(--dex-okd-tag-lg-height, 24px);
  border-radius: 4px;
  border-radius: var(--dex-okd-tag-lg-border-radius, 4px);
  border-width: 1px;
  border-width: var(--dex-okd-tag-lg-border-width, 1px);
  font-size: 12px;
  font-size: var(--dex-okd-tag-lg-font-size, 12px);
  font-weight: 400;
  font-weight: var(--dex-okd-tag-lg-font-weight, 400);
  line-height: 16px;
  line-height: var(--dex-okd-tag-lg-line-height, 16px);
  padding: 2px 4px;
  padding: var(--dex-okd-tag-lg-padding-vertical, 2px) var(--dex-okd-tag-lg-padding-horizontal, 4px)
}

.dex-tag-lg .dex-tag-icon {
  font-size: 16px;
  font-size: var(--dex-okd-tag-lg-icon-size, 16px)
}

.dex-tag-fixed-height {
  height: var(--dex-okd-tag-inner-height);
  padding-bottom: 0;
  padding-top: 0
}

.dex-tag-fill-grey {
  background-color: var(--dex-okd-tag-fill-grey-background-color);
  border-color: var(--dex-okd-tag-fill-grey-border-color);
  color: var(--dex-okd-tag-fill-grey-font-color)
}

.dex-tag-fill-lightgrey {
  background-color: hsla(0, 0%, 100%, 0);
  background-color: var(--dex-okd-tag-fill-lightgrey-background-color, hsla(0, 0%, 100%, 0));
  border-color: hsla(0, 0%, 100%, 0);
  border-color: var(--dex-okd-tag-fill-lightgrey-border-color, hsla(0, 0%, 100%, 0));
  color: hsla(0, 0%, 100%, 0);
  color: var(--dex-okd-tag-fill-lightgrey-font-color, hsla(0, 0%, 100%, 0))
}

.dex-tag-fill-green {
  background-color: var(--dex-okd-tag-fill-green-background-color);
  border-color: var(--dex-okd-tag-fill-green-border-color);
  color: var(--dex-okd-tag-fill-green-font-color)
}

.dex-tag-fill-red {
  background-color: var(--dex-okd-tag-fill-red-background-color);
  border-color: var(--dex-okd-tag-fill-red-border-color);
  color: var(--dex-okd-tag-fill-red-font-color)
}

.dex-tag-fill-tangerine {
  background-color: hsla(0, 0%, 100%, 0);
  background-color: var(--dex-okd-tag-fill-tangerine-background-color, hsla(0, 0%, 100%, 0));
  border-color: hsla(0, 0%, 100%, 0);
  border-color: var(--dex-okd-tag-fill-tangerine-border-color, hsla(0, 0%, 100%, 0));
  color: hsla(0, 0%, 100%, 0);
  color: var(--dex-okd-tag-fill-tangerine-font-color, hsla(0, 0%, 100%, 0))
}

.dex-tag-fill-lime {
  background-color: var(--dex-okd-tag-fill-lime-background-color);
  border-color: var(--dex-okd-tag-fill-lime-border-color);
  color: var(--dex-okd-tag-fill-lime-font-color)
}

.dex-tag-outline-grey {
  background-color: var(--dex-okd-tag-outline-grey-background-color);
  border-color: var(--dex-okd-tag-outline-grey-border-color);
  color: var(--dex-okd-tag-outline-grey-font-color)
}

.dex-tag-outline-lightgrey {
  background-color: var(--dex-okd-tag-outline-lightgrey-background-color);
  border-color: var(--dex-okd-tag-outline-lightgrey-border-color);
  color: var(--dex-okd-tag-outline-lightgrey-font-color)
}

.dex-tag-outline-green {
  background-color: var(--dex-okd-tag-outline-green-background-color);
  border-color: var(--dex-okd-tag-outline-green-border-color);
  color: var(--dex-okd-tag-outline-green-font-color)
}

.dex-tag-outline-red {
  background-color: var(--dex-okd-tag-outline-red-background-color);
  border-color: var(--dex-okd-tag-outline-red-border-color);
  color: var(--dex-okd-tag-outline-red-font-color)
}

.dex-tag-outline-tangerine {
  background-color: var(--dex-okd-tag-outline-tangerine-background-color);
  border-color: var(--dex-okd-tag-outline-tangerine-border-color);
  color: var(--dex-okd-tag-outline-tangerine-font-color)
}

.dex-tag-outline-lime {
  background-color: hsla(0, 0%, 100%, 0);
  background-color: var(--dex-okd-tag-outline-lime-background-color, hsla(0, 0%, 100%, 0));
  border-color: hsla(0, 0%, 100%, 0);
  border-color: var(--dex-okd-tag-outline-lime-border-color, hsla(0, 0%, 100%, 0));
  color: hsla(0, 0%, 100%, 0);
  color: var(--dex-okd-tag-outline-lime-font-color, hsla(0, 0%, 100%, 0))
}

.dex-tag.dex-tag-fill-lime {
  font-weight: 700
}

.dex-powerLink {
  color: inherit;
  text-decoration: none
}

.dex-powerLink-a11y:focus-visible {
  border-radius: 2px;
  outline: 2px solid var(--dex-okd-color-border-focus);
  outline-color: var(--dex-okd-color-border-focus);
  outline-offset: 2px;
  outline-style: solid;
  outline-width: 2px
}

.dex-transition-fade {
  transition: opacity .3s linear
}

.dex-transition-fade-active {
  will-change: opacity
}

.dex-transition-fade-ease-out {
  transition-timing-function: cubic-bezier(.5, 0, .52, 1)
}

.dex-transition-fade-entered,
.dex-transition-fade-entering {
  opacity: 1
}

.dex-transition-fade-exited,
.dex-transition-fade-exiting {
  opacity: 0
}

.dex-transition-slide {
  -webkit-backface-visibility: hidden;
  backface-visibility: hidden;
  perspective: 1000px;
  position: fixed;
  transform: translateY(100%);
  transform-style: preserve-3d;
  transition: transform .3s linear, opacity .3s linear
}

.dex-transition-slide-active {
  will-change: transform, opacity
}

.dex-transition-slide-cubic {
  transition-timing-function: ease
}

.dex-transition-slide-top {
  left: 0;
  top: 0;
  width: 100%
}

.dex-transition-slide-bottom {
  bottom: 0;
  left: 0;
  width: 100%
}

.dex-transition-slide-left {
  height: 100%;
  left: 0;
  top: 0
}

.dex-transition-slide-right {
  height: 100%;
  right: 0;
  top: 0
}

.dex-transition-slide-entered,
.dex-transition-slide-entering {
  opacity: 1;
  transform: none
}

.dex-transition-slide-exited,
.dex-transition-slide-exiting {
  opacity: 0
}

.dex-transition-slide-exited.dex-transition-slide-top,
.dex-transition-slide-exiting.dex-transition-slide-top {
  transform: translateY(-100%)
}

.dex-transition-slide-exited.dex-transition-slide-bottom,
.dex-transition-slide-exiting.dex-transition-slide-bottom {
  transform: translateY(100%)
}

.dex-transition-slide-exited.dex-transition-slide-left,
.dex-transition-slide-exiting.dex-transition-slide-left {
  transform: translateX(-100%)
}

.dex-transition-slide-exited.dex-transition-slide-right,
.dex-transition-slide-exiting.dex-transition-slide-right {
  transform: translateX(100%)
}

@media (hover:none) and (pointer:coarse) {
  .dex-transition-slide {
    transition-duration: .2s
  }
}

.dex-radio-inner {
  background-color: var(--dex-okd-radio-default-background);
  border: 1px solid var(--dex-okd-radio-default-border-color);
  border-radius: 50%;
  box-sizing: border-box;
  cursor: pointer;
  direction: ltr;
  display: block;
  left: 0;
  margin-top: 1px;
  position: relative;
  top: 0
}

.dex-radio-input {
  cursor: pointer;
  height: 100%;
  left: 0;
  margin: 0;
  opacity: 0;
  position: absolute;
  width: 100%;
  z-index: 1
}

.dex-radio-input:focus-visible {
  border-radius: 50%;
  opacity: 1;
  outline: 2px solid var(--dex-okd-color-border-focus);
  outline-color: var(--dex-okd-color-border-focus);
  outline-offset: 2px;
  outline-style: solid;
  outline-width: 2px
}

.dex-radio-children {
  cursor: pointer;
  display: inline-block;
  font-size: var(--dex-okd-radio-common-label-font-size);
  margin-left: 4px;
  vertical-align: top;
  white-space: normal;
  word-break: break-word
}

.dex-radio-wrapper {
  cursor: pointer;
  display: inline-block;
  font-size: 0;
  margin-right: 8px;
  -webkit-user-select: none;
  -moz-user-select: none;
  -ms-user-select: none;
  user-select: none;
  white-space: nowrap
}

.dex-radio-wrapper .dex-radio {
  cursor: pointer;
  display: inline-block;
  position: relative;
  vertical-align: middle
}

.dex-radio-wrapper .dex-radio-children {
  color: var(--dex-okd-radio-default-text-color)
}

.dex-radio-wrapper.hover-status .dex-radio-inner {
  border-color: var(--dex-okd-radio-default-hover-border-color);
  box-shadow: var(--dex-okd-radio-default-hover-shadow)
}

.dex-radio-wrapper-checked .dex-radio-children {
  color: var(--dex-okd-radio-selected-text-color)
}

.dex-radio-wrapper-checked .dex-radio-inner {
  background-color: var(--dex-okd-radio-selected-background);
  border-color: var(--dex-okd-radio-selected-border-color)
}

.dex-radio-wrapper-checked .dex-radio-inner:after {
  background-color: var(--dex-okd-radio-selected-inner-color);
  border: 2px solid var(--dex-okd-radio-selected-inner-color);
  border-left: 0;
  border-radius: 50%;
  border-top: 0;
  box-sizing: border-box;
  content: " ";
  height: 6px;
  left: 50%;
  position: absolute;
  top: 50%;
  transform: translate(-50%, -50%) rotate(45deg);
  transition: all .2s cubic-bezier(.12, .4, .29, 1.46) .1s;
  width: 6px
}

.dex-radio-wrapper-error .dex-radio-children {
  color: var(--dex-okd-radio-error-text-color)
}

.dex-radio-wrapper-error .dex-radio-inner {
  border-color: var(--dex-okd-radio-error-border-color)
}

.dex-radio-wrapper-error.hover-status .dex-radio-inner {
  border-color: var(--dex-okd-radio-error-hover-border-color);
  box-shadow: var(--dex-okd-radio-error-hover-shadow)
}

.dex-radio-wrapper-error.dex-radio-wrapper-checked .dex-radio-inner {
  background-color: var(--dex-okd-radio-error-background);
  border-color: var(--dex-okd-radio-error-border-color)
}

.dex-radio-wrapper-error.dex-radio-wrapper-checked .dex-radio-inner:after {
  background: var(--dex-okd-radio-error-inner-color);
  border-color: var(--dex-okd-radio-error-inner-color)
}

.dex-radio-wrapper-disabled {
  cursor: not-allowed
}

.dex-radio-wrapper-disabled .dex-radio-children {
  color: var(--dex-okd-radio-disabled-text-color);
  cursor: not-allowed
}

.dex-radio-wrapper-disabled .dex-radio,
.dex-radio-wrapper-disabled .dex-radio .dex-radio-input {
  cursor: default
}

.dex-radio-wrapper-disabled .dex-radio .dex-radio-inner {
  background-color: var(--dex-okd-radio-disabled-background);
  border-color: var(--dex-okd-radio-disabled-border-color);
  cursor: default
}

.dex-radio-wrapper-disabled.hover-status .dex-radio-inner {
  border-color: var(--dex-okd-radio-disabled-hover-border-color);
  box-shadow: unset
}

.dex-radio-wrapper-disabled.dex-radio-wrapper-checked .dex-radio-inner {
  border-color: var(--dex-okd-radio-disabled-checked-border-color)
}

.dex-radio-wrapper-disabled.dex-radio-wrapper-checked .dex-radio-inner:after {
  background-color: var(--dex-okd-radio-disabled-checked-inner-color);
  border-color: var(--dex-okd-radio-disabled-inner-color)
}

.dex-radio-sm .dex-radio-inner {
  height: var(--dex-okd-radio-sm-height);
  width: var(--dex-okd-radio-sm-width)
}

.dex-radio-sm .dex-radio-children {
  font-size: var(--dex-okd-radio-sm-font-size);
  margin-left: var(--dex-okd-radio-sm-margin)
}

.dex-radio-sm.dex-radio-wrapper {
  line-height: var(--dex-okd-radio-sm-line-height);
  padding-bottom: var(--dex-okd-radio-sm-padding);
  padding-top: var(--dex-okd-radio-sm-padding)
}

.dex-radio-md .dex-radio-inner {
  height: var(--dex-okd-radio-md-height);
  width: var(--dex-okd-radio-md-width)
}

.dex-radio-md .dex-radio-children {
  font-size: var(--dex-okd-radio-md-font-size);
  margin-left: var(--dex-okd-radio-md-margin)
}

.dex-radio-md.dex-radio-wrapper {
  line-height: var(--dex-okd-radio-md-line-height);
  padding-bottom: var(--dex-okd-radio-md-padding);
  padding-top: var(--dex-okd-radio-md-padding)
}

@media (min-width:768px) {

  .dex-radio-wrapper-disabled.dex-radio-wrapper-checked:hover .dex-radio-inner,
  .dex-radio-wrapper-disabled:hover .dex-radio-inner {
    border-color: var(--dex-okd-radio-disabled-hover-border-color);
    box-shadow: unset
  }

  .dex-radio-wrapper:not(.dex-radio-wrapper-disabled):hover .dex-radio-inner {
    border-color: var(--dex-okd-radio-default-hover-border-color);
    box-shadow: var(--dex-okd-radio-default-hover-shadow)
  }

  .dex-radio-wrapper-checked:not(.dex-radio-wrapper-disabled):hover .dex-radio-inner {
    border-color: var(--dex-okd-radio-selected-hover-border-color);
    box-shadow: var(--dex-okd-radio-selected-hover-shadow)
  }

  .dex-radio-wrapper-error:not(.dex-radio-wrapper-disabled):hover .dex-radio-inner {
    border-color: var(--dex-okd-radio-error-hover-border-color);
    box-shadow: var(--dex-okd-radio-error-hover-shadow)
  }
}

.dex-radio-reversed .dex-radio-inner {
  background-color: var(--dex-okd-radio-reversed-default-background);
  border: 1px solid var(--dex-okd-radio-reversed-default-border-color)
}

.dex-radio-reversed.dex-radio-wrapper .dex-radio-children {
  color: var(--dex-okd-radio-reversed-default-text-color)
}

.dex-radio-reversed.dex-radio-wrapper.hover-status .dex-radio-inner,
.dex-radio-reversed.dex-radio-wrapper:hover .dex-radio-inner {
  border-color: var(--dex-okd-radio-reversed-default-hover-border-color);
  box-shadow: var(--dex-okd-radio-reversed-default-hover-shadow)
}

.dex-radio-reversed.dex-radio-wrapper-checked .dex-radio-children {
  color: var(--dex-okd-radio-reversed-selected-text-color)
}

.dex-radio-reversed.dex-radio-wrapper-checked .dex-radio-inner {
  background-color: var(--dex-okd-radio-reversed-selected-background);
  border-color: var(--dex-okd-radio-reversed-selected-border-color)
}

.dex-radio-reversed.dex-radio-wrapper-checked .dex-radio-inner:after {
  background-color: var(--dex-okd-radio-reversed-selected-inner-color);
  border: 2px solid var(--dex-okd-radio-reversed-selected-inner-color)
}

.dex-radio-reversed.dex-radio-wrapper-checked:hover .dex-radio-inner {
  border-color: var(--dex-okd-radio-reversed-selected-hover-border-color);
  box-shadow: var(--dex-okd-radio-reversed-selected-hover-shadow)
}

.dex-radio-reversed.dex-radio-wrapper-error .dex-radio-children {
  color: var(--dex-okd-radio-reversed-error-text-color)
}

.dex-radio-reversed.dex-radio-wrapper-error .dex-radio-inner {
  border-color: var(--dex-okd-radio-reversed-error-border-color)
}

.dex-radio-reversed.dex-radio-wrapper-error.hover-status .dex-radio-inner,
.dex-radio-reversed.dex-radio-wrapper-error:hover .dex-radio-inner {
  border-color: var(--dex-okd-radio-reversed-error-hover-border-color);
  box-shadow: var(--dex-okd-radio-reversed-error-hover-shadow)
}

.dex-radio-reversed.dex-radio-wrapper-error.dex-radio-wrapper-checked .dex-radio-inner {
  background-color: var(--dex-okd-radio-reversed-error-background);
  border-color: var(--dex-okd-radio-reversed-error-border-color)
}

.dex-radio-reversed.dex-radio-wrapper-error.dex-radio-wrapper-checked .dex-radio-inner:after {
  background: var(--dex-okd-radio-reversed-error-inner-color);
  border-color: var(--dex-okd-radio-reversed-error-inner-color)
}

.dex-radio-reversed.dex-radio-wrapper-disabled .dex-radio-children {
  color: var(--dex-okd-radio-reversed-disabled-text-color)
}

.dex-radio-reversed.dex-radio-wrapper-disabled .dex-radio .dex-radio-inner {
  background-color: var(--dex-okd-radio-reversed-disabled-background);
  border-color: var(--dex-okd-radio-reversed-disabled-border-color)
}

.dex-radio-reversed.dex-radio-wrapper-disabled.hover-status .dex-radio-inner,
.dex-radio-reversed.dex-radio-wrapper-disabled:hover .dex-radio-inner {
  border-color: var(--dex-okd-radio-reversed-disabled-hover-border-color)
}

.dex-radio-reversed.dex-radio-wrapper-disabled.dex-radio-wrapper-checked .dex-radio-inner {
  border-color: var(--dex-okd-radio-reversed-disabled-checked-border-color)
}

.dex-radio-reversed.dex-radio-wrapper-disabled.dex-radio-wrapper-checked .dex-radio-inner:after {
  background-color: var(--dex-okd-radio-reversed-disabled-checked-inner-color);
  border-color: var(--dex-okd-radio-reversed-disabled-inner-color)
}

.dex-positivebutton-xxs {
  font-size: 12px;
  font-size: var(--dex-okd-positivebutton-xxs-font-size, 12px);
  font-weight: 400;
  font-weight: var(--dex-okd-positivebutton-xxs-font-weight, 400);
  line-height: 16px;
  line-height: var(--dex-okd-positivebutton-xxs-line-height, 16px);
  min-width: 63px;
  min-width: var(--dex-okd-positivebutton-xxs-min-width, 63px);
  padding: 4px 12px;
  padding: var(--dex-okd-positivebutton-xxs-padding-vertical, 4px) var(--dex-okd-positivebutton-xxs-padding-horizontal, 12px)
}

.dex-positivebutton-xxs .dex-positivebutton-loader-circle {
  height: 14px;
  height: var(--dex-okd-positivebutton-xxs-loader-width, 14px);
  width: 14px;
  width: var(--dex-okd-positivebutton-xxs-loader-width, 14px)
}

.dex-positivebutton-xxs .dex-positivebutton-icon {
  font-size: 14px;
  font-size: var(--dex-okd-positivebutton-xxs-icon-size, 14px);
  font-weight: 400;
  font-weight: var(--dex-okd-positivebutton-xxs-font-weight, 400)
}

.dex-positivebutton-xxs .dex-positivebutton-icon-leading {
  margin-right: 6px;
  margin-right: var(--dex-okd-positivebutton-xxs-icon-margin-right, 6px)
}

.dex-positivebutton-xxs .dex-positivebutton-icon-tailing {
  margin-left: 6px;
  margin-left: var(--dex-okd-positivebutton-xxs-icon-margin-right, 6px)
}

.dex-positivebutton-loading-text .dex-positivebutton-loader {
  margin-right: var(--dex-okd-positivebutton-xxs-loader-margin-right, 6px)
}

.dex-positivebutton-xs {
  font-size: 12px;
  font-size: var(--dex-okd-positivebutton-xs-font-size, 12px);
  font-weight: 400;
  font-weight: var(--dex-okd-positivebutton-xs-font-weight, 400);
  line-height: 16px;
  line-height: var(--dex-okd-positivebutton-xs-line-height, 16px);
  min-width: 63px;
  min-width: var(--dex-okd-positivebutton-xs-min-width, 63px);
  padding: 6px 12px;
  padding: var(--dex-okd-positivebutton-xs-padding-vertical, 6px) var(--dex-okd-positivebutton-xs-padding-horizontal, 12px)
}

.dex-positivebutton-xs .dex-positivebutton-loader-circle {
  height: 14px;
  height: var(--dex-okd-positivebutton-xs-loader-width, 14px);
  width: 14px;
  width: var(--dex-okd-positivebutton-xs-loader-width, 14px)
}

.dex-positivebutton-xs .dex-positivebutton-icon {
  font-size: 14px;
  font-size: var(--dex-okd-positivebutton-xs-icon-size, 14px);
  font-weight: 400;
  font-weight: var(--dex-okd-positivebutton-xs-font-weight, 400)
}

.dex-positivebutton-xs .dex-positivebutton-icon-leading {
  margin-right: 6px;
  margin-right: var(--dex-okd-positivebutton-xs-icon-margin-right, 6px)
}

.dex-positivebutton-xs .dex-positivebutton-icon-tailing {
  margin-left: 6px;
  margin-left: var(--dex-okd-positivebutton-xs-icon-margin-right, 6px)
}

.dex-positivebutton-loading-text .dex-positivebutton-loader {
  margin-right: var(--dex-okd-positivebutton-xs-loader-margin-right, 6px)
}

.dex-positivebutton-s {
  font-size: 14px;
  font-size: var(--dex-okd-positivebutton-s-font-size, 14px);
  font-weight: 400;
  font-weight: var(--dex-okd-positivebutton-s-font-weight, 400);
  line-height: 16px;
  line-height: var(--dex-okd-positivebutton-s-line-height, 16px);
  min-width: 72px;
  min-width: var(--dex-okd-positivebutton-s-min-width, 72px);
  padding: 8px 12px;
  padding: var(--dex-okd-positivebutton-s-padding-vertical, 8px) var(--dex-okd-positivebutton-s-padding-horizontal, 12px)
}

.dex-positivebutton-s .dex-positivebutton-loader-circle {
  height: 14px;
  height: var(--dex-okd-positivebutton-s-loader-width, 14px);
  width: 14px;
  width: var(--dex-okd-positivebutton-s-loader-width, 14px)
}

.dex-positivebutton-s .dex-positivebutton-icon {
  font-size: 14px;
  font-size: var(--dex-okd-positivebutton-s-icon-size, 14px);
  font-weight: 400;
  font-weight: var(--dex-okd-positivebutton-s-font-weight, 400)
}

.dex-positivebutton-s .dex-positivebutton-icon-leading {
  margin-right: 6px;
  margin-right: var(--dex-okd-positivebutton-s-icon-margin-right, 6px)
}

.dex-positivebutton-s .dex-positivebutton-icon-tailing {
  margin-left: 6px;
  margin-left: var(--dex-okd-positivebutton-s-icon-margin-right, 6px)
}

.dex-positivebutton-loading-text .dex-positivebutton-loader {
  margin-right: var(--dex-okd-positivebutton-s-loader-margin-right, 6px)
}

.dex-positivebutton-sm {
  font-size: 14px;
  font-size: var(--dex-okd-positivebutton-sm-font-size, 14px);
  font-weight: 400;
  font-weight: var(--dex-okd-positivebutton-sm-font-weight, 400);
  line-height: 16px;
  line-height: var(--dex-okd-positivebutton-sm-line-height, 16px);
  min-width: 81px;
  min-width: var(--dex-okd-positivebutton-sm-min-width, 81px);
  padding: 10px 16px;
  padding: var(--dex-okd-positivebutton-sm-padding-vertical, 10px) var(--dex-okd-positivebutton-sm-padding-horizontal, 16px)
}

.dex-positivebutton-sm .dex-positivebutton-loader-circle {
  height: 16px;
  height: var(--dex-okd-positivebutton-sm-loader-width, 16px);
  width: 16px;
  width: var(--dex-okd-positivebutton-sm-loader-width, 16px)
}

.dex-positivebutton-sm .dex-positivebutton-icon {
  font-size: 16px;
  font-size: var(--dex-okd-positivebutton-sm-icon-size, 16px);
  font-weight: 400;
  font-weight: var(--dex-okd-positivebutton-sm-font-weight, 400)
}

.dex-positivebutton-sm .dex-positivebutton-icon-leading {
  margin-right: 6px;
  margin-right: var(--dex-okd-positivebutton-sm-icon-margin-right, 6px)
}

.dex-positivebutton-sm .dex-positivebutton-icon-tailing {
  margin-left: 6px;
  margin-left: var(--dex-okd-positivebutton-sm-icon-margin-right, 6px)
}

.dex-positivebutton-loading-text .dex-positivebutton-loader {
  margin-right: var(--dex-okd-positivebutton-sm-loader-margin-right, 6px)
}

.dex-positivebutton-md {
  font-size: 14px;
  font-size: var(--dex-okd-positivebutton-md-font-size, 14px);
  font-weight: 400;
  font-weight: var(--dex-okd-positivebutton-md-font-weight, 400);
  line-height: 16px;
  line-height: var(--dex-okd-positivebutton-md-line-height, 16px);
  min-width: 90px;
  min-width: var(--dex-okd-positivebutton-md-min-width, 90px);
  padding: 12px 16px;
  padding: var(--dex-okd-positivebutton-md-padding-vertical, 12px) var(--dex-okd-positivebutton-md-padding-horizontal, 16px)
}

.dex-positivebutton-md .dex-positivebutton-loader-circle {
  height: 16px;
  height: var(--dex-okd-positivebutton-md-loader-width, 16px);
  width: 16px;
  width: var(--dex-okd-positivebutton-md-loader-width, 16px)
}

.dex-positivebutton-md .dex-positivebutton-icon {
  font-size: 16px;
  font-size: var(--dex-okd-positivebutton-md-icon-size, 16px);
  font-weight: 400;
  font-weight: var(--dex-okd-positivebutton-md-font-weight, 400)
}

.dex-positivebutton-md .dex-positivebutton-icon-leading {
  margin-right: 6px;
  margin-right: var(--dex-okd-positivebutton-md-icon-margin-right, 6px)
}

.dex-positivebutton-md .dex-positivebutton-icon-tailing {
  margin-left: 6px;
  margin-left: var(--dex-okd-positivebutton-md-icon-margin-right, 6px)
}

.dex-positivebutton-loading-text .dex-positivebutton-loader {
  margin-right: 6px;
  margin-right: var(--dex-okd-positivebutton-md-loader-margin-right, 6px)
}

.dex-positivebutton-lg {
  font-size: 16px;
  font-size: var(--dex-okd-positivebutton-lg-font-size, 16px);
  font-weight: 500;
  font-weight: var(--dex-okd-positivebutton-lg-font-weight, 500);
  line-height: 20px;
  line-height: var(--dex-okd-positivebutton-lg-line-height, 20px);
  min-width: 108px;
  min-width: var(--dex-okd-positivebutton-lg-min-width, 108px);
  padding: 14px 24px;
  padding: var(--dex-okd-positivebutton-lg-padding-vertical, 14px) var(--dex-okd-positivebutton-lg-padding-horizontal, 24px)
}

.dex-positivebutton-lg .dex-positivebutton-loader-circle {
  height: 20px;
  height: var(--dex-okd-positivebutton-lg-loader-width, 20px);
  width: 20px;
  width: var(--dex-okd-positivebutton-lg-loader-width, 20px)
}

.dex-positivebutton-lg .dex-positivebutton-icon {
  font-size: 20px;
  font-size: var(--dex-okd-positivebutton-lg-icon-size, 20px);
  font-weight: 500;
  font-weight: var(--dex-okd-positivebutton-lg-font-weight, 500)
}

.dex-positivebutton-lg .dex-positivebutton-icon-leading {
  margin-right: 8px;
  margin-right: var(--dex-okd-positivebutton-lg-icon-margin-right, 8px)
}

.dex-positivebutton-lg .dex-positivebutton-icon-tailing {
  margin-left: 8px;
  margin-left: var(--dex-okd-positivebutton-lg-icon-margin-right, 8px)
}

.dex-positivebutton-loading-text .dex-positivebutton-loader {
  margin-right: var(--dex-okd-positivebutton-lg-loader-margin-right, 8px)
}

.dex-positivebutton-xl {
  font-size: 18px;
  font-size: var(--dex-okd-positivebutton-xl-font-size, 18px);
  font-weight: 500;
  font-weight: var(--dex-okd-positivebutton-xl-font-weight, 500);
  line-height: 24px;
  line-height: var(--dex-okd-positivebutton-xl-line-height, 24px);
  min-width: 126px;
  min-width: var(--dex-okd-positivebutton-xl-min-width, 126px);
  padding: 16px 44px;
  padding: var(--dex-okd-positivebutton-xl-padding-vertical, 16px) var(--dex-okd-positivebutton-xl-padding-horizontal, 44px)
}

.dex-positivebutton-xl .dex-positivebutton-loader-circle {
  height: 20px;
  height: var(--dex-okd-positivebutton-xl-loader-width, 20px);
  width: 20px;
  width: var(--dex-okd-positivebutton-xl-loader-width, 20px)
}

.dex-positivebutton-xl .dex-positivebutton-icon {
  font-size: 20px;
  font-size: var(--dex-okd-positivebutton-xl-icon-size, 20px);
  font-weight: 500;
  font-weight: var(--dex-okd-positivebutton-xl-font-weight, 500)
}

.dex-positivebutton-xl .dex-positivebutton-icon-leading {
  margin-right: 8px;
  margin-right: var(--dex-okd-positivebutton-xl-icon-margin-right, 8px)
}

.dex-positivebutton-xl .dex-positivebutton-icon-tailing {
  margin-left: 8px;
  margin-left: var(--dex-okd-positivebutton-xl-icon-margin-right, 8px)
}

.dex-positivebutton-loading-text .dex-positivebutton-loader {
  margin-right: 8px;
  margin-right: var(--dex-okd-positivebutton-xl-loader-margin-right, 8px)
}

.dex-positivebutton {
  align-items: center;
  background-color: var(--dex-okd-color-surface-pnl-profit-default);
  background-color: var(--dex-okd-positivebutton-default-background, var(--dex-okd-color-surface-pnl-profit-default));
  border-radius: 50px;
  border-radius: var(--dex-okd-positivebutton-border-radius, 50px);
  box-sizing: border-box;
  color: var(--dex-okd-color-content-pnl-profit-oncolor);
  color: var(--dex-okd-positivebutton-default-color, var(--dex-okd-color-content-pnl-profit-oncolor));
  cursor: pointer;
  display: inline-flex;
  justify-content: center;
  outline: none;
  position: relative;
  text-decoration: none;
  touch-action: manipulation;
  -webkit-user-select: none;
  -moz-user-select: none;
  -ms-user-select: none;
  user-select: none
}

.dex-positivebutton:focus-visible {
  border-radius: 50px;
  border-radius: var(--dex-okd-positivebutton-border-radius, 50px);
  outline: 2px solid var(--dex-okd-color-border-focus);
  outline-color: var(--dex-okd-color-border-focus);
  outline-offset: 2px;
  outline-style: solid;
  outline-width: 2px
}

.dex-positivebutton.hover,
.dex-positivebutton:not(.dex-positivebutton-disabled):not(.dex-positivebutton-loading):hover {
  background-color: var(--dex-okd-color-surface-pnl-profit-hovered);
  background-color: var(--dex-okd-positivebutton-hover-background, var(--dex-okd-color-surface-pnl-profit-hovered))
}

.dex-positivebutton.active,
.dex-positivebutton:not(.dex-positivebutton-disabled):not(.dex-positivebutton-loading):active {
  background-color: var(--dex-okd-color-surface-pnl-profit-pressed);
  background-color: var(--dex-okd-positivebutton-active-background, var(--dex-okd-color-surface-pnl-profit-pressed))
}

.dex-positivebutton-disabled,
.dex-positivebutton.disabled {
  background-color: var(--dex-okd-color-surface-interactive-disabled);
  background-color: var(--dex-okd-positivebutton-disabled-background, var(--dex-okd-color-surface-interactive-disabled));
  color: var(--dex-okd-color-content-interactive-disabled);
  color: var(--dex-okd-positivebutton-disabled-color, var(--dex-okd-color-content-interactive-disabled));
  cursor: not-allowed
}

.dex-positivebutton-loading,
.dex-positivebutton.loading {
  background-color: var(--dex-okd-color-surface-pnl-profit-pressed);
  background-color: var(--dex-okd-positivebutton-loading-background, var(--dex-okd-color-surface-pnl-profit-pressed));
  color: transparent
}

.dex-positivebutton-loading .dex-positivebutton-loader,
.dex-positivebutton.loading .dex-positivebutton-loader {
  display: flex;
  position: absolute
}

.dex-positivebutton-loading-text {
  background-color: var(--dex-okd-color-surface-pnl-profit-pressed);
  background-color: var(--dex-okd-positivebutton-loading-background, var(--dex-okd-color-surface-pnl-profit-pressed));
  display: flex
}

.dex-positivebutton-block,
.dex-positivebutton.block {
  display: flex;
  width: 100%
}

.dex-positivebutton-ellipsis {
  display: block;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  width: 100%
}

.dex-positivebutton-loader-circle {
  border-color: var(--dex-okd-positivebutton-loader-track-color, var(--dex-okd-color-content-pnl-profit-oncolor));
  border-top-color: var(--dex-okd-positivebutton-loader-mark-color, var(--dex-okd-color-border-pnl-profit-default));
  border-width: 2px;
  border-width: var(--dex-okd-positivebutton-loader-border-width, 2px)
}

@keyframes loadingCircle {
  0% {
    transform: rotate(0deg)
  }

  to {
    transform: rotate(1turn)
  }
}

.dex-switch {
  background: var(--dex-okd-switch-off-default-track-color);
  border: 0;
  border-radius: calc(var(--dex-okd-switch-md-height)/2);
  box-sizing: border-box;
  cursor: pointer;
  height: var(--dex-okd-switch-md-height);
  outline: none;
  position: relative;
  transition: left .36s;
  vertical-align: middle;
  width: var(--dex-okd-switch-md-width)
}

.dex-switch:focus-visible {
  outline: 2px solid var(--dex-okd-color-border-focus);
  outline-color: var(--dex-okd-color-border-focus);
  outline-offset: 2px;
  outline-style: solid;
  outline-width: 2px
}

.dex-switch-handler {
  align-items: center;
  background: var(--dex-okd-switch-off-default-handler-color);
  border-radius: 100%;
  box-shadow: var(--dex-okd-switch-off-default-handler-shadow);
  display: flex;
  height: var(--dex-okd-switch-md-handler-size);
  justify-content: center;
  left: calc((var(--dex-okd-switch-md-height) - var(--dex-okd-switch-md-handler-size))/2);
  position: absolute;
  top: calc((var(--dex-okd-switch-md-height) - var(--dex-okd-switch-md-handler-size))/2);
  transition: left .36s;
  width: var(--dex-okd-switch-md-handler-size)
}

.dex-switch .switch-handler-loader {
  height: calc(var(--dex-okd-switch-md-handler-size) - 6px);
  width: calc(var(--dex-okd-switch-md-handler-size) - 6px)
}

.dex-switch .switch-on-loader {
  border-color: var(--dex-okd-switch-on-loading-handler-color);
  border-top-color: var(--dex-okd-switch-on-loading-mark-color)
}

.dex-switch .switch-off-loader {
  border-color: var(--dex-okd-switch-off-loading-handler-color);
  border-top-color: var(--dex-okd-switch-off-loading-mark-color)
}

.dex-switch-label {
  color: var(--dex-okd-switch-label-font-color);
  font-family: inherit;
  font-size: var(--dex-okd-switch-md-label-size);
  font-weight: 500;
  margin-left: 18px;
  vertical-align: middle
}

.dex-switch-small {
  height: var(--dex-okd-switch-sm-height);
  width: var(--dex-okd-switch-sm-width)
}

.dex-switch.dex-switch-small .dex-switch-handler {
  height: var(--dex-okd-switch-sm-handler-size);
  width: var(--dex-okd-switch-sm-handler-size)
}

.dex-switch.dex-switch-small .switch-handler-loader {
  height: calc(var(--dex-okd-switch-sm-handler-size) - 2px);
  width: calc(var(--dex-okd-switch-sm-handler-size) - 2px)
}

.dex-switch-small+.dex-switch-label {
  font-size: var(--dex-okd-switch-sm-label-size)
}

.dex-switch.dex-switch-loading {
  background-color: var(--dex-okd-switch-off-loading-track-color);
  cursor: not-allowed
}

.dex-switch.dex-switch-select {
  background-color: var(--dex-okd-switch-on-default-track-color)
}

.dex-switch.dex-switch-select .dex-switch-handler {
  background: var(--dex-okd-switch-on-default-handler-color);
  box-shadow: var(--dex-okd-switch-on-default-handler-shadow);
  left: calc((var(--dex-okd-switch-md-height) - var(--dex-okd-switch-md-handler-size))/2 + var(--dex-okd-switch-md-width) - (var(--dex-okd-switch-md-height) - var(--dex-okd-switch-md-handler-size))/2*2 - var(--dex-okd-switch-md-handler-size))
}

.dex-switch.dex-switch-select.dex-switch-small .dex-switch-handler {
  left: calc((var(--dex-okd-switch-md-height) - var(--dex-okd-switch-md-handler-size))/2 + var(--dex-okd-switch-sm-width) - (var(--dex-okd-switch-sm-height) - var(--dex-okd-switch-sm-handler-size))/2*2 - var(--dex-okd-switch-sm-handler-size))
}

.dex-switch.dex-switch-select.dex-switch-loading {
  background-color: var(--dex-okd-switch-on-loading-track-color)
}

.dex-switch.dex-switch-disabled {
  background-color: var(--dex-okd-switch-off-disabled-track-color);
  cursor: not-allowed
}

.dex-switch.dex-switch-disabled .dex-switch-handler {
  background: var(--dex-okd-switch-off-disabled-handler-color);
  box-shadow: var(--dex-okd-switch-off-disabled-handler-shadow)
}

.dex-switch.dex-switch-select.dex-switch-disabled {
  background-color: var(--dex-okd-switch-on-disabled-track-color)
}

.dex-switch.dex-switch-select.dex-switch-disabled .dex-switch-handler {
  background: var(--dex-okd-switch-on-disabled-handler-color);
  box-shadow: var(--dex-okd-switch-on-disabled-handler-shadow)
}

.dex-switch-theme-icon.add-weight {
  color: var(--dex-okd-color-content-primary);
  color: var(--dex-okd-switch-theme-icon-color, var(--dex-okd-color-content-primary));
  font-size: 12px
}

.dex-virtual-list-empty {
  align-items: center;
  display: flex;
  height: 100%;
  justify-content: center
}

.dex-tabs-pane.dex-tabs-pane-outline-highlight {
  background-color: initial;
  background-color: var(--dex-okd-tabs-pane-outline-highlight-default-background-color, transparent);
  border-color: #dbdbdb;
  border-color: var(--dex-okd-tabs-pane-outline-highlight-default-border-color, #dbdbdb);
  border-style: solid;
  color: #929292;
  color: var(--dex-okd-tabs-pane-outline-highlight-default-text-color, #929292)
}

.dex-tabs-pane.dex-tabs-pane-outline-highlight.dex-tabs-active {
  background-color: initial;
  background-color: var(--dex-okd-tabs-pane-outline-highlight-active-background-color, transparent);
  border-color: #000;
  border-color: var(--dex-okd-tabs-pane-outline-highlight-active-border-color, #000);
  color: #000;
  color: var(--dex-okd-tabs-pane-outline-highlight-active-text-color, #000)
}

.dex-tabs-pane.dex-tabs-pane-outline-highlight.dex-tabs-active:focus-visible {
  outline: 2px solid var(--dex-okd-color-border-focus);
  outline-color: #000;
  outline-color: var(--dex-okd-tabs-pane-outline-highlight-active-text-color, #000);
  outline-offset: -4px;
  outline-style: solid;
  outline-width: 2px
}

.dex-tabs-pane.dex-tabs-pane-outline-highlight:hover:not(.dex-tabs-active) {
  background-color: initial;
  background-color: var(--dex-okd-tabs-pane-outline-highlight-hover-background-color, transparent);
  border-color: #dbdbdb;
  border-color: var(--dex-okd-tabs-pane-outline-highlight-hover-border-color, #dbdbdb);
  color: #000;
  color: var(--dex-okd-tabs-pane-outline-highlight-hover-text-color, #000)
}

.dex-tabs-pane.dex-tabs-pane-outline-primary {
  background-color: initial;
  background-color: var(--dex-okd-tabs-pane-outline-primary-default-background-color, transparent);
  border-color: transparent;
  border-color: var(--dex-okd-tabs-pane-outline-primary-default-border-color, transparent);
  border-style: solid;
  color: #929292;
  color: var(--dex-okd-tabs-pane-outline-primary-default-text-color, #929292)
}

.dex-tabs-pane.dex-tabs-pane-outline-primary.dex-tabs-active {
  background-color: initial;
  background-color: var(--dex-okd-tabs-pane-outline-primary-active-background-color, transparent);
  border-color: #000;
  border-color: var(--dex-okd-tabs-pane-outline-primary-active-border-color, #000);
  color: #000;
  color: var(--dex-okd-tabs-pane-outline-primary-active-text-color, #000)
}

.dex-tabs-pane.dex-tabs-pane-outline-primary.dex-tabs-active:focus-visible {
  outline: 2px solid var(--dex-okd-color-border-focus);
  outline-color: #000;
  outline-color: var(--dex-okd-tabs-pane-outline-primary-active-text-color, #000);
  outline-offset: -4px;
  outline-style: solid;
  outline-width: 2px
}

.dex-tabs-pane.dex-tabs-pane-outline-primary:hover:not(.dex-tabs-active) {
  background-color: initial;
  background-color: var(--dex-okd-tabs-pane-outline-primary-hover-background-color, transparent);
  border-color: transparent;
  border-color: var(--dex-okd-tabs-pane-outline-primary-hover-border-color, transparent);
  color: #000;
  color: var(--dex-okd-tabs-pane-outline-primary-hover-text-color, #000)
}

.dex-tabs-pane.dex-tabs-pane-outline-secondary {
  background-color: initial;
  background-color: var(--dex-okd-tabs-pane-outline-secondary-default-background-color, transparent);
  border-color: #000;
  border-color: var(--dex-okd-tabs-pane-outline-secondary-default-border-color, #000);
  border-style: solid;
  color: #fff;
  color: var(--dex-okd-tabs-pane-outline-secondary-default-text-color, #fff)
}

.dex-tabs-pane.dex-tabs-pane-outline-secondary.dex-tabs-active {
  background-color: initial;
  background-color: var(--dex-okd-tabs-pane-outline-secondary-active-background-color, transparent);
  border-color: #000;
  border-color: var(--dex-okd-tabs-pane-outline-secondary-active-border-color, #000);
  color: #fff;
  color: var(--dex-okd-tabs-pane-outline-secondary-active-text-color, #fff)
}

.dex-tabs-pane.dex-tabs-pane-outline-secondary.dex-tabs-active:focus-visible {
  outline: 2px solid var(--dex-okd-color-border-focus);
  outline-color: #fff;
  outline-color: var(--dex-okd-tabs-pane-outline-secondary-active-text-color, #fff);
  outline-offset: -4px;
  outline-style: solid;
  outline-width: 2px
}

.dex-tabs-pane.dex-tabs-pane-outline-secondary:hover:not(.dex-tabs-active) {
  background-color: initial;
  background-color: var(--dex-okd-tabs-pane-outline-secondary-hover-background-color, transparent);
  border-color: #000;
  border-color: var(--dex-okd-tabs-pane-outline-secondary-hover-border-color, #000);
  color: #fff;
  color: var(--dex-okd-tabs-pane-outline-secondary-hover-text-color, #fff)
}

.dex-tabs-pane.dex-tabs-pane-outline-reversed {
  background-color: #f7f7f7;
  background-color: var(--dex-okd-tabs-pane-outline-reversed-default-background-color, #f7f7f7);
  border-color: #f7f7f7;
  border-color: var(--dex-okd-tabs-pane-outline-reversed-default-border-color, #f7f7f7);
  border-style: solid;
  color: #3d3d3d;
  color: var(--dex-okd-tabs-pane-outline-reversed-default-text-color, #3d3d3d)
}

.dex-tabs-pane.dex-tabs-pane-outline-reversed:focus-visible {
  outline: 2px solid var(--dex-okd-color-border-focus);
  outline-color: #fff;
  outline-color: var(--dex-okd-tabs-pane-outline-reversed-active-text-color, #fff);
  outline-offset: -4px;
  outline-style: solid;
  outline-width: 2px
}

.dex-tabs-pane.dex-tabs-pane-outline-reversed.dex-tabs-active {
  background-color: #000;
  background-color: var(--dex-okd-tabs-pane-outline-reversed-active-background-color, #000);
  border-color: #000;
  border-color: var(--dex-okd-tabs-pane-outline-reversed-active-border-color, #000);
  color: #fff;
  color: var(--dex-okd-tabs-pane-outline-reversed-active-text-color, #fff)
}

.dex-tabs-pane.dex-tabs-pane-outline-reversed.dex-tabs-active:focus-visible {
  outline: 2px solid var(--dex-okd-color-border-focus);
  outline-color: #fff;
  outline-color: var(--dex-okd-tabs-pane-outline-reversed-active-text-color, #fff);
  outline-offset: -4px;
  outline-style: solid;
  outline-width: 2px
}

.dex-tabs-pane.dex-tabs-pane-outline-reversed:hover:not(.dex-tabs-active) {
  background-color: #ebebeb;
  background-color: var(--dex-okd-tabs-pane-outline-reversed-hover-background-color, #ebebeb);
  border-color: #ebebeb;
  border-color: var(--dex-okd-tabs-pane-outline-reversed-hover-border-color, #ebebeb);
  color: #3d3d3d;
  color: var(--dex-okd-tabs-pane-outline-reversed-hover-text-color, #3d3d3d)
}

.dex-tabs-pane.dex-tabs-pane-fill-highlight {
  background-color: #f7f7f7;
  background-color: var(--dex-okd-tabs-pane-fill-highlight-default-background-color, #f7f7f7);
  border-color: #f7f7f7;
  border-color: var(--dex-okd-tabs-pane-fill-highlight-default-border-color, #f7f7f7);
  border-style: solid;
  color: #3d3d3d;
  color: var(--dex-okd-tabs-pane-fill-highlight-default-text-color, #3d3d3d)
}

.dex-tabs-pane.dex-tabs-pane-fill-highlight.dex-tabs-active {
  background-color: #000;
  background-color: var(--dex-okd-tabs-pane-fill-highlight-active-background-color, #000);
  border-color: #000;
  border-color: var(--dex-okd-tabs-pane-fill-highlight-active-border-color, #000);
  color: #fff;
  color: var(--dex-okd-tabs-pane-fill-highlight-active-text-color, #fff)
}

.dex-tabs-pane.dex-tabs-pane-fill-highlight.dex-tabs-active:focus-visible {
  outline: 2px solid var(--dex-okd-color-border-focus);
  outline-color: #fff;
  outline-color: var(--dex-okd-tabs-pane-fill-highlight-active-text-color, #fff);
  outline-offset: -4px;
  outline-style: solid;
  outline-width: 2px
}

.dex-tabs-pane.dex-tabs-pane-fill-highlight:hover:not(.dex-tabs-active) {
  background-color: #ebebeb;
  background-color: var(--dex-okd-tabs-pane-fill-highlight-hover-background-color, #ebebeb);
  border-color: #ebebeb;
  border-color: var(--dex-okd-tabs-pane-fill-highlight-hover-border-color, #ebebeb);
  color: #3d3d3d;
  color: var(--dex-okd-tabs-pane-fill-highlight-hover-text-color, #3d3d3d)
}

.dex-tabs-pane.dex-tabs-pane-fill-primary {
  background-color: #f7f7f7;
  background-color: var(--dex-okd-tabs-pane-fill-primary-default-background-color, #f7f7f7);
  border-color: #f7f7f7;
  border-color: var(--dex-okd-tabs-pane-fill-primary-default-border-color, #f7f7f7);
  border-style: solid;
  color: #929292;
  color: var(--dex-okd-tabs-pane-fill-primary-default-text-color, #929292)
}

.dex-tabs-pane.dex-tabs-pane-fill-primary.dex-tabs-active {
  background-color: #f7f7f7;
  background-color: var(--dex-okd-tabs-pane-fill-primary-active-background-color, #f7f7f7);
  border-color: #f7f7f7;
  border-color: var(--dex-okd-tabs-pane-fill-primary-active-border-color, #f7f7f7);
  color: #000;
  color: var(--dex-okd-tabs-pane-fill-primary-active-text-color, #000)
}

.dex-tabs-pane.dex-tabs-pane-fill-primary.dex-tabs-active:focus-visible {
  outline: 2px solid var(--dex-okd-color-border-focus);
  outline-color: #000;
  outline-color: var(--dex-okd-tabs-pane-fill-primary-active-text-color, #000);
  outline-offset: -4px;
  outline-style: solid;
  outline-width: 2px
}

.dex-tabs-pane.dex-tabs-pane-fill-primary:hover:not(.dex-tabs-active) {
  background-color: #ebebeb;
  background-color: var(--dex-okd-tabs-pane-fill-primary-hover-background-color, #ebebeb);
  border-color: #ebebeb;
  border-color: var(--dex-okd-tabs-pane-fill-primary-hover-border-color, #ebebeb);
  color: #000;
  color: var(--dex-okd-tabs-pane-fill-primary-hover-text-color, #000)
}

.dex-tabs-pane.dex-tabs-pane-fill-secondary {
  background-color: initial;
  background-color: var(--dex-okd-tabs-pane-fill-secondary-default-background-color, transparent);
  border-color: transparent;
  border-color: var(--dex-okd-tabs-pane-fill-secondary-default-border-color, transparent);
  border-style: solid;
  color: #929292;
  color: var(--dex-okd-tabs-pane-fill-secondary-default-text-color, #929292)
}

.dex-tabs-pane.dex-tabs-pane-fill-secondary.dex-tabs-active {
  background-color: #f7f7f7;
  background-color: var(--dex-okd-tabs-pane-fill-secondary-active-background-color, #f7f7f7);
  border-color: #f7f7f7;
  border-color: var(--dex-okd-tabs-pane-fill-secondary-active-border-color, #f7f7f7);
  color: #000;
  color: var(--dex-okd-tabs-pane-fill-secondary-active-text-color, #000)
}

.dex-tabs-pane.dex-tabs-pane-fill-secondary.dex-tabs-active:focus-visible {
  outline: 2px solid var(--dex-okd-color-border-focus);
  outline-color: #000;
  outline-color: var(--dex-okd-tabs-pane-fill-secondary-active-text-color, #000);
  outline-offset: -4px;
  outline-style: solid;
  outline-width: 2px
}

.dex-tabs-pane.dex-tabs-pane-fill-secondary:hover:not(.dex-tabs-active) {
  background-color: initial;
  background-color: var(--dex-okd-tabs-pane-fill-secondary-hover-background-color, transparent);
  border-color: transparent;
  border-color: var(--dex-okd-tabs-pane-fill-secondary-hover-border-color, transparent);
  color: #000;
  color: var(--dex-okd-tabs-pane-fill-secondary-hover-text-color, #000)
}

.dex-tabs-pane.dex-tabs-pane-fill-reversed {
  background-color: #f7f7f7;
  background-color: var(--dex-okd-tabs-pane-fill-reversed-default-background-color, #f7f7f7);
  border-color: #f7f7f7;
  border-color: var(--dex-okd-tabs-pane-fill-reversed-default-border-color, #f7f7f7);
  border-style: solid;
  color: #3d3d3d;
  color: var(--dex-okd-tabs-pane-fill-reversed-default-text-color, #3d3d3d)
}

.dex-tabs-pane.dex-tabs-pane-fill-reversed:focus-visible {
  outline: 2px solid var(--dex-okd-color-border-focus);
  outline-color: #fff;
  outline-color: var(--dex-okd-tabs-pane-fill-reversed-active-text-color, #fff);
  outline-offset: -4px;
  outline-style: solid;
  outline-width: 2px
}

.dex-tabs-pane.dex-tabs-pane-fill-reversed.dex-tabs-active {
  background-color: #000;
  background-color: var(--dex-okd-tabs-pane-fill-reversed-active-background-color, #000);
  border-color: #000;
  border-color: var(--dex-okd-tabs-pane-fill-reversed-active-border-color, #000);
  color: #fff;
  color: var(--dex-okd-tabs-pane-fill-reversed-active-text-color, #fff)
}

.dex-tabs-pane.dex-tabs-pane-fill-reversed.dex-tabs-active:focus-visible {
  outline: 2px solid var(--dex-okd-color-border-focus);
  outline-color: #fff;
  outline-color: var(--dex-okd-tabs-pane-fill-reversed-active-text-color, #fff);
  outline-offset: -4px;
  outline-style: solid;
  outline-width: 2px
}

.dex-tabs-pane.dex-tabs-pane-fill-reversed:hover:not(.dex-tabs-active) {
  background-color: #ebebeb;
  background-color: var(--dex-okd-tabs-pane-fill-reversed-hover-background-color, #ebebeb);
  border-color: #ebebeb;
  border-color: var(--dex-okd-tabs-pane-fill-reversed-hover-border-color, #ebebeb);
  color: #3d3d3d;
  color: var(--dex-okd-tabs-pane-fill-reversed-hover-text-color, #3d3d3d)
}

.dex-tabs-pane.dex-tabs-pane-text-highlight {
  background-color: initial;
  background-color: var(--dex-okd-tabs-pane-text-highlight-default-background-color, transparent);
  border-color: transparent;
  border-color: var(--dex-okd-tabs-pane-text-highlight-default-border-color, transparent);
  border-style: solid;
  color: #929292;
  color: var(--dex-okd-tabs-pane-text-highlight-default-text-color, #929292)
}

.dex-tabs-pane.dex-tabs-pane-text-highlight.dex-tabs-active {
  background-color: initial;
  background-color: var(--dex-okd-tabs-pane-text-highlight-active-background-color, transparent);
  border-color: transparent;
  border-color: var(--dex-okd-tabs-pane-text-highlight-active-border-color, transparent);
  color: #000;
  color: var(--dex-okd-tabs-pane-text-highlight-active-text-color, #000)
}

.dex-tabs-pane.dex-tabs-pane-text-highlight.dex-tabs-active:focus-visible {
  outline: 2px solid var(--dex-okd-color-border-focus);
  outline-color: #000;
  outline-color: var(--dex-okd-tabs-pane-text-highlight-active-text-color, #000);
  outline-offset: -4px;
  outline-style: solid;
  outline-width: 2px
}

.dex-tabs-pane.dex-tabs-pane-text-highlight:hover:not(.dex-tabs-active) {
  background-color: initial;
  background-color: var(--dex-okd-tabs-pane-text-highlight-hover-background-color, transparent);
  border-color: transparent;
  border-color: var(--dex-okd-tabs-pane-text-highlight-hover-border-color, transparent);
  color: #000;
  color: var(--dex-okd-tabs-pane-text-highlight-hover-text-color, #000)
}

.dex-tabs-pane.dex-tabs-pane-text-primary {
  background-color: initial;
  background-color: var(--dex-okd-tabs-pane-text-primary-default-background-color, transparent);
  border-color: #000;
  border-color: var(--dex-okd-tabs-pane-text-primary-default-border-color, #000);
  border-style: solid;
  color: #fff;
  color: var(--dex-okd-tabs-pane-text-primary-default-text-color, #fff)
}

.dex-tabs-pane.dex-tabs-pane-text-primary.dex-tabs-active {
  background-color: initial;
  background-color: var(--dex-okd-tabs-pane-text-primary-active-background-color, transparent);
  border-color: #000;
  border-color: var(--dex-okd-tabs-pane-text-primary-active-border-color, #000);
  color: #fff;
  color: var(--dex-okd-tabs-pane-text-primary-active-text-color, #fff)
}

.dex-tabs-pane.dex-tabs-pane-text-primary.dex-tabs-active:focus-visible {
  outline: 2px solid var(--dex-okd-color-border-focus);
  outline-color: #fff;
  outline-color: var(--dex-okd-tabs-pane-text-primary-active-text-color, #fff);
  outline-offset: -4px;
  outline-style: solid;
  outline-width: 2px
}

.dex-tabs-pane.dex-tabs-pane-text-primary:hover:not(.dex-tabs-active) {
  background-color: initial;
  background-color: var(--dex-okd-tabs-pane-text-primary-hover-background-color, transparent);
  border-color: #000;
  border-color: var(--dex-okd-tabs-pane-text-primary-hover-border-color, #000);
  color: #fff;
  color: var(--dex-okd-tabs-pane-text-primary-hover-text-color, #fff)
}

.dex-tabs-pane.dex-tabs-pane-text-secondary {
  background-color: initial;
  background-color: var(--dex-okd-tabs-pane-text-secondary-default-background-color, transparent);
  border-color: #000;
  border-color: var(--dex-okd-tabs-pane-text-secondary-default-border-color, #000);
  border-style: solid;
  color: #fff;
  color: var(--dex-okd-tabs-pane-text-secondary-default-text-color, #fff)
}

.dex-tabs-pane.dex-tabs-pane-text-secondary.dex-tabs-active {
  background-color: initial;
  background-color: var(--dex-okd-tabs-pane-text-secondary-active-background-color, transparent);
  border-color: #000;
  border-color: var(--dex-okd-tabs-pane-text-secondary-active-border-color, #000);
  color: #fff;
  color: var(--dex-okd-tabs-pane-text-secondary-active-text-color, #fff)
}

.dex-tabs-pane.dex-tabs-pane-text-secondary.dex-tabs-active:focus-visible {
  outline: 2px solid var(--dex-okd-color-border-focus);
  outline-color: #fff;
  outline-color: var(--dex-okd-tabs-pane-text-secondary-active-text-color, #fff);
  outline-offset: -4px;
  outline-style: solid;
  outline-width: 2px
}

.dex-tabs-pane.dex-tabs-pane-text-secondary:hover:not(.dex-tabs-active) {
  background-color: initial;
  background-color: var(--dex-okd-tabs-pane-text-secondary-hover-background-color, transparent);
  border-color: #000;
  border-color: var(--dex-okd-tabs-pane-text-secondary-hover-border-color, #000);
  color: #fff;
  color: var(--dex-okd-tabs-pane-text-secondary-hover-text-color, #fff)
}

.dex-tabs-pane.dex-tabs-pane-text-reversed {
  background-color: #f7f7f7;
  background-color: var(--dex-okd-tabs-pane-text-reversed-default-background-color, #f7f7f7);
  border-color: #f7f7f7;
  border-color: var(--dex-okd-tabs-pane-text-reversed-default-border-color, #f7f7f7);
  border-style: solid;
  color: #3d3d3d;
  color: var(--dex-okd-tabs-pane-text-reversed-default-text-color, #3d3d3d)
}

.dex-tabs-pane.dex-tabs-pane-text-reversed:focus-visible {
  outline: 2px solid var(--dex-okd-color-border-focus);
  outline-color: #fff;
  outline-color: var(--dex-okd-tabs-pane-text-reversed-active-text-color, #fff);
  outline-offset: -4px;
  outline-style: solid;
  outline-width: 2px
}

.dex-tabs-pane.dex-tabs-pane-text-reversed.dex-tabs-active {
  background-color: #000;
  background-color: var(--dex-okd-tabs-pane-text-reversed-active-background-color, #000);
  border-color: #000;
  border-color: var(--dex-okd-tabs-pane-text-reversed-active-border-color, #000);
  color: #fff;
  color: var(--dex-okd-tabs-pane-text-reversed-active-text-color, #fff)
}

.dex-tabs-pane.dex-tabs-pane-text-reversed.dex-tabs-active:focus-visible {
  outline: 2px solid var(--dex-okd-color-border-focus);
  outline-color: #fff;
  outline-color: var(--dex-okd-tabs-pane-text-reversed-active-text-color, #fff);
  outline-offset: -4px;
  outline-style: solid;
  outline-width: 2px
}

.dex-tabs-pane.dex-tabs-pane-text-reversed:hover:not(.dex-tabs-active) {
  background-color: #ebebeb;
  background-color: var(--dex-okd-tabs-pane-text-reversed-hover-background-color, #ebebeb);
  border-color: #ebebeb;
  border-color: var(--dex-okd-tabs-pane-text-reversed-hover-border-color, #ebebeb);
  color: #3d3d3d;
  color: var(--dex-okd-tabs-pane-text-reversed-hover-text-color, #3d3d3d)
}

.dex-tabs-pane-xxs.category-size {
  border-radius: 4px;
  border-radius: var(--dex-okd-tabs-pane-xxs-border-radius, 4px);
  border-width: 1px;
  border-width: var(--dex-okd-tabs-pane-xxs-border-width, 1px);
  font-size: 12px;
  font-size: var(--dex-okd-tabs-pane-xxs-font-size, 12px);
  font-weight: 400;
  font-weight: var(--dex-okd-tabs-pane-xxs-font-weight, 400);
  height: 24px;
  height: var(--dex-okd-tabs-pane-xxs-height, 24px);
  margin-right: 8px;
  margin-right: var(--dex-okd-tabs-pane-xxs-margin-right, 8px);
  padding: 0 8px;
  padding: 0 var(--dex-okd-tabs-pane-xxs-padding-vertical, 8px)
}

.dex-tabs-pane-xxs.category-size:last-child {
  margin-right: 0
}

.dex-tabs-pane-xxs.category-size.dex-tabs-active {
  font-weight: 500;
  font-weight: var(--dex-okd-tabs-pane-xxs-active-font-weight, 500)
}

.dex-tabs-pane-xxs.category-size:hover:not(.dex-tabs-active) {
  font-weight: 500;
  font-weight: var(--dex-okd-tabs-pane-xxs-hover-font-weight, 500)
}

.dex-tabs-pane-xxs.category-size.dex-tabs-pane-circle {
  border-radius: 12px;
  border-radius: calc(var(--dex-okd-tabs-pane-xxs-height, 24px)/2)
}

.dex-tabs-pane-xs.category-size {
  border-radius: 4px;
  border-radius: var(--dex-okd-tabs-pane-xs-border-radius, 4px);
  border-width: 1px;
  border-width: var(--dex-okd-tabs-pane-xs-border-width, 1px);
  font-size: 12px;
  font-size: var(--dex-okd-tabs-pane-xs-font-size, 12px);
  font-weight: 400;
  font-weight: var(--dex-okd-tabs-pane-xs-font-weight, 400);
  height: 24px;
  height: var(--dex-okd-tabs-pane-xs-height, 24px);
  margin-right: 8px;
  margin-right: var(--dex-okd-tabs-pane-xs-margin-right, 8px);
  padding: 0 8px;
  padding: 0 var(--dex-okd-tabs-pane-xs-padding-vertical, 8px)
}

.dex-tabs-pane-xs.category-size:last-child {
  margin-right: 0
}

.dex-tabs-pane-xs.category-size.dex-tabs-active {
  font-weight: 500;
  font-weight: var(--dex-okd-tabs-pane-xs-active-font-weight, 500)
}

.dex-tabs-pane-xs.category-size:hover:not(.dex-tabs-active) {
  font-weight: 500;
  font-weight: var(--dex-okd-tabs-pane-xs-hover-font-weight, 500)
}

.dex-tabs-pane-xs.category-size.dex-tabs-pane-circle {
  border-radius: 12px;
  border-radius: calc(var(--dex-okd-tabs-pane-xs-height, 24px)/2)
}

.dex-tabs-pane-sm.category-size {
  border-radius: 4px;
  border-radius: var(--dex-okd-tabs-pane-sm-border-radius, 4px);
  border-width: 1px;
  border-width: var(--dex-okd-tabs-pane-sm-border-width, 1px);
  font-size: 12px;
  font-size: var(--dex-okd-tabs-pane-sm-font-size, 12px);
  font-weight: 400;
  font-weight: var(--dex-okd-tabs-pane-sm-font-weight, 400);
  height: 28px;
  height: var(--dex-okd-tabs-pane-sm-height, 28px);
  margin-right: 8px;
  margin-right: var(--dex-okd-tabs-pane-sm-margin-right, 8px);
  padding: 0 8px;
  padding: 0 var(--dex-okd-tabs-pane-sm-padding-vertical, 8px)
}

.dex-tabs-pane-sm.category-size:last-child {
  margin-right: 0
}

.dex-tabs-pane-sm.category-size.dex-tabs-active {
  font-weight: 500;
  font-weight: var(--dex-okd-tabs-pane-sm-active-font-weight, 500)
}

.dex-tabs-pane-sm.category-size:hover:not(.dex-tabs-active) {
  font-weight: 500;
  font-weight: var(--dex-okd-tabs-pane-sm-hover-font-weight, 500)
}

.dex-tabs-pane-sm.category-size.dex-tabs-pane-circle {
  border-radius: 14px;
  border-radius: calc(var(--dex-okd-tabs-pane-sm-height, 28px)/2)
}

.dex-tabs-pane-md.category-size {
  border-radius: 6px;
  border-radius: var(--dex-okd-tabs-pane-md-border-radius, 6px);
  border-width: 1px;
  border-width: var(--dex-okd-tabs-pane-md-border-width, 1px);
  font-size: 14px;
  font-size: var(--dex-okd-tabs-pane-md-font-size, 14px);
  font-weight: 400;
  font-weight: var(--dex-okd-tabs-pane-md-font-weight, 400);
  height: 32px;
  height: var(--dex-okd-tabs-pane-md-height, 32px);
  margin-right: 8px;
  margin-right: var(--dex-okd-tabs-pane-md-margin-right, 8px);
  padding: 0 8px;
  padding: 0 var(--dex-okd-tabs-pane-md-padding-vertical, 8px)
}

.dex-tabs-pane-md.category-size:last-child {
  margin-right: 0
}

.dex-tabs-pane-md.category-size.dex-tabs-active {
  font-weight: 500;
  font-weight: var(--dex-okd-tabs-pane-md-active-font-weight, 500)
}

.dex-tabs-pane-md.category-size:hover:not(.dex-tabs-active) {
  font-weight: 500;
  font-weight: var(--dex-okd-tabs-pane-md-hover-font-weight, 500)
}

.dex-tabs-pane-md.category-size.dex-tabs-pane-circle {
  border-radius: 16px;
  border-radius: calc(var(--dex-okd-tabs-pane-md-height, 32px)/2)
}

.dex-tabs-pane-lg.category-size {
  border-radius: 6px;
  border-radius: var(--dex-okd-tabs-pane-lg-border-radius, 6px);
  border-width: 1px;
  border-width: var(--dex-okd-tabs-pane-lg-border-width, 1px);
  font-size: 14px;
  font-size: var(--dex-okd-tabs-pane-lg-font-size, 14px);
  font-weight: 400;
  font-weight: var(--dex-okd-tabs-pane-lg-font-weight, 400);
  height: 36px;
  height: var(--dex-okd-tabs-pane-lg-height, 36px);
  margin-right: 8px;
  margin-right: var(--dex-okd-tabs-pane-lg-margin-right, 8px);
  padding: 0 12px;
  padding: 0 var(--dex-okd-tabs-pane-lg-padding-vertical, 12px)
}

.dex-tabs-pane-lg.category-size:last-child {
  margin-right: 0
}

.dex-tabs-pane-lg.category-size.dex-tabs-active {
  font-weight: 500;
  font-weight: var(--dex-okd-tabs-pane-lg-active-font-weight, 500)
}

.dex-tabs-pane-lg.category-size:hover:not(.dex-tabs-active) {
  font-weight: 500;
  font-weight: var(--dex-okd-tabs-pane-lg-hover-font-weight, 500)
}

.dex-tabs-pane-lg.category-size.dex-tabs-pane-circle {
  border-radius: 18px;
  border-radius: calc(var(--dex-okd-tabs-pane-lg-height, 36px)/2)
}

.dex-tabs-pane-xl.category-size {
  border-radius: 8px;
  border-radius: var(--dex-okd-tabs-pane-xl-border-radius, 8px);
  border-width: 1px;
  border-width: var(--dex-okd-tabs-pane-xl-border-width, 1px);
  font-size: 14px;
  font-size: var(--dex-okd-tabs-pane-xl-font-size, 14px);
  font-weight: 400;
  font-weight: var(--dex-okd-tabs-pane-xl-font-weight, 400);
  height: 40px;
  height: var(--dex-okd-tabs-pane-xl-height, 40px);
  margin-right: 8px;
  margin-right: var(--dex-okd-tabs-pane-xl-margin-right, 8px);
  padding: 0 16px;
  padding: 0 var(--dex-okd-tabs-pane-xl-padding-vertical, 16px)
}

.dex-tabs-pane-xl.category-size:last-child {
  margin-right: 0
}

.dex-tabs-pane-xl.category-size.dex-tabs-active {
  font-weight: 500;
  font-weight: var(--dex-okd-tabs-pane-xl-active-font-weight, 500)
}

.dex-tabs-pane-xl.category-size:hover:not(.dex-tabs-active) {
  font-weight: 500;
  font-weight: var(--dex-okd-tabs-pane-xl-hover-font-weight, 500)
}

.dex-tabs-pane-xl.category-size.dex-tabs-pane-circle {
  border-radius: 20px;
  border-radius: calc(var(--dex-okd-tabs-pane-xl-height, 40px)/2)
}

.dex-tabs-pane-xxl.category-size {
  border-radius: 8px;
  border-radius: var(--dex-okd-tabs-pane-xxl-border-radius, 8px);
  border-width: 1px;
  border-width: var(--dex-okd-tabs-pane-xxl-border-width, 1px);
  font-size: 16px;
  font-size: var(--dex-okd-tabs-pane-xxl-font-size, 16px);
  font-weight: 400;
  font-weight: var(--dex-okd-tabs-pane-xxl-font-weight, 400);
  height: 44px;
  height: var(--dex-okd-tabs-pane-xxl-height, 44px);
  margin-right: 8px;
  margin-right: var(--dex-okd-tabs-pane-xxl-margin-right, 8px);
  padding: 0 16px;
  padding: 0 var(--dex-okd-tabs-pane-xxl-padding-vertical, 16px)
}

.dex-tabs-pane-xxl.category-size:last-child {
  margin-right: 0
}

.dex-tabs-pane-xxl.category-size.dex-tabs-active {
  font-weight: 500;
  font-weight: var(--dex-okd-tabs-pane-xxl-active-font-weight, 500)
}

.dex-tabs-pane-xxl.category-size:hover:not(.dex-tabs-active) {
  font-weight: 500;
  font-weight: var(--dex-okd-tabs-pane-xxl-hover-font-weight, 500)
}

.dex-tabs-pane-xxl.category-size.dex-tabs-pane-circle {
  border-radius: 22px;
  border-radius: calc(var(--dex-okd-tabs-pane-xxl-height, 44px)/2)
}

.dex-tabs-pane-xxxl.category-size {
  border-radius: 10px;
  border-radius: var(--dex-okd-tabs-pane-xxxl-border-radius, 10px);
  border-width: 1px;
  border-width: var(--dex-okd-tabs-pane-xxxl-border-width, 1px);
  font-size: 18px;
  font-size: var(--dex-okd-tabs-pane-xxxl-font-size, 18px);
  font-weight: 400;
  font-weight: var(--dex-okd-tabs-pane-xxxl-font-weight, 400);
  height: 50px;
  height: var(--dex-okd-tabs-pane-xxxl-height, 50px);
  margin-right: 8px;
  margin-right: var(--dex-okd-tabs-pane-xxxl-margin-right, 8px);
  padding: 0 16px;
  padding: 0 var(--dex-okd-tabs-pane-xxxl-padding-vertical, 16px)
}

.dex-tabs-pane-xxxl.category-size:last-child {
  margin-right: 0
}

.dex-tabs-pane-xxxl.category-size.dex-tabs-active {
  font-weight: 500;
  font-weight: var(--dex-okd-tabs-pane-xxxl-active-font-weight, 500)
}

.dex-tabs-pane-xxxl.category-size:hover:not(.dex-tabs-active) {
  font-weight: 500;
  font-weight: var(--dex-okd-tabs-pane-xxxl-hover-font-weight, 500)
}

.dex-tabs-pane-xxxl.category-size.dex-tabs-pane-circle {
  border-radius: 25px;
  border-radius: calc(var(--dex-okd-tabs-pane-xxxl-height, 50px)/2)
}

.dex-tabs-pane-xxs:last-child {
  margin-right: 0 !important
}

.dex-tabs-pane-xxs.dex-tabs-pane-underline {
  font-size: var(--dex-okd-tabs-xxs-underline-font-size);
  font-weight: 400;
  font-weight: var(--dex-okd-tabs-xxs-underline-font-weight, 400);
  margin-right: var(--dex-okd-tabs-xxs-underline-spacing);
  padding: 0 var(--dex-okd-tabs-xxs-underline-label-padding)
}

.dex-tabs-pane-xxs.dex-tabs-pane-underline.dex-tabs-pane-circle {
  border-radius: calc(var(--dex-okd-tabs-xxs-underline-height)/2)
}

.dex-tabs-pane-xxs.dex-tabs-pane-underline-active {
  font-weight: 400;
  font-weight: var(--dex-okd-tabs-xxs-underline-active-font-weight, 400)
}

.dex-tabs-pane-xxs.dex-tabs-pane-button {
  border-radius: 4px;
  border-radius: var(--dex-okd-tabs-xxs-button-border-radius, 4px);
  font-size: var(--dex-okd-tabs-xxs-button-font-size);
  font-weight: var(--dex-okd-tabs-xxs-button-font-weight);
  margin-right: var(--dex-okd-tabs-xxs-button-spacing);
  padding: 0 var(--dex-okd-tabs-xxs-button-label-padding)
}

.dex-tabs-pane-xxs.dex-tabs-pane-button.dex-tabs-pane-circle {
  border-radius: calc(var(--dex-okd-tabs-xxs-button-height)/2)
}

.dex-tabs-pane-xxs.dex-tabs-pane-button-active {
  font-weight: 400;
  font-weight: var(--dex-okd-tabs-xxs-button-active-font-weight, 400)
}

.dex-tabs-pane-xxs.dex-tabs-pane-muted {
  border-radius: 4px;
  border-radius: var(--dex-okd-tabs-xxs-muted-border-radius, 4px);
  font-size: var(--dex-okd-tabs-xxs-muted-font-size);
  font-weight: var(--dex-okd-tabs-xxs-muted-font-weight);
  margin-right: var(--dex-okd-tabs-xxs-muted-spacing);
  padding: 0 var(--dex-okd-tabs-xxs-muted-label-padding)
}

.dex-tabs-pane-xxs.dex-tabs-pane-muted.dex-tabs-pane-circle {
  border-radius: calc(var(--dex-okd-tabs-xxs-muted-height)/2)
}

.dex-tabs-pane-xxs.dex-tabs-pane-muted-active {
  font-weight: 400;
  font-weight: var(--dex-okd-tabs-xxs-muted-active-font-weight, 400)
}

.dex-tabs-pane-xxs.dex-tabs-pane-segmented {
  border-radius: 4px;
  border-radius: var(--dex-okd-tabs-xxs-segmented-border-radius, 4px);
  font-size: var(--dex-okd-tabs-xxs-segmented-font-size);
  font-weight: var(--dex-okd-tabs-xxs-segmented-font-weight);
  margin-right: var(--dex-okd-tabs-xxs-segmented-spacing);
  padding: 0 var(--dex-okd-tabs-xxs-segmented-label-padding)
}

.dex-tabs-pane-xxs.dex-tabs-pane-segmented-active {
  font-weight: 400;
  font-weight: var(--dex-okd-tabs-xxs-segmented-active-font-weight, 400)
}

.dex-tabs-pane-xxs.dex-tabs-pane-segmented.dex-tabs-pane-circle {
  border-radius: calc(var(--dex-okd-tabs-xxs-segmented-height)/2)
}

.dex-tabs-pane-list-xxs .dex-tabs-pane-list-nav-icon .icon {
  font-size: var(--dex-okd-tabs-xxs-common-icon-size)
}

.dex-tabs-pane-list-xxs.dex-tabs-pane-list-underline {
  font-size: var(--dex-okd-tabs-xxs-underline-font-size);
  height: var(--dex-okd-tabs-xxs-underline-height)
}

.dex-tabs-pane-list-xxs.dex-tabs-pane-list-underline .dex-tabs-pane-list-circle {
  border-radius: calc(var(--dex-okd-tabs-xxs-underline-height)/2)
}

.dex-tabs-pane-list-xxs.dex-tabs-pane-list-button {
  font-size: var(--dex-okd-tabs-xxs-button-font-size);
  height: var(--dex-okd-tabs-xxs-button-height);
  line-height: var(--dex-okd-tabs-xxs-button-height)
}

.dex-tabs-pane-list-xxs.dex-tabs-pane-list-button .dex-tabs-pane-list-container {
  border-radius: 4px;
  border-radius: var(--dex-okd-tabs-xxs-button-container-border-radius, 4px)
}

.dex-tabs-pane-list-xxs.dex-tabs-pane-list-button .dex-tabs-pane-list-circle {
  border-radius: calc(var(--dex-okd-tabs-xxs-button-height)/2)
}

.dex-tabs-pane-list-xxs.dex-tabs-pane-list-muted {
  font-size: var(--dex-okd-tabs-xxs-muted-font-size);
  height: var(--dex-okd-tabs-xxs-muted-height);
  line-height: var(--dex-okd-tabs-xxs-muted-height)
}

.dex-tabs-pane-list-xxs.dex-tabs-pane-list-muted .dex-tabs-pane-list-container {
  border-radius: 4px;
  border-radius: var(--dex-okd-tabs-xxs-muted-container-border-radius, 4px)
}

.dex-tabs-pane-list-xxs.dex-tabs-pane-list-muted .dex-tabs-pane-list-circle {
  border-radius: calc(var(--dex-okd-tabs-xxs-muted-height)/2)
}

.dex-tabs-pane-list-xxs.dex-tabs-pane-list-segmented {
  font-size: var(--dex-okd-tabs-xxs-segmented-font-size);
  height: var(--dex-okd-tabs-xxs-segmented-height);
  line-height: var(--dex-okd-tabs-xxs-segmented-height)
}

.dex-tabs-pane-list-xxs.dex-tabs-pane-list-segmented .dex-tabs-pane-list-container {
  border-radius: 4px;
  border-radius: var(--dex-okd-tabs-xxs-segmented-container-border-radius, 4px)
}

.dex-tabs-pane-list-xxs.dex-tabs-pane-list-segmented .dex-tabs-pane-list-circle {
  border-radius: calc(var(--dex-okd-tabs-xxs-segmented-height)/2)
}

.dex-tabs-pane-list-xxs.dex-tabs-pane-list-segmented .dex-tabs-pane-list-flex {
  padding: var(--dex-okd-tabs-xxs-segmented-container-padding)
}

.dex-tabs-pane-xs:last-child {
  margin-right: 0 !important
}

.dex-tabs-pane-xs.dex-tabs-pane-underline {
  font-size: var(--dex-okd-tabs-xs-underline-font-size);
  font-weight: 400;
  font-weight: var(--dex-okd-tabs-xs-underline-font-weight, 400);
  margin-right: var(--dex-okd-tabs-xs-underline-spacing);
  padding: 0 var(--dex-okd-tabs-xs-underline-label-padding)
}

.dex-tabs-pane-xs.dex-tabs-pane-underline.dex-tabs-pane-circle {
  border-radius: calc(var(--dex-okd-tabs-xs-underline-height)/2)
}

.dex-tabs-pane-xs.dex-tabs-pane-underline-active {
  font-weight: 400;
  font-weight: var(--dex-okd-tabs-xs-underline-active-font-weight, 400)
}

.dex-tabs-pane-xs.dex-tabs-pane-button {
  border-radius: 4px;
  border-radius: var(--dex-okd-tabs-xs-button-border-radius, 4px);
  font-size: var(--dex-okd-tabs-xs-button-font-size);
  font-weight: var(--dex-okd-tabs-xs-button-font-weight);
  margin-right: var(--dex-okd-tabs-xs-button-spacing);
  padding: 0 var(--dex-okd-tabs-xs-button-label-padding)
}

.dex-tabs-pane-xs.dex-tabs-pane-button.dex-tabs-pane-circle {
  border-radius: calc(var(--dex-okd-tabs-xs-button-height)/2)
}

.dex-tabs-pane-xs.dex-tabs-pane-button-active {
  font-weight: 400;
  font-weight: var(--dex-okd-tabs-xs-button-active-font-weight, 400)
}

.dex-tabs-pane-xs.dex-tabs-pane-muted {
  border-radius: 4px;
  border-radius: var(--dex-okd-tabs-xs-muted-border-radius, 4px);
  font-size: var(--dex-okd-tabs-xs-muted-font-size);
  font-weight: var(--dex-okd-tabs-xs-muted-font-weight);
  margin-right: var(--dex-okd-tabs-xs-muted-spacing);
  padding: 0 var(--dex-okd-tabs-xs-muted-label-padding)
}

.dex-tabs-pane-xs.dex-tabs-pane-muted.dex-tabs-pane-circle {
  border-radius: calc(var(--dex-okd-tabs-xs-muted-height)/2)
}

.dex-tabs-pane-xs.dex-tabs-pane-muted-active {
  font-weight: 400;
  font-weight: var(--dex-okd-tabs-xs-muted-active-font-weight, 400)
}

.dex-tabs-pane-xs.dex-tabs-pane-segmented {
  border-radius: 4px;
  border-radius: var(--dex-okd-tabs-xs-segmented-border-radius, 4px);
  font-size: var(--dex-okd-tabs-xs-segmented-font-size);
  font-weight: var(--dex-okd-tabs-xs-segmented-font-weight);
  margin-right: var(--dex-okd-tabs-xs-segmented-spacing);
  padding: 0 var(--dex-okd-tabs-xs-segmented-label-padding)
}

.dex-tabs-pane-xs.dex-tabs-pane-segmented-active {
  font-weight: 400;
  font-weight: var(--dex-okd-tabs-xs-segmented-active-font-weight, 400)
}

.dex-tabs-pane-xs.dex-tabs-pane-segmented.dex-tabs-pane-circle {
  border-radius: calc(var(--dex-okd-tabs-xs-segmented-height)/2)
}

.dex-tabs-pane-list-xs .dex-tabs-pane-list-nav-icon .icon {
  font-size: var(--dex-okd-tabs-xs-common-icon-size)
}

.dex-tabs-pane-list-xs.dex-tabs-pane-list-underline {
  font-size: var(--dex-okd-tabs-xs-underline-font-size);
  height: var(--dex-okd-tabs-xs-underline-height)
}

.dex-tabs-pane-list-xs.dex-tabs-pane-list-underline .dex-tabs-pane-list-circle {
  border-radius: calc(var(--dex-okd-tabs-xs-underline-height)/2)
}

.dex-tabs-pane-list-xs.dex-tabs-pane-list-button {
  font-size: var(--dex-okd-tabs-xs-button-font-size);
  height: var(--dex-okd-tabs-xs-button-height);
  line-height: var(--dex-okd-tabs-xs-button-height)
}

.dex-tabs-pane-list-xs.dex-tabs-pane-list-button .dex-tabs-pane-list-container {
  border-radius: 4px;
  border-radius: var(--dex-okd-tabs-xs-button-container-border-radius, 4px)
}

.dex-tabs-pane-list-xs.dex-tabs-pane-list-button .dex-tabs-pane-list-circle {
  border-radius: calc(var(--dex-okd-tabs-xs-button-height)/2)
}

.dex-tabs-pane-list-xs.dex-tabs-pane-list-muted {
  font-size: var(--dex-okd-tabs-xs-muted-font-size);
  height: var(--dex-okd-tabs-xs-muted-height);
  line-height: var(--dex-okd-tabs-xs-muted-height)
}

.dex-tabs-pane-list-xs.dex-tabs-pane-list-muted .dex-tabs-pane-list-container {
  border-radius: 4px;
  border-radius: var(--dex-okd-tabs-xs-muted-container-border-radius, 4px)
}

.dex-tabs-pane-list-xs.dex-tabs-pane-list-muted .dex-tabs-pane-list-circle {
  border-radius: calc(var(--dex-okd-tabs-xs-muted-height)/2)
}

.dex-tabs-pane-list-xs.dex-tabs-pane-list-segmented {
  font-size: var(--dex-okd-tabs-xs-segmented-font-size);
  height: var(--dex-okd-tabs-xs-segmented-height);
  line-height: var(--dex-okd-tabs-xs-segmented-height)
}

.dex-tabs-pane-list-xs.dex-tabs-pane-list-segmented .dex-tabs-pane-list-container {
  border-radius: 4px;
  border-radius: var(--dex-okd-tabs-xs-segmented-container-border-radius, 4px)
}

.dex-tabs-pane-list-xs.dex-tabs-pane-list-segmented .dex-tabs-pane-list-circle {
  border-radius: calc(var(--dex-okd-tabs-xs-segmented-height)/2)
}

.dex-tabs-pane-list-xs.dex-tabs-pane-list-segmented .dex-tabs-pane-list-flex {
  padding: var(--dex-okd-tabs-xs-segmented-container-padding)
}

.dex-tabs-pane-sm:last-child {
  margin-right: 0 !important
}

.dex-tabs-pane-sm.dex-tabs-pane-underline {
  font-size: var(--dex-okd-tabs-sm-underline-font-size);
  font-weight: 400;
  font-weight: var(--dex-okd-tabs-sm-underline-font-weight, 400);
  margin-right: var(--dex-okd-tabs-sm-underline-spacing);
  padding: 0 var(--dex-okd-tabs-sm-underline-label-padding)
}

.dex-tabs-pane-sm.dex-tabs-pane-underline.dex-tabs-pane-circle {
  border-radius: calc(var(--dex-okd-tabs-sm-underline-height)/2)
}

.dex-tabs-pane-sm.dex-tabs-pane-underline-active {
  font-weight: 400;
  font-weight: var(--dex-okd-tabs-sm-underline-active-font-weight, 400)
}

.dex-tabs-pane-sm.dex-tabs-pane-button {
  border-radius: 4px;
  border-radius: var(--dex-okd-tabs-sm-button-border-radius, 4px);
  font-size: var(--dex-okd-tabs-sm-button-font-size);
  font-weight: var(--dex-okd-tabs-sm-button-font-weight);
  margin-right: var(--dex-okd-tabs-sm-button-spacing);
  padding: 0 var(--dex-okd-tabs-sm-button-label-padding)
}

.dex-tabs-pane-sm.dex-tabs-pane-button.dex-tabs-pane-circle {
  border-radius: calc(var(--dex-okd-tabs-sm-button-height)/2)
}

.dex-tabs-pane-sm.dex-tabs-pane-button-active {
  font-weight: 400;
  font-weight: var(--dex-okd-tabs-sm-button-active-font-weight, 400)
}

.dex-tabs-pane-sm.dex-tabs-pane-muted {
  border-radius: 4px;
  border-radius: var(--dex-okd-tabs-sm-muted-border-radius, 4px);
  font-size: var(--dex-okd-tabs-sm-muted-font-size);
  font-weight: var(--dex-okd-tabs-sm-muted-font-weight);
  margin-right: var(--dex-okd-tabs-sm-muted-spacing);
  padding: 0 var(--dex-okd-tabs-sm-muted-label-padding)
}

.dex-tabs-pane-sm.dex-tabs-pane-muted.dex-tabs-pane-circle {
  border-radius: calc(var(--dex-okd-tabs-sm-muted-height)/2)
}

.dex-tabs-pane-sm.dex-tabs-pane-muted-active {
  font-weight: 400;
  font-weight: var(--dex-okd-tabs-sm-muted-active-font-weight, 400)
}

.dex-tabs-pane-sm.dex-tabs-pane-segmented {
  border-radius: 4px;
  border-radius: var(--dex-okd-tabs-sm-segmented-border-radius, 4px);
  font-size: var(--dex-okd-tabs-sm-segmented-font-size);
  font-weight: var(--dex-okd-tabs-sm-segmented-font-weight);
  margin-right: var(--dex-okd-tabs-sm-segmented-spacing);
  padding: 0 var(--dex-okd-tabs-sm-segmented-label-padding)
}

.dex-tabs-pane-sm.dex-tabs-pane-segmented-active {
  font-weight: 400;
  font-weight: var(--dex-okd-tabs-sm-segmented-active-font-weight, 400)
}

.dex-tabs-pane-sm.dex-tabs-pane-segmented.dex-tabs-pane-circle {
  border-radius: calc(var(--dex-okd-tabs-sm-segmented-height)/2)
}

.dex-tabs-pane-list-sm .dex-tabs-pane-list-nav-icon .icon {
  font-size: var(--dex-okd-tabs-sm-common-icon-size)
}

.dex-tabs-pane-list-sm.dex-tabs-pane-list-underline {
  font-size: var(--dex-okd-tabs-sm-underline-font-size);
  height: var(--dex-okd-tabs-sm-underline-height)
}

.dex-tabs-pane-list-sm.dex-tabs-pane-list-underline .dex-tabs-pane-list-circle {
  border-radius: calc(var(--dex-okd-tabs-sm-underline-height)/2)
}

.dex-tabs-pane-list-sm.dex-tabs-pane-list-button {
  font-size: var(--dex-okd-tabs-sm-button-font-size);
  height: var(--dex-okd-tabs-sm-button-height);
  line-height: var(--dex-okd-tabs-sm-button-height)
}

.dex-tabs-pane-list-sm.dex-tabs-pane-list-button .dex-tabs-pane-list-container {
  border-radius: 4px;
  border-radius: var(--dex-okd-tabs-sm-button-container-border-radius, 4px)
}

.dex-tabs-pane-list-sm.dex-tabs-pane-list-button .dex-tabs-pane-list-circle {
  border-radius: calc(var(--dex-okd-tabs-sm-button-height)/2)
}

.dex-tabs-pane-list-sm.dex-tabs-pane-list-muted {
  font-size: var(--dex-okd-tabs-sm-muted-font-size);
  height: var(--dex-okd-tabs-sm-muted-height);
  line-height: var(--dex-okd-tabs-sm-muted-height)
}

.dex-tabs-pane-list-sm.dex-tabs-pane-list-muted .dex-tabs-pane-list-container {
  border-radius: 4px;
  border-radius: var(--dex-okd-tabs-sm-muted-container-border-radius, 4px)
}

.dex-tabs-pane-list-sm.dex-tabs-pane-list-muted .dex-tabs-pane-list-circle {
  border-radius: calc(var(--dex-okd-tabs-sm-muted-height)/2)
}

.dex-tabs-pane-list-sm.dex-tabs-pane-list-segmented {
  font-size: var(--dex-okd-tabs-sm-segmented-font-size);
  height: var(--dex-okd-tabs-sm-segmented-height);
  line-height: var(--dex-okd-tabs-sm-segmented-height)
}

.dex-tabs-pane-list-sm.dex-tabs-pane-list-segmented .dex-tabs-pane-list-container {
  border-radius: 4px;
  border-radius: var(--dex-okd-tabs-sm-segmented-container-border-radius, 4px)
}

.dex-tabs-pane-list-sm.dex-tabs-pane-list-segmented .dex-tabs-pane-list-circle {
  border-radius: calc(var(--dex-okd-tabs-sm-segmented-height)/2)
}

.dex-tabs-pane-list-sm.dex-tabs-pane-list-segmented .dex-tabs-pane-list-flex {
  padding: var(--dex-okd-tabs-sm-segmented-container-padding)
}

.dex-tabs-pane-md:last-child {
  margin-right: 0 !important
}

.dex-tabs-pane-md.dex-tabs-pane-underline {
  font-size: var(--dex-okd-tabs-md-underline-font-size);
  font-weight: 400;
  font-weight: var(--dex-okd-tabs-md-underline-font-weight, 400);
  margin-right: var(--dex-okd-tabs-md-underline-spacing);
  padding: 0 var(--dex-okd-tabs-md-underline-label-padding)
}

.dex-tabs-pane-md.dex-tabs-pane-underline.dex-tabs-pane-circle {
  border-radius: calc(var(--dex-okd-tabs-md-underline-height)/2)
}

.dex-tabs-pane-md.dex-tabs-pane-underline-active {
  font-weight: 400;
  font-weight: var(--dex-okd-tabs-md-underline-active-font-weight, 400)
}

.dex-tabs-pane-md.dex-tabs-pane-button {
  border-radius: 4px;
  border-radius: var(--dex-okd-tabs-md-button-border-radius, 4px);
  font-size: var(--dex-okd-tabs-md-button-font-size);
  font-weight: var(--dex-okd-tabs-md-button-font-weight);
  margin-right: var(--dex-okd-tabs-md-button-spacing);
  padding: 0 var(--dex-okd-tabs-md-button-label-padding)
}

.dex-tabs-pane-md.dex-tabs-pane-button.dex-tabs-pane-circle {
  border-radius: calc(var(--dex-okd-tabs-md-button-height)/2)
}

.dex-tabs-pane-md.dex-tabs-pane-button-active {
  font-weight: 400;
  font-weight: var(--dex-okd-tabs-md-button-active-font-weight, 400)
}

.dex-tabs-pane-md.dex-tabs-pane-muted {
  border-radius: 4px;
  border-radius: var(--dex-okd-tabs-md-muted-border-radius, 4px);
  font-size: var(--dex-okd-tabs-md-muted-font-size);
  font-weight: var(--dex-okd-tabs-md-muted-font-weight);
  margin-right: var(--dex-okd-tabs-md-muted-spacing);
  padding: 0 var(--dex-okd-tabs-md-muted-label-padding)
}

.dex-tabs-pane-md.dex-tabs-pane-muted.dex-tabs-pane-circle {
  border-radius: calc(var(--dex-okd-tabs-md-muted-height)/2)
}

.dex-tabs-pane-md.dex-tabs-pane-muted-active {
  font-weight: 400;
  font-weight: var(--dex-okd-tabs-md-muted-active-font-weight, 400)
}

.dex-tabs-pane-md.dex-tabs-pane-segmented {
  border-radius: 4px;
  border-radius: var(--dex-okd-tabs-md-segmented-border-radius, 4px);
  font-size: var(--dex-okd-tabs-md-segmented-font-size);
  font-weight: var(--dex-okd-tabs-md-segmented-font-weight);
  margin-right: var(--dex-okd-tabs-md-segmented-spacing);
  padding: 0 var(--dex-okd-tabs-md-segmented-label-padding)
}

.dex-tabs-pane-md.dex-tabs-pane-segmented-active {
  font-weight: 400;
  font-weight: var(--dex-okd-tabs-md-segmented-active-font-weight, 400)
}

.dex-tabs-pane-md.dex-tabs-pane-segmented.dex-tabs-pane-circle {
  border-radius: calc(var(--dex-okd-tabs-md-segmented-height)/2)
}

.dex-tabs-pane-list-md .dex-tabs-pane-list-nav-icon .icon {
  font-size: var(--dex-okd-tabs-md-common-icon-size)
}

.dex-tabs-pane-list-md.dex-tabs-pane-list-underline {
  font-size: var(--dex-okd-tabs-md-underline-font-size);
  height: var(--dex-okd-tabs-md-underline-height)
}

.dex-tabs-pane-list-md.dex-tabs-pane-list-underline .dex-tabs-pane-list-circle {
  border-radius: calc(var(--dex-okd-tabs-md-underline-height)/2)
}

.dex-tabs-pane-list-md.dex-tabs-pane-list-button {
  font-size: var(--dex-okd-tabs-md-button-font-size);
  height: var(--dex-okd-tabs-md-button-height);
  line-height: var(--dex-okd-tabs-md-button-height)
}

.dex-tabs-pane-list-md.dex-tabs-pane-list-button .dex-tabs-pane-list-container {
  border-radius: 4px;
  border-radius: var(--dex-okd-tabs-md-button-container-border-radius, 4px)
}

.dex-tabs-pane-list-md.dex-tabs-pane-list-button .dex-tabs-pane-list-circle {
  border-radius: calc(var(--dex-okd-tabs-md-button-height)/2)
}

.dex-tabs-pane-list-md.dex-tabs-pane-list-muted {
  font-size: var(--dex-okd-tabs-md-muted-font-size);
  height: var(--dex-okd-tabs-md-muted-height);
  line-height: var(--dex-okd-tabs-md-muted-height)
}

.dex-tabs-pane-list-md.dex-tabs-pane-list-muted .dex-tabs-pane-list-container {
  border-radius: 4px;
  border-radius: var(--dex-okd-tabs-md-muted-container-border-radius, 4px)
}

.dex-tabs-pane-list-md.dex-tabs-pane-list-muted .dex-tabs-pane-list-circle {
  border-radius: calc(var(--dex-okd-tabs-md-muted-height)/2)
}

.dex-tabs-pane-list-md.dex-tabs-pane-list-segmented {
  font-size: var(--dex-okd-tabs-md-segmented-font-size);
  height: var(--dex-okd-tabs-md-segmented-height);
  line-height: var(--dex-okd-tabs-md-segmented-height)
}

.dex-tabs-pane-list-md.dex-tabs-pane-list-segmented .dex-tabs-pane-list-container {
  border-radius: 4px;
  border-radius: var(--dex-okd-tabs-md-segmented-container-border-radius, 4px)
}

.dex-tabs-pane-list-md.dex-tabs-pane-list-segmented .dex-tabs-pane-list-circle {
  border-radius: calc(var(--dex-okd-tabs-md-segmented-height)/2)
}

.dex-tabs-pane-list-md.dex-tabs-pane-list-segmented .dex-tabs-pane-list-flex {
  padding: var(--dex-okd-tabs-md-segmented-container-padding)
}

.dex-tabs-pane-lg:last-child {
  margin-right: 0 !important
}

.dex-tabs-pane-lg.dex-tabs-pane-underline {
  font-size: var(--dex-okd-tabs-lg-underline-font-size);
  font-weight: 400;
  font-weight: var(--dex-okd-tabs-lg-underline-font-weight, 400);
  margin-right: var(--dex-okd-tabs-lg-underline-spacing);
  padding: 0 var(--dex-okd-tabs-lg-underline-label-padding)
}

.dex-tabs-pane-lg.dex-tabs-pane-underline.dex-tabs-pane-circle {
  border-radius: calc(var(--dex-okd-tabs-lg-underline-height)/2)
}

.dex-tabs-pane-lg.dex-tabs-pane-underline-active {
  font-weight: 400;
  font-weight: var(--dex-okd-tabs-lg-underline-active-font-weight, 400)
}

.dex-tabs-pane-lg.dex-tabs-pane-button {
  border-radius: 4px;
  border-radius: var(--dex-okd-tabs-lg-button-border-radius, 4px);
  font-size: var(--dex-okd-tabs-lg-button-font-size);
  font-weight: var(--dex-okd-tabs-lg-button-font-weight);
  margin-right: var(--dex-okd-tabs-lg-button-spacing);
  padding: 0 var(--dex-okd-tabs-lg-button-label-padding)
}

.dex-tabs-pane-lg.dex-tabs-pane-button.dex-tabs-pane-circle {
  border-radius: calc(var(--dex-okd-tabs-lg-button-height)/2)
}

.dex-tabs-pane-lg.dex-tabs-pane-button-active {
  font-weight: 400;
  font-weight: var(--dex-okd-tabs-lg-button-active-font-weight, 400)
}

.dex-tabs-pane-lg.dex-tabs-pane-muted {
  border-radius: 4px;
  border-radius: var(--dex-okd-tabs-lg-muted-border-radius, 4px);
  font-size: var(--dex-okd-tabs-lg-muted-font-size);
  font-weight: var(--dex-okd-tabs-lg-muted-font-weight);
  margin-right: var(--dex-okd-tabs-lg-muted-spacing);
  padding: 0 var(--dex-okd-tabs-lg-muted-label-padding)
}

.dex-tabs-pane-lg.dex-tabs-pane-muted.dex-tabs-pane-circle {
  border-radius: calc(var(--dex-okd-tabs-lg-muted-height)/2)
}

.dex-tabs-pane-lg.dex-tabs-pane-muted-active {
  font-weight: 400;
  font-weight: var(--dex-okd-tabs-lg-muted-active-font-weight, 400)
}

.dex-tabs-pane-lg.dex-tabs-pane-segmented {
  border-radius: 4px;
  border-radius: var(--dex-okd-tabs-lg-segmented-border-radius, 4px);
  font-size: var(--dex-okd-tabs-lg-segmented-font-size);
  font-weight: var(--dex-okd-tabs-lg-segmented-font-weight);
  margin-right: var(--dex-okd-tabs-lg-segmented-spacing);
  padding: 0 var(--dex-okd-tabs-lg-segmented-label-padding)
}

.dex-tabs-pane-lg.dex-tabs-pane-segmented-active {
  font-weight: 400;
  font-weight: var(--dex-okd-tabs-lg-segmented-active-font-weight, 400)
}

.dex-tabs-pane-lg.dex-tabs-pane-segmented.dex-tabs-pane-circle {
  border-radius: calc(var(--dex-okd-tabs-lg-segmented-height)/2)
}

.dex-tabs-pane-list-lg .dex-tabs-pane-list-nav-icon .icon {
  font-size: var(--dex-okd-tabs-lg-common-icon-size)
}

.dex-tabs-pane-list-lg.dex-tabs-pane-list-underline {
  font-size: var(--dex-okd-tabs-lg-underline-font-size);
  height: var(--dex-okd-tabs-lg-underline-height)
}

.dex-tabs-pane-list-lg.dex-tabs-pane-list-underline .dex-tabs-pane-list-circle {
  border-radius: calc(var(--dex-okd-tabs-lg-underline-height)/2)
}

.dex-tabs-pane-list-lg.dex-tabs-pane-list-button {
  font-size: var(--dex-okd-tabs-lg-button-font-size);
  height: var(--dex-okd-tabs-lg-button-height);
  line-height: var(--dex-okd-tabs-lg-button-height)
}

.dex-tabs-pane-list-lg.dex-tabs-pane-list-button .dex-tabs-pane-list-container {
  border-radius: 4px;
  border-radius: var(--dex-okd-tabs-lg-button-container-border-radius, 4px)
}

.dex-tabs-pane-list-lg.dex-tabs-pane-list-button .dex-tabs-pane-list-circle {
  border-radius: calc(var(--dex-okd-tabs-lg-button-height)/2)
}

.dex-tabs-pane-list-lg.dex-tabs-pane-list-muted {
  font-size: var(--dex-okd-tabs-lg-muted-font-size);
  height: var(--dex-okd-tabs-lg-muted-height);
  line-height: var(--dex-okd-tabs-lg-muted-height)
}

.dex-tabs-pane-list-lg.dex-tabs-pane-list-muted .dex-tabs-pane-list-container {
  border-radius: 4px;
  border-radius: var(--dex-okd-tabs-lg-muted-container-border-radius, 4px)
}

.dex-tabs-pane-list-lg.dex-tabs-pane-list-muted .dex-tabs-pane-list-circle {
  border-radius: calc(var(--dex-okd-tabs-lg-muted-height)/2)
}

.dex-tabs-pane-list-lg.dex-tabs-pane-list-segmented {
  font-size: var(--dex-okd-tabs-lg-segmented-font-size);
  height: var(--dex-okd-tabs-lg-segmented-height);
  line-height: var(--dex-okd-tabs-lg-segmented-height)
}

.dex-tabs-pane-list-lg.dex-tabs-pane-list-segmented .dex-tabs-pane-list-container {
  border-radius: 4px;
  border-radius: var(--dex-okd-tabs-lg-segmented-container-border-radius, 4px)
}

.dex-tabs-pane-list-lg.dex-tabs-pane-list-segmented .dex-tabs-pane-list-circle {
  border-radius: calc(var(--dex-okd-tabs-lg-segmented-height)/2)
}

.dex-tabs-pane-list-lg.dex-tabs-pane-list-segmented .dex-tabs-pane-list-flex {
  padding: var(--dex-okd-tabs-lg-segmented-container-padding)
}

.dex-tabs-pane-xl:last-child {
  margin-right: 0 !important
}

.dex-tabs-pane-xl.dex-tabs-pane-underline {
  font-size: var(--dex-okd-tabs-xl-underline-font-size);
  font-weight: 400;
  font-weight: var(--dex-okd-tabs-xl-underline-font-weight, 400);
  margin-right: var(--dex-okd-tabs-xl-underline-spacing);
  padding: 0 var(--dex-okd-tabs-xl-underline-label-padding)
}

.dex-tabs-pane-xl.dex-tabs-pane-underline.dex-tabs-pane-circle {
  border-radius: calc(var(--dex-okd-tabs-xl-underline-height)/2)
}

.dex-tabs-pane-xl.dex-tabs-pane-underline-active {
  font-weight: 400;
  font-weight: var(--dex-okd-tabs-xl-underline-active-font-weight, 400)
}

.dex-tabs-pane-xl.dex-tabs-pane-button {
  border-radius: 4px;
  border-radius: var(--dex-okd-tabs-xl-button-border-radius, 4px);
  font-size: var(--dex-okd-tabs-xl-button-font-size);
  font-weight: var(--dex-okd-tabs-xl-button-font-weight);
  margin-right: var(--dex-okd-tabs-xl-button-spacing);
  padding: 0 var(--dex-okd-tabs-xl-button-label-padding)
}

.dex-tabs-pane-xl.dex-tabs-pane-button.dex-tabs-pane-circle {
  border-radius: calc(var(--dex-okd-tabs-xl-button-height)/2)
}

.dex-tabs-pane-xl.dex-tabs-pane-button-active {
  font-weight: 400;
  font-weight: var(--dex-okd-tabs-xl-button-active-font-weight, 400)
}

.dex-tabs-pane-xl.dex-tabs-pane-muted {
  border-radius: 4px;
  border-radius: var(--dex-okd-tabs-xl-muted-border-radius, 4px);
  font-size: var(--dex-okd-tabs-xl-muted-font-size);
  font-weight: var(--dex-okd-tabs-xl-muted-font-weight);
  margin-right: var(--dex-okd-tabs-xl-muted-spacing);
  padding: 0 var(--dex-okd-tabs-xl-muted-label-padding)
}

.dex-tabs-pane-xl.dex-tabs-pane-muted.dex-tabs-pane-circle {
  border-radius: calc(var(--dex-okd-tabs-xl-muted-height)/2)
}

.dex-tabs-pane-xl.dex-tabs-pane-muted-active {
  font-weight: 400;
  font-weight: var(--dex-okd-tabs-xl-muted-active-font-weight, 400)
}

.dex-tabs-pane-xl.dex-tabs-pane-segmented {
  border-radius: 4px;
  border-radius: var(--dex-okd-tabs-xl-segmented-border-radius, 4px);
  font-size: var(--dex-okd-tabs-xl-segmented-font-size);
  font-weight: var(--dex-okd-tabs-xl-segmented-font-weight);
  margin-right: var(--dex-okd-tabs-xl-segmented-spacing);
  padding: 0 var(--dex-okd-tabs-xl-segmented-label-padding)
}

.dex-tabs-pane-xl.dex-tabs-pane-segmented-active {
  font-weight: 400;
  font-weight: var(--dex-okd-tabs-xl-segmented-active-font-weight, 400)
}

.dex-tabs-pane-xl.dex-tabs-pane-segmented.dex-tabs-pane-circle {
  border-radius: calc(var(--dex-okd-tabs-xl-segmented-height)/2)
}

.dex-tabs-pane-list-xl .dex-tabs-pane-list-nav-icon .icon {
  font-size: var(--dex-okd-tabs-xl-common-icon-size)
}

.dex-tabs-pane-list-xl.dex-tabs-pane-list-underline {
  font-size: var(--dex-okd-tabs-xl-underline-font-size);
  height: var(--dex-okd-tabs-xl-underline-height)
}

.dex-tabs-pane-list-xl.dex-tabs-pane-list-underline .dex-tabs-pane-list-circle {
  border-radius: calc(var(--dex-okd-tabs-xl-underline-height)/2)
}

.dex-tabs-pane-list-xl.dex-tabs-pane-list-button {
  font-size: var(--dex-okd-tabs-xl-button-font-size);
  height: var(--dex-okd-tabs-xl-button-height);
  line-height: var(--dex-okd-tabs-xl-button-height)
}

.dex-tabs-pane-list-xl.dex-tabs-pane-list-button .dex-tabs-pane-list-container {
  border-radius: 4px;
  border-radius: var(--dex-okd-tabs-xl-button-container-border-radius, 4px)
}

.dex-tabs-pane-list-xl.dex-tabs-pane-list-button .dex-tabs-pane-list-circle {
  border-radius: calc(var(--dex-okd-tabs-xl-button-height)/2)
}

.dex-tabs-pane-list-xl.dex-tabs-pane-list-muted {
  font-size: var(--dex-okd-tabs-xl-muted-font-size);
  height: var(--dex-okd-tabs-xl-muted-height);
  line-height: var(--dex-okd-tabs-xl-muted-height)
}

.dex-tabs-pane-list-xl.dex-tabs-pane-list-muted .dex-tabs-pane-list-container {
  border-radius: 4px;
  border-radius: var(--dex-okd-tabs-xl-muted-container-border-radius, 4px)
}

.dex-tabs-pane-list-xl.dex-tabs-pane-list-muted .dex-tabs-pane-list-circle {
  border-radius: calc(var(--dex-okd-tabs-xl-muted-height)/2)
}

.dex-tabs-pane-list-xl.dex-tabs-pane-list-segmented {
  font-size: var(--dex-okd-tabs-xl-segmented-font-size);
  height: var(--dex-okd-tabs-xl-segmented-height);
  line-height: var(--dex-okd-tabs-xl-segmented-height)
}

.dex-tabs-pane-list-xl.dex-tabs-pane-list-segmented .dex-tabs-pane-list-container {
  border-radius: 4px;
  border-radius: var(--dex-okd-tabs-xl-segmented-container-border-radius, 4px)
}

.dex-tabs-pane-list-xl.dex-tabs-pane-list-segmented .dex-tabs-pane-list-circle {
  border-radius: calc(var(--dex-okd-tabs-xl-segmented-height)/2)
}

.dex-tabs-pane-list-xl.dex-tabs-pane-list-segmented .dex-tabs-pane-list-flex {
  padding: var(--dex-okd-tabs-xl-segmented-container-padding)
}

.dex-tabs-pane-xxl:last-child {
  margin-right: 0 !important
}

.dex-tabs-pane-xxl.dex-tabs-pane-underline {
  font-size: var(--dex-okd-tabs-xxl-underline-font-size);
  font-weight: 400;
  font-weight: var(--dex-okd-tabs-xxl-underline-font-weight, 400);
  margin-right: var(--dex-okd-tabs-xxl-underline-spacing);
  padding: 0 var(--dex-okd-tabs-xxl-underline-label-padding)
}

.dex-tabs-pane-xxl.dex-tabs-pane-underline.dex-tabs-pane-circle {
  border-radius: calc(var(--dex-okd-tabs-xxl-underline-height)/2)
}

.dex-tabs-pane-xxl.dex-tabs-pane-underline-active {
  font-weight: 400;
  font-weight: var(--dex-okd-tabs-xxl-underline-active-font-weight, 400)
}

.dex-tabs-pane-xxl.dex-tabs-pane-button {
  border-radius: 4px;
  border-radius: var(--dex-okd-tabs-xxl-button-border-radius, 4px);
  font-size: var(--dex-okd-tabs-xxl-button-font-size);
  font-weight: var(--dex-okd-tabs-xxl-button-font-weight);
  margin-right: var(--dex-okd-tabs-xxl-button-spacing);
  padding: 0 var(--dex-okd-tabs-xxl-button-label-padding)
}

.dex-tabs-pane-xxl.dex-tabs-pane-button.dex-tabs-pane-circle {
  border-radius: calc(var(--dex-okd-tabs-xxl-button-height)/2)
}

.dex-tabs-pane-xxl.dex-tabs-pane-button-active {
  font-weight: 400;
  font-weight: var(--dex-okd-tabs-xxl-button-active-font-weight, 400)
}

.dex-tabs-pane-xxl.dex-tabs-pane-muted {
  border-radius: 4px;
  border-radius: var(--dex-okd-tabs-xxl-muted-border-radius, 4px);
  font-size: var(--dex-okd-tabs-xxl-muted-font-size);
  font-weight: var(--dex-okd-tabs-xxl-muted-font-weight);
  margin-right: var(--dex-okd-tabs-xxl-muted-spacing);
  padding: 0 var(--dex-okd-tabs-xxl-muted-label-padding)
}

.dex-tabs-pane-xxl.dex-tabs-pane-muted.dex-tabs-pane-circle {
  border-radius: calc(var(--dex-okd-tabs-xxl-muted-height)/2)
}

.dex-tabs-pane-xxl.dex-tabs-pane-muted-active {
  font-weight: 400;
  font-weight: var(--dex-okd-tabs-xxl-muted-active-font-weight, 400)
}

.dex-tabs-pane-xxl.dex-tabs-pane-segmented {
  border-radius: 4px;
  border-radius: var(--dex-okd-tabs-xxl-segmented-border-radius, 4px);
  font-size: var(--dex-okd-tabs-xxl-segmented-font-size);
  font-weight: var(--dex-okd-tabs-xxl-segmented-font-weight);
  margin-right: var(--dex-okd-tabs-xxl-segmented-spacing);
  padding: 0 var(--dex-okd-tabs-xxl-segmented-label-padding)
}

.dex-tabs-pane-xxl.dex-tabs-pane-segmented-active {
  font-weight: 400;
  font-weight: var(--dex-okd-tabs-xxl-segmented-active-font-weight, 400)
}

.dex-tabs-pane-xxl.dex-tabs-pane-segmented.dex-tabs-pane-circle {
  border-radius: calc(var(--dex-okd-tabs-xxl-segmented-height)/2)
}

.dex-tabs-pane-list-xxl .dex-tabs-pane-list-nav-icon .icon {
  font-size: var(--dex-okd-tabs-xxl-common-icon-size)
}

.dex-tabs-pane-list-xxl.dex-tabs-pane-list-underline {
  font-size: var(--dex-okd-tabs-xxl-underline-font-size);
  height: var(--dex-okd-tabs-xxl-underline-height)
}

.dex-tabs-pane-list-xxl.dex-tabs-pane-list-underline .dex-tabs-pane-list-circle {
  border-radius: calc(var(--dex-okd-tabs-xxl-underline-height)/2)
}

.dex-tabs-pane-list-xxl.dex-tabs-pane-list-button {
  font-size: var(--dex-okd-tabs-xxl-button-font-size);
  height: var(--dex-okd-tabs-xxl-button-height);
  line-height: var(--dex-okd-tabs-xxl-button-height)
}

.dex-tabs-pane-list-xxl.dex-tabs-pane-list-button .dex-tabs-pane-list-container {
  border-radius: 4px;
  border-radius: var(--dex-okd-tabs-xxl-button-container-border-radius, 4px)
}

.dex-tabs-pane-list-xxl.dex-tabs-pane-list-button .dex-tabs-pane-list-circle {
  border-radius: calc(var(--dex-okd-tabs-xxl-button-height)/2)
}

.dex-tabs-pane-list-xxl.dex-tabs-pane-list-muted {
  font-size: var(--dex-okd-tabs-xxl-muted-font-size);
  height: var(--dex-okd-tabs-xxl-muted-height);
  line-height: var(--dex-okd-tabs-xxl-muted-height)
}

.dex-tabs-pane-list-xxl.dex-tabs-pane-list-muted .dex-tabs-pane-list-container {
  border-radius: 4px;
  border-radius: var(--dex-okd-tabs-xxl-muted-container-border-radius, 4px)
}

.dex-tabs-pane-list-xxl.dex-tabs-pane-list-muted .dex-tabs-pane-list-circle {
  border-radius: calc(var(--dex-okd-tabs-xxl-muted-height)/2)
}

.dex-tabs-pane-list-xxl.dex-tabs-pane-list-segmented {
  font-size: var(--dex-okd-tabs-xxl-segmented-font-size);
  height: var(--dex-okd-tabs-xxl-segmented-height);
  line-height: var(--dex-okd-tabs-xxl-segmented-height)
}

.dex-tabs-pane-list-xxl.dex-tabs-pane-list-segmented .dex-tabs-pane-list-container {
  border-radius: 4px;
  border-radius: var(--dex-okd-tabs-xxl-segmented-container-border-radius, 4px)
}

.dex-tabs-pane-list-xxl.dex-tabs-pane-list-segmented .dex-tabs-pane-list-circle {
  border-radius: calc(var(--dex-okd-tabs-xxl-segmented-height)/2)
}

.dex-tabs-pane-list-xxl.dex-tabs-pane-list-segmented .dex-tabs-pane-list-flex {
  padding: var(--dex-okd-tabs-xxl-segmented-container-padding)
}

.dex-tabs-pane-xxxl:last-child {
  margin-right: 0 !important
}

.dex-tabs-pane-xxxl.dex-tabs-pane-underline {
  font-size: var(--dex-okd-tabs-xxxl-underline-font-size);
  font-weight: 400;
  font-weight: var(--dex-okd-tabs-xxxl-underline-font-weight, 400);
  margin-right: var(--dex-okd-tabs-xxxl-underline-spacing);
  padding: 0 var(--dex-okd-tabs-xxxl-underline-label-padding)
}

.dex-tabs-pane-xxxl.dex-tabs-pane-underline.dex-tabs-pane-circle {
  border-radius: calc(var(--dex-okd-tabs-xxxl-underline-height)/2)
}

.dex-tabs-pane-xxxl.dex-tabs-pane-underline-active {
  font-weight: 400;
  font-weight: var(--dex-okd-tabs-xxxl-underline-active-font-weight, 400)
}

.dex-tabs-pane-xxxl.dex-tabs-pane-button {
  border-radius: 4px;
  border-radius: var(--dex-okd-tabs-xxxl-button-border-radius, 4px);
  font-size: var(--dex-okd-tabs-xxxl-button-font-size);
  font-weight: var(--dex-okd-tabs-xxxl-button-font-weight);
  margin-right: var(--dex-okd-tabs-xxxl-button-spacing);
  padding: 0 var(--dex-okd-tabs-xxxl-button-label-padding)
}

.dex-tabs-pane-xxxl.dex-tabs-pane-button.dex-tabs-pane-circle {
  border-radius: calc(var(--dex-okd-tabs-xxxl-button-height)/2)
}

.dex-tabs-pane-xxxl.dex-tabs-pane-button-active {
  font-weight: 400;
  font-weight: var(--dex-okd-tabs-xxxl-button-active-font-weight, 400)
}

.dex-tabs-pane-xxxl.dex-tabs-pane-muted {
  border-radius: 4px;
  border-radius: var(--dex-okd-tabs-xxxl-muted-border-radius, 4px);
  font-size: var(--dex-okd-tabs-xxxl-muted-font-size);
  font-weight: var(--dex-okd-tabs-xxxl-muted-font-weight);
  margin-right: var(--dex-okd-tabs-xxxl-muted-spacing);
  padding: 0 var(--dex-okd-tabs-xxxl-muted-label-padding)
}

.dex-tabs-pane-xxxl.dex-tabs-pane-muted.dex-tabs-pane-circle {
  border-radius: calc(var(--dex-okd-tabs-xxxl-muted-height)/2)
}

.dex-tabs-pane-xxxl.dex-tabs-pane-muted-active {
  font-weight: 400;
  font-weight: var(--dex-okd-tabs-xxxl-muted-active-font-weight, 400)
}

.dex-tabs-pane-xxxl.dex-tabs-pane-segmented {
  border-radius: 4px;
  border-radius: var(--dex-okd-tabs-xxxl-segmented-border-radius, 4px);
  font-size: var(--dex-okd-tabs-xxxl-segmented-font-size);
  font-weight: var(--dex-okd-tabs-xxxl-segmented-font-weight);
  margin-right: var(--dex-okd-tabs-xxxl-segmented-spacing);
  padding: 0 var(--dex-okd-tabs-xxxl-segmented-label-padding)
}

.dex-tabs-pane-xxxl.dex-tabs-pane-segmented-active {
  font-weight: 400;
  font-weight: var(--dex-okd-tabs-xxxl-segmented-active-font-weight, 400)
}

.dex-tabs-pane-xxxl.dex-tabs-pane-segmented.dex-tabs-pane-circle {
  border-radius: calc(var(--dex-okd-tabs-xxxl-segmented-height)/2)
}

.dex-tabs-pane-list-xxxl .dex-tabs-pane-list-nav-icon .icon {
  font-size: var(--dex-okd-tabs-xxxl-common-icon-size)
}

.dex-tabs-pane-list-xxxl.dex-tabs-pane-list-underline {
  font-size: var(--dex-okd-tabs-xxxl-underline-font-size);
  height: var(--dex-okd-tabs-xxxl-underline-height)
}

.dex-tabs-pane-list-xxxl.dex-tabs-pane-list-underline .dex-tabs-pane-list-circle {
  border-radius: calc(var(--dex-okd-tabs-xxxl-underline-height)/2)
}

.dex-tabs-pane-list-xxxl.dex-tabs-pane-list-button {
  font-size: var(--dex-okd-tabs-xxxl-button-font-size);
  height: var(--dex-okd-tabs-xxxl-button-height);
  line-height: var(--dex-okd-tabs-xxxl-button-height)
}

.dex-tabs-pane-list-xxxl.dex-tabs-pane-list-button .dex-tabs-pane-list-container {
  border-radius: 4px;
  border-radius: var(--dex-okd-tabs-xxxl-button-container-border-radius, 4px)
}

.dex-tabs-pane-list-xxxl.dex-tabs-pane-list-button .dex-tabs-pane-list-circle {
  border-radius: calc(var(--dex-okd-tabs-xxxl-button-height)/2)
}

.dex-tabs-pane-list-xxxl.dex-tabs-pane-list-muted {
  font-size: var(--dex-okd-tabs-xxxl-muted-font-size);
  height: var(--dex-okd-tabs-xxxl-muted-height);
  line-height: var(--dex-okd-tabs-xxxl-muted-height)
}

.dex-tabs-pane-list-xxxl.dex-tabs-pane-list-muted .dex-tabs-pane-list-container {
  border-radius: 4px;
  border-radius: var(--dex-okd-tabs-xxxl-muted-container-border-radius, 4px)
}

.dex-tabs-pane-list-xxxl.dex-tabs-pane-list-muted .dex-tabs-pane-list-circle {
  border-radius: calc(var(--dex-okd-tabs-xxxl-muted-height)/2)
}

.dex-tabs-pane-list-xxxl.dex-tabs-pane-list-segmented {
  font-size: var(--dex-okd-tabs-xxxl-segmented-font-size);
  height: var(--dex-okd-tabs-xxxl-segmented-height);
  line-height: var(--dex-okd-tabs-xxxl-segmented-height)
}

.dex-tabs-pane-list-xxxl.dex-tabs-pane-list-segmented .dex-tabs-pane-list-container {
  border-radius: 4px;
  border-radius: var(--dex-okd-tabs-xxxl-segmented-container-border-radius, 4px)
}

.dex-tabs-pane-list-xxxl.dex-tabs-pane-list-segmented .dex-tabs-pane-list-circle {
  border-radius: calc(var(--dex-okd-tabs-xxxl-segmented-height)/2)
}

.dex-tabs-pane-list-xxxl.dex-tabs-pane-list-segmented .dex-tabs-pane-list-flex {
  padding: var(--dex-okd-tabs-xxxl-segmented-container-padding)
}

.dex-tabs-pane.dex-tabs-pane-blue-no-border.dex-tabs-pane-underline-active {
  border-bottom-color: transparent
}

.dex-tabs-pane-blue.dex-tabs-pane-underline {
  color: var(--dex-okd-tabs-underline-pane-common-label-color)
}

.dex-tabs-pane-blue.dex-tabs-pane-underline:focus-visible {
  outline: 2px solid var(--dex-okd-color-border-focus);
  outline-color: var(--dex-okd-color-border-focus);
  outline-offset: -2px;
  outline-style: solid;
  outline-width: 2px
}

.dex-tabs-pane-blue.dex-tabs-pane-underline-active {
  border-bottom-color: var(--dex-okd-tabs-underline-pane-blue-border-active-color)
}

.dex-tabs-pane-blue.dex-tabs-pane-underline-active,
.dex-tabs-pane-blue.dex-tabs-pane-underline:hover:not(.is-mobile) {
  color: var(--dex-okd-tabs-underline-pane-blue-label-active-color)
}

.dex-tabs-pane-blue.dex-tabs-pane-button {
  color: var(--dex-okd-tabs-button-pane-common-label-color)
}

.dex-tabs-pane-blue.dex-tabs-pane-button-active {
  background-color: var(--dex-okd-tabs-button-pane-blue-bg-active-color);
  border-color: transparent;
  color: var(--dex-okd-tabs-button-pane-blue-label-active-color)
}

.dex-tabs-pane-blue.dex-tabs-pane-button:hover:not(.is-mobile) {
  border-color: var(--dex-okd-tabs-button-pane-blue-bg-active-color)
}

.dex-tabs-pane-blue.dex-tabs-pane-muted {
  color: var(--dex-okd-tabs-muted-pane-common-label-color)
}

.dex-tabs-pane-blue.dex-tabs-pane-muted-active {
  border-color: var(--dex-okd-tabs-muted-pane-blue-border-active-color)
}

.dex-tabs-pane-blue.dex-tabs-pane-muted-active,
.dex-tabs-pane-blue.dex-tabs-pane-muted:hover:not(.is-mobile) {
  color: var(--dex-okd-tabs-muted-pane-blue-label-active-color)
}

.dex-tabs-pane-blue.dex-tabs-pane-segmented {
  color: var(--dex-okd-tabs-segmented-pane-common-label-color)
}

.dex-tabs-pane-blue.dex-tabs-pane-segmented-active {
  background-color: var(--dex-okd-tabs-segmented-pane-blue-bg-active-color);
  color: var(--dex-okd-tabs-segmented-pane-blue-label-active-color)
}

.dex-tabs-pane-blue.dex-tabs-pane-segmented-active:focus-visible {
  outline: 2px solid var(--dex-okd-color-border-focus);
  outline-color: var(--dex-okd-tabs-segmented-pane-blue-label-active-color);
  outline-offset: -4px;
  outline-style: solid;
  outline-width: 2px
}

.dex-tabs-pane-list-blue .dex-tabs-transitions-underline {
  background-color: var(--dex-okd-tabs-underline-pane-blue-border-active-color)
}

.dex-tabs-pane.dex-tabs-pane-grey-no-border.dex-tabs-pane-underline-active {
  border-bottom-color: transparent
}

.dex-tabs-pane-grey.dex-tabs-pane-underline {
  color: var(--dex-okd-tabs-underline-pane-common-label-color)
}

.dex-tabs-pane-grey.dex-tabs-pane-underline:focus-visible {
  outline: 2px solid var(--dex-okd-color-border-focus);
  outline-color: var(--dex-okd-color-border-focus);
  outline-offset: -2px;
  outline-style: solid;
  outline-width: 2px
}

.dex-tabs-pane-grey.dex-tabs-pane-underline-active {
  border-bottom-color: var(--dex-okd-tabs-underline-pane-grey-border-active-color)
}

.dex-tabs-pane-grey.dex-tabs-pane-underline-active,
.dex-tabs-pane-grey.dex-tabs-pane-underline:hover:not(.is-mobile) {
  color: var(--dex-okd-tabs-underline-pane-grey-label-active-color)
}

.dex-tabs-pane-grey.dex-tabs-pane-button {
  color: var(--dex-okd-tabs-button-pane-common-label-color)
}

.dex-tabs-pane-grey.dex-tabs-pane-button-active {
  background-color: var(--dex-okd-tabs-button-pane-grey-bg-active-color);
  border-color: transparent;
  color: var(--dex-okd-tabs-button-pane-grey-label-active-color)
}

.dex-tabs-pane-grey.dex-tabs-pane-button:hover:not(.is-mobile) {
  border-color: var(--dex-okd-tabs-button-pane-grey-bg-active-color)
}

.dex-tabs-pane-grey.dex-tabs-pane-muted {
  color: var(--dex-okd-tabs-muted-pane-common-label-color)
}

.dex-tabs-pane-grey.dex-tabs-pane-muted-active {
  border-color: var(--dex-okd-tabs-muted-pane-grey-border-active-color)
}

.dex-tabs-pane-grey.dex-tabs-pane-muted-active,
.dex-tabs-pane-grey.dex-tabs-pane-muted:hover:not(.is-mobile) {
  color: var(--dex-okd-tabs-muted-pane-grey-label-active-color)
}

.dex-tabs-pane-grey.dex-tabs-pane-segmented {
  color: var(--dex-okd-tabs-segmented-pane-common-label-color)
}

.dex-tabs-pane-grey.dex-tabs-pane-segmented-active {
  background-color: var(--dex-okd-tabs-segmented-pane-grey-bg-active-color);
  color: var(--dex-okd-tabs-segmented-pane-grey-label-active-color)
}

.dex-tabs-pane-grey.dex-tabs-pane-segmented-active:focus-visible {
  outline: 2px solid var(--dex-okd-color-border-focus);
  outline-color: var(--dex-okd-tabs-segmented-pane-grey-label-active-color);
  outline-offset: -4px;
  outline-style: solid;
  outline-width: 2px
}

.dex-tabs-pane-list-grey .dex-tabs-transitions-underline {
  background-color: var(--dex-okd-tabs-underline-pane-grey-border-active-color)
}

.dex-tabs-pane.dex-tabs-pane-green-no-border.dex-tabs-pane-underline-active {
  border-bottom-color: transparent
}

.dex-tabs-pane-green.dex-tabs-pane-underline {
  color: var(--dex-okd-tabs-underline-pane-common-label-color)
}

.dex-tabs-pane-green.dex-tabs-pane-underline:focus-visible {
  outline: 2px solid var(--dex-okd-color-border-focus);
  outline-color: var(--dex-okd-color-border-focus);
  outline-offset: -2px;
  outline-style: solid;
  outline-width: 2px
}

.dex-tabs-pane-green.dex-tabs-pane-underline-active {
  border-bottom-color: var(--dex-okd-tabs-underline-pane-green-border-active-color)
}

.dex-tabs-pane-green.dex-tabs-pane-underline-active,
.dex-tabs-pane-green.dex-tabs-pane-underline:hover:not(.is-mobile) {
  color: var(--dex-okd-tabs-underline-pane-green-label-active-color)
}

.dex-tabs-pane-green.dex-tabs-pane-button {
  color: var(--dex-okd-tabs-button-pane-common-label-color)
}

.dex-tabs-pane-green.dex-tabs-pane-button-active {
  background-color: var(--dex-okd-tabs-button-pane-green-bg-active-color);
  border-color: transparent;
  color: var(--dex-okd-tabs-button-pane-green-label-active-color)
}

.dex-tabs-pane-green.dex-tabs-pane-button:hover:not(.is-mobile) {
  border-color: var(--dex-okd-tabs-button-pane-green-bg-active-color)
}

.dex-tabs-pane-green.dex-tabs-pane-muted {
  color: var(--dex-okd-tabs-muted-pane-common-label-color)
}

.dex-tabs-pane-green.dex-tabs-pane-muted-active {
  border-color: var(--dex-okd-tabs-muted-pane-green-border-active-color)
}

.dex-tabs-pane-green.dex-tabs-pane-muted-active,
.dex-tabs-pane-green.dex-tabs-pane-muted:hover:not(.is-mobile) {
  color: var(--dex-okd-tabs-muted-pane-green-label-active-color)
}

.dex-tabs-pane-green.dex-tabs-pane-segmented {
  color: var(--dex-okd-tabs-segmented-pane-common-label-color)
}

.dex-tabs-pane-green.dex-tabs-pane-segmented-active {
  background-color: var(--dex-okd-tabs-segmented-pane-green-bg-active-color);
  color: var(--dex-okd-tabs-segmented-pane-green-label-active-color)
}

.dex-tabs-pane-green.dex-tabs-pane-segmented-active:focus-visible {
  outline: 2px solid var(--dex-okd-color-border-focus);
  outline-color: var(--dex-okd-tabs-segmented-pane-green-label-active-color);
  outline-offset: -4px;
  outline-style: solid;
  outline-width: 2px
}

.dex-tabs-pane-list-green .dex-tabs-transitions-underline {
  background-color: var(--dex-okd-tabs-underline-pane-green-border-active-color)
}

.dex-tabs-pane.dex-tabs-pane-red-no-border.dex-tabs-pane-underline-active {
  border-bottom-color: transparent
}

.dex-tabs-pane-red.dex-tabs-pane-underline {
  color: var(--dex-okd-tabs-underline-pane-common-label-color)
}

.dex-tabs-pane-red.dex-tabs-pane-underline:focus-visible {
  outline: 2px solid var(--dex-okd-color-border-focus);
  outline-color: var(--dex-okd-color-border-focus);
  outline-offset: -2px;
  outline-style: solid;
  outline-width: 2px
}

.dex-tabs-pane-red.dex-tabs-pane-underline-active {
  border-bottom-color: var(--dex-okd-tabs-underline-pane-red-border-active-color)
}

.dex-tabs-pane-red.dex-tabs-pane-underline-active,
.dex-tabs-pane-red.dex-tabs-pane-underline:hover:not(.is-mobile) {
  color: var(--dex-okd-tabs-underline-pane-red-label-active-color)
}

.dex-tabs-pane-red.dex-tabs-pane-button {
  color: var(--dex-okd-tabs-button-pane-common-label-color)
}

.dex-tabs-pane-red.dex-tabs-pane-button-active {
  background-color: var(--dex-okd-tabs-button-pane-red-bg-active-color);
  border-color: transparent;
  color: var(--dex-okd-tabs-button-pane-red-label-active-color)
}

.dex-tabs-pane-red.dex-tabs-pane-button:hover:not(.is-mobile) {
  border-color: var(--dex-okd-tabs-button-pane-red-bg-active-color)
}

.dex-tabs-pane-red.dex-tabs-pane-muted {
  color: var(--dex-okd-tabs-muted-pane-common-label-color)
}

.dex-tabs-pane-red.dex-tabs-pane-muted-active {
  border-color: var(--dex-okd-tabs-muted-pane-red-border-active-color)
}

.dex-tabs-pane-red.dex-tabs-pane-muted-active,
.dex-tabs-pane-red.dex-tabs-pane-muted:hover:not(.is-mobile) {
  color: var(--dex-okd-tabs-muted-pane-red-label-active-color)
}

.dex-tabs-pane-red.dex-tabs-pane-segmented {
  color: var(--dex-okd-tabs-segmented-pane-common-label-color)
}

.dex-tabs-pane-red.dex-tabs-pane-segmented-active {
  background-color: var(--dex-okd-tabs-segmented-pane-red-bg-active-color);
  color: var(--dex-okd-tabs-segmented-pane-red-label-active-color)
}

.dex-tabs-pane-red.dex-tabs-pane-segmented-active:focus-visible {
  outline: 2px solid var(--dex-okd-color-border-focus);
  outline-color: var(--dex-okd-tabs-segmented-pane-red-label-active-color);
  outline-offset: -4px;
  outline-style: solid;
  outline-width: 2px
}

.dex-tabs-pane-list-red .dex-tabs-transitions-underline {
  background-color: var(--dex-okd-tabs-underline-pane-red-border-active-color)
}

.dex-tabs-pane {
  align-items: center;
  box-sizing: border-box;
  color: var(--dex-okd-tabs-common-pane-label-color);
  cursor: pointer;
  display: flex;
  font-weight: 500;
  height: 100%;
  justify-content: center;
  text-align: center;
  white-space: nowrap
}

.dex-tabs-pane:focus-visible {
  outline: 2px solid var(--dex-okd-color-border-focus);
  outline-color: var(--dex-okd-color-border-focus);
  outline-offset: -4px;
  outline-style: solid;
  outline-width: 2px
}

.dex-tabs-pane-underline {
  border-bottom: 2px solid transparent;
  padding-top: 2px
}

.dex-tabs-pane.no-active-border {
  border-bottom: none;
  padding-top: 0
}

.dex-tabs-pane-button {
  border: 1px solid var(--dex-okd-tabs-button-pane-common-border-color);
  border-radius: var(--dex-okd-tabs-button-pane-common-border-radius)
}

.dex-tabs-pane-button.dex-tabs-pane-button-no-border {
  border: none
}

.dex-tabs-pane-muted {
  border: 1px solid var(--dex-okd-tabs-muted-pane-common-border-color);
  border-radius: var(--dex-okd-tabs-muted-pane-common-border-radius)
}

.dex-tabs-pane-segmented {
  border-radius: var(--dex-okd-tabs-segmented-pane-common-border-radius);
  line-height: 1
}

.dex-tabs-pane-segmented-active {
  box-shadow: var(--dex-okd-tabs-segmented-pane-common-shadow)
}

.dex-tabs-pane-no-padding {
  padding: 0 !important
}

.dex-tabs .dex-tabs-pane.dex-tabs-pane-spacing {
  margin-right: var(--dex-okd-inner-tabs-spacing)
}

a.dex-tabs-pane {
  text-decoration: none
}

.dex-tabs-panel {
  display: none;
  width: 100%
}

.dex-tabs-panel:focus-visible {
  outline: 2px solid var(--dex-okd-color-border-focus);
  outline-color: var(--dex-okd-color-border-focus);
  outline-offset: -2px;
  outline-style: solid;
  outline-width: 1px
}

.dex-tabs-panel-show {
  display: block
}

.dex-tabs-pane-list {
  box-sizing: border-box;
  display: flex;
  flex-shrink: 0;
  position: relative;
  width: 100%
}

.dex-tabs-pane-list-wrapper {
  display: flex;
  flex: 1 1;
  overflow: hidden;
  position: relative
}

.dex-tabs-pane-list-center {
  justify-content: center
}

.dex-tabs-pane-list-slot {
  height: 100%
}

.dex-tabs-pane-list-container {
  box-sizing: border-box;
  display: flex;
  overflow: scroll;
  position: relative;
  scroll-behavior: smooth;
  scrollbar-width: none
}

.dex-tabs-pane-list-container::-webkit-scrollbar {
  display: none;
  height: 0;
  width: 0
}

.dex-tabs-pane-list-nav {
  --dex-okd-inner-tabs-nav-button-bg-color: var(--dex-okd-tabs-common-pane-nav-icon-bg-color-1);
  cursor: pointer
}

.dex-tabs-pane-list-nav-icon {
  align-items: center;
  background-image: linear-gradient(270deg, var(--dex-okd-inner-tabs-nav-button-bg-color) 72.22%, var(--dex-okd-tabs-common-pane-nav-icon-bg-color-2) 100%);
  color: var(--dex-okd-tabs-common-pane-icon-color);
  display: flex;
  height: 100%;
  justify-content: center;
  position: absolute;
  top: 0;
  width: 36px;
  z-index: 9
}

.dex-tabs-pane-list-nav-icon:hover {
  color: var(--dex-okd-tabs-common-pane-icon-active-color)
}

.dex-tabs-pane-list-nav .icon-left {
  background-image: linear-gradient(-270deg, var(--dex-okd-inner-tabs-nav-button-bg-color) 72.22%, var(--dex-okd-tabs-common-pane-nav-icon-bg-color-2) 100%);
  left: 0
}

.dex-tabs-pane-list-nav .icon-left-inner {
  transform: rotate(180deg)
}

.dex-tabs-pane-list-nav .icon-right {
  right: 0
}

.dex-tabs-pane-list-flex-shrink {
  display: flex;
  flex-shrink: 0;
  position: relative;
  transition: transform .2s
}

.dex-tabs-pane-list-flex {
  flex: 1 1
}

.dex-tabs-pane-list-overflow {
  overflow: unset
}

.dex-tabs-pane-list-average,
.dex-tabs-pane-list-average .dex-tabs-pane {
  flex: 1 1
}

.dex-tabs-pane-list-right-alpha {
  background-image: linear-gradient(90deg, hsla(0, 0%, 100%, 0) 0, var(--dex-okd-tabs-common-pane-icon-bg-color) 100%);
  height: 100%;
  pointer-events: none;
  position: absolute;
  right: 0;
  top: 0;
  width: 20px;
  z-index: 9
}

.dex-tabs-pane-list-underline {
  border-bottom: 1px solid var(--dex-okd-tabs-underline-pane-common-border-color)
}

.dex-tabs-pane-list-underline-no-line {
  border-bottom: none
}

.dex-tabs-pane-list-segmented .dex-tabs-pane-list-container {
  background-color: var(--dex-okd-tabs-segmented-pane-common-list-bg-color);
  border-radius: 4px
}

.dex-tabs-panel-list {
  display: flex;
  flex: auto;
  width: 100%
}

.dex-tabs {
  display: flex;
  flex-direction: column;
  height: 100%;
  width: 100%
}

.dex-tabs-transitions-underline {
  bottom: 0;
  height: 2px;
  left: 0;
  position: absolute;
  transition: all .3s
}

.dex-selection-chips {
  align-items: center;
  background: var(--dex-okd-color-background-surface-primary);
  background: var(--dex-okd-selectionchips-default-background, var(--dex-okd-color-background-surface-primary));
  border: 1px solid transparent;
  box-sizing: border-box;
  color: var(--dex-okd-color-content-primary);
  color: var(--dex-okd-selectionchips-default-font-color, var(--dex-okd-color-content-primary));
  cursor: pointer;
  display: flex;
  justify-content: center;
  text-align: center
}

.dex-selection-chips.hover,
.dex-selection-chips:not(.dex-selection-chips-disabled):not(.dex-selection-chips-focus):hover {
  background: var(--dex-okd-color-background-surface-primary);
  background: var(--dex-okd-selectionchips-hover-background, var(--dex-okd-color-background-surface-primary));
  color: var(--dex-okd-color-content-primary);
  color: var(--dex-okd-selectionchips-hover-font-color, var(--dex-okd-color-content-primary))
}

.dex-selection-chips.active,
.dex-selection-chips:not(.dex-selection-chips-disabled):active {
  background: var(--dex-okd-color-background-surface-pressed);
  background: var(--dex-okd-selectionchips-active-background, var(--dex-okd-color-background-surface-pressed));
  border-color: var(--dex-okd-selectionchips-active-border-color, var(--dex-okd-selectionchips-focus-border-color));
  color: var(--dex-okd-color-content-primary);
  color: var(--dex-okd-selectionchips-active-font-color, var(--dex-okd-color-content-primary))
}

.dex-selection-chips.focus,
.dex-selection-chips:not(.dex-selection-chips-disabled).dex-selection-chips-focus {
  border-color: var(--dex-okd-selectionchips-focus-border-color, var(--dex-okd-color-border-selected))
}

.dex-selection-chips.dex-selection-chips-disabled,
.dex-selection-chips.disabled {
  background: var(--dex-okd-color-background-surface-disable);
  background: var(--dex-okd-selectionchips-disabled-background, var(--dex-okd-color-background-surface-disable));
  color: var(--dex-okd-color-content-disabled);
  color: var(--dex-okd-selectionchips-disabled-font-color, var(--dex-okd-color-content-disabled));
  cursor: not-allowed
}

.dex-selection-chips.dex-selection-chips-md {
  border-radius: 8px;
  border-radius: var(--dex-okd-selectionchips-md-border-radius, 8px);
  font-size: 14px;
  font-size: var(--dex-okd-selectionchips-md-font-size, 14px);
  font-weight: 400;
  font-weight: var(--dex-okd-selectionchips-md-font-weight, 400);
  line-height: 16px;
  line-height: var(--dex-okd-selectionchips-md-line-height, 16px);
  min-height: 36px;
  min-height: var(--dex-okd-selectionchips-md-min-height, 36px);
  min-width: 32px;
  min-width: var(--dex-okd-selectionchips-md-min-width, 32px);
  padding: 8px;
  padding: var(--dex-okd-selectionchips-md-padding-vertical, 8px) var(--dex-okd-selectionchips-md-padding-horizontal, 8px)
}

.dex-selection-chips.dex-selection-chips-lg {
  border-radius: 8px;
  border-radius: var(--dex-okd-selectionchips-lg-border-radius, 8px);
  font-size: 14px;
  font-size: var(--dex-okd-selectionchips-lg-font-size, 14px);
  font-weight: 400;
  font-weight: var(--dex-okd-selectionchips-lg-font-weight, 400);
  line-height: 16px;
  line-height: var(--dex-okd-selectionchips-lg-line-height, 16px);
  min-height: 40px;
  min-height: var(--dex-okd-selectionchips-lg-min-height, 40px);
  min-width: 32px;
  min-width: var(--dex-okd-selectionchips-lg-min-width, 32px);
  padding: 8px;
  padding: var(--dex-okd-selectionchips-lg-padding-vertical, 8px) var(--dex-okd-selectionchips-lg-padding-horizontal, 8px)
}

.dex-selection-chips-truncate {
  -webkit-box-orient: vertical;
  -webkit-line-clamp: 2;
  display: -webkit-box;
  overflow: hidden
}

.dex-selection-chips-group {
  display: flex;
  gap: 8px;
  gap: var(--dex-okd-selectionchips-group-margin-right, 8px)
}

.dex-selection-chips-group .dex-selection-chips .dex-selection-chips-truncate {
  -webkit-line-clamp: 3
}

.dex-select-empty {
  align-items: center;
  display: flex;
  flex-direction: column;
  height: calc(100% - 48px);
  justify-content: center;
  min-height: 160px
}

.dex-select-empty .empty-text {
  color: var(--dex-okd-select-empty-default-text-color)
}

.dex-select-empty .empty-text-sm {
  font-size: var(--dex-okd-select-sm-empty-font-size)
}

.dex-select-empty .empty-text-md {
  font-size: var(--dex-okd-select-md-empty-font-size)
}

.dex-select-empty .empty-text-xs {
  font-size: var(--dex-okd-select-xs-empty-font-size)
}

.dex-select-empty .empty-text-lg {
  font-size: var(--dex-okd-select-md-empty-font-size);
  font-size: var(--dex-okd-select-lg-empty-font-size, var(--dex-okd-select-md-empty-font-size))
}

.dex-select-empty .empty-text-xl {
  font-size: var(--dex-okd-select-md-empty-font-size);
  font-size: var(--dex-okd-select-xl-empty-font-size, var(--dex-okd-select-md-empty-font-size))
}

.dex-select-empty .empty-text-mobile {
  font-size: 14px;
  font-size: var(--dex-okd-select-mobile-empty-font-size, 14px)
}

.dex-select-item {
  align-items: center;
  color: var(--dex-okd-select-option-default-text-color);
  cursor: pointer;
  display: flex;
  font-weight: 400;
  min-width: 90px
}

.dex-select-item.dex-select-item-active {
  background: var(--dex-okd-select-option-active-bg);
  color: var(--dex-okd-select-option-active-text-color)
}

.dex-select-item.hover,
.dex-select-item:hover {
  background: var(--dex-okd-select-option-hover-bg);
  color: var(--dex-okd-select-option-hover-text-color)
}

.dex-select-item.disabled {
  background: var(--dex-okd-select-option-disabled-bg);
  color: var(--dex-okd-select-option-disabled-text-color);
  cursor: not-allowed
}

.dex-select-item.disabled .dex-select-item-check {
  opacity: .2
}

.dex-select-item.align-center {
  justify-content: center
}

.dex-select-item.align-left {
  justify-content: flex-start
}

.dex-select-item.align-right {
  justify-content: flex-end
}

.dex-select-item-check {
  color: var(--dex-okd-select-check-default-icon-color);
  margin-left: auto
}

.dex-select-item-title {
  color: var(--dex-okd-select-common-title-color)
}

.dex-select-item-title-inner {
  display: inline-block
}

.dex-select-item-line {
  border-top: var(--dex-okd-select-option-common-line-height) solid var(--dex-okd-select-option-common-line-color);
  height: 0;
  margin: var(--dex-okd-select-option-common-line-margin-vertical) 0;
  width: 100%
}

.dex-select-item-show-check .dex-select-item-active {
  background: var(--dex-okd-select-option-active-bg)
}

.option-sm .dex-select-item-title {
  font-size: var(--dex-okd-select-sm-title-font-size);
  line-height: var(--dex-okd-select-sm-title-line-height);
  padding: var(--dex-okd-select-sm-title-padding-top) var(--dex-okd-select-sm-title-padding-horizontal) var(--dex-okd-select-sm-title-padding-bottom)
}

.option-sm .dex-select-item {
  font-size: var(--dex-okd-select-sm-option-font-size);
  line-height: var(--dex-okd-select-sm-option-line-height);
  padding: var(--dex-okd-select-sm-option-padding-vertical) var(--dex-okd-select-sm-option-padding-horizontal)
}

.option-sm .dex-select-item-check {
  font-size: 18px;
  font-size: var(--dex-okd-select-sm-option-icon-font-size, 18px);
  padding-left: 8px
}

.option-sm .dex-select-item.custom {
  padding: 0
}

.option-md .dex-select-item-title {
  font-size: var(--dex-okd-select-md-title-font-size);
  line-height: var(--dex-okd-select-md-title-line-height);
  padding: var(--dex-okd-select-md-title-padding-top) var(--dex-okd-select-md-title-padding-horizontal) var(--dex-okd-select-md-title-padding-bottom)
}

.option-md .dex-select-item {
  font-size: var(--dex-okd-select-md-option-font-size);
  line-height: var(--dex-okd-select-md-option-line-height);
  padding: var(--dex-okd-select-md-option-padding-vertical) var(--dex-okd-select-md-option-padding-horizontal)
}

.option-md .dex-select-item-check {
  font-size: 18px;
  font-size: var(--dex-okd-select-md-option-icon-font-size, 18px);
  padding-left: 8px
}

.option-md .dex-select-item.custom {
  padding: 0
}

.option-xs .dex-select-item-title {
  font-size: var(--dex-okd-select-xs-title-font-size);
  line-height: var(--dex-okd-select-xs-title-line-height);
  padding: var(--dex-okd-select-xs-title-padding-top) var(--dex-okd-select-xs-title-padding-horizontal) var(--dex-okd-select-xs-title-padding-bottom)
}

.option-xs .dex-select-item {
  font-size: var(--dex-okd-select-xs-option-font-size);
  line-height: var(--dex-okd-select-xs-option-line-height);
  padding: var(--dex-okd-select-xs-option-padding-vertical) var(--dex-okd-select-xs-option-padding-horizontal)
}

.option-xs .dex-select-item-check {
  font-size: 18px;
  font-size: var(--dex-okd-select-xs-option-icon-font-size, 18px);
  padding-left: 8px
}

.option-xs .dex-select-item.custom {
  padding: 0
}

.option-lg .dex-select-item-title {
  font-size: var(--dex-okd-select-md-title-font-size);
  font-size: var(--dex-okd-select-lg-title-font-size, var(--dex-okd-select-md-title-font-size));
  line-height: var(--dex-okd-select-md-title-line-height);
  line-height: var(--dex-okd-select-lg-title-line-height, var(--dex-okd-select-md-title-line-height));
  padding: var(--dex-okd-select-lg-title-padding-top, var(--dex-okd-select-md-title-padding-top)) var(--dex-okd-select-lg-title-padding-horizontal, var(--dex-okd-select-md-title-padding-horizontal)) var(--dex-okd-select-lg-title-padding-bottom, var(--dex-okd-select-md-title-padding-bottom))
}

.option-lg .dex-select-item {
  font-size: var(--dex-okd-select-md-option-font-size);
  font-size: var(--dex-okd-select-lg-option-font-size, var(--dex-okd-select-md-option-font-size));
  line-height: var(--dex-okd-select-md-option-line-height);
  line-height: var(--dex-okd-select-lg-option-line-height, var(--dex-okd-select-md-option-line-height));
  padding: var(--dex-okd-select-lg-option-padding-vertical, var(--dex-okd-select-md-option-padding-vertical)) var(--dex-okd-select-lg-option-padding-horizontal, var(--dex-okd-select-md-option-padding-horizontal))
}

.option-lg .dex-select-item-check {
  font-size: 18px;
  font-size: var(--dex-okd-select-lg-option-icon-font-size, 18px);
  padding-left: 8px
}

.option-lg .dex-select-item.custom {
  padding: 0
}

.option-xl .dex-select-item-title {
  font-size: var(--dex-okd-select-md-title-font-size);
  font-size: var(--dex-okd-select-xl-title-font-size, var(--dex-okd-select-md-title-font-size));
  line-height: var(--dex-okd-select-md-title-line-height);
  line-height: var(--dex-okd-select-xl-title-line-height, var(--dex-okd-select-md-title-line-height));
  padding: var(--dex-okd-select-xl-title-padding-top, var(--dex-okd-select-md-title-padding-top)) var(--dex-okd-select-xl-title-padding-horizontal, var(--dex-okd-select-md-title-padding-horizontal)) var(--dex-okd-select-xl-title-padding-bottom, var(--dex-okd-select-md-title-padding-bottom))
}

.option-xl .dex-select-item {
  font-size: var(--dex-okd-select-md-option-font-size);
  font-size: var(--dex-okd-select-xl-option-font-size, var(--dex-okd-select-md-option-font-size));
  line-height: var(--dex-okd-select-md-option-line-height);
  line-height: var(--dex-okd-select-xl-option-line-height, var(--dex-okd-select-md-option-line-height));
  padding: var(--dex-okd-select-xl-option-padding-vertical, var(--dex-okd-select-md-option-padding-vertical)) var(--dex-okd-select-xl-option-padding-horizontal, var(--dex-okd-select-md-option-padding-horizontal))
}

.option-xl .dex-select-item-check {
  font-size: 18px;
  font-size: var(--dex-okd-select-xl-option-icon-font-size, 18px);
  padding-left: 8px
}

.option-xl .dex-select-item.custom {
  padding: 0
}

@media (max-width:767px) {
  .dex-select-option:not(.drop-mode) .dex-select-item-container .dex-select-item-title {
    font-size: var(--dex-okd-select-md-title-font-size);
    font-size: var(--dex-okd-select-mobile-option-title-font-size, var(--dex-okd-select-md-title-font-size));
    line-height: var(--dex-okd-select-md-title-line-height);
    line-height: var(--dex-okd-select-mobile-option-title-line-height, var(--dex-okd-select-md-title-line-height));
    padding: var(--dex-okd-select-mobile-option-title-padding-top, var(--dex-okd-select-md-title-padding-top)) var(--dex-okd-select-mobile-option-title-padding-horizontal, var(--dex-okd-select-md-title-padding-horizontal)) var(--dex-okd-select-mobile-option-title-padding-bottom, var(--dex-okd-select-md-title-padding-bottom))
  }

  .dex-select-option:not(.drop-mode) .dex-select-item-container .dex-select-item {
    font-size: 16px;
    font-size: var(--dex-okd-select-mobile-option-font-size, 16px);
    line-height: 20px;
    line-height: var(--dex-okd-select-mobile-option-line-height, 20px);
    padding: 18px 16px;
    padding: var(--dex-okd-select-mobile-option-padding-vertical, 18px) var(--dex-okd-select-mobile-option-padding-horizontal, 16px)
  }

  .dex-select-option:not(.drop-mode) .dex-select-item-container .dex-select-item-check {
    font-size: 24px;
    font-size: var(--dex-okd-select-mobile-option-icon-font-size, 24px)
  }

  .dex-select-option:not(.drop-mode) .dex-select-item-container .dex-select-item.custom {
    padding: 0
  }
}

.dex-select-search.focus .dex-input-box.dex-select-search-box,
.dex-select-search.hover .dex-input-box.dex-select-search-box,
.dex-select-search:focus .dex-input-box.dex-select-search-box,
.dex-select-search:hover .dex-input-box.dex-select-search-box {
  background-color: var(--dex-okd-input-search-default-background);
  border-color: var(--dex-okd-input-search-default-border-color);
  box-shadow: var(--dex-okd-input-search-default-shadow)
}

.dex-select-search .dex-select-search-ellipsis {
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap
}

.dex-select-search .dex-select-search-default-width {
  min-width: 70px;
  width: unset
}

.option-sm .dex-select-empty,
.option-sm .dex-select-search {
  margin: var(--dex-okd-select-sm-search-margin-vertical) var(--dex-okd-select-sm-search-margin-horizontal)
}

.option-md .dex-select-empty,
.option-md .dex-select-search {
  margin: var(--dex-okd-select-md-search-margin-vertical) var(--dex-okd-select-md-search-margin-horizontal)
}

.option-xs .dex-select-empty,
.option-xs .dex-select-search {
  margin: var(--dex-okd-select-xs-search-margin-vertical) var(--dex-okd-select-xs-search-margin-horizontal)
}

.option-lg .dex-select-empty,
.option-lg .dex-select-search {
  margin: var(--dex-okd-select-lg-search-margin-vertical, var(--dex-okd-select-md-search-margin-vertical)) var(--dex-okd-select-lg-search-margin-horizontal, var(--dex-okd-select-md-search-margin-horizontal))
}

.option-xl .dex-select-empty,
.option-xl .dex-select-search {
  margin: var(--dex-okd-select-xl-search-margin-vertical, var(--dex-okd-select-md-search-margin-vertical)) var(--dex-okd-select-xl-search-margin-horizontal, var(--dex-okd-select-md-search-margin-horizontal))
}

.dex-select-tag {
  align-items: center;
  background-color: #f2f2f2;
  background-color: var(--dex-okd-select-tag-default-background, #f2f2f2);
  border-radius: 4px;
  border-radius: var(--dex-okd-select-tag-border-radius, 4px);
  color: #000;
  color: var(--dex-okd-select-tag-text-default-color, #000);
  cursor: unset;
  display: flex;
  justify-content: space-between;
  margin-bottom: 4px;
  margin-bottom: var(--dex-okd-select-tag-margin-bottom, 4px);
  margin-right: 4px;
  margin-right: var(--dex-okd-select-tag-margin-right, 4px);
  max-width: 100%;
  padding-left: 8px;
  padding-left: var(--dex-okd-select-tag-padding-horizontal, 8px);
  padding-right: 8px;
  padding-right: var(--dex-okd-select-tag-padding-horizontal, 8px)
}

.dex-select-tag-icon {
  color: #929292;
  color: var(--dex-okd-select-tag-icon-default-color, #929292);
  cursor: pointer;
  padding-left: 4px;
  padding-left: var(--dex-okd-select-tag-icon-padding-left, 4px)
}

.dex-select-tag-icon:hover {
  color: #000;
  color: var(--dex-okd-select-tag-icon-hover-color, #000)
}

.dex-select-tag-inner {
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap
}

.dex-select-tag.disabled {
  background-color: #f2f2f2;
  background-color: var(--dex-okd-select-tag-disabled-background, #f2f2f2);
  color: #929292;
  color: var(--dex-okd-select-tag-text-disabled-color, #929292);
  pointer-events: none
}

.dex-select-tag-sm {
  font-size: 12px;
  font-size: var(--dex-okd-select-sm-tag-text-font-size, 12px);
  height: 24px;
  height: var(--dex-okd-select-sm-tag-height, 24px);
  line-height: 24px;
  line-height: var(--dex-okd-select-sm-tag-height, 24px)
}

.dex-select-tag-sm .dex-select-tag-icon {
  font-size: 14px;
  font-size: var(--dex-okd-select-sm-tag-icon-font-size, 14px)
}

.dex-select-tag-md {
  font-size: 14px;
  font-size: var(--dex-okd-select-md-tag-text-font-size, 14px);
  height: 32px;
  height: var(--dex-okd-select-md-tag-height, 32px);
  line-height: 32px;
  line-height: var(--dex-okd-select-md-tag-height, 32px)
}

.dex-select-tag-md .dex-select-tag-icon {
  font-size: 16px;
  font-size: var(--dex-okd-select-md-tag-icon-font-size, 16px)
}

.dex-select-tag-xs {
  font-size: 12px;
  font-size: var(--dex-okd-select-xs-tag-text-font-size, 12px);
  height: 20px;
  height: var(--dex-okd-select-xs-tag-height, 20px);
  line-height: 20px;
  line-height: var(--dex-okd-select-xs-tag-height, 20px)
}

.dex-select-tag-xs .dex-select-tag-icon {
  font-size: 10px;
  font-size: var(--dex-okd-select-xs-tag-icon-font-size, 10px)
}

.dex-select-tag-lg {
  font-size: 14px;
  font-size: var(--dex-okd-select-lg-tag-text-font-size, 14px);
  height: 36px;
  height: var(--dex-okd-select-lg-tag-height, 36px);
  line-height: 36px;
  line-height: var(--dex-okd-select-lg-tag-height, 36px)
}

.dex-select-tag-lg .dex-select-tag-icon {
  font-size: 16px;
  font-size: var(--dex-okd-select-lg-tag-icon-font-size, 16px)
}

.dex-select-tag-xl {
  font-size: 14px;
  font-size: var(--dex-okd-select-xl-tag-text-font-size, 14px);
  height: 40px;
  height: var(--dex-okd-select-xl-tag-height, 40px);
  line-height: 40px;
  line-height: var(--dex-okd-select-xl-tag-height, 40px)
}

.dex-select-tag-xl .dex-select-tag-icon {
  font-size: 16px;
  font-size: var(--dex-okd-select-xl-tag-icon-font-size, 16px)
}

.dex-select-footer-dialog>.dex-select-footer {
  align-items: center;
  display: flex
}

.dex-select-footer-dialog>.dex-select-footer>.dex-select-footer-cancel {
  max-width: 30%
}

.dex-select-footer-dialog>.dex-select-footer>.dex-select-footer-confirm {
  margin-left: 12px
}

.dex-select-option-dialog-container {
  background: var(--dex-okd-select-drop-box-bg) !important;
  padding: var(--dex-okd-select-mobile-option-container-padding-vertical) 0
}

.dex-select-option.fixed-height {
  height: calc(100% - 32px);
  max-height: unset
}

.dex-select-option.fixed-height .dex-dialog-scroll-box {
  display: flex;
  flex-direction: column;
  overflow-y: hidden
}

.dex-select-option.fixed-height .dex-dialog-container {
  display: flex;
  flex-direction: column
}

.dex-select-option.fixed-height .dex-select-item-container {
  flex: 1 1
}

.dex-select-option.fixed-height .dex-select-item-container.dex-select-item-container-real {
  -webkit-overflow-scrolling: touch;
  overflow: auto
}

.dex-select-option.fixed-height.dex-select-option-fit-to-height {
  height: unset;
  max-height: calc(100% - 32px)
}

.dex-select-option.fixed-height.dex-select-option-fit-to-height .dex-dialog-container {
  max-height: 100%;
  overflow: auto
}

.dex-select-option-pc {
  cursor: auto;
  display: flex;
  flex-direction: column;
  max-height: 248px;
  padding-top: var(--dex-okd-select-drop-box-margin-top)
}

.dex-select-option-pc .dex-select-option-box {
  background: var(--dex-okd-select-drop-box-bg);
  border: 1px solid var(--dex-okd-select-drop-box-border-color);
  border-radius: var(--dex-okd-select-drop-box-border-radius);
  box-shadow: var(--dex-okd-select-drop-box-shadow);
  display: flex;
  flex-direction: column;
  height: 100%;
  overflow: auto;
  padding: 4px 0
}

.dex-select-option-pc .pc-option-scroll {
  -webkit-overflow-scrolling: touch;
  flex: 1 1;
  overflow: auto
}

.dex-select-option-pc .pc-option-footer {
  border-top: thin solid var(--dex-okd-select-common-border-color);
  padding: 12px 16px
}

.dex-select-option-pc.align-left {
  right: unset
}

.dex-select-option-pc.align-right {
  left: unset
}

.dex-select-option-pc.fixed-height {
  height: unset
}

.dex-select-option-pc.fixed-height .pc-option-scroll {
  display: flex;
  flex: 0 0 auto;
  flex-direction: column;
  height: 276px;
  overflow: hidden
}

.dex-select-option .pc-option-scroll.dex-select-option-pc-fit-to-height {
  height: auto;
  max-height: 292px
}

.dex-select-option-mask {
  z-index: 9800
}

.dex-select .select-popup-reference {
  cursor: pointer;
  position: absolute
}

.dex-select-option-dialog-container>.dex-select-footer-dialog {
  padding: 16px
}

.dex-select-value {
  box-sizing: border-box;
  cursor: pointer;
  font-size: var(--dex-okd-select-md-text-font-size)
}

.dex-select-value-box {
  outline: none
}

.dex-select-value .value {
  align-items: center;
  color: var(--dex-okd-select-common-text-color);
  display: flex;
  margin-right: 8px;
  width: 100%
}

.dex-select-value .placeholder {
  color: var(--dex-okd-input-default-placeholder-color)
}

.dex-select-value .disabled {
  cursor: not-allowed
}

.dex-select-value .disabled .value {
  color: var(--dex-okd-input-disabled-text-color)
}

.dex-select-value .disabled .icon-sign {
  color: var(--dex-okd-select-input-select-default-icon-color);
  color: var(--dex-okd-select-input-select-disabled-icon-color, var(--dex-okd-select-input-select-default-icon-color))
}

.dex-select-value .icon-sign {
  color: var(--dex-okd-select-input-select-default-icon-color);
  font-size: var(--dex-okd-select-input-select-default-icon-size);
  margin-left: auto;
  margin-right: 4px;
  transition: transform .2s linear
}

.dex-select-inner-box {
  cursor: pointer;
  position: relative
}

.dex-select-inner-box input[readonly] {
  cursor: pointer
}

.dex-select-inner-box>.reference-suffix {
  position: absolute;
  right: 4px;
  top: 50%;
  transform: translateY(-50%)
}

.dex-select-tag-container {
  display: flex;
  flex-wrap: wrap;
  margin-right: 4px;
  margin-top: 4px;
  max-width: 100%;
  padding-right: 24px
}

.dex-select-tag-container-responsive {
  display: flex;
  margin-right: 24px;
  margin-top: 4px;
  width: 100%
}

.dex-input-sm .dex-select-inner-box>.reference-suffix {
  right: var(--dex-okd-input-sm-padding-horizontal)
}

.dex-input-sm.dex-select-value {
  font-size: var(--dex-okd-select-sm-text-font-size)
}

.dex-input-md .dex-select-inner-box>.reference-suffix {
  right: var(--dex-okd-input-md-padding-horizontal)
}

.dex-input-md.dex-select-value {
  font-size: var(--dex-okd-select-md-text-font-size)
}

.dex-input-xs .dex-select-inner-box>.reference-suffix {
  right: var(--dex-okd-input-xs-padding-horizontal)
}

.dex-input-xs.dex-select-value {
  font-size: var(--dex-okd-select-xs-text-font-size)
}

.dex-input-lg .dex-select-inner-box>.reference-suffix {
  right: var(--dex-okd-input-lg-padding-horizontal)
}

.dex-input-lg.dex-select-value {
  font-size: var(--dex-okd-select-lg-text-font-size);
  font-size: var(--dex-okd-select-lg-text-font-size, var(--dex-okd-select-lg-text-font-size))
}

.dex-input-xl .dex-select-inner-box>.reference-suffix {
  right: var(--dex-okd-input-xl-padding-horizontal)
}

.dex-input-xl.dex-select-value {
  font-size: var(--dex-okd-select-md-text-font-size);
  font-size: var(--dex-okd-select-xl-text-font-size, var(--dex-okd-select-md-text-font-size))
}

.dex-select-value {
  width: 100%
}

.dex-select-text-value {
  align-items: center;
  box-sizing: border-box;
  cursor: pointer;
  display: flex;
  font-size: var(--dex-okd-select-md-text-font-size);
  justify-content: flex-start
}

.dex-select-text-value.align-right {
  justify-content: flex-end
}

.dex-select-text-value .value {
  align-items: center;
  color: var(--dex-okd-select-text-select-default-font-color);
  display: flex
}

.dex-select-text-value .icon-sign {
  align-items: center;
  color: var(--dex-okd-select-text-select-default-icon-color);
  display: flex;
  font-size: var(--dex-okd-select-text-select-default-icon-size);
  margin-left: 6px;
  margin-right: 0
}

.dex-select-text-value:hover .value {
  color: var(--dex-okd-select-text-select-hover-font-color)
}

.dex-select-text-value:hover .icon-sign {
  color: var(--dex-okd-select-text-select-hover-icon-color)
}

.dex-select-text-value.focus .value {
  color: var(--dex-okd-select-text-select-select-font-color)
}

.dex-select-text-value.focus .icon-sign {
  color: var(--dex-okd-select-text-select-select-icon-color)
}

.dex-select-text-value.disabled {
  cursor: not-allowed
}

.dex-select-text-value.disabled .value {
  color: var(--dex-okd-select-text-select-disabled-font-color)
}

.dex-select-text-value.disabled .icon-sign {
  color: var(--dex-okd-select-text-select-disabled-icon-color)
}

.input-sm.dex-select-text-value {
  font-size: var(--dex-okd-select-sm-text-font-size)
}

.input-md.dex-select-text-value {
  font-size: var(--dex-okd-select-md-text-font-size)
}

.input-xs.dex-select-text-value {
  font-size: var(--dex-okd-select-xs-text-font-size)
}

.input-lg.dex-select-text-value {
  font-size: var(--dex-okd-select-lg-text-font-size);
  font-size: var(--dex-okd-select-lg-text-font-size, var(--dex-okd-select-lg-text-font-size))
}

.input-xl.dex-select-text-value {
  font-size: var(--dex-okd-select-md-text-font-size);
  font-size: var(--dex-okd-select-xl-text-font-size, var(--dex-okd-select-md-text-font-size))
}

.dex-select-value-box:focus-visible .dex-select-a11y-ring {
  outline: 2px solid var(--dex-okd-color-border-focus);
  outline-color: var(--dex-okd-color-border-focus);
  outline-offset: 2px;
  outline-style: solid;
  outline-width: 2px
}

.dex-select-value-box:focus-visible .dex-select-a11y-ring-text {
  border-radius: 4px;
  outline: 2px solid var(--dex-okd-color-border-focus);
  outline-color: var(--dex-okd-color-border-focus);
  outline-offset: 2px;
  outline-style: solid;
  outline-width: 2px
}

.dex-select-value-box.display-area:focus-visible {
  border-radius: 4px;
  outline: 2px solid var(--dex-okd-color-border-focus);
  outline-color: var(--dex-okd-color-border-focus);
  outline-offset: 2px;
  outline-style: solid;
  outline-width: 2px
}

.dex-select .select-up {
  transition: transform .2s linear
}

.dex-select .select-up-active {
  transform: rotate(180deg)
}

.dex-select-reference-icon-clear {
  color: #929292;
  color: var(--dex-okd-select-reference-icon-default-color, #929292);
  display: inline-block;
  margin-right: 4px;
  transition: transform .2s linear
}

.dex-select-reference-icon-clear:hover {
  color: #000;
  color: var(--dex-okd-select-reference-icon-hover-color, #000)
}

.dex-select-reference-icon-clear.disabled {
  pointer-events: none
}

.dex-select-reference-icon {
  display: inline-block
}

.dex-select-reference-icon.dex-select-arrow-icon-sm {
  font-size: 14px;
  font-size: var(--dex-okd-select-sm-arrow-icon-font-size, 14px)
}

.dex-select-reference-icon.dex-select-reference-icon-sm {
  font-size: 14px;
  font-size: var(--dex-okd-select-sm-reference-icon-font-size, 14px)
}

.dex-select-reference-icon.dex-select-arrow-icon-md {
  font-size: 16px;
  font-size: var(--dex-okd-select-md-arrow-icon-font-size, 16px)
}

.dex-select-reference-icon.dex-select-reference-icon-md {
  font-size: 16px;
  font-size: var(--dex-okd-select-md-reference-icon-font-size, 16px)
}

.dex-select-reference-icon.dex-select-arrow-icon-xs {
  font-size: 14px;
  font-size: var(--dex-okd-select-xs-arrow-icon-font-size, 14px)
}

.dex-select-reference-icon.dex-select-reference-icon-xs {
  font-size: 14px;
  font-size: var(--dex-okd-select-xs-reference-icon-font-size, 14px)
}

.dex-select-reference-icon.dex-select-arrow-icon-lg {
  font-size: 16px;
  font-size: var(--dex-okd-select-lg-arrow-icon-font-size, 16px)
}

.dex-select-reference-icon.dex-select-reference-icon-lg {
  font-size: 16px;
  font-size: var(--dex-okd-select-lg-reference-icon-font-size, 16px)
}

.dex-select-reference-icon.dex-select-arrow-icon-xl {
  font-size: 16px;
  font-size: var(--dex-okd-select-xl-arrow-icon-font-size, 16px)
}

.dex-select-reference-icon.dex-select-reference-icon-xl {
  font-size: 16px;
  font-size: var(--dex-okd-select-xl-reference-icon-font-size, 16px)
}

.dex-select {
  box-sizing: border-box;
  position: relative
}

.dex-select.select-text {
  display: inline-block
}

.dex-slider {
  display: flex
}

.dex-slider div {
  box-sizing: border-box
}

.dex-slider-content {
  display: flex;
  flex: 1 1;
  flex-direction: column;
  padding: 5px 8px
}

.dex-slider-total {
  align-items: center;
  display: flex;
  margin-left: 16px;
  width: 48px
}

.dex-slider-label {
  color: var(--dex-okd-slider-label-color);
  font-size: var(--dex-okd-slider-label-font-size);
  line-height: var(--dex-okd-slider-label-line-height)
}

.dex-slider-desc {
  color: var(--dex-okd-slider-desc-color);
  font-size: var(--dex-okd-slider-desc-font-size);
  line-height: var(--dex-okd-slider-desc-line-height);
  margin-top: 6px;
  margin-top: var(--dex-okd-slider-desc-margin-top, 6px)
}

.dex-slider-clickable {
  align-items: center;
  cursor: pointer;
  display: flex;
  height: 10px;
  margin: 10px 0
}

.dex-slider-clickable-margin {
  margin-bottom: 20px
}

.dex-slider-track {
  background: var(--dex-okd-slider-common-track-color);
  border-radius: 3px;
  height: var(--dex-okd-slider-md-track-height);
  position: relative;
  width: 100%
}

.dex-slider-mark {
  background-color: var(--dex-okd-slider-common-active-color);
  border-radius: 3px;
  height: 100%;
  position: absolute
}

.dex-slider-mark-node {
  align-items: center;
  background: var(--dex-okd-slider-node-bg-color);
  border: 1px solid var(--dex-okd-slider-node-border-color);
  border-radius: 100%;
  cursor: pointer;
  display: flex;
  height: var(--dex-okd-slider-md-node-size);
  justify-content: center;
  position: absolute;
  top: 50%;
  transform: translate(-50%, -50%);
  width: var(--dex-okd-slider-md-node-size)
}

.dex-slider-mark-node-text {
  color: var(--dex-okd-slider-common-text-color);
  font-size: 12px;
  left: 50%;
  line-height: 20px;
  position: absolute;
  top: 14px;
  top: var(--dex-okd-slider-common-top, 14px);
  transform: translateX(-50%);
  word-break: keep-all
}

.dex-slider-mark-node:last-child .dex-slider-mark-node-text {
  left: auto;
  right: 0;
  transform: none
}

.dex-slider-mark-node:first-child .dex-slider-mark-node-text {
  left: 0;
  transform: none
}

.dex-slider-mark-node-active {
  border-color: var(--dex-okd-slider-common-active-color)
}

.dex-slider-mark-node-active .dex-slider-mark-node-text {
  color: var(--dex-okd-slider-common-text-color);
  color: var(--dex-okd-slider-common-text-active-color, var(--dex-okd-slider-common-text-color))
}

.dex-slider-mark-node-no-circle {
  background: none;
  border: none
}

.dex-slider-handler {
  align-items: center;
  border-radius: 100%;
  cursor: pointer;
  display: flex;
  justify-content: center;
  position: absolute;
  top: 50%;
  transform: translate(-50%, -50%)
}

.dex-slider-handler:focus-visible {
  border-radius: 20px;
  outline: 2px solid var(--dex-okd-color-border-focus);
  outline-color: var(--dex-okd-color-border-focus);
  outline-offset: 2px;
  outline-style: solid;
  outline-width: 2px
}

.dex-slider-handler-inner {
  background-color: #fff;
  background-color: var(--dex-okd-slider-handler-bg-color, #fff);
  border: 2px solid var(--dex-okd-slider-handler-border-color);
  border-radius: 100%;
  height: var(--dex-okd-slider-md-handler-size);
  width: var(--dex-okd-slider-md-handler-size)
}

.dex-slider-handler-inner.dex-slider-active,
.dex-slider-handler-inner:hover {
  height: var(--dex-okd-slider-md-handler-hover-size);
  width: var(--dex-okd-slider-md-handler-hover-size)
}

.dex-slider-handler-inner.dex-slider-active {
  border: 4px solid var(--dex-okd-slider-handler-shadow-color)
}

.dex-slider-disabled {
  cursor: not-allowed
}

.dex-slider-disabled .dex-slider-handler-inner {
  border-color: var(--dex-okd-slider-handler-border-disabled-color, var(--dex-okd-slider-handler-border-color))
}

.dex-slider-disabled .dex-slider-handler-inner:hover {
  height: var(--dex-okd-slider-md-handler-size);
  width: var(--dex-okd-slider-md-handler-size)
}

.dex-slider-disabled .dex-slider-mark {
  background-color: var(--dex-okd-slider-common-active-color);
  background-color: var(--dex-okd-slider-common-disabled-active-color, var(--dex-okd-slider-common-active-color))
}

.dex-slider-disabled .dex-slider-mark-node-active {
  border-color: var(--dex-okd-slider-common-disabled-active-color, var(--dex-okd-slider-common-active-color))
}

.dex-slider-disabled .dex-slider-mark-node-active .dex-slider-mark-node-text {
  color: var(--dex-okd-slider-common-text-color);
  color: var(--dex-okd-slider-common-text-disabled-active-color, var(--dex-okd-slider-common-text-color))
}

.dex-slider-sm .dex-slider-track {
  height: var(--dex-okd-slider-sm-track-height)
}

.dex-slider-sm .dex-slider-mark-node {
  background: var(--dex-okd-slider-node-bg-color);
  border: 1px solid var(--dex-okd-slider-node-border-color);
  height: var(--dex-okd-slider-sm-node-size);
  width: var(--dex-okd-slider-sm-node-size)
}

.dex-slider-sm .dex-slider-mark-node-active {
  border: 1px solid var(--dex-okd-slider-common-active-color)
}

.dex-slider-sm .dex-slider-mark-node-text {
  top: 14px;
  top: var(--dex-okd-slider-sm-node-text-top, 14px)
}

.dex-slider-sm .dex-slider-handler-inner {
  border: 2px solid var(--dex-okd-slider-handler-border-color);
  height: var(--dex-okd-slider-sm-handler-size);
  width: var(--dex-okd-slider-sm-handler-size)
}

.dex-slider-sm .dex-slider-handler-inner:hover {
  height: var(--dex-okd-slider-sm-handler-hover-size);
  width: var(--dex-okd-slider-sm-handler-hover-size)
}

.dex-slider-sm .dex-slider-handler-inner.dex-slider-active {
  border-width: 2px
}

.dex-slider-sm .dex-slider-active {
  height: var(--dex-okd-slider-sm-handler-hover-size);
  width: var(--dex-okd-slider-sm-handler-hover-size)
}

.dex-slider-sm .dex-slider-disabled {
  cursor: not-allowed
}

.dex-slider-sm .dex-slider-disabled .dex-slider-handler-inner {
  border-color: var(--dex-okd-slider-handler-border-disabled-color, var(--dex-okd-slider-handler-border-color))
}

.dex-slider-sm .dex-slider-disabled .dex-slider-handler-inner:hover {
  height: var(--dex-okd-slider-sm-handler-size);
  width: var(--dex-okd-slider-sm-handler-size)
}

.dex-slider-sm .dex-slider-disabled .dex-slider-mark {
  background-color: var(--dex-okd-slider-common-active-color);
  background-color: var(--dex-okd-slider-common-disabled-active-color, var(--dex-okd-slider-common-active-color))
}

.dex-slider-sm .dex-slider-disabled .dex-slider-mark-node-active {
  border-color: var(--dex-okd-slider-common-disabled-active-color, var(--dex-okd-slider-common-active-color))
}

.dex-slider-sm .dex-slider-disabled .dex-slider-mark-node-active .dex-slider-mark-node-text {
  color: var(--dex-okd-slider-common-text-color);
  color: var(--dex-okd-slider-common-text-disabled-active-color, var(--dex-okd-slider-common-text-color))
}

.dex-selection-chips {
  align-items: center;
  background: var(--dex-okd-color-background-surface-primary);
  background: var(--dex-okd-selectionchips-default-background, var(--dex-okd-color-background-surface-primary));
  border: 1px solid transparent;
  box-sizing: border-box;
  color: var(--dex-okd-color-content-primary);
  color: var(--dex-okd-selectionchips-default-font-color, var(--dex-okd-color-content-primary));
  cursor: pointer;
  display: flex;
  justify-content: center;
  text-align: center
}

.dex-selection-chips.hover,
.dex-selection-chips:not(.dex-selection-chips-disabled):not(.dex-selection-chips-focus):hover {
  background: var(--dex-okd-color-background-surface-primary);
  background: var(--dex-okd-selectionchips-hover-background, var(--dex-okd-color-background-surface-primary));
  color: var(--dex-okd-color-content-primary);
  color: var(--dex-okd-selectionchips-hover-font-color, var(--dex-okd-color-content-primary))
}

.dex-selection-chips.active,
.dex-selection-chips:not(.dex-selection-chips-disabled):active {
  background: var(--dex-okd-color-background-surface-pressed);
  background: var(--dex-okd-selectionchips-active-background, var(--dex-okd-color-background-surface-pressed));
  border-color: var(--dex-okd-selectionchips-active-border-color, var(--dex-okd-selectionchips-focus-border-color));
  color: var(--dex-okd-color-content-primary);
  color: var(--dex-okd-selectionchips-active-font-color, var(--dex-okd-color-content-primary))
}

.dex-selection-chips.focus,
.dex-selection-chips:not(.dex-selection-chips-disabled).dex-selection-chips-focus {
  border-color: var(--dex-okd-selectionchips-focus-border-color, var(--dex-okd-color-border-selected))
}

.dex-selection-chips.dex-selection-chips-disabled,
.dex-selection-chips.disabled {
  background: var(--dex-okd-color-background-surface-disable);
  background: var(--dex-okd-selectionchips-disabled-background, var(--dex-okd-color-background-surface-disable));
  color: var(--dex-okd-color-content-disabled);
  color: var(--dex-okd-selectionchips-disabled-font-color, var(--dex-okd-color-content-disabled));
  cursor: not-allowed
}

.dex-selection-chips.dex-selection-chips-md {
  border-radius: 8px;
  border-radius: var(--dex-okd-selectionchips-md-border-radius, 8px);
  font-size: 14px;
  font-size: var(--dex-okd-selectionchips-md-font-size, 14px);
  font-weight: 400;
  font-weight: var(--dex-okd-selectionchips-md-font-weight, 400);
  line-height: 16px;
  line-height: var(--dex-okd-selectionchips-md-line-height, 16px);
  min-height: 36px;
  min-height: var(--dex-okd-selectionchips-md-min-height, 36px);
  min-width: 32px;
  min-width: var(--dex-okd-selectionchips-md-min-width, 32px);
  padding: 8px;
  padding: var(--dex-okd-selectionchips-md-padding-vertical, 8px) var(--dex-okd-selectionchips-md-padding-horizontal, 8px)
}

.dex-selection-chips.dex-selection-chips-lg {
  border-radius: 8px;
  border-radius: var(--dex-okd-selectionchips-lg-border-radius, 8px);
  font-size: 14px;
  font-size: var(--dex-okd-selectionchips-lg-font-size, 14px);
  font-weight: 400;
  font-weight: var(--dex-okd-selectionchips-lg-font-weight, 400);
  line-height: 16px;
  line-height: var(--dex-okd-selectionchips-lg-line-height, 16px);
  min-height: 40px;
  min-height: var(--dex-okd-selectionchips-lg-min-height, 40px);
  min-width: 32px;
  min-width: var(--dex-okd-selectionchips-lg-min-width, 32px);
  padding: 8px;
  padding: var(--dex-okd-selectionchips-lg-padding-vertical, 8px) var(--dex-okd-selectionchips-lg-padding-horizontal, 8px)
}

.dex-selection-chips-truncate {
  -webkit-box-orient: vertical;
  -webkit-line-clamp: 2;
  display: -webkit-box;
  overflow: hidden
}

.dex-selection-chips-group {
  display: flex;
  gap: 8px;
  gap: var(--dex-okd-selectionchips-group-margin-right, 8px)
}

.dex-selection-chips-group .dex-selection-chips .dex-selection-chips-truncate {
  -webkit-line-clamp: 3
}

.dex-select-empty {
  align-items: center;
  display: flex;
  flex-direction: column;
  height: calc(100% - 48px);
  justify-content: center;
  min-height: 160px
}

.dex-select-empty .empty-text {
  color: var(--dex-okd-select-empty-default-text-color)
}

.dex-select-empty .empty-text-sm {
  font-size: var(--dex-okd-select-sm-empty-font-size)
}

.dex-select-empty .empty-text-md {
  font-size: var(--dex-okd-select-md-empty-font-size)
}

.dex-select-empty .empty-text-xs {
  font-size: var(--dex-okd-select-xs-empty-font-size)
}

.dex-select-empty .empty-text-lg {
  font-size: var(--dex-okd-select-md-empty-font-size);
  font-size: var(--dex-okd-select-lg-empty-font-size, var(--dex-okd-select-md-empty-font-size))
}

.dex-select-empty .empty-text-xl {
  font-size: var(--dex-okd-select-md-empty-font-size);
  font-size: var(--dex-okd-select-xl-empty-font-size, var(--dex-okd-select-md-empty-font-size))
}

.dex-select-empty .empty-text-mobile {
  font-size: 14px;
  font-size: var(--dex-okd-select-mobile-empty-font-size, 14px)
}

.dex-select-item {
  align-items: center;
  color: var(--dex-okd-select-option-default-text-color);
  cursor: pointer;
  display: flex;
  font-weight: 400;
  min-width: 90px
}

.dex-select-item.dex-select-item-active {
  background: var(--dex-okd-select-option-active-bg);
  color: var(--dex-okd-select-option-active-text-color)
}

.dex-select-item.hover,
.dex-select-item:hover {
  background: var(--dex-okd-select-option-hover-bg);
  color: var(--dex-okd-select-option-hover-text-color)
}

.dex-select-item.disabled {
  background: var(--dex-okd-select-option-disabled-bg);
  color: var(--dex-okd-select-option-disabled-text-color);
  cursor: not-allowed
}

.dex-select-item.disabled .dex-select-item-check {
  opacity: .2
}

.dex-select-item.align-center {
  justify-content: center
}

.dex-select-item.align-left {
  justify-content: flex-start
}

.dex-select-item.align-right {
  justify-content: flex-end
}

.dex-select-item-check {
  color: var(--dex-okd-select-check-default-icon-color);
  margin-left: auto
}

.dex-select-item-title {
  color: var(--dex-okd-select-common-title-color)
}

.dex-select-item-title-inner {
  display: inline-block
}

.dex-select-item-line {
  border-top: var(--dex-okd-select-option-common-line-height) solid var(--dex-okd-select-option-common-line-color);
  height: 0;
  margin: var(--dex-okd-select-option-common-line-margin-vertical) 0;
  width: 100%
}

.dex-select-item-show-check .dex-select-item-active {
  background: var(--dex-okd-select-option-active-bg)
}

.option-sm .dex-select-item-title {
  font-size: var(--dex-okd-select-sm-title-font-size);
  line-height: var(--dex-okd-select-sm-title-line-height);
  padding: var(--dex-okd-select-sm-title-padding-top) var(--dex-okd-select-sm-title-padding-horizontal) var(--dex-okd-select-sm-title-padding-bottom)
}

.option-sm .dex-select-item {
  font-size: var(--dex-okd-select-sm-option-font-size);
  line-height: var(--dex-okd-select-sm-option-line-height);
  padding: var(--dex-okd-select-sm-option-padding-vertical) var(--dex-okd-select-sm-option-padding-horizontal)
}

.option-sm .dex-select-item-check {
  font-size: 18px;
  font-size: var(--dex-okd-select-sm-option-icon-font-size, 18px);
  padding-left: 8px
}

.option-sm .dex-select-item.custom {
  padding: 0
}

.option-md .dex-select-item-title {
  font-size: var(--dex-okd-select-md-title-font-size);
  line-height: var(--dex-okd-select-md-title-line-height);
  padding: var(--dex-okd-select-md-title-padding-top) var(--dex-okd-select-md-title-padding-horizontal) var(--dex-okd-select-md-title-padding-bottom)
}

.option-md .dex-select-item {
  font-size: var(--dex-okd-select-md-option-font-size);
  line-height: var(--dex-okd-select-md-option-line-height);
  padding: var(--dex-okd-select-md-option-padding-vertical) var(--dex-okd-select-md-option-padding-horizontal)
}

.option-md .dex-select-item-check {
  font-size: 18px;
  font-size: var(--dex-okd-select-md-option-icon-font-size, 18px);
  padding-left: 8px
}

.option-md .dex-select-item.custom {
  padding: 0
}

.option-xs .dex-select-item-title {
  font-size: var(--dex-okd-select-xs-title-font-size);
  line-height: var(--dex-okd-select-xs-title-line-height);
  padding: var(--dex-okd-select-xs-title-padding-top) var(--dex-okd-select-xs-title-padding-horizontal) var(--dex-okd-select-xs-title-padding-bottom)
}

.option-xs .dex-select-item {
  font-size: var(--dex-okd-select-xs-option-font-size);
  line-height: var(--dex-okd-select-xs-option-line-height);
  padding: var(--dex-okd-select-xs-option-padding-vertical) var(--dex-okd-select-xs-option-padding-horizontal)
}

.option-xs .dex-select-item-check {
  font-size: 18px;
  font-size: var(--dex-okd-select-xs-option-icon-font-size, 18px);
  padding-left: 8px
}

.option-xs .dex-select-item.custom {
  padding: 0
}

.option-lg .dex-select-item-title {
  font-size: var(--dex-okd-select-md-title-font-size);
  font-size: var(--dex-okd-select-lg-title-font-size, var(--dex-okd-select-md-title-font-size));
  line-height: var(--dex-okd-select-md-title-line-height);
  line-height: var(--dex-okd-select-lg-title-line-height, var(--dex-okd-select-md-title-line-height));
  padding: var(--dex-okd-select-lg-title-padding-top, var(--dex-okd-select-md-title-padding-top)) var(--dex-okd-select-lg-title-padding-horizontal, var(--dex-okd-select-md-title-padding-horizontal)) var(--dex-okd-select-lg-title-padding-bottom, var(--dex-okd-select-md-title-padding-bottom))
}

.option-lg .dex-select-item {
  font-size: var(--dex-okd-select-md-option-font-size);
  font-size: var(--dex-okd-select-lg-option-font-size, var(--dex-okd-select-md-option-font-size));
  line-height: var(--dex-okd-select-md-option-line-height);
  line-height: var(--dex-okd-select-lg-option-line-height, var(--dex-okd-select-md-option-line-height));
  padding: var(--dex-okd-select-lg-option-padding-vertical, var(--dex-okd-select-md-option-padding-vertical)) var(--dex-okd-select-lg-option-padding-horizontal, var(--dex-okd-select-md-option-padding-horizontal))
}

.option-lg .dex-select-item-check {
  font-size: 18px;
  font-size: var(--dex-okd-select-lg-option-icon-font-size, 18px);
  padding-left: 8px
}

.option-lg .dex-select-item.custom {
  padding: 0
}

.option-xl .dex-select-item-title {
  font-size: var(--dex-okd-select-md-title-font-size);
  font-size: var(--dex-okd-select-xl-title-font-size, var(--dex-okd-select-md-title-font-size));
  line-height: var(--dex-okd-select-md-title-line-height);
  line-height: var(--dex-okd-select-xl-title-line-height, var(--dex-okd-select-md-title-line-height));
  padding: var(--dex-okd-select-xl-title-padding-top, var(--dex-okd-select-md-title-padding-top)) var(--dex-okd-select-xl-title-padding-horizontal, var(--dex-okd-select-md-title-padding-horizontal)) var(--dex-okd-select-xl-title-padding-bottom, var(--dex-okd-select-md-title-padding-bottom))
}

.option-xl .dex-select-item {
  font-size: var(--dex-okd-select-md-option-font-size);
  font-size: var(--dex-okd-select-xl-option-font-size, var(--dex-okd-select-md-option-font-size));
  line-height: var(--dex-okd-select-md-option-line-height);
  line-height: var(--dex-okd-select-xl-option-line-height, var(--dex-okd-select-md-option-line-height));
  padding: var(--dex-okd-select-xl-option-padding-vertical, var(--dex-okd-select-md-option-padding-vertical)) var(--dex-okd-select-xl-option-padding-horizontal, var(--dex-okd-select-md-option-padding-horizontal))
}

.option-xl .dex-select-item-check {
  font-size: 18px;
  font-size: var(--dex-okd-select-xl-option-icon-font-size, 18px);
  padding-left: 8px
}

.option-xl .dex-select-item.custom {
  padding: 0
}

@media (max-width:767px) {
  .dex-select-option:not(.drop-mode) .dex-select-item-container .dex-select-item-title {
    font-size: var(--dex-okd-select-md-title-font-size);
    font-size: var(--dex-okd-select-mobile-option-title-font-size, var(--dex-okd-select-md-title-font-size));
    line-height: var(--dex-okd-select-md-title-line-height);
    line-height: var(--dex-okd-select-mobile-option-title-line-height, var(--dex-okd-select-md-title-line-height));
    padding: var(--dex-okd-select-mobile-option-title-padding-top, var(--dex-okd-select-md-title-padding-top)) var(--dex-okd-select-mobile-option-title-padding-horizontal, var(--dex-okd-select-md-title-padding-horizontal)) var(--dex-okd-select-mobile-option-title-padding-bottom, var(--dex-okd-select-md-title-padding-bottom))
  }

  .dex-select-option:not(.drop-mode) .dex-select-item-container .dex-select-item {
    font-size: 16px;
    font-size: var(--dex-okd-select-mobile-option-font-size, 16px);
    line-height: 20px;
    line-height: var(--dex-okd-select-mobile-option-line-height, 20px);
    padding: 18px 16px;
    padding: var(--dex-okd-select-mobile-option-padding-vertical, 18px) var(--dex-okd-select-mobile-option-padding-horizontal, 16px)
  }

  .dex-select-option:not(.drop-mode) .dex-select-item-container .dex-select-item-check {
    font-size: 24px;
    font-size: var(--dex-okd-select-mobile-option-icon-font-size, 24px)
  }

  .dex-select-option:not(.drop-mode) .dex-select-item-container .dex-select-item.custom {
    padding: 0
  }
}

.dex-select-search.focus .dex-input-box.dex-select-search-box,
.dex-select-search.hover .dex-input-box.dex-select-search-box,
.dex-select-search:focus .dex-input-box.dex-select-search-box,
.dex-select-search:hover .dex-input-box.dex-select-search-box {
  background-color: var(--dex-okd-input-search-default-background);
  border-color: var(--dex-okd-input-search-default-border-color);
  box-shadow: var(--dex-okd-input-search-default-shadow)
}

.dex-select-search .dex-select-search-ellipsis {
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap
}

.dex-select-search .dex-select-search-default-width {
  min-width: 70px;
  width: unset
}

.option-sm .dex-select-empty,
.option-sm .dex-select-search {
  margin: var(--dex-okd-select-sm-search-margin-vertical) var(--dex-okd-select-sm-search-margin-horizontal)
}

.option-md .dex-select-empty,
.option-md .dex-select-search {
  margin: var(--dex-okd-select-md-search-margin-vertical) var(--dex-okd-select-md-search-margin-horizontal)
}

.option-xs .dex-select-empty,
.option-xs .dex-select-search {
  margin: var(--dex-okd-select-xs-search-margin-vertical) var(--dex-okd-select-xs-search-margin-horizontal)
}

.option-lg .dex-select-empty,
.option-lg .dex-select-search {
  margin: var(--dex-okd-select-lg-search-margin-vertical, var(--dex-okd-select-md-search-margin-vertical)) var(--dex-okd-select-lg-search-margin-horizontal, var(--dex-okd-select-md-search-margin-horizontal))
}

.option-xl .dex-select-empty,
.option-xl .dex-select-search {
  margin: var(--dex-okd-select-xl-search-margin-vertical, var(--dex-okd-select-md-search-margin-vertical)) var(--dex-okd-select-xl-search-margin-horizontal, var(--dex-okd-select-md-search-margin-horizontal))
}

.dex-select-tag {
  align-items: center;
  background-color: #f2f2f2;
  background-color: var(--dex-okd-select-tag-default-background, #f2f2f2);
  border-radius: 4px;
  border-radius: var(--dex-okd-select-tag-border-radius, 4px);
  color: #000;
  color: var(--dex-okd-select-tag-text-default-color, #000);
  cursor: unset;
  display: flex;
  justify-content: space-between;
  margin-bottom: 4px;
  margin-bottom: var(--dex-okd-select-tag-margin-bottom, 4px);
  margin-right: 4px;
  margin-right: var(--dex-okd-select-tag-margin-right, 4px);
  max-width: 100%;
  padding-left: 8px;
  padding-left: var(--dex-okd-select-tag-padding-horizontal, 8px);
  padding-right: 8px;
  padding-right: var(--dex-okd-select-tag-padding-horizontal, 8px)
}

.dex-select-tag-icon {
  color: #929292;
  color: var(--dex-okd-select-tag-icon-default-color, #929292);
  cursor: pointer;
  padding-left: 4px;
  padding-left: var(--dex-okd-select-tag-icon-padding-left, 4px)
}

.dex-select-tag-icon:hover {
  color: #000;
  color: var(--dex-okd-select-tag-icon-hover-color, #000)
}

.dex-select-tag-inner {
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap
}

.dex-select-tag.disabled {
  background-color: #f2f2f2;
  background-color: var(--dex-okd-select-tag-disabled-background, #f2f2f2);
  color: #929292;
  color: var(--dex-okd-select-tag-text-disabled-color, #929292);
  pointer-events: none
}

.dex-select-tag-sm {
  font-size: 12px;
  font-size: var(--dex-okd-select-sm-tag-text-font-size, 12px);
  height: 24px;
  height: var(--dex-okd-select-sm-tag-height, 24px);
  line-height: 24px;
  line-height: var(--dex-okd-select-sm-tag-height, 24px)
}

.dex-select-tag-sm .dex-select-tag-icon {
  font-size: 14px;
  font-size: var(--dex-okd-select-sm-tag-icon-font-size, 14px)
}

.dex-select-tag-md {
  font-size: 14px;
  font-size: var(--dex-okd-select-md-tag-text-font-size, 14px);
  height: 32px;
  height: var(--dex-okd-select-md-tag-height, 32px);
  line-height: 32px;
  line-height: var(--dex-okd-select-md-tag-height, 32px)
}

.dex-select-tag-md .dex-select-tag-icon {
  font-size: 16px;
  font-size: var(--dex-okd-select-md-tag-icon-font-size, 16px)
}

.dex-select-tag-xs {
  font-size: 12px;
  font-size: var(--dex-okd-select-xs-tag-text-font-size, 12px);
  height: 20px;
  height: var(--dex-okd-select-xs-tag-height, 20px);
  line-height: 20px;
  line-height: var(--dex-okd-select-xs-tag-height, 20px)
}

.dex-select-tag-xs .dex-select-tag-icon {
  font-size: 10px;
  font-size: var(--dex-okd-select-xs-tag-icon-font-size, 10px)
}

.dex-select-tag-lg {
  font-size: 14px;
  font-size: var(--dex-okd-select-lg-tag-text-font-size, 14px);
  height: 36px;
  height: var(--dex-okd-select-lg-tag-height, 36px);
  line-height: 36px;
  line-height: var(--dex-okd-select-lg-tag-height, 36px)
}

.dex-select-tag-lg .dex-select-tag-icon {
  font-size: 16px;
  font-size: var(--dex-okd-select-lg-tag-icon-font-size, 16px)
}

.dex-select-tag-xl {
  font-size: 14px;
  font-size: var(--dex-okd-select-xl-tag-text-font-size, 14px);
  height: 40px;
  height: var(--dex-okd-select-xl-tag-height, 40px);
  line-height: 40px;
  line-height: var(--dex-okd-select-xl-tag-height, 40px)
}

.dex-select-tag-xl .dex-select-tag-icon {
  font-size: 16px;
  font-size: var(--dex-okd-select-xl-tag-icon-font-size, 16px)
}

.dex-select-footer-dialog>.dex-select-footer {
  align-items: center;
  display: flex
}

.dex-select-footer-dialog>.dex-select-footer>.dex-select-footer-cancel {
  max-width: 30%
}

.dex-select-footer-dialog>.dex-select-footer>.dex-select-footer-confirm {
  margin-left: 12px
}

.dex-select-option-dialog-container {
  background: var(--dex-okd-select-drop-box-bg) !important;
  padding: var(--dex-okd-select-mobile-option-container-padding-vertical) 0
}

.dex-select-option.fixed-height {
  height: calc(100% - 32px);
  max-height: unset
}

.dex-select-option.fixed-height .dex-dialog-scroll-box {
  display: flex;
  flex-direction: column;
  overflow-y: hidden
}

.dex-select-option.fixed-height .dex-dialog-container {
  display: flex;
  flex-direction: column
}

.dex-select-option.fixed-height .dex-select-item-container {
  flex: 1 1
}

.dex-select-option.fixed-height .dex-select-item-container.dex-select-item-container-real {
  -webkit-overflow-scrolling: touch;
  overflow: auto
}

.dex-select-option.fixed-height.dex-select-option-fit-to-height {
  height: unset;
  max-height: calc(100% - 32px)
}

.dex-select-option.fixed-height.dex-select-option-fit-to-height .dex-dialog-container {
  max-height: 100%;
  overflow: auto
}

.dex-select-option-pc {
  cursor: auto;
  display: flex;
  flex-direction: column;
  max-height: 248px;
  padding-top: var(--dex-okd-select-drop-box-margin-top)
}

.dex-select-option-pc .dex-select-option-box {
  background: var(--dex-okd-select-drop-box-bg);
  border: 1px solid var(--dex-okd-select-drop-box-border-color);
  border-radius: var(--dex-okd-select-drop-box-border-radius);
  box-shadow: var(--dex-okd-select-drop-box-shadow);
  display: flex;
  flex-direction: column;
  height: 100%;
  overflow: auto;
  padding: 4px 0
}

.dex-select-option-pc .pc-option-scroll {
  -webkit-overflow-scrolling: touch;
  flex: 1 1;
  overflow: auto
}

.dex-select-option-pc .pc-option-footer {
  border-top: thin solid var(--dex-okd-select-common-border-color);
  padding: 12px 16px
}

.dex-select-option-pc.align-left {
  right: unset
}

.dex-select-option-pc.align-right {
  left: unset
}

.dex-select-option-pc.fixed-height {
  height: unset
}

.dex-select-option-pc.fixed-height .pc-option-scroll {
  display: flex;
  flex: 0 0 auto;
  flex-direction: column;
  height: 276px;
  overflow: hidden
}

.dex-select-option .pc-option-scroll.dex-select-option-pc-fit-to-height {
  height: auto;
  max-height: 292px
}

.dex-select-option-mask {
  z-index: 9800
}

.dex-select .select-popup-reference {
  cursor: pointer;
  position: absolute
}

.dex-select-option-dialog-container>.dex-select-footer-dialog {
  padding: 16px
}

.dex-select-value {
  box-sizing: border-box;
  cursor: pointer;
  font-size: var(--dex-okd-select-md-text-font-size)
}

.dex-select-value-box {
  outline: none
}

.dex-select-value .value {
  align-items: center;
  color: var(--dex-okd-select-common-text-color);
  display: flex;
  margin-right: 8px;
  width: 100%
}

.dex-select-value .placeholder {
  color: var(--dex-okd-input-default-placeholder-color)
}

.dex-select-value .disabled {
  cursor: not-allowed
}

.dex-select-value .disabled .value {
  color: var(--dex-okd-input-disabled-text-color)
}

.dex-select-value .disabled .icon-sign {
  color: var(--dex-okd-select-input-select-default-icon-color);
  color: var(--dex-okd-select-input-select-disabled-icon-color, var(--dex-okd-select-input-select-default-icon-color))
}

.dex-select-value .icon-sign {
  color: var(--dex-okd-select-input-select-default-icon-color);
  font-size: var(--dex-okd-select-input-select-default-icon-size);
  margin-left: auto;
  margin-right: 4px;
  transition: transform .2s linear
}

.dex-select-inner-box {
  cursor: pointer;
  position: relative
}

.dex-select-inner-box input[readonly] {
  cursor: pointer
}

.dex-select-inner-box>.reference-suffix {
  position: absolute;
  right: 4px;
  top: 50%;
  transform: translateY(-50%)
}

.dex-select-tag-container {
  display: flex;
  flex-wrap: wrap;
  margin-right: 4px;
  margin-top: 4px;
  max-width: 100%;
  padding-right: 24px
}

.dex-select-tag-container-responsive {
  display: flex;
  margin-right: 24px;
  margin-top: 4px;
  width: 100%
}

.dex-input-sm .dex-select-inner-box>.reference-suffix {
  right: var(--dex-okd-input-sm-padding-horizontal)
}

.dex-input-sm.dex-select-value {
  font-size: var(--dex-okd-select-sm-text-font-size)
}

.dex-input-md .dex-select-inner-box>.reference-suffix {
  right: var(--dex-okd-input-md-padding-horizontal)
}

.dex-input-md.dex-select-value {
  font-size: var(--dex-okd-select-md-text-font-size)
}

.dex-input-xs .dex-select-inner-box>.reference-suffix {
  right: var(--dex-okd-input-xs-padding-horizontal)
}

.dex-input-xs.dex-select-value {
  font-size: var(--dex-okd-select-xs-text-font-size)
}

.dex-input-lg .dex-select-inner-box>.reference-suffix {
  right: var(--dex-okd-input-lg-padding-horizontal)
}

.dex-input-lg.dex-select-value {
  font-size: var(--dex-okd-select-lg-text-font-size);
  font-size: var(--dex-okd-select-lg-text-font-size, var(--dex-okd-select-lg-text-font-size))
}

.dex-input-xl .dex-select-inner-box>.reference-suffix {
  right: var(--dex-okd-input-xl-padding-horizontal)
}

.dex-input-xl.dex-select-value {
  font-size: var(--dex-okd-select-md-text-font-size);
  font-size: var(--dex-okd-select-xl-text-font-size, var(--dex-okd-select-md-text-font-size))
}

.dex-select-value {
  width: 100%
}

.dex-select-text-value {
  align-items: center;
  box-sizing: border-box;
  cursor: pointer;
  display: flex;
  font-size: var(--dex-okd-select-md-text-font-size);
  justify-content: flex-start
}

.dex-select-text-value.align-right {
  justify-content: flex-end
}

.dex-select-text-value .value {
  align-items: center;
  color: var(--dex-okd-select-text-select-default-font-color);
  display: flex
}

.dex-select-text-value .icon-sign {
  align-items: center;
  color: var(--dex-okd-select-text-select-default-icon-color);
  display: flex;
  font-size: var(--dex-okd-select-text-select-default-icon-size);
  margin-left: 6px;
  margin-right: 0
}

.dex-select-text-value:hover .value {
  color: var(--dex-okd-select-text-select-hover-font-color)
}

.dex-select-text-value:hover .icon-sign {
  color: var(--dex-okd-select-text-select-hover-icon-color)
}

.dex-select-text-value.focus .value {
  color: var(--dex-okd-select-text-select-select-font-color)
}

.dex-select-text-value.focus .icon-sign {
  color: var(--dex-okd-select-text-select-select-icon-color)
}

.dex-select-text-value.disabled {
  cursor: not-allowed
}

.dex-select-text-value.disabled .value {
  color: var(--dex-okd-select-text-select-disabled-font-color)
}

.dex-select-text-value.disabled .icon-sign {
  color: var(--dex-okd-select-text-select-disabled-icon-color)
}

.input-sm.dex-select-text-value {
  font-size: var(--dex-okd-select-sm-text-font-size)
}

.input-md.dex-select-text-value {
  font-size: var(--dex-okd-select-md-text-font-size)
}

.input-xs.dex-select-text-value {
  font-size: var(--dex-okd-select-xs-text-font-size)
}

.input-lg.dex-select-text-value {
  font-size: var(--dex-okd-select-lg-text-font-size);
  font-size: var(--dex-okd-select-lg-text-font-size, var(--dex-okd-select-lg-text-font-size))
}

.input-xl.dex-select-text-value {
  font-size: var(--dex-okd-select-md-text-font-size);
  font-size: var(--dex-okd-select-xl-text-font-size, var(--dex-okd-select-md-text-font-size))
}

.dex-select-value-box:focus-visible .dex-select-a11y-ring {
  outline: 2px solid var(--dex-okd-color-border-focus);
  outline-color: var(--dex-okd-color-border-focus);
  outline-offset: 2px;
  outline-style: solid;
  outline-width: 2px
}

.dex-select-value-box:focus-visible .dex-select-a11y-ring-text {
  border-radius: 4px;
  outline: 2px solid var(--dex-okd-color-border-focus);
  outline-color: var(--dex-okd-color-border-focus);
  outline-offset: 2px;
  outline-style: solid;
  outline-width: 2px
}

.dex-select-value-box.display-area:focus-visible {
  border-radius: 4px;
  outline: 2px solid var(--dex-okd-color-border-focus);
  outline-color: var(--dex-okd-color-border-focus);
  outline-offset: 2px;
  outline-style: solid;
  outline-width: 2px
}

.dex-select .select-up {
  transition: transform .2s linear
}

.dex-select .select-up-active {
  transform: rotate(180deg)
}

.dex-select-reference-icon-clear {
  color: #929292;
  color: var(--dex-okd-select-reference-icon-default-color, #929292);
  display: inline-block;
  margin-right: 4px;
  transition: transform .2s linear
}

.dex-select-reference-icon-clear:hover {
  color: #000;
  color: var(--dex-okd-select-reference-icon-hover-color, #000)
}

.dex-select-reference-icon-clear.disabled {
  pointer-events: none
}

.dex-select-reference-icon {
  display: inline-block
}

.dex-select-reference-icon.dex-select-arrow-icon-sm {
  font-size: 14px;
  font-size: var(--dex-okd-select-sm-arrow-icon-font-size, 14px)
}

.dex-select-reference-icon.dex-select-reference-icon-sm {
  font-size: 14px;
  font-size: var(--dex-okd-select-sm-reference-icon-font-size, 14px)
}

.dex-select-reference-icon.dex-select-arrow-icon-md {
  font-size: 16px;
  font-size: var(--dex-okd-select-md-arrow-icon-font-size, 16px)
}

.dex-select-reference-icon.dex-select-reference-icon-md {
  font-size: 16px;
  font-size: var(--dex-okd-select-md-reference-icon-font-size, 16px)
}

.dex-select-reference-icon.dex-select-arrow-icon-xs {
  font-size: 14px;
  font-size: var(--dex-okd-select-xs-arrow-icon-font-size, 14px)
}

.dex-select-reference-icon.dex-select-reference-icon-xs {
  font-size: 14px;
  font-size: var(--dex-okd-select-xs-reference-icon-font-size, 14px)
}

.dex-select-reference-icon.dex-select-arrow-icon-lg {
  font-size: 16px;
  font-size: var(--dex-okd-select-lg-arrow-icon-font-size, 16px)
}

.dex-select-reference-icon.dex-select-reference-icon-lg {
  font-size: 16px;
  font-size: var(--dex-okd-select-lg-reference-icon-font-size, 16px)
}

.dex-select-reference-icon.dex-select-arrow-icon-xl {
  font-size: 16px;
  font-size: var(--dex-okd-select-xl-arrow-icon-font-size, 16px)
}

.dex-select-reference-icon.dex-select-reference-icon-xl {
  font-size: 16px;
  font-size: var(--dex-okd-select-xl-reference-icon-font-size, 16px)
}

.dex-select {
  box-sizing: border-box;
  position: relative
}

.dex-select.select-text {
  display: inline-block
}

.dex-slider {
  display: flex
}

.dex-slider div {
  box-sizing: border-box
}

.dex-slider-content {
  display: flex;
  flex: 1 1;
  flex-direction: column;
  padding: 5px 8px
}

.dex-slider-total {
  align-items: center;
  display: flex;
  margin-left: 16px;
  width: 48px
}

.dex-slider-label {
  color: var(--dex-okd-slider-label-color);
  font-size: var(--dex-okd-slider-label-font-size);
  line-height: var(--dex-okd-slider-label-line-height)
}

.dex-slider-desc {
  color: var(--dex-okd-slider-desc-color);
  font-size: var(--dex-okd-slider-desc-font-size);
  line-height: var(--dex-okd-slider-desc-line-height);
  margin-top: 6px;
  margin-top: var(--dex-okd-slider-desc-margin-top, 6px)
}

.dex-slider-clickable {
  align-items: center;
  cursor: pointer;
  display: flex;
  height: 10px;
  margin: 10px 0
}

.dex-slider-clickable-margin {
  margin-bottom: 20px
}

.dex-slider-track {
  background: var(--dex-okd-slider-common-track-color);
  border-radius: 3px;
  height: var(--dex-okd-slider-md-track-height);
  position: relative;
  width: 100%
}

.dex-slider-mark {
  background-color: var(--dex-okd-slider-common-active-color);
  border-radius: 3px;
  height: 100%;
  position: absolute
}

.dex-slider-mark-node {
  align-items: center;
  background: var(--dex-okd-slider-node-bg-color);
  border: 1px solid var(--dex-okd-slider-node-border-color);
  border-radius: 100%;
  cursor: pointer;
  display: flex;
  height: var(--dex-okd-slider-md-node-size);
  justify-content: center;
  position: absolute;
  top: 50%;
  transform: translate(-50%, -50%);
  width: var(--dex-okd-slider-md-node-size)
}

.dex-slider-mark-node-text {
  color: var(--dex-okd-slider-common-text-color);
  font-size: 12px;
  left: 50%;
  line-height: 20px;
  position: absolute;
  top: 14px;
  top: var(--dex-okd-slider-common-top, 14px);
  transform: translateX(-50%);
  word-break: keep-all
}

.dex-slider-mark-node:last-child .dex-slider-mark-node-text {
  left: auto;
  right: 0;
  transform: none
}

.dex-slider-mark-node:first-child .dex-slider-mark-node-text {
  left: 0;
  transform: none
}

.dex-slider-mark-node-active {
  border-color: var(--dex-okd-slider-common-active-color)
}

.dex-slider-mark-node-active .dex-slider-mark-node-text {
  color: var(--dex-okd-slider-common-text-color);
  color: var(--dex-okd-slider-common-text-active-color, var(--dex-okd-slider-common-text-color))
}

.dex-slider-mark-node-no-circle {
  background: none;
  border: none
}

.dex-slider-handler {
  align-items: center;
  border-radius: 100%;
  cursor: pointer;
  display: flex;
  justify-content: center;
  position: absolute;
  top: 50%;
  transform: translate(-50%, -50%)
}

.dex-slider-handler:focus-visible {
  border-radius: 20px;
  outline: 2px solid var(--dex-okd-color-border-focus);
  outline-color: var(--dex-okd-color-border-focus);
  outline-offset: 2px;
  outline-style: solid;
  outline-width: 2px
}

.dex-slider-handler-inner {
  background-color: #fff;
  background-color: var(--dex-okd-slider-handler-bg-color, #fff);
  border: 2px solid var(--dex-okd-slider-handler-border-color);
  border-radius: 100%;
  height: var(--dex-okd-slider-md-handler-size);
  width: var(--dex-okd-slider-md-handler-size)
}

.dex-slider-handler-inner.dex-slider-active,
.dex-slider-handler-inner:hover {
  height: var(--dex-okd-slider-md-handler-hover-size);
  width: var(--dex-okd-slider-md-handler-hover-size)
}

.dex-slider-handler-inner.dex-slider-active {
  border: 4px solid var(--dex-okd-slider-handler-shadow-color)
}

.dex-slider-disabled {
  cursor: not-allowed
}

.dex-slider-disabled .dex-slider-handler-inner {
  border-color: var(--dex-okd-slider-handler-border-disabled-color, var(--dex-okd-slider-handler-border-color))
}

.dex-slider-disabled .dex-slider-handler-inner:hover {
  height: var(--dex-okd-slider-md-handler-size);
  width: var(--dex-okd-slider-md-handler-size)
}

.dex-slider-disabled .dex-slider-mark {
  background-color: var(--dex-okd-slider-common-active-color);
  background-color: var(--dex-okd-slider-common-disabled-active-color, var(--dex-okd-slider-common-active-color))
}

.dex-slider-disabled .dex-slider-mark-node-active {
  border-color: var(--dex-okd-slider-common-disabled-active-color, var(--dex-okd-slider-common-active-color))
}

.dex-slider-disabled .dex-slider-mark-node-active .dex-slider-mark-node-text {
  color: var(--dex-okd-slider-common-text-color);
  color: var(--dex-okd-slider-common-text-disabled-active-color, var(--dex-okd-slider-common-text-color))
}

.dex-slider-sm .dex-slider-track {
  height: var(--dex-okd-slider-sm-track-height)
}

.dex-slider-sm .dex-slider-mark-node {
  background: var(--dex-okd-slider-node-bg-color);
  border: 1px solid var(--dex-okd-slider-node-border-color);
  height: var(--dex-okd-slider-sm-node-size);
  width: var(--dex-okd-slider-sm-node-size)
}

.dex-slider-sm .dex-slider-mark-node-active {
  border: 1px solid var(--dex-okd-slider-common-active-color)
}

.dex-slider-sm .dex-slider-mark-node-text {
  top: 14px;
  top: var(--dex-okd-slider-sm-node-text-top, 14px)
}

.dex-slider-sm .dex-slider-handler-inner {
  border: 2px solid var(--dex-okd-slider-handler-border-color);
  height: var(--dex-okd-slider-sm-handler-size);
  width: var(--dex-okd-slider-sm-handler-size)
}

.dex-slider-sm .dex-slider-handler-inner:hover {
  height: var(--dex-okd-slider-sm-handler-hover-size);
  width: var(--dex-okd-slider-sm-handler-hover-size)
}

.dex-slider-sm .dex-slider-handler-inner.dex-slider-active {
  border-width: 2px
}

.dex-slider-sm .dex-slider-active {
  height: var(--dex-okd-slider-sm-handler-hover-size);
  width: var(--dex-okd-slider-sm-handler-hover-size)
}

.dex-slider-sm .dex-slider-disabled {
  cursor: not-allowed
}

.dex-slider-sm .dex-slider-disabled .dex-slider-handler-inner {
  border-color: var(--dex-okd-slider-handler-border-disabled-color, var(--dex-okd-slider-handler-border-color))
}

.dex-slider-sm .dex-slider-disabled .dex-slider-handler-inner:hover {
  height: var(--dex-okd-slider-sm-handler-size);
  width: var(--dex-okd-slider-sm-handler-size)
}

.dex-slider-sm .dex-slider-disabled .dex-slider-mark {
  background-color: var(--dex-okd-slider-common-active-color);
  background-color: var(--dex-okd-slider-common-disabled-active-color, var(--dex-okd-slider-common-active-color))
}

.dex-slider-sm .dex-slider-disabled .dex-slider-mark-node-active {
  border-color: var(--dex-okd-slider-common-disabled-active-color, var(--dex-okd-slider-common-active-color))
}

.dex-slider-sm .dex-slider-disabled .dex-slider-mark-node-active .dex-slider-mark-node-text {
  color: var(--dex-okd-slider-common-text-color);
  color: var(--dex-okd-slider-common-text-disabled-active-color, var(--dex-okd-slider-common-text-color))
}

.dex-okds-link {
  --ok-icon-font-family: "dex-ok-b983c4766d"
}

.dex-okds-link:before {
  content: "\e053";
  font-family: dex-ok-b983c4766d
}

.dex-okds-mail {
  --ok-icon-font-family: "dex-ok-b983c4766d"
}

.dex-okds-mail:before {
  content: "\e058";
  font-family: dex-ok-b983c4766d
}

.dex-okds-computer-outline {
  --ok-icon-font-family: "dex-ok-b983c4766d"
}

.dex-okds-computer-outline:before {
  content: "\e0a9";
  font-family: dex-ok-b983c4766d
}

.dex-okds-fire-flame_filled {
  --ok-icon-font-family: "dex-ok-b983c4766d"
}

.dex-okds-fire-flame_filled:before {
  content: "\e0a8";
  font-family: dex-ok-b983c4766d
}

.dex-okds-trash {
  --ok-icon-font-family: "dex-ok-b983c4766d"
}

.dex-okds-trash:before {
  content: "\e089";
  font-family: dex-ok-b983c4766d
}

.dex-okds-locked {
  --ok-icon-font-family: "dex-ok-b983c4766d"
}

.dex-okds-locked:before {
  content: "\e056";
  font-family: dex-ok-b983c4766d
}

.dex-okds-unlocked {
  --ok-icon-font-family: "dex-ok-b983c4766d"
}

.dex-okds-unlocked:before {
  content: "\e08a";
  font-family: dex-ok-b983c4766d
}

.dex-okds-verified-filled {
  --ok-icon-font-family: "dex-ok-b983c4766d"
}

.dex-okds-verified-filled:before {
  content: "\e0a7";
  font-family: dex-ok-b983c4766d
}

.dex-okds-trending-up {
  --ok-icon-font-family: "dex-ok-b983c4766d"
}

.dex-okds-trending-up:before {
  content: "\e0a6";
  font-family: dex-ok-b983c4766d
}

.dex-okds-toggle-units {
  --ok-icon-font-family: "dex-ok-b983c4766d"
}

.dex-okds-toggle-units:before {
  content: "\e0a5";
  font-family: dex-ok-b983c4766d
}

.dex-okds-chevron-right-text-button {
  --ok-icon-font-family: "dex-ok-b983c4766d"
}

.dex-okds-chevron-right-text-button:before {
  content: "\e0a4";
  font-family: dex-ok-b983c4766d
}

.dex-okds-calendar {
  --ok-icon-font-family: "dex-ok-b983c4766d"
}

.dex-okds-calendar:before {
  content: "\e01e";
  font-family: dex-ok-b983c4766d
}

.dex-okds-p2p {
  --ok-icon-font-family: "dex-ok-b983c4766d"
}

.dex-okds-p2p:before {
  content: "\e0a3";
  font-family: dex-ok-b983c4766d
}

.dex-okds-express-buy {
  --ok-icon-font-family: "dex-ok-b983c4766d"
}

.dex-okds-express-buy:before {
  content: "\e0a2";
  font-family: dex-ok-b983c4766d
}

.dex-okds-cash-fiat {
  --ok-icon-font-family: "dex-ok-b983c4766d"
}

.dex-okds-cash-fiat:before {
  content: "\e0a1";
  font-family: dex-ok-b983c4766d
}

.dex-okds-chevron-down {
  --ok-icon-font-family: "dex-ok-b983c4766d"
}

.dex-okds-chevron-down:before {
  content: "\e0a0";
  font-family: dex-ok-b983c4766d
}

.dex-okds-chevron-up {
  --ok-icon-font-family: "dex-ok-b983c4766d"
}

.dex-okds-chevron-up:before {
  content: "\e09f";
  font-family: dex-ok-b983c4766d
}

.dex-okds-xbtc {
  --ok-icon-font-family: "dex-ok-b983c4766d"
}

.dex-okds-xbtc:before {
  content: "\e09e";
  font-family: dex-ok-b983c4766d
}

.dex-okds-selected {
  --ok-icon-font-family: "dex-ok-b983c4766d"
}

.dex-okds-selected:before {
  content: "\e09c";
  font-family: dex-ok-b983c4766d
}

.dex-okds-unselected {
  --ok-icon-font-family: "dex-ok-b983c4766d"
}

.dex-okds-unselected:before {
  content: "\e09d";
  font-family: dex-ok-b983c4766d
}

.dex-okds-checkmark {
  --ok-icon-font-family: "dex-ok-b983c4766d"
}

.dex-okds-checkmark:before {
  content: "\e022";
  font-family: dex-ok-b983c4766d
}

.dex-okds-refresh {
  --ok-icon-font-family: "dex-ok-b983c4766d"
}

.dex-okds-refresh:before {
  content: "\e09b";
  font-family: dex-ok-b983c4766d
}

.dex-okds-draw {
  --ok-icon-font-family: "dex-ok-b983c4766d"
}

.dex-okds-draw:before {
  content: "\e09a";
  font-family: dex-ok-b983c4766d
}

.dex-okds-sun {
  --ok-icon-font-family: "dex-ok-b983c4766d"
}

.dex-okds-sun:before {
  content: "\e099";
  font-family: dex-ok-b983c4766d
}

.dex-okds-moon {
  --ok-icon-font-family: "dex-ok-b983c4766d"
}

.dex-okds-moon:before {
  content: "\e098";
  font-family: dex-ok-b983c4766d
}

.dex-okds-clear {
  --ok-icon-font-family: "dex-ok-b983c4766d"
}

.dex-okds-clear:before {
  content: "\e097";
  font-family: dex-ok-b983c4766d
}

.dex-okds-thumb_up {
  --ok-icon-font-family: "dex-ok-b983c4766d"
}

.dex-okds-thumb_up:before {
  content: "\e096";
  font-family: dex-ok-b983c4766d
}

.dex-okds-thumb_down {
  --ok-icon-font-family: "dex-ok-b983c4766d"
}

.dex-okds-thumb_down:before {
  content: "\e095";
  font-family: dex-ok-b983c4766d
}

.dex-okds-zoom-out {
  --ok-icon-font-family: "dex-ok-b983c4766d"
}

.dex-okds-zoom-out:before {
  content: "\e094";
  font-family: dex-ok-b983c4766d
}

.dex-okds-zoom-in {
  --ok-icon-font-family: "dex-ok-b983c4766d"
}

.dex-okds-zoom-in:before {
  content: "\e093";
  font-family: dex-ok-b983c4766d
}

.dex-okds-information-circle {
  --ok-icon-font-family: "dex-ok-b983c4766d"
}

.dex-okds-information-circle:before {
  content: "\e055";
  font-family: dex-ok-b983c4766d
}

.dex-okds-warning-circle-fill {
  --ok-icon-font-family: "dex-ok-b983c4766d"
}

.dex-okds-warning-circle-fill:before {
  content: "\e07d";
  font-family: dex-ok-b983c4766d
}

.dex-okds-success-circle-fill {
  --ok-icon-font-family: "dex-ok-b983c4766d"
}

.dex-okds-success-circle-fill:before {
  content: "\e084";
  font-family: dex-ok-b983c4766d
}

.dex-okds-information-circle-fill {
  --ok-icon-font-family: "dex-ok-b983c4766d"
}

.dex-okds-information-circle-fill:before {
  content: "\e052";
  font-family: dex-ok-b983c4766d
}

.dex-okds-fail-circle-fill {
  --ok-icon-font-family: "dex-ok-b983c4766d"
}

.dex-okds-fail-circle-fill:before {
  content: "\e02f";
  font-family: dex-ok-b983c4766d
}

.dex-okds-arrow-chevron-right-centered-xs {
  --ok-icon-font-family: "dex-ok-b983c4766d"
}

.dex-okds-arrow-chevron-right-centered-xs:before {
  content: "\e092";
  font-family: dex-ok-b983c4766d
}

.dex-okds-arrow-chevron-right-centered-sm {
  --ok-icon-font-family: "dex-ok-b983c4766d"
}

.dex-okds-arrow-chevron-right-centered-sm:before {
  content: "\e015";
  font-family: dex-ok-b983c4766d
}

.dex-okds-arrow-chevron-right-centered-md {
  --ok-icon-font-family: "dex-ok-b983c4766d"
}

.dex-okds-arrow-chevron-right-centered-md:before {
  content: "\e014";
  font-family: dex-ok-b983c4766d
}

.dex-okds-arrow-pointer-right-xs {
  --ok-icon-font-family: "dex-ok-b983c4766d"
}

.dex-okds-arrow-pointer-right-xs:before {
  content: "\e091";
  font-family: dex-ok-b983c4766d
}

.dex-okds-arrow-pointer-right-sm {
  --ok-icon-font-family: "dex-ok-b983c4766d"
}

.dex-okds-arrow-pointer-right-sm:before {
  content: "\e00e";
  font-family: dex-ok-b983c4766d
}

.dex-okds-arrow-pointer-right-md {
  --ok-icon-font-family: "dex-ok-b983c4766d"
}

.dex-okds-arrow-pointer-right-md:before {
  content: "\e00d";
  font-family: dex-ok-b983c4766d
}

.dex-okds-user {
  --ok-icon-font-family: "dex-ok-b983c4766d"
}

.dex-okds-user:before {
  content: "\e07b";
  font-family: dex-ok-b983c4766d
}

.dex-okds-plus-circle-filled {
  --ok-icon-font-family: "dex-ok-b983c4766d"
}

.dex-okds-plus-circle-filled:before {
  content: "\e065";
  font-family: dex-ok-b983c4766d
}

.dex-okds-intermediate {
  --ok-icon-font-family: "dex-ok-b983c4766d"
}

.dex-okds-intermediate:before {
  content: "\e090";
  font-family: dex-ok-b983c4766d
}

.dex-okds-arrow-chevron-left-centered-sm {
  --ok-icon-font-family: "dex-ok-b983c4766d"
}

.dex-okds-arrow-chevron-left-centered-sm:before {
  content: "\e013";
  font-family: dex-ok-b983c4766d
}

.dex-okds-eye-hide {
  --ok-icon-font-family: "dex-ok-b983c4766d"
}

.dex-okds-eye-hide:before {
  content: "\e03d";
  font-family: dex-ok-b983c4766d
}

.dex-okds-eye-show {
  --ok-icon-font-family: "dex-ok-b983c4766d"
}

.dex-okds-eye-show:before {
  content: "\e03f";
  font-family: dex-ok-b983c4766d
}

.dex-okds-copy {
  --ok-icon-font-family: "dex-ok-b983c4766d"
}

.dex-okds-copy:before {
  content: "\e033";
  font-family: dex-ok-b983c4766d
}

.dex-okds-history {
  --ok-icon-font-family: "dex-ok-b983c4766d"
}

.dex-okds-history:before {
  content: "\e04f";
  font-family: dex-ok-b983c4766d
}

.dex-okds-back-to-top {
  --ok-icon-font-family: "dex-ok-b983c4766d"
}

.dex-okds-back-to-top:before {
  content: "\e08f";
  font-family: dex-ok-b983c4766d
}

.dex-okds-clock {
  --ok-icon-font-family: "dex-ok-b983c4766d"
}

.dex-okds-clock:before {
  content: "\e028";
  font-family: dex-ok-b983c4766d
}

.dex-okds-hamburger-setting {
  --ok-icon-font-family: "dex-ok-b983c4766d"
}

.dex-okds-hamburger-setting:before {
  content: "\e04c";
  font-family: dex-ok-b983c4766d
}

.dex-okds-fees {
  --ok-icon-font-family: "dex-ok-b983c4766d"
}

.dex-okds-fees:before {
  content: "\e040";
  font-family: dex-ok-b983c4766d
}

.dex-okds-open-link {
  --ok-icon-font-family: "dex-ok-b983c4766d"
}

.dex-okds-open-link:before {
  content: "\e05d";
  font-family: dex-ok-b983c4766d
}

.dex-okds-setting {
  --ok-icon-font-family: "dex-ok-b983c4766d"
}

.dex-okds-setting:before {
  content: "\e074";
  font-family: dex-ok-b983c4766d
}

.dex-okds-crown {
  --ok-icon-font-family: "dex-ok-b983c4766d"
}

.dex-okds-crown:before {
  content: "\e08e";
  font-family: dex-ok-b983c4766d
}

.dex-okds-share {
  --ok-icon-font-family: "dex-ok-b983c4766d"
}

.dex-okds-share:before {
  content: "\e078";
  font-family: dex-ok-b983c4766d
}

.dex-okds-support {
  --ok-icon-font-family: "dex-ok-b983c4766d"
}

.dex-okds-support:before {
  content: "\e086";
  font-family: dex-ok-b983c4766d
}

.dex-okds-analysis {
  --ok-icon-font-family: "dex-ok-b983c4766d"
}

.dex-okds-analysis:before {
  content: "\e003";
  font-family: dex-ok-b983c4766d
}

.dex-okds-academy {
  --ok-icon-font-family: "dex-ok-b983c4766d"
}

.dex-okds-academy:before {
  content: "\e000";
  font-family: dex-ok-b983c4766d
}

.dex-okds-action-reverse {
  --ok-icon-font-family: "dex-ok-b983c4766d"
}

.dex-okds-action-reverse:before {
  content: "\e001";
  font-family: dex-ok-b983c4766d
}

.dex-okds-aed {
  --ok-icon-font-family: "dex-ok-b983c4766d"
}

.dex-okds-aed:before {
  content: "\e002";
  font-family: dex-ok-b983c4766d
}

.dex-okds-arrow-cheveron-alignleft-md {
  --ok-icon-font-family: "dex-ok-b983c4766d"
}

.dex-okds-arrow-cheveron-alignleft-md:before {
  content: "\e004";
  font-family: dex-ok-b983c4766d
}

.dex-okds-arrow-cheveron-first-md {
  --ok-icon-font-family: "dex-ok-b983c4766d"
}

.dex-okds-arrow-cheveron-first-md:before {
  content: "\e005";
  font-family: dex-ok-b983c4766d
}

.dex-okds-arrow-cheveron-last-md {
  --ok-icon-font-family: "dex-ok-b983c4766d"
}

.dex-okds-arrow-cheveron-last-md:before {
  content: "\e006";
  font-family: dex-ok-b983c4766d
}

.dex-okds-arrow-chevron-down-md {
  --ok-icon-font-family: "dex-ok-b983c4766d"
}

.dex-okds-arrow-chevron-down-md:before {
  content: "\e007";
  font-family: dex-ok-b983c4766d
}

.dex-okds-arrow-chevron-down-sm {
  --ok-icon-font-family: "dex-ok-b983c4766d"
}

.dex-okds-arrow-chevron-down-sm:before {
  content: "\e008";
  font-family: dex-ok-b983c4766d
}

.dex-okds-arrow-pointer-down-md {
  --ok-icon-font-family: "dex-ok-b983c4766d"
}

.dex-okds-arrow-pointer-down-md:before {
  content: "\e009";
  font-family: dex-ok-b983c4766d
}

.dex-okds-arrow-pointer-down-sm {
  --ok-icon-font-family: "dex-ok-b983c4766d"
}

.dex-okds-arrow-pointer-down-sm:before {
  content: "\e00a";
  font-family: dex-ok-b983c4766d
}

.dex-okds-arrow-pointer-left-md {
  --ok-icon-font-family: "dex-ok-b983c4766d"
}

.dex-okds-arrow-pointer-left-md:before {
  content: "\e00b";
  font-family: dex-ok-b983c4766d
}

.dex-okds-arrow-pointer-left-sm {
  --ok-icon-font-family: "dex-ok-b983c4766d"
}

.dex-okds-arrow-pointer-left-sm:before {
  content: "\e00c";
  font-family: dex-ok-b983c4766d
}

.dex-okds-arrow-pointer-up-md {
  --ok-icon-font-family: "dex-ok-b983c4766d"
}

.dex-okds-arrow-pointer-up-md:before {
  content: "\e00f";
  font-family: dex-ok-b983c4766d
}

.dex-okds-arrow-pointer-up-sm {
  --ok-icon-font-family: "dex-ok-b983c4766d"
}

.dex-okds-arrow-pointer-up-sm:before {
  content: "\e010";
  font-family: dex-ok-b983c4766d
}

.dex-okds-arrow-chevron-up-md {
  --ok-icon-font-family: "dex-ok-b983c4766d"
}

.dex-okds-arrow-chevron-up-md:before {
  content: "\e011";
  font-family: dex-ok-b983c4766d
}

.dex-okds-arrow-chevron-left-centered-md {
  --ok-icon-font-family: "dex-ok-b983c4766d"
}

.dex-okds-arrow-chevron-left-centered-md:before {
  content: "\e012";
  font-family: dex-ok-b983c4766d
}

.dex-okds-arrow-chevron-up-sm {
  --ok-icon-font-family: "dex-ok-b983c4766d"
}

.dex-okds-arrow-chevron-up-sm:before {
  content: "\e016";
  font-family: dex-ok-b983c4766d
}

.dex-okds-bell {
  --ok-icon-font-family: "dex-ok-b983c4766d"
}

.dex-okds-bell:before {
  content: "\e017";
  font-family: dex-ok-b983c4766d
}

.dex-okds-authenticator {
  --ok-icon-font-family: "dex-ok-b983c4766d"
}

.dex-okds-authenticator:before {
  content: "\e018";
  font-family: dex-ok-b983c4766d
}

.dex-okds-borrow {
  --ok-icon-font-family: "dex-ok-b983c4766d"
}

.dex-okds-borrow:before {
  content: "\e019";
  font-family: dex-ok-b983c4766d
}

.dex-okds-brl {
  --ok-icon-font-family: "dex-ok-b983c4766d"
}

.dex-okds-brl:before {
  content: "\e01a";
  font-family: dex-ok-b983c4766d
}

.dex-okds-brush {
  --ok-icon-font-family: "dex-ok-b983c4766d"
}

.dex-okds-brush:before {
  content: "\e01b";
  font-family: dex-ok-b983c4766d
}

.dex-okds-cancel-order {
  --ok-icon-font-family: "dex-ok-b983c4766d"
}

.dex-okds-cancel-order:before {
  content: "\e01c";
  font-family: dex-ok-b983c4766d
}

.dex-okds-candlestick {
  --ok-icon-font-family: "dex-ok-b983c4766d"
}

.dex-okds-candlestick:before {
  content: "\e01d";
  font-family: dex-ok-b983c4766d
}

.dex-okds-carets-filled-down {
  --ok-icon-font-family: "dex-ok-b983c4766d"
}

.dex-okds-carets-filled-down:before {
  content: "\e01f";
  font-family: dex-ok-b983c4766d
}

.dex-okds-chat-bubble {
  --ok-icon-font-family: "dex-ok-b983c4766d"
}

.dex-okds-chat-bubble:before {
  content: "\e020";
  font-family: dex-ok-b983c4766d
}

.dex-okds-carets-filled-up {
  --ok-icon-font-family: "dex-ok-b983c4766d"
}

.dex-okds-carets-filled-up:before {
  content: "\e021";
  font-family: dex-ok-b983c4766d
}

.dex-okds-clear-fill {
  --ok-icon-font-family: "dex-ok-b983c4766d"
}

.dex-okds-clear-fill:before {
  content: "\e023";
  font-family: dex-ok-b983c4766d
}

.dex-okds-assets {
  --ok-icon-font-family: "dex-ok-b983c4766d"
}

.dex-okds-assets:before {
  content: "\e024";
  font-family: dex-ok-b983c4766d
}

.dex-okds-bank {
  --ok-icon-font-family: "dex-ok-b983c4766d"
}

.dex-okds-bank:before {
  content: "\e025";
  font-family: dex-ok-b983c4766d
}

.dex-okds-clock-filled {
  --ok-icon-font-family: "dex-ok-b983c4766d"
}

.dex-okds-clock-filled:before {
  content: "\e026";
  font-family: dex-ok-b983c4766d
}

.dex-okds-clock-outline {
  --ok-icon-font-family: "dex-ok-b983c4766d"
}

.dex-okds-clock-outline:before {
  content: "\e027";
  font-family: dex-ok-b983c4766d
}

.dex-okds-close {
  --ok-icon-font-family: "dex-ok-b983c4766d"
}

.dex-okds-close:before {
  content: "\e029";
  font-family: dex-ok-b983c4766d
}

.dex-okds-communication-call {
  --ok-icon-font-family: "dex-ok-b983c4766d"
}

.dex-okds-communication-call:before {
  content: "\e02a";
  font-family: dex-ok-b983c4766d
}

.dex-okds-communication-idcard {
  --ok-icon-font-family: "dex-ok-b983c4766d"
}

.dex-okds-communication-idcard:before {
  content: "\e02b";
  font-family: dex-ok-b983c4766d
}

.dex-okds-communication-img-failed {
  --ok-icon-font-family: "dex-ok-b983c4766d"
}

.dex-okds-communication-img-failed:before {
  content: "\e02c";
  font-family: dex-ok-b983c4766d
}

.dex-okds-communications-faceid {
  --ok-icon-font-family: "dex-ok-b983c4766d"
}

.dex-okds-communications-faceid:before {
  content: "\e02d";
  font-family: dex-ok-b983c4766d
}

.dex-okds-eye-show-filled {
  --ok-icon-font-family: "dex-ok-b983c4766d"
}

.dex-okds-eye-show-filled:before {
  content: "\e02e";
  font-family: dex-ok-b983c4766d
}

.dex-okds-communication-img {
  --ok-icon-font-family: "dex-ok-b983c4766d"
}

.dex-okds-communication-img:before {
  content: "\e030";
  font-family: dex-ok-b983c4766d
}

.dex-okds-convertokb {
  --ok-icon-font-family: "dex-ok-b983c4766d"
}

.dex-okds-convertokb:before {
  content: "\e031";
  font-family: dex-ok-b983c4766d
}

.dex-okds-cursor-drag {
  --ok-icon-font-family: "dex-ok-b983c4766d"
}

.dex-okds-cursor-drag:before {
  content: "\e032";
  font-family: dex-ok-b983c4766d
}

.dex-okds-data-line-chart {
  --ok-icon-font-family: "dex-ok-b983c4766d"
}

.dex-okds-data-line-chart:before {
  content: "\e034";
  font-family: dex-ok-b983c4766d
}

.dex-okds-deposit {
  --ok-icon-font-family: "dex-ok-b983c4766d"
}

.dex-okds-deposit:before {
  content: "\e035";
  font-family: dex-ok-b983c4766d
}

.dex-okds-cursor-zoom {
  --ok-icon-font-family: "dex-ok-b983c4766d"
}

.dex-okds-cursor-zoom:before {
  content: "\e036";
  font-family: dex-ok-b983c4766d
}

.dex-okds-download {
  --ok-icon-font-family: "dex-ok-b983c4766d"
}

.dex-okds-download:before {
  content: "\e037";
  font-family: dex-ok-b983c4766d
}

.dex-okds-exchange {
  --ok-icon-font-family: "dex-ok-b983c4766d"
}

.dex-okds-exchange:before {
  content: "\e038";
  font-family: dex-ok-b983c4766d
}

.dex-okds-developers {
  --ok-icon-font-family: "dex-ok-b983c4766d"
}

.dex-okds-developers:before {
  content: "\e039";
  font-family: dex-ok-b983c4766d
}

.dex-okds-eur {
  --ok-icon-font-family: "dex-ok-b983c4766d"
}

.dex-okds-eur:before {
  content: "\e03a";
  font-family: dex-ok-b983c4766d
}

.dex-okds-edit {
  --ok-icon-font-family: "dex-ok-b983c4766d"
}

.dex-okds-edit:before {
  content: "\e03b";
  font-family: dex-ok-b983c4766d
}

.dex-okds-expand {
  --ok-icon-font-family: "dex-ok-b983c4766d"
}

.dex-okds-expand:before {
  content: "\e03c";
  font-family: dex-ok-b983c4766d
}

.dex-okds-eye-hide-filled {
  --ok-icon-font-family: "dex-ok-b983c4766d"
}

.dex-okds-eye-hide-filled:before {
  content: "\e03e";
  font-family: dex-ok-b983c4766d
}

.dex-okds-fail-circle {
  --ok-icon-font-family: "dex-ok-b983c4766d"
}

.dex-okds-fail-circle:before {
  content: "\e041";
  font-family: dex-ok-b983c4766d
}

.dex-okds-filter {
  --ok-icon-font-family: "dex-ok-b983c4766d"
}

.dex-okds-filter:before {
  content: "\e042";
  font-family: dex-ok-b983c4766d
}

.dex-okds-finance-bank {
  --ok-icon-font-family: "dex-ok-b983c4766d"
}

.dex-okds-finance-bank:before {
  content: "\e043";
  font-family: dex-ok-b983c4766d
}

.dex-okds-finance-seagull {
  --ok-icon-font-family: "dex-ok-b983c4766d"
}

.dex-okds-finance-seagull:before {
  content: "\e044";
  font-family: dex-ok-b983c4766d
}

.dex-okds-finance-earn {
  --ok-icon-font-family: "dex-ok-b983c4766d"
}

.dex-okds-finance-earn:before {
  content: "\e045";
  font-family: dex-ok-b983c4766d
}

.dex-okds-futures {
  --ok-icon-font-family: "dex-ok-b983c4766d"
}

.dex-okds-futures:before {
  content: "\e046";
  font-family: dex-ok-b983c4766d
}

.dex-okds-funding-rates {
  --ok-icon-font-family: "dex-ok-b983c4766d"
}

.dex-okds-funding-rates:before {
  content: "\e047";
  font-family: dex-ok-b983c4766d
}

.dex-okds-gbp {
  --ok-icon-font-family: "dex-ok-b983c4766d"
}

.dex-okds-gbp:before {
  content: "\e048";
  font-family: dex-ok-b983c4766d
}

.dex-okds-guide {
  --ok-icon-font-family: "dex-ok-b983c4766d"
}

.dex-okds-guide:before {
  content: "\e049";
  font-family: dex-ok-b983c4766d
}

.dex-okds-hamburger-edit {
  --ok-icon-font-family: "dex-ok-b983c4766d"
}

.dex-okds-hamburger-edit:before {
  content: "\e04a";
  font-family: dex-ok-b983c4766d
}

.dex-okds-hamburger-search {
  --ok-icon-font-family: "dex-ok-b983c4766d"
}

.dex-okds-hamburger-search:before {
  content: "\e04b";
  font-family: dex-ok-b983c4766d
}

.dex-okds-hamburger {
  --ok-icon-font-family: "dex-ok-b983c4766d"
}

.dex-okds-hamburger:before {
  content: "\e04d";
  font-family: dex-ok-b983c4766d
}

.dex-okds-hierachy {
  --ok-icon-font-family: "dex-ok-b983c4766d"
}

.dex-okds-hierachy:before {
  content: "\e04e";
  font-family: dex-ok-b983c4766d
}

.dex-okds-id-card {
  --ok-icon-font-family: "dex-ok-b983c4766d"
}

.dex-okds-id-card:before {
  content: "\e050";
  font-family: dex-ok-b983c4766d
}

.dex-okds-img {
  --ok-icon-font-family: "dex-ok-b983c4766d"
}

.dex-okds-img:before {
  content: "\e051";
  font-family: dex-ok-b983c4766d
}

.dex-okds-insurance-fund {
  --ok-icon-font-family: "dex-ok-b983c4766d"
}

.dex-okds-insurance-fund:before {
  content: "\e054";
  font-family: dex-ok-b983c4766d
}

.dex-okds-language {
  --ok-icon-font-family: "dex-ok-b983c4766d"
}

.dex-okds-language:before {
  content: "\e057";
  font-family: dex-ok-b983c4766d
}

.dex-okds-margin {
  --ok-icon-font-family: "dex-ok-b983c4766d"
}

.dex-okds-margin:before {
  content: "\e059";
  font-family: dex-ok-b983c4766d
}

.dex-okds-logout {
  --ok-icon-font-family: "dex-ok-b983c4766d"
}

.dex-okds-logout:before {
  content: "\e05a";
  font-family: dex-ok-b983c4766d
}

.dex-okds-minus {
  --ok-icon-font-family: "dex-ok-b983c4766d"
}

.dex-okds-minus:before {
  content: "\e05b";
  font-family: dex-ok-b983c4766d
}

.dex-okds-more {
  --ok-icon-font-family: "dex-ok-b983c4766d"
}

.dex-okds-more:before {
  content: "\e05c";
  font-family: dex-ok-b983c4766d
}

.dex-okds-network-fee-standard {
  --ok-icon-font-family: "dex-ok-b983c4766d"
}

.dex-okds-network-fee-standard:before {
  content: "\e05e";
  font-family: dex-ok-b983c4766d
}

.dex-okds-option {
  --ok-icon-font-family: "dex-ok-b983c4766d"
}

.dex-okds-option:before {
  content: "\e05f";
  font-family: dex-ok-b983c4766d
}

.dex-okds-orders {
  --ok-icon-font-family: "dex-ok-b983c4766d"
}

.dex-okds-orders:before {
  content: "\e060";
  font-family: dex-ok-b983c4766d
}

.dex-okds-pending-circle {
  --ok-icon-font-family: "dex-ok-b983c4766d"
}

.dex-okds-pending-circle:before {
  content: "\e061";
  font-family: dex-ok-b983c4766d
}

.dex-okds-pie-chart {
  --ok-icon-font-family: "dex-ok-b983c4766d"
}

.dex-okds-pie-chart:before {
  content: "\e062";
  font-family: dex-ok-b983c4766d
}

.dex-okds-place-order {
  --ok-icon-font-family: "dex-ok-b983c4766d"
}

.dex-okds-place-order:before {
  content: "\e063";
  font-family: dex-ok-b983c4766d
}

.dex-okds-play {
  --ok-icon-font-family: "dex-ok-b983c4766d"
}

.dex-okds-play:before {
  content: "\e064";
  font-family: dex-ok-b983c4766d
}

.dex-okds-plus-circle {
  --ok-icon-font-family: "dex-ok-b983c4766d"
}

.dex-okds-plus-circle:before {
  content: "\e066";
  font-family: dex-ok-b983c4766d
}

.dex-okds-plus {
  --ok-icon-font-family: "dex-ok-b983c4766d"
}

.dex-okds-plus:before {
  content: "\e067";
  font-family: dex-ok-b983c4766d
}

.dex-okds-profile {
  --ok-icon-font-family: "dex-ok-b983c4766d"
}

.dex-okds-profile:before {
  content: "\e068";
  font-family: dex-ok-b983c4766d
}

.dex-okds-qrcode {
  --ok-icon-font-family: "dex-ok-b983c4766d"
}

.dex-okds-qrcode:before {
  content: "\e069";
  font-family: dex-ok-b983c4766d
}

.dex-okds-question-mark-circle-fill {
  --ok-icon-font-family: "dex-ok-b983c4766d"
}

.dex-okds-question-mark-circle-fill:before {
  content: "\e06a";
  font-family: dex-ok-b983c4766d
}

.dex-okds-question-mark-circle {
  --ok-icon-font-family: "dex-ok-b983c4766d"
}

.dex-okds-question-mark-circle:before {
  content: "\e06b";
  font-family: dex-ok-b983c4766d
}

.dex-okds-sort-up-center-aligned {
  --ok-icon-font-family: "dex-ok-b983c4766d"
}

.dex-okds-sort-up-center-aligned:before {
  content: "\e06c";
  font-family: dex-ok-b983c4766d
}

.dex-okds-records {
  --ok-icon-font-family: "dex-ok-b983c4766d"
}

.dex-okds-records:before {
  content: "\e06d";
  font-family: dex-ok-b983c4766d
}

.dex-okds-red-packe {
  --ok-icon-font-family: "dex-ok-b983c4766d"
}

.dex-okds-red-packe:before {
  content: "\e06e";
  font-family: dex-ok-b983c4766d
}

.dex-okds-scan {
  --ok-icon-font-family: "dex-ok-b983c4766d"
}

.dex-okds-scan:before {
  content: "\e06f";
  font-family: dex-ok-b983c4766d
}

.dex-okds-report-centre {
  --ok-icon-font-family: "dex-ok-b983c4766d"
}

.dex-okds-report-centre:before {
  content: "\e070";
  font-family: dex-ok-b983c4766d
}

.dex-okds-security-fill {
  --ok-icon-font-family: "dex-ok-b983c4766d"
}

.dex-okds-security-fill:before {
  content: "\e071";
  font-family: dex-ok-b983c4766d
}

.dex-okds-search {
  --ok-icon-font-family: "dex-ok-b983c4766d"
}

.dex-okds-search:before {
  content: "\e072";
  font-family: dex-ok-b983c4766d
}

.dex-okds-security {
  --ok-icon-font-family: "dex-ok-b983c4766d"
}

.dex-okds-security:before {
  content: "\e073";
  font-family: dex-ok-b983c4766d
}

.dex-okds-transfer {
  --ok-icon-font-family: "dex-ok-b983c4766d"
}

.dex-okds-transfer:before {
  content: "\e075";
  font-family: dex-ok-b983c4766d
}

.dex-okds-settlement-history {
  --ok-icon-font-family: "dex-ok-b983c4766d"
}

.dex-okds-settlement-history:before {
  content: "\e076";
  font-family: dex-ok-b983c4766d
}

.dex-okds-trends {
  --ok-icon-font-family: "dex-ok-b983c4766d"
}

.dex-okds-trends:before {
  content: "\e077";
  font-family: dex-ok-b983c4766d
}

.dex-okds-sort-default-center-aligned {
  --ok-icon-font-family: "dex-ok-b983c4766d"
}

.dex-okds-sort-default-center-aligned:before {
  content: "\e079";
  font-family: dex-ok-b983c4766d
}

.dex-okds-sort-default {
  --ok-icon-font-family: "dex-ok-b983c4766d"
}

.dex-okds-sort-default:before {
  content: "\e07a";
  font-family: dex-ok-b983c4766d
}

.dex-okds-sort-down-center-aligned-svg {
  --ok-icon-font-family: "dex-ok-b983c4766d"
}

.dex-okds-sort-down-center-aligned-svg:before {
  content: "\e07c";
  font-family: dex-ok-b983c4766d
}

.dex-okds-withdraw {
  --ok-icon-font-family: "dex-ok-b983c4766d"
}

.dex-okds-withdraw:before {
  content: "\e07e";
  font-family: dex-ok-b983c4766d
}

.dex-okds-sort-down {
  --ok-icon-font-family: "dex-ok-b983c4766d"
}

.dex-okds-sort-down:before {
  content: "\e07f";
  font-family: dex-ok-b983c4766d
}

.dex-okds-sort-up {
  --ok-icon-font-family: "dex-ok-b983c4766d"
}

.dex-okds-sort-up:before {
  content: "\e080";
  font-family: dex-ok-b983c4766d
}

.dex-okds-star-filled {
  --ok-icon-font-family: "dex-ok-b983c4766d"
}

.dex-okds-star-filled:before {
  content: "\e081";
  font-family: dex-ok-b983c4766d
}

.dex-okds-star {
  --ok-icon-font-family: "dex-ok-b983c4766d"
}

.dex-okds-star:before {
  content: "\e082";
  font-family: dex-ok-b983c4766d
}

.dex-okds-strong-alert {
  --ok-icon-font-family: "dex-ok-b983c4766d"
}

.dex-okds-strong-alert:before {
  content: "\e083";
  font-family: dex-ok-b983c4766d
}

.dex-okds-success-circle {
  --ok-icon-font-family: "dex-ok-b983c4766d"
}

.dex-okds-success-circle:before {
  content: "\e085";
  font-family: dex-ok-b983c4766d
}

.dex-okds-trade-1 {
  --ok-icon-font-family: "dex-ok-b983c4766d"
}

.dex-okds-trade-1:before {
  content: "\e087";
  font-family: dex-ok-b983c4766d
}

.dex-okds-transfer-circle {
  --ok-icon-font-family: "dex-ok-b983c4766d"
}

.dex-okds-transfer-circle:before {
  content: "\e088";
  font-family: dex-ok-b983c4766d
}

.dex-okds-unlink {
  --ok-icon-font-family: "dex-ok-b983c4766d"
}

.dex-okds-unlink:before {
  content: "\e08b";
  font-family: dex-ok-b983c4766d
}

.dex-okds-usd {
  --ok-icon-font-family: "dex-ok-b983c4766d"
}

.dex-okds-usd:before {
  content: "\e08c";
  font-family: dex-ok-b983c4766d
}

.dex-okds-warning-circle {
  --ok-icon-font-family: "dex-ok-b983c4766d"
}

.dex-okds-warning-circle:before {
  content: "\e08d";
  font-family: dex-ok-b983c4766d
}

.iconfont {
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
  font-size: 16px;
  font-style: normal
}

.iconfont:before {
  display: inline-block
}

@font-face {
  font-display: block;
  font-family: dex-ok-b983c4766d;
  font-style: normal;
  src: url(../7037698b1d9e17ea03b4.woff2) format("woff2")
}

[dir=rtl] .dex-okds-arrow-cheveron-alignleft-md:before,
[dir=rtl] .dex-okds-arrow-cheveron-first-md:before,
[dir=rtl] .dex-okds-arrow-cheveron-last-md:before,
[dir=rtl] .dex-okds-arrow-chevron-left-centered-md:before,
[dir=rtl] .dex-okds-arrow-chevron-left-centered-sm:before,
[dir=rtl] .dex-okds-arrow-chevron-right-centered-md:before,
[dir=rtl] .dex-okds-arrow-chevron-right-centered-sm:before,
[dir=rtl] .dex-okds-arrow-chevron-right-centered-xs:before,
[dir=rtl] .dex-okds-arrow-pointer-left-md:before,
[dir=rtl] .dex-okds-arrow-pointer-left-sm:before,
[dir=rtl] .dex-okds-arrow-pointer-right-md:before,
[dir=rtl] .dex-okds-arrow-pointer-right-sm:before,
[dir=rtl] .dex-okds-arrow-pointer-right-xs:before,
[dir=rtl] .dex-okds-communication-idcard:before,
[dir=rtl] .dex-okds-copy:before,
[dir=rtl] .dex-okds-eye-hide-filled:before,
[dir=rtl] .dex-okds-eye-hide:before,
[dir=rtl] .dex-okds-guide:before,
[dir=rtl] .dex-okds-logout:before,
[dir=rtl] .dex-okds-network-fee-standard:before,
[dir=rtl] .dex-okds-open-link:before,
[dir=rtl] .dex-okds-orders:before,
[dir=rtl] .dex-okds-question-mark-circle-fill:before,
[dir=rtl] .dex-okds-question-mark-circle:before,
[dir=rtl] .dex-okds-report-centre:before {
  transform: scaleX(-1)
}

.dex-icon.icon {
  font-family: var(--ok-icon-font-family) !important
}

.dex-a11y-button:focus-visible {
  border-radius: 4px;
  outline: 2px solid var(--dex-okd-color-border-focus);
  outline-color: var(--dex-okd-color-border-focus);
  outline-offset: 2px;
  outline-style: solid;
  outline-width: 2px
}

.dex-a11y-text {
  clip: rect(0, 0, 0, 0);
  border-width: 0;
  height: 1px;
  margin: -1px;
  overflow: hidden;
  padding: 0;
  position: absolute;
  white-space: nowrap;
  width: 1px
}

.dex-empty {
  align-items: center;
  display: flex;
  flex-direction: column;
  width: 100%
}

.dex-empty-img {
  height: var(--dex-okd-empty-img-height);
  margin-bottom: var(--dex-okd-empty-img-margin-bottom);
  width: var(--dex-okd-empty-img-width)
}

.dex-empty-title {
  color: var(--dex-okd-empty-title-color);
  font-size: var(--dex-okd-empty-title-font-size);
  font-weight: 400;
  font-weight: var(--dex-okd-empty-title-font-weight, 400);
  line-height: var(--dex-okd-empty-title-light-height);
  margin-bottom: var(--dex-okd-empty-title-margin-bottom);
  text-align: center
}

.dex-empty-title:last-child {
  margin-bottom: 0
}

.dex-empty-only-title {
  margin-bottom: var(--dex-okd-empty-desc-margin-bottom)
}

.dex-empty-only-title:last-child {
  margin-bottom: 0
}

.dex-empty-description {
  color: var(--dex-okd-empty-desc-color);
  font-size: var(--dex-okd-empty-desc-font-size);
  font-weight: 400;
  font-weight: var(--dex-okd-empty-desc-font-weight, 400);
  line-height: var(--dex-okd-empty-desc-light-height);
  margin-bottom: var(--dex-okd-empty-desc-margin-bottom);
  text-align: center
}

.dex-empty-description:last-child {
  margin-bottom: 0
}

.dex-empty-sm .dex-empty-title {
  font-size: 14px;
  font-size: var(--dex-okd-empty-sm-title-font-size, 14px);
  line-height: 16px;
  line-height: var(--dex-okd-empty-sm-title-line-height, 16px);
  margin-bottom: 4px;
  margin-bottom: var(--dex-okd-empty-sm-title-margin-bottom, 4px)
}

.dex-empty-sm .dex-empty-description {
  font-size: 12px;
  font-size: var(--dex-okd-empty-sm-desc-font-size, 12px);
  line-height: 18px;
  line-height: var(--dex-okd-empty-sm-desc-line-height, 18px)
}

.dex-empty-sm .dex-empty-description,
.dex-empty-sm .dex-empty-only-title {
  margin-bottom: 4px;
  margin-bottom: var(--dex-okd-empty-sm-desc-margin-bottom, 4px)
}

.dex-result {
  background-color: var(--dex-okd-color-background-base-primary);
  background-color: var(--dex-okd-result-background-color, var(--dex-okd-color-background-base-primary))
}

.dex-result-animation {
  margin: auto
}

.dex-result-title {
  color: var(--dex-okd-color-content-primary);
  color: var(--dex-okd-result-title-color, var(--dex-okd-color-content-primary));
  font-size: 24px;
  font-size: var(--dex-okd-result-title-sm-font-size, 24px);
  font-weight: 700;
  font-weight: var(--dex-okd-result-title-sm-font-weight, 700);
  line-height: 28px;
  line-height: var(--dex-okd-result-title-sm-line-height, 28px);
  text-align: center
}

.dex-result-desc {
  color: var(--dex-okd-color-content-secondary);
  color: var(--dex-okd-result-desc-color, var(--dex-okd-color-content-secondary));
  font-size: 14px;
  font-size: var(--dex-okd-result-desc-sm-font-size, 14px);
  line-height: 22px;
  line-height: var(--dex-okd-result-desc-sm-line-height, 22px);
  margin-top: 16px;
  margin-top: var(--dex-okd-result-desc-sm-margin-top, 16px);
  text-align: center
}

.dex-result-extra {
  margin-top: 24px;
  margin-top: var(--dex-okd-result-extra-sm-margin-top, 24px);
  text-align: center
}

.dex-result-animation-sm {
  height: 136px;
  height: var(--dex-okd-result-sm-height, 136px);
  width: 136px;
  width: var(--dex-okd-result-sm-width, 136px)
}

.dex-result-animation-lg {
  height: 216px;
  height: var(--dex-okd-result-lg-height, 216px);
  width: 216px;
  width: var(--dex-okd-result-lg-width, 216px)
}

.dex-breadcrumbs,
.dex-breadcrumbs-crumb,
.dex-breadcrumbs-crumb-active {
  align-items: center;
  display: flex
}

.dex-breadcrumbs-primary .dex-breadcrumbs-crumb-link {
  font-weight: var(--dex-okd-hyperlink-medium-font-weight);
  font-weight: var(--dex-okd-breadcrumbs-primary-default-font-weight, var(--dex-okd-hyperlink-medium-font-weight))
}

.dex-breadcrumbs-primary .dex-breadcrumbs-crumb-link,
.dex-breadcrumbs-primary .dex-breadcrumbs-crumb-link a,
.dex-breadcrumbs-primary .dex-breadcrumbs-crumb-link a:active,
.dex-breadcrumbs-primary .dex-breadcrumbs-crumb-link a:visited {
  color: var(--dex-okd-hyperlink-primary-default-color);
  color: var(--dex-okd-breadcrumbs-primary-default-font-color, var(--dex-okd-hyperlink-primary-default-color))
}

.dex-breadcrumbs-primary .dex-breadcrumbs-crumb-link:hover {
  font-weight: 500;
  font-weight: var(--dex-okd-breadcrumbs-primary-hover-font-weight, 500)
}

.dex-breadcrumbs-primary .dex-breadcrumbs-crumb-active {
  color: var(--dex-okd-breadcrumbs-primary-current-font-color);
  font-weight: var(--dex-okd-breadcrumbs-common-current-font-weight);
  font-weight: var(--dex-okd-breadcrumbs-primary-current-font-weight, var(--dex-okd-breadcrumbs-common-current-font-weight))
}

.dex-breadcrumbs-primary .crumb-icon {
  color: var(--dex-okd-breadcrumbs-primary-icon-color)
}

.dex-breadcrumbs-secondary .dex-breadcrumbs-crumb-link {
  font-weight: var(--dex-okd-hyperlink-medium-font-weight);
  font-weight: var(--dex-okd-breadcrumbs-secondary-default-font-weight, var(--dex-okd-hyperlink-medium-font-weight))
}

.dex-breadcrumbs-secondary .dex-breadcrumbs-crumb-link,
.dex-breadcrumbs-secondary .dex-breadcrumbs-crumb-link a,
.dex-breadcrumbs-secondary .dex-breadcrumbs-crumb-link a:active,
.dex-breadcrumbs-secondary .dex-breadcrumbs-crumb-link a:visited {
  color: var(--dex-okd-hyperlink-secondary-default-color);
  color: var(--dex-okd-breadcrumbs-secondary-default-font-color, var(--dex-okd-hyperlink-secondary-default-color))
}

.dex-breadcrumbs-secondary .dex-breadcrumbs-crumb-link:hover {
  font-weight: 500;
  font-weight: var(--dex-okd-breadcrumbs-secondary-hover-font-weight, 500)
}

.dex-breadcrumbs-secondary .dex-breadcrumbs-crumb-active {
  color: var(--dex-okd-breadcrumbs-secondary-current-font-color);
  font-weight: var(--dex-okd-breadcrumbs-common-current-font-weight);
  font-weight: var(--dex-okd-breadcrumbs-secondary-current-font-weight, var(--dex-okd-breadcrumbs-common-current-font-weight))
}

.dex-breadcrumbs-secondary .crumb-icon {
  color: var(--dex-okd-breadcrumbs-secondary-icon-color)
}

.dex-breadcrumbs-reversed .dex-breadcrumbs-crumb-link {
  font-weight: var(--dex-okd-hyperlink-medium-font-weight);
  font-weight: var(--dex-okd-breadcrumbs-reversed-default-font-weight, var(--dex-okd-hyperlink-medium-font-weight))
}

.dex-breadcrumbs-reversed .dex-breadcrumbs-crumb-link,
.dex-breadcrumbs-reversed .dex-breadcrumbs-crumb-link a,
.dex-breadcrumbs-reversed .dex-breadcrumbs-crumb-link a:active,
.dex-breadcrumbs-reversed .dex-breadcrumbs-crumb-link a:visited {
  color: var(--dex-okd-hyperlink-reversed-default-color);
  color: var(--dex-okd-breadcrumbs-reversed-default-font-color, var(--dex-okd-hyperlink-reversed-default-color))
}

.dex-breadcrumbs-reversed .dex-breadcrumbs-crumb-link:hover {
  font-weight: 500;
  font-weight: var(--dex-okd-breadcrumbs-reversed-hover-font-weight, 500)
}

.dex-breadcrumbs-reversed .dex-breadcrumbs-crumb-active {
  color: var(--dex-okd-breadcrumbs-reversed-current-font-color);
  font-weight: var(--dex-okd-breadcrumbs-common-current-font-weight);
  font-weight: var(--dex-okd-breadcrumbs-reversed-current-font-weight, var(--dex-okd-breadcrumbs-common-current-font-weight))
}

.dex-breadcrumbs-reversed .crumb-icon {
  color: var(--dex-okd-breadcrumbs-reversed-icon-color)
}

.dex-breadcrumbs-xs .dex-breadcrumbs-crumb-active {
  font-size: var(--dex-okd-breadcrumbs-xs-current-font-size);
  line-height: var(--dex-okd-breadcrumbs-xs-current-line-height)
}

.dex-breadcrumbs-xs .crumb-icon {
  font-size: var(--dex-okd-breadcrumbs-xs-icon-font-size);
  margin-left: var(--dex-okd-breadcrumbs-xs-icon-margin-left);
  margin-right: var(--dex-okd-breadcrumbs-xs-icon-margin-right)
}

.dex-breadcrumbs-sm .dex-breadcrumbs-crumb-active {
  font-size: var(--dex-okd-breadcrumbs-sm-current-font-size);
  line-height: var(--dex-okd-breadcrumbs-sm-current-line-height)
}

.dex-breadcrumbs-sm .crumb-icon {
  font-size: var(--dex-okd-breadcrumbs-sm-icon-font-size);
  margin-left: var(--dex-okd-breadcrumbs-sm-icon-margin-left);
  margin-right: var(--dex-okd-breadcrumbs-sm-icon-margin-right)
}

.dex-breadcrumbs-md .dex-breadcrumbs-crumb-active {
  font-size: var(--dex-okd-breadcrumbs-md-current-font-size);
  line-height: var(--dex-okd-breadcrumbs-md-current-line-height)
}

.dex-breadcrumbs-md .crumb-icon {
  font-size: var(--dex-okd-breadcrumbs-md-icon-font-size);
  margin-left: var(--dex-okd-breadcrumbs-md-icon-margin-left);
  margin-right: var(--dex-okd-breadcrumbs-md-icon-margin-right)
}

.dex-breadcrumbs-lg .dex-breadcrumbs-crumb-active {
  font-size: var(--dex-okd-breadcrumbs-lg-current-font-size);
  line-height: var(--dex-okd-breadcrumbs-lg-current-line-height)
}

.dex-breadcrumbs-lg .crumb-icon {
  font-size: var(--dex-okd-breadcrumbs-lg-icon-font-size);
  margin-left: var(--dex-okd-breadcrumbs-lg-icon-margin-left);
  margin-right: var(--dex-okd-breadcrumbs-lg-icon-margin-right)
}

.dex-checkbox-wrapper-indeterminate .dex-checkbox-inner {
  background-color: var(--dex-okd-checkbox-selected-background);
  border-color: var(--dex-okd-checkbox-selected-border-color)
}

.dex-checkbox-wrapper-indeterminate .dex-checkbox-inner:after {
  background-color: var(--dex-okd-checkbox-selected-inner-color);
  box-sizing: border-box;
  content: " ";
  height: 2px;
  left: 50%;
  position: absolute;
  top: 50%;
  transform: translate(-50%, -50%);
  transition: transform .2s cubic-bezier(.12, .4, .29, 1.46) .1s;
  width: 10px
}

.dex-checkbox-wrapper.dex-checkbox-circular .dex-checkbox-inner,
.dex-checkbox-wrapper.dex-checkbox-circular .dex-checkbox-input {
  border-radius: 50px
}

.dex-checkbox-inner {
  background-color: var(--dex-okd-checkbox-default-background);
  border: 1px solid var(--dex-okd-checkbox-default-border-color);
  border-radius: var(--dex-okd-checkbox-common-border-radius);
  box-shadow: var(--dex-okd-checkbox-default-shadow);
  box-sizing: border-box;
  cursor: pointer;
  direction: ltr;
  display: block;
  height: 12px;
  left: 0;
  position: relative;
  top: 0;
  width: 12px
}

.dex-checkbox-input {
  cursor: pointer;
  height: 100%;
  left: 0;
  margin: 0;
  opacity: 0;
  position: absolute;
  width: 100%;
  z-index: 1
}

.dex-checkbox-input:focus-visible {
  border-radius: var(--dex-okd-checkbox-common-border-radius);
  opacity: 1;
  outline: 2px solid var(--dex-okd-color-border-focus);
  outline-color: var(--dex-okd-color-border-focus);
  outline-offset: 2px;
  outline-style: solid;
  outline-width: 2px
}

.dex-checkbox-children {
  cursor: pointer;
  display: inline-block;
  font-size: var(--dex-okd-checkbox-common-label-font-size);
  margin-left: 4px;
  vertical-align: top;
  white-space: normal;
  word-break: break-word
}

.dex-checkbox-wrapper {
  cursor: pointer;
  display: inline-block;
  font-size: 0;
  margin-right: 8px;
  -webkit-user-select: none;
  -moz-user-select: none;
  -ms-user-select: none;
  user-select: none;
  white-space: nowrap
}

.dex-checkbox-wrapper .dex-checkbox-children {
  color: var(--dex-okd-checkbox-default-text-color)
}

.dex-checkbox-wrapper .dex-checkbox {
  cursor: pointer;
  display: inline-block;
  margin-top: 2px;
  position: relative;
  vertical-align: top
}

.dex-checkbox-wrapper.hover-status .dex-checkbox-inner {
  border-color: var(--dex-okd-checkbox-default-hover-border-color);
  box-shadow: var(--dex-okd-checkbox-default-hover-shadow)
}

.dex-checkbox-wrapper-checked .dex-checkbox-children {
  color: var(--dex-okd-checkbox-selected-text-color)
}

.dex-checkbox-wrapper-checked .dex-checkbox-inner {
  background-color: var(--dex-okd-checkbox-selected-background);
  border-color: var(--dex-okd-checkbox-selected-border-color);
  box-shadow: var(--dex-okd-checkbox-selected-shadow)
}

.dex-checkbox-wrapper-checked .dex-checkbox-inner:after {
  background-color: initial;
  border: 2px solid var(--dex-okd-checkbox-selected-inner-color);
  border-left: 0;
  border-top: 0;
  box-sizing: border-box;
  content: " ";
  height: 8px;
  left: 50%;
  position: absolute;
  top: calc(50% - 1px);
  transform: translate(-50%, -50%) rotate(45deg);
  transition: transform .2s cubic-bezier(.12, .4, .29, 1.46) .1s;
  width: 5px
}

.dex-checkbox-wrapper-checked.hover-status .dex-checkbox-inner {
  border-color: var(--dex-okd-checkbox-selected-hover-border-color);
  box-shadow: var(--dex-okd-checkbox-selected-hover-shadow)
}

.dex-checkbox-wrapper-error .dex-checkbox-children {
  color: var(--dex-okd-checkbox-error-text-color)
}

.dex-checkbox-wrapper-error .dex-checkbox-inner {
  border-color: var(--dex-okd-checkbox-error-border-color);
  box-shadow: var(--dex-okd-checkbox-error-shadow)
}

.dex-checkbox-wrapper-error.hover-status .dex-checkbox-inner {
  border-color: var(--dex-okd-checkbox-error-hover-border-color);
  box-shadow: var(--dex-okd-checkbox-error-hover-shadow)
}

.dex-checkbox-wrapper-error.dex-checkbox-wrapper-checked .dex-checkbox-inner {
  background-color: var(--dex-okd-checkbox-error-background);
  border-color: var(--dex-okd-checkbox-error-border-color)
}

.dex-checkbox-wrapper-error.dex-checkbox-wrapper-checked .dex-checkbox-inner:after {
  border-color: var(--dex-okd-checkbox-error-inner-color)
}

.dex-checkbox-wrapper-disabled {
  cursor: not-allowed
}

.dex-checkbox-wrapper-disabled .dex-checkbox-children {
  color: var(--dex-okd-checkbox-disabled-text-color);
  cursor: not-allowed
}

.dex-checkbox-wrapper-disabled .dex-checkbox,
.dex-checkbox-wrapper-disabled .dex-checkbox .dex-checkbox-input {
  cursor: default
}

.dex-checkbox-wrapper-disabled .dex-checkbox .dex-checkbox-inner {
  background-color: var(--dex-okd-checkbox-disabled-background);
  border-color: var(--dex-okd-checkbox-disabled-border-color);
  cursor: default
}

.dex-checkbox-wrapper-disabled.hover-status .dex-checkbox-inner {
  border-color: var(--dex-okd-checkbox-disabled-hover-border-color);
  box-shadow: unset
}

.dex-checkbox-wrapper-disabled.dex-checkbox-wrapper-checked .dex-checkbox-inner {
  background-color: var(--dex-okd-checkbox-disabled-background);
  border-color: var(--dex-okd-checkbox-disabled-border-color)
}

.dex-checkbox-wrapper-disabled.dex-checkbox-wrapper-checked .dex-checkbox-inner:after {
  border-color: var(--dex-okd-checkbox-disabled-inner-color)
}

.dex-checkbox-wrapper-disabled.dex-checkbox-wrapper-indeterminate .dex-checkbox-inner {
  background-color: var(--dex-okd-checkbox-disabled-background);
  border-color: var(--dex-okd-checkbox-disabled-border-color)
}

.dex-checkbox-wrapper-disabled.dex-checkbox-wrapper-indeterminate .dex-checkbox-inner:after {
  background-color: var(--dex-okd-checkbox-disabled-inner-color)
}

.dex-checkbox-sm .dex-checkbox-inner {
  border-radius: 2px;
  border-radius: var(--dex-okd-checkbox-sm-border-radius, 2px);
  height: var(--dex-okd-checkbox-sm-height);
  width: var(--dex-okd-checkbox-sm-width)
}

.dex-checkbox-sm .dex-checkbox-children {
  font-size: var(--dex-okd-checkbox-sm-font-size);
  margin-left: var(--dex-okd-checkbox-sm-margin)
}

.dex-checkbox-sm.dex-checkbox-wrapper {
  line-height: var(--dex-okd-checkbox-sm-line-height);
  padding-bottom: var(--dex-okd-checkbox-sm-padding);
  padding-top: var(--dex-okd-checkbox-sm-padding)
}

.dex-checkbox-md .dex-checkbox-inner {
  border-radius: 4px;
  border-radius: var(--dex-okd-checkbox-md-border-radius, 4px);
  height: var(--dex-okd-checkbox-md-height);
  width: var(--dex-okd-checkbox-md-width)
}

.dex-checkbox-md .dex-checkbox-children {
  font-size: var(--dex-okd-checkbox-md-font-size);
  margin-left: var(--dex-okd-checkbox-md-margin)
}

.dex-checkbox-md.dex-checkbox-wrapper {
  line-height: var(--dex-okd-checkbox-md-line-height);
  padding-bottom: var(--dex-okd-checkbox-md-padding);
  padding-top: var(--dex-okd-checkbox-md-padding)
}

@media (min-width:768px) {

  .dex-checkbox-wrapper-disabled.dex-checkbox-wrapper-checked:hover .dex-checkbox-inner,
  .dex-checkbox-wrapper-disabled:hover .dex-checkbox-inner {
    border-color: var(--dex-okd-checkbox-disabled-hover-border-color);
    box-shadow: unset
  }

  .dex-checkbox-wrapper:not(.dex-checkbox-wrapper-disabled):hover .dex-checkbox-inner {
    border-color: var(--dex-okd-checkbox-default-hover-border-color);
    box-shadow: var(--dex-okd-checkbox-default-hover-shadow)
  }

  .dex-checkbox-wrapper-checked:not(.dex-checkbox-wrapper-disabled):hover .dex-checkbox-inner {
    border-color: var(--dex-okd-checkbox-selected-hover-border-color);
    box-shadow: var(--dex-okd-checkbox-selected-hover-shadow)
  }

  .dex-checkbox-wrapper-error:not(.dex-checkbox-wrapper-disabled):hover .dex-checkbox-inner {
    border-color: var(--dex-okd-checkbox-error-hover-border-color);
    box-shadow: var(--dex-okd-checkbox-error-hover-shadow)
  }
}

.dex-checkbox-reversed.dex-checkbox-wrapper-indeterminate .dex-checkbox-inner {
  background-color: var(--dex-okd-checkbox-reversed-selected-background);
  border-color: var(--dex-okd-checkbox-reversed-selected-border-color)
}

.dex-checkbox-reversed.dex-checkbox-wrapper-indeterminate .dex-checkbox-inner:after {
  background-color: var(--dex-okd-checkbox-reversed-selected-inner-color)
}

.dex-checkbox-reversed .dex-checkbox-inner {
  background-color: var(--dex-okd-checkbox-reversed-default-background);
  border-color: var(--dex-okd-checkbox-reversed-default-border-color);
  box-shadow: var(--dex-okd-checkbox-reversed-default-shadow)
}

.dex-checkbox-reversed.dex-checkbox-wrapper .dex-checkbox-children {
  color: var(--dex-okd-checkbox-reversed-default-text-color)
}

.dex-checkbox-reversed.dex-checkbox-wrapper.hover-status .dex-checkbox-inner,
.dex-checkbox-reversed.dex-checkbox-wrapper:hover .dex-checkbox-inner {
  border-color: var(--dex-okd-checkbox-reversed-default-hover-border-color);
  box-shadow: var(--dex-okd-checkbox-reversed-default-hover-shadow)
}

.dex-checkbox-reversed.dex-checkbox-wrapper-checked .dex-checkbox-children {
  color: var(--dex-okd-checkbox-reversed-selected-text-color)
}

.dex-checkbox-reversed.dex-checkbox-wrapper-checked .dex-checkbox-inner {
  background-color: var(--dex-okd-checkbox-reversed-selected-background);
  border-color: var(--dex-okd-checkbox-reversed-selected-border-color);
  box-shadow: var(--dex-okd-checkbox-reversed-selected-shadow)
}

.dex-checkbox-reversed.dex-checkbox-wrapper-checked .dex-checkbox-inner:after {
  border-color: var(--dex-okd-checkbox-reversed-selected-inner-color)
}

.dex-checkbox-reversed.dex-checkbox-wrapper-checked.hover-status .dex-checkbox-inner,
.dex-checkbox-reversed.dex-checkbox-wrapper-checked:hover .dex-checkbox-inner {
  border-color: var(--dex-okd-checkbox-reversed-selected-hover-border-color);
  box-shadow: var(--dex-okd-checkbox-reversed-selected-hover-shadow)
}

.dex-checkbox-reversed.dex-checkbox-wrapper-error .dex-checkbox-children {
  color: var(--dex-okd-checkbox-reversed-error-text-color)
}

.dex-checkbox-reversed.dex-checkbox-wrapper-error .dex-checkbox-inner {
  border-color: var(--dex-okd-checkbox-reversed-error-border-color);
  box-shadow: var(--dex-okd-checkbox-reversed-error-shadow)
}

.dex-checkbox-reversed.dex-checkbox-wrapper-error.hover-status .dex-checkbox-inner,
.dex-checkbox-reversed.dex-checkbox-wrapper-error:hover .dex-checkbox-inner {
  border-color: var(--dex-okd-checkbox-reversed-error-hover-border-color);
  box-shadow: var(--dex-okd-checkbox-reversed-error-hover-shadow)
}

.dex-checkbox-reversed.dex-checkbox-wrapper-error.dex-checkbox-wrapper-checked .dex-checkbox-inner {
  background-color: var(--dex-okd-checkbox-reversed-error-background);
  border-color: var(--dex-okd-checkbox-reversed-error-border-color)
}

.dex-checkbox-reversed.dex-checkbox-wrapper-error.dex-checkbox-wrapper-checked .dex-checkbox-inner:after {
  border-color: var(--dex-okd-checkbox-reversed-error-inner-color)
}

.dex-checkbox-reversed.dex-checkbox-wrapper-disabled .dex-checkbox-children {
  color: var(--dex-okd-checkbox-reversed-disabled-text-color)
}

.dex-checkbox-reversed.dex-checkbox-wrapper-disabled .dex-checkbox .dex-checkbox-inner {
  background-color: var(--dex-okd-checkbox-reversed-disabled-background);
  border-color: var(--dex-okd-checkbox-reversed-disabled-border-color)
}

.dex-checkbox-reversed.dex-checkbox-wrapper-disabled.hover-status .dex-checkbox-inner,
.dex-checkbox-reversed.dex-checkbox-wrapper-disabled:hover .dex-checkbox-inner {
  border-color: var(--dex-okd-checkbox-reversed-disabled-hover-border-color)
}

.dex-checkbox-reversed.dex-checkbox-wrapper-disabled.dex-checkbox-wrapper-checked .dex-checkbox-inner {
  background-color: var(--dex-okd-checkbox-reversed-disabled-background);
  border-color: var(--dex-okd-checkbox-reversed-disabled-border-color)
}

.dex-checkbox-reversed.dex-checkbox-wrapper-disabled.dex-checkbox-wrapper-checked .dex-checkbox-inner:after {
  border-color: var(--dex-okd-checkbox-reversed-disabled-inner-color)
}

.dex-checkbox-circle {
  align-items: center;
  background-color: initial;
  background-color: var(--dex-okd-checkbox-circle-default-background-color, transparent);
  border: 1px solid #dbdbdb;
  border: 1px solid var(--dex-okd-checkbox-circle-default-border-color, #dbdbdb);
  border-radius: 100%;
  cursor: pointer;
  display: inline-block;
  height: 18px;
  justify-content: center;
  overflow: hidden;
  position: relative;
  width: 18px
}

.dex-checkbox-circle:after {
  background-color: initial;
  border: 2px solid #fff;
  border: 2px solid var(--dex-okd-checkbox-circle-inner-color, #fff);
  border-left: 0;
  border-top: 0;
  box-sizing: border-box;
  content: " ";
  display: none;
  height: 8px;
  left: 50%;
  position: absolute;
  top: calc(50% - 1px);
  transform: translate(-50%, -50%) rotate(45deg);
  transition: transform .2s cubic-bezier(.12, .4, .29, 1.46) .1s;
  width: 5px
}

.dex-checkbox-circle-checked {
  background-color: #000;
  background-color: var(--dex-okd-checkbox-circle-checked-background-color, #000);
  border-color: #000;
  border-color: var(--dex-okd-checkbox-circle-checked-border-color, #000)
}

.dex-checkbox-circle-checked .dex-checkbox-circle-icon {
  visibility: visible
}

.dex-checkbox-circle-checked:after {
  display: block
}

.dex-checkbox-circle-disabled {
  background-color: #f9f9f9;
  background-color: var(--dex-okd-checkbox-circle-default-disabled-background-color, #f9f9f9);
  border-color: #ebebeb;
  border-color: var(--dex-okd-checkbox-circle-default-disabled-border-color, #ebebeb);
  cursor: not-allowed
}

.dex-checkbox-circle-disabled.dex-checkbox-circle-checked {
  background-color: #bdbdbd;
  background-color: var(--dex-okd-checkbox-circle-checked-disabled-background-color, #bdbdbd);
  border-color: #bdbdbd;
  border-color: var(--dex-okd-checkbox-circle-checked-disabled-border-color, #bdbdbd)
}

.dex-form-item-no-style-hidden {
  display: none
}

.dex-form-item {
  flex: auto;
  max-width: 100%;
  min-height: auto
}

.dex-form-item.dex-form-item-hidden {
  display: none !important
}

.dex-form-item .dex-form-item-label {
  color: var(--dex-okd-input-label-color);
  position: relative
}

.dex-form-item .dex-form-item-label-text {
  font-weight: 500
}

.dex-form-item .dex-form-item-label.dex-form-item-label-required:before {
  color: #da252f;
  color: var(--dex-okd-form-item-label-required-color, #da252f);
  content: "*";
  margin-right: 4px;
  margin-right: var(--dex-okd-form-item-label-required-margin-horizontal, 4px)
}

.dex-form-item .dex-form-item-label-action {
  color: var(--dex-okd-input-action-color);
  position: absolute;
  right: 0;
  top: 50%;
  transform: translateY(-50%)
}

.dex-form-item .dex-form-item-control-input-content {
  flex: auto;
  max-width: 100%
}

.dex-form-item .dex-form-item-control-explain {
  margin-top: 4px;
  margin-top: var(--dex-okd-input-md-tip-margin, 4px);
  position: relative
}

.dex-form-item .dex-form-item-control-explain-error {
  color: var(--dex-okd-input-error-tips-color)
}

.dex-form-item .dex-form-item-control-explain-tip {
  color: var(--dex-okd-input-tips-text-color)
}

.dex-form-item .dex-form-item-control-extra {
  color: var(--dex-okd-input-tips-text-color);
  margin-top: 4px;
  margin-top: var(--dex-okd-input-md-tip-margin, 4px)
}

.dex-form * {
  box-sizing: border-box
}

.dex-form .dex-form-item {
  display: flex;
  vertical-align: top
}

.dex-form .dex-form-item.dex-form-item-no-margin,
.dex-form .dex-form-item:not(.dex-form-item-has-error-preserve-margin).dex-form-item-has-error,
.dex-form .dex-form-item:not(.dex-form-item-has-error-preserve-margin).dex-form-item-has-tip {
  margin-bottom: 0 !important
}

.dex-form .dex-form-item.dex-form-item-xs,
.dex-form .dex-form-item.dex-form-line.dex-form-item-has-name {
  margin-bottom: calc(var(--dex-okd-input-xs-tip-line-height) + var(--dex-okd-input-xs-tip-margin, 4px) + 5px)
}

.dex-form .dex-form-item.dex-form-item-xs .dex-form-item-label,
.dex-form .dex-form-item.dex-form-line.dex-form-item-has-name .dex-form-item-label {
  font-size: var(--dex-okd-input-xs-label-font-size)
}

.dex-form .dex-form-item.dex-form-item-xs.dex-form-item-has-error .dex-form-item-control-explain,
.dex-form .dex-form-item.dex-form-item-xs.dex-form-item-has-tip .dex-form-item-control-explain,
.dex-form .dex-form-item.dex-form-line.dex-form-item-has-name.dex-form-item-has-error .dex-form-item-control-explain,
.dex-form .dex-form-item.dex-form-line.dex-form-item-has-name.dex-form-item-has-tip .dex-form-item-control-explain {
  line-height: 1.6;
  min-height: calc(var(--dex-okd-input-xs-tip-line-height) + 9px);
  min-height: calc(var(--dex-okd-input-xs-tip-line-height) + var(--dex-okd-input-xs-tip-margin, 4px) + 5px)
}

.dex-form .dex-form-item.dex-form-item-xs .dex-form-item-control-extra,
.dex-form .dex-form-item.dex-form-line.dex-form-item-has-name .dex-form-item-control-extra {
  font-size: var(--dex-okd-input-xs-tip-font-size)
}

.dex-form .dex-form-item.dex-form-item-xs .dex-form-item-control-explain-error,
.dex-form .dex-form-item.dex-form-line.dex-form-item-has-name .dex-form-item-control-explain-error {
  font-size: var(--dex-okd-input-xs-error-font-size)
}

.dex-form .dex-form-item.dex-form-item-xs .dex-form-item-control-explain-tip,
.dex-form .dex-form-item.dex-form-line.dex-form-item-has-name .dex-form-item-control-explain-tip {
  font-size: var(--dex-okd-input-xs-tip-font-size)
}

.dex-form .dex-form-item.dex-form-item-sm,
.dex-form .dex-form-item.dex-form-line.dex-form-item-has-name {
  margin-bottom: calc(var(--dex-okd-input-sm-tip-line-height) + var(--dex-okd-input-sm-tip-margin, 4px) + 5px)
}

.dex-form .dex-form-item.dex-form-item-sm .dex-form-item-label,
.dex-form .dex-form-item.dex-form-line.dex-form-item-has-name .dex-form-item-label {
  font-size: var(--dex-okd-input-sm-label-font-size)
}

.dex-form .dex-form-item.dex-form-item-sm.dex-form-item-has-error .dex-form-item-control-explain,
.dex-form .dex-form-item.dex-form-item-sm.dex-form-item-has-tip .dex-form-item-control-explain,
.dex-form .dex-form-item.dex-form-line.dex-form-item-has-name.dex-form-item-has-error .dex-form-item-control-explain,
.dex-form .dex-form-item.dex-form-line.dex-form-item-has-name.dex-form-item-has-tip .dex-form-item-control-explain {
  line-height: 1.6;
  min-height: calc(var(--dex-okd-input-sm-tip-line-height) + 9px);
  min-height: calc(var(--dex-okd-input-sm-tip-line-height) + var(--dex-okd-input-sm-tip-margin, 4px) + 5px)
}

.dex-form .dex-form-item.dex-form-item-sm .dex-form-item-control-extra,
.dex-form .dex-form-item.dex-form-line.dex-form-item-has-name .dex-form-item-control-extra {
  font-size: var(--dex-okd-input-sm-tip-font-size)
}

.dex-form .dex-form-item.dex-form-item-sm .dex-form-item-control-explain-error,
.dex-form .dex-form-item.dex-form-line.dex-form-item-has-name .dex-form-item-control-explain-error {
  font-size: var(--dex-okd-input-sm-error-font-size)
}

.dex-form .dex-form-item.dex-form-item-sm .dex-form-item-control-explain-tip,
.dex-form .dex-form-item.dex-form-line.dex-form-item-has-name .dex-form-item-control-explain-tip {
  font-size: var(--dex-okd-input-sm-tip-font-size)
}

.dex-form .dex-form-item.dex-form-item-md,
.dex-form .dex-form-item.dex-form-line.dex-form-item-has-name {
  margin-bottom: calc(var(--dex-okd-input-md-tip-line-height) + var(--dex-okd-input-md-tip-margin, 4px) + 5px)
}

.dex-form .dex-form-item.dex-form-item-md .dex-form-item-label,
.dex-form .dex-form-item.dex-form-line.dex-form-item-has-name .dex-form-item-label {
  font-size: var(--dex-okd-input-md-label-font-size)
}

.dex-form .dex-form-item.dex-form-item-md.dex-form-item-has-error .dex-form-item-control-explain,
.dex-form .dex-form-item.dex-form-item-md.dex-form-item-has-tip .dex-form-item-control-explain,
.dex-form .dex-form-item.dex-form-line.dex-form-item-has-name.dex-form-item-has-error .dex-form-item-control-explain,
.dex-form .dex-form-item.dex-form-line.dex-form-item-has-name.dex-form-item-has-tip .dex-form-item-control-explain {
  line-height: 1.6;
  min-height: calc(var(--dex-okd-input-md-tip-line-height) + 9px);
  min-height: calc(var(--dex-okd-input-md-tip-line-height) + var(--dex-okd-input-md-tip-margin, 4px) + 5px)
}

.dex-form .dex-form-item.dex-form-item-md .dex-form-item-control-extra,
.dex-form .dex-form-item.dex-form-line.dex-form-item-has-name .dex-form-item-control-extra {
  font-size: var(--dex-okd-input-md-tip-font-size)
}

.dex-form .dex-form-item.dex-form-item-md .dex-form-item-control-explain-error,
.dex-form .dex-form-item.dex-form-line.dex-form-item-has-name .dex-form-item-control-explain-error {
  font-size: var(--dex-okd-input-md-error-font-size)
}

.dex-form .dex-form-item.dex-form-item-md .dex-form-item-control-explain-tip,
.dex-form .dex-form-item.dex-form-line.dex-form-item-has-name .dex-form-item-control-explain-tip {
  font-size: var(--dex-okd-input-md-tip-font-size)
}

.dex-form .dex-form-item.dex-form-item-lg,
.dex-form .dex-form-item.dex-form-line.dex-form-item-has-name {
  margin-bottom: calc(var(--dex-okd-input-lg-tip-line-height) + var(--dex-okd-input-lg-tip-margin, 6px) + 5px)
}

.dex-form .dex-form-item.dex-form-item-lg .dex-form-item-label,
.dex-form .dex-form-item.dex-form-line.dex-form-item-has-name .dex-form-item-label {
  font-size: var(--dex-okd-input-lg-label-font-size)
}

.dex-form .dex-form-item.dex-form-item-lg.dex-form-item-has-error .dex-form-item-control-explain,
.dex-form .dex-form-item.dex-form-item-lg.dex-form-item-has-tip .dex-form-item-control-explain,
.dex-form .dex-form-item.dex-form-line.dex-form-item-has-name.dex-form-item-has-error .dex-form-item-control-explain,
.dex-form .dex-form-item.dex-form-line.dex-form-item-has-name.dex-form-item-has-tip .dex-form-item-control-explain {
  line-height: 1.6;
  min-height: calc(var(--dex-okd-input-lg-tip-line-height) + 11px);
  min-height: calc(var(--dex-okd-input-lg-tip-line-height) + var(--dex-okd-input-lg-tip-margin, 6px) + 5px)
}

.dex-form .dex-form-item.dex-form-item-lg .dex-form-item-control-extra,
.dex-form .dex-form-item.dex-form-line.dex-form-item-has-name .dex-form-item-control-extra {
  font-size: var(--dex-okd-input-lg-tip-font-size)
}

.dex-form .dex-form-item.dex-form-item-lg .dex-form-item-control-explain-error,
.dex-form .dex-form-item.dex-form-line.dex-form-item-has-name .dex-form-item-control-explain-error {
  font-size: var(--dex-okd-input-lg-error-font-size)
}

.dex-form .dex-form-item.dex-form-item-lg .dex-form-item-control-explain-tip,
.dex-form .dex-form-item.dex-form-line.dex-form-item-has-name .dex-form-item-control-explain-tip {
  font-size: var(--dex-okd-input-lg-tip-font-size)
}

.dex-form .dex-form-item.dex-form-item-xl,
.dex-form .dex-form-item.dex-form-line.dex-form-item-has-name {
  margin-bottom: calc(var(--dex-okd-input-xl-tip-line-height) + var(--dex-okd-input-xl-tip-margin, 6px) + 5px)
}

.dex-form .dex-form-item.dex-form-item-xl .dex-form-item-label,
.dex-form .dex-form-item.dex-form-line.dex-form-item-has-name .dex-form-item-label {
  font-size: var(--dex-okd-input-xl-label-font-size)
}

.dex-form .dex-form-item.dex-form-item-xl.dex-form-item-has-error .dex-form-item-control-explain,
.dex-form .dex-form-item.dex-form-item-xl.dex-form-item-has-tip .dex-form-item-control-explain,
.dex-form .dex-form-item.dex-form-line.dex-form-item-has-name.dex-form-item-has-error .dex-form-item-control-explain,
.dex-form .dex-form-item.dex-form-line.dex-form-item-has-name.dex-form-item-has-tip .dex-form-item-control-explain {
  line-height: 1.6;
  min-height: calc(var(--dex-okd-input-xl-tip-line-height) + 11px);
  min-height: calc(var(--dex-okd-input-xl-tip-line-height) + var(--dex-okd-input-xl-tip-margin, 6px) + 5px)
}

.dex-form .dex-form-item.dex-form-item-xl .dex-form-item-control-extra,
.dex-form .dex-form-item.dex-form-line.dex-form-item-has-name .dex-form-item-control-extra {
  font-size: var(--dex-okd-input-xl-tip-font-size)
}

.dex-form .dex-form-item.dex-form-item-xl .dex-form-item-control-explain-error,
.dex-form .dex-form-item.dex-form-line.dex-form-item-has-name .dex-form-item-control-explain-error {
  font-size: var(--dex-okd-input-xl-error-font-size)
}

.dex-form .dex-form-item.dex-form-item-xl .dex-form-item-control-explain-tip,
.dex-form .dex-form-item.dex-form-line.dex-form-item-has-name .dex-form-item-control-explain-tip {
  font-size: var(--dex-okd-input-xl-tip-font-size)
}

.dex-form .dex-form-item.dex-form-line {
  margin-bottom: 0
}

.dex-form.dex-form-vertical .dex-form-item {
  flex-direction: column
}

.dex-form.dex-form-vertical .dex-form-item.dex-form-item-xs .dex-form-item-label {
  line-height: var(--dex-okd-input-xs-label-line-height);
  margin-bottom: 4px;
  margin-bottom: var(--dex-okd-input-xs-label-margin, 4px)
}

.dex-form.dex-form-vertical .dex-form-item.dex-form-item-sm .dex-form-item-label {
  line-height: var(--dex-okd-input-sm-label-line-height);
  margin-bottom: 4px;
  margin-bottom: var(--dex-okd-input-sm-label-margin, 4px)
}

.dex-form.dex-form-vertical .dex-form-item.dex-form-item-md .dex-form-item-label {
  line-height: var(--dex-okd-input-md-label-line-height);
  margin-bottom: 4px;
  margin-bottom: var(--dex-okd-input-md-label-margin, 4px)
}

.dex-form.dex-form-vertical .dex-form-item.dex-form-item-lg .dex-form-item-label {
  line-height: var(--dex-okd-input-lg-label-line-height);
  margin-bottom: 6px;
  margin-bottom: var(--dex-okd-input-lg-label-margin, 6px)
}

.dex-form.dex-form-vertical .dex-form-item.dex-form-item-xl .dex-form-item-label {
  line-height: var(--dex-okd-input-xl-label-line-height);
  margin-bottom: 6px;
  margin-bottom: var(--dex-okd-input-xl-label-margin, 6px)
}

.dex-form.dex-form-horizontal .dex-form-item-no-label .dex-form-item-control {
  margin-left: 16.66666667%;
  margin-left: var(--dex-okd-form-item-label-width-horizontal, 16.66666667%)
}

.dex-form.dex-form-horizontal .dex-form-item .dex-form-item-label {
  flex: 0 0 16.66666667%;
  flex: 0 0 var(--dex-okd-form-item-label-width-horizontal, 16.66666667%);
  overflow: hidden;
  white-space: nowrap;
  width: 16.66666667%;
  width: var(--dex-okd-form-item-label-width-horizontal, 16.66666667%)
}

.dex-form.dex-form-horizontal .dex-form-item .dex-form-item-label:after {
  content: ":";
  margin: 0 8px 0 2px
}

.dex-form.dex-form-horizontal .dex-form-item .dex-form-item-label.dex-form-item-label-no-colon:after {
  content: ""
}

.dex-form.dex-form-horizontal .dex-form-item .dex-form-item-label.dex-form-item-label-align-left {
  text-align: left
}

.dex-form.dex-form-horizontal .dex-form-item .dex-form-item-label.dex-form-item-label-align-right {
  text-align: right
}

.dex-form.dex-form-horizontal .dex-form-item .dex-form-item-label-action {
  display: none
}

.dex-form.dex-form-horizontal .dex-form-item .dex-form-item-control {
  flex: 1 1
}

.dex-form.dex-form-horizontal .dex-form-item.dex-form-item-xs .dex-form-item-label {
  line-height: var(--dex-okd-input-xs-height)
}

.dex-form.dex-form-horizontal .dex-form-item.dex-form-item-xs .dex-form-item-control-input {
  align-items: center;
  display: flex;
  min-height: var(--dex-okd-input-xs-height)
}

.dex-form.dex-form-horizontal .dex-form-item.dex-form-item-xs .dex-form-item-control-input-content {
  width: 100%
}

.dex-form.dex-form-horizontal .dex-form-item.dex-form-item-sm .dex-form-item-label {
  line-height: var(--dex-okd-input-sm-height)
}

.dex-form.dex-form-horizontal .dex-form-item.dex-form-item-sm .dex-form-item-control-input {
  align-items: center;
  display: flex;
  min-height: var(--dex-okd-input-sm-height)
}

.dex-form.dex-form-horizontal .dex-form-item.dex-form-item-sm .dex-form-item-control-input-content {
  width: 100%
}

.dex-form.dex-form-horizontal .dex-form-item.dex-form-item-md .dex-form-item-label {
  line-height: var(--dex-okd-input-md-height)
}

.dex-form.dex-form-horizontal .dex-form-item.dex-form-item-md .dex-form-item-control-input {
  align-items: center;
  display: flex;
  min-height: var(--dex-okd-input-md-height)
}

.dex-form.dex-form-horizontal .dex-form-item.dex-form-item-md .dex-form-item-control-input-content {
  width: 100%
}

.dex-form.dex-form-horizontal .dex-form-item.dex-form-item-lg .dex-form-item-label {
  line-height: var(--dex-okd-input-lg-height)
}

.dex-form.dex-form-horizontal .dex-form-item.dex-form-item-lg .dex-form-item-control-input {
  align-items: center;
  display: flex;
  min-height: var(--dex-okd-input-lg-height)
}

.dex-form.dex-form-horizontal .dex-form-item.dex-form-item-lg .dex-form-item-control-input-content {
  width: 100%
}

.dex-form.dex-form-horizontal .dex-form-item.dex-form-item-xl .dex-form-item-label {
  line-height: var(--dex-okd-input-xl-height)
}

.dex-form.dex-form-horizontal .dex-form-item.dex-form-item-xl .dex-form-item-control-input {
  align-items: center;
  display: flex;
  min-height: var(--dex-okd-input-xl-height)
}

.dex-form.dex-form-horizontal .dex-form-item.dex-form-item-xl .dex-form-item-control-input-content {
  width: 100%
}

.dex-form.dex-form-horizontal .dex-form-line .dex-form-item-no-label .dex-form-item-control {
  margin-left: 0
}

.dex-form.dex-form-inline {
  display: flex;
  flex-wrap: wrap
}

.dex-form.dex-form-inline .dex-form-item {
  display: flex;
  flex: none;
  margin-right: 16px;
  margin-right: var(--dex-okd-form-item-margin-inline, 16px)
}

.dex-form.dex-form-inline .dex-form-item .dex-form-item-label {
  width: auto
}

.dex-form.dex-form-inline .dex-form-item .dex-form-item-label:after {
  content: ":";
  margin: 0 8px 0 2px
}

.dex-form.dex-form-inline .dex-form-item .dex-form-item-label .dex-form-item-label-action,
.dex-form.dex-form-inline .dex-form-item .dex-form-item-label-action {
  display: none
}

.dex-form.dex-form-inline .dex-form-item.dex-form-item-xs .dex-form-item-label {
  line-height: var(--dex-okd-input-xs-height)
}

.dex-form.dex-form-inline .dex-form-item.dex-form-item-xs .dex-form-item-control-input {
  align-items: center;
  display: flex;
  min-height: var(--dex-okd-input-xs-height)
}

.dex-form.dex-form-inline .dex-form-item.dex-form-item-sm .dex-form-item-label {
  line-height: var(--dex-okd-input-sm-height)
}

.dex-form.dex-form-inline .dex-form-item.dex-form-item-sm .dex-form-item-control-input {
  align-items: center;
  display: flex;
  min-height: var(--dex-okd-input-sm-height)
}

.dex-form.dex-form-inline .dex-form-item.dex-form-item-md .dex-form-item-label {
  line-height: var(--dex-okd-input-md-height)
}

.dex-form.dex-form-inline .dex-form-item.dex-form-item-md .dex-form-item-control-input {
  align-items: center;
  display: flex;
  min-height: var(--dex-okd-input-md-height)
}

.dex-form.dex-form-inline .dex-form-item.dex-form-item-lg .dex-form-item-label {
  line-height: var(--dex-okd-input-lg-height)
}

.dex-form.dex-form-inline .dex-form-item.dex-form-item-lg .dex-form-item-control-input {
  align-items: center;
  display: flex;
  min-height: var(--dex-okd-input-lg-height)
}

.dex-form.dex-form-inline .dex-form-item.dex-form-item-xl .dex-form-item-label {
  line-height: var(--dex-okd-input-xl-height)
}

.dex-form.dex-form-inline .dex-form-item.dex-form-item-xl .dex-form-item-control-input {
  align-items: center;
  display: flex;
  min-height: var(--dex-okd-input-xl-height)
}

.dex-slider {
  display: flex
}

.dex-slider div {
  box-sizing: border-box
}

.dex-slider-content {
  display: flex;
  flex: 1 1;
  flex-direction: column;
  padding: 5px 8px
}

.dex-slider-total {
  align-items: center;
  display: flex;
  margin-left: 16px;
  width: 48px
}

.dex-slider-label {
  color: var(--dex-okd-slider-label-color);
  font-size: var(--dex-okd-slider-label-font-size);
  line-height: var(--dex-okd-slider-label-line-height)
}

.dex-slider-desc {
  color: var(--dex-okd-slider-desc-color);
  font-size: var(--dex-okd-slider-desc-font-size);
  line-height: var(--dex-okd-slider-desc-line-height);
  margin-top: 6px;
  margin-top: var(--dex-okd-slider-desc-margin-top, 6px)
}

.dex-slider-clickable {
  align-items: center;
  cursor: pointer;
  display: flex;
  height: 10px;
  margin: 10px 0
}

.dex-slider-clickable-margin {
  margin-bottom: 20px
}

.dex-slider-track {
  background: var(--dex-okd-slider-common-track-color);
  border-radius: 3px;
  height: var(--dex-okd-slider-md-track-height);
  position: relative;
  width: 100%
}

.dex-slider-mark {
  background-color: var(--dex-okd-slider-common-active-color);
  border-radius: 3px;
  height: 100%;
  position: absolute
}

.dex-slider-mark-node {
  align-items: center;
  background: var(--dex-okd-slider-node-bg-color);
  border: 1px solid var(--dex-okd-slider-node-border-color);
  border-radius: 100%;
  cursor: pointer;
  display: flex;
  height: var(--dex-okd-slider-md-node-size);
  justify-content: center;
  position: absolute;
  top: 50%;
  transform: translate(-50%, -50%);
  width: var(--dex-okd-slider-md-node-size)
}

.dex-slider-mark-node-text {
  color: var(--dex-okd-slider-common-text-color);
  font-size: 12px;
  left: 50%;
  line-height: 20px;
  position: absolute;
  top: 14px;
  top: var(--dex-okd-slider-common-top, 14px);
  transform: translateX(-50%);
  word-break: keep-all
}

.dex-slider-mark-node:last-child .dex-slider-mark-node-text {
  left: auto;
  right: 0;
  transform: none
}

.dex-slider-mark-node:first-child .dex-slider-mark-node-text {
  left: 0;
  transform: none
}

.dex-slider-mark-node-active {
  border-color: var(--dex-okd-slider-common-active-color)
}

.dex-slider-mark-node-active .dex-slider-mark-node-text {
  color: var(--dex-okd-slider-common-text-color);
  color: var(--dex-okd-slider-common-text-active-color, var(--dex-okd-slider-common-text-color))
}

.dex-slider-mark-node-no-circle {
  background: none;
  border: none
}

.dex-slider-handler {
  align-items: center;
  border-radius: 100%;
  cursor: pointer;
  display: flex;
  justify-content: center;
  position: absolute;
  top: 50%;
  transform: translate(-50%, -50%)
}

.dex-slider-handler:focus-visible {
  border-radius: 20px;
  outline: 2px solid var(--dex-okd-color-border-focus);
  outline-color: var(--dex-okd-color-border-focus);
  outline-offset: 2px;
  outline-style: solid;
  outline-width: 2px
}

.dex-slider-handler-inner {
  background-color: #fff;
  background-color: var(--dex-okd-slider-handler-bg-color, #fff);
  border: 2px solid var(--dex-okd-slider-handler-border-color);
  border-radius: 100%;
  height: var(--dex-okd-slider-md-handler-size);
  width: var(--dex-okd-slider-md-handler-size)
}

.dex-slider-handler-inner.dex-slider-active,
.dex-slider-handler-inner:hover {
  height: var(--dex-okd-slider-md-handler-hover-size);
  width: var(--dex-okd-slider-md-handler-hover-size)
}

.dex-slider-handler-inner.dex-slider-active {
  border: 4px solid var(--dex-okd-slider-handler-shadow-color)
}

.dex-slider-disabled {
  cursor: not-allowed
}

.dex-slider-disabled .dex-slider-handler-inner {
  border-color: var(--dex-okd-slider-handler-border-disabled-color, var(--dex-okd-slider-handler-border-color))
}

.dex-slider-disabled .dex-slider-handler-inner:hover {
  height: var(--dex-okd-slider-md-handler-size);
  width: var(--dex-okd-slider-md-handler-size)
}

.dex-slider-disabled .dex-slider-mark {
  background-color: var(--dex-okd-slider-common-active-color);
  background-color: var(--dex-okd-slider-common-disabled-active-color, var(--dex-okd-slider-common-active-color))
}

.dex-slider-disabled .dex-slider-mark-node-active {
  border-color: var(--dex-okd-slider-common-disabled-active-color, var(--dex-okd-slider-common-active-color))
}

.dex-slider-disabled .dex-slider-mark-node-active .dex-slider-mark-node-text {
  color: var(--dex-okd-slider-common-text-color);
  color: var(--dex-okd-slider-common-text-disabled-active-color, var(--dex-okd-slider-common-text-color))
}

.dex-slider-sm .dex-slider-track {
  height: var(--dex-okd-slider-sm-track-height)
}

.dex-slider-sm .dex-slider-mark-node {
  background: var(--dex-okd-slider-node-bg-color);
  border: 1px solid var(--dex-okd-slider-node-border-color);
  height: var(--dex-okd-slider-sm-node-size);
  width: var(--dex-okd-slider-sm-node-size)
}

.dex-slider-sm .dex-slider-mark-node-active {
  border: 1px solid var(--dex-okd-slider-common-active-color)
}

.dex-slider-sm .dex-slider-mark-node-text {
  top: 14px;
  top: var(--dex-okd-slider-sm-node-text-top, 14px)
}

.dex-slider-sm .dex-slider-handler-inner {
  border: 2px solid var(--dex-okd-slider-handler-border-color);
  height: var(--dex-okd-slider-sm-handler-size);
  width: var(--dex-okd-slider-sm-handler-size)
}

.dex-slider-sm .dex-slider-handler-inner:hover {
  height: var(--dex-okd-slider-sm-handler-hover-size);
  width: var(--dex-okd-slider-sm-handler-hover-size)
}

.dex-slider-sm .dex-slider-handler-inner.dex-slider-active {
  border-width: 2px
}

.dex-slider-sm .dex-slider-active {
  height: var(--dex-okd-slider-sm-handler-hover-size);
  width: var(--dex-okd-slider-sm-handler-hover-size)
}

.dex-slider-sm .dex-slider-disabled {
  cursor: not-allowed
}

.dex-slider-sm .dex-slider-disabled .dex-slider-handler-inner {
  border-color: var(--dex-okd-slider-handler-border-disabled-color, var(--dex-okd-slider-handler-border-color))
}

.dex-slider-sm .dex-slider-disabled .dex-slider-handler-inner:hover {
  height: var(--dex-okd-slider-sm-handler-size);
  width: var(--dex-okd-slider-sm-handler-size)
}

.dex-slider-sm .dex-slider-disabled .dex-slider-mark {
  background-color: var(--dex-okd-slider-common-active-color);
  background-color: var(--dex-okd-slider-common-disabled-active-color, var(--dex-okd-slider-common-active-color))
}

.dex-slider-sm .dex-slider-disabled .dex-slider-mark-node-active {
  border-color: var(--dex-okd-slider-common-disabled-active-color, var(--dex-okd-slider-common-active-color))
}

.dex-slider-sm .dex-slider-disabled .dex-slider-mark-node-active .dex-slider-mark-node-text {
  color: var(--dex-okd-slider-common-text-color);
  color: var(--dex-okd-slider-common-text-disabled-active-color, var(--dex-okd-slider-common-text-color))
}

.dex-select-empty {
  align-items: center;
  display: flex;
  flex-direction: column;
  height: calc(100% - 48px);
  justify-content: center;
  min-height: 160px
}

.dex-select-empty .empty-text {
  color: var(--dex-okd-select-empty-default-text-color)
}

.dex-select-empty .empty-text-sm {
  font-size: var(--dex-okd-select-sm-empty-font-size)
}

.dex-select-empty .empty-text-md {
  font-size: var(--dex-okd-select-md-empty-font-size)
}

.dex-select-empty .empty-text-xs {
  font-size: var(--dex-okd-select-xs-empty-font-size)
}

.dex-select-empty .empty-text-lg {
  font-size: var(--dex-okd-select-md-empty-font-size);
  font-size: var(--dex-okd-select-lg-empty-font-size, var(--dex-okd-select-md-empty-font-size))
}

.dex-select-empty .empty-text-xl {
  font-size: var(--dex-okd-select-md-empty-font-size);
  font-size: var(--dex-okd-select-xl-empty-font-size, var(--dex-okd-select-md-empty-font-size))
}

.dex-select-empty .empty-text-mobile {
  font-size: 14px;
  font-size: var(--dex-okd-select-mobile-empty-font-size, 14px)
}

.dex-select-item {
  align-items: center;
  color: var(--dex-okd-select-option-default-text-color);
  cursor: pointer;
  display: flex;
  font-weight: 400;
  min-width: 90px
}

.dex-select-item.dex-select-item-active {
  background: var(--dex-okd-select-option-active-bg);
  color: var(--dex-okd-select-option-active-text-color)
}

.dex-select-item.hover,
.dex-select-item:hover {
  background: var(--dex-okd-select-option-hover-bg);
  color: var(--dex-okd-select-option-hover-text-color)
}

.dex-select-item.disabled {
  background: var(--dex-okd-select-option-disabled-bg);
  color: var(--dex-okd-select-option-disabled-text-color);
  cursor: not-allowed
}

.dex-select-item.disabled .dex-select-item-check {
  opacity: .2
}

.dex-select-item.align-center {
  justify-content: center
}

.dex-select-item.align-left {
  justify-content: flex-start
}

.dex-select-item.align-right {
  justify-content: flex-end
}

.dex-select-item-check {
  color: var(--dex-okd-select-check-default-icon-color);
  margin-left: auto
}

.dex-select-item-title {
  color: var(--dex-okd-select-common-title-color)
}

.dex-select-item-title-inner {
  display: inline-block
}

.dex-select-item-line {
  border-top: var(--dex-okd-select-option-common-line-height) solid var(--dex-okd-select-option-common-line-color);
  height: 0;
  margin: var(--dex-okd-select-option-common-line-margin-vertical) 0;
  width: 100%
}

.dex-select-item-show-check .dex-select-item-active {
  background: var(--dex-okd-select-option-active-bg)
}

.option-sm .dex-select-item-title {
  font-size: var(--dex-okd-select-sm-title-font-size);
  line-height: var(--dex-okd-select-sm-title-line-height);
  padding: var(--dex-okd-select-sm-title-padding-top) var(--dex-okd-select-sm-title-padding-horizontal) var(--dex-okd-select-sm-title-padding-bottom)
}

.option-sm .dex-select-item {
  font-size: var(--dex-okd-select-sm-option-font-size);
  line-height: var(--dex-okd-select-sm-option-line-height);
  padding: var(--dex-okd-select-sm-option-padding-vertical) var(--dex-okd-select-sm-option-padding-horizontal)
}

.option-sm .dex-select-item-check {
  font-size: 18px;
  font-size: var(--dex-okd-select-sm-option-icon-font-size, 18px);
  padding-left: 8px
}

.option-sm .dex-select-item.custom {
  padding: 0
}

.option-md .dex-select-item-title {
  font-size: var(--dex-okd-select-md-title-font-size);
  line-height: var(--dex-okd-select-md-title-line-height);
  padding: var(--dex-okd-select-md-title-padding-top) var(--dex-okd-select-md-title-padding-horizontal) var(--dex-okd-select-md-title-padding-bottom)
}

.option-md .dex-select-item {
  font-size: var(--dex-okd-select-md-option-font-size);
  line-height: var(--dex-okd-select-md-option-line-height);
  padding: var(--dex-okd-select-md-option-padding-vertical) var(--dex-okd-select-md-option-padding-horizontal)
}

.option-md .dex-select-item-check {
  font-size: 18px;
  font-size: var(--dex-okd-select-md-option-icon-font-size, 18px);
  padding-left: 8px
}

.option-md .dex-select-item.custom {
  padding: 0
}

.option-xs .dex-select-item-title {
  font-size: var(--dex-okd-select-xs-title-font-size);
  line-height: var(--dex-okd-select-xs-title-line-height);
  padding: var(--dex-okd-select-xs-title-padding-top) var(--dex-okd-select-xs-title-padding-horizontal) var(--dex-okd-select-xs-title-padding-bottom)
}

.option-xs .dex-select-item {
  font-size: var(--dex-okd-select-xs-option-font-size);
  line-height: var(--dex-okd-select-xs-option-line-height);
  padding: var(--dex-okd-select-xs-option-padding-vertical) var(--dex-okd-select-xs-option-padding-horizontal)
}

.option-xs .dex-select-item-check {
  font-size: 18px;
  font-size: var(--dex-okd-select-xs-option-icon-font-size, 18px);
  padding-left: 8px
}

.option-xs .dex-select-item.custom {
  padding: 0
}

.option-lg .dex-select-item-title {
  font-size: var(--dex-okd-select-md-title-font-size);
  font-size: var(--dex-okd-select-lg-title-font-size, var(--dex-okd-select-md-title-font-size));
  line-height: var(--dex-okd-select-md-title-line-height);
  line-height: var(--dex-okd-select-lg-title-line-height, var(--dex-okd-select-md-title-line-height));
  padding: var(--dex-okd-select-lg-title-padding-top, var(--dex-okd-select-md-title-padding-top)) var(--dex-okd-select-lg-title-padding-horizontal, var(--dex-okd-select-md-title-padding-horizontal)) var(--dex-okd-select-lg-title-padding-bottom, var(--dex-okd-select-md-title-padding-bottom))
}

.option-lg .dex-select-item {
  font-size: var(--dex-okd-select-md-option-font-size);
  font-size: var(--dex-okd-select-lg-option-font-size, var(--dex-okd-select-md-option-font-size));
  line-height: var(--dex-okd-select-md-option-line-height);
  line-height: var(--dex-okd-select-lg-option-line-height, var(--dex-okd-select-md-option-line-height));
  padding: var(--dex-okd-select-lg-option-padding-vertical, var(--dex-okd-select-md-option-padding-vertical)) var(--dex-okd-select-lg-option-padding-horizontal, var(--dex-okd-select-md-option-padding-horizontal))
}

.option-lg .dex-select-item-check {
  font-size: 18px;
  font-size: var(--dex-okd-select-lg-option-icon-font-size, 18px);
  padding-left: 8px
}

.option-lg .dex-select-item.custom {
  padding: 0
}

.option-xl .dex-select-item-title {
  font-size: var(--dex-okd-select-md-title-font-size);
  font-size: var(--dex-okd-select-xl-title-font-size, var(--dex-okd-select-md-title-font-size));
  line-height: var(--dex-okd-select-md-title-line-height);
  line-height: var(--dex-okd-select-xl-title-line-height, var(--dex-okd-select-md-title-line-height));
  padding: var(--dex-okd-select-xl-title-padding-top, var(--dex-okd-select-md-title-padding-top)) var(--dex-okd-select-xl-title-padding-horizontal, var(--dex-okd-select-md-title-padding-horizontal)) var(--dex-okd-select-xl-title-padding-bottom, var(--dex-okd-select-md-title-padding-bottom))
}

.option-xl .dex-select-item {
  font-size: var(--dex-okd-select-md-option-font-size);
  font-size: var(--dex-okd-select-xl-option-font-size, var(--dex-okd-select-md-option-font-size));
  line-height: var(--dex-okd-select-md-option-line-height);
  line-height: var(--dex-okd-select-xl-option-line-height, var(--dex-okd-select-md-option-line-height));
  padding: var(--dex-okd-select-xl-option-padding-vertical, var(--dex-okd-select-md-option-padding-vertical)) var(--dex-okd-select-xl-option-padding-horizontal, var(--dex-okd-select-md-option-padding-horizontal))
}

.option-xl .dex-select-item-check {
  font-size: 18px;
  font-size: var(--dex-okd-select-xl-option-icon-font-size, 18px);
  padding-left: 8px
}

.option-xl .dex-select-item.custom {
  padding: 0
}

@media (max-width:767px) {
  .dex-select-option:not(.drop-mode) .dex-select-item-container .dex-select-item-title {
    font-size: var(--dex-okd-select-md-title-font-size);
    font-size: var(--dex-okd-select-mobile-option-title-font-size, var(--dex-okd-select-md-title-font-size));
    line-height: var(--dex-okd-select-md-title-line-height);
    line-height: var(--dex-okd-select-mobile-option-title-line-height, var(--dex-okd-select-md-title-line-height));
    padding: var(--dex-okd-select-mobile-option-title-padding-top, var(--dex-okd-select-md-title-padding-top)) var(--dex-okd-select-mobile-option-title-padding-horizontal, var(--dex-okd-select-md-title-padding-horizontal)) var(--dex-okd-select-mobile-option-title-padding-bottom, var(--dex-okd-select-md-title-padding-bottom))
  }

  .dex-select-option:not(.drop-mode) .dex-select-item-container .dex-select-item {
    font-size: 16px;
    font-size: var(--dex-okd-select-mobile-option-font-size, 16px);
    line-height: 20px;
    line-height: var(--dex-okd-select-mobile-option-line-height, 20px);
    padding: 18px 16px;
    padding: var(--dex-okd-select-mobile-option-padding-vertical, 18px) var(--dex-okd-select-mobile-option-padding-horizontal, 16px)
  }

  .dex-select-option:not(.drop-mode) .dex-select-item-container .dex-select-item-check {
    font-size: 24px;
    font-size: var(--dex-okd-select-mobile-option-icon-font-size, 24px)
  }

  .dex-select-option:not(.drop-mode) .dex-select-item-container .dex-select-item.custom {
    padding: 0
  }
}

.dex-select-search.focus .dex-input-box.dex-select-search-box,
.dex-select-search.hover .dex-input-box.dex-select-search-box,
.dex-select-search:focus .dex-input-box.dex-select-search-box,
.dex-select-search:hover .dex-input-box.dex-select-search-box {
  background-color: var(--dex-okd-input-search-default-background);
  border-color: var(--dex-okd-input-search-default-border-color);
  box-shadow: var(--dex-okd-input-search-default-shadow)
}

.dex-select-search .dex-select-search-ellipsis {
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap
}

.dex-select-search .dex-select-search-default-width {
  min-width: 70px;
  width: unset
}

.option-sm .dex-select-empty,
.option-sm .dex-select-search {
  margin: var(--dex-okd-select-sm-search-margin-vertical) var(--dex-okd-select-sm-search-margin-horizontal)
}

.option-md .dex-select-empty,
.option-md .dex-select-search {
  margin: var(--dex-okd-select-md-search-margin-vertical) var(--dex-okd-select-md-search-margin-horizontal)
}

.option-xs .dex-select-empty,
.option-xs .dex-select-search {
  margin: var(--dex-okd-select-xs-search-margin-vertical) var(--dex-okd-select-xs-search-margin-horizontal)
}

.option-lg .dex-select-empty,
.option-lg .dex-select-search {
  margin: var(--dex-okd-select-lg-search-margin-vertical, var(--dex-okd-select-md-search-margin-vertical)) var(--dex-okd-select-lg-search-margin-horizontal, var(--dex-okd-select-md-search-margin-horizontal))
}

.option-xl .dex-select-empty,
.option-xl .dex-select-search {
  margin: var(--dex-okd-select-xl-search-margin-vertical, var(--dex-okd-select-md-search-margin-vertical)) var(--dex-okd-select-xl-search-margin-horizontal, var(--dex-okd-select-md-search-margin-horizontal))
}

.dex-select-tag {
  align-items: center;
  background-color: #f2f2f2;
  background-color: var(--dex-okd-select-tag-default-background, #f2f2f2);
  border-radius: 4px;
  border-radius: var(--dex-okd-select-tag-border-radius, 4px);
  color: #000;
  color: var(--dex-okd-select-tag-text-default-color, #000);
  cursor: unset;
  display: flex;
  justify-content: space-between;
  margin-bottom: 4px;
  margin-bottom: var(--dex-okd-select-tag-margin-bottom, 4px);
  margin-right: 4px;
  margin-right: var(--dex-okd-select-tag-margin-right, 4px);
  max-width: 100%;
  padding-left: 8px;
  padding-left: var(--dex-okd-select-tag-padding-horizontal, 8px);
  padding-right: 8px;
  padding-right: var(--dex-okd-select-tag-padding-horizontal, 8px)
}

.dex-select-tag-icon {
  color: #929292;
  color: var(--dex-okd-select-tag-icon-default-color, #929292);
  cursor: pointer;
  padding-left: 4px;
  padding-left: var(--dex-okd-select-tag-icon-padding-left, 4px)
}

.dex-select-tag-icon:hover {
  color: #000;
  color: var(--dex-okd-select-tag-icon-hover-color, #000)
}

.dex-select-tag-inner {
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap
}

.dex-select-tag.disabled {
  background-color: #f2f2f2;
  background-color: var(--dex-okd-select-tag-disabled-background, #f2f2f2);
  color: #929292;
  color: var(--dex-okd-select-tag-text-disabled-color, #929292);
  pointer-events: none
}

.dex-select-tag-sm {
  font-size: 12px;
  font-size: var(--dex-okd-select-sm-tag-text-font-size, 12px);
  height: 24px;
  height: var(--dex-okd-select-sm-tag-height, 24px);
  line-height: 24px;
  line-height: var(--dex-okd-select-sm-tag-height, 24px)
}

.dex-select-tag-sm .dex-select-tag-icon {
  font-size: 14px;
  font-size: var(--dex-okd-select-sm-tag-icon-font-size, 14px)
}

.dex-select-tag-md {
  font-size: 14px;
  font-size: var(--dex-okd-select-md-tag-text-font-size, 14px);
  height: 32px;
  height: var(--dex-okd-select-md-tag-height, 32px);
  line-height: 32px;
  line-height: var(--dex-okd-select-md-tag-height, 32px)
}

.dex-select-tag-md .dex-select-tag-icon {
  font-size: 16px;
  font-size: var(--dex-okd-select-md-tag-icon-font-size, 16px)
}

.dex-select-tag-xs {
  font-size: 12px;
  font-size: var(--dex-okd-select-xs-tag-text-font-size, 12px);
  height: 20px;
  height: var(--dex-okd-select-xs-tag-height, 20px);
  line-height: 20px;
  line-height: var(--dex-okd-select-xs-tag-height, 20px)
}

.dex-select-tag-xs .dex-select-tag-icon {
  font-size: 10px;
  font-size: var(--dex-okd-select-xs-tag-icon-font-size, 10px)
}

.dex-select-tag-lg {
  font-size: 14px;
  font-size: var(--dex-okd-select-lg-tag-text-font-size, 14px);
  height: 36px;
  height: var(--dex-okd-select-lg-tag-height, 36px);
  line-height: 36px;
  line-height: var(--dex-okd-select-lg-tag-height, 36px)
}

.dex-select-tag-lg .dex-select-tag-icon {
  font-size: 16px;
  font-size: var(--dex-okd-select-lg-tag-icon-font-size, 16px)
}

.dex-select-tag-xl {
  font-size: 14px;
  font-size: var(--dex-okd-select-xl-tag-text-font-size, 14px);
  height: 40px;
  height: var(--dex-okd-select-xl-tag-height, 40px);
  line-height: 40px;
  line-height: var(--dex-okd-select-xl-tag-height, 40px)
}

.dex-select-tag-xl .dex-select-tag-icon {
  font-size: 16px;
  font-size: var(--dex-okd-select-xl-tag-icon-font-size, 16px)
}

.dex-select-footer-dialog>.dex-select-footer {
  align-items: center;
  display: flex
}

.dex-select-footer-dialog>.dex-select-footer>.dex-select-footer-cancel {
  max-width: 30%
}

.dex-select-footer-dialog>.dex-select-footer>.dex-select-footer-confirm {
  margin-left: 12px
}

.dex-select-option-dialog-container {
  background: var(--dex-okd-select-drop-box-bg) !important;
  padding: var(--dex-okd-select-mobile-option-container-padding-vertical) 0
}

.dex-select-option.fixed-height {
  height: calc(100% - 32px);
  max-height: unset
}

.dex-select-option.fixed-height .dex-dialog-scroll-box {
  display: flex;
  flex-direction: column;
  overflow-y: hidden
}

.dex-select-option.fixed-height .dex-dialog-container {
  display: flex;
  flex-direction: column
}

.dex-select-option.fixed-height .dex-select-item-container {
  flex: 1 1
}

.dex-select-option.fixed-height .dex-select-item-container.dex-select-item-container-real {
  -webkit-overflow-scrolling: touch;
  overflow: auto
}

.dex-select-option.fixed-height.dex-select-option-fit-to-height {
  height: unset;
  max-height: calc(100% - 32px)
}

.dex-select-option.fixed-height.dex-select-option-fit-to-height .dex-dialog-container {
  max-height: 100%;
  overflow: auto
}

.dex-select-option-pc {
  cursor: auto;
  display: flex;
  flex-direction: column;
  max-height: 248px;
  padding-top: var(--dex-okd-select-drop-box-margin-top)
}

.dex-select-option-pc .dex-select-option-box {
  background: var(--dex-okd-select-drop-box-bg);
  border: 1px solid var(--dex-okd-select-drop-box-border-color);
  border-radius: var(--dex-okd-select-drop-box-border-radius);
  box-shadow: var(--dex-okd-select-drop-box-shadow);
  display: flex;
  flex-direction: column;
  height: 100%;
  overflow: auto;
  padding: 4px 0
}

.dex-select-option-pc .pc-option-scroll {
  -webkit-overflow-scrolling: touch;
  flex: 1 1;
  overflow: auto
}

.dex-select-option-pc .pc-option-footer {
  border-top: thin solid var(--dex-okd-select-common-border-color);
  padding: 12px 16px
}

.dex-select-option-pc.align-left {
  right: unset
}

.dex-select-option-pc.align-right {
  left: unset
}

.dex-select-option-pc.fixed-height {
  height: unset
}

.dex-select-option-pc.fixed-height .pc-option-scroll {
  display: flex;
  flex: 0 0 auto;
  flex-direction: column;
  height: 276px;
  overflow: hidden
}

.dex-select-option .pc-option-scroll.dex-select-option-pc-fit-to-height {
  height: auto;
  max-height: 292px
}

.dex-select-option-mask {
  z-index: 9800
}

.dex-select .select-popup-reference {
  cursor: pointer;
  position: absolute
}

.dex-select-option-dialog-container>.dex-select-footer-dialog {
  padding: 16px
}

.dex-select-value {
  box-sizing: border-box;
  cursor: pointer;
  font-size: var(--dex-okd-select-md-text-font-size)
}

.dex-select-value-box {
  outline: none
}

.dex-select-value .value {
  align-items: center;
  color: var(--dex-okd-select-common-text-color);
  display: flex;
  margin-right: 8px;
  width: 100%
}

.dex-select-value .placeholder {
  color: var(--dex-okd-input-default-placeholder-color)
}

.dex-select-value .disabled {
  cursor: not-allowed
}

.dex-select-value .disabled .value {
  color: var(--dex-okd-input-disabled-text-color)
}

.dex-select-value .disabled .icon-sign {
  color: var(--dex-okd-select-input-select-default-icon-color);
  color: var(--dex-okd-select-input-select-disabled-icon-color, var(--dex-okd-select-input-select-default-icon-color))
}

.dex-select-value .icon-sign {
  color: var(--dex-okd-select-input-select-default-icon-color);
  font-size: var(--dex-okd-select-input-select-default-icon-size);
  margin-left: auto;
  margin-right: 4px;
  transition: transform .2s linear
}

.dex-select-inner-box {
  cursor: pointer;
  position: relative
}

.dex-select-inner-box input[readonly] {
  cursor: pointer
}

.dex-select-inner-box>.reference-suffix {
  position: absolute;
  right: 4px;
  top: 50%;
  transform: translateY(-50%)
}

.dex-select-tag-container {
  display: flex;
  flex-wrap: wrap;
  margin-right: 4px;
  margin-top: 4px;
  max-width: 100%;
  padding-right: 24px
}

.dex-select-tag-container-responsive {
  display: flex;
  margin-right: 24px;
  margin-top: 4px;
  width: 100%
}

.dex-input-sm .dex-select-inner-box>.reference-suffix {
  right: var(--dex-okd-input-sm-padding-horizontal)
}

.dex-input-sm.dex-select-value {
  font-size: var(--dex-okd-select-sm-text-font-size)
}

.dex-input-md .dex-select-inner-box>.reference-suffix {
  right: var(--dex-okd-input-md-padding-horizontal)
}

.dex-input-md.dex-select-value {
  font-size: var(--dex-okd-select-md-text-font-size)
}

.dex-input-xs .dex-select-inner-box>.reference-suffix {
  right: var(--dex-okd-input-xs-padding-horizontal)
}

.dex-input-xs.dex-select-value {
  font-size: var(--dex-okd-select-xs-text-font-size)
}

.dex-input-lg .dex-select-inner-box>.reference-suffix {
  right: var(--dex-okd-input-lg-padding-horizontal)
}

.dex-input-lg.dex-select-value {
  font-size: var(--dex-okd-select-lg-text-font-size);
  font-size: var(--dex-okd-select-lg-text-font-size, var(--dex-okd-select-lg-text-font-size))
}

.dex-input-xl .dex-select-inner-box>.reference-suffix {
  right: var(--dex-okd-input-xl-padding-horizontal)
}

.dex-input-xl.dex-select-value {
  font-size: var(--dex-okd-select-md-text-font-size);
  font-size: var(--dex-okd-select-xl-text-font-size, var(--dex-okd-select-md-text-font-size))
}

.dex-select-value {
  width: 100%
}

.dex-select-text-value {
  align-items: center;
  box-sizing: border-box;
  cursor: pointer;
  display: flex;
  font-size: var(--dex-okd-select-md-text-font-size);
  justify-content: flex-start
}

.dex-select-text-value.align-right {
  justify-content: flex-end
}

.dex-select-text-value .value {
  align-items: center;
  color: var(--dex-okd-select-text-select-default-font-color);
  display: flex
}

.dex-select-text-value .icon-sign {
  align-items: center;
  color: var(--dex-okd-select-text-select-default-icon-color);
  display: flex;
  font-size: var(--dex-okd-select-text-select-default-icon-size);
  margin-left: 6px;
  margin-right: 0
}

.dex-select-text-value:hover .value {
  color: var(--dex-okd-select-text-select-hover-font-color)
}

.dex-select-text-value:hover .icon-sign {
  color: var(--dex-okd-select-text-select-hover-icon-color)
}

.dex-select-text-value.focus .value {
  color: var(--dex-okd-select-text-select-select-font-color)
}

.dex-select-text-value.focus .icon-sign {
  color: var(--dex-okd-select-text-select-select-icon-color)
}

.dex-select-text-value.disabled {
  cursor: not-allowed
}

.dex-select-text-value.disabled .value {
  color: var(--dex-okd-select-text-select-disabled-font-color)
}

.dex-select-text-value.disabled .icon-sign {
  color: var(--dex-okd-select-text-select-disabled-icon-color)
}

.input-sm.dex-select-text-value {
  font-size: var(--dex-okd-select-sm-text-font-size)
}

.input-md.dex-select-text-value {
  font-size: var(--dex-okd-select-md-text-font-size)
}

.input-xs.dex-select-text-value {
  font-size: var(--dex-okd-select-xs-text-font-size)
}

.input-lg.dex-select-text-value {
  font-size: var(--dex-okd-select-lg-text-font-size);
  font-size: var(--dex-okd-select-lg-text-font-size, var(--dex-okd-select-lg-text-font-size))
}

.input-xl.dex-select-text-value {
  font-size: var(--dex-okd-select-md-text-font-size);
  font-size: var(--dex-okd-select-xl-text-font-size, var(--dex-okd-select-md-text-font-size))
}

.dex-select-value-box:focus-visible .dex-select-a11y-ring {
  outline: 2px solid var(--dex-okd-color-border-focus);
  outline-color: var(--dex-okd-color-border-focus);
  outline-offset: 2px;
  outline-style: solid;
  outline-width: 2px
}

.dex-select-value-box:focus-visible .dex-select-a11y-ring-text {
  border-radius: 4px;
  outline: 2px solid var(--dex-okd-color-border-focus);
  outline-color: var(--dex-okd-color-border-focus);
  outline-offset: 2px;
  outline-style: solid;
  outline-width: 2px
}

.dex-select-value-box.display-area:focus-visible {
  border-radius: 4px;
  outline: 2px solid var(--dex-okd-color-border-focus);
  outline-color: var(--dex-okd-color-border-focus);
  outline-offset: 2px;
  outline-style: solid;
  outline-width: 2px
}

.dex-select .select-up {
  transition: transform .2s linear
}

.dex-select .select-up-active {
  transform: rotate(180deg)
}

.dex-select-reference-icon-clear {
  color: #929292;
  color: var(--dex-okd-select-reference-icon-default-color, #929292);
  display: inline-block;
  margin-right: 4px;
  transition: transform .2s linear
}

.dex-select-reference-icon-clear:hover {
  color: #000;
  color: var(--dex-okd-select-reference-icon-hover-color, #000)
}

.dex-select-reference-icon-clear.disabled {
  pointer-events: none
}

.dex-select-reference-icon {
  display: inline-block
}

.dex-select-reference-icon.dex-select-arrow-icon-sm {
  font-size: 14px;
  font-size: var(--dex-okd-select-sm-arrow-icon-font-size, 14px)
}

.dex-select-reference-icon.dex-select-reference-icon-sm {
  font-size: 14px;
  font-size: var(--dex-okd-select-sm-reference-icon-font-size, 14px)
}

.dex-select-reference-icon.dex-select-arrow-icon-md {
  font-size: 16px;
  font-size: var(--dex-okd-select-md-arrow-icon-font-size, 16px)
}

.dex-select-reference-icon.dex-select-reference-icon-md {
  font-size: 16px;
  font-size: var(--dex-okd-select-md-reference-icon-font-size, 16px)
}

.dex-select-reference-icon.dex-select-arrow-icon-xs {
  font-size: 14px;
  font-size: var(--dex-okd-select-xs-arrow-icon-font-size, 14px)
}

.dex-select-reference-icon.dex-select-reference-icon-xs {
  font-size: 14px;
  font-size: var(--dex-okd-select-xs-reference-icon-font-size, 14px)
}

.dex-select-reference-icon.dex-select-arrow-icon-lg {
  font-size: 16px;
  font-size: var(--dex-okd-select-lg-arrow-icon-font-size, 16px)
}

.dex-select-reference-icon.dex-select-reference-icon-lg {
  font-size: 16px;
  font-size: var(--dex-okd-select-lg-reference-icon-font-size, 16px)
}

.dex-select-reference-icon.dex-select-arrow-icon-xl {
  font-size: 16px;
  font-size: var(--dex-okd-select-xl-arrow-icon-font-size, 16px)
}

.dex-select-reference-icon.dex-select-reference-icon-xl {
  font-size: 16px;
  font-size: var(--dex-okd-select-xl-reference-icon-font-size, 16px)
}

.dex-select {
  box-sizing: border-box;
  position: relative
}

.dex-select.select-text {
  display: inline-block
}

.dex-a11y-card {
  position: relative
}

.dex-a11y-card .dex-a11y-card-focusable:focus-visible {
  border-radius: 4px;
  outline: 2px solid var(--dex-okd-color-border-focus);
  outline-color: var(--dex-okd-color-border-focus);
  outline-offset: 4px;
  outline-style: solid;
  outline-width: 2px
}

.dex-a11y-card-main-action {
  bottom: 0;
  cursor: pointer;
  height: 100%;
  left: 0;
  position: absolute;
  right: 0;
  top: 0;
  width: 100%
}

.dex-a11y-card-inner-action {
  position: relative;
  z-index: 1
}

.dex-datepicker-reference {
  position: relative
}

.dex-datepicker-reference-native {
  background: transparent;
  color: transparent;
  height: 100%;
  left: 0;
  outline: none;
  padding-right: 8px;
  position: absolute;
  top: 0;
  width: calc(100% - 42px);
  z-index: 100
}

.dex-datepicker-input-custom-icon {
  color: var(--dex-okd-color-gray-400);
  color: var(--dex-okd-datepicker-input-icon-color, var(--dex-okd-color-gray-400));
  cursor: pointer
}

.dex-datepicker-input-icon-disabled {
  cursor: not-allowed
}

.dex-datepicker .dex-datepicker-input-xs-icon-size {
  font-size: 16px;
  font-size: var(--dex-okd-datepicker-xs-icon-font-size, 16px)
}

.dex-datepicker .dex-datepicker-input-sm-icon-size {
  font-size: 16px;
  font-size: var(--dex-okd-datepicker-sm-icon-font-size, 16px)
}

.dex-datepicker .dex-datepicker-input-md-icon-size {
  font-size: 16px;
  font-size: var(--dex-okd-datepicker-md-icon-font-size, 16px)
}

.dex-datepicker .dex-datepicker-input-lg-icon-size {
  font-size: 18px;
  font-size: var(--dex-okd-datepicker-lg-icon-font-size, 18px)
}

.dex-datepicker .dex-datepicker-input-xl-icon-size {
  font-size: 20px;
  font-size: var(--dex-okd-datepicker-xl-icon-font-size, 20px)
}

.dex-datepicker-header {
  color: var(--dex-okd-datepicker-title-default-color);
  color: var(--dex-okd-datepicker-panel-header-default-text-color, var(--dex-okd-datepicker-title-default-color));
  display: flex;
  font-size: 16px;
  font-weight: 500;
  height: 36px;
  justify-content: space-between;
  line-height: 36px;
  padding: 0 16px
}

.dex-datepicker-header-block {
  align-items: center;
  display: flex;
  font-size: 14px
}

.dex-datepicker-header .text-box {
  border-radius: 4px;
  cursor: pointer;
  padding: 8px
}

.dex-datepicker-header .text-box:hover {
  background-color: var(--dex-okd-color-gray-100);
  background-color: var(--dex-okd-datepicker-panel-header-hover-text-bg-color, var(--dex-okd-color-gray-100))
}

.dex-datepicker-header .header-icon {
  margin-left: 4px;
  transition: transform .2s;
  vertical-align: middle
}

.dex-datepicker-header .arrow-up {
  transform: rotate(180deg)
}

.dex-datepicker-header .display-year {
  align-items: center;
  display: flex;
  margin-left: 8px
}

.dex-datepicker-header .nav-box .nav-icon {
  color: var(--dex-okd-datepicker-icon-default-color);
  color: var(--dex-okd-datepicker-panel-header-default-icon-color, var(--dex-okd-datepicker-icon-default-color));
  font-size: 20px
}

.dex-datepicker-header .nav-box .nav-item {
  align-items: center;
  border-radius: 50%;
  cursor: pointer;
  display: flex;
  height: 32px;
  justify-content: center;
  width: 32px
}

.dex-datepicker-header .nav-box .nav-item:hover {
  background-color: var(--dex-okd-color-gray-100);
  background-color: var(--dex-okd-datepicker-panel-header-hover-icon-bg-color, var(--dex-okd-color-gray-100))
}

.dex-datepicker-header .nav-box .nav-item:last-child {
  margin-left: 4px
}

.dex-datepicker-body {
  display: flex
}

.dex-datepicker-panel-day {
  color: var(--dex-okd-datepicker-day-default-text-color)
}

.dex-datepicker-panel-day:not(.dex-datepicker-panel-day-disabled):not(.dex-datepicker-panel-day-active):hover .item-inner {
  background-color: var(--dex-okd-datepicker-day-hover-background)
}

.dex-datepicker-panel-day-active:not(.dex-datepicker-panel-day-disable) .item-inner {
  background-color: var(--dex-okd-datepicker-day-selected-background);
  color: var(--dex-okd-datepicker-day-selected-text-color);
  font-weight: 500
}

.dex-datepicker-panel-day-disabled:not(.dex-datepicker-panel-day-notSelectable) {
  background-color: var(--dex-okd-datepicker-day-disable-background);
  color: var(--dex-okd-datepicker-day-disable-text-color);
  cursor: not-allowed
}

.dex-datepicker-panel-day-disabled:not(.dex-datepicker-panel-day-notSelectable) .dex-datepicker-panel-today {
  border-color: var(--dex-okd-datepicker-today-border-disable-color)
}

.dex-datepicker-panel-day-notSelectable {
  cursor: not-allowed
}

.dex-datepicker-panel-month {
  color: var(--dex-okd-datepicker-month-default-text-color)
}

.dex-datepicker-panel-month:not(.dex-datepicker-panel-month-disabled):not(.dex-datepicker-panel-month-active):hover .item-inner {
  background-color: var(--dex-okd-datepicker-month-hover-background)
}

.dex-datepicker-panel-month-active:not(.dex-datepicker-panel-month-disable) .item-inner {
  background-color: var(--dex-okd-datepicker-month-selected-background);
  color: var(--dex-okd-datepicker-month-selected-text-color);
  font-weight: 500
}

.dex-datepicker-panel-month-disabled:not(.dex-datepicker-panel-month-notSelectable) {
  background-color: var(--dex-okd-datepicker-month-disable-background);
  color: var(--dex-okd-datepicker-month-disable-text-color);
  cursor: not-allowed
}

.dex-datepicker-panel-month-disabled:not(.dex-datepicker-panel-month-notSelectable) .dex-datepicker-panel-today {
  border-color: var(--dex-okd-datepicker-today-border-disable-color)
}

.dex-datepicker-panel-month-notSelectable {
  cursor: not-allowed
}

.dex-datepicker-panel-year {
  color: var(--dex-okd-datepicker-year-default-text-color)
}

.dex-datepicker-panel-year:not(.dex-datepicker-panel-year-disabled):not(.dex-datepicker-panel-year-active):hover .item-inner {
  background-color: var(--dex-okd-datepicker-year-hover-background)
}

.dex-datepicker-panel-cover:before {
  background-color: var(--dex-okd-datepicker-day-range-background)
}

.dex-datepicker-panel-year-active:not(.dex-datepicker-panel-year-disable) .item-inner {
  background-color: var(--dex-okd-datepicker-year-selected-background);
  color: var(--dex-okd-datepicker-year-selected-text-color);
  font-weight: 500
}

.dex-datepicker-panel-year-disabled:not(.dex-datepicker-panel-year-notSelectable) {
  background-color: var(--dex-okd-datepicker-year-disable-background);
  color: var(--dex-okd-datepicker-year-disable-text-color);
  cursor: not-allowed
}

.dex-datepicker-panel-year-disabled:not(.dex-datepicker-panel-year-notSelectable) .dex-datepicker-panel-today {
  border-color: var(--dex-okd-datepicker-today-border-disable-color)
}

.dex-datepicker-panel-year-notSelectable {
  cursor: not-allowed
}

.dex-datepicker-panel {
  display: flex;
  flex-direction: column;
  font-size: 14px;
  height: 100%;
  padding: 0 16px 16px;
  width: 100%
}

.dex-datepicker-panel-header {
  border-bottom: 1px solid var(--dex-okd-color-line-muted);
  display: flex;
  height: 36px;
  margin-bottom: 8px
}

.dex-datepicker-panel-footer {
  border-top: 1px solid var(--dex-okd-color-line-muted);
  display: flex;
  justify-content: flex-end;
  padding: 12px 22px
}

.dex-datepicker-panel-footer .confirm-button {
  margin-left: 12px
}

.dex-datepicker-panel-week {
  align-items: center;
  color: var(--dex-okd-datepicker-week-default-text-color);
  display: flex;
  flex: 1 1;
  font-size: 12px;
  justify-content: center;
  text-align: center
}

.dex-datepicker-panel-main {
  cursor: pointer;
  display: flex;
  flex: 1 1;
  flex-direction: column
}

.dex-datepicker-panel-row {
  align-items: center;
  display: flex;
  justify-content: space-between;
  margin-bottom: 4px;
  width: 100%
}

.dex-datepicker-panel-row:last-child {
  margin-bottom: 0
}

.dex-datepicker-panel-row-week:hover .dex-datepicker-panel-day:not(.dex-datepicker-panel-day-disabled):before {
  background-color: var(--dex-okd-datepicker-day-range-background)
}

.dex-datepicker-panel-item {
  flex: 1 1;
  flex-direction: column
}

.dex-datepicker-panel-item,
.dex-datepicker-panel-item .item-inner {
  align-items: center;
  display: flex;
  justify-content: center;
  position: relative
}

.dex-datepicker-panel-item .item-inner {
  border-radius: 50%;
  height: 32px;
  width: 32px;
  z-index: 2
}

.dex-datepicker-panel-item:before {
  content: "";
  height: 100%;
  left: 0;
  position: absolute;
  right: 0;
  top: 50%;
  transform: translateY(-50%);
  z-index: 1
}

.dex-datepicker-panel-item.range-start:before {
  border-radius: 50% 0 0 50%
}

.dex-datepicker-panel-item.range-end:before {
  border-radius: 0 50% 50% 0
}

.dex-datepicker-panel-hidden {
  visibility: hidden
}

.dex-datepicker-panel-today .item-inner {
  background-color: var(--dex-okd-color-gray-050);
  background-color: var(--dex-okd-datepicker-today-bg-color, var(--dex-okd-color-gray-050));
  color: var(--dex-okd-datepicker-today-border-color);
  color: var(--dex-okd-datepicker-today-text-color, var(--dex-okd-datepicker-today-border-color));
  font-weight: 500
}

.dex-datepicker-panel-second {
  color: var(--dex-okd-datepicker-day-second-color);
  font-weight: 400
}

.dex-datepicker-panel-second .dex-datepicker-panel-today {
  border-color: var(--dex-okd-datepicker-today-border-disable-color)
}

.dex-datepicker-panel.no-padding {
  padding: 0
}

.dex-datepicker-panel .picker-scroll-view {
  direction: ltr;
  height: 260px;
  height: var(--dex-okd-datepicker-scroll-container-height, 260px);
  padding: 0;
  padding: var(--dex-okd-datepicker-scroll-container-padding-vertical, 0) var(--dex-okd-datepicker-scroll-container-padding-horizontal, 0)
}

.dex-datepicker-panel .picker-scroll-view .scroll-view-mask {
  background-color: initial;
  background-color: var(--dex-okd-datepicker-scroll-item-active-background, transparent);
  border-bottom: 1px solid #ebebeb;
  border-bottom: 1px solid var(--dex-okd-datepicker-scroll-item-active-border-color, #ebebeb);
  border-radius: 0;
  border-radius: var(--dex-okd-datepicker-scroll-item-active-radius, 0);
  border-top: 1px solid #ebebeb;
  border-top: 1px solid var(--dex-okd-datepicker-scroll-item-active-border-color, #ebebeb);
  height: 36px;
  height: var(--dex-okd-datepicker-scroll-item-default-height, 36px);
  margin: 0;
  margin: 0 var(--dex-okd-datepicker-scroll-container-padding-horizontal, 0)
}

.dex-datepicker-panel .picker-scroll-view .scroll-view-item {
  color: #929292;
  color: var(--dex-okd-datepicker-scroll-item-default-font-color, #929292);
  font-size: 14px;
  font-size: var(--dex-okd-datepicker-scroll-item-default-font-size, 14px);
  font-weight: 400;
  font-weight: var(--dex-okd-datepicker-scroll-item-default-font-weight, 400);
  height: 36px;
  height: var(--dex-okd-datepicker-scroll-item-default-height, 36px);
  line-height: 36px;
  line-height: var(--dex-okd-datepicker-scroll-item-default-height, 36px)
}

.dex-datepicker-panel .picker-scroll-view .scroll-view-item-active {
  color: #000;
  color: var(--dex-okd-datepicker-scroll-item-active-font-color, #000);
  font-size: 16px;
  font-size: var(--dex-okd-datepicker-scroll-item-active-font-size, 16px);
  font-weight: 500;
  font-weight: var(--dex-okd-datepicker-scroll-item-active-font-weight, 500)
}

@media (max-width:767px) {
  .dex-datepicker-panel-footer .confirm-button {
    flex: 1 1
  }

  .dex-datepicker-panel-footer .cancel-button {
    min-width: 100px
  }
}

.dex-datepicker-footer {
  align-items: center;
  border-top: 1px solid var(--dex-okd-datepicker-footer-border-color);
  display: flex;
  font-size: 14px;
  justify-content: space-between;
  padding: 20px
}

.dex-datepicker-footer-clear {
  color: var(--dex-okd-datepicker-footer-button-color);
  cursor: pointer;
  font-weight: 500;
  height: 100%
}

.dex-datepicker-footer-confirm {
  color: var(--dex-okd-datepicker-footer-button-color);
  justify-content: space-between;
  padding: 13px 16px
}

.dex-datepicker-footer-confirm .pc-confirm-button {
  margin-left: 12px
}

.dex-datepicker-footer-confirm-desc {
  font-size: 16px
}

.dex-datepicker-footer-confirm-desc .footer-confirm-desc-selected {
  padding-right: 4px
}

.dex-datepicker-footer-confirm-desc .footer-confirm-desc-to {
  padding: 0 4px
}

.dex-datepicker-footer-confirm-mobile {
  padding: 12px 16px
}

.dex-datepicker-footer-confirm-mobile .confirm-button {
  margin-left: 12px
}

@media (max-width:767px) {
  .dex-datepicker-footer-confirm-mobile .confirm-button {
    flex: 1 1
  }

  .dex-datepicker-footer-confirm-mobile .cancel-button {
    min-width: 100px
  }
}

.dex-datepicker-popup {
  display: flex
}

.dex-datepicker-dialog {
  background-color: var(--dex-okd-datepicker-default-background) !important
}

.dex-datepicker-inner {
  min-width: 284px;
  padding-top: 16px
}

.dex-datepicker-board {
  background: var(--dex-okd-datepicker-default-background);
  display: flex;
  flex-direction: column
}

.dex-datepicker-picker-group {
  display: flex;
  flex-direction: column;
  width: -webkit-min-content;
  width: -moz-min-content;
  width: min-content
}

.dex-datepicker-picker-group .picker-group-box {
  display: flex;
  position: relative
}

.dex-datepicker-picker-group .picker-group-split-line {
  background-color: var(--dex-okd-color-line-muted);
  height: 100%;
  left: 50%;
  position: absolute;
  top: 0;
  width: 1px
}

.dex-datepicker-picker-group .picker-group-shortcut {
  box-sizing: border-box;
  max-width: 568px;
  padding: 0 16px 26px
}

.dex-datepicker-range-mobile-reference {
  padding: 0 16px
}

.dex-datepicker-shortcut-mobile {
  padding: 0 16px;
  padding: var(--dex-okd-datepicker-shortcut-button-container-padding-horizontal, 0) var(--dex-okd-datepicker-shortcut-button-container-padding-vertical, 16px)
}

.dex-datepicker-range-reference {
  cursor: pointer
}

.dex-datepicker-range-reference .custom-clear-icon {
  color: var(--dex-okd-color-gray-400);
  color: var(--dex-okd-datepicker-input-icon-color, var(--dex-okd-color-gray-400));
  cursor: pointer
}

.dex-datepicker-range-reference-input {
  display: flex
}

.dex-datepicker-range-reference-container {
  align-items: center;
  display: flex;
  flex: 1 1;
  height: 100%;
  position: relative
}

.dex-datepicker-range-reference-container .disabled {
  color: var(--dex-okd-input-disabled-text-color);
  cursor: not-allowed
}

.dex-datepicker-range-reference-place {
  opacity: 0;
  position: absolute;
  z-index: -999999
}

.dex-datepicker-range-reference-item {
  align-items: center;
  display: flex;
  height: 100%;
  width: 100%
}

.dex-datepicker-range-reference-item-input {
  border: none;
  caret-color: var(--dex-okd-datepicker-input-caret-color);
  color: var(--dex-okd-datepicker-default-font-color);
  cursor: pointer;
  height: 100%;
  outline: none;
  width: 100%
}

.dex-datepicker-range-reference-item-input::-webkit-input-placeholder {
  color: var(--dex-okd-datepicker-input-placeholder-color)
}

.dex-datepicker-range-reference-item-input:-moz-placeholder {
  color: var(--dex-okd-datepicker-input-placeholder-color);
  opacity: 1
}

.dex-datepicker-range-reference-item-input::-ms-input-placeholder {
  color: var(--dex-okd-datepicker-input-placeholder-color)
}

.dex-datepicker-range-reference-connection.icon-pointer {
  color: var(--dex-okd-datepicker-day-second-color);
  font-size: 20px;
  margin-right: 8px
}

.dex-datepicker-range-reference-focus {
  border-bottom: 2px solid var(--dex-okd-datepicker-input-border-color);
  margin-bottom: -2px
}

.dex-datepicker-range-reference-input-group {
  justify-content: center;
  margin-top: 20px
}

.dex-datepicker-range-reference-input-group .dex-datepicker-range-reference-item-input {
  border-radius: 4px;
  font-size: 14px;
  font-weight: 500;
  height: 36px;
  text-align: center;
  width: 100% !important
}

.dex-datepicker-range-reference-input-group .dex-datepicker-range-reference-connection {
  margin: 0 10px
}

.dex-datepicker-range-reference-input-group .dex-datepicker-range-reference-item {
  border: 1px solid var(--dex-okd-color-gray-200);
  border-radius: 4px
}

.dex-datepicker-range-reference-input-group .dex-datepicker-range-reference-focus {
  border: 1px solid var(--dex-okd-datepicker-input-mobile-border-color, var(--dex-okd-color-fq-blue-lv1));
  margin: 0
}

.dex-datepicker-range-reference-xs {
  font-size: var(--dex-okd-datepicker-xs-range-input-font-size)
}

.dex-datepicker-range-reference-sm {
  font-size: var(--dex-okd-datepicker-sm-range-input-font-size)
}

.dex-datepicker-range-reference-md {
  font-size: var(--dex-okd-datepicker-md-range-input-font-size)
}

.dex-datepicker-range-reference-lg {
  font-size: 16px;
  font-size: var(--dex-okd-datepicker-lg-range-input-font-size, 16px)
}

.dex-datepicker-range-reference-xl {
  font-size: 16px;
  font-size: var(--dex-okd-datepicker-xl-range-input-font-size, 16px)
}

.dex-datepicker-range-board {
  background: #fff;
  background: var(--dex-okd-datepicker-range-board-background-color, #fff)
}

.dex-datepicker-shortcut {
  display: flex;
  flex-direction: row;
  flex-wrap: wrap;
  margin-bottom: -6px;
  margin-top: 12px;
  margin-top: var(--dex-okd-datepicker-shortcut-margin-top, 12px);
  width: 100%
}

.dex-datepicker-shortcut-button {
  align-items: center;
  background-color: var(--dex-okd-color-background-2);
  background-color: var(--dex-okd-datepicker-shortcut-button-bg-color, var(--dex-okd-color-background-2));
  border-radius: 4px;
  color: var(--dex-okd-datepicker-shortcut-text-default-color);
  cursor: pointer;
  display: flex;
  font-size: 12px;
  font-size: var(--dex-okd-datepicker-shortcut-button-font-size, 12px);
  font-weight: 500;
  justify-content: center;
  margin-bottom: 8px;
  margin-right: 8px;
  padding: 8px;
  padding: var(--dex-okd-datepicker-shortcut-button-padding-horizontal, 8px) var(--dex-okd-datepicker-shortcut-button-padding-vertical, 8px)
}

.dex-datepicker-shortcut-active {
  background-color: var(--dex-okd-datepicker-shortcut-active-background);
  color: var(--dex-okd-datepicker-shortcut-text-active-color)
}

.dex-datepicker-dateinput-title {
  color: var(--dex-okd-datepicker-dateinput-title-color);
  font-size: 14px;
  font-weight: 500;
  margin-bottom: 8px
}

.dex-datepicker-dateinput-body {
  align-items: center;
  direction: ltr;
  display: flex;
  justify-content: start
}

.dex-datepicker-dateinput-connector {
  color: var(--dex-okd-datepicker-dateinput-connector-color);
  padding: 0 4px
}

.dex-datepicker-dateinput-input-small {
  width: 48px
}

.dex-datepicker-dateinput-input-large {
  width: 72px
}

.dex-datepicker-dateinput-placeholder {
  color: var(--dex-okd-datepicker-dateinput-placeholder-color);
  font-size: 14px;
  margin-top: 8px
}

.dex-radio-inner {
  background-color: var(--dex-okd-radio-default-background);
  border: 1px solid var(--dex-okd-radio-default-border-color);
  border-radius: 50%;
  box-sizing: border-box;
  cursor: pointer;
  direction: ltr;
  display: block;
  left: 0;
  margin-top: 1px;
  position: relative;
  top: 0
}

.dex-radio-input {
  cursor: pointer;
  height: 100%;
  left: 0;
  margin: 0;
  opacity: 0;
  position: absolute;
  width: 100%;
  z-index: 1
}

.dex-radio-input:focus-visible {
  border-radius: 50%;
  opacity: 1;
  outline: 2px solid var(--dex-okd-color-border-focus);
  outline-color: var(--dex-okd-color-border-focus);
  outline-offset: 2px;
  outline-style: solid;
  outline-width: 2px
}

.dex-radio-children {
  cursor: pointer;
  display: inline-block;
  font-size: var(--dex-okd-radio-common-label-font-size);
  margin-left: 4px;
  vertical-align: top;
  white-space: normal;
  word-break: break-word
}

.dex-radio-wrapper {
  cursor: pointer;
  display: inline-block;
  font-size: 0;
  margin-right: 8px;
  -webkit-user-select: none;
  -moz-user-select: none;
  -ms-user-select: none;
  user-select: none;
  white-space: nowrap
}

.dex-radio-wrapper .dex-radio {
  cursor: pointer;
  display: inline-block;
  position: relative;
  vertical-align: middle
}

.dex-radio-wrapper .dex-radio-children {
  color: var(--dex-okd-radio-default-text-color)
}

.dex-radio-wrapper.hover-status .dex-radio-inner {
  border-color: var(--dex-okd-radio-default-hover-border-color);
  box-shadow: var(--dex-okd-radio-default-hover-shadow)
}

.dex-radio-wrapper-checked .dex-radio-children {
  color: var(--dex-okd-radio-selected-text-color)
}

.dex-radio-wrapper-checked .dex-radio-inner {
  background-color: var(--dex-okd-radio-selected-background);
  border-color: var(--dex-okd-radio-selected-border-color)
}

.dex-radio-wrapper-checked .dex-radio-inner:after {
  background-color: var(--dex-okd-radio-selected-inner-color);
  border: 2px solid var(--dex-okd-radio-selected-inner-color);
  border-left: 0;
  border-radius: 50%;
  border-top: 0;
  box-sizing: border-box;
  content: " ";
  height: 6px;
  left: 50%;
  position: absolute;
  top: 50%;
  transform: translate(-50%, -50%) rotate(45deg);
  transition: all .2s cubic-bezier(.12, .4, .29, 1.46) .1s;
  width: 6px
}

.dex-radio-wrapper-error .dex-radio-children {
  color: var(--dex-okd-radio-error-text-color)
}

.dex-radio-wrapper-error .dex-radio-inner {
  border-color: var(--dex-okd-radio-error-border-color)
}

.dex-radio-wrapper-error.hover-status .dex-radio-inner {
  border-color: var(--dex-okd-radio-error-hover-border-color);
  box-shadow: var(--dex-okd-radio-error-hover-shadow)
}

.dex-radio-wrapper-error.dex-radio-wrapper-checked .dex-radio-inner {
  background-color: var(--dex-okd-radio-error-background);
  border-color: var(--dex-okd-radio-error-border-color)
}

.dex-radio-wrapper-error.dex-radio-wrapper-checked .dex-radio-inner:after {
  background: var(--dex-okd-radio-error-inner-color);
  border-color: var(--dex-okd-radio-error-inner-color)
}

.dex-radio-wrapper-disabled {
  cursor: not-allowed
}

.dex-radio-wrapper-disabled .dex-radio-children {
  color: var(--dex-okd-radio-disabled-text-color);
  cursor: not-allowed
}

.dex-radio-wrapper-disabled .dex-radio,
.dex-radio-wrapper-disabled .dex-radio .dex-radio-input {
  cursor: default
}

.dex-radio-wrapper-disabled .dex-radio .dex-radio-inner {
  background-color: var(--dex-okd-radio-disabled-background);
  border-color: var(--dex-okd-radio-disabled-border-color);
  cursor: default
}

.dex-radio-wrapper-disabled.hover-status .dex-radio-inner {
  border-color: var(--dex-okd-radio-disabled-hover-border-color);
  box-shadow: unset
}

.dex-radio-wrapper-disabled.dex-radio-wrapper-checked .dex-radio-inner {
  border-color: var(--dex-okd-radio-disabled-checked-border-color)
}

.dex-radio-wrapper-disabled.dex-radio-wrapper-checked .dex-radio-inner:after {
  background-color: var(--dex-okd-radio-disabled-checked-inner-color);
  border-color: var(--dex-okd-radio-disabled-inner-color)
}

.dex-radio-sm .dex-radio-inner {
  height: var(--dex-okd-radio-sm-height);
  width: var(--dex-okd-radio-sm-width)
}

.dex-radio-sm .dex-radio-children {
  font-size: var(--dex-okd-radio-sm-font-size);
  margin-left: var(--dex-okd-radio-sm-margin)
}

.dex-radio-sm.dex-radio-wrapper {
  line-height: var(--dex-okd-radio-sm-line-height);
  padding-bottom: var(--dex-okd-radio-sm-padding);
  padding-top: var(--dex-okd-radio-sm-padding)
}

.dex-radio-md .dex-radio-inner {
  height: var(--dex-okd-radio-md-height);
  width: var(--dex-okd-radio-md-width)
}

.dex-radio-md .dex-radio-children {
  font-size: var(--dex-okd-radio-md-font-size);
  margin-left: var(--dex-okd-radio-md-margin)
}

.dex-radio-md.dex-radio-wrapper {
  line-height: var(--dex-okd-radio-md-line-height);
  padding-bottom: var(--dex-okd-radio-md-padding);
  padding-top: var(--dex-okd-radio-md-padding)
}

@media (min-width:768px) {

  .dex-radio-wrapper-disabled.dex-radio-wrapper-checked:hover .dex-radio-inner,
  .dex-radio-wrapper-disabled:hover .dex-radio-inner {
    border-color: var(--dex-okd-radio-disabled-hover-border-color);
    box-shadow: unset
  }

  .dex-radio-wrapper:not(.dex-radio-wrapper-disabled):hover .dex-radio-inner {
    border-color: var(--dex-okd-radio-default-hover-border-color);
    box-shadow: var(--dex-okd-radio-default-hover-shadow)
  }

  .dex-radio-wrapper-checked:not(.dex-radio-wrapper-disabled):hover .dex-radio-inner {
    border-color: var(--dex-okd-radio-selected-hover-border-color);
    box-shadow: var(--dex-okd-radio-selected-hover-shadow)
  }

  .dex-radio-wrapper-error:not(.dex-radio-wrapper-disabled):hover .dex-radio-inner {
    border-color: var(--dex-okd-radio-error-hover-border-color);
    box-shadow: var(--dex-okd-radio-error-hover-shadow)
  }
}

.dex-radio-reversed .dex-radio-inner {
  background-color: var(--dex-okd-radio-reversed-default-background);
  border: 1px solid var(--dex-okd-radio-reversed-default-border-color)
}

.dex-radio-reversed.dex-radio-wrapper .dex-radio-children {
  color: var(--dex-okd-radio-reversed-default-text-color)
}

.dex-radio-reversed.dex-radio-wrapper.hover-status .dex-radio-inner,
.dex-radio-reversed.dex-radio-wrapper:hover .dex-radio-inner {
  border-color: var(--dex-okd-radio-reversed-default-hover-border-color);
  box-shadow: var(--dex-okd-radio-reversed-default-hover-shadow)
}

.dex-radio-reversed.dex-radio-wrapper-checked .dex-radio-children {
  color: var(--dex-okd-radio-reversed-selected-text-color)
}

.dex-radio-reversed.dex-radio-wrapper-checked .dex-radio-inner {
  background-color: var(--dex-okd-radio-reversed-selected-background);
  border-color: var(--dex-okd-radio-reversed-selected-border-color)
}

.dex-radio-reversed.dex-radio-wrapper-checked .dex-radio-inner:after {
  background-color: var(--dex-okd-radio-reversed-selected-inner-color);
  border: 2px solid var(--dex-okd-radio-reversed-selected-inner-color)
}

.dex-radio-reversed.dex-radio-wrapper-checked:hover .dex-radio-inner {
  border-color: var(--dex-okd-radio-reversed-selected-hover-border-color);
  box-shadow: var(--dex-okd-radio-reversed-selected-hover-shadow)
}

.dex-radio-reversed.dex-radio-wrapper-error .dex-radio-children {
  color: var(--dex-okd-radio-reversed-error-text-color)
}

.dex-radio-reversed.dex-radio-wrapper-error .dex-radio-inner {
  border-color: var(--dex-okd-radio-reversed-error-border-color)
}

.dex-radio-reversed.dex-radio-wrapper-error.hover-status .dex-radio-inner,
.dex-radio-reversed.dex-radio-wrapper-error:hover .dex-radio-inner {
  border-color: var(--dex-okd-radio-reversed-error-hover-border-color);
  box-shadow: var(--dex-okd-radio-reversed-error-hover-shadow)
}

.dex-radio-reversed.dex-radio-wrapper-error.dex-radio-wrapper-checked .dex-radio-inner {
  background-color: var(--dex-okd-radio-reversed-error-background);
  border-color: var(--dex-okd-radio-reversed-error-border-color)
}

.dex-radio-reversed.dex-radio-wrapper-error.dex-radio-wrapper-checked .dex-radio-inner:after {
  background: var(--dex-okd-radio-reversed-error-inner-color);
  border-color: var(--dex-okd-radio-reversed-error-inner-color)
}

.dex-radio-reversed.dex-radio-wrapper-disabled .dex-radio-children {
  color: var(--dex-okd-radio-reversed-disabled-text-color)
}

.dex-radio-reversed.dex-radio-wrapper-disabled .dex-radio .dex-radio-inner {
  background-color: var(--dex-okd-radio-reversed-disabled-background);
  border-color: var(--dex-okd-radio-reversed-disabled-border-color)
}

.dex-radio-reversed.dex-radio-wrapper-disabled.hover-status .dex-radio-inner,
.dex-radio-reversed.dex-radio-wrapper-disabled:hover .dex-radio-inner {
  border-color: var(--dex-okd-radio-reversed-disabled-hover-border-color)
}

.dex-radio-reversed.dex-radio-wrapper-disabled.dex-radio-wrapper-checked .dex-radio-inner {
  border-color: var(--dex-okd-radio-reversed-disabled-checked-border-color)
}

.dex-radio-reversed.dex-radio-wrapper-disabled.dex-radio-wrapper-checked .dex-radio-inner:after {
  background-color: var(--dex-okd-radio-reversed-disabled-checked-inner-color);
  border-color: var(--dex-okd-radio-reversed-disabled-inner-color)
}

.dex-form-line>.dex-form-item-control>.dex-form-item-control-input>.dex-form-item-control-input-content {
  display: flex
}

.dex-form-line>.dex-form-item-control>.dex-form-item-control-input>.dex-form-item-control-input-content>.dex-form-item {
  margin-right: 16px
}

.dex-form-line>.dex-form-item-control>.dex-form-item-control-input>.dex-form-item-control-input-content>.dex-form-item:last-child {
  margin-right: 0
}

.dex-form-line.dex-form-line-column>.dex-form-item-control>.dex-form-item-control-input>.dex-form-item-control-input-content {
  flex-direction: column
}

.dex-form-line.dex-form-line-column>.dex-form-item-control>.dex-form-item-control-input>.dex-form-item-control-input-content>.dex-form-item {
  margin-right: 0
}

.dex-form-line.dex-form-line-hidden {
  display: none !important
}

.dex-selection-chips {
  align-items: center;
  background: var(--dex-okd-color-background-surface-primary);
  background: var(--dex-okd-selectionchips-default-background, var(--dex-okd-color-background-surface-primary));
  border: 1px solid transparent;
  box-sizing: border-box;
  color: var(--dex-okd-color-content-primary);
  color: var(--dex-okd-selectionchips-default-font-color, var(--dex-okd-color-content-primary));
  cursor: pointer;
  display: flex;
  justify-content: center;
  text-align: center
}

.dex-selection-chips.hover,
.dex-selection-chips:not(.dex-selection-chips-disabled):not(.dex-selection-chips-focus):hover {
  background: var(--dex-okd-color-background-surface-primary);
  background: var(--dex-okd-selectionchips-hover-background, var(--dex-okd-color-background-surface-primary));
  color: var(--dex-okd-color-content-primary);
  color: var(--dex-okd-selectionchips-hover-font-color, var(--dex-okd-color-content-primary))
}

.dex-selection-chips.active,
.dex-selection-chips:not(.dex-selection-chips-disabled):active {
  background: var(--dex-okd-color-background-surface-pressed);
  background: var(--dex-okd-selectionchips-active-background, var(--dex-okd-color-background-surface-pressed));
  border-color: var(--dex-okd-selectionchips-active-border-color, var(--dex-okd-selectionchips-focus-border-color));
  color: var(--dex-okd-color-content-primary);
  color: var(--dex-okd-selectionchips-active-font-color, var(--dex-okd-color-content-primary))
}

.dex-selection-chips.focus,
.dex-selection-chips:not(.dex-selection-chips-disabled).dex-selection-chips-focus {
  border-color: var(--dex-okd-selectionchips-focus-border-color, var(--dex-okd-color-border-selected))
}

.dex-selection-chips.dex-selection-chips-disabled,
.dex-selection-chips.disabled {
  background: var(--dex-okd-color-background-surface-disable);
  background: var(--dex-okd-selectionchips-disabled-background, var(--dex-okd-color-background-surface-disable));
  color: var(--dex-okd-color-content-disabled);
  color: var(--dex-okd-selectionchips-disabled-font-color, var(--dex-okd-color-content-disabled));
  cursor: not-allowed
}

.dex-selection-chips.dex-selection-chips-md {
  border-radius: 8px;
  border-radius: var(--dex-okd-selectionchips-md-border-radius, 8px);
  font-size: 14px;
  font-size: var(--dex-okd-selectionchips-md-font-size, 14px);
  font-weight: 400;
  font-weight: var(--dex-okd-selectionchips-md-font-weight, 400);
  line-height: 16px;
  line-height: var(--dex-okd-selectionchips-md-line-height, 16px);
  min-height: 36px;
  min-height: var(--dex-okd-selectionchips-md-min-height, 36px);
  min-width: 32px;
  min-width: var(--dex-okd-selectionchips-md-min-width, 32px);
  padding: 8px;
  padding: var(--dex-okd-selectionchips-md-padding-vertical, 8px) var(--dex-okd-selectionchips-md-padding-horizontal, 8px)
}

.dex-selection-chips.dex-selection-chips-lg {
  border-radius: 8px;
  border-radius: var(--dex-okd-selectionchips-lg-border-radius, 8px);
  font-size: 14px;
  font-size: var(--dex-okd-selectionchips-lg-font-size, 14px);
  font-weight: 400;
  font-weight: var(--dex-okd-selectionchips-lg-font-weight, 400);
  line-height: 16px;
  line-height: var(--dex-okd-selectionchips-lg-line-height, 16px);
  min-height: 40px;
  min-height: var(--dex-okd-selectionchips-lg-min-height, 40px);
  min-width: 32px;
  min-width: var(--dex-okd-selectionchips-lg-min-width, 32px);
  padding: 8px;
  padding: var(--dex-okd-selectionchips-lg-padding-vertical, 8px) var(--dex-okd-selectionchips-lg-padding-horizontal, 8px)
}

.dex-selection-chips-truncate {
  -webkit-box-orient: vertical;
  -webkit-line-clamp: 2;
  display: -webkit-box;
  overflow: hidden
}

.dex-selection-chips-group {
  display: flex;
  gap: 8px;
  gap: var(--dex-okd-selectionchips-group-margin-right, 8px)
}

.dex-selection-chips-group .dex-selection-chips .dex-selection-chips-truncate {
  -webkit-line-clamp: 3
}

.dex-a11y-selection {
  display: none
}

.dex-skeleton {
  display: flex;
  width: 100%
}

.dex-skeleton-header {
  display: flex;
  margin-right: 24px
}

.dex-skeleton-content {
  flex-grow: 1
}

.dex-skeleton-avatar {
  background-color: var(--dex-okd-color-background-2);
  background-color: var(--dex-okd-skeleton-background-color, var(--dex-okd-color-background-2))
}

.dex-skeleton-avatar.dex-skeleton-avatar-animate {
  animation: dex-skeleton-loading 1.4s ease infinite;
  background: linear-gradient(90deg, var(--dex-okd-color-background-2) 25%, hsla(0, 0%, 98%, .1) 37%, var(--dex-okd-color-background-2) 63%);
  background: linear-gradient(90deg, var(--dex-okd-skeleton-background-color, var(--dex-okd-color-background-2)) 25%, var(--dex-okd-skeleton-active-background-color, hsla(0, 0%, 98%, .1)) 37%, var(--dex-okd-skeleton-background-color, var(--dex-okd-color-background-2)) 63%);
  background-size: 400% 100%;
  content: ""
}

.dex-skeleton-avatar-sm {
  height: 24px;
  height: var(--dex-okd-skeleton-avatar-sm-width, 24px);
  width: 24px;
  width: var(--dex-okd-skeleton-avatar-sm-width, 24px)
}

.dex-skeleton-avatar-md {
  height: 64px;
  height: var(--dex-okd-skeleton-avatar-md-width, 64px);
  width: 64px;
  width: var(--dex-okd-skeleton-avatar-md-width, 64px)
}

.dex-skeleton-avatar-lg {
  height: 128px;
  height: var(--dex-okd-skeleton-avatar-lg-width, 128px);
  width: 128px;
  width: var(--dex-okd-skeleton-avatar-lg-width, 128px)
}

.dex-skeleton-avatar-circle {
  border-radius: 50%
}

.dex-skeleton-input {
  background-color: var(--dex-okd-color-background-2);
  background-color: var(--dex-okd-skeleton-background-color, var(--dex-okd-color-background-2));
  border-radius: 4px;
  border-radius: var(--dex-okd-skeleton-input-border-radius, 4px)
}

.dex-skeleton-input.dex-skeleton-input-animate {
  animation: dex-skeleton-loading 1.4s ease infinite;
  background: linear-gradient(90deg, var(--dex-okd-color-background-2) 25%, hsla(0, 0%, 98%, .1) 37%, var(--dex-okd-color-background-2) 63%);
  background: linear-gradient(90deg, var(--dex-okd-skeleton-background-color, var(--dex-okd-color-background-2)) 25%, var(--dex-okd-skeleton-active-background-color, hsla(0, 0%, 98%, .1)) 37%, var(--dex-okd-skeleton-background-color, var(--dex-okd-color-background-2)) 63%);
  background-size: 400% 100%;
  content: ""
}

.dex-skeleton-input-sm {
  height: 24px;
  height: var(--dex-okd-skeleton-input-sm-height, 24px)
}

.dex-skeleton-input-md {
  height: 40px;
  height: var(--dex-okd-skeleton-input-md-height, 40px)
}

.dex-skeleton-paragraph-row {
  background-color: var(--dex-okd-color-background-2);
  background-color: var(--dex-okd-skeleton-background-color, var(--dex-okd-color-background-2));
  border-radius: 4px;
  border-radius: var(--dex-okd-skeleton-input-border-radius, 4px)
}

.dex-skeleton-paragraph-row.dex-skeleton-paragraph-animate {
  animation: dex-skeleton-loading 1.4s ease infinite;
  background: linear-gradient(90deg, var(--dex-okd-color-background-2) 25%, hsla(0, 0%, 98%, .1) 37%, var(--dex-okd-color-background-2) 63%);
  background: linear-gradient(90deg, var(--dex-okd-skeleton-background-color, var(--dex-okd-color-background-2)) 25%, var(--dex-okd-skeleton-active-background-color, hsla(0, 0%, 98%, .1)) 37%, var(--dex-okd-skeleton-background-color, var(--dex-okd-color-background-2)) 63%);
  background-size: 400% 100%;
  content: ""
}

.dex-skeleton-paragraph-row+.dex-skeleton-paragraph-row {
  margin-top: 20px
}

.dex-skeleton-paragraph-sm {
  height: 24px;
  height: var(--dex-okd-skeleton-input-sm-height, 24px)
}

.dex-skeleton-paragraph-md {
  height: 40px;
  height: var(--dex-okd-skeleton-input-md-height, 40px)
}

@keyframes dex-skeleton-loading {
  0% {
    background-position: 100% 50%
  }

  to {
    background-position: 0 50%
  }
}

.dex-alert {
  border-radius: var(--dex-okd-alert-box-border-radius);
  box-sizing: border-box;
  display: inline-flex;
  padding: var(--dex-okd-alert-box-padding-vertical) var(--dex-okd-alert-box-padding-horizontal);
  position: relative;
  width: 100%
}

.dex-alert.closable {
  padding-right: 44px
}

.dex-alert * {
  box-sizing: border-box
}

.dex-alert .dex-alert-icon {
  align-items: center;
  display: flex;
  font-size: 20px;
  font-size: var(--dex-okd-alert-icon-tip-size, 20px);
  height: 20px;
  height: var(--dex-okd-alert-icon-tip-size, 20px);
  justify-content: center;
  width: 20px;
  width: var(--dex-okd-alert-icon-tip-size, 20px)
}

.dex-alert-msg-box {
  display: flex;
  flex-direction: column;
  flex-grow: 1
}

.dex-alert-icon+.dex-alert-msg-box {
  margin-left: 15px;
  margin-left: var(--dex-okd-alert-box-margin-left, 15px)
}

.dex-alert-title {
  font-size: var(--dex-okd-alert-title-font-size);
  font-weight: 500;
  line-height: var(--dex-okd-alert-title-line-height)
}

.dex-alert-desc {
  font-size: var(--dex-okd-alert-text-font-size);
  font-weight: 400;
  line-height: var(--dex-okd-alert-text-line-height)
}

.dex-alert-title+.dex-alert-desc {
  margin-top: 4px;
  margin-top: var(--dex-okd-alert-desc-margin-top, 4px)
}

.dex-alert-link {
  font-weight: 500;
  text-decoration: none
}

.dex-alert-desc-list {
  -webkit-padding-start: 17px;
  -moz-padding-start: 17px;
  -webkit-margin-before: 4px;
  -webkit-margin-after: 0;
  margin-block-end: 0;
  margin-block-start: 4px;
  padding-inline-start: 17px
}

.dex-alert-action-box {
  margin-bottom: 8px;
  margin-bottom: var(--dex-okd-alert-action-box-margin-bottom, 8px);
  margin-top: 21px;
  margin-top: var(--dex-okd-alert-action-box-margin-top, 21px)
}

.dex-alert-action {
  background: transparent;
  border: 0;
  cursor: pointer;
  font-family: inherit;
  font-size: var(--dex-okd-alert-action-font-size);
  font-weight: 500;
  line-height: var(--dex-okd-alert-action-line-height);
  outline: 0;
  padding: 0
}

.dex-alert-action:focus-visible {
  border-radius: 4px;
  outline: 2px solid var(--dex-okd-color-border-focus);
  outline-color: var(--dex-okd-color-border-focus);
  outline-offset: 2px;
  outline-style: solid;
  outline-width: 2px
}

.dex-alert-action+.dex-alert-action {
  margin-left: 32px;
  margin-left: var(--dex-okd-alert-action-margin-left, 32px)
}

.dex-alert .dex-alert-close {
  cursor: pointer;
  font-size: 20px;
  font-size: var(--dex-okd-alert-icon-close-size, 20px);
  line-height: 1;
  position: absolute;
  right: 12px
}

.dex-alert.normal-alert {
  background: var(--dex-okd-alert-normal-background)
}

.dex-alert.normal-alert .dex-alert-icon {
  color: var(--dex-okd-alert-normal-icon-color)
}

.dex-alert.normal-alert .dex-alert-title {
  color: var(--dex-okd-alert-normal-title-color)
}

.dex-alert.normal-alert .dex-alert-desc {
  color: var(--dex-okd-alert-normal-desc-color)
}

.dex-alert.normal-alert .dex-alert-close {
  color: var(--dex-okd-color-gray-300);
  color: var(--dex-okd-alert-normal-close-color, var(--dex-okd-color-gray-300))
}

.dex-alert.normal-alert .dex-alert-link {
  border-bottom: 1px solid var(--dex-okd-alert-normal-link-color);
  color: var(--dex-okd-alert-normal-link-color);
  text-decoration: none
}

.dex-alert.normal-alert .dex-alert-action {
  color: var(--dex-okd-alert-normal-action-color)
}

.dex-alert.success-alert {
  background: var(--dex-okd-alert-success-background)
}

.dex-alert.success-alert .dex-alert-icon {
  color: var(--dex-okd-alert-success-icon-color)
}

.dex-alert.success-alert .dex-alert-title {
  color: var(--dex-okd-alert-success-title-color)
}

.dex-alert.success-alert .dex-alert-desc {
  color: var(--dex-okd-alert-success-desc-color)
}

.dex-alert.success-alert .dex-alert-close {
  color: var(--dex-okd-color-gray-300);
  color: var(--dex-okd-alert-success-close-color, var(--dex-okd-color-gray-300))
}

.dex-alert.success-alert .dex-alert-link {
  border-bottom: 1px solid var(--dex-okd-alert-success-link-color);
  color: var(--dex-okd-alert-success-link-color);
  text-decoration: none
}

.dex-alert.success-alert .dex-alert-action {
  color: var(--dex-okd-alert-success-action-color)
}

.dex-alert.info-alert {
  background: var(--dex-okd-alert-info-background)
}

.dex-alert.info-alert .dex-alert-icon {
  color: var(--dex-okd-alert-info-icon-color)
}

.dex-alert.info-alert .dex-alert-title {
  color: var(--dex-okd-alert-info-title-color)
}

.dex-alert.info-alert .dex-alert-desc {
  color: var(--dex-okd-alert-info-desc-color)
}

.dex-alert.info-alert .dex-alert-close {
  color: var(--dex-okd-color-gray-300);
  color: var(--dex-okd-alert-info-close-color, var(--dex-okd-color-gray-300))
}

.dex-alert.info-alert .dex-alert-link {
  border-bottom: 1px solid var(--dex-okd-alert-info-link-color);
  color: var(--dex-okd-alert-info-link-color);
  text-decoration: none
}

.dex-alert.info-alert .dex-alert-action {
  color: var(--dex-okd-alert-info-action-color)
}

.dex-alert.warn-alert {
  background: var(--dex-okd-alert-warn-background)
}

.dex-alert.warn-alert .dex-alert-icon {
  color: var(--dex-okd-alert-warn-icon-color)
}

.dex-alert.warn-alert .dex-alert-title {
  color: var(--dex-okd-alert-warn-title-color)
}

.dex-alert.warn-alert .dex-alert-desc {
  color: var(--dex-okd-alert-warn-desc-color)
}

.dex-alert.warn-alert .dex-alert-close {
  color: var(--dex-okd-color-gray-300);
  color: var(--dex-okd-alert-warn-close-color, var(--dex-okd-color-gray-300))
}

.dex-alert.warn-alert .dex-alert-link {
  border-bottom: 1px solid var(--dex-okd-alert-warn-link-color);
  color: var(--dex-okd-alert-warn-link-color);
  text-decoration: none
}

.dex-alert.warn-alert .dex-alert-action {
  color: var(--dex-okd-alert-warn-action-color)
}

.dex-alert.error-alert {
  background: var(--dex-okd-alert-error-background)
}

.dex-alert.error-alert .dex-alert-icon {
  color: var(--dex-okd-alert-error-icon-color)
}

.dex-alert.error-alert .dex-alert-title {
  color: var(--dex-okd-alert-error-title-color)
}

.dex-alert.error-alert .dex-alert-desc {
  color: var(--dex-okd-alert-error-desc-color)
}

.dex-alert.error-alert .dex-alert-close {
  color: var(--dex-okd-color-gray-300);
  color: var(--dex-okd-alert-error-close-color, var(--dex-okd-color-gray-300))
}

.dex-alert.error-alert .dex-alert-link {
  border-bottom: 1px solid var(--dex-okd-alert-error-link-color);
  color: var(--dex-okd-alert-error-link-color);
  text-decoration: none
}

.dex-alert.error-alert .dex-alert-action {
  color: var(--dex-okd-alert-error-action-color)
}

.dex-hyperlink-xs .dex-hyperlink-text {
  font-size: var(--dex-okd-hyperlink-xs-font-size);
  line-height: var(--dex-okd-hyperlink-xs-line-height)
}

.dex-hyperlink-xs .icon-arrow,
.dex-hyperlink-xs .icon-jump {
  font-size: var(--dex-okd-hyperlink-xs-icon-font-size)
}

.dex-hyperlink-xs .icon-jump {
  margin-left: var(--dex-okd-hyperlink-xs-icon-margin-left)
}

.dex-hyperlink-sm .dex-hyperlink-text {
  font-size: var(--dex-okd-hyperlink-sm-font-size);
  line-height: var(--dex-okd-hyperlink-sm-line-height)
}

.dex-hyperlink-sm .icon-arrow,
.dex-hyperlink-sm .icon-jump {
  font-size: var(--dex-okd-hyperlink-sm-icon-font-size)
}

.dex-hyperlink-sm .icon-jump {
  margin-left: var(--dex-okd-hyperlink-sm-icon-margin-left)
}

.dex-hyperlink-md .dex-hyperlink-text {
  font-size: var(--dex-okd-hyperlink-md-font-size);
  line-height: var(--dex-okd-hyperlink-md-line-height)
}

.dex-hyperlink-md .icon-arrow,
.dex-hyperlink-md .icon-jump {
  font-size: var(--dex-okd-hyperlink-md-icon-font-size)
}

.dex-hyperlink-md .icon-jump {
  margin-left: var(--dex-okd-hyperlink-md-icon-margin-left)
}

.dex-hyperlink-lg .dex-hyperlink-text {
  font-size: var(--dex-okd-hyperlink-lg-font-size);
  line-height: var(--dex-okd-hyperlink-lg-line-height)
}

.dex-hyperlink-lg .icon-arrow,
.dex-hyperlink-lg .icon-jump {
  font-size: var(--dex-okd-hyperlink-lg-icon-font-size)
}

.dex-hyperlink-lg .icon-jump {
  margin-left: var(--dex-okd-hyperlink-lg-icon-margin-left)
}

.dex-hyperlink-muted {
  font-weight: var(--dex-okd-hyperlink-muted-font-weight)
}

.dex-hyperlink-muted:hover {
  font-weight: var(--dex-okd-hyperlink-muted-hover-font-weight)
}

.dex-hyperlink-medium {
  font-weight: var(--dex-okd-hyperlink-medium-font-weight)
}

.dex-hyperlink-medium:hover {
  font-weight: var(--dex-okd-hyperlink-medium-hover-font-weight)
}

.dex-hyperlink-amplified {
  font-weight: var(--dex-okd-hyperlink-amplified-font-weight)
}

.dex-hyperlink-amplified:hover {
  font-weight: var(--dex-okd-hyperlink-amplified-hover-font-weight)
}

.dex-hyperlink-primary {
  color: var(--dex-okd-hyperlink-primary-default-color)
}

.dex-hyperlink-primary .icon-arrow,
.dex-hyperlink-primary .icon-jump {
  color: var(--dex-okd-hyperlink-primary-default-icon-color)
}

.dex-hyperlink-primary.dex-hyperlink-disabled {
  color: var(--dex-okd-hyperlink-primary-disabled-color)
}

.dex-hyperlink-primary.dex-hyperlink-disabled .dex-hyperlink-text,
.dex-hyperlink-primary.dex-hyperlink-disabled .icon-arrow,
.dex-hyperlink-primary.dex-hyperlink-disabled .icon-jump {
  color: var(--dex-okd-hyperlink-primary-disabled-color);
  cursor: not-allowed
}

.dex-hyperlink-primary:not(.dex-hyperlink-disabled):hover {
  color: var(--dex-okd-hyperlink-primary-hover-color)
}

.dex-hyperlink-primary:not(.dex-hyperlink-disabled):hover .dex-hyperlink-text {
  color: var(--dex-okd-hyperlink-primary-hover-color);
  text-decoration: underline;
  text-underline-offset: 3px
}

.dex-hyperlink-primary:not(.dex-hyperlink-disabled):hover .icon-arrow,
.dex-hyperlink-primary:not(.dex-hyperlink-disabled):hover .icon-jump {
  color: var(--dex-okd-hyperlink-primary-hover-icon-color)
}

.dex-hyperlink-primary a,
.dex-hyperlink-primary a:active,
.dex-hyperlink-primary a:visited {
  color: var(--dex-okd-hyperlink-primary-default-color)
}

.dex-hyperlink-secondary {
  color: var(--dex-okd-hyperlink-secondary-default-color)
}

.dex-hyperlink-secondary .icon-arrow,
.dex-hyperlink-secondary .icon-jump {
  color: var(--dex-okd-hyperlink-secondary-default-icon-color)
}

.dex-hyperlink-secondary.dex-hyperlink-disabled {
  color: var(--dex-okd-hyperlink-secondary-disabled-color)
}

.dex-hyperlink-secondary.dex-hyperlink-disabled .dex-hyperlink-text,
.dex-hyperlink-secondary.dex-hyperlink-disabled .icon-arrow,
.dex-hyperlink-secondary.dex-hyperlink-disabled .icon-jump {
  color: var(--dex-okd-hyperlink-secondary-disabled-color);
  cursor: not-allowed
}

.dex-hyperlink-secondary:not(.dex-hyperlink-disabled):hover {
  color: var(--dex-okd-hyperlink-secondary-hover-color)
}

.dex-hyperlink-secondary:not(.dex-hyperlink-disabled):hover .dex-hyperlink-text {
  color: var(--dex-okd-hyperlink-secondary-hover-color);
  text-decoration: underline;
  text-underline-offset: 3px
}

.dex-hyperlink-secondary:not(.dex-hyperlink-disabled):hover .icon-arrow,
.dex-hyperlink-secondary:not(.dex-hyperlink-disabled):hover .icon-jump {
  color: var(--dex-okd-hyperlink-secondary-hover-icon-color)
}

.dex-hyperlink-secondary a,
.dex-hyperlink-secondary a:active,
.dex-hyperlink-secondary a:visited {
  color: var(--dex-okd-hyperlink-secondary-default-color)
}

.dex-hyperlink-reversed {
  color: var(--dex-okd-hyperlink-reversed-default-color)
}

.dex-hyperlink-reversed .icon-arrow,
.dex-hyperlink-reversed .icon-jump {
  color: var(--dex-okd-hyperlink-reversed-default-icon-color)
}

.dex-hyperlink-reversed.dex-hyperlink-disabled {
  color: var(--dex-okd-hyperlink-reversed-disabled-color)
}

.dex-hyperlink-reversed.dex-hyperlink-disabled .dex-hyperlink-text,
.dex-hyperlink-reversed.dex-hyperlink-disabled .icon-arrow,
.dex-hyperlink-reversed.dex-hyperlink-disabled .icon-jump {
  color: var(--dex-okd-hyperlink-reversed-disabled-color);
  cursor: not-allowed
}

.dex-hyperlink-reversed:not(.dex-hyperlink-disabled):hover {
  color: var(--dex-okd-hyperlink-reversed-hover-color)
}

.dex-hyperlink-reversed:not(.dex-hyperlink-disabled):hover .dex-hyperlink-text {
  color: var(--dex-okd-hyperlink-reversed-hover-color);
  text-decoration: underline;
  text-underline-offset: 3px
}

.dex-hyperlink-reversed:not(.dex-hyperlink-disabled):hover .icon-arrow,
.dex-hyperlink-reversed:not(.dex-hyperlink-disabled):hover .icon-jump {
  color: var(--dex-okd-hyperlink-reversed-hover-icon-color)
}

.dex-hyperlink-reversed a,
.dex-hyperlink-reversed a:active,
.dex-hyperlink-reversed a:visited {
  color: var(--dex-okd-hyperlink-reversed-default-color)
}

.dex-hyperlink-accent {
  color: var(--dex-okd-hyperlink-accent-default-color)
}

.dex-hyperlink-accent .icon-arrow,
.dex-hyperlink-accent .icon-jump {
  color: var(--dex-okd-hyperlink-accent-default-icon-color)
}

.dex-hyperlink-accent.dex-hyperlink-disabled {
  color: var(--dex-okd-hyperlink-accent-disabled-color)
}

.dex-hyperlink-accent.dex-hyperlink-disabled .dex-hyperlink-text,
.dex-hyperlink-accent.dex-hyperlink-disabled .icon-arrow,
.dex-hyperlink-accent.dex-hyperlink-disabled .icon-jump {
  color: var(--dex-okd-hyperlink-accent-disabled-color);
  cursor: not-allowed
}

.dex-hyperlink-accent:not(.dex-hyperlink-disabled):hover {
  color: var(--dex-okd-hyperlink-accent-hover-color)
}

.dex-hyperlink-accent:not(.dex-hyperlink-disabled):hover .dex-hyperlink-text {
  color: var(--dex-okd-hyperlink-accent-hover-color);
  text-decoration: underline;
  text-underline-offset: 3px
}

.dex-hyperlink-accent:not(.dex-hyperlink-disabled):hover .icon-arrow,
.dex-hyperlink-accent:not(.dex-hyperlink-disabled):hover .icon-jump {
  color: var(--dex-okd-hyperlink-accent-hover-icon-color)
}

.dex-hyperlink-accent a,
.dex-hyperlink-accent a:active,
.dex-hyperlink-accent a:visited {
  color: var(--dex-okd-hyperlink-accent-default-color)
}

.dex-hyperlink-text {
  text-decoration: none
}

.dex-hyperlink-underline .dex-hyperlink-text {
  text-decoration: underline;
  text-underline-offset: 3px
}

.dex-hyperlink-no-hover-underline:not(.dex-hyperlink-disabled):hover .dex-hyperlink-text {
  text-decoration: none
}

.dex-hyperlink {
  align-items: center;
  cursor: pointer;
  display: inline-flex
}

.dex-hyperlink .icon-arrow,
.dex-hyperlink .icon-jump {
  cursor: auto;
  font-weight: inherit
}

.dex-hyperlink a:focus-visible {
  border-radius: 2px;
  outline: 2px solid var(--dex-okd-color-border-focus);
  outline-color: var(--dex-okd-color-border-focus);
  outline-offset: 2px;
  outline-style: solid;
  outline-width: 2px
}

.dex-animation {
  position: relative
}

.dex-animation-poster {
  left: 0;
  position: absolute;
  top: 0
}

.dex-animation-view {
  height: 100%;
  width: 100%
}

.dex-qrcode {
  background-color: #fff;
  border-radius: 8px;
  box-sizing: initial;
  display: inline-flex;
  position: relative
}

.dex-qrcode-mask {
  align-items: center;
  background-color: hsla(0, 0%, 100%, .9);
  border-radius: 8px;
  display: flex;
  height: 100%;
  justify-content: center;
  left: 0;
  position: absolute;
  top: 0;
  width: 100%
}

.dex-skeleton-avatar-reversed {
  background-color: var(--dex-okd-color-gray-700);
  background-color: var(--dex-okd-skeleton-reversed-background-color, var(--dex-okd-color-gray-700))
}

.dex-skeleton-avatar-reversed.dex-skeleton-avatar-animate {
  background: linear-gradient(90deg, var(--dex-okd-color-gray-700) 25%, hsla(0, 0%, 98%, .1) 37%, var(--dex-okd-color-gray-700) 63%);
  background: linear-gradient(90deg, var(--dex-okd-skeleton-reversed-background-color, var(--dex-okd-color-gray-700)) 25%, var(--dex-okd-skeleton-reversed-active-background-color, hsla(0, 0%, 98%, .1)) 37%, var(--dex-okd-skeleton-reversed-background-color, var(--dex-okd-color-gray-700)) 63%);
  background-size: 400% 100%
}

.dex-skeleton-input-reversed {
  background-color: var(--dex-okd-color-gray-700);
  background-color: var(--dex-okd-skeleton-reversed-background-color, var(--dex-okd-color-gray-700))
}

.dex-skeleton-input-reversed.dex-skeleton-input-animate {
  background: linear-gradient(90deg, var(--dex-okd-color-gray-700) 25%, hsla(0, 0%, 98%, .1) 37%, var(--dex-okd-color-gray-700) 63%);
  background: linear-gradient(90deg, var(--dex-okd-skeleton-reversed-background-color, var(--dex-okd-color-gray-700)) 25%, var(--dex-okd-skeleton-reversed-active-background-color, hsla(0, 0%, 98%, .1)) 37%, var(--dex-okd-skeleton-reversed-background-color, var(--dex-okd-color-gray-700)) 63%);
  background-size: 400% 100%
}

.dex-skeleton-paragraph-reversed>.dex-skeleton-paragraph-row {
  background-color: var(--dex-okd-color-gray-700);
  background-color: var(--dex-okd-skeleton-reversed-background-color, var(--dex-okd-color-gray-700))
}

.dex-skeleton-paragraph-reversed>.dex-skeleton-paragraph-row.dex-skeleton-paragraph-animate {
  background: linear-gradient(90deg, var(--dex-okd-color-gray-700) 25%, hsla(0, 0%, 98%, .1) 37%, var(--dex-okd-color-gray-700) 63%);
  background: linear-gradient(90deg, var(--dex-okd-skeleton-reversed-background-color, var(--dex-okd-color-gray-700)) 25%, var(--dex-okd-skeleton-reversed-active-background-color, hsla(0, 0%, 98%, .1)) 37%, var(--dex-okd-skeleton-reversed-background-color, var(--dex-okd-color-gray-700)) 63%);
  background-size: 400% 100%
}

.dex-avatar {
  align-items: center;
  background-color: var(--dex-okd-avatar-default-background);
  border: 1px solid var(--dex-okd-avatar-border-color);
  border-radius: 100%;
  box-sizing: border-box;
  color: var(--dex-okd-avatar-content-color);
  display: flex;
  justify-content: center;
  position: relative
}

.dex-avatar-img {
  border-radius: 100%;
  height: 100%;
  width: 100%
}

.dex-avatar-img-loading {
  position: relative;
  visibility: hidden
}

.dex-avatar .dex-avatar-skeleton {
  border-radius: 100%;
  height: 100%;
  left: 0;
  position: absolute;
  top: 0;
  width: 100%;
  z-index: 0
}

.dex-avatar-alt {
  align-items: center;
  background-color: var(--dex-okd-avatar-default-background);
  border-radius: 100%;
  display: flex;
  height: 100%;
  justify-content: center;
  width: 100%
}

.dex-avatar-alt span {
  max-width: 80%;
  overflow: hidden;
  text-align: center;
  text-overflow: ellipsis;
  white-space: nowrap
}

.dex-avatar-xxs {
  font-size: var(--dex-okd-avatar-xs-font-size);
  font-size: var(--dex-okd-avatar-xxs-font-size, var(--dex-okd-avatar-xs-font-size));
  height: 20px;
  height: var(--dex-okd-avatar-xxs-size, 20px);
  line-height: var(--dex-okd-avatar-xs-line-height);
  line-height: var(--dex-okd-avatar-xxs-line-height, var(--dex-okd-avatar-xs-line-height));
  width: 20px;
  width: var(--dex-okd-avatar-xxs-size, 20px)
}

.dex-avatar-xs {
  font-size: var(--dex-okd-avatar-xs-font-size);
  height: 32px;
  height: var(--dex-okd-avatar-xs-size, 32px);
  line-height: var(--dex-okd-avatar-xs-line-height);
  width: 32px;
  width: var(--dex-okd-avatar-xs-size, 32px)
}

.dex-avatar-sm {
  font-size: var(--dex-okd-avatar-sm-font-size);
  height: 36px;
  height: var(--dex-okd-avatar-sm-size, 36px);
  line-height: var(--dex-okd-avatar-sm-line-height);
  width: 36px;
  width: var(--dex-okd-avatar-sm-size, 36px)
}

.dex-avatar-md {
  font-size: var(--dex-okd-avatar-md-font-size);
  height: 40px;
  height: var(--dex-okd-avatar-md-size, 40px);
  line-height: var(--dex-okd-avatar-md-line-height);
  width: 40px;
  width: var(--dex-okd-avatar-md-size, 40px)
}

.dex-avatar-lg {
  font-size: var(--dex-okd-avatar-lg-font-size);
  height: 52px;
  height: var(--dex-okd-avatar-lg-size, 52px);
  line-height: var(--dex-okd-avatar-lg-line-height);
  width: 52px;
  width: var(--dex-okd-avatar-lg-size, 52px)
}

.dex-avatar-xl {
  height: 80px;
  height: var(--dex-okd-avatar-xl-size, 80px);
  width: 80px;
  width: var(--dex-okd-avatar-xl-size, 80px)
}

.dex-avatar-xl,
.dex-avatar-xxl {
  font-size: var(--dex-okd-avatar-xl-font-size);
  line-height: var(--dex-okd-avatar-xl-line-height)
}

.dex-avatar-xxl {
  font-size: var(--dex-okd-avatar-xxl-font-size, var(--dex-okd-avatar-xl-font-size));
  height: 112px;
  height: var(--dex-okd-avatar-xxl-size, 112px);
  line-height: var(--dex-okd-avatar-xxl-line-height, var(--dex-okd-avatar-xl-line-height));
  width: 112px;
  width: var(--dex-okd-avatar-xxl-size, 112px)
}

.dex-avatar-ring {
  border: var(--dex-okd-avatar-ring-width, 2px) solid var(--dex-okd-avatar-ring-color, var(--dex-okd-avatar-border-color));
  border-radius: 100%;
  box-sizing: border-box;
  height: -webkit-fit-content;
  height: -moz-fit-content;
  height: fit-content;
  padding: 4px;
  padding: var(--dex-okd-avatar-ring-padding, 4px);
  width: -webkit-fit-content;
  width: -moz-fit-content;
  width: fit-content
}

.dex-accordion {
  border-bottom: 1px solid #ebebeb;
  border-bottom: 1px solid var(--dex-okd-accordion-main-border-color, #ebebeb);
  display: flex;
  flex-direction: column
}

.dex-accordion-header {
  align-items: center;
  cursor: pointer;
  display: flex;
  justify-content: space-between;
  padding: 32px 0;
  padding: var(--dex-okd-accordion-header-padding-vertical, 32px) var(--dex-okd-accordion-header-padding-horizontal, 0)
}

.dex-accordion-header-title {
  color: #000;
  color: var(--dex-okd-accordion-header-title-color, #000);
  font-size: 18px;
  font-size: var(--dex-okd-accordion-header-title-font-size, 18px);
  font-weight: 500;
  font-weight: var(--dex-okd-accordion-header-title-font-weight, 500);
  line-height: 24px;
  line-height: var(--dex-okd-accordion-header-title-line-height, 24px)
}

.dex-accordion-header .dex-accordion-header-icon {
  color: #929292;
  color: var(--dex-okd-accordion-header-icon-color, #929292);
  font-size: 20px;
  font-size: var(--dex-okd-accordion-header-icon-size, 20px);
  transition: all .2s cubic-bezier(.34, .69, .1, 1)
}

.dex-accordion-header-icon-expanded {
  transform: rotate(180deg)
}

.dex-accordion-content {
  color: #929292;
  color: var(--dex-okd-accordion-content-color, #929292);
  display: none;
  font-size: 14px;
  font-size: var(--dex-okd-accordion-content-font-size, 14px);
  font-weight: 400;
  font-weight: var(--dex-okd-accordion-content-font-weight, 400);
  line-height: 1.58;
  line-height: var(--dex-okd-accordion-content-line-height, 1.58);
  overflow: hidden
}

.dex-accordion-content-transition-out {
  margin-bottom: 0;
  max-height: 0;
  opacity: 0;
  transform: translateY(-30px);
  transition: all .2s;
  will-change: transform, opacity, max-height
}

.dex-accordion-content-transition-in {
  max-height: -webkit-max-content;
  max-height: -moz-max-content;
  max-height: max-content;
  opacity: 1;
  transform: translateY(0)
}

.dex-accordion-content-expanded {
  display: block;
  margin-bottom: 32px;
  margin-bottom: var(--dex-okd-accordion-header-padding-vertical, 32px)
}

@media (max-width:767px) {
  .dex-accordion-header-title {
    font-size: 14px;
    font-size: var(--dex-okd-accordion-header-title-sm-font-size, 14px);
    font-weight: 500;
    font-weight: var(--dex-okd-accordion-header-title-sm-font-weight, 500);
    line-height: 16px;
    line-height: var(--dex-okd-accordion-header-title-sm-line-height, 16px)
  }

  .dex-accordion-header .dex-accordion-header-icon {
    font-size: 16px;
    font-size: var(--dex-okd-accordion-header-icon-sm-size, 16px)
  }

  .dex-accordion-content {
    font-size: 12px;
    font-size: var(--dex-okd-accordion-content-sm-font-size, 12px);
    font-weight: 400;
    font-weight: var(--dex-okd-accordion-content-sm-font-weight, 400);
    line-height: 1.58;
    line-height: var(--dex-okd-accordion-content-sm-line-height, 1.58)
  }
}

.dex-icon-button {
  align-items: center;
  border-color: transparent;
  border-style: solid;
  display: flex;
  justify-content: center;
  text-align: center
}

.dex-icon-button.dex-icon-button-sm {
  border-radius: 50%;
  border-width: .75px;
  border-width: var(--dex-okd-iconbutton-sm-border-width, .75px);
  height: 12px;
  height: var(--dex-okd-iconbutton-sm-height, 12px);
  width: 12px;
  width: var(--dex-okd-iconbutton-sm-width, 12px)
}

.dex-icon-button.dex-icon-button-sm .dex-icon-button-icon {
  font-size: 8px;
  font-size: var(--dex-okd-iconbutton-sm-font-size, 8px)
}

.dex-icon-button.dex-icon-button-sm .dex-icon-button-loader-circle {
  border-width: 2px;
  border-width: var(--dex-okd-iconbutton-sm-loader-border-width, 2px);
  height: 8px;
  height: var(--dex-okd-iconbutton-sm-font-size, 8px);
  width: 8px;
  width: var(--dex-okd-iconbutton-sm-font-size, 8px)
}

.dex-icon-button.dex-icon-button-md {
  border-radius: 50%;
  border-width: 1px;
  border-width: var(--dex-okd-iconbutton-md-border-width, 1px);
  height: 16px;
  height: var(--dex-okd-iconbutton-md-height, 16px);
  width: 16px;
  width: var(--dex-okd-iconbutton-md-width, 16px)
}

.dex-icon-button.dex-icon-button-md .dex-icon-button-icon {
  font-size: 10px;
  font-size: var(--dex-okd-iconbutton-md-font-size, 10px)
}

.dex-icon-button.dex-icon-button-md .dex-icon-button-loader-circle {
  border-width: 2px;
  border-width: var(--dex-okd-iconbutton-md-loader-border-width, 2px);
  height: 10px;
  height: var(--dex-okd-iconbutton-md-font-size, 10px);
  width: 10px;
  width: var(--dex-okd-iconbutton-md-font-size, 10px)
}

.dex-icon-button.dex-icon-button-lg {
  border-radius: 50%;
  border-width: 1px;
  border-width: var(--dex-okd-iconbutton-lg-border-width, 1px);
  height: 24px;
  height: var(--dex-okd-iconbutton-lg-height, 24px);
  width: 24px;
  width: var(--dex-okd-iconbutton-lg-width, 24px)
}

.dex-icon-button.dex-icon-button-lg .dex-icon-button-icon {
  font-size: 16px;
  font-size: var(--dex-okd-iconbutton-lg-font-size, 16px)
}

.dex-icon-button.dex-icon-button-lg .dex-icon-button-loader-circle {
  border-width: 2px;
  border-width: var(--dex-okd-iconbutton-lg-loader-border-width, 2px);
  height: 16px;
  height: var(--dex-okd-iconbutton-lg-font-size, 16px);
  width: 16px;
  width: var(--dex-okd-iconbutton-lg-font-size, 16px)
}

.dex-icon-button-basic {
  background: transparent;
  background: var(--dex-okd-iconbutton-basic-default-background, transparent);
  color: var(--dex-okd-color-content-primary);
  color: var(--dex-okd-iconbutton-basic-default-font-color, var(--dex-okd-color-content-primary))
}

.dex-icon-button-basic.hover,
.dex-icon-button-basic:not(.dex-icon-button-basic-disabled):not(.dex-icon-button-basic-loading):hover {
  background: var(--dex-okd-color-background-surface-secondary);
  background: var(--dex-okd-iconbutton-basic-hover-background, var(--dex-okd-color-background-surface-secondary));
  color: var(--dex-okd-color-content-primary);
  color: var(--dex-okd-iconbutton-basic-hover-font-color, var(--dex-okd-color-content-primary))
}

.dex-icon-button-basic.active,
.dex-icon-button-basic:not(.dex-icon-button-basic-disabled):not(.dex-icon-button-basic-loading):active {
  background: var(--dex-okd-color-background-surface-pressed);
  background: var(--dex-okd-iconbutton-basic-active-background, var(--dex-okd-color-background-surface-pressed));
  color: var(--dex-okd-color-content-primary);
  color: var(--dex-okd-iconbutton-basic-active-font-color, var(--dex-okd-color-content-primary))
}

.dex-icon-button-basic.dex-icon-button-basic-disabled,
.dex-icon-button-basic.disabled {
  background: transparent;
  background: var(--dex-okd-iconbutton-basic-disabled-background, transparent);
  color: var(--dex-okd-color-content-disabled);
  color: var(--dex-okd-iconbutton-basic-disabled-font-color, var(--dex-okd-color-content-disabled));
  cursor: not-allowed
}

.dex-icon-button-basic.dex-icon-button-basic-loading,
.dex-icon-button-basic.loading {
  background: var(--dex-okd-color-background-surface-secondary);
  background: var(--dex-okd-iconbutton-basic-loading-background, var(--dex-okd-color-background-surface-secondary));
  cursor: pointer
}

.dex-icon-button-basic-loader {
  border-color: var(--dex-okd-iconbutton-basic-loader-track-color);
  border-top-color: var(--dex-okd-iconbutton-basic-loader-mark-color)
}

.dex-icon-button-circle {
  background: var(--dex-okd-color-content-primary);
  background: var(--dex-okd-iconbutton-circle-default-background, var(--dex-okd-color-content-primary));
  color: var(--dex-okd-color-content-inverse);
  color: var(--dex-okd-iconbutton-circle-default-font-color, var(--dex-okd-color-content-inverse))
}

.dex-icon-button-circle.hover,
.dex-icon-button-circle:not(.dex-icon-button-circle-disabled):not(.dex-icon-button-circle-loading):hover {
  background: var(--dex-okd-color-content-contrast);
  background: var(--dex-okd-iconbutton-circle-hover-background, var(--dex-okd-color-content-contrast));
  color: var(--dex-okd-color-content-inverse);
  color: var(--dex-okd-iconbutton-circle-hover-font-color, var(--dex-okd-color-content-inverse))
}

.dex-icon-button-circle.active,
.dex-icon-button-circle:not(.dex-icon-button-circle-disabled):not(.dex-icon-button-circle-loading):active {
  background: var(--dex-okd-color-container-contrast);
  background: var(--dex-okd-iconbutton-circle-active-background, var(--dex-okd-color-container-contrast));
  color: var(--dex-okd-color-content-inverse);
  color: var(--dex-okd-iconbutton-circle-active-font-color, var(--dex-okd-color-content-inverse))
}

.dex-icon-button-circle.dex-icon-button-circle-disabled,
.dex-icon-button-circle.disabled {
  background: var(--dex-okd-color-background-surface-disable);
  background: var(--dex-okd-iconbutton-circle-disabled-background, var(--dex-okd-color-background-surface-disable));
  color: var(--dex-okd-color-content-disabled);
  color: var(--dex-okd-iconbutton-circle-disabled-font-color, var(--dex-okd-color-content-disabled));
  cursor: not-allowed
}

.dex-icon-button-circle.dex-icon-button-circle-loading,
.dex-icon-button-circle.loading {
  background: var(--dex-okd-color-content-contrast);
  background: var(--dex-okd-iconbutton-circle-loading-background, var(--dex-okd-color-content-contrast));
  cursor: pointer
}

.dex-icon-button-circle-loader {
  border-color: var(--dex-okd-iconbutton-circle-loader-track-color);
  border-top-color: var(--dex-okd-iconbutton-circle-loader-mark-color)
}

.dex-icon-button-circleOutline {
  background: transparent;
  background: var(--dex-okd-iconbutton-circleOutline-default-background, transparent);
  border-color: var(--dex-okd-iconbutton-circleOutline-default-border-color, var(--dex-okd-color-border-secondary));
  color: var(--dex-okd-color-content-primary);
  color: var(--dex-okd-iconbutton-circleOutline-default-font-color, var(--dex-okd-color-content-primary))
}

.dex-icon-button-circleOutline.hover,
.dex-icon-button-circleOutline:not(.dex-icon-button-circleOutline-disabled):not(.dex-icon-button-circleOutline-loading):hover {
  background: var(--dex-okd-color-background-surface-secondary);
  background: var(--dex-okd-iconbutton-circleOutline-hover-background, var(--dex-okd-color-background-surface-secondary));
  border-color: var(--dex-okd-iconbutton-circleOutline-hover-border-color, var(--dex-okd-color-border-secondary));
  color: var(--dex-okd-color-content-primary);
  color: var(--dex-okd-iconbutton-circleOutline-hover-font-color, var(--dex-okd-color-content-primary))
}

.dex-icon-button-circleOutline.active,
.dex-icon-button-circleOutline:not(.dex-icon-button-circleOutline-disabled):not(.dex-icon-button-circleOutline-loading):active {
  background: var(--dex-okd-color-background-surface-pressed);
  background: var(--dex-okd-iconbutton-circleOutline-active-background, var(--dex-okd-color-background-surface-pressed));
  border-color: var(--dex-okd-iconbutton-circleOutline-active-border-color, var(--dex-okd-color-border-secondary));
  color: var(--dex-okd-color-content-primary);
  color: var(--dex-okd-iconbutton-circleOutline-active-font-color, var(--dex-okd-color-content-primary))
}

.dex-icon-button-circleOutline.dex-icon-button-circleOutline-disabled,
.dex-icon-button-circleOutline.disabled {
  background: var(--dex-okd-color-background-surface-disable);
  background: var(--dex-okd-iconbutton-circleOutline-disabled-background, var(--dex-okd-color-background-surface-disable));
  border-color: var(--dex-okd-iconbutton-circleOutline-disabled-border-color, var(--dex-okd-color-border-tertiary));
  color: var(--dex-okd-color-content-disabled);
  color: var(--dex-okd-iconbutton-circleOutline-disabled-font-color, var(--dex-okd-color-content-disabled));
  cursor: not-allowed
}

.dex-icon-button-circleOutline.dex-icon-button-circleOutline-loading,
.dex-icon-button-circleOutline.loading {
  background: var(--dex-okd-color-background-surface-secondary);
  background: var(--dex-okd-iconbutton-circleOutline-loading-background, var(--dex-okd-color-background-surface-secondary));
  border-color: var(--dex-okd-iconbutton-circleOutline-loading-border-color, var(--dex-okd-color-border-secondary));
  cursor: pointer
}

.dex-icon-button-circleOutline-loader {
  border-color: var(--dex-okd-iconbutton-circleOutline-loader-track-color);
  border-top-color: var(--dex-okd-iconbutton-circleOutline-loader-mark-color)
}

.dex-coach-popover .dex-popup-layer-content {
  padding: 0
}

.dex-coach-popover .dex-popup-layer-arrow-inner {
  background-color: #fff;
  background-color: var(--dex-okd-coachmark-popover-arrow-background-color, #fff);
  border-color: #ebebeb;
  border-color: var(--dex-okd-coachmark-popover-arrow-border-color, #ebebeb)
}

.dex-coach-con {
  background-color: #fff;
  background-color: var(--dex-okd-coachmark-popover-background-color, #fff);
  border: thin solid #ebebeb;
  border: thin solid var(--dex-okd-coachmark-popover-border-color, #ebebeb);
  border-radius: 8px;
  border-radius: var(--dex-okd-coachmark-popover-border-radius, 8px);
  box-shadow: 8px 8px 16px #00000014;
  box-shadow: var(--dex-okd-coachmark-popover-border-shadow, 8px 8px 16px #00000014);
  box-sizing: border-box;
  overflow: hidden;
  padding: 16px;
  padding: var(--dex-okd-coachmark-popover-padding, 16px);
  width: 250px;
  width: var(--dex-okd-coachmark-popover-width, 250px)
}

.dex-coach-con .dex-coach-title {
  align-items: center;
  color: #000;
  color: var(--dex-okd-coachmark-popover-title-color, #000);
  display: flex;
  font-size: 16px;
  font-size: var(--dex-okd-coachmark-popover-title-font-size, 16px);
  font-weight: 700;
  font-weight: var(--dex-okd-coachmark-popover-title-font-weight, 700);
  justify-content: space-between;
  line-height: 20px;
  line-height: var(--dex-okd-coachmark-popover-title-line-height, 20px)
}

.dex-coach-con .dex-coach-title .dex-coach-title-close {
  align-self: flex-start;
  color: #929292;
  color: var(--dex-okd-coachmark-popover-close-color, #929292);
  cursor: pointer;
  display: inline-block;
  font-size: 20px;
  font-size: var(--dex-okd-coachmark-popover-close-font-size, 20px);
  margin-left: 12px;
  margin-left: var(--dex-okd-coachmark-popover-close-margin-left, 12px);
  position: relative;
  vertical-align: middle;
  z-index: 1
}

.dex-coach-con .dex-coach-title+.dex-coach-desc {
  margin-top: 8px;
  margin-top: var(--dex-okd-coachmark-popover-desc-margin-top, 8px)
}

.dex-coach-con .dex-coach-desc {
  color: #000;
  color: var(--dex-okd-coachmark-popover-desc-color, #000);
  font-size: 14px;
  font-size: var(--dex-okd-coachmark-popover-desc-font-size, 14px);
  line-height: 20px;
  line-height: var(--dex-okd-coachmark-popover-desc-line-height, 20px)
}

.dex-coach-con .dex-coach-desc+.dex-coach-footer {
  margin-top: 16px;
  margin-top: var(--dex-okd-coachmark-popover-footer-margin-top, 16px)
}

.dex-coach-con .dex-coach-tour-footer {
  align-items: center;
  color: #929292;
  color: var(--dex-okd-coachmark-tour-footer-color, #929292);
  display: flex;
  font-size: 14px;
  font-size: var(--dex-okd-coachmark-tour-footer-font-size, 14px);
  justify-content: space-between;
  line-height: 16px
}

.dex-coach-con .dex-coach-tour-footer .dex-coach-tour-footer-right {
  align-items: center;
  display: flex
}

.dex-coach-con .dex-coach-tour-footer .dex-coach-tour-footer-confirm {
  margin-left: 8px;
  margin-left: var(--dex-okd-okd-coachmark-tour-footer-margin-left, 8px)
}

.dex-coach-con .dex-coach-tour-footer .dex-coach-tour-footer-button.dex-coach-tour-footer-cancel,
.dex-coach-con .dex-coach-tour-footer .dex-coach-tour-footer-button.dex-coach-tour-footer-confirm {
  min-width: unset
}

.dex-coach-con .dex-coach-standalone-footer {
  display: flex;
  justify-content: flex-end
}

.dex-coach-con .dex-coach-standalone-footer .dex-coach-standalone-footer-button+.dex-coach-standalone-footer-button {
  margin-left: 8px;
  margin-left: var(--dex-okd-okd-coachmark-standalone-footer-margin-left, 8px)
}

@media (min-width:768px) {
  .dex-coach-con {
    max-width: 375px;
    max-width: var(--dex-okd-coachmark-popover-max-width, 375px)
  }
}

.dex-coach-mask {
  color: rgba(0, 0, 0, .65);
  color: var(--dex-okd-coachmark-mask-color, rgba(0, 0, 0, .65));
  inset: 0;
  pointer-events: none;
  position: fixed
}

.dex-carousel {
  overflow: hidden;
  position: relative;
  transform: translateZ(0);
  -webkit-user-select: none;
  -moz-user-select: none;
  -ms-user-select: none;
  user-select: none
}

.dex-carousel-track {
  cursor: -webkit-grab;
  cursor: grab;
  display: flex;
  position: relative
}

.dex-carousel-track-grid {
  display: grid;
  grid-auto-flow: column
}

.dex-carousel-slide {
  --dex-okd-carousel-slide-spacing: 0;
  flex-shrink: 0;
  height: 100%;
  margin-right: var(--dex-okd-carousel-slide-spacing);
  position: relative
}

.dex-carousel-slide:last-child {
  margin-right: 0
}

.dex-carousel .switch-button {
  align-items: center;
  background-color: initial;
  background-color: var(--dex-okd-carousel-switch-button-bg-color, transparent);
  border: 2px solid #dbdbdb;
  border: var(--dex-okd-carousel-switch-button-bg-border-width, 2px) solid var(--dex-okd-carousel-switch-button-bg-border-color, #dbdbdb);
  border-radius: 50%;
  color: #000;
  color: var(--dex-okd-carousel-switch-button-font-color, #000);
  cursor: pointer;
  display: inline-flex;
  height: 44px;
  height: var(--dex-okd-carousel-switch-button-wdith, 44px);
  justify-content: center;
  position: absolute;
  top: 50%;
  transform: translateY(-50%);
  width: 44px;
  width: var(--dex-okd-carousel-switch-button-wdith, 44px);
  z-index: 2
}

.dex-carousel .switch-button-prev {
  left: 10px;
  left: var(--dex-okd-carousel-switch-button-distance, 10px)
}

.dex-carousel .switch-button-next {
  right: 10px;
  right: var(--dex-okd-carousel-switch-button-distance, 10px)
}

.dex-carousel .switch-button:hover {
  background: #000;
  background: var(--dex-okd-carousel-switch-button-bg-color-hover, #000);
  border: 2px solid #000;
  border: var(--dex-okd-carousel-switch-button-bg-border-width, 2px) solid #000;
  color: #fafafa;
  color: var(--dex-okd-carousel-switch-button-font-color, #fafafa)
}

.dex-carousel .switch-button .icon-next,
.dex-carousel .switch-button .icon-prev {
  font-size: 28px;
  font-size: var(--dex-okd-carousel-switch-button-font-size, 28px)
}

.dex-carousel .switch-button .icon-prev {
  transform: rotate(90deg)
}

.dex-carousel .switch-button .icon-next {
  transform: rotate(-90deg)
}

.dex-carousel-indicators {
  bottom: 20px;
  bottom: var(--dex-okd-carousel-indicators-bottom, 20px);
  display: flex;
  left: 50%;
  list-style: none;
  position: absolute;
  transform: translateX(-50%)
}

.dex-carousel-indicator {
  background-color: #bdbdbd;
  background-color: var(--dex-okd-carousel-indicator-bg-color, #bdbdbd);
  border: none;
  cursor: pointer;
  display: block;
  height: 6px;
  height: var(--dex-okd-carousel-indicator-height, 6px);
  margin-right: 13px;
  margin-right: var(--dex-okd-carousel-indicator-margin, 13px);
  transition: background-color .5s;
  width: 60px;
  width: var(--dex-okd-carousel-indicator-width, 60px)
}

.dex-carousel-indicator:last-child {
  margin-right: 0
}

.dex-carousel-indicator.active {
  background-color: #000;
  background-color: var(--dex-okd-carousel-indicator-bg-color-active, #000)
}

.dex-carousel-dragging .dex-carousel-slide>* {
  pointer-events: none
}

.dex-btn .dex-btn-outline-primary-loader {
  border-color: var(--dex-okd-button-outline-primary-loader-track-color);
  border-top-color: var(--dex-okd-button-outline-primary-loader-mark-color)
}

.dex-btn.btn-outline-primary {
  background: var(--dex-okd-button-outline-primary-default-background);
  border-color: var(--dex-okd-button-outline-primary-default-border-color);
  border-style: solid;
  border-width: var(--dex-okd-button-outline-primary-border-size);
  box-shadow: var(--dex-okd-button-outline-primary-default-shadow);
  color: var(--dex-okd-button-outline-primary-default-font-color)
}

.dex-btn.btn-outline-primary.hover,
.dex-btn.btn-outline-primary:not(:disabled):not(.btn-disabled):not(.mobile):hover {
  background: var(--dex-okd-button-outline-primary-hover-background);
  border-color: var(--dex-okd-button-outline-primary-hover-border-color);
  box-shadow: var(--dex-okd-button-outline-primary-hover-shadow);
  color: var(--dex-okd-button-outline-primary-hover-font-color)
}

.dex-btn.btn-outline-primary.hover .btn-icon,
.dex-btn.btn-outline-primary:not(:disabled):not(.btn-disabled):not(.mobile):hover .btn-icon {
  color: var(--dex-okd-button-outline-primary-hover-icon-color)
}

.dex-btn.btn-outline-primary.active,
.dex-btn.btn-outline-primary:not(:disabled):active {
  background: var(--dex-okd-button-outline-primary-active-background);
  border-color: var(--dex-okd-button-outline-primary-active-border-color);
  box-shadow: var(--dex-okd-button-outline-primary-active-shadow);
  color: var(--dex-okd-button-outline-primary-active-font-color)
}

.dex-btn.btn-outline-primary.active .btn-icon,
.dex-btn.btn-outline-primary:not(:disabled):active .btn-icon {
  color: var(--dex-okd-button-outline-primary-active-icon-color)
}

.dex-btn.btn-outline-primary:not(.loading).btn-disabled,
.dex-btn.btn-outline-primary:not(.loading):disabled {
  background: var(--dex-okd-button-outline-primary-disabled-background);
  border-color: var(--dex-okd-button-outline-primary-disabled-border-color);
  box-shadow: var(--dex-okd-button-outline-primary-disabled-shadow);
  color: var(--dex-okd-button-outline-primary-disabled-font-color)
}

.dex-btn.btn-outline-primary:not(.loading).btn-disabled .btn-icon,
.dex-btn.btn-outline-primary:not(.loading):disabled .btn-icon {
  color: var(--dex-okd-button-outline-primary-disabled-icon-color)
}

.dex-btn.btn-outline-primary.loading {
  cursor: pointer
}

.dex-btn.btn-outline-primary .btn-icon {
  color: var(--dex-okd-button-outline-primary-default-icon-color)
}

.dex-btn.btn-outline-primary .dex-btn-loader-text {
  color: var(--dex-okd-button-outline-primary-default-font-color)
}

.dex-btn.btn-outline-primary.btn-xxs {
  padding: calc(var(--dex-okd-button-xxs-padding-vertical) + 1px - var(--dex-okd-button-outline-primary-border-size)) var(--dex-okd-button-xxs-padding-horizontal)
}

.dex-btn.btn-outline-primary.btn-xxs.dex-btn-strict-circle {
  border-radius: 100px;
  height: calc(var(--dex-okd-button-xxs-padding-vertical)*2 + 2px - var(--dex-okd-button-outline-primary-border-size)*2 + var(--dex-okd-button-xxs-line-height) + var(--dex-okd-button-outline-primary-border-size)*2);
  min-width: 0;
  overflow: hidden;
  padding: 0;
  width: calc(var(--dex-okd-button-xxs-padding-vertical)*2 + 2px - var(--dex-okd-button-outline-primary-border-size)*2 + var(--dex-okd-button-xxs-line-height) + var(--dex-okd-button-outline-primary-border-size)*2)
}

.dex-btn.btn-outline-primary.btn-xxs.dex-btn-strict-circle .btn-content {
  display: block;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  width: 100%
}

.dex-btn.btn-outline-primary.btn-xs {
  padding: calc(var(--dex-okd-button-xs-padding-vertical) + 1px - var(--dex-okd-button-outline-primary-border-size)) var(--dex-okd-button-xs-padding-horizontal)
}

.dex-btn.btn-outline-primary.btn-xs.dex-btn-strict-circle {
  border-radius: 100px;
  height: calc(var(--dex-okd-button-xs-padding-vertical)*2 + 2px - var(--dex-okd-button-outline-primary-border-size)*2 + var(--dex-okd-button-xs-line-height) + var(--dex-okd-button-outline-primary-border-size)*2);
  min-width: 0;
  overflow: hidden;
  padding: 0;
  width: calc(var(--dex-okd-button-xs-padding-vertical)*2 + 2px - var(--dex-okd-button-outline-primary-border-size)*2 + var(--dex-okd-button-xs-line-height) + var(--dex-okd-button-outline-primary-border-size)*2)
}

.dex-btn.btn-outline-primary.btn-xs.dex-btn-strict-circle .btn-content {
  display: block;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  width: 100%
}

.dex-btn.btn-outline-primary.btn-s {
  padding: calc(var(--dex-okd-button-s-padding-vertical) + 1px - var(--dex-okd-button-outline-primary-border-size)) var(--dex-okd-button-s-padding-horizontal)
}

.dex-btn.btn-outline-primary.btn-s.dex-btn-strict-circle {
  border-radius: 100px;
  height: calc(var(--dex-okd-button-s-padding-vertical)*2 + 2px - var(--dex-okd-button-outline-primary-border-size)*2 + var(--dex-okd-button-s-line-height) + var(--dex-okd-button-outline-primary-border-size)*2);
  min-width: 0;
  overflow: hidden;
  padding: 0;
  width: calc(var(--dex-okd-button-s-padding-vertical)*2 + 2px - var(--dex-okd-button-outline-primary-border-size)*2 + var(--dex-okd-button-s-line-height) + var(--dex-okd-button-outline-primary-border-size)*2)
}

.dex-btn.btn-outline-primary.btn-s.dex-btn-strict-circle .btn-content {
  display: block;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  width: 100%
}

.dex-btn.btn-outline-primary.btn-sm {
  padding: calc(var(--dex-okd-button-sm-padding-vertical) + 1px - var(--dex-okd-button-outline-primary-border-size)) var(--dex-okd-button-sm-padding-horizontal)
}

.dex-btn.btn-outline-primary.btn-sm.dex-btn-strict-circle {
  border-radius: 100px;
  height: calc(var(--dex-okd-button-sm-padding-vertical)*2 + 2px - var(--dex-okd-button-outline-primary-border-size)*2 + var(--dex-okd-button-sm-line-height) + var(--dex-okd-button-outline-primary-border-size)*2);
  min-width: 0;
  overflow: hidden;
  padding: 0;
  width: calc(var(--dex-okd-button-sm-padding-vertical)*2 + 2px - var(--dex-okd-button-outline-primary-border-size)*2 + var(--dex-okd-button-sm-line-height) + var(--dex-okd-button-outline-primary-border-size)*2)
}

.dex-btn.btn-outline-primary.btn-sm.dex-btn-strict-circle .btn-content {
  display: block;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  width: 100%
}

.dex-btn.btn-outline-primary.btn-md {
  padding: calc(var(--dex-okd-button-md-padding-vertical) + 1px - var(--dex-okd-button-outline-primary-border-size)) var(--dex-okd-button-md-padding-horizontal)
}

.dex-btn.btn-outline-primary.btn-md.dex-btn-strict-circle {
  border-radius: 100px;
  height: calc(var(--dex-okd-button-md-padding-vertical)*2 + 2px - var(--dex-okd-button-outline-primary-border-size)*2 + var(--dex-okd-button-md-line-height) + var(--dex-okd-button-outline-primary-border-size)*2);
  min-width: 0;
  overflow: hidden;
  padding: 0;
  width: calc(var(--dex-okd-button-md-padding-vertical)*2 + 2px - var(--dex-okd-button-outline-primary-border-size)*2 + var(--dex-okd-button-md-line-height) + var(--dex-okd-button-outline-primary-border-size)*2)
}

.dex-btn.btn-outline-primary.btn-md.dex-btn-strict-circle .btn-content {
  display: block;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  width: 100%
}

.dex-btn.btn-outline-primary.btn-lg {
  padding: calc(var(--dex-okd-button-lg-padding-vertical) + 1px - var(--dex-okd-button-outline-primary-border-size)) var(--dex-okd-button-lg-padding-horizontal)
}

.dex-btn.btn-outline-primary.btn-lg.dex-btn-strict-circle {
  border-radius: 100px;
  height: calc(var(--dex-okd-button-lg-padding-vertical)*2 + 2px - var(--dex-okd-button-outline-primary-border-size)*2 + var(--dex-okd-button-lg-line-height) + var(--dex-okd-button-outline-primary-border-size)*2);
  min-width: 0;
  overflow: hidden;
  padding: 0;
  width: calc(var(--dex-okd-button-lg-padding-vertical)*2 + 2px - var(--dex-okd-button-outline-primary-border-size)*2 + var(--dex-okd-button-lg-line-height) + var(--dex-okd-button-outline-primary-border-size)*2)
}

.dex-btn.btn-outline-primary.btn-lg.dex-btn-strict-circle .btn-content {
  display: block;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  width: 100%
}

.dex-btn.btn-outline-primary.btn-xl {
  padding: calc(var(--dex-okd-button-xl-padding-vertical) + 1px - var(--dex-okd-button-outline-primary-border-size)) var(--dex-okd-button-xl-padding-horizontal)
}

.dex-btn.btn-outline-primary.btn-xl.dex-btn-strict-circle {
  border-radius: 100px;
  height: calc(var(--dex-okd-button-xl-padding-vertical)*2 + 2px - var(--dex-okd-button-outline-primary-border-size)*2 + var(--dex-okd-button-xl-line-height) + var(--dex-okd-button-outline-primary-border-size)*2);
  min-width: 0;
  overflow: hidden;
  padding: 0;
  width: calc(var(--dex-okd-button-xl-padding-vertical)*2 + 2px - var(--dex-okd-button-outline-primary-border-size)*2 + var(--dex-okd-button-xl-line-height) + var(--dex-okd-button-outline-primary-border-size)*2)
}

.dex-btn.btn-outline-primary.btn-xl.dex-btn-strict-circle .btn-content {
  display: block;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  width: 100%
}

.dex-btn .btn-content {
  align-items: center;
  display: flex
}

.dex-btn .dex-btn-ellipsis {
  display: block;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  width: 100%
}

.dex-btn.loading .btn-content {
  opacity: 0
}

.dex-btn.loading .btn-content-position {
  display: none
}

.dex-btn.loading .dex-btn-loader {
  line-height: 0;
  position: absolute
}

.dex-btn.loading .btn-loader-position-absolute {
  position: relative
}

.dex-btn-loader-container {
  height: 100%;
  position: relative
}

.dex-btn .btn-icon+.btn-content {
  margin-left: 4px
}

.dex-btn.btn-xxs .btn-icon {
  font-size: var(--dex-okd-button-xxs-icon-size)
}

.dex-btn.btn-xxs .btn-icon-leading {
  margin-right: var(--dex-okd-button-xxs-icon-margin)
}

.dex-btn.btn-xxs .btn-icon-tailing {
  margin-left: var(--dex-okd-button-xxs-icon-margin)
}

.dex-btn.btn-xxs .dex-btn-loader-size {
  border-radius: var(--dex-okd-button-xxs-loader-size);
  height: var(--dex-okd-button-xxs-loader-size);
  width: var(--dex-okd-button-xxs-loader-size)
}

.dex-btn.btn-xs .btn-icon {
  font-size: var(--dex-okd-button-xs-icon-size)
}

.dex-btn.btn-xs .btn-icon-leading {
  margin-right: var(--dex-okd-button-xs-icon-margin)
}

.dex-btn.btn-xs .btn-icon-tailing {
  margin-left: var(--dex-okd-button-xs-icon-margin)
}

.dex-btn.btn-xs .dex-btn-loader-size {
  border-radius: var(--dex-okd-button-xs-loader-size);
  height: var(--dex-okd-button-xs-loader-size);
  width: var(--dex-okd-button-xs-loader-size)
}

.dex-btn.btn-s .btn-icon {
  font-size: var(--dex-okd-button-s-icon-size)
}

.dex-btn.btn-s .btn-icon-leading {
  margin-right: var(--dex-okd-button-s-icon-margin)
}

.dex-btn.btn-s .btn-icon-tailing {
  margin-left: var(--dex-okd-button-s-icon-margin)
}

.dex-btn.btn-s .dex-btn-loader-size {
  border-radius: var(--dex-okd-button-s-loader-size);
  height: var(--dex-okd-button-s-loader-size);
  width: var(--dex-okd-button-s-loader-size)
}

.dex-btn.btn-sm .btn-icon {
  font-size: var(--dex-okd-button-sm-icon-size)
}

.dex-btn.btn-sm .btn-icon-leading {
  margin-right: var(--dex-okd-button-sm-icon-margin)
}

.dex-btn.btn-sm .btn-icon-tailing {
  margin-left: var(--dex-okd-button-sm-icon-margin)
}

.dex-btn.btn-sm .dex-btn-loader-size {
  border-radius: var(--dex-okd-button-sm-loader-size);
  height: var(--dex-okd-button-sm-loader-size);
  width: var(--dex-okd-button-sm-loader-size)
}

.dex-btn.btn-md .btn-icon {
  font-size: var(--dex-okd-button-md-icon-size)
}

.dex-btn.btn-md .btn-icon-leading {
  margin-right: var(--dex-okd-button-md-icon-margin)
}

.dex-btn.btn-md .btn-icon-tailing {
  margin-left: var(--dex-okd-button-md-icon-margin)
}

.dex-btn.btn-md .dex-btn-loader-size {
  border-radius: var(--dex-okd-button-md-loader-size);
  height: var(--dex-okd-button-md-loader-size);
  width: var(--dex-okd-button-md-loader-size)
}

.dex-btn.btn-lg .btn-icon {
  font-size: var(--dex-okd-button-lg-icon-size)
}

.dex-btn.btn-lg .btn-icon-leading {
  margin-right: var(--dex-okd-button-lg-icon-margin)
}

.dex-btn.btn-lg .btn-icon-tailing {
  margin-left: var(--dex-okd-button-lg-icon-margin)
}

.dex-btn.btn-lg .dex-btn-loader-size {
  border-radius: var(--dex-okd-button-lg-loader-size);
  height: var(--dex-okd-button-lg-loader-size);
  width: var(--dex-okd-button-lg-loader-size)
}

.dex-btn.btn-xl .btn-icon {
  font-size: var(--dex-okd-button-xl-icon-size)
}

.dex-btn.btn-xl .btn-icon-leading {
  margin-right: var(--dex-okd-button-xl-icon-margin)
}

.dex-btn.btn-xl .btn-icon-tailing {
  margin-left: var(--dex-okd-button-xl-icon-margin)
}

.dex-btn.btn-xl .dex-btn-loader-size {
  border-radius: var(--dex-okd-button-xl-loader-size);
  height: var(--dex-okd-button-xl-loader-size);
  width: var(--dex-okd-button-xl-loader-size)
}

.dex-btn .dex-btn-fill-grey-loader {
  border-color: var(--dex-okd-button-fill-grey-loader-track-color);
  border-top-color: var(--dex-okd-button-fill-grey-loader-mark-color)
}

.dex-btn {
  -webkit-tap-highlight-color: transparent;
  align-items: center;
  -webkit-appearance: none;
  box-sizing: border-box;
  cursor: pointer;
  display: inline-flex;
  font-family: inherit;
  font-weight: 500;
  justify-content: center;
  outline: none;
  position: relative;
  text-decoration: none;
  touch-action: manipulation;
  -webkit-user-select: none;
  -moz-user-select: none;
  -ms-user-select: none;
  user-select: none
}

.dex-btn:focus-visible {
  outline: 2px solid var(--dex-okd-color-border-focus);
  outline-color: var(--dex-okd-color-border-focus);
  outline-offset: 2px;
  outline-style: solid;
  outline-width: 2px
}

.dex-btn.btn-fill-grey {
  background: var(--dex-okd-button-fill-grey-default-background);
  border-color: var(--dex-okd-button-fill-grey-default-border-color);
  border-style: solid;
  border-width: var(--dex-okd-button-fill-grey-border-size);
  box-shadow: var(--dex-okd-button-fill-grey-default-shadow);
  color: var(--dex-okd-button-fill-grey-default-font-color)
}

.dex-btn.btn-fill-grey.hover,
.dex-btn.btn-fill-grey:not(:disabled):not(.btn-disabled):not(.mobile):hover {
  background: var(--dex-okd-button-fill-grey-hover-background);
  border-color: var(--dex-okd-button-fill-grey-hover-border-color);
  box-shadow: var(--dex-okd-button-fill-grey-hover-shadow);
  color: var(--dex-okd-button-fill-grey-hover-font-color)
}

.dex-btn.btn-fill-grey.hover .btn-icon,
.dex-btn.btn-fill-grey:not(:disabled):not(.btn-disabled):not(.mobile):hover .btn-icon {
  color: var(--dex-okd-button-fill-grey-hover-icon-color)
}

.dex-btn.btn-fill-grey.active,
.dex-btn.btn-fill-grey:not(:disabled):active {
  background: var(--dex-okd-button-fill-grey-active-background);
  border-color: var(--dex-okd-button-fill-grey-active-border-color);
  box-shadow: var(--dex-okd-button-fill-grey-active-shadow);
  color: var(--dex-okd-button-fill-grey-active-font-color)
}

.dex-btn.btn-fill-grey.active .btn-icon,
.dex-btn.btn-fill-grey:not(:disabled):active .btn-icon {
  color: var(--dex-okd-button-fill-grey-active-icon-color)
}

.dex-btn.btn-fill-grey:not(.loading).btn-disabled,
.dex-btn.btn-fill-grey:not(.loading):disabled {
  background: var(--dex-okd-button-fill-grey-disabled-background);
  border-color: var(--dex-okd-button-fill-grey-disabled-border-color);
  box-shadow: var(--dex-okd-button-fill-grey-disabled-shadow);
  color: var(--dex-okd-button-fill-grey-disabled-font-color)
}

.dex-btn.btn-fill-grey:not(.loading).btn-disabled .btn-icon,
.dex-btn.btn-fill-grey:not(.loading):disabled .btn-icon {
  color: var(--dex-okd-button-fill-grey-disabled-icon-color)
}

.dex-btn.btn-fill-grey.loading {
  cursor: pointer
}

.dex-btn.btn-fill-grey .btn-icon {
  color: var(--dex-okd-button-fill-grey-default-icon-color)
}

.dex-btn.btn-fill-grey .dex-btn-loader-text {
  color: var(--dex-okd-button-fill-grey-default-font-color)
}

.dex-btn.btn-fill-grey.btn-xxs {
  padding: calc(var(--dex-okd-button-xxs-padding-vertical) + 1px - var(--dex-okd-button-fill-grey-border-size)) var(--dex-okd-button-xxs-padding-horizontal)
}

.dex-btn.btn-fill-grey.btn-xxs.dex-btn-strict-circle {
  border-radius: 100px;
  height: calc(var(--dex-okd-button-xxs-padding-vertical)*2 + 2px - var(--dex-okd-button-fill-grey-border-size)*2 + var(--dex-okd-button-xxs-line-height) + var(--dex-okd-button-fill-grey-border-size)*2);
  min-width: 0;
  overflow: hidden;
  padding: 0;
  width: calc(var(--dex-okd-button-xxs-padding-vertical)*2 + 2px - var(--dex-okd-button-fill-grey-border-size)*2 + var(--dex-okd-button-xxs-line-height) + var(--dex-okd-button-fill-grey-border-size)*2)
}

.dex-btn.btn-fill-grey.btn-xxs.dex-btn-strict-circle .btn-content {
  display: block;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  width: 100%
}

.dex-btn.btn-fill-grey.btn-xs {
  padding: calc(var(--dex-okd-button-xs-padding-vertical) + 1px - var(--dex-okd-button-fill-grey-border-size)) var(--dex-okd-button-xs-padding-horizontal)
}

.dex-btn.btn-fill-grey.btn-xs.dex-btn-strict-circle {
  border-radius: 100px;
  height: calc(var(--dex-okd-button-xs-padding-vertical)*2 + 2px - var(--dex-okd-button-fill-grey-border-size)*2 + var(--dex-okd-button-xs-line-height) + var(--dex-okd-button-fill-grey-border-size)*2);
  min-width: 0;
  overflow: hidden;
  padding: 0;
  width: calc(var(--dex-okd-button-xs-padding-vertical)*2 + 2px - var(--dex-okd-button-fill-grey-border-size)*2 + var(--dex-okd-button-xs-line-height) + var(--dex-okd-button-fill-grey-border-size)*2)
}

.dex-btn.btn-fill-grey.btn-xs.dex-btn-strict-circle .btn-content {
  display: block;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  width: 100%
}

.dex-btn.btn-fill-grey.btn-s {
  padding: calc(var(--dex-okd-button-s-padding-vertical) + 1px - var(--dex-okd-button-fill-grey-border-size)) var(--dex-okd-button-s-padding-horizontal)
}

.dex-btn.btn-fill-grey.btn-s.dex-btn-strict-circle {
  border-radius: 100px;
  height: calc(var(--dex-okd-button-s-padding-vertical)*2 + 2px - var(--dex-okd-button-fill-grey-border-size)*2 + var(--dex-okd-button-s-line-height) + var(--dex-okd-button-fill-grey-border-size)*2);
  min-width: 0;
  overflow: hidden;
  padding: 0;
  width: calc(var(--dex-okd-button-s-padding-vertical)*2 + 2px - var(--dex-okd-button-fill-grey-border-size)*2 + var(--dex-okd-button-s-line-height) + var(--dex-okd-button-fill-grey-border-size)*2)
}

.dex-btn.btn-fill-grey.btn-s.dex-btn-strict-circle .btn-content {
  display: block;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  width: 100%
}

.dex-btn.btn-fill-grey.btn-sm {
  padding: calc(var(--dex-okd-button-sm-padding-vertical) + 1px - var(--dex-okd-button-fill-grey-border-size)) var(--dex-okd-button-sm-padding-horizontal)
}

.dex-btn.btn-fill-grey.btn-sm.dex-btn-strict-circle {
  border-radius: 100px;
  height: calc(var(--dex-okd-button-sm-padding-vertical)*2 + 2px - var(--dex-okd-button-fill-grey-border-size)*2 + var(--dex-okd-button-sm-line-height) + var(--dex-okd-button-fill-grey-border-size)*2);
  min-width: 0;
  overflow: hidden;
  padding: 0;
  width: calc(var(--dex-okd-button-sm-padding-vertical)*2 + 2px - var(--dex-okd-button-fill-grey-border-size)*2 + var(--dex-okd-button-sm-line-height) + var(--dex-okd-button-fill-grey-border-size)*2)
}

.dex-btn.btn-fill-grey.btn-sm.dex-btn-strict-circle .btn-content {
  display: block;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  width: 100%
}

.dex-btn.btn-fill-grey.btn-md {
  padding: calc(var(--dex-okd-button-md-padding-vertical) + 1px - var(--dex-okd-button-fill-grey-border-size)) var(--dex-okd-button-md-padding-horizontal)
}

.dex-btn.btn-fill-grey.btn-md.dex-btn-strict-circle {
  border-radius: 100px;
  height: calc(var(--dex-okd-button-md-padding-vertical)*2 + 2px - var(--dex-okd-button-fill-grey-border-size)*2 + var(--dex-okd-button-md-line-height) + var(--dex-okd-button-fill-grey-border-size)*2);
  min-width: 0;
  overflow: hidden;
  padding: 0;
  width: calc(var(--dex-okd-button-md-padding-vertical)*2 + 2px - var(--dex-okd-button-fill-grey-border-size)*2 + var(--dex-okd-button-md-line-height) + var(--dex-okd-button-fill-grey-border-size)*2)
}

.dex-btn.btn-fill-grey.btn-md.dex-btn-strict-circle .btn-content {
  display: block;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  width: 100%
}

.dex-btn.btn-fill-grey.btn-lg {
  padding: calc(var(--dex-okd-button-lg-padding-vertical) + 1px - var(--dex-okd-button-fill-grey-border-size)) var(--dex-okd-button-lg-padding-horizontal)
}

.dex-btn.btn-fill-grey.btn-lg.dex-btn-strict-circle {
  border-radius: 100px;
  height: calc(var(--dex-okd-button-lg-padding-vertical)*2 + 2px - var(--dex-okd-button-fill-grey-border-size)*2 + var(--dex-okd-button-lg-line-height) + var(--dex-okd-button-fill-grey-border-size)*2);
  min-width: 0;
  overflow: hidden;
  padding: 0;
  width: calc(var(--dex-okd-button-lg-padding-vertical)*2 + 2px - var(--dex-okd-button-fill-grey-border-size)*2 + var(--dex-okd-button-lg-line-height) + var(--dex-okd-button-fill-grey-border-size)*2)
}

.dex-btn.btn-fill-grey.btn-lg.dex-btn-strict-circle .btn-content {
  display: block;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  width: 100%
}

.dex-btn.btn-fill-grey.btn-xl {
  padding: calc(var(--dex-okd-button-xl-padding-vertical) + 1px - var(--dex-okd-button-fill-grey-border-size)) var(--dex-okd-button-xl-padding-horizontal)
}

.dex-btn.btn-fill-grey.btn-xl.dex-btn-strict-circle {
  border-radius: 100px;
  height: calc(var(--dex-okd-button-xl-padding-vertical)*2 + 2px - var(--dex-okd-button-fill-grey-border-size)*2 + var(--dex-okd-button-xl-line-height) + var(--dex-okd-button-fill-grey-border-size)*2);
  min-width: 0;
  overflow: hidden;
  padding: 0;
  width: calc(var(--dex-okd-button-xl-padding-vertical)*2 + 2px - var(--dex-okd-button-fill-grey-border-size)*2 + var(--dex-okd-button-xl-line-height) + var(--dex-okd-button-fill-grey-border-size)*2)
}

.dex-btn.btn-fill-grey.btn-xl.dex-btn-strict-circle .btn-content {
  display: block;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  width: 100%
}

.dex-btn.btn-xxs {
  border-radius: var(--dex-okd-button-xxs-border-radius);
  font-weight: 500;
  font-weight: var(--dex-okd-button-xxs-font-weight, 500);
  min-width: var(--dex-okd-button-xxs-min-width)
}

.dex-btn.btn-xxs,
.dex-btn.btn-xxs .dex-btn-loader-text {
  font-size: var(--dex-okd-button-xxs-font-size);
  line-height: var(--dex-okd-button-xxs-line-height)
}

.dex-btn.btn-xxs .dex-btn-loader-text {
  margin-left: var(--dex-okd-button-xxs-loader-text-margin-left)
}

.dex-btn.btn-xxs.btn-rect {
  border-radius: 4px;
  border-radius: var(--dex-okd-button-rect-xxs-border-radius, 4px)
}

.dex-btn.btn-xs {
  border-radius: var(--dex-okd-button-xs-border-radius);
  font-weight: 500;
  font-weight: var(--dex-okd-button-xs-font-weight, 500);
  min-width: var(--dex-okd-button-xs-min-width)
}

.dex-btn.btn-xs,
.dex-btn.btn-xs .dex-btn-loader-text {
  font-size: var(--dex-okd-button-xs-font-size);
  line-height: var(--dex-okd-button-xs-line-height)
}

.dex-btn.btn-xs .dex-btn-loader-text {
  margin-left: var(--dex-okd-button-xs-loader-text-margin-left)
}

.dex-btn.btn-xs.btn-rect {
  border-radius: 4px;
  border-radius: var(--dex-okd-button-rect-xs-border-radius, 4px)
}

.dex-btn.btn-s {
  border-radius: var(--dex-okd-button-s-border-radius);
  font-weight: 500;
  font-weight: var(--dex-okd-button-s-font-weight, 500);
  min-width: var(--dex-okd-button-s-min-width)
}

.dex-btn.btn-s,
.dex-btn.btn-s .dex-btn-loader-text {
  font-size: var(--dex-okd-button-s-font-size);
  line-height: var(--dex-okd-button-s-line-height)
}

.dex-btn.btn-s .dex-btn-loader-text {
  margin-left: var(--dex-okd-button-s-loader-text-margin-left)
}

.dex-btn.btn-s.btn-rect {
  border-radius: 4px;
  border-radius: var(--dex-okd-button-rect-s-border-radius, 4px)
}

.dex-btn.btn-sm {
  border-radius: var(--dex-okd-button-sm-border-radius);
  font-weight: 500;
  font-weight: var(--dex-okd-button-sm-font-weight, 500);
  min-width: var(--dex-okd-button-sm-min-width)
}

.dex-btn.btn-sm,
.dex-btn.btn-sm .dex-btn-loader-text {
  font-size: var(--dex-okd-button-sm-font-size);
  line-height: var(--dex-okd-button-sm-line-height)
}

.dex-btn.btn-sm .dex-btn-loader-text {
  margin-left: var(--dex-okd-button-sm-loader-text-margin-left)
}

.dex-btn.btn-sm.btn-rect {
  border-radius: 4px;
  border-radius: var(--dex-okd-button-rect-sm-border-radius, 4px)
}

.dex-btn.btn-md {
  border-radius: var(--dex-okd-button-md-border-radius);
  font-weight: 500;
  font-weight: var(--dex-okd-button-md-font-weight, 500);
  min-width: var(--dex-okd-button-md-min-width)
}

.dex-btn.btn-md,
.dex-btn.btn-md .dex-btn-loader-text {
  font-size: var(--dex-okd-button-md-font-size);
  line-height: var(--dex-okd-button-md-line-height)
}

.dex-btn.btn-md .dex-btn-loader-text {
  margin-left: var(--dex-okd-button-md-loader-text-margin-left)
}

.dex-btn.btn-md.btn-rect {
  border-radius: 4px;
  border-radius: var(--dex-okd-button-rect-md-border-radius, 4px)
}

.dex-btn.btn-lg {
  border-radius: var(--dex-okd-button-lg-border-radius);
  font-weight: 500;
  font-weight: var(--dex-okd-button-lg-font-weight, 500);
  min-width: var(--dex-okd-button-lg-min-width)
}

.dex-btn.btn-lg,
.dex-btn.btn-lg .dex-btn-loader-text {
  font-size: var(--dex-okd-button-lg-font-size);
  line-height: var(--dex-okd-button-lg-line-height)
}

.dex-btn.btn-lg .dex-btn-loader-text {
  margin-left: var(--dex-okd-button-lg-loader-text-margin-left)
}

.dex-btn.btn-lg.btn-rect {
  border-radius: 8px;
  border-radius: var(--dex-okd-button-rect-lg-border-radius, 8px)
}

.dex-btn.btn-xl {
  border-radius: var(--dex-okd-button-xl-border-radius);
  font-weight: 500;
  font-weight: var(--dex-okd-button-xl-font-weight, 500);
  min-width: var(--dex-okd-button-xl-min-width)
}

.dex-btn.btn-xl,
.dex-btn.btn-xl .dex-btn-loader-text {
  font-size: var(--dex-okd-button-xl-font-size);
  line-height: var(--dex-okd-button-xl-line-height)
}

.dex-btn.btn-xl .dex-btn-loader-text {
  margin-left: var(--dex-okd-button-xl-loader-text-margin-left)
}

.dex-btn.btn-xl.btn-rect {
  border-radius: 8px;
  border-radius: var(--dex-okd-button-rect-xl-border-radius, 8px)
}

.dex-btn.btn-disabled,
.dex-btn:disabled {
  cursor: not-allowed
}

.dex-btn.block {
  display: flex;
  width: 100%
}

.dex-btn.btn-circle {
  border-radius: 100px !important
}

.dex-btn {
  -webkit-tap-highlight-color: transparent;
  align-items: center;
  -webkit-appearance: none;
  box-sizing: border-box;
  cursor: pointer;
  display: inline-flex;
  font-family: inherit;
  font-weight: 500;
  justify-content: center;
  outline: none;
  position: relative;
  text-decoration: none;
  touch-action: manipulation;
  -webkit-user-select: none;
  -moz-user-select: none;
  -ms-user-select: none;
  user-select: none
}

.dex-btn:focus-visible {
  outline: 2px solid var(--dex-okd-color-border-focus);
  outline-color: var(--dex-okd-color-border-focus);
  outline-offset: 2px;
  outline-style: solid;
  outline-width: 2px
}

.dex-btn.btn-fill-highlight {
  background: var(--dex-okd-button-fill-highlight-default-background);
  border-color: var(--dex-okd-button-fill-highlight-default-border-color);
  border-style: solid;
  border-width: var(--dex-okd-button-fill-highlight-border-size);
  box-shadow: var(--dex-okd-button-fill-highlight-default-shadow);
  color: var(--dex-okd-button-fill-highlight-default-font-color)
}

.dex-btn.btn-fill-highlight.hover,
.dex-btn.btn-fill-highlight:not(:disabled):not(.btn-disabled):not(.mobile):hover {
  background: var(--dex-okd-button-fill-highlight-hover-background);
  border-color: var(--dex-okd-button-fill-highlight-hover-border-color);
  box-shadow: var(--dex-okd-button-fill-highlight-hover-shadow);
  color: var(--dex-okd-button-fill-highlight-hover-font-color)
}

.dex-btn.btn-fill-highlight.hover .btn-icon,
.dex-btn.btn-fill-highlight:not(:disabled):not(.btn-disabled):not(.mobile):hover .btn-icon {
  color: var(--dex-okd-button-fill-highlight-hover-icon-color)
}

.dex-btn.btn-fill-highlight.active,
.dex-btn.btn-fill-highlight:not(:disabled):active {
  background: var(--dex-okd-button-fill-highlight-active-background);
  border-color: var(--dex-okd-button-fill-highlight-active-border-color);
  box-shadow: var(--dex-okd-button-fill-highlight-active-shadow);
  color: var(--dex-okd-button-fill-highlight-active-font-color)
}

.dex-btn.btn-fill-highlight.active .btn-icon,
.dex-btn.btn-fill-highlight:not(:disabled):active .btn-icon {
  color: var(--dex-okd-button-fill-highlight-active-icon-color)
}

.dex-btn.btn-fill-highlight:not(.loading).btn-disabled,
.dex-btn.btn-fill-highlight:not(.loading):disabled {
  background: var(--dex-okd-button-fill-highlight-disabled-background);
  border-color: var(--dex-okd-button-fill-highlight-disabled-border-color);
  box-shadow: var(--dex-okd-button-fill-highlight-disabled-shadow);
  color: var(--dex-okd-button-fill-highlight-disabled-font-color)
}

.dex-btn.btn-fill-highlight:not(.loading).btn-disabled .btn-icon,
.dex-btn.btn-fill-highlight:not(.loading):disabled .btn-icon {
  color: var(--dex-okd-button-fill-highlight-disabled-icon-color)
}

.dex-btn.btn-fill-highlight.loading {
  cursor: pointer
}

.dex-btn.btn-fill-highlight .btn-icon {
  color: var(--dex-okd-button-fill-highlight-default-icon-color)
}

.dex-btn.btn-fill-highlight .dex-btn-loader-text {
  color: var(--dex-okd-button-fill-highlight-default-font-color)
}

.dex-btn.btn-fill-highlight.btn-xxs {
  padding: calc(var(--dex-okd-button-xxs-padding-vertical) + 1px - var(--dex-okd-button-fill-highlight-border-size)) var(--dex-okd-button-xxs-padding-horizontal)
}

.dex-btn.btn-fill-highlight.btn-xxs.dex-btn-strict-circle {
  border-radius: 100px;
  height: calc(var(--dex-okd-button-xxs-padding-vertical)*2 + 2px - var(--dex-okd-button-fill-highlight-border-size)*2 + var(--dex-okd-button-xxs-line-height) + var(--dex-okd-button-fill-highlight-border-size)*2);
  min-width: 0;
  overflow: hidden;
  padding: 0;
  width: calc(var(--dex-okd-button-xxs-padding-vertical)*2 + 2px - var(--dex-okd-button-fill-highlight-border-size)*2 + var(--dex-okd-button-xxs-line-height) + var(--dex-okd-button-fill-highlight-border-size)*2)
}

.dex-btn.btn-fill-highlight.btn-xxs.dex-btn-strict-circle .btn-content {
  display: block;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  width: 100%
}

.dex-btn.btn-fill-highlight.btn-xs {
  padding: calc(var(--dex-okd-button-xs-padding-vertical) + 1px - var(--dex-okd-button-fill-highlight-border-size)) var(--dex-okd-button-xs-padding-horizontal)
}

.dex-btn.btn-fill-highlight.btn-xs.dex-btn-strict-circle {
  border-radius: 100px;
  height: calc(var(--dex-okd-button-xs-padding-vertical)*2 + 2px - var(--dex-okd-button-fill-highlight-border-size)*2 + var(--dex-okd-button-xs-line-height) + var(--dex-okd-button-fill-highlight-border-size)*2);
  min-width: 0;
  overflow: hidden;
  padding: 0;
  width: calc(var(--dex-okd-button-xs-padding-vertical)*2 + 2px - var(--dex-okd-button-fill-highlight-border-size)*2 + var(--dex-okd-button-xs-line-height) + var(--dex-okd-button-fill-highlight-border-size)*2)
}

.dex-btn.btn-fill-highlight.btn-xs.dex-btn-strict-circle .btn-content {
  display: block;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  width: 100%
}

.dex-btn.btn-fill-highlight.btn-s {
  padding: calc(var(--dex-okd-button-s-padding-vertical) + 1px - var(--dex-okd-button-fill-highlight-border-size)) var(--dex-okd-button-s-padding-horizontal)
}

.dex-btn.btn-fill-highlight.btn-s.dex-btn-strict-circle {
  border-radius: 100px;
  height: calc(var(--dex-okd-button-s-padding-vertical)*2 + 2px - var(--dex-okd-button-fill-highlight-border-size)*2 + var(--dex-okd-button-s-line-height) + var(--dex-okd-button-fill-highlight-border-size)*2);
  min-width: 0;
  overflow: hidden;
  padding: 0;
  width: calc(var(--dex-okd-button-s-padding-vertical)*2 + 2px - var(--dex-okd-button-fill-highlight-border-size)*2 + var(--dex-okd-button-s-line-height) + var(--dex-okd-button-fill-highlight-border-size)*2)
}

.dex-btn.btn-fill-highlight.btn-s.dex-btn-strict-circle .btn-content {
  display: block;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  width: 100%
}

.dex-btn.btn-fill-highlight.btn-sm {
  padding: calc(var(--dex-okd-button-sm-padding-vertical) + 1px - var(--dex-okd-button-fill-highlight-border-size)) var(--dex-okd-button-sm-padding-horizontal)
}

.dex-btn.btn-fill-highlight.btn-sm.dex-btn-strict-circle {
  border-radius: 100px;
  height: calc(var(--dex-okd-button-sm-padding-vertical)*2 + 2px - var(--dex-okd-button-fill-highlight-border-size)*2 + var(--dex-okd-button-sm-line-height) + var(--dex-okd-button-fill-highlight-border-size)*2);
  min-width: 0;
  overflow: hidden;
  padding: 0;
  width: calc(var(--dex-okd-button-sm-padding-vertical)*2 + 2px - var(--dex-okd-button-fill-highlight-border-size)*2 + var(--dex-okd-button-sm-line-height) + var(--dex-okd-button-fill-highlight-border-size)*2)
}

.dex-btn.btn-fill-highlight.btn-sm.dex-btn-strict-circle .btn-content {
  display: block;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  width: 100%
}

.dex-btn.btn-fill-highlight.btn-md {
  padding: calc(var(--dex-okd-button-md-padding-vertical) + 1px - var(--dex-okd-button-fill-highlight-border-size)) var(--dex-okd-button-md-padding-horizontal)
}

.dex-btn.btn-fill-highlight.btn-md.dex-btn-strict-circle {
  border-radius: 100px;
  height: calc(var(--dex-okd-button-md-padding-vertical)*2 + 2px - var(--dex-okd-button-fill-highlight-border-size)*2 + var(--dex-okd-button-md-line-height) + var(--dex-okd-button-fill-highlight-border-size)*2);
  min-width: 0;
  overflow: hidden;
  padding: 0;
  width: calc(var(--dex-okd-button-md-padding-vertical)*2 + 2px - var(--dex-okd-button-fill-highlight-border-size)*2 + var(--dex-okd-button-md-line-height) + var(--dex-okd-button-fill-highlight-border-size)*2)
}

.dex-btn.btn-fill-highlight.btn-md.dex-btn-strict-circle .btn-content {
  display: block;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  width: 100%
}

.dex-btn.btn-fill-highlight.btn-lg {
  padding: calc(var(--dex-okd-button-lg-padding-vertical) + 1px - var(--dex-okd-button-fill-highlight-border-size)) var(--dex-okd-button-lg-padding-horizontal)
}

.dex-btn.btn-fill-highlight.btn-lg.dex-btn-strict-circle {
  border-radius: 100px;
  height: calc(var(--dex-okd-button-lg-padding-vertical)*2 + 2px - var(--dex-okd-button-fill-highlight-border-size)*2 + var(--dex-okd-button-lg-line-height) + var(--dex-okd-button-fill-highlight-border-size)*2);
  min-width: 0;
  overflow: hidden;
  padding: 0;
  width: calc(var(--dex-okd-button-lg-padding-vertical)*2 + 2px - var(--dex-okd-button-fill-highlight-border-size)*2 + var(--dex-okd-button-lg-line-height) + var(--dex-okd-button-fill-highlight-border-size)*2)
}

.dex-btn.btn-fill-highlight.btn-lg.dex-btn-strict-circle .btn-content {
  display: block;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  width: 100%
}

.dex-btn.btn-fill-highlight.btn-xl {
  padding: calc(var(--dex-okd-button-xl-padding-vertical) + 1px - var(--dex-okd-button-fill-highlight-border-size)) var(--dex-okd-button-xl-padding-horizontal)
}

.dex-btn.btn-fill-highlight.btn-xl.dex-btn-strict-circle {
  border-radius: 100px;
  height: calc(var(--dex-okd-button-xl-padding-vertical)*2 + 2px - var(--dex-okd-button-fill-highlight-border-size)*2 + var(--dex-okd-button-xl-line-height) + var(--dex-okd-button-fill-highlight-border-size)*2);
  min-width: 0;
  overflow: hidden;
  padding: 0;
  width: calc(var(--dex-okd-button-xl-padding-vertical)*2 + 2px - var(--dex-okd-button-fill-highlight-border-size)*2 + var(--dex-okd-button-xl-line-height) + var(--dex-okd-button-fill-highlight-border-size)*2)
}

.dex-btn.btn-fill-highlight.btn-xl.dex-btn-strict-circle .btn-content {
  display: block;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  width: 100%
}

.dex-btn.btn-fill-primary {
  background: var(--dex-okd-button-fill-primary-default-background);
  border-color: var(--dex-okd-button-fill-primary-default-border-color);
  border-style: solid;
  border-width: var(--dex-okd-button-fill-primary-border-size);
  box-shadow: var(--dex-okd-button-fill-primary-default-shadow);
  color: var(--dex-okd-button-fill-primary-default-font-color)
}

.dex-btn.btn-fill-primary.hover,
.dex-btn.btn-fill-primary:not(:disabled):not(.btn-disabled):not(.mobile):hover {
  background: var(--dex-okd-button-fill-primary-hover-background);
  border-color: var(--dex-okd-button-fill-primary-hover-border-color);
  box-shadow: var(--dex-okd-button-fill-primary-hover-shadow);
  color: var(--dex-okd-button-fill-primary-hover-font-color)
}

.dex-btn.btn-fill-primary.hover .btn-icon,
.dex-btn.btn-fill-primary:not(:disabled):not(.btn-disabled):not(.mobile):hover .btn-icon {
  color: var(--dex-okd-button-fill-primary-hover-icon-color)
}

.dex-btn.btn-fill-primary.active,
.dex-btn.btn-fill-primary:not(:disabled):active {
  background: var(--dex-okd-button-fill-primary-active-background);
  border-color: var(--dex-okd-button-fill-primary-active-border-color);
  box-shadow: var(--dex-okd-button-fill-primary-active-shadow);
  color: var(--dex-okd-button-fill-primary-active-font-color)
}

.dex-btn.btn-fill-primary.active .btn-icon,
.dex-btn.btn-fill-primary:not(:disabled):active .btn-icon {
  color: var(--dex-okd-button-fill-primary-active-icon-color)
}

.dex-btn.btn-fill-primary:not(.loading).btn-disabled,
.dex-btn.btn-fill-primary:not(.loading):disabled {
  background: var(--dex-okd-button-fill-primary-disabled-background);
  border-color: var(--dex-okd-button-fill-primary-disabled-border-color);
  box-shadow: var(--dex-okd-button-fill-primary-disabled-shadow);
  color: var(--dex-okd-button-fill-primary-disabled-font-color)
}

.dex-btn.btn-fill-primary:not(.loading).btn-disabled .btn-icon,
.dex-btn.btn-fill-primary:not(.loading):disabled .btn-icon {
  color: var(--dex-okd-button-fill-primary-disabled-icon-color)
}

.dex-btn.btn-fill-primary.loading {
  cursor: pointer
}

.dex-btn.btn-fill-primary .btn-icon {
  color: var(--dex-okd-button-fill-primary-default-icon-color)
}

.dex-btn.btn-fill-primary .dex-btn-loader-text {
  color: var(--dex-okd-button-fill-primary-default-font-color)
}

.dex-btn.btn-fill-primary.btn-xxs {
  padding: calc(var(--dex-okd-button-xxs-padding-vertical) + 1px - var(--dex-okd-button-fill-primary-border-size)) var(--dex-okd-button-xxs-padding-horizontal)
}

.dex-btn.btn-fill-primary.btn-xxs.dex-btn-strict-circle {
  border-radius: 100px;
  height: calc(var(--dex-okd-button-xxs-padding-vertical)*2 + 2px - var(--dex-okd-button-fill-primary-border-size)*2 + var(--dex-okd-button-xxs-line-height) + var(--dex-okd-button-fill-primary-border-size)*2);
  min-width: 0;
  overflow: hidden;
  padding: 0;
  width: calc(var(--dex-okd-button-xxs-padding-vertical)*2 + 2px - var(--dex-okd-button-fill-primary-border-size)*2 + var(--dex-okd-button-xxs-line-height) + var(--dex-okd-button-fill-primary-border-size)*2)
}

.dex-btn.btn-fill-primary.btn-xxs.dex-btn-strict-circle .btn-content {
  display: block;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  width: 100%
}

.dex-btn.btn-fill-primary.btn-xs {
  padding: calc(var(--dex-okd-button-xs-padding-vertical) + 1px - var(--dex-okd-button-fill-primary-border-size)) var(--dex-okd-button-xs-padding-horizontal)
}

.dex-btn.btn-fill-primary.btn-xs.dex-btn-strict-circle {
  border-radius: 100px;
  height: calc(var(--dex-okd-button-xs-padding-vertical)*2 + 2px - var(--dex-okd-button-fill-primary-border-size)*2 + var(--dex-okd-button-xs-line-height) + var(--dex-okd-button-fill-primary-border-size)*2);
  min-width: 0;
  overflow: hidden;
  padding: 0;
  width: calc(var(--dex-okd-button-xs-padding-vertical)*2 + 2px - var(--dex-okd-button-fill-primary-border-size)*2 + var(--dex-okd-button-xs-line-height) + var(--dex-okd-button-fill-primary-border-size)*2)
}

.dex-btn.btn-fill-primary.btn-xs.dex-btn-strict-circle .btn-content {
  display: block;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  width: 100%
}

.dex-btn.btn-fill-primary.btn-s {
  padding: calc(var(--dex-okd-button-s-padding-vertical) + 1px - var(--dex-okd-button-fill-primary-border-size)) var(--dex-okd-button-s-padding-horizontal)
}

.dex-btn.btn-fill-primary.btn-s.dex-btn-strict-circle {
  border-radius: 100px;
  height: calc(var(--dex-okd-button-s-padding-vertical)*2 + 2px - var(--dex-okd-button-fill-primary-border-size)*2 + var(--dex-okd-button-s-line-height) + var(--dex-okd-button-fill-primary-border-size)*2);
  min-width: 0;
  overflow: hidden;
  padding: 0;
  width: calc(var(--dex-okd-button-s-padding-vertical)*2 + 2px - var(--dex-okd-button-fill-primary-border-size)*2 + var(--dex-okd-button-s-line-height) + var(--dex-okd-button-fill-primary-border-size)*2)
}

.dex-btn.btn-fill-primary.btn-s.dex-btn-strict-circle .btn-content {
  display: block;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  width: 100%
}

.dex-btn.btn-fill-primary.btn-sm {
  padding: calc(var(--dex-okd-button-sm-padding-vertical) + 1px - var(--dex-okd-button-fill-primary-border-size)) var(--dex-okd-button-sm-padding-horizontal)
}

.dex-btn.btn-fill-primary.btn-sm.dex-btn-strict-circle {
  border-radius: 100px;
  height: calc(var(--dex-okd-button-sm-padding-vertical)*2 + 2px - var(--dex-okd-button-fill-primary-border-size)*2 + var(--dex-okd-button-sm-line-height) + var(--dex-okd-button-fill-primary-border-size)*2);
  min-width: 0;
  overflow: hidden;
  padding: 0;
  width: calc(var(--dex-okd-button-sm-padding-vertical)*2 + 2px - var(--dex-okd-button-fill-primary-border-size)*2 + var(--dex-okd-button-sm-line-height) + var(--dex-okd-button-fill-primary-border-size)*2)
}

.dex-btn.btn-fill-primary.btn-sm.dex-btn-strict-circle .btn-content {
  display: block;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  width: 100%
}

.dex-btn.btn-fill-primary.btn-md {
  padding: calc(var(--dex-okd-button-md-padding-vertical) + 1px - var(--dex-okd-button-fill-primary-border-size)) var(--dex-okd-button-md-padding-horizontal)
}

.dex-btn.btn-fill-primary.btn-md.dex-btn-strict-circle {
  border-radius: 100px;
  height: calc(var(--dex-okd-button-md-padding-vertical)*2 + 2px - var(--dex-okd-button-fill-primary-border-size)*2 + var(--dex-okd-button-md-line-height) + var(--dex-okd-button-fill-primary-border-size)*2);
  min-width: 0;
  overflow: hidden;
  padding: 0;
  width: calc(var(--dex-okd-button-md-padding-vertical)*2 + 2px - var(--dex-okd-button-fill-primary-border-size)*2 + var(--dex-okd-button-md-line-height) + var(--dex-okd-button-fill-primary-border-size)*2)
}

.dex-btn.btn-fill-primary.btn-md.dex-btn-strict-circle .btn-content {
  display: block;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  width: 100%
}

.dex-btn.btn-fill-primary.btn-lg {
  padding: calc(var(--dex-okd-button-lg-padding-vertical) + 1px - var(--dex-okd-button-fill-primary-border-size)) var(--dex-okd-button-lg-padding-horizontal)
}

.dex-btn.btn-fill-primary.btn-lg.dex-btn-strict-circle {
  border-radius: 100px;
  height: calc(var(--dex-okd-button-lg-padding-vertical)*2 + 2px - var(--dex-okd-button-fill-primary-border-size)*2 + var(--dex-okd-button-lg-line-height) + var(--dex-okd-button-fill-primary-border-size)*2);
  min-width: 0;
  overflow: hidden;
  padding: 0;
  width: calc(var(--dex-okd-button-lg-padding-vertical)*2 + 2px - var(--dex-okd-button-fill-primary-border-size)*2 + var(--dex-okd-button-lg-line-height) + var(--dex-okd-button-fill-primary-border-size)*2)
}

.dex-btn.btn-fill-primary.btn-lg.dex-btn-strict-circle .btn-content {
  display: block;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  width: 100%
}

.dex-btn.btn-fill-primary.btn-xl {
  padding: calc(var(--dex-okd-button-xl-padding-vertical) + 1px - var(--dex-okd-button-fill-primary-border-size)) var(--dex-okd-button-xl-padding-horizontal)
}

.dex-btn.btn-fill-primary.btn-xl.dex-btn-strict-circle {
  border-radius: 100px;
  height: calc(var(--dex-okd-button-xl-padding-vertical)*2 + 2px - var(--dex-okd-button-fill-primary-border-size)*2 + var(--dex-okd-button-xl-line-height) + var(--dex-okd-button-fill-primary-border-size)*2);
  min-width: 0;
  overflow: hidden;
  padding: 0;
  width: calc(var(--dex-okd-button-xl-padding-vertical)*2 + 2px - var(--dex-okd-button-fill-primary-border-size)*2 + var(--dex-okd-button-xl-line-height) + var(--dex-okd-button-fill-primary-border-size)*2)
}

.dex-btn.btn-fill-primary.btn-xl.dex-btn-strict-circle .btn-content {
  display: block;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  width: 100%
}

.dex-btn.btn-fill-secondary {
  background: var(--dex-okd-button-fill-secondary-default-background);
  border-color: var(--dex-okd-button-fill-secondary-default-border-color);
  border-style: solid;
  border-width: var(--dex-okd-button-fill-secondary-border-size);
  box-shadow: var(--dex-okd-button-fill-secondary-default-shadow);
  color: var(--dex-okd-button-fill-secondary-default-font-color)
}

.dex-btn.btn-fill-secondary.hover,
.dex-btn.btn-fill-secondary:not(:disabled):not(.btn-disabled):not(.mobile):hover {
  background: var(--dex-okd-button-fill-secondary-hover-background);
  border-color: var(--dex-okd-button-fill-secondary-hover-border-color);
  box-shadow: var(--dex-okd-button-fill-secondary-hover-shadow);
  color: var(--dex-okd-button-fill-secondary-hover-font-color)
}

.dex-btn.btn-fill-secondary.hover .btn-icon,
.dex-btn.btn-fill-secondary:not(:disabled):not(.btn-disabled):not(.mobile):hover .btn-icon {
  color: var(--dex-okd-button-fill-secondary-hover-icon-color)
}

.dex-btn.btn-fill-secondary.active,
.dex-btn.btn-fill-secondary:not(:disabled):active {
  background: var(--dex-okd-button-fill-secondary-active-background);
  border-color: var(--dex-okd-button-fill-secondary-active-border-color);
  box-shadow: var(--dex-okd-button-fill-secondary-active-shadow);
  color: var(--dex-okd-button-fill-secondary-active-font-color)
}

.dex-btn.btn-fill-secondary.active .btn-icon,
.dex-btn.btn-fill-secondary:not(:disabled):active .btn-icon {
  color: var(--dex-okd-button-fill-secondary-active-icon-color)
}

.dex-btn.btn-fill-secondary:not(.loading).btn-disabled,
.dex-btn.btn-fill-secondary:not(.loading):disabled {
  background: var(--dex-okd-button-fill-secondary-disabled-background);
  border-color: var(--dex-okd-button-fill-secondary-disabled-border-color);
  box-shadow: var(--dex-okd-button-fill-secondary-disabled-shadow);
  color: var(--dex-okd-button-fill-secondary-disabled-font-color)
}

.dex-btn.btn-fill-secondary:not(.loading).btn-disabled .btn-icon,
.dex-btn.btn-fill-secondary:not(.loading):disabled .btn-icon {
  color: var(--dex-okd-button-fill-secondary-disabled-icon-color)
}

.dex-btn.btn-fill-secondary.loading {
  cursor: pointer
}

.dex-btn.btn-fill-secondary .btn-icon {
  color: var(--dex-okd-button-fill-secondary-default-icon-color)
}

.dex-btn.btn-fill-secondary .dex-btn-loader-text {
  color: var(--dex-okd-button-fill-secondary-default-font-color)
}

.dex-btn.btn-fill-secondary.btn-xxs {
  padding: calc(var(--dex-okd-button-xxs-padding-vertical) + 1px - var(--dex-okd-button-fill-secondary-border-size)) var(--dex-okd-button-xxs-padding-horizontal)
}

.dex-btn.btn-fill-secondary.btn-xxs.dex-btn-strict-circle {
  border-radius: 100px;
  height: calc(var(--dex-okd-button-xxs-padding-vertical)*2 + 2px - var(--dex-okd-button-fill-secondary-border-size)*2 + var(--dex-okd-button-xxs-line-height) + var(--dex-okd-button-fill-secondary-border-size)*2);
  min-width: 0;
  overflow: hidden;
  padding: 0;
  width: calc(var(--dex-okd-button-xxs-padding-vertical)*2 + 2px - var(--dex-okd-button-fill-secondary-border-size)*2 + var(--dex-okd-button-xxs-line-height) + var(--dex-okd-button-fill-secondary-border-size)*2)
}

.dex-btn.btn-fill-secondary.btn-xxs.dex-btn-strict-circle .btn-content {
  display: block;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  width: 100%
}

.dex-btn.btn-fill-secondary.btn-xs {
  padding: calc(var(--dex-okd-button-xs-padding-vertical) + 1px - var(--dex-okd-button-fill-secondary-border-size)) var(--dex-okd-button-xs-padding-horizontal)
}

.dex-btn.btn-fill-secondary.btn-xs.dex-btn-strict-circle {
  border-radius: 100px;
  height: calc(var(--dex-okd-button-xs-padding-vertical)*2 + 2px - var(--dex-okd-button-fill-secondary-border-size)*2 + var(--dex-okd-button-xs-line-height) + var(--dex-okd-button-fill-secondary-border-size)*2);
  min-width: 0;
  overflow: hidden;
  padding: 0;
  width: calc(var(--dex-okd-button-xs-padding-vertical)*2 + 2px - var(--dex-okd-button-fill-secondary-border-size)*2 + var(--dex-okd-button-xs-line-height) + var(--dex-okd-button-fill-secondary-border-size)*2)
}

.dex-btn.btn-fill-secondary.btn-xs.dex-btn-strict-circle .btn-content {
  display: block;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  width: 100%
}

.dex-btn.btn-fill-secondary.btn-s {
  padding: calc(var(--dex-okd-button-s-padding-vertical) + 1px - var(--dex-okd-button-fill-secondary-border-size)) var(--dex-okd-button-s-padding-horizontal)
}

.dex-btn.btn-fill-secondary.btn-s.dex-btn-strict-circle {
  border-radius: 100px;
  height: calc(var(--dex-okd-button-s-padding-vertical)*2 + 2px - var(--dex-okd-button-fill-secondary-border-size)*2 + var(--dex-okd-button-s-line-height) + var(--dex-okd-button-fill-secondary-border-size)*2);
  min-width: 0;
  overflow: hidden;
  padding: 0;
  width: calc(var(--dex-okd-button-s-padding-vertical)*2 + 2px - var(--dex-okd-button-fill-secondary-border-size)*2 + var(--dex-okd-button-s-line-height) + var(--dex-okd-button-fill-secondary-border-size)*2)
}

.dex-btn.btn-fill-secondary.btn-s.dex-btn-strict-circle .btn-content {
  display: block;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  width: 100%
}

.dex-btn.btn-fill-secondary.btn-sm {
  padding: calc(var(--dex-okd-button-sm-padding-vertical) + 1px - var(--dex-okd-button-fill-secondary-border-size)) var(--dex-okd-button-sm-padding-horizontal)
}

.dex-btn.btn-fill-secondary.btn-sm.dex-btn-strict-circle {
  border-radius: 100px;
  height: calc(var(--dex-okd-button-sm-padding-vertical)*2 + 2px - var(--dex-okd-button-fill-secondary-border-size)*2 + var(--dex-okd-button-sm-line-height) + var(--dex-okd-button-fill-secondary-border-size)*2);
  min-width: 0;
  overflow: hidden;
  padding: 0;
  width: calc(var(--dex-okd-button-sm-padding-vertical)*2 + 2px - var(--dex-okd-button-fill-secondary-border-size)*2 + var(--dex-okd-button-sm-line-height) + var(--dex-okd-button-fill-secondary-border-size)*2)
}

.dex-btn.btn-fill-secondary.btn-sm.dex-btn-strict-circle .btn-content {
  display: block;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  width: 100%
}

.dex-btn.btn-fill-secondary.btn-md {
  padding: calc(var(--dex-okd-button-md-padding-vertical) + 1px - var(--dex-okd-button-fill-secondary-border-size)) var(--dex-okd-button-md-padding-horizontal)
}

.dex-btn.btn-fill-secondary.btn-md.dex-btn-strict-circle {
  border-radius: 100px;
  height: calc(var(--dex-okd-button-md-padding-vertical)*2 + 2px - var(--dex-okd-button-fill-secondary-border-size)*2 + var(--dex-okd-button-md-line-height) + var(--dex-okd-button-fill-secondary-border-size)*2);
  min-width: 0;
  overflow: hidden;
  padding: 0;
  width: calc(var(--dex-okd-button-md-padding-vertical)*2 + 2px - var(--dex-okd-button-fill-secondary-border-size)*2 + var(--dex-okd-button-md-line-height) + var(--dex-okd-button-fill-secondary-border-size)*2)
}

.dex-btn.btn-fill-secondary.btn-md.dex-btn-strict-circle .btn-content {
  display: block;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  width: 100%
}

.dex-btn.btn-fill-secondary.btn-lg {
  padding: calc(var(--dex-okd-button-lg-padding-vertical) + 1px - var(--dex-okd-button-fill-secondary-border-size)) var(--dex-okd-button-lg-padding-horizontal)
}

.dex-btn.btn-fill-secondary.btn-lg.dex-btn-strict-circle {
  border-radius: 100px;
  height: calc(var(--dex-okd-button-lg-padding-vertical)*2 + 2px - var(--dex-okd-button-fill-secondary-border-size)*2 + var(--dex-okd-button-lg-line-height) + var(--dex-okd-button-fill-secondary-border-size)*2);
  min-width: 0;
  overflow: hidden;
  padding: 0;
  width: calc(var(--dex-okd-button-lg-padding-vertical)*2 + 2px - var(--dex-okd-button-fill-secondary-border-size)*2 + var(--dex-okd-button-lg-line-height) + var(--dex-okd-button-fill-secondary-border-size)*2)
}

.dex-btn.btn-fill-secondary.btn-lg.dex-btn-strict-circle .btn-content {
  display: block;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  width: 100%
}

.dex-btn.btn-fill-secondary.btn-xl {
  padding: calc(var(--dex-okd-button-xl-padding-vertical) + 1px - var(--dex-okd-button-fill-secondary-border-size)) var(--dex-okd-button-xl-padding-horizontal)
}

.dex-btn.btn-fill-secondary.btn-xl.dex-btn-strict-circle {
  border-radius: 100px;
  height: calc(var(--dex-okd-button-xl-padding-vertical)*2 + 2px - var(--dex-okd-button-fill-secondary-border-size)*2 + var(--dex-okd-button-xl-line-height) + var(--dex-okd-button-fill-secondary-border-size)*2);
  min-width: 0;
  overflow: hidden;
  padding: 0;
  width: calc(var(--dex-okd-button-xl-padding-vertical)*2 + 2px - var(--dex-okd-button-fill-secondary-border-size)*2 + var(--dex-okd-button-xl-line-height) + var(--dex-okd-button-fill-secondary-border-size)*2)
}

.dex-btn.btn-fill-secondary.btn-xl.dex-btn-strict-circle .btn-content {
  display: block;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  width: 100%
}

.dex-btn.btn-fill-tertiary {
  background: var(--dex-okd-button-fill-tertiary-default-background);
  border-color: var(--dex-okd-button-fill-tertiary-default-border-color);
  border-style: solid;
  border-width: var(--dex-okd-button-fill-tertiary-border-size);
  box-shadow: var(--dex-okd-button-fill-tertiary-default-shadow);
  color: var(--dex-okd-button-fill-tertiary-default-font-color)
}

.dex-btn.btn-fill-tertiary.hover,
.dex-btn.btn-fill-tertiary:not(:disabled):not(.btn-disabled):not(.mobile):hover {
  background: var(--dex-okd-button-fill-tertiary-hover-background);
  border-color: var(--dex-okd-button-fill-tertiary-hover-border-color);
  box-shadow: var(--dex-okd-button-fill-tertiary-hover-shadow);
  color: var(--dex-okd-button-fill-tertiary-hover-font-color)
}

.dex-btn.btn-fill-tertiary.hover .btn-icon,
.dex-btn.btn-fill-tertiary:not(:disabled):not(.btn-disabled):not(.mobile):hover .btn-icon {
  color: var(--dex-okd-button-fill-tertiary-hover-icon-color)
}

.dex-btn.btn-fill-tertiary.active,
.dex-btn.btn-fill-tertiary:not(:disabled):active {
  background: var(--dex-okd-button-fill-tertiary-active-background);
  border-color: var(--dex-okd-button-fill-tertiary-active-border-color);
  box-shadow: var(--dex-okd-button-fill-tertiary-active-shadow);
  color: var(--dex-okd-button-fill-tertiary-active-font-color)
}

.dex-btn.btn-fill-tertiary.active .btn-icon,
.dex-btn.btn-fill-tertiary:not(:disabled):active .btn-icon {
  color: var(--dex-okd-button-fill-tertiary-active-icon-color)
}

.dex-btn.btn-fill-tertiary:not(.loading).btn-disabled,
.dex-btn.btn-fill-tertiary:not(.loading):disabled {
  background: var(--dex-okd-button-fill-tertiary-disabled-background);
  border-color: var(--dex-okd-button-fill-tertiary-disabled-border-color);
  box-shadow: var(--dex-okd-button-fill-tertiary-disabled-shadow);
  color: var(--dex-okd-button-fill-tertiary-disabled-font-color)
}

.dex-btn.btn-fill-tertiary:not(.loading).btn-disabled .btn-icon,
.dex-btn.btn-fill-tertiary:not(.loading):disabled .btn-icon {
  color: var(--dex-okd-button-fill-tertiary-disabled-icon-color)
}

.dex-btn.btn-fill-tertiary.loading {
  cursor: pointer
}

.dex-btn.btn-fill-tertiary .btn-icon {
  color: var(--dex-okd-button-fill-tertiary-default-icon-color)
}

.dex-btn.btn-fill-tertiary .dex-btn-loader-text {
  color: var(--dex-okd-button-fill-tertiary-default-font-color)
}

.dex-btn.btn-fill-tertiary.btn-xxs {
  padding: calc(var(--dex-okd-button-xxs-padding-vertical) + 1px - var(--dex-okd-button-fill-tertiary-border-size)) var(--dex-okd-button-xxs-padding-horizontal)
}

.dex-btn.btn-fill-tertiary.btn-xxs.dex-btn-strict-circle {
  border-radius: 100px;
  height: calc(var(--dex-okd-button-xxs-padding-vertical)*2 + 2px - var(--dex-okd-button-fill-tertiary-border-size)*2 + var(--dex-okd-button-xxs-line-height) + var(--dex-okd-button-fill-tertiary-border-size)*2);
  min-width: 0;
  overflow: hidden;
  padding: 0;
  width: calc(var(--dex-okd-button-xxs-padding-vertical)*2 + 2px - var(--dex-okd-button-fill-tertiary-border-size)*2 + var(--dex-okd-button-xxs-line-height) + var(--dex-okd-button-fill-tertiary-border-size)*2)
}

.dex-btn.btn-fill-tertiary.btn-xxs.dex-btn-strict-circle .btn-content {
  display: block;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  width: 100%
}

.dex-btn.btn-fill-tertiary.btn-xs {
  padding: calc(var(--dex-okd-button-xs-padding-vertical) + 1px - var(--dex-okd-button-fill-tertiary-border-size)) var(--dex-okd-button-xs-padding-horizontal)
}

.dex-btn.btn-fill-tertiary.btn-xs.dex-btn-strict-circle {
  border-radius: 100px;
  height: calc(var(--dex-okd-button-xs-padding-vertical)*2 + 2px - var(--dex-okd-button-fill-tertiary-border-size)*2 + var(--dex-okd-button-xs-line-height) + var(--dex-okd-button-fill-tertiary-border-size)*2);
  min-width: 0;
  overflow: hidden;
  padding: 0;
  width: calc(var(--dex-okd-button-xs-padding-vertical)*2 + 2px - var(--dex-okd-button-fill-tertiary-border-size)*2 + var(--dex-okd-button-xs-line-height) + var(--dex-okd-button-fill-tertiary-border-size)*2)
}

.dex-btn.btn-fill-tertiary.btn-xs.dex-btn-strict-circle .btn-content {
  display: block;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  width: 100%
}

.dex-btn.btn-fill-tertiary.btn-s {
  padding: calc(var(--dex-okd-button-s-padding-vertical) + 1px - var(--dex-okd-button-fill-tertiary-border-size)) var(--dex-okd-button-s-padding-horizontal)
}

.dex-btn.btn-fill-tertiary.btn-s.dex-btn-strict-circle {
  border-radius: 100px;
  height: calc(var(--dex-okd-button-s-padding-vertical)*2 + 2px - var(--dex-okd-button-fill-tertiary-border-size)*2 + var(--dex-okd-button-s-line-height) + var(--dex-okd-button-fill-tertiary-border-size)*2);
  min-width: 0;
  overflow: hidden;
  padding: 0;
  width: calc(var(--dex-okd-button-s-padding-vertical)*2 + 2px - var(--dex-okd-button-fill-tertiary-border-size)*2 + var(--dex-okd-button-s-line-height) + var(--dex-okd-button-fill-tertiary-border-size)*2)
}

.dex-btn.btn-fill-tertiary.btn-s.dex-btn-strict-circle .btn-content {
  display: block;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  width: 100%
}

.dex-btn.btn-fill-tertiary.btn-sm {
  padding: calc(var(--dex-okd-button-sm-padding-vertical) + 1px - var(--dex-okd-button-fill-tertiary-border-size)) var(--dex-okd-button-sm-padding-horizontal)
}

.dex-btn.btn-fill-tertiary.btn-sm.dex-btn-strict-circle {
  border-radius: 100px;
  height: calc(var(--dex-okd-button-sm-padding-vertical)*2 + 2px - var(--dex-okd-button-fill-tertiary-border-size)*2 + var(--dex-okd-button-sm-line-height) + var(--dex-okd-button-fill-tertiary-border-size)*2);
  min-width: 0;
  overflow: hidden;
  padding: 0;
  width: calc(var(--dex-okd-button-sm-padding-vertical)*2 + 2px - var(--dex-okd-button-fill-tertiary-border-size)*2 + var(--dex-okd-button-sm-line-height) + var(--dex-okd-button-fill-tertiary-border-size)*2)
}

.dex-btn.btn-fill-tertiary.btn-sm.dex-btn-strict-circle .btn-content {
  display: block;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  width: 100%
}

.dex-btn.btn-fill-tertiary.btn-md {
  padding: calc(var(--dex-okd-button-md-padding-vertical) + 1px - var(--dex-okd-button-fill-tertiary-border-size)) var(--dex-okd-button-md-padding-horizontal)
}

.dex-btn.btn-fill-tertiary.btn-md.dex-btn-strict-circle {
  border-radius: 100px;
  height: calc(var(--dex-okd-button-md-padding-vertical)*2 + 2px - var(--dex-okd-button-fill-tertiary-border-size)*2 + var(--dex-okd-button-md-line-height) + var(--dex-okd-button-fill-tertiary-border-size)*2);
  min-width: 0;
  overflow: hidden;
  padding: 0;
  width: calc(var(--dex-okd-button-md-padding-vertical)*2 + 2px - var(--dex-okd-button-fill-tertiary-border-size)*2 + var(--dex-okd-button-md-line-height) + var(--dex-okd-button-fill-tertiary-border-size)*2)
}

.dex-btn.btn-fill-tertiary.btn-md.dex-btn-strict-circle .btn-content {
  display: block;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  width: 100%
}

.dex-btn.btn-fill-tertiary.btn-lg {
  padding: calc(var(--dex-okd-button-lg-padding-vertical) + 1px - var(--dex-okd-button-fill-tertiary-border-size)) var(--dex-okd-button-lg-padding-horizontal)
}

.dex-btn.btn-fill-tertiary.btn-lg.dex-btn-strict-circle {
  border-radius: 100px;
  height: calc(var(--dex-okd-button-lg-padding-vertical)*2 + 2px - var(--dex-okd-button-fill-tertiary-border-size)*2 + var(--dex-okd-button-lg-line-height) + var(--dex-okd-button-fill-tertiary-border-size)*2);
  min-width: 0;
  overflow: hidden;
  padding: 0;
  width: calc(var(--dex-okd-button-lg-padding-vertical)*2 + 2px - var(--dex-okd-button-fill-tertiary-border-size)*2 + var(--dex-okd-button-lg-line-height) + var(--dex-okd-button-fill-tertiary-border-size)*2)
}

.dex-btn.btn-fill-tertiary.btn-lg.dex-btn-strict-circle .btn-content {
  display: block;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  width: 100%
}

.dex-btn.btn-fill-tertiary.btn-xl {
  padding: calc(var(--dex-okd-button-xl-padding-vertical) + 1px - var(--dex-okd-button-fill-tertiary-border-size)) var(--dex-okd-button-xl-padding-horizontal)
}

.dex-btn.btn-fill-tertiary.btn-xl.dex-btn-strict-circle {
  border-radius: 100px;
  height: calc(var(--dex-okd-button-xl-padding-vertical)*2 + 2px - var(--dex-okd-button-fill-tertiary-border-size)*2 + var(--dex-okd-button-xl-line-height) + var(--dex-okd-button-fill-tertiary-border-size)*2);
  min-width: 0;
  overflow: hidden;
  padding: 0;
  width: calc(var(--dex-okd-button-xl-padding-vertical)*2 + 2px - var(--dex-okd-button-fill-tertiary-border-size)*2 + var(--dex-okd-button-xl-line-height) + var(--dex-okd-button-fill-tertiary-border-size)*2)
}

.dex-btn.btn-fill-tertiary.btn-xl.dex-btn-strict-circle .btn-content {
  display: block;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  width: 100%
}

.dex-btn.btn-fill-quaternary {
  background: var(--dex-okd-button-fill-quaternary-default-background);
  border-color: var(--dex-okd-button-fill-quaternary-default-border-color);
  border-style: solid;
  border-width: var(--dex-okd-button-fill-quaternary-border-size);
  box-shadow: var(--dex-okd-button-fill-quaternary-default-shadow);
  color: var(--dex-okd-button-fill-quaternary-default-font-color)
}

.dex-btn.btn-fill-quaternary.hover,
.dex-btn.btn-fill-quaternary:not(:disabled):not(.btn-disabled):not(.mobile):hover {
  background: var(--dex-okd-button-fill-quaternary-hover-background);
  border-color: var(--dex-okd-button-fill-quaternary-hover-border-color);
  box-shadow: var(--dex-okd-button-fill-quaternary-hover-shadow);
  color: var(--dex-okd-button-fill-quaternary-hover-font-color)
}

.dex-btn.btn-fill-quaternary.hover .btn-icon,
.dex-btn.btn-fill-quaternary:not(:disabled):not(.btn-disabled):not(.mobile):hover .btn-icon {
  color: var(--dex-okd-button-fill-quaternary-hover-icon-color)
}

.dex-btn.btn-fill-quaternary.active,
.dex-btn.btn-fill-quaternary:not(:disabled):active {
  background: var(--dex-okd-button-fill-quaternary-active-background);
  border-color: var(--dex-okd-button-fill-quaternary-active-border-color);
  box-shadow: var(--dex-okd-button-fill-quaternary-active-shadow);
  color: var(--dex-okd-button-fill-quaternary-active-font-color)
}

.dex-btn.btn-fill-quaternary.active .btn-icon,
.dex-btn.btn-fill-quaternary:not(:disabled):active .btn-icon {
  color: var(--dex-okd-button-fill-quaternary-active-icon-color)
}

.dex-btn.btn-fill-quaternary:not(.loading).btn-disabled,
.dex-btn.btn-fill-quaternary:not(.loading):disabled {
  background: var(--dex-okd-button-fill-quaternary-disabled-background);
  border-color: var(--dex-okd-button-fill-quaternary-disabled-border-color);
  box-shadow: var(--dex-okd-button-fill-quaternary-disabled-shadow);
  color: var(--dex-okd-button-fill-quaternary-disabled-font-color)
}

.dex-btn.btn-fill-quaternary:not(.loading).btn-disabled .btn-icon,
.dex-btn.btn-fill-quaternary:not(.loading):disabled .btn-icon {
  color: var(--dex-okd-button-fill-quaternary-disabled-icon-color)
}

.dex-btn.btn-fill-quaternary.loading {
  cursor: pointer
}

.dex-btn.btn-fill-quaternary .btn-icon {
  color: var(--dex-okd-button-fill-quaternary-default-icon-color)
}

.dex-btn.btn-fill-quaternary .dex-btn-loader-text {
  color: var(--dex-okd-button-fill-quaternary-default-font-color)
}

.dex-btn.btn-fill-quaternary.btn-xxs {
  padding: calc(var(--dex-okd-button-xxs-padding-vertical) + 1px - var(--dex-okd-button-fill-quaternary-border-size)) var(--dex-okd-button-xxs-padding-horizontal)
}

.dex-btn.btn-fill-quaternary.btn-xxs.dex-btn-strict-circle {
  border-radius: 100px;
  height: calc(var(--dex-okd-button-xxs-padding-vertical)*2 + 2px - var(--dex-okd-button-fill-quaternary-border-size)*2 + var(--dex-okd-button-xxs-line-height) + var(--dex-okd-button-fill-quaternary-border-size)*2);
  min-width: 0;
  overflow: hidden;
  padding: 0;
  width: calc(var(--dex-okd-button-xxs-padding-vertical)*2 + 2px - var(--dex-okd-button-fill-quaternary-border-size)*2 + var(--dex-okd-button-xxs-line-height) + var(--dex-okd-button-fill-quaternary-border-size)*2)
}

.dex-btn.btn-fill-quaternary.btn-xxs.dex-btn-strict-circle .btn-content {
  display: block;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  width: 100%
}

.dex-btn.btn-fill-quaternary.btn-xs {
  padding: calc(var(--dex-okd-button-xs-padding-vertical) + 1px - var(--dex-okd-button-fill-quaternary-border-size)) var(--dex-okd-button-xs-padding-horizontal)
}

.dex-btn.btn-fill-quaternary.btn-xs.dex-btn-strict-circle {
  border-radius: 100px;
  height: calc(var(--dex-okd-button-xs-padding-vertical)*2 + 2px - var(--dex-okd-button-fill-quaternary-border-size)*2 + var(--dex-okd-button-xs-line-height) + var(--dex-okd-button-fill-quaternary-border-size)*2);
  min-width: 0;
  overflow: hidden;
  padding: 0;
  width: calc(var(--dex-okd-button-xs-padding-vertical)*2 + 2px - var(--dex-okd-button-fill-quaternary-border-size)*2 + var(--dex-okd-button-xs-line-height) + var(--dex-okd-button-fill-quaternary-border-size)*2)
}

.dex-btn.btn-fill-quaternary.btn-xs.dex-btn-strict-circle .btn-content {
  display: block;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  width: 100%
}

.dex-btn.btn-fill-quaternary.btn-s {
  padding: calc(var(--dex-okd-button-s-padding-vertical) + 1px - var(--dex-okd-button-fill-quaternary-border-size)) var(--dex-okd-button-s-padding-horizontal)
}

.dex-btn.btn-fill-quaternary.btn-s.dex-btn-strict-circle {
  border-radius: 100px;
  height: calc(var(--dex-okd-button-s-padding-vertical)*2 + 2px - var(--dex-okd-button-fill-quaternary-border-size)*2 + var(--dex-okd-button-s-line-height) + var(--dex-okd-button-fill-quaternary-border-size)*2);
  min-width: 0;
  overflow: hidden;
  padding: 0;
  width: calc(var(--dex-okd-button-s-padding-vertical)*2 + 2px - var(--dex-okd-button-fill-quaternary-border-size)*2 + var(--dex-okd-button-s-line-height) + var(--dex-okd-button-fill-quaternary-border-size)*2)
}

.dex-btn.btn-fill-quaternary.btn-s.dex-btn-strict-circle .btn-content {
  display: block;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  width: 100%
}

.dex-btn.btn-fill-quaternary.btn-sm {
  padding: calc(var(--dex-okd-button-sm-padding-vertical) + 1px - var(--dex-okd-button-fill-quaternary-border-size)) var(--dex-okd-button-sm-padding-horizontal)
}

.dex-btn.btn-fill-quaternary.btn-sm.dex-btn-strict-circle {
  border-radius: 100px;
  height: calc(var(--dex-okd-button-sm-padding-vertical)*2 + 2px - var(--dex-okd-button-fill-quaternary-border-size)*2 + var(--dex-okd-button-sm-line-height) + var(--dex-okd-button-fill-quaternary-border-size)*2);
  min-width: 0;
  overflow: hidden;
  padding: 0;
  width: calc(var(--dex-okd-button-sm-padding-vertical)*2 + 2px - var(--dex-okd-button-fill-quaternary-border-size)*2 + var(--dex-okd-button-sm-line-height) + var(--dex-okd-button-fill-quaternary-border-size)*2)
}

.dex-btn.btn-fill-quaternary.btn-sm.dex-btn-strict-circle .btn-content {
  display: block;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  width: 100%
}

.dex-btn.btn-fill-quaternary.btn-md {
  padding: calc(var(--dex-okd-button-md-padding-vertical) + 1px - var(--dex-okd-button-fill-quaternary-border-size)) var(--dex-okd-button-md-padding-horizontal)
}

.dex-btn.btn-fill-quaternary.btn-md.dex-btn-strict-circle {
  border-radius: 100px;
  height: calc(var(--dex-okd-button-md-padding-vertical)*2 + 2px - var(--dex-okd-button-fill-quaternary-border-size)*2 + var(--dex-okd-button-md-line-height) + var(--dex-okd-button-fill-quaternary-border-size)*2);
  min-width: 0;
  overflow: hidden;
  padding: 0;
  width: calc(var(--dex-okd-button-md-padding-vertical)*2 + 2px - var(--dex-okd-button-fill-quaternary-border-size)*2 + var(--dex-okd-button-md-line-height) + var(--dex-okd-button-fill-quaternary-border-size)*2)
}

.dex-btn.btn-fill-quaternary.btn-md.dex-btn-strict-circle .btn-content {
  display: block;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  width: 100%
}

.dex-btn.btn-fill-quaternary.btn-lg {
  padding: calc(var(--dex-okd-button-lg-padding-vertical) + 1px - var(--dex-okd-button-fill-quaternary-border-size)) var(--dex-okd-button-lg-padding-horizontal)
}

.dex-btn.btn-fill-quaternary.btn-lg.dex-btn-strict-circle {
  border-radius: 100px;
  height: calc(var(--dex-okd-button-lg-padding-vertical)*2 + 2px - var(--dex-okd-button-fill-quaternary-border-size)*2 + var(--dex-okd-button-lg-line-height) + var(--dex-okd-button-fill-quaternary-border-size)*2);
  min-width: 0;
  overflow: hidden;
  padding: 0;
  width: calc(var(--dex-okd-button-lg-padding-vertical)*2 + 2px - var(--dex-okd-button-fill-quaternary-border-size)*2 + var(--dex-okd-button-lg-line-height) + var(--dex-okd-button-fill-quaternary-border-size)*2)
}

.dex-btn.btn-fill-quaternary.btn-lg.dex-btn-strict-circle .btn-content {
  display: block;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  width: 100%
}

.dex-btn.btn-fill-quaternary.btn-xl {
  padding: calc(var(--dex-okd-button-xl-padding-vertical) + 1px - var(--dex-okd-button-fill-quaternary-border-size)) var(--dex-okd-button-xl-padding-horizontal)
}

.dex-btn.btn-fill-quaternary.btn-xl.dex-btn-strict-circle {
  border-radius: 100px;
  height: calc(var(--dex-okd-button-xl-padding-vertical)*2 + 2px - var(--dex-okd-button-fill-quaternary-border-size)*2 + var(--dex-okd-button-xl-line-height) + var(--dex-okd-button-fill-quaternary-border-size)*2);
  min-width: 0;
  overflow: hidden;
  padding: 0;
  width: calc(var(--dex-okd-button-xl-padding-vertical)*2 + 2px - var(--dex-okd-button-fill-quaternary-border-size)*2 + var(--dex-okd-button-xl-line-height) + var(--dex-okd-button-fill-quaternary-border-size)*2)
}

.dex-btn.btn-fill-quaternary.btn-xl.dex-btn-strict-circle .btn-content {
  display: block;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  width: 100%
}

.dex-btn.btn-fill-red {
  background: var(--dex-okd-button-fill-red-default-background);
  border-color: var(--dex-okd-button-fill-red-default-border-color);
  border-style: solid;
  border-width: var(--dex-okd-button-fill-red-border-size);
  box-shadow: var(--dex-okd-button-fill-red-default-shadow);
  color: var(--dex-okd-button-fill-red-default-font-color)
}

.dex-btn.btn-fill-red.hover,
.dex-btn.btn-fill-red:not(:disabled):not(.btn-disabled):not(.mobile):hover {
  background: var(--dex-okd-button-fill-red-hover-background);
  border-color: var(--dex-okd-button-fill-red-hover-border-color);
  box-shadow: var(--dex-okd-button-fill-red-hover-shadow);
  color: var(--dex-okd-button-fill-red-hover-font-color)
}

.dex-btn.btn-fill-red.hover .btn-icon,
.dex-btn.btn-fill-red:not(:disabled):not(.btn-disabled):not(.mobile):hover .btn-icon {
  color: var(--dex-okd-button-fill-red-hover-icon-color)
}

.dex-btn.btn-fill-red.active,
.dex-btn.btn-fill-red:not(:disabled):active {
  background: var(--dex-okd-button-fill-red-active-background);
  border-color: var(--dex-okd-button-fill-red-active-border-color);
  box-shadow: var(--dex-okd-button-fill-red-active-shadow);
  color: var(--dex-okd-button-fill-red-active-font-color)
}

.dex-btn.btn-fill-red.active .btn-icon,
.dex-btn.btn-fill-red:not(:disabled):active .btn-icon {
  color: var(--dex-okd-button-fill-red-active-icon-color)
}

.dex-btn.btn-fill-red:not(.loading).btn-disabled,
.dex-btn.btn-fill-red:not(.loading):disabled {
  background: var(--dex-okd-button-fill-red-disabled-background);
  border-color: var(--dex-okd-button-fill-red-disabled-border-color);
  box-shadow: var(--dex-okd-button-fill-red-disabled-shadow);
  color: var(--dex-okd-button-fill-red-disabled-font-color)
}

.dex-btn.btn-fill-red:not(.loading).btn-disabled .btn-icon,
.dex-btn.btn-fill-red:not(.loading):disabled .btn-icon {
  color: var(--dex-okd-button-fill-red-disabled-icon-color)
}

.dex-btn.btn-fill-red.loading {
  cursor: pointer
}

.dex-btn.btn-fill-red .btn-icon {
  color: var(--dex-okd-button-fill-red-default-icon-color)
}

.dex-btn.btn-fill-red .dex-btn-loader-text {
  color: var(--dex-okd-button-fill-red-default-font-color)
}

.dex-btn.btn-fill-red.btn-xxs {
  padding: calc(var(--dex-okd-button-xxs-padding-vertical) + 1px - var(--dex-okd-button-fill-red-border-size)) var(--dex-okd-button-xxs-padding-horizontal)
}

.dex-btn.btn-fill-red.btn-xxs.dex-btn-strict-circle {
  border-radius: 100px;
  height: calc(var(--dex-okd-button-xxs-padding-vertical)*2 + 2px - var(--dex-okd-button-fill-red-border-size)*2 + var(--dex-okd-button-xxs-line-height) + var(--dex-okd-button-fill-red-border-size)*2);
  min-width: 0;
  overflow: hidden;
  padding: 0;
  width: calc(var(--dex-okd-button-xxs-padding-vertical)*2 + 2px - var(--dex-okd-button-fill-red-border-size)*2 + var(--dex-okd-button-xxs-line-height) + var(--dex-okd-button-fill-red-border-size)*2)
}

.dex-btn.btn-fill-red.btn-xxs.dex-btn-strict-circle .btn-content {
  display: block;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  width: 100%
}

.dex-btn.btn-fill-red.btn-xs {
  padding: calc(var(--dex-okd-button-xs-padding-vertical) + 1px - var(--dex-okd-button-fill-red-border-size)) var(--dex-okd-button-xs-padding-horizontal)
}

.dex-btn.btn-fill-red.btn-xs.dex-btn-strict-circle {
  border-radius: 100px;
  height: calc(var(--dex-okd-button-xs-padding-vertical)*2 + 2px - var(--dex-okd-button-fill-red-border-size)*2 + var(--dex-okd-button-xs-line-height) + var(--dex-okd-button-fill-red-border-size)*2);
  min-width: 0;
  overflow: hidden;
  padding: 0;
  width: calc(var(--dex-okd-button-xs-padding-vertical)*2 + 2px - var(--dex-okd-button-fill-red-border-size)*2 + var(--dex-okd-button-xs-line-height) + var(--dex-okd-button-fill-red-border-size)*2)
}

.dex-btn.btn-fill-red.btn-xs.dex-btn-strict-circle .btn-content {
  display: block;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  width: 100%
}

.dex-btn.btn-fill-red.btn-s {
  padding: calc(var(--dex-okd-button-s-padding-vertical) + 1px - var(--dex-okd-button-fill-red-border-size)) var(--dex-okd-button-s-padding-horizontal)
}

.dex-btn.btn-fill-red.btn-s.dex-btn-strict-circle {
  border-radius: 100px;
  height: calc(var(--dex-okd-button-s-padding-vertical)*2 + 2px - var(--dex-okd-button-fill-red-border-size)*2 + var(--dex-okd-button-s-line-height) + var(--dex-okd-button-fill-red-border-size)*2);
  min-width: 0;
  overflow: hidden;
  padding: 0;
  width: calc(var(--dex-okd-button-s-padding-vertical)*2 + 2px - var(--dex-okd-button-fill-red-border-size)*2 + var(--dex-okd-button-s-line-height) + var(--dex-okd-button-fill-red-border-size)*2)
}

.dex-btn.btn-fill-red.btn-s.dex-btn-strict-circle .btn-content {
  display: block;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  width: 100%
}

.dex-btn.btn-fill-red.btn-sm {
  padding: calc(var(--dex-okd-button-sm-padding-vertical) + 1px - var(--dex-okd-button-fill-red-border-size)) var(--dex-okd-button-sm-padding-horizontal)
}

.dex-btn.btn-fill-red.btn-sm.dex-btn-strict-circle {
  border-radius: 100px;
  height: calc(var(--dex-okd-button-sm-padding-vertical)*2 + 2px - var(--dex-okd-button-fill-red-border-size)*2 + var(--dex-okd-button-sm-line-height) + var(--dex-okd-button-fill-red-border-size)*2);
  min-width: 0;
  overflow: hidden;
  padding: 0;
  width: calc(var(--dex-okd-button-sm-padding-vertical)*2 + 2px - var(--dex-okd-button-fill-red-border-size)*2 + var(--dex-okd-button-sm-line-height) + var(--dex-okd-button-fill-red-border-size)*2)
}

.dex-btn.btn-fill-red.btn-sm.dex-btn-strict-circle .btn-content {
  display: block;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  width: 100%
}

.dex-btn.btn-fill-red.btn-md {
  padding: calc(var(--dex-okd-button-md-padding-vertical) + 1px - var(--dex-okd-button-fill-red-border-size)) var(--dex-okd-button-md-padding-horizontal)
}

.dex-btn.btn-fill-red.btn-md.dex-btn-strict-circle {
  border-radius: 100px;
  height: calc(var(--dex-okd-button-md-padding-vertical)*2 + 2px - var(--dex-okd-button-fill-red-border-size)*2 + var(--dex-okd-button-md-line-height) + var(--dex-okd-button-fill-red-border-size)*2);
  min-width: 0;
  overflow: hidden;
  padding: 0;
  width: calc(var(--dex-okd-button-md-padding-vertical)*2 + 2px - var(--dex-okd-button-fill-red-border-size)*2 + var(--dex-okd-button-md-line-height) + var(--dex-okd-button-fill-red-border-size)*2)
}

.dex-btn.btn-fill-red.btn-md.dex-btn-strict-circle .btn-content {
  display: block;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  width: 100%
}

.dex-btn.btn-fill-red.btn-lg {
  padding: calc(var(--dex-okd-button-lg-padding-vertical) + 1px - var(--dex-okd-button-fill-red-border-size)) var(--dex-okd-button-lg-padding-horizontal)
}

.dex-btn.btn-fill-red.btn-lg.dex-btn-strict-circle {
  border-radius: 100px;
  height: calc(var(--dex-okd-button-lg-padding-vertical)*2 + 2px - var(--dex-okd-button-fill-red-border-size)*2 + var(--dex-okd-button-lg-line-height) + var(--dex-okd-button-fill-red-border-size)*2);
  min-width: 0;
  overflow: hidden;
  padding: 0;
  width: calc(var(--dex-okd-button-lg-padding-vertical)*2 + 2px - var(--dex-okd-button-fill-red-border-size)*2 + var(--dex-okd-button-lg-line-height) + var(--dex-okd-button-fill-red-border-size)*2)
}

.dex-btn.btn-fill-red.btn-lg.dex-btn-strict-circle .btn-content {
  display: block;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  width: 100%
}

.dex-btn.btn-fill-red.btn-xl {
  padding: calc(var(--dex-okd-button-xl-padding-vertical) + 1px - var(--dex-okd-button-fill-red-border-size)) var(--dex-okd-button-xl-padding-horizontal)
}

.dex-btn.btn-fill-red.btn-xl.dex-btn-strict-circle {
  border-radius: 100px;
  height: calc(var(--dex-okd-button-xl-padding-vertical)*2 + 2px - var(--dex-okd-button-fill-red-border-size)*2 + var(--dex-okd-button-xl-line-height) + var(--dex-okd-button-fill-red-border-size)*2);
  min-width: 0;
  overflow: hidden;
  padding: 0;
  width: calc(var(--dex-okd-button-xl-padding-vertical)*2 + 2px - var(--dex-okd-button-fill-red-border-size)*2 + var(--dex-okd-button-xl-line-height) + var(--dex-okd-button-fill-red-border-size)*2)
}

.dex-btn.btn-fill-red.btn-xl.dex-btn-strict-circle .btn-content {
  display: block;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  width: 100%
}

.dex-btn.btn-fill-green {
  background: var(--dex-okd-button-fill-green-default-background);
  border-color: var(--dex-okd-button-fill-green-default-border-color);
  border-style: solid;
  border-width: var(--dex-okd-button-fill-green-border-size);
  box-shadow: var(--dex-okd-button-fill-green-default-shadow);
  color: var(--dex-okd-button-fill-green-default-font-color)
}

.dex-btn.btn-fill-green.hover,
.dex-btn.btn-fill-green:not(:disabled):not(.btn-disabled):not(.mobile):hover {
  background: var(--dex-okd-button-fill-green-hover-background);
  border-color: var(--dex-okd-button-fill-green-hover-border-color);
  box-shadow: var(--dex-okd-button-fill-green-hover-shadow);
  color: var(--dex-okd-button-fill-green-hover-font-color)
}

.dex-btn.btn-fill-green.hover .btn-icon,
.dex-btn.btn-fill-green:not(:disabled):not(.btn-disabled):not(.mobile):hover .btn-icon {
  color: var(--dex-okd-button-fill-green-hover-icon-color)
}

.dex-btn.btn-fill-green.active,
.dex-btn.btn-fill-green:not(:disabled):active {
  background: var(--dex-okd-button-fill-green-active-background);
  border-color: var(--dex-okd-button-fill-green-active-border-color);
  box-shadow: var(--dex-okd-button-fill-green-active-shadow);
  color: var(--dex-okd-button-fill-green-active-font-color)
}

.dex-btn.btn-fill-green.active .btn-icon,
.dex-btn.btn-fill-green:not(:disabled):active .btn-icon {
  color: var(--dex-okd-button-fill-green-active-icon-color)
}

.dex-btn.btn-fill-green:not(.loading).btn-disabled,
.dex-btn.btn-fill-green:not(.loading):disabled {
  background: var(--dex-okd-button-fill-green-disabled-background);
  border-color: var(--dex-okd-button-fill-green-disabled-border-color);
  box-shadow: var(--dex-okd-button-fill-green-disabled-shadow);
  color: var(--dex-okd-button-fill-green-disabled-font-color)
}

.dex-btn.btn-fill-green:not(.loading).btn-disabled .btn-icon,
.dex-btn.btn-fill-green:not(.loading):disabled .btn-icon {
  color: var(--dex-okd-button-fill-green-disabled-icon-color)
}

.dex-btn.btn-fill-green.loading {
  cursor: pointer
}

.dex-btn.btn-fill-green .btn-icon {
  color: var(--dex-okd-button-fill-green-default-icon-color)
}

.dex-btn.btn-fill-green .dex-btn-loader-text {
  color: var(--dex-okd-button-fill-green-default-font-color)
}

.dex-btn.btn-fill-green.btn-xxs {
  padding: calc(var(--dex-okd-button-xxs-padding-vertical) + 1px - var(--dex-okd-button-fill-green-border-size)) var(--dex-okd-button-xxs-padding-horizontal)
}

.dex-btn.btn-fill-green.btn-xxs.dex-btn-strict-circle {
  border-radius: 100px;
  height: calc(var(--dex-okd-button-xxs-padding-vertical)*2 + 2px - var(--dex-okd-button-fill-green-border-size)*2 + var(--dex-okd-button-xxs-line-height) + var(--dex-okd-button-fill-green-border-size)*2);
  min-width: 0;
  overflow: hidden;
  padding: 0;
  width: calc(var(--dex-okd-button-xxs-padding-vertical)*2 + 2px - var(--dex-okd-button-fill-green-border-size)*2 + var(--dex-okd-button-xxs-line-height) + var(--dex-okd-button-fill-green-border-size)*2)
}

.dex-btn.btn-fill-green.btn-xxs.dex-btn-strict-circle .btn-content {
  display: block;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  width: 100%
}

.dex-btn.btn-fill-green.btn-xs {
  padding: calc(var(--dex-okd-button-xs-padding-vertical) + 1px - var(--dex-okd-button-fill-green-border-size)) var(--dex-okd-button-xs-padding-horizontal)
}

.dex-btn.btn-fill-green.btn-xs.dex-btn-strict-circle {
  border-radius: 100px;
  height: calc(var(--dex-okd-button-xs-padding-vertical)*2 + 2px - var(--dex-okd-button-fill-green-border-size)*2 + var(--dex-okd-button-xs-line-height) + var(--dex-okd-button-fill-green-border-size)*2);
  min-width: 0;
  overflow: hidden;
  padding: 0;
  width: calc(var(--dex-okd-button-xs-padding-vertical)*2 + 2px - var(--dex-okd-button-fill-green-border-size)*2 + var(--dex-okd-button-xs-line-height) + var(--dex-okd-button-fill-green-border-size)*2)
}

.dex-btn.btn-fill-green.btn-xs.dex-btn-strict-circle .btn-content {
  display: block;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  width: 100%
}

.dex-btn.btn-fill-green.btn-s {
  padding: calc(var(--dex-okd-button-s-padding-vertical) + 1px - var(--dex-okd-button-fill-green-border-size)) var(--dex-okd-button-s-padding-horizontal)
}

.dex-btn.btn-fill-green.btn-s.dex-btn-strict-circle {
  border-radius: 100px;
  height: calc(var(--dex-okd-button-s-padding-vertical)*2 + 2px - var(--dex-okd-button-fill-green-border-size)*2 + var(--dex-okd-button-s-line-height) + var(--dex-okd-button-fill-green-border-size)*2);
  min-width: 0;
  overflow: hidden;
  padding: 0;
  width: calc(var(--dex-okd-button-s-padding-vertical)*2 + 2px - var(--dex-okd-button-fill-green-border-size)*2 + var(--dex-okd-button-s-line-height) + var(--dex-okd-button-fill-green-border-size)*2)
}

.dex-btn.btn-fill-green.btn-s.dex-btn-strict-circle .btn-content {
  display: block;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  width: 100%
}

.dex-btn.btn-fill-green.btn-sm {
  padding: calc(var(--dex-okd-button-sm-padding-vertical) + 1px - var(--dex-okd-button-fill-green-border-size)) var(--dex-okd-button-sm-padding-horizontal)
}

.dex-btn.btn-fill-green.btn-sm.dex-btn-strict-circle {
  border-radius: 100px;
  height: calc(var(--dex-okd-button-sm-padding-vertical)*2 + 2px - var(--dex-okd-button-fill-green-border-size)*2 + var(--dex-okd-button-sm-line-height) + var(--dex-okd-button-fill-green-border-size)*2);
  min-width: 0;
  overflow: hidden;
  padding: 0;
  width: calc(var(--dex-okd-button-sm-padding-vertical)*2 + 2px - var(--dex-okd-button-fill-green-border-size)*2 + var(--dex-okd-button-sm-line-height) + var(--dex-okd-button-fill-green-border-size)*2)
}

.dex-btn.btn-fill-green.btn-sm.dex-btn-strict-circle .btn-content {
  display: block;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  width: 100%
}

.dex-btn.btn-fill-green.btn-md {
  padding: calc(var(--dex-okd-button-md-padding-vertical) + 1px - var(--dex-okd-button-fill-green-border-size)) var(--dex-okd-button-md-padding-horizontal)
}

.dex-btn.btn-fill-green.btn-md.dex-btn-strict-circle {
  border-radius: 100px;
  height: calc(var(--dex-okd-button-md-padding-vertical)*2 + 2px - var(--dex-okd-button-fill-green-border-size)*2 + var(--dex-okd-button-md-line-height) + var(--dex-okd-button-fill-green-border-size)*2);
  min-width: 0;
  overflow: hidden;
  padding: 0;
  width: calc(var(--dex-okd-button-md-padding-vertical)*2 + 2px - var(--dex-okd-button-fill-green-border-size)*2 + var(--dex-okd-button-md-line-height) + var(--dex-okd-button-fill-green-border-size)*2)
}

.dex-btn.btn-fill-green.btn-md.dex-btn-strict-circle .btn-content {
  display: block;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  width: 100%
}

.dex-btn.btn-fill-green.btn-lg {
  padding: calc(var(--dex-okd-button-lg-padding-vertical) + 1px - var(--dex-okd-button-fill-green-border-size)) var(--dex-okd-button-lg-padding-horizontal)
}

.dex-btn.btn-fill-green.btn-lg.dex-btn-strict-circle {
  border-radius: 100px;
  height: calc(var(--dex-okd-button-lg-padding-vertical)*2 + 2px - var(--dex-okd-button-fill-green-border-size)*2 + var(--dex-okd-button-lg-line-height) + var(--dex-okd-button-fill-green-border-size)*2);
  min-width: 0;
  overflow: hidden;
  padding: 0;
  width: calc(var(--dex-okd-button-lg-padding-vertical)*2 + 2px - var(--dex-okd-button-fill-green-border-size)*2 + var(--dex-okd-button-lg-line-height) + var(--dex-okd-button-fill-green-border-size)*2)
}

.dex-btn.btn-fill-green.btn-lg.dex-btn-strict-circle .btn-content {
  display: block;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  width: 100%
}

.dex-btn.btn-fill-green.btn-xl {
  padding: calc(var(--dex-okd-button-xl-padding-vertical) + 1px - var(--dex-okd-button-fill-green-border-size)) var(--dex-okd-button-xl-padding-horizontal)
}

.dex-btn.btn-fill-green.btn-xl.dex-btn-strict-circle {
  border-radius: 100px;
  height: calc(var(--dex-okd-button-xl-padding-vertical)*2 + 2px - var(--dex-okd-button-fill-green-border-size)*2 + var(--dex-okd-button-xl-line-height) + var(--dex-okd-button-fill-green-border-size)*2);
  min-width: 0;
  overflow: hidden;
  padding: 0;
  width: calc(var(--dex-okd-button-xl-padding-vertical)*2 + 2px - var(--dex-okd-button-fill-green-border-size)*2 + var(--dex-okd-button-xl-line-height) + var(--dex-okd-button-fill-green-border-size)*2)
}

.dex-btn.btn-fill-green.btn-xl.dex-btn-strict-circle .btn-content {
  display: block;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  width: 100%
}

.dex-btn.btn-fill-grey {
  background: var(--dex-okd-button-fill-grey-default-background);
  border-color: var(--dex-okd-button-fill-grey-default-border-color);
  border-style: solid;
  border-width: var(--dex-okd-button-fill-grey-border-size);
  box-shadow: var(--dex-okd-button-fill-grey-default-shadow);
  color: var(--dex-okd-button-fill-grey-default-font-color)
}

.dex-btn.btn-fill-grey.hover,
.dex-btn.btn-fill-grey:not(:disabled):not(.btn-disabled):not(.mobile):hover {
  background: var(--dex-okd-button-fill-grey-hover-background);
  border-color: var(--dex-okd-button-fill-grey-hover-border-color);
  box-shadow: var(--dex-okd-button-fill-grey-hover-shadow);
  color: var(--dex-okd-button-fill-grey-hover-font-color)
}

.dex-btn.btn-fill-grey.hover .btn-icon,
.dex-btn.btn-fill-grey:not(:disabled):not(.btn-disabled):not(.mobile):hover .btn-icon {
  color: var(--dex-okd-button-fill-grey-hover-icon-color)
}

.dex-btn.btn-fill-grey.active,
.dex-btn.btn-fill-grey:not(:disabled):active {
  background: var(--dex-okd-button-fill-grey-active-background);
  border-color: var(--dex-okd-button-fill-grey-active-border-color);
  box-shadow: var(--dex-okd-button-fill-grey-active-shadow);
  color: var(--dex-okd-button-fill-grey-active-font-color)
}

.dex-btn.btn-fill-grey.active .btn-icon,
.dex-btn.btn-fill-grey:not(:disabled):active .btn-icon {
  color: var(--dex-okd-button-fill-grey-active-icon-color)
}

.dex-btn.btn-fill-grey:not(.loading).btn-disabled,
.dex-btn.btn-fill-grey:not(.loading):disabled {
  background: var(--dex-okd-button-fill-grey-disabled-background);
  border-color: var(--dex-okd-button-fill-grey-disabled-border-color);
  box-shadow: var(--dex-okd-button-fill-grey-disabled-shadow);
  color: var(--dex-okd-button-fill-grey-disabled-font-color)
}

.dex-btn.btn-fill-grey:not(.loading).btn-disabled .btn-icon,
.dex-btn.btn-fill-grey:not(.loading):disabled .btn-icon {
  color: var(--dex-okd-button-fill-grey-disabled-icon-color)
}

.dex-btn.btn-fill-grey.loading {
  cursor: pointer
}

.dex-btn.btn-fill-grey .btn-icon {
  color: var(--dex-okd-button-fill-grey-default-icon-color)
}

.dex-btn.btn-fill-grey .dex-btn-loader-text {
  color: var(--dex-okd-button-fill-grey-default-font-color)
}

.dex-btn.btn-fill-grey.btn-xxs {
  padding: calc(var(--dex-okd-button-xxs-padding-vertical) + 1px - var(--dex-okd-button-fill-grey-border-size)) var(--dex-okd-button-xxs-padding-horizontal)
}

.dex-btn.btn-fill-grey.btn-xxs.dex-btn-strict-circle {
  border-radius: 100px;
  height: calc(var(--dex-okd-button-xxs-padding-vertical)*2 + 2px - var(--dex-okd-button-fill-grey-border-size)*2 + var(--dex-okd-button-xxs-line-height) + var(--dex-okd-button-fill-grey-border-size)*2);
  min-width: 0;
  overflow: hidden;
  padding: 0;
  width: calc(var(--dex-okd-button-xxs-padding-vertical)*2 + 2px - var(--dex-okd-button-fill-grey-border-size)*2 + var(--dex-okd-button-xxs-line-height) + var(--dex-okd-button-fill-grey-border-size)*2)
}

.dex-btn.btn-fill-grey.btn-xxs.dex-btn-strict-circle .btn-content {
  display: block;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  width: 100%
}

.dex-btn.btn-fill-grey.btn-xs {
  padding: calc(var(--dex-okd-button-xs-padding-vertical) + 1px - var(--dex-okd-button-fill-grey-border-size)) var(--dex-okd-button-xs-padding-horizontal)
}

.dex-btn.btn-fill-grey.btn-xs.dex-btn-strict-circle {
  border-radius: 100px;
  height: calc(var(--dex-okd-button-xs-padding-vertical)*2 + 2px - var(--dex-okd-button-fill-grey-border-size)*2 + var(--dex-okd-button-xs-line-height) + var(--dex-okd-button-fill-grey-border-size)*2);
  min-width: 0;
  overflow: hidden;
  padding: 0;
  width: calc(var(--dex-okd-button-xs-padding-vertical)*2 + 2px - var(--dex-okd-button-fill-grey-border-size)*2 + var(--dex-okd-button-xs-line-height) + var(--dex-okd-button-fill-grey-border-size)*2)
}

.dex-btn.btn-fill-grey.btn-xs.dex-btn-strict-circle .btn-content {
  display: block;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  width: 100%
}

.dex-btn.btn-fill-grey.btn-s {
  padding: calc(var(--dex-okd-button-s-padding-vertical) + 1px - var(--dex-okd-button-fill-grey-border-size)) var(--dex-okd-button-s-padding-horizontal)
}

.dex-btn.btn-fill-grey.btn-s.dex-btn-strict-circle {
  border-radius: 100px;
  height: calc(var(--dex-okd-button-s-padding-vertical)*2 + 2px - var(--dex-okd-button-fill-grey-border-size)*2 + var(--dex-okd-button-s-line-height) + var(--dex-okd-button-fill-grey-border-size)*2);
  min-width: 0;
  overflow: hidden;
  padding: 0;
  width: calc(var(--dex-okd-button-s-padding-vertical)*2 + 2px - var(--dex-okd-button-fill-grey-border-size)*2 + var(--dex-okd-button-s-line-height) + var(--dex-okd-button-fill-grey-border-size)*2)
}

.dex-btn.btn-fill-grey.btn-s.dex-btn-strict-circle .btn-content {
  display: block;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  width: 100%
}

.dex-btn.btn-fill-grey.btn-sm {
  padding: calc(var(--dex-okd-button-sm-padding-vertical) + 1px - var(--dex-okd-button-fill-grey-border-size)) var(--dex-okd-button-sm-padding-horizontal)
}

.dex-btn.btn-fill-grey.btn-sm.dex-btn-strict-circle {
  border-radius: 100px;
  height: calc(var(--dex-okd-button-sm-padding-vertical)*2 + 2px - var(--dex-okd-button-fill-grey-border-size)*2 + var(--dex-okd-button-sm-line-height) + var(--dex-okd-button-fill-grey-border-size)*2);
  min-width: 0;
  overflow: hidden;
  padding: 0;
  width: calc(var(--dex-okd-button-sm-padding-vertical)*2 + 2px - var(--dex-okd-button-fill-grey-border-size)*2 + var(--dex-okd-button-sm-line-height) + var(--dex-okd-button-fill-grey-border-size)*2)
}

.dex-btn.btn-fill-grey.btn-sm.dex-btn-strict-circle .btn-content {
  display: block;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  width: 100%
}

.dex-btn.btn-fill-grey.btn-md {
  padding: calc(var(--dex-okd-button-md-padding-vertical) + 1px - var(--dex-okd-button-fill-grey-border-size)) var(--dex-okd-button-md-padding-horizontal)
}

.dex-btn.btn-fill-grey.btn-md.dex-btn-strict-circle {
  border-radius: 100px;
  height: calc(var(--dex-okd-button-md-padding-vertical)*2 + 2px - var(--dex-okd-button-fill-grey-border-size)*2 + var(--dex-okd-button-md-line-height) + var(--dex-okd-button-fill-grey-border-size)*2);
  min-width: 0;
  overflow: hidden;
  padding: 0;
  width: calc(var(--dex-okd-button-md-padding-vertical)*2 + 2px - var(--dex-okd-button-fill-grey-border-size)*2 + var(--dex-okd-button-md-line-height) + var(--dex-okd-button-fill-grey-border-size)*2)
}

.dex-btn.btn-fill-grey.btn-md.dex-btn-strict-circle .btn-content {
  display: block;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  width: 100%
}

.dex-btn.btn-fill-grey.btn-lg {
  padding: calc(var(--dex-okd-button-lg-padding-vertical) + 1px - var(--dex-okd-button-fill-grey-border-size)) var(--dex-okd-button-lg-padding-horizontal)
}

.dex-btn.btn-fill-grey.btn-lg.dex-btn-strict-circle {
  border-radius: 100px;
  height: calc(var(--dex-okd-button-lg-padding-vertical)*2 + 2px - var(--dex-okd-button-fill-grey-border-size)*2 + var(--dex-okd-button-lg-line-height) + var(--dex-okd-button-fill-grey-border-size)*2);
  min-width: 0;
  overflow: hidden;
  padding: 0;
  width: calc(var(--dex-okd-button-lg-padding-vertical)*2 + 2px - var(--dex-okd-button-fill-grey-border-size)*2 + var(--dex-okd-button-lg-line-height) + var(--dex-okd-button-fill-grey-border-size)*2)
}

.dex-btn.btn-fill-grey.btn-lg.dex-btn-strict-circle .btn-content {
  display: block;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  width: 100%
}

.dex-btn.btn-fill-grey.btn-xl {
  padding: calc(var(--dex-okd-button-xl-padding-vertical) + 1px - var(--dex-okd-button-fill-grey-border-size)) var(--dex-okd-button-xl-padding-horizontal)
}

.dex-btn.btn-fill-grey.btn-xl.dex-btn-strict-circle {
  border-radius: 100px;
  height: calc(var(--dex-okd-button-xl-padding-vertical)*2 + 2px - var(--dex-okd-button-fill-grey-border-size)*2 + var(--dex-okd-button-xl-line-height) + var(--dex-okd-button-fill-grey-border-size)*2);
  min-width: 0;
  overflow: hidden;
  padding: 0;
  width: calc(var(--dex-okd-button-xl-padding-vertical)*2 + 2px - var(--dex-okd-button-fill-grey-border-size)*2 + var(--dex-okd-button-xl-line-height) + var(--dex-okd-button-fill-grey-border-size)*2)
}

.dex-btn.btn-fill-grey.btn-xl.dex-btn-strict-circle .btn-content {
  display: block;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  width: 100%
}

.dex-btn.btn-outline-highlight {
  background: var(--dex-okd-button-outline-highlight-default-background);
  border-color: var(--dex-okd-button-outline-highlight-default-border-color);
  border-style: solid;
  border-width: var(--dex-okd-button-outline-highlight-border-size);
  box-shadow: var(--dex-okd-button-outline-highlight-default-shadow);
  color: var(--dex-okd-button-outline-highlight-default-font-color)
}

.dex-btn.btn-outline-highlight.hover,
.dex-btn.btn-outline-highlight:not(:disabled):not(.btn-disabled):not(.mobile):hover {
  background: var(--dex-okd-button-outline-highlight-hover-background);
  border-color: var(--dex-okd-button-outline-highlight-hover-border-color);
  box-shadow: var(--dex-okd-button-outline-highlight-hover-shadow);
  color: var(--dex-okd-button-outline-highlight-hover-font-color)
}

.dex-btn.btn-outline-highlight.hover .btn-icon,
.dex-btn.btn-outline-highlight:not(:disabled):not(.btn-disabled):not(.mobile):hover .btn-icon {
  color: var(--dex-okd-button-outline-highlight-hover-icon-color)
}

.dex-btn.btn-outline-highlight.active,
.dex-btn.btn-outline-highlight:not(:disabled):active {
  background: var(--dex-okd-button-outline-highlight-active-background);
  border-color: var(--dex-okd-button-outline-highlight-active-border-color);
  box-shadow: var(--dex-okd-button-outline-highlight-active-shadow);
  color: var(--dex-okd-button-outline-highlight-active-font-color)
}

.dex-btn.btn-outline-highlight.active .btn-icon,
.dex-btn.btn-outline-highlight:not(:disabled):active .btn-icon {
  color: var(--dex-okd-button-outline-highlight-active-icon-color)
}

.dex-btn.btn-outline-highlight:not(.loading).btn-disabled,
.dex-btn.btn-outline-highlight:not(.loading):disabled {
  background: var(--dex-okd-button-outline-highlight-disabled-background);
  border-color: var(--dex-okd-button-outline-highlight-disabled-border-color);
  box-shadow: var(--dex-okd-button-outline-highlight-disabled-shadow);
  color: var(--dex-okd-button-outline-highlight-disabled-font-color)
}

.dex-btn.btn-outline-highlight:not(.loading).btn-disabled .btn-icon,
.dex-btn.btn-outline-highlight:not(.loading):disabled .btn-icon {
  color: var(--dex-okd-button-outline-highlight-disabled-icon-color)
}

.dex-btn.btn-outline-highlight.loading {
  cursor: pointer
}

.dex-btn.btn-outline-highlight .btn-icon {
  color: var(--dex-okd-button-outline-highlight-default-icon-color)
}

.dex-btn.btn-outline-highlight .dex-btn-loader-text {
  color: var(--dex-okd-button-outline-highlight-default-font-color)
}

.dex-btn.btn-outline-highlight.btn-xxs {
  padding: calc(var(--dex-okd-button-xxs-padding-vertical) + 1px - var(--dex-okd-button-outline-highlight-border-size)) var(--dex-okd-button-xxs-padding-horizontal)
}

.dex-btn.btn-outline-highlight.btn-xxs.dex-btn-strict-circle {
  border-radius: 100px;
  height: calc(var(--dex-okd-button-xxs-padding-vertical)*2 + 2px - var(--dex-okd-button-outline-highlight-border-size)*2 + var(--dex-okd-button-xxs-line-height) + var(--dex-okd-button-outline-highlight-border-size)*2);
  min-width: 0;
  overflow: hidden;
  padding: 0;
  width: calc(var(--dex-okd-button-xxs-padding-vertical)*2 + 2px - var(--dex-okd-button-outline-highlight-border-size)*2 + var(--dex-okd-button-xxs-line-height) + var(--dex-okd-button-outline-highlight-border-size)*2)
}

.dex-btn.btn-outline-highlight.btn-xxs.dex-btn-strict-circle .btn-content {
  display: block;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  width: 100%
}

.dex-btn.btn-outline-highlight.btn-xs {
  padding: calc(var(--dex-okd-button-xs-padding-vertical) + 1px - var(--dex-okd-button-outline-highlight-border-size)) var(--dex-okd-button-xs-padding-horizontal)
}

.dex-btn.btn-outline-highlight.btn-xs.dex-btn-strict-circle {
  border-radius: 100px;
  height: calc(var(--dex-okd-button-xs-padding-vertical)*2 + 2px - var(--dex-okd-button-outline-highlight-border-size)*2 + var(--dex-okd-button-xs-line-height) + var(--dex-okd-button-outline-highlight-border-size)*2);
  min-width: 0;
  overflow: hidden;
  padding: 0;
  width: calc(var(--dex-okd-button-xs-padding-vertical)*2 + 2px - var(--dex-okd-button-outline-highlight-border-size)*2 + var(--dex-okd-button-xs-line-height) + var(--dex-okd-button-outline-highlight-border-size)*2)
}

.dex-btn.btn-outline-highlight.btn-xs.dex-btn-strict-circle .btn-content {
  display: block;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  width: 100%
}

.dex-btn.btn-outline-highlight.btn-s {
  padding: calc(var(--dex-okd-button-s-padding-vertical) + 1px - var(--dex-okd-button-outline-highlight-border-size)) var(--dex-okd-button-s-padding-horizontal)
}

.dex-btn.btn-outline-highlight.btn-s.dex-btn-strict-circle {
  border-radius: 100px;
  height: calc(var(--dex-okd-button-s-padding-vertical)*2 + 2px - var(--dex-okd-button-outline-highlight-border-size)*2 + var(--dex-okd-button-s-line-height) + var(--dex-okd-button-outline-highlight-border-size)*2);
  min-width: 0;
  overflow: hidden;
  padding: 0;
  width: calc(var(--dex-okd-button-s-padding-vertical)*2 + 2px - var(--dex-okd-button-outline-highlight-border-size)*2 + var(--dex-okd-button-s-line-height) + var(--dex-okd-button-outline-highlight-border-size)*2)
}

.dex-btn.btn-outline-highlight.btn-s.dex-btn-strict-circle .btn-content {
  display: block;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  width: 100%
}

.dex-btn.btn-outline-highlight.btn-sm {
  padding: calc(var(--dex-okd-button-sm-padding-vertical) + 1px - var(--dex-okd-button-outline-highlight-border-size)) var(--dex-okd-button-sm-padding-horizontal)
}

.dex-btn.btn-outline-highlight.btn-sm.dex-btn-strict-circle {
  border-radius: 100px;
  height: calc(var(--dex-okd-button-sm-padding-vertical)*2 + 2px - var(--dex-okd-button-outline-highlight-border-size)*2 + var(--dex-okd-button-sm-line-height) + var(--dex-okd-button-outline-highlight-border-size)*2);
  min-width: 0;
  overflow: hidden;
  padding: 0;
  width: calc(var(--dex-okd-button-sm-padding-vertical)*2 + 2px - var(--dex-okd-button-outline-highlight-border-size)*2 + var(--dex-okd-button-sm-line-height) + var(--dex-okd-button-outline-highlight-border-size)*2)
}

.dex-btn.btn-outline-highlight.btn-sm.dex-btn-strict-circle .btn-content {
  display: block;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  width: 100%
}

.dex-btn.btn-outline-highlight.btn-md {
  padding: calc(var(--dex-okd-button-md-padding-vertical) + 1px - var(--dex-okd-button-outline-highlight-border-size)) var(--dex-okd-button-md-padding-horizontal)
}

.dex-btn.btn-outline-highlight.btn-md.dex-btn-strict-circle {
  border-radius: 100px;
  height: calc(var(--dex-okd-button-md-padding-vertical)*2 + 2px - var(--dex-okd-button-outline-highlight-border-size)*2 + var(--dex-okd-button-md-line-height) + var(--dex-okd-button-outline-highlight-border-size)*2);
  min-width: 0;
  overflow: hidden;
  padding: 0;
  width: calc(var(--dex-okd-button-md-padding-vertical)*2 + 2px - var(--dex-okd-button-outline-highlight-border-size)*2 + var(--dex-okd-button-md-line-height) + var(--dex-okd-button-outline-highlight-border-size)*2)
}

.dex-btn.btn-outline-highlight.btn-md.dex-btn-strict-circle .btn-content {
  display: block;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  width: 100%
}

.dex-btn.btn-outline-highlight.btn-lg {
  padding: calc(var(--dex-okd-button-lg-padding-vertical) + 1px - var(--dex-okd-button-outline-highlight-border-size)) var(--dex-okd-button-lg-padding-horizontal)
}

.dex-btn.btn-outline-highlight.btn-lg.dex-btn-strict-circle {
  border-radius: 100px;
  height: calc(var(--dex-okd-button-lg-padding-vertical)*2 + 2px - var(--dex-okd-button-outline-highlight-border-size)*2 + var(--dex-okd-button-lg-line-height) + var(--dex-okd-button-outline-highlight-border-size)*2);
  min-width: 0;
  overflow: hidden;
  padding: 0;
  width: calc(var(--dex-okd-button-lg-padding-vertical)*2 + 2px - var(--dex-okd-button-outline-highlight-border-size)*2 + var(--dex-okd-button-lg-line-height) + var(--dex-okd-button-outline-highlight-border-size)*2)
}

.dex-btn.btn-outline-highlight.btn-lg.dex-btn-strict-circle .btn-content {
  display: block;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  width: 100%
}

.dex-btn.btn-outline-highlight.btn-xl {
  padding: calc(var(--dex-okd-button-xl-padding-vertical) + 1px - var(--dex-okd-button-outline-highlight-border-size)) var(--dex-okd-button-xl-padding-horizontal)
}

.dex-btn.btn-outline-highlight.btn-xl.dex-btn-strict-circle {
  border-radius: 100px;
  height: calc(var(--dex-okd-button-xl-padding-vertical)*2 + 2px - var(--dex-okd-button-outline-highlight-border-size)*2 + var(--dex-okd-button-xl-line-height) + var(--dex-okd-button-outline-highlight-border-size)*2);
  min-width: 0;
  overflow: hidden;
  padding: 0;
  width: calc(var(--dex-okd-button-xl-padding-vertical)*2 + 2px - var(--dex-okd-button-outline-highlight-border-size)*2 + var(--dex-okd-button-xl-line-height) + var(--dex-okd-button-outline-highlight-border-size)*2)
}

.dex-btn.btn-outline-highlight.btn-xl.dex-btn-strict-circle .btn-content {
  display: block;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  width: 100%
}

.dex-btn.btn-outline-primary {
  background: var(--dex-okd-button-outline-primary-default-background);
  border-color: var(--dex-okd-button-outline-primary-default-border-color);
  border-style: solid;
  border-width: var(--dex-okd-button-outline-primary-border-size);
  box-shadow: var(--dex-okd-button-outline-primary-default-shadow);
  color: var(--dex-okd-button-outline-primary-default-font-color)
}

.dex-btn.btn-outline-primary.hover,
.dex-btn.btn-outline-primary:not(:disabled):not(.btn-disabled):not(.mobile):hover {
  background: var(--dex-okd-button-outline-primary-hover-background);
  border-color: var(--dex-okd-button-outline-primary-hover-border-color);
  box-shadow: var(--dex-okd-button-outline-primary-hover-shadow);
  color: var(--dex-okd-button-outline-primary-hover-font-color)
}

.dex-btn.btn-outline-primary.hover .btn-icon,
.dex-btn.btn-outline-primary:not(:disabled):not(.btn-disabled):not(.mobile):hover .btn-icon {
  color: var(--dex-okd-button-outline-primary-hover-icon-color)
}

.dex-btn.btn-outline-primary.active,
.dex-btn.btn-outline-primary:not(:disabled):active {
  background: var(--dex-okd-button-outline-primary-active-background);
  border-color: var(--dex-okd-button-outline-primary-active-border-color);
  box-shadow: var(--dex-okd-button-outline-primary-active-shadow);
  color: var(--dex-okd-button-outline-primary-active-font-color)
}

.dex-btn.btn-outline-primary.active .btn-icon,
.dex-btn.btn-outline-primary:not(:disabled):active .btn-icon {
  color: var(--dex-okd-button-outline-primary-active-icon-color)
}

.dex-btn.btn-outline-primary:not(.loading).btn-disabled,
.dex-btn.btn-outline-primary:not(.loading):disabled {
  background: var(--dex-okd-button-outline-primary-disabled-background);
  border-color: var(--dex-okd-button-outline-primary-disabled-border-color);
  box-shadow: var(--dex-okd-button-outline-primary-disabled-shadow);
  color: var(--dex-okd-button-outline-primary-disabled-font-color)
}

.dex-btn.btn-outline-primary:not(.loading).btn-disabled .btn-icon,
.dex-btn.btn-outline-primary:not(.loading):disabled .btn-icon {
  color: var(--dex-okd-button-outline-primary-disabled-icon-color)
}

.dex-btn.btn-outline-primary.loading {
  cursor: pointer
}

.dex-btn.btn-outline-primary .btn-icon {
  color: var(--dex-okd-button-outline-primary-default-icon-color)
}

.dex-btn.btn-outline-primary .dex-btn-loader-text {
  color: var(--dex-okd-button-outline-primary-default-font-color)
}

.dex-btn.btn-outline-primary.btn-xxs {
  padding: calc(var(--dex-okd-button-xxs-padding-vertical) + 1px - var(--dex-okd-button-outline-primary-border-size)) var(--dex-okd-button-xxs-padding-horizontal)
}

.dex-btn.btn-outline-primary.btn-xxs.dex-btn-strict-circle {
  border-radius: 100px;
  height: calc(var(--dex-okd-button-xxs-padding-vertical)*2 + 2px - var(--dex-okd-button-outline-primary-border-size)*2 + var(--dex-okd-button-xxs-line-height) + var(--dex-okd-button-outline-primary-border-size)*2);
  min-width: 0;
  overflow: hidden;
  padding: 0;
  width: calc(var(--dex-okd-button-xxs-padding-vertical)*2 + 2px - var(--dex-okd-button-outline-primary-border-size)*2 + var(--dex-okd-button-xxs-line-height) + var(--dex-okd-button-outline-primary-border-size)*2)
}

.dex-btn.btn-outline-primary.btn-xxs.dex-btn-strict-circle .btn-content {
  display: block;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  width: 100%
}

.dex-btn.btn-outline-primary.btn-xs {
  padding: calc(var(--dex-okd-button-xs-padding-vertical) + 1px - var(--dex-okd-button-outline-primary-border-size)) var(--dex-okd-button-xs-padding-horizontal)
}

.dex-btn.btn-outline-primary.btn-xs.dex-btn-strict-circle {
  border-radius: 100px;
  height: calc(var(--dex-okd-button-xs-padding-vertical)*2 + 2px - var(--dex-okd-button-outline-primary-border-size)*2 + var(--dex-okd-button-xs-line-height) + var(--dex-okd-button-outline-primary-border-size)*2);
  min-width: 0;
  overflow: hidden;
  padding: 0;
  width: calc(var(--dex-okd-button-xs-padding-vertical)*2 + 2px - var(--dex-okd-button-outline-primary-border-size)*2 + var(--dex-okd-button-xs-line-height) + var(--dex-okd-button-outline-primary-border-size)*2)
}

.dex-btn.btn-outline-primary.btn-xs.dex-btn-strict-circle .btn-content {
  display: block;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  width: 100%
}

.dex-btn.btn-outline-primary.btn-s {
  padding: calc(var(--dex-okd-button-s-padding-vertical) + 1px - var(--dex-okd-button-outline-primary-border-size)) var(--dex-okd-button-s-padding-horizontal)
}

.dex-btn.btn-outline-primary.btn-s.dex-btn-strict-circle {
  border-radius: 100px;
  height: calc(var(--dex-okd-button-s-padding-vertical)*2 + 2px - var(--dex-okd-button-outline-primary-border-size)*2 + var(--dex-okd-button-s-line-height) + var(--dex-okd-button-outline-primary-border-size)*2);
  min-width: 0;
  overflow: hidden;
  padding: 0;
  width: calc(var(--dex-okd-button-s-padding-vertical)*2 + 2px - var(--dex-okd-button-outline-primary-border-size)*2 + var(--dex-okd-button-s-line-height) + var(--dex-okd-button-outline-primary-border-size)*2)
}

.dex-btn.btn-outline-primary.btn-s.dex-btn-strict-circle .btn-content {
  display: block;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  width: 100%
}

.dex-btn.btn-outline-primary.btn-sm {
  padding: calc(var(--dex-okd-button-sm-padding-vertical) + 1px - var(--dex-okd-button-outline-primary-border-size)) var(--dex-okd-button-sm-padding-horizontal)
}

.dex-btn.btn-outline-primary.btn-sm.dex-btn-strict-circle {
  border-radius: 100px;
  height: calc(var(--dex-okd-button-sm-padding-vertical)*2 + 2px - var(--dex-okd-button-outline-primary-border-size)*2 + var(--dex-okd-button-sm-line-height) + var(--dex-okd-button-outline-primary-border-size)*2);
  min-width: 0;
  overflow: hidden;
  padding: 0;
  width: calc(var(--dex-okd-button-sm-padding-vertical)*2 + 2px - var(--dex-okd-button-outline-primary-border-size)*2 + var(--dex-okd-button-sm-line-height) + var(--dex-okd-button-outline-primary-border-size)*2)
}

.dex-btn.btn-outline-primary.btn-sm.dex-btn-strict-circle .btn-content {
  display: block;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  width: 100%
}

.dex-btn.btn-outline-primary.btn-md {
  padding: calc(var(--dex-okd-button-md-padding-vertical) + 1px - var(--dex-okd-button-outline-primary-border-size)) var(--dex-okd-button-md-padding-horizontal)
}

.dex-btn.btn-outline-primary.btn-md.dex-btn-strict-circle {
  border-radius: 100px;
  height: calc(var(--dex-okd-button-md-padding-vertical)*2 + 2px - var(--dex-okd-button-outline-primary-border-size)*2 + var(--dex-okd-button-md-line-height) + var(--dex-okd-button-outline-primary-border-size)*2);
  min-width: 0;
  overflow: hidden;
  padding: 0;
  width: calc(var(--dex-okd-button-md-padding-vertical)*2 + 2px - var(--dex-okd-button-outline-primary-border-size)*2 + var(--dex-okd-button-md-line-height) + var(--dex-okd-button-outline-primary-border-size)*2)
}

.dex-btn.btn-outline-primary.btn-md.dex-btn-strict-circle .btn-content {
  display: block;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  width: 100%
}

.dex-btn.btn-outline-primary.btn-lg {
  padding: calc(var(--dex-okd-button-lg-padding-vertical) + 1px - var(--dex-okd-button-outline-primary-border-size)) var(--dex-okd-button-lg-padding-horizontal)
}

.dex-btn.btn-outline-primary.btn-lg.dex-btn-strict-circle {
  border-radius: 100px;
  height: calc(var(--dex-okd-button-lg-padding-vertical)*2 + 2px - var(--dex-okd-button-outline-primary-border-size)*2 + var(--dex-okd-button-lg-line-height) + var(--dex-okd-button-outline-primary-border-size)*2);
  min-width: 0;
  overflow: hidden;
  padding: 0;
  width: calc(var(--dex-okd-button-lg-padding-vertical)*2 + 2px - var(--dex-okd-button-outline-primary-border-size)*2 + var(--dex-okd-button-lg-line-height) + var(--dex-okd-button-outline-primary-border-size)*2)
}

.dex-btn.btn-outline-primary.btn-lg.dex-btn-strict-circle .btn-content {
  display: block;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  width: 100%
}

.dex-btn.btn-outline-primary.btn-xl {
  padding: calc(var(--dex-okd-button-xl-padding-vertical) + 1px - var(--dex-okd-button-outline-primary-border-size)) var(--dex-okd-button-xl-padding-horizontal)
}

.dex-btn.btn-outline-primary.btn-xl.dex-btn-strict-circle {
  border-radius: 100px;
  height: calc(var(--dex-okd-button-xl-padding-vertical)*2 + 2px - var(--dex-okd-button-outline-primary-border-size)*2 + var(--dex-okd-button-xl-line-height) + var(--dex-okd-button-outline-primary-border-size)*2);
  min-width: 0;
  overflow: hidden;
  padding: 0;
  width: calc(var(--dex-okd-button-xl-padding-vertical)*2 + 2px - var(--dex-okd-button-outline-primary-border-size)*2 + var(--dex-okd-button-xl-line-height) + var(--dex-okd-button-outline-primary-border-size)*2)
}

.dex-btn.btn-outline-primary.btn-xl.dex-btn-strict-circle .btn-content {
  display: block;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  width: 100%
}

.dex-btn.btn-outline-secondary {
  background: var(--dex-okd-button-outline-secondary-default-background);
  border-color: var(--dex-okd-button-outline-secondary-default-border-color);
  border-style: solid;
  border-width: var(--dex-okd-button-outline-secondary-border-size);
  box-shadow: var(--dex-okd-button-outline-secondary-default-shadow);
  color: var(--dex-okd-button-outline-secondary-default-font-color)
}

.dex-btn.btn-outline-secondary.hover,
.dex-btn.btn-outline-secondary:not(:disabled):not(.btn-disabled):not(.mobile):hover {
  background: var(--dex-okd-button-outline-secondary-hover-background);
  border-color: var(--dex-okd-button-outline-secondary-hover-border-color);
  box-shadow: var(--dex-okd-button-outline-secondary-hover-shadow);
  color: var(--dex-okd-button-outline-secondary-hover-font-color)
}

.dex-btn.btn-outline-secondary.hover .btn-icon,
.dex-btn.btn-outline-secondary:not(:disabled):not(.btn-disabled):not(.mobile):hover .btn-icon {
  color: var(--dex-okd-button-outline-secondary-hover-icon-color)
}

.dex-btn.btn-outline-secondary.active,
.dex-btn.btn-outline-secondary:not(:disabled):active {
  background: var(--dex-okd-button-outline-secondary-active-background);
  border-color: var(--dex-okd-button-outline-secondary-active-border-color);
  box-shadow: var(--dex-okd-button-outline-secondary-active-shadow);
  color: var(--dex-okd-button-outline-secondary-active-font-color)
}

.dex-btn.btn-outline-secondary.active .btn-icon,
.dex-btn.btn-outline-secondary:not(:disabled):active .btn-icon {
  color: var(--dex-okd-button-outline-secondary-active-icon-color)
}

.dex-btn.btn-outline-secondary:not(.loading).btn-disabled,
.dex-btn.btn-outline-secondary:not(.loading):disabled {
  background: var(--dex-okd-button-outline-secondary-disabled-background);
  border-color: var(--dex-okd-button-outline-secondary-disabled-border-color);
  box-shadow: var(--dex-okd-button-outline-secondary-disabled-shadow);
  color: var(--dex-okd-button-outline-secondary-disabled-font-color)
}

.dex-btn.btn-outline-secondary:not(.loading).btn-disabled .btn-icon,
.dex-btn.btn-outline-secondary:not(.loading):disabled .btn-icon {
  color: var(--dex-okd-button-outline-secondary-disabled-icon-color)
}

.dex-btn.btn-outline-secondary.loading {
  cursor: pointer
}

.dex-btn.btn-outline-secondary .btn-icon {
  color: var(--dex-okd-button-outline-secondary-default-icon-color)
}

.dex-btn.btn-outline-secondary .dex-btn-loader-text {
  color: var(--dex-okd-button-outline-secondary-default-font-color)
}

.dex-btn.btn-outline-secondary.btn-xxs {
  padding: calc(var(--dex-okd-button-xxs-padding-vertical) + 1px - var(--dex-okd-button-outline-secondary-border-size)) var(--dex-okd-button-xxs-padding-horizontal)
}

.dex-btn.btn-outline-secondary.btn-xxs.dex-btn-strict-circle {
  border-radius: 100px;
  height: calc(var(--dex-okd-button-xxs-padding-vertical)*2 + 2px - var(--dex-okd-button-outline-secondary-border-size)*2 + var(--dex-okd-button-xxs-line-height) + var(--dex-okd-button-outline-secondary-border-size)*2);
  min-width: 0;
  overflow: hidden;
  padding: 0;
  width: calc(var(--dex-okd-button-xxs-padding-vertical)*2 + 2px - var(--dex-okd-button-outline-secondary-border-size)*2 + var(--dex-okd-button-xxs-line-height) + var(--dex-okd-button-outline-secondary-border-size)*2)
}

.dex-btn.btn-outline-secondary.btn-xxs.dex-btn-strict-circle .btn-content {
  display: block;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  width: 100%
}

.dex-btn.btn-outline-secondary.btn-xs {
  padding: calc(var(--dex-okd-button-xs-padding-vertical) + 1px - var(--dex-okd-button-outline-secondary-border-size)) var(--dex-okd-button-xs-padding-horizontal)
}

.dex-btn.btn-outline-secondary.btn-xs.dex-btn-strict-circle {
  border-radius: 100px;
  height: calc(var(--dex-okd-button-xs-padding-vertical)*2 + 2px - var(--dex-okd-button-outline-secondary-border-size)*2 + var(--dex-okd-button-xs-line-height) + var(--dex-okd-button-outline-secondary-border-size)*2);
  min-width: 0;
  overflow: hidden;
  padding: 0;
  width: calc(var(--dex-okd-button-xs-padding-vertical)*2 + 2px - var(--dex-okd-button-outline-secondary-border-size)*2 + var(--dex-okd-button-xs-line-height) + var(--dex-okd-button-outline-secondary-border-size)*2)
}

.dex-btn.btn-outline-secondary.btn-xs.dex-btn-strict-circle .btn-content {
  display: block;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  width: 100%
}

.dex-btn.btn-outline-secondary.btn-s {
  padding: calc(var(--dex-okd-button-s-padding-vertical) + 1px - var(--dex-okd-button-outline-secondary-border-size)) var(--dex-okd-button-s-padding-horizontal)
}

.dex-btn.btn-outline-secondary.btn-s.dex-btn-strict-circle {
  border-radius: 100px;
  height: calc(var(--dex-okd-button-s-padding-vertical)*2 + 2px - var(--dex-okd-button-outline-secondary-border-size)*2 + var(--dex-okd-button-s-line-height) + var(--dex-okd-button-outline-secondary-border-size)*2);
  min-width: 0;
  overflow: hidden;
  padding: 0;
  width: calc(var(--dex-okd-button-s-padding-vertical)*2 + 2px - var(--dex-okd-button-outline-secondary-border-size)*2 + var(--dex-okd-button-s-line-height) + var(--dex-okd-button-outline-secondary-border-size)*2)
}

.dex-btn.btn-outline-secondary.btn-s.dex-btn-strict-circle .btn-content {
  display: block;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  width: 100%
}

.dex-btn.btn-outline-secondary.btn-sm {
  padding: calc(var(--dex-okd-button-sm-padding-vertical) + 1px - var(--dex-okd-button-outline-secondary-border-size)) var(--dex-okd-button-sm-padding-horizontal)
}

.dex-btn.btn-outline-secondary.btn-sm.dex-btn-strict-circle {
  border-radius: 100px;
  height: calc(var(--dex-okd-button-sm-padding-vertical)*2 + 2px - var(--dex-okd-button-outline-secondary-border-size)*2 + var(--dex-okd-button-sm-line-height) + var(--dex-okd-button-outline-secondary-border-size)*2);
  min-width: 0;
  overflow: hidden;
  padding: 0;
  width: calc(var(--dex-okd-button-sm-padding-vertical)*2 + 2px - var(--dex-okd-button-outline-secondary-border-size)*2 + var(--dex-okd-button-sm-line-height) + var(--dex-okd-button-outline-secondary-border-size)*2)
}

.dex-btn.btn-outline-secondary.btn-sm.dex-btn-strict-circle .btn-content {
  display: block;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  width: 100%
}

.dex-btn.btn-outline-secondary.btn-md {
  padding: calc(var(--dex-okd-button-md-padding-vertical) + 1px - var(--dex-okd-button-outline-secondary-border-size)) var(--dex-okd-button-md-padding-horizontal)
}

.dex-btn.btn-outline-secondary.btn-md.dex-btn-strict-circle {
  border-radius: 100px;
  height: calc(var(--dex-okd-button-md-padding-vertical)*2 + 2px - var(--dex-okd-button-outline-secondary-border-size)*2 + var(--dex-okd-button-md-line-height) + var(--dex-okd-button-outline-secondary-border-size)*2);
  min-width: 0;
  overflow: hidden;
  padding: 0;
  width: calc(var(--dex-okd-button-md-padding-vertical)*2 + 2px - var(--dex-okd-button-outline-secondary-border-size)*2 + var(--dex-okd-button-md-line-height) + var(--dex-okd-button-outline-secondary-border-size)*2)
}

.dex-btn.btn-outline-secondary.btn-md.dex-btn-strict-circle .btn-content {
  display: block;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  width: 100%
}

.dex-btn.btn-outline-secondary.btn-lg {
  padding: calc(var(--dex-okd-button-lg-padding-vertical) + 1px - var(--dex-okd-button-outline-secondary-border-size)) var(--dex-okd-button-lg-padding-horizontal)
}

.dex-btn.btn-outline-secondary.btn-lg.dex-btn-strict-circle {
  border-radius: 100px;
  height: calc(var(--dex-okd-button-lg-padding-vertical)*2 + 2px - var(--dex-okd-button-outline-secondary-border-size)*2 + var(--dex-okd-button-lg-line-height) + var(--dex-okd-button-outline-secondary-border-size)*2);
  min-width: 0;
  overflow: hidden;
  padding: 0;
  width: calc(var(--dex-okd-button-lg-padding-vertical)*2 + 2px - var(--dex-okd-button-outline-secondary-border-size)*2 + var(--dex-okd-button-lg-line-height) + var(--dex-okd-button-outline-secondary-border-size)*2)
}

.dex-btn.btn-outline-secondary.btn-lg.dex-btn-strict-circle .btn-content {
  display: block;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  width: 100%
}

.dex-btn.btn-outline-secondary.btn-xl {
  padding: calc(var(--dex-okd-button-xl-padding-vertical) + 1px - var(--dex-okd-button-outline-secondary-border-size)) var(--dex-okd-button-xl-padding-horizontal)
}

.dex-btn.btn-outline-secondary.btn-xl.dex-btn-strict-circle {
  border-radius: 100px;
  height: calc(var(--dex-okd-button-xl-padding-vertical)*2 + 2px - var(--dex-okd-button-outline-secondary-border-size)*2 + var(--dex-okd-button-xl-line-height) + var(--dex-okd-button-outline-secondary-border-size)*2);
  min-width: 0;
  overflow: hidden;
  padding: 0;
  width: calc(var(--dex-okd-button-xl-padding-vertical)*2 + 2px - var(--dex-okd-button-outline-secondary-border-size)*2 + var(--dex-okd-button-xl-line-height) + var(--dex-okd-button-outline-secondary-border-size)*2)
}

.dex-btn.btn-outline-secondary.btn-xl.dex-btn-strict-circle .btn-content {
  display: block;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  width: 100%
}

.dex-btn.btn-outline-tertiary {
  background: var(--dex-okd-button-outline-tertiary-default-background);
  border-color: var(--dex-okd-button-outline-tertiary-default-border-color);
  border-style: solid;
  border-width: var(--dex-okd-button-outline-tertiary-border-size);
  box-shadow: var(--dex-okd-button-outline-tertiary-default-shadow);
  color: var(--dex-okd-button-outline-tertiary-default-font-color)
}

.dex-btn.btn-outline-tertiary.hover,
.dex-btn.btn-outline-tertiary:not(:disabled):not(.btn-disabled):not(.mobile):hover {
  background: var(--dex-okd-button-outline-tertiary-hover-background);
  border-color: var(--dex-okd-button-outline-tertiary-hover-border-color);
  box-shadow: var(--dex-okd-button-outline-tertiary-hover-shadow);
  color: var(--dex-okd-button-outline-tertiary-hover-font-color)
}

.dex-btn.btn-outline-tertiary.hover .btn-icon,
.dex-btn.btn-outline-tertiary:not(:disabled):not(.btn-disabled):not(.mobile):hover .btn-icon {
  color: var(--dex-okd-button-outline-tertiary-hover-icon-color)
}

.dex-btn.btn-outline-tertiary.active,
.dex-btn.btn-outline-tertiary:not(:disabled):active {
  background: var(--dex-okd-button-outline-tertiary-active-background);
  border-color: var(--dex-okd-button-outline-tertiary-active-border-color);
  box-shadow: var(--dex-okd-button-outline-tertiary-active-shadow);
  color: var(--dex-okd-button-outline-tertiary-active-font-color)
}

.dex-btn.btn-outline-tertiary.active .btn-icon,
.dex-btn.btn-outline-tertiary:not(:disabled):active .btn-icon {
  color: var(--dex-okd-button-outline-tertiary-active-icon-color)
}

.dex-btn.btn-outline-tertiary:not(.loading).btn-disabled,
.dex-btn.btn-outline-tertiary:not(.loading):disabled {
  background: var(--dex-okd-button-outline-tertiary-disabled-background);
  border-color: var(--dex-okd-button-outline-tertiary-disabled-border-color);
  box-shadow: var(--dex-okd-button-outline-tertiary-disabled-shadow);
  color: var(--dex-okd-button-outline-tertiary-disabled-font-color)
}

.dex-btn.btn-outline-tertiary:not(.loading).btn-disabled .btn-icon,
.dex-btn.btn-outline-tertiary:not(.loading):disabled .btn-icon {
  color: var(--dex-okd-button-outline-tertiary-disabled-icon-color)
}

.dex-btn.btn-outline-tertiary.loading {
  cursor: pointer
}

.dex-btn.btn-outline-tertiary .btn-icon {
  color: var(--dex-okd-button-outline-tertiary-default-icon-color)
}

.dex-btn.btn-outline-tertiary .dex-btn-loader-text {
  color: var(--dex-okd-button-outline-tertiary-default-font-color)
}

.dex-btn.btn-outline-tertiary.btn-xxs {
  padding: calc(var(--dex-okd-button-xxs-padding-vertical) + 1px - var(--dex-okd-button-outline-tertiary-border-size)) var(--dex-okd-button-xxs-padding-horizontal)
}

.dex-btn.btn-outline-tertiary.btn-xxs.dex-btn-strict-circle {
  border-radius: 100px;
  height: calc(var(--dex-okd-button-xxs-padding-vertical)*2 + 2px - var(--dex-okd-button-outline-tertiary-border-size)*2 + var(--dex-okd-button-xxs-line-height) + var(--dex-okd-button-outline-tertiary-border-size)*2);
  min-width: 0;
  overflow: hidden;
  padding: 0;
  width: calc(var(--dex-okd-button-xxs-padding-vertical)*2 + 2px - var(--dex-okd-button-outline-tertiary-border-size)*2 + var(--dex-okd-button-xxs-line-height) + var(--dex-okd-button-outline-tertiary-border-size)*2)
}

.dex-btn.btn-outline-tertiary.btn-xxs.dex-btn-strict-circle .btn-content {
  display: block;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  width: 100%
}

.dex-btn.btn-outline-tertiary.btn-xs {
  padding: calc(var(--dex-okd-button-xs-padding-vertical) + 1px - var(--dex-okd-button-outline-tertiary-border-size)) var(--dex-okd-button-xs-padding-horizontal)
}

.dex-btn.btn-outline-tertiary.btn-xs.dex-btn-strict-circle {
  border-radius: 100px;
  height: calc(var(--dex-okd-button-xs-padding-vertical)*2 + 2px - var(--dex-okd-button-outline-tertiary-border-size)*2 + var(--dex-okd-button-xs-line-height) + var(--dex-okd-button-outline-tertiary-border-size)*2);
  min-width: 0;
  overflow: hidden;
  padding: 0;
  width: calc(var(--dex-okd-button-xs-padding-vertical)*2 + 2px - var(--dex-okd-button-outline-tertiary-border-size)*2 + var(--dex-okd-button-xs-line-height) + var(--dex-okd-button-outline-tertiary-border-size)*2)
}

.dex-btn.btn-outline-tertiary.btn-xs.dex-btn-strict-circle .btn-content {
  display: block;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  width: 100%
}

.dex-btn.btn-outline-tertiary.btn-s {
  padding: calc(var(--dex-okd-button-s-padding-vertical) + 1px - var(--dex-okd-button-outline-tertiary-border-size)) var(--dex-okd-button-s-padding-horizontal)
}

.dex-btn.btn-outline-tertiary.btn-s.dex-btn-strict-circle {
  border-radius: 100px;
  height: calc(var(--dex-okd-button-s-padding-vertical)*2 + 2px - var(--dex-okd-button-outline-tertiary-border-size)*2 + var(--dex-okd-button-s-line-height) + var(--dex-okd-button-outline-tertiary-border-size)*2);
  min-width: 0;
  overflow: hidden;
  padding: 0;
  width: calc(var(--dex-okd-button-s-padding-vertical)*2 + 2px - var(--dex-okd-button-outline-tertiary-border-size)*2 + var(--dex-okd-button-s-line-height) + var(--dex-okd-button-outline-tertiary-border-size)*2)
}

.dex-btn.btn-outline-tertiary.btn-s.dex-btn-strict-circle .btn-content {
  display: block;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  width: 100%
}

.dex-btn.btn-outline-tertiary.btn-sm {
  padding: calc(var(--dex-okd-button-sm-padding-vertical) + 1px - var(--dex-okd-button-outline-tertiary-border-size)) var(--dex-okd-button-sm-padding-horizontal)
}

.dex-btn.btn-outline-tertiary.btn-sm.dex-btn-strict-circle {
  border-radius: 100px;
  height: calc(var(--dex-okd-button-sm-padding-vertical)*2 + 2px - var(--dex-okd-button-outline-tertiary-border-size)*2 + var(--dex-okd-button-sm-line-height) + var(--dex-okd-button-outline-tertiary-border-size)*2);
  min-width: 0;
  overflow: hidden;
  padding: 0;
  width: calc(var(--dex-okd-button-sm-padding-vertical)*2 + 2px - var(--dex-okd-button-outline-tertiary-border-size)*2 + var(--dex-okd-button-sm-line-height) + var(--dex-okd-button-outline-tertiary-border-size)*2)
}

.dex-btn.btn-outline-tertiary.btn-sm.dex-btn-strict-circle .btn-content {
  display: block;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  width: 100%
}

.dex-btn.btn-outline-tertiary.btn-md {
  padding: calc(var(--dex-okd-button-md-padding-vertical) + 1px - var(--dex-okd-button-outline-tertiary-border-size)) var(--dex-okd-button-md-padding-horizontal)
}

.dex-btn.btn-outline-tertiary.btn-md.dex-btn-strict-circle {
  border-radius: 100px;
  height: calc(var(--dex-okd-button-md-padding-vertical)*2 + 2px - var(--dex-okd-button-outline-tertiary-border-size)*2 + var(--dex-okd-button-md-line-height) + var(--dex-okd-button-outline-tertiary-border-size)*2);
  min-width: 0;
  overflow: hidden;
  padding: 0;
  width: calc(var(--dex-okd-button-md-padding-vertical)*2 + 2px - var(--dex-okd-button-outline-tertiary-border-size)*2 + var(--dex-okd-button-md-line-height) + var(--dex-okd-button-outline-tertiary-border-size)*2)
}

.dex-btn.btn-outline-tertiary.btn-md.dex-btn-strict-circle .btn-content {
  display: block;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  width: 100%
}

.dex-btn.btn-outline-tertiary.btn-lg {
  padding: calc(var(--dex-okd-button-lg-padding-vertical) + 1px - var(--dex-okd-button-outline-tertiary-border-size)) var(--dex-okd-button-lg-padding-horizontal)
}

.dex-btn.btn-outline-tertiary.btn-lg.dex-btn-strict-circle {
  border-radius: 100px;
  height: calc(var(--dex-okd-button-lg-padding-vertical)*2 + 2px - var(--dex-okd-button-outline-tertiary-border-size)*2 + var(--dex-okd-button-lg-line-height) + var(--dex-okd-button-outline-tertiary-border-size)*2);
  min-width: 0;
  overflow: hidden;
  padding: 0;
  width: calc(var(--dex-okd-button-lg-padding-vertical)*2 + 2px - var(--dex-okd-button-outline-tertiary-border-size)*2 + var(--dex-okd-button-lg-line-height) + var(--dex-okd-button-outline-tertiary-border-size)*2)
}

.dex-btn.btn-outline-tertiary.btn-lg.dex-btn-strict-circle .btn-content {
  display: block;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  width: 100%
}

.dex-btn.btn-outline-tertiary.btn-xl {
  padding: calc(var(--dex-okd-button-xl-padding-vertical) + 1px - var(--dex-okd-button-outline-tertiary-border-size)) var(--dex-okd-button-xl-padding-horizontal)
}

.dex-btn.btn-outline-tertiary.btn-xl.dex-btn-strict-circle {
  border-radius: 100px;
  height: calc(var(--dex-okd-button-xl-padding-vertical)*2 + 2px - var(--dex-okd-button-outline-tertiary-border-size)*2 + var(--dex-okd-button-xl-line-height) + var(--dex-okd-button-outline-tertiary-border-size)*2);
  min-width: 0;
  overflow: hidden;
  padding: 0;
  width: calc(var(--dex-okd-button-xl-padding-vertical)*2 + 2px - var(--dex-okd-button-outline-tertiary-border-size)*2 + var(--dex-okd-button-xl-line-height) + var(--dex-okd-button-outline-tertiary-border-size)*2)
}

.dex-btn.btn-outline-tertiary.btn-xl.dex-btn-strict-circle .btn-content {
  display: block;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  width: 100%
}

.dex-btn.btn-text-primary {
  background: var(--dex-okd-button-text-primary-default-background);
  border-color: var(--dex-okd-button-text-primary-default-border-color);
  border-style: solid;
  border-width: var(--dex-okd-button-text-primary-border-size);
  box-shadow: var(--dex-okd-button-text-primary-default-shadow);
  color: var(--dex-okd-button-text-primary-default-font-color)
}

.dex-btn.btn-text-primary.hover,
.dex-btn.btn-text-primary:not(:disabled):not(.btn-disabled):not(.mobile):hover {
  background: var(--dex-okd-button-text-primary-hover-background);
  border-color: var(--dex-okd-button-text-primary-hover-border-color);
  box-shadow: var(--dex-okd-button-text-primary-hover-shadow);
  color: var(--dex-okd-button-text-primary-hover-font-color)
}

.dex-btn.btn-text-primary.hover .btn-icon,
.dex-btn.btn-text-primary:not(:disabled):not(.btn-disabled):not(.mobile):hover .btn-icon {
  color: var(--dex-okd-button-text-primary-hover-icon-color)
}

.dex-btn.btn-text-primary.active,
.dex-btn.btn-text-primary:not(:disabled):active {
  background: var(--dex-okd-button-text-primary-active-background);
  border-color: var(--dex-okd-button-text-primary-active-border-color);
  box-shadow: var(--dex-okd-button-text-primary-active-shadow);
  color: var(--dex-okd-button-text-primary-active-font-color)
}

.dex-btn.btn-text-primary.active .btn-icon,
.dex-btn.btn-text-primary:not(:disabled):active .btn-icon {
  color: var(--dex-okd-button-text-primary-active-icon-color)
}

.dex-btn.btn-text-primary:not(.loading).btn-disabled,
.dex-btn.btn-text-primary:not(.loading):disabled {
  background: var(--dex-okd-button-text-primary-disabled-background);
  border-color: var(--dex-okd-button-text-primary-disabled-border-color);
  box-shadow: var(--dex-okd-button-text-primary-disabled-shadow);
  color: var(--dex-okd-button-text-primary-disabled-font-color)
}

.dex-btn.btn-text-primary:not(.loading).btn-disabled .btn-icon,
.dex-btn.btn-text-primary:not(.loading):disabled .btn-icon {
  color: var(--dex-okd-button-text-primary-disabled-icon-color)
}

.dex-btn.btn-text-primary.loading {
  cursor: pointer
}

.dex-btn.btn-text-primary .btn-icon {
  color: var(--dex-okd-button-text-primary-default-icon-color)
}

.dex-btn.btn-text-primary .dex-btn-loader-text {
  color: var(--dex-okd-button-text-primary-default-font-color)
}

.dex-btn.btn-text-primary.btn-xxs {
  padding: calc(var(--dex-okd-button-xxs-padding-vertical) + 1px - var(--dex-okd-button-text-primary-border-size)) var(--dex-okd-button-xxs-padding-horizontal)
}

.dex-btn.btn-text-primary.btn-xxs.dex-btn-strict-circle {
  border-radius: 100px;
  height: calc(var(--dex-okd-button-xxs-padding-vertical)*2 + 2px - var(--dex-okd-button-text-primary-border-size)*2 + var(--dex-okd-button-xxs-line-height) + var(--dex-okd-button-text-primary-border-size)*2);
  min-width: 0;
  overflow: hidden;
  padding: 0;
  width: calc(var(--dex-okd-button-xxs-padding-vertical)*2 + 2px - var(--dex-okd-button-text-primary-border-size)*2 + var(--dex-okd-button-xxs-line-height) + var(--dex-okd-button-text-primary-border-size)*2)
}

.dex-btn.btn-text-primary.btn-xxs.dex-btn-strict-circle .btn-content {
  display: block;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  width: 100%
}

.dex-btn.btn-text-primary.btn-xs {
  padding: calc(var(--dex-okd-button-xs-padding-vertical) + 1px - var(--dex-okd-button-text-primary-border-size)) var(--dex-okd-button-xs-padding-horizontal)
}

.dex-btn.btn-text-primary.btn-xs.dex-btn-strict-circle {
  border-radius: 100px;
  height: calc(var(--dex-okd-button-xs-padding-vertical)*2 + 2px - var(--dex-okd-button-text-primary-border-size)*2 + var(--dex-okd-button-xs-line-height) + var(--dex-okd-button-text-primary-border-size)*2);
  min-width: 0;
  overflow: hidden;
  padding: 0;
  width: calc(var(--dex-okd-button-xs-padding-vertical)*2 + 2px - var(--dex-okd-button-text-primary-border-size)*2 + var(--dex-okd-button-xs-line-height) + var(--dex-okd-button-text-primary-border-size)*2)
}

.dex-btn.btn-text-primary.btn-xs.dex-btn-strict-circle .btn-content {
  display: block;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  width: 100%
}

.dex-btn.btn-text-primary.btn-s {
  padding: calc(var(--dex-okd-button-s-padding-vertical) + 1px - var(--dex-okd-button-text-primary-border-size)) var(--dex-okd-button-s-padding-horizontal)
}

.dex-btn.btn-text-primary.btn-s.dex-btn-strict-circle {
  border-radius: 100px;
  height: calc(var(--dex-okd-button-s-padding-vertical)*2 + 2px - var(--dex-okd-button-text-primary-border-size)*2 + var(--dex-okd-button-s-line-height) + var(--dex-okd-button-text-primary-border-size)*2);
  min-width: 0;
  overflow: hidden;
  padding: 0;
  width: calc(var(--dex-okd-button-s-padding-vertical)*2 + 2px - var(--dex-okd-button-text-primary-border-size)*2 + var(--dex-okd-button-s-line-height) + var(--dex-okd-button-text-primary-border-size)*2)
}

.dex-btn.btn-text-primary.btn-s.dex-btn-strict-circle .btn-content {
  display: block;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  width: 100%
}

.dex-btn.btn-text-primary.btn-sm {
  padding: calc(var(--dex-okd-button-sm-padding-vertical) + 1px - var(--dex-okd-button-text-primary-border-size)) var(--dex-okd-button-sm-padding-horizontal)
}

.dex-btn.btn-text-primary.btn-sm.dex-btn-strict-circle {
  border-radius: 100px;
  height: calc(var(--dex-okd-button-sm-padding-vertical)*2 + 2px - var(--dex-okd-button-text-primary-border-size)*2 + var(--dex-okd-button-sm-line-height) + var(--dex-okd-button-text-primary-border-size)*2);
  min-width: 0;
  overflow: hidden;
  padding: 0;
  width: calc(var(--dex-okd-button-sm-padding-vertical)*2 + 2px - var(--dex-okd-button-text-primary-border-size)*2 + var(--dex-okd-button-sm-line-height) + var(--dex-okd-button-text-primary-border-size)*2)
}

.dex-btn.btn-text-primary.btn-sm.dex-btn-strict-circle .btn-content {
  display: block;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  width: 100%
}

.dex-btn.btn-text-primary.btn-md {
  padding: calc(var(--dex-okd-button-md-padding-vertical) + 1px - var(--dex-okd-button-text-primary-border-size)) var(--dex-okd-button-md-padding-horizontal)
}

.dex-btn.btn-text-primary.btn-md.dex-btn-strict-circle {
  border-radius: 100px;
  height: calc(var(--dex-okd-button-md-padding-vertical)*2 + 2px - var(--dex-okd-button-text-primary-border-size)*2 + var(--dex-okd-button-md-line-height) + var(--dex-okd-button-text-primary-border-size)*2);
  min-width: 0;
  overflow: hidden;
  padding: 0;
  width: calc(var(--dex-okd-button-md-padding-vertical)*2 + 2px - var(--dex-okd-button-text-primary-border-size)*2 + var(--dex-okd-button-md-line-height) + var(--dex-okd-button-text-primary-border-size)*2)
}

.dex-btn.btn-text-primary.btn-md.dex-btn-strict-circle .btn-content {
  display: block;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  width: 100%
}

.dex-btn.btn-text-primary.btn-lg {
  padding: calc(var(--dex-okd-button-lg-padding-vertical) + 1px - var(--dex-okd-button-text-primary-border-size)) var(--dex-okd-button-lg-padding-horizontal)
}

.dex-btn.btn-text-primary.btn-lg.dex-btn-strict-circle {
  border-radius: 100px;
  height: calc(var(--dex-okd-button-lg-padding-vertical)*2 + 2px - var(--dex-okd-button-text-primary-border-size)*2 + var(--dex-okd-button-lg-line-height) + var(--dex-okd-button-text-primary-border-size)*2);
  min-width: 0;
  overflow: hidden;
  padding: 0;
  width: calc(var(--dex-okd-button-lg-padding-vertical)*2 + 2px - var(--dex-okd-button-text-primary-border-size)*2 + var(--dex-okd-button-lg-line-height) + var(--dex-okd-button-text-primary-border-size)*2)
}

.dex-btn.btn-text-primary.btn-lg.dex-btn-strict-circle .btn-content {
  display: block;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  width: 100%
}

.dex-btn.btn-text-primary.btn-xl {
  padding: calc(var(--dex-okd-button-xl-padding-vertical) + 1px - var(--dex-okd-button-text-primary-border-size)) var(--dex-okd-button-xl-padding-horizontal)
}

.dex-btn.btn-text-primary.btn-xl.dex-btn-strict-circle {
  border-radius: 100px;
  height: calc(var(--dex-okd-button-xl-padding-vertical)*2 + 2px - var(--dex-okd-button-text-primary-border-size)*2 + var(--dex-okd-button-xl-line-height) + var(--dex-okd-button-text-primary-border-size)*2);
  min-width: 0;
  overflow: hidden;
  padding: 0;
  width: calc(var(--dex-okd-button-xl-padding-vertical)*2 + 2px - var(--dex-okd-button-text-primary-border-size)*2 + var(--dex-okd-button-xl-line-height) + var(--dex-okd-button-text-primary-border-size)*2)
}

.dex-btn.btn-text-primary.btn-xl.dex-btn-strict-circle .btn-content {
  display: block;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  width: 100%
}

.dex-btn.btn-text-secondary {
  background: var(--dex-okd-button-text-secondary-default-background);
  border-color: var(--dex-okd-button-text-secondary-default-border-color);
  border-style: solid;
  border-width: var(--dex-okd-button-text-secondary-border-size);
  box-shadow: var(--dex-okd-button-text-secondary-default-shadow);
  color: var(--dex-okd-button-text-secondary-default-font-color)
}

.dex-btn.btn-text-secondary.hover,
.dex-btn.btn-text-secondary:not(:disabled):not(.btn-disabled):not(.mobile):hover {
  background: var(--dex-okd-button-text-secondary-hover-background);
  border-color: var(--dex-okd-button-text-secondary-hover-border-color);
  box-shadow: var(--dex-okd-button-text-secondary-hover-shadow);
  color: var(--dex-okd-button-text-secondary-hover-font-color)
}

.dex-btn.btn-text-secondary.hover .btn-icon,
.dex-btn.btn-text-secondary:not(:disabled):not(.btn-disabled):not(.mobile):hover .btn-icon {
  color: var(--dex-okd-button-text-secondary-hover-icon-color)
}

.dex-btn.btn-text-secondary.active,
.dex-btn.btn-text-secondary:not(:disabled):active {
  background: var(--dex-okd-button-text-secondary-active-background);
  border-color: var(--dex-okd-button-text-secondary-active-border-color);
  box-shadow: var(--dex-okd-button-text-secondary-active-shadow);
  color: var(--dex-okd-button-text-secondary-active-font-color)
}

.dex-btn.btn-text-secondary.active .btn-icon,
.dex-btn.btn-text-secondary:not(:disabled):active .btn-icon {
  color: var(--dex-okd-button-text-secondary-active-icon-color)
}

.dex-btn.btn-text-secondary:not(.loading).btn-disabled,
.dex-btn.btn-text-secondary:not(.loading):disabled {
  background: var(--dex-okd-button-text-secondary-disabled-background);
  border-color: var(--dex-okd-button-text-secondary-disabled-border-color);
  box-shadow: var(--dex-okd-button-text-secondary-disabled-shadow);
  color: var(--dex-okd-button-text-secondary-disabled-font-color)
}

.dex-btn.btn-text-secondary:not(.loading).btn-disabled .btn-icon,
.dex-btn.btn-text-secondary:not(.loading):disabled .btn-icon {
  color: var(--dex-okd-button-text-secondary-disabled-icon-color)
}

.dex-btn.btn-text-secondary.loading {
  cursor: pointer
}

.dex-btn.btn-text-secondary .btn-icon {
  color: var(--dex-okd-button-text-secondary-default-icon-color)
}

.dex-btn.btn-text-secondary .dex-btn-loader-text {
  color: var(--dex-okd-button-text-secondary-default-font-color)
}

.dex-btn.btn-text-secondary.btn-xxs {
  padding: calc(var(--dex-okd-button-xxs-padding-vertical) + 1px - var(--dex-okd-button-text-secondary-border-size)) var(--dex-okd-button-xxs-padding-horizontal)
}

.dex-btn.btn-text-secondary.btn-xxs.dex-btn-strict-circle {
  border-radius: 100px;
  height: calc(var(--dex-okd-button-xxs-padding-vertical)*2 + 2px - var(--dex-okd-button-text-secondary-border-size)*2 + var(--dex-okd-button-xxs-line-height) + var(--dex-okd-button-text-secondary-border-size)*2);
  min-width: 0;
  overflow: hidden;
  padding: 0;
  width: calc(var(--dex-okd-button-xxs-padding-vertical)*2 + 2px - var(--dex-okd-button-text-secondary-border-size)*2 + var(--dex-okd-button-xxs-line-height) + var(--dex-okd-button-text-secondary-border-size)*2)
}

.dex-btn.btn-text-secondary.btn-xxs.dex-btn-strict-circle .btn-content {
  display: block;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  width: 100%
}

.dex-btn.btn-text-secondary.btn-xs {
  padding: calc(var(--dex-okd-button-xs-padding-vertical) + 1px - var(--dex-okd-button-text-secondary-border-size)) var(--dex-okd-button-xs-padding-horizontal)
}

.dex-btn.btn-text-secondary.btn-xs.dex-btn-strict-circle {
  border-radius: 100px;
  height: calc(var(--dex-okd-button-xs-padding-vertical)*2 + 2px - var(--dex-okd-button-text-secondary-border-size)*2 + var(--dex-okd-button-xs-line-height) + var(--dex-okd-button-text-secondary-border-size)*2);
  min-width: 0;
  overflow: hidden;
  padding: 0;
  width: calc(var(--dex-okd-button-xs-padding-vertical)*2 + 2px - var(--dex-okd-button-text-secondary-border-size)*2 + var(--dex-okd-button-xs-line-height) + var(--dex-okd-button-text-secondary-border-size)*2)
}

.dex-btn.btn-text-secondary.btn-xs.dex-btn-strict-circle .btn-content {
  display: block;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  width: 100%
}

.dex-btn.btn-text-secondary.btn-s {
  padding: calc(var(--dex-okd-button-s-padding-vertical) + 1px - var(--dex-okd-button-text-secondary-border-size)) var(--dex-okd-button-s-padding-horizontal)
}

.dex-btn.btn-text-secondary.btn-s.dex-btn-strict-circle {
  border-radius: 100px;
  height: calc(var(--dex-okd-button-s-padding-vertical)*2 + 2px - var(--dex-okd-button-text-secondary-border-size)*2 + var(--dex-okd-button-s-line-height) + var(--dex-okd-button-text-secondary-border-size)*2);
  min-width: 0;
  overflow: hidden;
  padding: 0;
  width: calc(var(--dex-okd-button-s-padding-vertical)*2 + 2px - var(--dex-okd-button-text-secondary-border-size)*2 + var(--dex-okd-button-s-line-height) + var(--dex-okd-button-text-secondary-border-size)*2)
}

.dex-btn.btn-text-secondary.btn-s.dex-btn-strict-circle .btn-content {
  display: block;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  width: 100%
}

.dex-btn.btn-text-secondary.btn-sm {
  padding: calc(var(--dex-okd-button-sm-padding-vertical) + 1px - var(--dex-okd-button-text-secondary-border-size)) var(--dex-okd-button-sm-padding-horizontal)
}

.dex-btn.btn-text-secondary.btn-sm.dex-btn-strict-circle {
  border-radius: 100px;
  height: calc(var(--dex-okd-button-sm-padding-vertical)*2 + 2px - var(--dex-okd-button-text-secondary-border-size)*2 + var(--dex-okd-button-sm-line-height) + var(--dex-okd-button-text-secondary-border-size)*2);
  min-width: 0;
  overflow: hidden;
  padding: 0;
  width: calc(var(--dex-okd-button-sm-padding-vertical)*2 + 2px - var(--dex-okd-button-text-secondary-border-size)*2 + var(--dex-okd-button-sm-line-height) + var(--dex-okd-button-text-secondary-border-size)*2)
}

.dex-btn.btn-text-secondary.btn-sm.dex-btn-strict-circle .btn-content {
  display: block;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  width: 100%
}

.dex-btn.btn-text-secondary.btn-md {
  padding: calc(var(--dex-okd-button-md-padding-vertical) + 1px - var(--dex-okd-button-text-secondary-border-size)) var(--dex-okd-button-md-padding-horizontal)
}

.dex-btn.btn-text-secondary.btn-md.dex-btn-strict-circle {
  border-radius: 100px;
  height: calc(var(--dex-okd-button-md-padding-vertical)*2 + 2px - var(--dex-okd-button-text-secondary-border-size)*2 + var(--dex-okd-button-md-line-height) + var(--dex-okd-button-text-secondary-border-size)*2);
  min-width: 0;
  overflow: hidden;
  padding: 0;
  width: calc(var(--dex-okd-button-md-padding-vertical)*2 + 2px - var(--dex-okd-button-text-secondary-border-size)*2 + var(--dex-okd-button-md-line-height) + var(--dex-okd-button-text-secondary-border-size)*2)
}

.dex-btn.btn-text-secondary.btn-md.dex-btn-strict-circle .btn-content {
  display: block;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  width: 100%
}

.dex-btn.btn-text-secondary.btn-lg {
  padding: calc(var(--dex-okd-button-lg-padding-vertical) + 1px - var(--dex-okd-button-text-secondary-border-size)) var(--dex-okd-button-lg-padding-horizontal)
}

.dex-btn.btn-text-secondary.btn-lg.dex-btn-strict-circle {
  border-radius: 100px;
  height: calc(var(--dex-okd-button-lg-padding-vertical)*2 + 2px - var(--dex-okd-button-text-secondary-border-size)*2 + var(--dex-okd-button-lg-line-height) + var(--dex-okd-button-text-secondary-border-size)*2);
  min-width: 0;
  overflow: hidden;
  padding: 0;
  width: calc(var(--dex-okd-button-lg-padding-vertical)*2 + 2px - var(--dex-okd-button-text-secondary-border-size)*2 + var(--dex-okd-button-lg-line-height) + var(--dex-okd-button-text-secondary-border-size)*2)
}

.dex-btn.btn-text-secondary.btn-lg.dex-btn-strict-circle .btn-content {
  display: block;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  width: 100%
}

.dex-btn.btn-text-secondary.btn-xl {
  padding: calc(var(--dex-okd-button-xl-padding-vertical) + 1px - var(--dex-okd-button-text-secondary-border-size)) var(--dex-okd-button-xl-padding-horizontal)
}

.dex-btn.btn-text-secondary.btn-xl.dex-btn-strict-circle {
  border-radius: 100px;
  height: calc(var(--dex-okd-button-xl-padding-vertical)*2 + 2px - var(--dex-okd-button-text-secondary-border-size)*2 + var(--dex-okd-button-xl-line-height) + var(--dex-okd-button-text-secondary-border-size)*2);
  min-width: 0;
  overflow: hidden;
  padding: 0;
  width: calc(var(--dex-okd-button-xl-padding-vertical)*2 + 2px - var(--dex-okd-button-text-secondary-border-size)*2 + var(--dex-okd-button-xl-line-height) + var(--dex-okd-button-text-secondary-border-size)*2)
}

.dex-btn.btn-text-secondary.btn-xl.dex-btn-strict-circle .btn-content {
  display: block;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  width: 100%
}

.dex-btn.btn-text-red {
  background: var(--dex-okd-button-text-red-default-background);
  border-color: var(--dex-okd-button-text-red-default-border-color);
  border-style: solid;
  border-width: var(--dex-okd-button-text-red-border-size);
  box-shadow: var(--dex-okd-button-text-red-default-shadow);
  color: var(--dex-okd-button-text-red-default-font-color)
}

.dex-btn.btn-text-red.hover,
.dex-btn.btn-text-red:not(:disabled):not(.btn-disabled):not(.mobile):hover {
  background: var(--dex-okd-button-text-red-hover-background);
  border-color: var(--dex-okd-button-text-red-hover-border-color);
  box-shadow: var(--dex-okd-button-text-red-hover-shadow);
  color: var(--dex-okd-button-text-red-hover-font-color)
}

.dex-btn.btn-text-red.hover .btn-icon,
.dex-btn.btn-text-red:not(:disabled):not(.btn-disabled):not(.mobile):hover .btn-icon {
  color: var(--dex-okd-button-text-red-hover-icon-color)
}

.dex-btn.btn-text-red.active,
.dex-btn.btn-text-red:not(:disabled):active {
  background: var(--dex-okd-button-text-red-active-background);
  border-color: var(--dex-okd-button-text-red-active-border-color);
  box-shadow: var(--dex-okd-button-text-red-active-shadow);
  color: var(--dex-okd-button-text-red-active-font-color)
}

.dex-btn.btn-text-red.active .btn-icon,
.dex-btn.btn-text-red:not(:disabled):active .btn-icon {
  color: var(--dex-okd-button-text-red-active-icon-color)
}

.dex-btn.btn-text-red:not(.loading).btn-disabled,
.dex-btn.btn-text-red:not(.loading):disabled {
  background: var(--dex-okd-button-text-red-disabled-background);
  border-color: var(--dex-okd-button-text-red-disabled-border-color);
  box-shadow: var(--dex-okd-button-text-red-disabled-shadow);
  color: var(--dex-okd-button-text-red-disabled-font-color)
}

.dex-btn.btn-text-red:not(.loading).btn-disabled .btn-icon,
.dex-btn.btn-text-red:not(.loading):disabled .btn-icon {
  color: var(--dex-okd-button-text-red-disabled-icon-color)
}

.dex-btn.btn-text-red.loading {
  cursor: pointer
}

.dex-btn.btn-text-red .btn-icon {
  color: var(--dex-okd-button-text-red-default-icon-color)
}

.dex-btn.btn-text-red .dex-btn-loader-text {
  color: var(--dex-okd-button-text-red-default-font-color)
}

.dex-btn.btn-text-red.btn-xxs {
  padding: calc(var(--dex-okd-button-xxs-padding-vertical) + 1px - var(--dex-okd-button-text-red-border-size)) var(--dex-okd-button-xxs-padding-horizontal)
}

.dex-btn.btn-text-red.btn-xxs.dex-btn-strict-circle {
  border-radius: 100px;
  height: calc(var(--dex-okd-button-xxs-padding-vertical)*2 + 2px - var(--dex-okd-button-text-red-border-size)*2 + var(--dex-okd-button-xxs-line-height) + var(--dex-okd-button-text-red-border-size)*2);
  min-width: 0;
  overflow: hidden;
  padding: 0;
  width: calc(var(--dex-okd-button-xxs-padding-vertical)*2 + 2px - var(--dex-okd-button-text-red-border-size)*2 + var(--dex-okd-button-xxs-line-height) + var(--dex-okd-button-text-red-border-size)*2)
}

.dex-btn.btn-text-red.btn-xxs.dex-btn-strict-circle .btn-content {
  display: block;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  width: 100%
}

.dex-btn.btn-text-red.btn-xs {
  padding: calc(var(--dex-okd-button-xs-padding-vertical) + 1px - var(--dex-okd-button-text-red-border-size)) var(--dex-okd-button-xs-padding-horizontal)
}

.dex-btn.btn-text-red.btn-xs.dex-btn-strict-circle {
  border-radius: 100px;
  height: calc(var(--dex-okd-button-xs-padding-vertical)*2 + 2px - var(--dex-okd-button-text-red-border-size)*2 + var(--dex-okd-button-xs-line-height) + var(--dex-okd-button-text-red-border-size)*2);
  min-width: 0;
  overflow: hidden;
  padding: 0;
  width: calc(var(--dex-okd-button-xs-padding-vertical)*2 + 2px - var(--dex-okd-button-text-red-border-size)*2 + var(--dex-okd-button-xs-line-height) + var(--dex-okd-button-text-red-border-size)*2)
}

.dex-btn.btn-text-red.btn-xs.dex-btn-strict-circle .btn-content {
  display: block;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  width: 100%
}

.dex-btn.btn-text-red.btn-s {
  padding: calc(var(--dex-okd-button-s-padding-vertical) + 1px - var(--dex-okd-button-text-red-border-size)) var(--dex-okd-button-s-padding-horizontal)
}

.dex-btn.btn-text-red.btn-s.dex-btn-strict-circle {
  border-radius: 100px;
  height: calc(var(--dex-okd-button-s-padding-vertical)*2 + 2px - var(--dex-okd-button-text-red-border-size)*2 + var(--dex-okd-button-s-line-height) + var(--dex-okd-button-text-red-border-size)*2);
  min-width: 0;
  overflow: hidden;
  padding: 0;
  width: calc(var(--dex-okd-button-s-padding-vertical)*2 + 2px - var(--dex-okd-button-text-red-border-size)*2 + var(--dex-okd-button-s-line-height) + var(--dex-okd-button-text-red-border-size)*2)
}

.dex-btn.btn-text-red.btn-s.dex-btn-strict-circle .btn-content {
  display: block;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  width: 100%
}

.dex-btn.btn-text-red.btn-sm {
  padding: calc(var(--dex-okd-button-sm-padding-vertical) + 1px - var(--dex-okd-button-text-red-border-size)) var(--dex-okd-button-sm-padding-horizontal)
}

.dex-btn.btn-text-red.btn-sm.dex-btn-strict-circle {
  border-radius: 100px;
  height: calc(var(--dex-okd-button-sm-padding-vertical)*2 + 2px - var(--dex-okd-button-text-red-border-size)*2 + var(--dex-okd-button-sm-line-height) + var(--dex-okd-button-text-red-border-size)*2);
  min-width: 0;
  overflow: hidden;
  padding: 0;
  width: calc(var(--dex-okd-button-sm-padding-vertical)*2 + 2px - var(--dex-okd-button-text-red-border-size)*2 + var(--dex-okd-button-sm-line-height) + var(--dex-okd-button-text-red-border-size)*2)
}

.dex-btn.btn-text-red.btn-sm.dex-btn-strict-circle .btn-content {
  display: block;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  width: 100%
}

.dex-btn.btn-text-red.btn-md {
  padding: calc(var(--dex-okd-button-md-padding-vertical) + 1px - var(--dex-okd-button-text-red-border-size)) var(--dex-okd-button-md-padding-horizontal)
}

.dex-btn.btn-text-red.btn-md.dex-btn-strict-circle {
  border-radius: 100px;
  height: calc(var(--dex-okd-button-md-padding-vertical)*2 + 2px - var(--dex-okd-button-text-red-border-size)*2 + var(--dex-okd-button-md-line-height) + var(--dex-okd-button-text-red-border-size)*2);
  min-width: 0;
  overflow: hidden;
  padding: 0;
  width: calc(var(--dex-okd-button-md-padding-vertical)*2 + 2px - var(--dex-okd-button-text-red-border-size)*2 + var(--dex-okd-button-md-line-height) + var(--dex-okd-button-text-red-border-size)*2)
}

.dex-btn.btn-text-red.btn-md.dex-btn-strict-circle .btn-content {
  display: block;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  width: 100%
}

.dex-btn.btn-text-red.btn-lg {
  padding: calc(var(--dex-okd-button-lg-padding-vertical) + 1px - var(--dex-okd-button-text-red-border-size)) var(--dex-okd-button-lg-padding-horizontal)
}

.dex-btn.btn-text-red.btn-lg.dex-btn-strict-circle {
  border-radius: 100px;
  height: calc(var(--dex-okd-button-lg-padding-vertical)*2 + 2px - var(--dex-okd-button-text-red-border-size)*2 + var(--dex-okd-button-lg-line-height) + var(--dex-okd-button-text-red-border-size)*2);
  min-width: 0;
  overflow: hidden;
  padding: 0;
  width: calc(var(--dex-okd-button-lg-padding-vertical)*2 + 2px - var(--dex-okd-button-text-red-border-size)*2 + var(--dex-okd-button-lg-line-height) + var(--dex-okd-button-text-red-border-size)*2)
}

.dex-btn.btn-text-red.btn-lg.dex-btn-strict-circle .btn-content {
  display: block;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  width: 100%
}

.dex-btn.btn-text-red.btn-xl {
  padding: calc(var(--dex-okd-button-xl-padding-vertical) + 1px - var(--dex-okd-button-text-red-border-size)) var(--dex-okd-button-xl-padding-horizontal)
}

.dex-btn.btn-text-red.btn-xl.dex-btn-strict-circle {
  border-radius: 100px;
  height: calc(var(--dex-okd-button-xl-padding-vertical)*2 + 2px - var(--dex-okd-button-text-red-border-size)*2 + var(--dex-okd-button-xl-line-height) + var(--dex-okd-button-text-red-border-size)*2);
  min-width: 0;
  overflow: hidden;
  padding: 0;
  width: calc(var(--dex-okd-button-xl-padding-vertical)*2 + 2px - var(--dex-okd-button-text-red-border-size)*2 + var(--dex-okd-button-xl-line-height) + var(--dex-okd-button-text-red-border-size)*2)
}

.dex-btn.btn-text-red.btn-xl.dex-btn-strict-circle .btn-content {
  display: block;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  width: 100%
}

.dex-btn.btn-text-green {
  background: var(--dex-okd-button-text-green-default-background);
  border-color: var(--dex-okd-button-text-green-default-border-color);
  border-style: solid;
  border-width: var(--dex-okd-button-text-green-border-size);
  box-shadow: var(--dex-okd-button-text-green-default-shadow);
  color: var(--dex-okd-button-text-green-default-font-color)
}

.dex-btn.btn-text-green.hover,
.dex-btn.btn-text-green:not(:disabled):not(.btn-disabled):not(.mobile):hover {
  background: var(--dex-okd-button-text-green-hover-background);
  border-color: var(--dex-okd-button-text-green-hover-border-color);
  box-shadow: var(--dex-okd-button-text-green-hover-shadow);
  color: var(--dex-okd-button-text-green-hover-font-color)
}

.dex-btn.btn-text-green.hover .btn-icon,
.dex-btn.btn-text-green:not(:disabled):not(.btn-disabled):not(.mobile):hover .btn-icon {
  color: var(--dex-okd-button-text-green-hover-icon-color)
}

.dex-btn.btn-text-green.active,
.dex-btn.btn-text-green:not(:disabled):active {
  background: var(--dex-okd-button-text-green-active-background);
  border-color: var(--dex-okd-button-text-green-active-border-color);
  box-shadow: var(--dex-okd-button-text-green-active-shadow);
  color: var(--dex-okd-button-text-green-active-font-color)
}

.dex-btn.btn-text-green.active .btn-icon,
.dex-btn.btn-text-green:not(:disabled):active .btn-icon {
  color: var(--dex-okd-button-text-green-active-icon-color)
}

.dex-btn.btn-text-green:not(.loading).btn-disabled,
.dex-btn.btn-text-green:not(.loading):disabled {
  background: var(--dex-okd-button-text-green-disabled-background);
  border-color: var(--dex-okd-button-text-green-disabled-border-color);
  box-shadow: var(--dex-okd-button-text-green-disabled-shadow);
  color: var(--dex-okd-button-text-green-disabled-font-color)
}

.dex-btn.btn-text-green:not(.loading).btn-disabled .btn-icon,
.dex-btn.btn-text-green:not(.loading):disabled .btn-icon {
  color: var(--dex-okd-button-text-green-disabled-icon-color)
}

.dex-btn.btn-text-green.loading {
  cursor: pointer
}

.dex-btn.btn-text-green .btn-icon {
  color: var(--dex-okd-button-text-green-default-icon-color)
}

.dex-btn.btn-text-green .dex-btn-loader-text {
  color: var(--dex-okd-button-text-green-default-font-color)
}

.dex-btn.btn-text-green.btn-xxs {
  padding: calc(var(--dex-okd-button-xxs-padding-vertical) + 1px - var(--dex-okd-button-text-green-border-size)) var(--dex-okd-button-xxs-padding-horizontal)
}

.dex-btn.btn-text-green.btn-xxs.dex-btn-strict-circle {
  border-radius: 100px;
  height: calc(var(--dex-okd-button-xxs-padding-vertical)*2 + 2px - var(--dex-okd-button-text-green-border-size)*2 + var(--dex-okd-button-xxs-line-height) + var(--dex-okd-button-text-green-border-size)*2);
  min-width: 0;
  overflow: hidden;
  padding: 0;
  width: calc(var(--dex-okd-button-xxs-padding-vertical)*2 + 2px - var(--dex-okd-button-text-green-border-size)*2 + var(--dex-okd-button-xxs-line-height) + var(--dex-okd-button-text-green-border-size)*2)
}

.dex-btn.btn-text-green.btn-xxs.dex-btn-strict-circle .btn-content {
  display: block;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  width: 100%
}

.dex-btn.btn-text-green.btn-xs {
  padding: calc(var(--dex-okd-button-xs-padding-vertical) + 1px - var(--dex-okd-button-text-green-border-size)) var(--dex-okd-button-xs-padding-horizontal)
}

.dex-btn.btn-text-green.btn-xs.dex-btn-strict-circle {
  border-radius: 100px;
  height: calc(var(--dex-okd-button-xs-padding-vertical)*2 + 2px - var(--dex-okd-button-text-green-border-size)*2 + var(--dex-okd-button-xs-line-height) + var(--dex-okd-button-text-green-border-size)*2);
  min-width: 0;
  overflow: hidden;
  padding: 0;
  width: calc(var(--dex-okd-button-xs-padding-vertical)*2 + 2px - var(--dex-okd-button-text-green-border-size)*2 + var(--dex-okd-button-xs-line-height) + var(--dex-okd-button-text-green-border-size)*2)
}

.dex-btn.btn-text-green.btn-xs.dex-btn-strict-circle .btn-content {
  display: block;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  width: 100%
}

.dex-btn.btn-text-green.btn-s {
  padding: calc(var(--dex-okd-button-s-padding-vertical) + 1px - var(--dex-okd-button-text-green-border-size)) var(--dex-okd-button-s-padding-horizontal)
}

.dex-btn.btn-text-green.btn-s.dex-btn-strict-circle {
  border-radius: 100px;
  height: calc(var(--dex-okd-button-s-padding-vertical)*2 + 2px - var(--dex-okd-button-text-green-border-size)*2 + var(--dex-okd-button-s-line-height) + var(--dex-okd-button-text-green-border-size)*2);
  min-width: 0;
  overflow: hidden;
  padding: 0;
  width: calc(var(--dex-okd-button-s-padding-vertical)*2 + 2px - var(--dex-okd-button-text-green-border-size)*2 + var(--dex-okd-button-s-line-height) + var(--dex-okd-button-text-green-border-size)*2)
}

.dex-btn.btn-text-green.btn-s.dex-btn-strict-circle .btn-content {
  display: block;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  width: 100%
}

.dex-btn.btn-text-green.btn-sm {
  padding: calc(var(--dex-okd-button-sm-padding-vertical) + 1px - var(--dex-okd-button-text-green-border-size)) var(--dex-okd-button-sm-padding-horizontal)
}

.dex-btn.btn-text-green.btn-sm.dex-btn-strict-circle {
  border-radius: 100px;
  height: calc(var(--dex-okd-button-sm-padding-vertical)*2 + 2px - var(--dex-okd-button-text-green-border-size)*2 + var(--dex-okd-button-sm-line-height) + var(--dex-okd-button-text-green-border-size)*2);
  min-width: 0;
  overflow: hidden;
  padding: 0;
  width: calc(var(--dex-okd-button-sm-padding-vertical)*2 + 2px - var(--dex-okd-button-text-green-border-size)*2 + var(--dex-okd-button-sm-line-height) + var(--dex-okd-button-text-green-border-size)*2)
}

.dex-btn.btn-text-green.btn-sm.dex-btn-strict-circle .btn-content {
  display: block;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  width: 100%
}

.dex-btn.btn-text-green.btn-md {
  padding: calc(var(--dex-okd-button-md-padding-vertical) + 1px - var(--dex-okd-button-text-green-border-size)) var(--dex-okd-button-md-padding-horizontal)
}

.dex-btn.btn-text-green.btn-md.dex-btn-strict-circle {
  border-radius: 100px;
  height: calc(var(--dex-okd-button-md-padding-vertical)*2 + 2px - var(--dex-okd-button-text-green-border-size)*2 + var(--dex-okd-button-md-line-height) + var(--dex-okd-button-text-green-border-size)*2);
  min-width: 0;
  overflow: hidden;
  padding: 0;
  width: calc(var(--dex-okd-button-md-padding-vertical)*2 + 2px - var(--dex-okd-button-text-green-border-size)*2 + var(--dex-okd-button-md-line-height) + var(--dex-okd-button-text-green-border-size)*2)
}

.dex-btn.btn-text-green.btn-md.dex-btn-strict-circle .btn-content {
  display: block;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  width: 100%
}

.dex-btn.btn-text-green.btn-lg {
  padding: calc(var(--dex-okd-button-lg-padding-vertical) + 1px - var(--dex-okd-button-text-green-border-size)) var(--dex-okd-button-lg-padding-horizontal)
}

.dex-btn.btn-text-green.btn-lg.dex-btn-strict-circle {
  border-radius: 100px;
  height: calc(var(--dex-okd-button-lg-padding-vertical)*2 + 2px - var(--dex-okd-button-text-green-border-size)*2 + var(--dex-okd-button-lg-line-height) + var(--dex-okd-button-text-green-border-size)*2);
  min-width: 0;
  overflow: hidden;
  padding: 0;
  width: calc(var(--dex-okd-button-lg-padding-vertical)*2 + 2px - var(--dex-okd-button-text-green-border-size)*2 + var(--dex-okd-button-lg-line-height) + var(--dex-okd-button-text-green-border-size)*2)
}

.dex-btn.btn-text-green.btn-lg.dex-btn-strict-circle .btn-content {
  display: block;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  width: 100%
}

.dex-btn.btn-text-green.btn-xl {
  padding: calc(var(--dex-okd-button-xl-padding-vertical) + 1px - var(--dex-okd-button-text-green-border-size)) var(--dex-okd-button-xl-padding-horizontal)
}

.dex-btn.btn-text-green.btn-xl.dex-btn-strict-circle {
  border-radius: 100px;
  height: calc(var(--dex-okd-button-xl-padding-vertical)*2 + 2px - var(--dex-okd-button-text-green-border-size)*2 + var(--dex-okd-button-xl-line-height) + var(--dex-okd-button-text-green-border-size)*2);
  min-width: 0;
  overflow: hidden;
  padding: 0;
  width: calc(var(--dex-okd-button-xl-padding-vertical)*2 + 2px - var(--dex-okd-button-text-green-border-size)*2 + var(--dex-okd-button-xl-line-height) + var(--dex-okd-button-text-green-border-size)*2)
}

.dex-btn.btn-text-green.btn-xl.dex-btn-strict-circle .btn-content {
  display: block;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  width: 100%
}

.dex-btn.btn-text-orange {
  background: var(--dex-okd-button-text-orange-default-background);
  border-color: var(--dex-okd-button-text-orange-default-border-color);
  border-style: solid;
  border-width: var(--dex-okd-button-text-orange-border-size);
  box-shadow: var(--dex-okd-button-text-orange-default-shadow);
  color: var(--dex-okd-button-text-orange-default-font-color)
}

.dex-btn.btn-text-orange.hover,
.dex-btn.btn-text-orange:not(:disabled):not(.btn-disabled):not(.mobile):hover {
  background: var(--dex-okd-button-text-orange-hover-background);
  border-color: var(--dex-okd-button-text-orange-hover-border-color);
  box-shadow: var(--dex-okd-button-text-orange-hover-shadow);
  color: var(--dex-okd-button-text-orange-hover-font-color)
}

.dex-btn.btn-text-orange.hover .btn-icon,
.dex-btn.btn-text-orange:not(:disabled):not(.btn-disabled):not(.mobile):hover .btn-icon {
  color: var(--dex-okd-button-text-orange-hover-icon-color)
}

.dex-btn.btn-text-orange.active,
.dex-btn.btn-text-orange:not(:disabled):active {
  background: var(--dex-okd-button-text-orange-active-background);
  border-color: var(--dex-okd-button-text-orange-active-border-color);
  box-shadow: var(--dex-okd-button-text-orange-active-shadow);
  color: var(--dex-okd-button-text-orange-active-font-color)
}

.dex-btn.btn-text-orange.active .btn-icon,
.dex-btn.btn-text-orange:not(:disabled):active .btn-icon {
  color: var(--dex-okd-button-text-orange-active-icon-color)
}

.dex-btn.btn-text-orange:not(.loading).btn-disabled,
.dex-btn.btn-text-orange:not(.loading):disabled {
  background: var(--dex-okd-button-text-orange-disabled-background);
  border-color: var(--dex-okd-button-text-orange-disabled-border-color);
  box-shadow: var(--dex-okd-button-text-orange-disabled-shadow);
  color: var(--dex-okd-button-text-orange-disabled-font-color)
}

.dex-btn.btn-text-orange:not(.loading).btn-disabled .btn-icon,
.dex-btn.btn-text-orange:not(.loading):disabled .btn-icon {
  color: var(--dex-okd-button-text-orange-disabled-icon-color)
}

.dex-btn.btn-text-orange.loading {
  cursor: pointer
}

.dex-btn.btn-text-orange .btn-icon {
  color: var(--dex-okd-button-text-orange-default-icon-color)
}

.dex-btn.btn-text-orange .dex-btn-loader-text {
  color: var(--dex-okd-button-text-orange-default-font-color)
}

.dex-btn.btn-text-orange.btn-xxs {
  padding: calc(var(--dex-okd-button-xxs-padding-vertical) + 1px - var(--dex-okd-button-text-orange-border-size)) var(--dex-okd-button-xxs-padding-horizontal)
}

.dex-btn.btn-text-orange.btn-xxs.dex-btn-strict-circle {
  border-radius: 100px;
  height: calc(var(--dex-okd-button-xxs-padding-vertical)*2 + 2px - var(--dex-okd-button-text-orange-border-size)*2 + var(--dex-okd-button-xxs-line-height) + var(--dex-okd-button-text-orange-border-size)*2);
  min-width: 0;
  overflow: hidden;
  padding: 0;
  width: calc(var(--dex-okd-button-xxs-padding-vertical)*2 + 2px - var(--dex-okd-button-text-orange-border-size)*2 + var(--dex-okd-button-xxs-line-height) + var(--dex-okd-button-text-orange-border-size)*2)
}

.dex-btn.btn-text-orange.btn-xxs.dex-btn-strict-circle .btn-content {
  display: block;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  width: 100%
}

.dex-btn.btn-text-orange.btn-xs {
  padding: calc(var(--dex-okd-button-xs-padding-vertical) + 1px - var(--dex-okd-button-text-orange-border-size)) var(--dex-okd-button-xs-padding-horizontal)
}

.dex-btn.btn-text-orange.btn-xs.dex-btn-strict-circle {
  border-radius: 100px;
  height: calc(var(--dex-okd-button-xs-padding-vertical)*2 + 2px - var(--dex-okd-button-text-orange-border-size)*2 + var(--dex-okd-button-xs-line-height) + var(--dex-okd-button-text-orange-border-size)*2);
  min-width: 0;
  overflow: hidden;
  padding: 0;
  width: calc(var(--dex-okd-button-xs-padding-vertical)*2 + 2px - var(--dex-okd-button-text-orange-border-size)*2 + var(--dex-okd-button-xs-line-height) + var(--dex-okd-button-text-orange-border-size)*2)
}

.dex-btn.btn-text-orange.btn-xs.dex-btn-strict-circle .btn-content {
  display: block;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  width: 100%
}

.dex-btn.btn-text-orange.btn-s {
  padding: calc(var(--dex-okd-button-s-padding-vertical) + 1px - var(--dex-okd-button-text-orange-border-size)) var(--dex-okd-button-s-padding-horizontal)
}

.dex-btn.btn-text-orange.btn-s.dex-btn-strict-circle {
  border-radius: 100px;
  height: calc(var(--dex-okd-button-s-padding-vertical)*2 + 2px - var(--dex-okd-button-text-orange-border-size)*2 + var(--dex-okd-button-s-line-height) + var(--dex-okd-button-text-orange-border-size)*2);
  min-width: 0;
  overflow: hidden;
  padding: 0;
  width: calc(var(--dex-okd-button-s-padding-vertical)*2 + 2px - var(--dex-okd-button-text-orange-border-size)*2 + var(--dex-okd-button-s-line-height) + var(--dex-okd-button-text-orange-border-size)*2)
}

.dex-btn.btn-text-orange.btn-s.dex-btn-strict-circle .btn-content {
  display: block;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  width: 100%
}

.dex-btn.btn-text-orange.btn-sm {
  padding: calc(var(--dex-okd-button-sm-padding-vertical) + 1px - var(--dex-okd-button-text-orange-border-size)) var(--dex-okd-button-sm-padding-horizontal)
}

.dex-btn.btn-text-orange.btn-sm.dex-btn-strict-circle {
  border-radius: 100px;
  height: calc(var(--dex-okd-button-sm-padding-vertical)*2 + 2px - var(--dex-okd-button-text-orange-border-size)*2 + var(--dex-okd-button-sm-line-height) + var(--dex-okd-button-text-orange-border-size)*2);
  min-width: 0;
  overflow: hidden;
  padding: 0;
  width: calc(var(--dex-okd-button-sm-padding-vertical)*2 + 2px - var(--dex-okd-button-text-orange-border-size)*2 + var(--dex-okd-button-sm-line-height) + var(--dex-okd-button-text-orange-border-size)*2)
}

.dex-btn.btn-text-orange.btn-sm.dex-btn-strict-circle .btn-content {
  display: block;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  width: 100%
}

.dex-btn.btn-text-orange.btn-md {
  padding: calc(var(--dex-okd-button-md-padding-vertical) + 1px - var(--dex-okd-button-text-orange-border-size)) var(--dex-okd-button-md-padding-horizontal)
}

.dex-btn.btn-text-orange.btn-md.dex-btn-strict-circle {
  border-radius: 100px;
  height: calc(var(--dex-okd-button-md-padding-vertical)*2 + 2px - var(--dex-okd-button-text-orange-border-size)*2 + var(--dex-okd-button-md-line-height) + var(--dex-okd-button-text-orange-border-size)*2);
  min-width: 0;
  overflow: hidden;
  padding: 0;
  width: calc(var(--dex-okd-button-md-padding-vertical)*2 + 2px - var(--dex-okd-button-text-orange-border-size)*2 + var(--dex-okd-button-md-line-height) + var(--dex-okd-button-text-orange-border-size)*2)
}

.dex-btn.btn-text-orange.btn-md.dex-btn-strict-circle .btn-content {
  display: block;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  width: 100%
}

.dex-btn.btn-text-orange.btn-lg {
  padding: calc(var(--dex-okd-button-lg-padding-vertical) + 1px - var(--dex-okd-button-text-orange-border-size)) var(--dex-okd-button-lg-padding-horizontal)
}

.dex-btn.btn-text-orange.btn-lg.dex-btn-strict-circle {
  border-radius: 100px;
  height: calc(var(--dex-okd-button-lg-padding-vertical)*2 + 2px - var(--dex-okd-button-text-orange-border-size)*2 + var(--dex-okd-button-lg-line-height) + var(--dex-okd-button-text-orange-border-size)*2);
  min-width: 0;
  overflow: hidden;
  padding: 0;
  width: calc(var(--dex-okd-button-lg-padding-vertical)*2 + 2px - var(--dex-okd-button-text-orange-border-size)*2 + var(--dex-okd-button-lg-line-height) + var(--dex-okd-button-text-orange-border-size)*2)
}

.dex-btn.btn-text-orange.btn-lg.dex-btn-strict-circle .btn-content {
  display: block;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  width: 100%
}

.dex-btn.btn-text-orange.btn-xl {
  padding: calc(var(--dex-okd-button-xl-padding-vertical) + 1px - var(--dex-okd-button-text-orange-border-size)) var(--dex-okd-button-xl-padding-horizontal)
}

.dex-btn.btn-text-orange.btn-xl.dex-btn-strict-circle {
  border-radius: 100px;
  height: calc(var(--dex-okd-button-xl-padding-vertical)*2 + 2px - var(--dex-okd-button-text-orange-border-size)*2 + var(--dex-okd-button-xl-line-height) + var(--dex-okd-button-text-orange-border-size)*2);
  min-width: 0;
  overflow: hidden;
  padding: 0;
  width: calc(var(--dex-okd-button-xl-padding-vertical)*2 + 2px - var(--dex-okd-button-text-orange-border-size)*2 + var(--dex-okd-button-xl-line-height) + var(--dex-okd-button-text-orange-border-size)*2)
}

.dex-btn.btn-text-orange.btn-xl.dex-btn-strict-circle .btn-content {
  display: block;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  width: 100%
}

.dex-btn.btn-text-yellow {
  background: var(--dex-okd-button-text-yellow-default-background);
  border-color: var(--dex-okd-button-text-yellow-default-border-color);
  border-style: solid;
  border-width: var(--dex-okd-button-text-yellow-border-size);
  box-shadow: var(--dex-okd-button-text-yellow-default-shadow);
  color: var(--dex-okd-button-text-yellow-default-font-color)
}

.dex-btn.btn-text-yellow.hover,
.dex-btn.btn-text-yellow:not(:disabled):not(.btn-disabled):not(.mobile):hover {
  background: var(--dex-okd-button-text-yellow-hover-background);
  border-color: var(--dex-okd-button-text-yellow-hover-border-color);
  box-shadow: var(--dex-okd-button-text-yellow-hover-shadow);
  color: var(--dex-okd-button-text-yellow-hover-font-color)
}

.dex-btn.btn-text-yellow.hover .btn-icon,
.dex-btn.btn-text-yellow:not(:disabled):not(.btn-disabled):not(.mobile):hover .btn-icon {
  color: var(--dex-okd-button-text-yellow-hover-icon-color)
}

.dex-btn.btn-text-yellow.active,
.dex-btn.btn-text-yellow:not(:disabled):active {
  background: var(--dex-okd-button-text-yellow-active-background);
  border-color: var(--dex-okd-button-text-yellow-active-border-color);
  box-shadow: var(--dex-okd-button-text-yellow-active-shadow);
  color: var(--dex-okd-button-text-yellow-active-font-color)
}

.dex-btn.btn-text-yellow.active .btn-icon,
.dex-btn.btn-text-yellow:not(:disabled):active .btn-icon {
  color: var(--dex-okd-button-text-yellow-active-icon-color)
}

.dex-btn.btn-text-yellow:not(.loading).btn-disabled,
.dex-btn.btn-text-yellow:not(.loading):disabled {
  background: var(--dex-okd-button-text-yellow-disabled-background);
  border-color: var(--dex-okd-button-text-yellow-disabled-border-color);
  box-shadow: var(--dex-okd-button-text-yellow-disabled-shadow);
  color: var(--dex-okd-button-text-yellow-disabled-font-color)
}

.dex-btn.btn-text-yellow:not(.loading).btn-disabled .btn-icon,
.dex-btn.btn-text-yellow:not(.loading):disabled .btn-icon {
  color: var(--dex-okd-button-text-yellow-disabled-icon-color)
}

.dex-btn.btn-text-yellow.loading {
  cursor: pointer
}

.dex-btn.btn-text-yellow .btn-icon {
  color: var(--dex-okd-button-text-yellow-default-icon-color)
}

.dex-btn.btn-text-yellow .dex-btn-loader-text {
  color: var(--dex-okd-button-text-yellow-default-font-color)
}

.dex-btn.btn-text-yellow.btn-xxs {
  padding: calc(var(--dex-okd-button-xxs-padding-vertical) + 1px - var(--dex-okd-button-text-yellow-border-size)) var(--dex-okd-button-xxs-padding-horizontal)
}

.dex-btn.btn-text-yellow.btn-xxs.dex-btn-strict-circle {
  border-radius: 100px;
  height: calc(var(--dex-okd-button-xxs-padding-vertical)*2 + 2px - var(--dex-okd-button-text-yellow-border-size)*2 + var(--dex-okd-button-xxs-line-height) + var(--dex-okd-button-text-yellow-border-size)*2);
  min-width: 0;
  overflow: hidden;
  padding: 0;
  width: calc(var(--dex-okd-button-xxs-padding-vertical)*2 + 2px - var(--dex-okd-button-text-yellow-border-size)*2 + var(--dex-okd-button-xxs-line-height) + var(--dex-okd-button-text-yellow-border-size)*2)
}

.dex-btn.btn-text-yellow.btn-xxs.dex-btn-strict-circle .btn-content {
  display: block;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  width: 100%
}

.dex-btn.btn-text-yellow.btn-xs {
  padding: calc(var(--dex-okd-button-xs-padding-vertical) + 1px - var(--dex-okd-button-text-yellow-border-size)) var(--dex-okd-button-xs-padding-horizontal)
}

.dex-btn.btn-text-yellow.btn-xs.dex-btn-strict-circle {
  border-radius: 100px;
  height: calc(var(--dex-okd-button-xs-padding-vertical)*2 + 2px - var(--dex-okd-button-text-yellow-border-size)*2 + var(--dex-okd-button-xs-line-height) + var(--dex-okd-button-text-yellow-border-size)*2);
  min-width: 0;
  overflow: hidden;
  padding: 0;
  width: calc(var(--dex-okd-button-xs-padding-vertical)*2 + 2px - var(--dex-okd-button-text-yellow-border-size)*2 + var(--dex-okd-button-xs-line-height) + var(--dex-okd-button-text-yellow-border-size)*2)
}

.dex-btn.btn-text-yellow.btn-xs.dex-btn-strict-circle .btn-content {
  display: block;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  width: 100%
}

.dex-btn.btn-text-yellow.btn-s {
  padding: calc(var(--dex-okd-button-s-padding-vertical) + 1px - var(--dex-okd-button-text-yellow-border-size)) var(--dex-okd-button-s-padding-horizontal)
}

.dex-btn.btn-text-yellow.btn-s.dex-btn-strict-circle {
  border-radius: 100px;
  height: calc(var(--dex-okd-button-s-padding-vertical)*2 + 2px - var(--dex-okd-button-text-yellow-border-size)*2 + var(--dex-okd-button-s-line-height) + var(--dex-okd-button-text-yellow-border-size)*2);
  min-width: 0;
  overflow: hidden;
  padding: 0;
  width: calc(var(--dex-okd-button-s-padding-vertical)*2 + 2px - var(--dex-okd-button-text-yellow-border-size)*2 + var(--dex-okd-button-s-line-height) + var(--dex-okd-button-text-yellow-border-size)*2)
}

.dex-btn.btn-text-yellow.btn-s.dex-btn-strict-circle .btn-content {
  display: block;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  width: 100%
}

.dex-btn.btn-text-yellow.btn-sm {
  padding: calc(var(--dex-okd-button-sm-padding-vertical) + 1px - var(--dex-okd-button-text-yellow-border-size)) var(--dex-okd-button-sm-padding-horizontal)
}

.dex-btn.btn-text-yellow.btn-sm.dex-btn-strict-circle {
  border-radius: 100px;
  height: calc(var(--dex-okd-button-sm-padding-vertical)*2 + 2px - var(--dex-okd-button-text-yellow-border-size)*2 + var(--dex-okd-button-sm-line-height) + var(--dex-okd-button-text-yellow-border-size)*2);
  min-width: 0;
  overflow: hidden;
  padding: 0;
  width: calc(var(--dex-okd-button-sm-padding-vertical)*2 + 2px - var(--dex-okd-button-text-yellow-border-size)*2 + var(--dex-okd-button-sm-line-height) + var(--dex-okd-button-text-yellow-border-size)*2)
}

.dex-btn.btn-text-yellow.btn-sm.dex-btn-strict-circle .btn-content {
  display: block;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  width: 100%
}

.dex-btn.btn-text-yellow.btn-md {
  padding: calc(var(--dex-okd-button-md-padding-vertical) + 1px - var(--dex-okd-button-text-yellow-border-size)) var(--dex-okd-button-md-padding-horizontal)
}

.dex-btn.btn-text-yellow.btn-md.dex-btn-strict-circle {
  border-radius: 100px;
  height: calc(var(--dex-okd-button-md-padding-vertical)*2 + 2px - var(--dex-okd-button-text-yellow-border-size)*2 + var(--dex-okd-button-md-line-height) + var(--dex-okd-button-text-yellow-border-size)*2);
  min-width: 0;
  overflow: hidden;
  padding: 0;
  width: calc(var(--dex-okd-button-md-padding-vertical)*2 + 2px - var(--dex-okd-button-text-yellow-border-size)*2 + var(--dex-okd-button-md-line-height) + var(--dex-okd-button-text-yellow-border-size)*2)
}

.dex-btn.btn-text-yellow.btn-md.dex-btn-strict-circle .btn-content {
  display: block;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  width: 100%
}

.dex-btn.btn-text-yellow.btn-lg {
  padding: calc(var(--dex-okd-button-lg-padding-vertical) + 1px - var(--dex-okd-button-text-yellow-border-size)) var(--dex-okd-button-lg-padding-horizontal)
}

.dex-btn.btn-text-yellow.btn-lg.dex-btn-strict-circle {
  border-radius: 100px;
  height: calc(var(--dex-okd-button-lg-padding-vertical)*2 + 2px - var(--dex-okd-button-text-yellow-border-size)*2 + var(--dex-okd-button-lg-line-height) + var(--dex-okd-button-text-yellow-border-size)*2);
  min-width: 0;
  overflow: hidden;
  padding: 0;
  width: calc(var(--dex-okd-button-lg-padding-vertical)*2 + 2px - var(--dex-okd-button-text-yellow-border-size)*2 + var(--dex-okd-button-lg-line-height) + var(--dex-okd-button-text-yellow-border-size)*2)
}

.dex-btn.btn-text-yellow.btn-lg.dex-btn-strict-circle .btn-content {
  display: block;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  width: 100%
}

.dex-btn.btn-text-yellow.btn-xl {
  padding: calc(var(--dex-okd-button-xl-padding-vertical) + 1px - var(--dex-okd-button-text-yellow-border-size)) var(--dex-okd-button-xl-padding-horizontal)
}

.dex-btn.btn-text-yellow.btn-xl.dex-btn-strict-circle {
  border-radius: 100px;
  height: calc(var(--dex-okd-button-xl-padding-vertical)*2 + 2px - var(--dex-okd-button-text-yellow-border-size)*2 + var(--dex-okd-button-xl-line-height) + var(--dex-okd-button-text-yellow-border-size)*2);
  min-width: 0;
  overflow: hidden;
  padding: 0;
  width: calc(var(--dex-okd-button-xl-padding-vertical)*2 + 2px - var(--dex-okd-button-text-yellow-border-size)*2 + var(--dex-okd-button-xl-line-height) + var(--dex-okd-button-text-yellow-border-size)*2)
}

.dex-btn.btn-text-yellow.btn-xl.dex-btn-strict-circle .btn-content {
  display: block;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  width: 100%
}

.dex-btn.btn-xxs {
  border-radius: var(--dex-okd-button-xxs-border-radius);
  font-weight: 500;
  font-weight: var(--dex-okd-button-xxs-font-weight, 500);
  min-width: var(--dex-okd-button-xxs-min-width)
}

.dex-btn.btn-xxs,
.dex-btn.btn-xxs .dex-btn-loader-text {
  font-size: var(--dex-okd-button-xxs-font-size);
  line-height: var(--dex-okd-button-xxs-line-height)
}

.dex-btn.btn-xxs .dex-btn-loader-text {
  margin-left: var(--dex-okd-button-xxs-loader-text-margin-left)
}

.dex-btn.btn-xxs.btn-rect {
  border-radius: 4px;
  border-radius: var(--dex-okd-button-rect-xxs-border-radius, 4px)
}

.dex-btn.btn-xs {
  border-radius: var(--dex-okd-button-xs-border-radius);
  font-weight: 500;
  font-weight: var(--dex-okd-button-xs-font-weight, 500);
  min-width: var(--dex-okd-button-xs-min-width)
}

.dex-btn.btn-xs,
.dex-btn.btn-xs .dex-btn-loader-text {
  font-size: var(--dex-okd-button-xs-font-size);
  line-height: var(--dex-okd-button-xs-line-height)
}

.dex-btn.btn-xs .dex-btn-loader-text {
  margin-left: var(--dex-okd-button-xs-loader-text-margin-left)
}

.dex-btn.btn-xs.btn-rect {
  border-radius: 4px;
  border-radius: var(--dex-okd-button-rect-xs-border-radius, 4px)
}

.dex-btn.btn-s {
  border-radius: var(--dex-okd-button-s-border-radius);
  font-weight: 500;
  font-weight: var(--dex-okd-button-s-font-weight, 500);
  min-width: var(--dex-okd-button-s-min-width)
}

.dex-btn.btn-s,
.dex-btn.btn-s .dex-btn-loader-text {
  font-size: var(--dex-okd-button-s-font-size);
  line-height: var(--dex-okd-button-s-line-height)
}

.dex-btn.btn-s .dex-btn-loader-text {
  margin-left: var(--dex-okd-button-s-loader-text-margin-left)
}

.dex-btn.btn-s.btn-rect {
  border-radius: 4px;
  border-radius: var(--dex-okd-button-rect-s-border-radius, 4px)
}

.dex-btn.btn-sm {
  border-radius: var(--dex-okd-button-sm-border-radius);
  font-weight: 500;
  font-weight: var(--dex-okd-button-sm-font-weight, 500);
  min-width: var(--dex-okd-button-sm-min-width)
}

.dex-btn.btn-sm,
.dex-btn.btn-sm .dex-btn-loader-text {
  font-size: var(--dex-okd-button-sm-font-size);
  line-height: var(--dex-okd-button-sm-line-height)
}

.dex-btn.btn-sm .dex-btn-loader-text {
  margin-left: var(--dex-okd-button-sm-loader-text-margin-left)
}

.dex-btn.btn-sm.btn-rect {
  border-radius: 4px;
  border-radius: var(--dex-okd-button-rect-sm-border-radius, 4px)
}

.dex-btn.btn-md {
  border-radius: var(--dex-okd-button-md-border-radius);
  font-weight: 500;
  font-weight: var(--dex-okd-button-md-font-weight, 500);
  min-width: var(--dex-okd-button-md-min-width)
}

.dex-btn.btn-md,
.dex-btn.btn-md .dex-btn-loader-text {
  font-size: var(--dex-okd-button-md-font-size);
  line-height: var(--dex-okd-button-md-line-height)
}

.dex-btn.btn-md .dex-btn-loader-text {
  margin-left: var(--dex-okd-button-md-loader-text-margin-left)
}

.dex-btn.btn-md.btn-rect {
  border-radius: 4px;
  border-radius: var(--dex-okd-button-rect-md-border-radius, 4px)
}

.dex-btn.btn-lg {
  border-radius: var(--dex-okd-button-lg-border-radius);
  font-weight: 500;
  font-weight: var(--dex-okd-button-lg-font-weight, 500);
  min-width: var(--dex-okd-button-lg-min-width)
}

.dex-btn.btn-lg,
.dex-btn.btn-lg .dex-btn-loader-text {
  font-size: var(--dex-okd-button-lg-font-size);
  line-height: var(--dex-okd-button-lg-line-height)
}

.dex-btn.btn-lg .dex-btn-loader-text {
  margin-left: var(--dex-okd-button-lg-loader-text-margin-left)
}

.dex-btn.btn-lg.btn-rect {
  border-radius: 8px;
  border-radius: var(--dex-okd-button-rect-lg-border-radius, 8px)
}

.dex-btn.btn-xl {
  border-radius: var(--dex-okd-button-xl-border-radius);
  font-weight: 500;
  font-weight: var(--dex-okd-button-xl-font-weight, 500);
  min-width: var(--dex-okd-button-xl-min-width)
}

.dex-btn.btn-xl,
.dex-btn.btn-xl .dex-btn-loader-text {
  font-size: var(--dex-okd-button-xl-font-size);
  line-height: var(--dex-okd-button-xl-line-height)
}

.dex-btn.btn-xl .dex-btn-loader-text {
  margin-left: var(--dex-okd-button-xl-loader-text-margin-left)
}

.dex-btn.btn-xl.btn-rect {
  border-radius: 8px;
  border-radius: var(--dex-okd-button-rect-xl-border-radius, 8px)
}

.dex-btn.btn-disabled,
.dex-btn:disabled {
  cursor: not-allowed
}

.dex-btn.block {
  display: flex;
  width: 100%
}

.dex-btn.btn-circle {
  border-radius: 100px !important
}

.dex-btn .btn-content {
  align-items: center;
  display: flex
}

.dex-btn .dex-btn-ellipsis {
  display: block;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  width: 100%
}

.dex-btn.loading .btn-content {
  opacity: 0
}

.dex-btn.loading .btn-content-position {
  display: none
}

.dex-btn.loading .dex-btn-loader {
  line-height: 0;
  position: absolute
}

.dex-btn.loading .btn-loader-position-absolute {
  position: relative
}

.dex-btn-loader-container {
  height: 100%;
  position: relative
}

.dex-btn .btn-icon+.btn-content {
  margin-left: 4px
}

.dex-btn.btn-xxs .btn-icon {
  font-size: var(--dex-okd-button-xxs-icon-size)
}

.dex-btn.btn-xxs .btn-icon-leading {
  margin-right: var(--dex-okd-button-xxs-icon-margin)
}

.dex-btn.btn-xxs .btn-icon-tailing {
  margin-left: var(--dex-okd-button-xxs-icon-margin)
}

.dex-btn.btn-xxs .dex-btn-loader-size {
  border-radius: var(--dex-okd-button-xxs-loader-size);
  height: var(--dex-okd-button-xxs-loader-size);
  width: var(--dex-okd-button-xxs-loader-size)
}

.dex-btn.btn-xs .btn-icon {
  font-size: var(--dex-okd-button-xs-icon-size)
}

.dex-btn.btn-xs .btn-icon-leading {
  margin-right: var(--dex-okd-button-xs-icon-margin)
}

.dex-btn.btn-xs .btn-icon-tailing {
  margin-left: var(--dex-okd-button-xs-icon-margin)
}

.dex-btn.btn-xs .dex-btn-loader-size {
  border-radius: var(--dex-okd-button-xs-loader-size);
  height: var(--dex-okd-button-xs-loader-size);
  width: var(--dex-okd-button-xs-loader-size)
}

.dex-btn.btn-s .btn-icon {
  font-size: var(--dex-okd-button-s-icon-size)
}

.dex-btn.btn-s .btn-icon-leading {
  margin-right: var(--dex-okd-button-s-icon-margin)
}

.dex-btn.btn-s .btn-icon-tailing {
  margin-left: var(--dex-okd-button-s-icon-margin)
}

.dex-btn.btn-s .dex-btn-loader-size {
  border-radius: var(--dex-okd-button-s-loader-size);
  height: var(--dex-okd-button-s-loader-size);
  width: var(--dex-okd-button-s-loader-size)
}

.dex-btn.btn-sm .btn-icon {
  font-size: var(--dex-okd-button-sm-icon-size)
}

.dex-btn.btn-sm .btn-icon-leading {
  margin-right: var(--dex-okd-button-sm-icon-margin)
}

.dex-btn.btn-sm .btn-icon-tailing {
  margin-left: var(--dex-okd-button-sm-icon-margin)
}

.dex-btn.btn-sm .dex-btn-loader-size {
  border-radius: var(--dex-okd-button-sm-loader-size);
  height: var(--dex-okd-button-sm-loader-size);
  width: var(--dex-okd-button-sm-loader-size)
}

.dex-btn.btn-md .btn-icon {
  font-size: var(--dex-okd-button-md-icon-size)
}

.dex-btn.btn-md .btn-icon-leading {
  margin-right: var(--dex-okd-button-md-icon-margin)
}

.dex-btn.btn-md .btn-icon-tailing {
  margin-left: var(--dex-okd-button-md-icon-margin)
}

.dex-btn.btn-md .dex-btn-loader-size {
  border-radius: var(--dex-okd-button-md-loader-size);
  height: var(--dex-okd-button-md-loader-size);
  width: var(--dex-okd-button-md-loader-size)
}

.dex-btn.btn-lg .btn-icon {
  font-size: var(--dex-okd-button-lg-icon-size)
}

.dex-btn.btn-lg .btn-icon-leading {
  margin-right: var(--dex-okd-button-lg-icon-margin)
}

.dex-btn.btn-lg .btn-icon-tailing {
  margin-left: var(--dex-okd-button-lg-icon-margin)
}

.dex-btn.btn-lg .dex-btn-loader-size {
  border-radius: var(--dex-okd-button-lg-loader-size);
  height: var(--dex-okd-button-lg-loader-size);
  width: var(--dex-okd-button-lg-loader-size)
}

.dex-btn.btn-xl .btn-icon {
  font-size: var(--dex-okd-button-xl-icon-size)
}

.dex-btn.btn-xl .btn-icon-leading {
  margin-right: var(--dex-okd-button-xl-icon-margin)
}

.dex-btn.btn-xl .btn-icon-tailing {
  margin-left: var(--dex-okd-button-xl-icon-margin)
}

.dex-btn.btn-xl .dex-btn-loader-size {
  border-radius: var(--dex-okd-button-xl-loader-size);
  height: var(--dex-okd-button-xl-loader-size);
  width: var(--dex-okd-button-xl-loader-size)
}

.dex-btn .dex-btn-fill-highlight-loader {
  border-color: var(--dex-okd-button-fill-highlight-loader-track-color);
  border-top-color: var(--dex-okd-button-fill-highlight-loader-mark-color)
}

.dex-btn .dex-btn-fill-primary-loader {
  border-color: var(--dex-okd-button-fill-primary-loader-track-color);
  border-top-color: var(--dex-okd-button-fill-primary-loader-mark-color)
}

.dex-btn .dex-btn-fill-secondary-loader {
  border-color: var(--dex-okd-button-fill-secondary-loader-track-color);
  border-top-color: var(--dex-okd-button-fill-secondary-loader-mark-color)
}

.dex-btn .dex-btn-fill-tertiary-loader {
  border-color: var(--dex-okd-button-fill-tertiary-loader-track-color);
  border-top-color: var(--dex-okd-button-fill-tertiary-loader-mark-color)
}

.dex-btn .dex-btn-fill-quaternary-loader {
  border-color: var(--dex-okd-button-fill-quaternary-loader-track-color);
  border-top-color: var(--dex-okd-button-fill-quaternary-loader-mark-color)
}

.dex-btn .dex-btn-fill-red-loader {
  border-color: var(--dex-okd-button-fill-red-loader-track-color);
  border-top-color: var(--dex-okd-button-fill-red-loader-mark-color)
}

.dex-btn .dex-btn-fill-green-loader {
  border-color: var(--dex-okd-button-fill-green-loader-track-color);
  border-top-color: var(--dex-okd-button-fill-green-loader-mark-color)
}

.dex-btn .dex-btn-fill-grey-loader {
  border-color: var(--dex-okd-button-fill-grey-loader-track-color);
  border-top-color: var(--dex-okd-button-fill-grey-loader-mark-color)
}

.dex-btn .dex-btn-outline-highlight-loader {
  border-color: var(--dex-okd-button-outline-highlight-loader-track-color);
  border-top-color: var(--dex-okd-button-outline-highlight-loader-mark-color)
}

.dex-btn .dex-btn-outline-primary-loader {
  border-color: var(--dex-okd-button-outline-primary-loader-track-color);
  border-top-color: var(--dex-okd-button-outline-primary-loader-mark-color)
}

.dex-btn .dex-btn-outline-secondary-loader {
  border-color: var(--dex-okd-button-outline-secondary-loader-track-color);
  border-top-color: var(--dex-okd-button-outline-secondary-loader-mark-color)
}

.dex-btn .dex-btn-outline-tertiary-loader {
  border-color: var(--dex-okd-button-outline-tertiary-loader-track-color);
  border-top-color: var(--dex-okd-button-outline-tertiary-loader-mark-color)
}

.dex-dialog {
  --inner-okd-dialog-close-btn-padding: var(--dex-okd-dialog-window-action-fixed-padding, 16px);
  height: 100%;
  pointer-events: none;
  width: 100%
}

.dex-dialog-float {
  left: 0;
  position: fixed;
  top: 0
}

.dex-dialog * {
  -webkit-tap-highlight-color: transparent;
  box-sizing: border-box
}

.dex-dialog-window-float {
  left: 50%;
  position: absolute;
  top: 50%;
  transform: translate(-50%, -50%)
}

@supports (bottom:constant(safe-area-inset-bottom)) or (bottom:env(safe-area-inset-bottom)) {
  .dex-dialog-window-safe {
    padding-bottom: env(safe-area-inset-bottom)
  }
}

.dex-dialog-window {
  border-radius: var(--dex-okd-dialog-window-border-radius);
  box-shadow: var(--dex-okd-dialog-window-box-shadow);
  display: flex;
  flex-direction: column;
  margin-left: auto;
  margin-right: auto;
  max-height: calc(100% - 48px);
  outline: none;
  pointer-events: auto;
  width: calc(100% - 32px)
}

.dex-dialog-window-border {
  border: 1px solid transparent;
  border: 1px solid var(--dex-okd-dialog-window-border-color, transparent)
}

.dex-dialog-title-container {
  align-items: center;
  display: flex;
  flex-direction: row;
  flex-shrink: 0;
  justify-content: space-between
}

.dex-dialog-title-container .title-center {
  text-align: center
}

.dex-dialog-title-container .title-center .modal-title {
  justify-content: center
}

.dex-dialog .title-center .dex-dialog-top-l {
  margin-right: 32px;
  margin-right: var(--dex-okd-dialog-title-icon-close-margin-left, 32px)
}

.dex-dialog-title-block {
  display: flex;
  flex-direction: column;
  flex-grow: 1
}

.dex-dialog-title-block .modal-title {
  font-size: 16px;
  font-size: var(--dex-okd-dialog-title-font-size, 16px);
  font-weight: 700;
  font-weight: var(--dex-okd-dialog-title-font-weight, 700);
  line-height: var(--dex-okd-dialog-title-line-height);
  padding-top: 2px
}

.dex-dialog-title-block .modal-sub-title {
  font-size: var(--dex-okd-dialog-sub-title-font-size);
  font-weight: 400;
  line-height: var(--dex-okd-dialog-sub-title-line-height);
  margin-top: 2px
}

.dex-dialog-b-btn,
.dex-dialog-c-btn {
  cursor: pointer;
  display: inline-block;
  height: var(--dex-okd-dialog-window-close-icon-size);
  justify-content: center;
  line-height: 1;
  position: relative;
  vertical-align: middle;
  width: var(--dex-okd-dialog-window-close-icon-size);
  z-index: 1
}

.dex-dialog-b-btn.icon,
.dex-dialog-c-btn.icon {
  font-size: var(--dex-okd-dialog-window-close-icon-size)
}

.dex-dialog-b-btn:after,
.dex-dialog-c-btn:after {
  content: " ";
  display: block;
  height: calc(var(--dex-okd-dialog-window-close-icon-size)*1.5);
  left: -25%;
  position: absolute;
  top: -25%;
  width: calc(var(--dex-okd-dialog-window-close-icon-size)*1.5)
}

.dex-dialog-b-btn {
  height: var(--dex-okd-dialog-window-back-icon-size);
  margin-right: 16px;
  margin-right: var(--dex-okd-dialog-title-icon-back-margin-right, 16px);
  width: var(--dex-okd-dialog-window-back-icon-size)
}

.dex-dialog-b-btn.icon {
  font-size: var(--dex-okd-dialog-window-back-icon-size)
}

.dex-dialog-c-btn {
  margin-left: 32px;
  margin-left: var(--dex-okd-dialog-title-icon-close-margin-left, 32px)
}

.dex-dialog-top-action-fixed {
  padding: var(--inner-okd-dialog-close-btn-padding);
  position: absolute;
  top: 0
}

.dex-dialog-top-action-fixed .dex-dialog-b-btn,
.dex-dialog-top-action-fixed .dex-dialog-c-btn {
  margin: 0
}

.dex-dialog-top-l {
  align-self: flex-start;
  left: 0
}

.dex-dialog-top-r {
  align-self: flex-start;
  right: 0
}

.dex-dialog-top-hidden-for-t-center {
  pointer-events: none;
  visibility: hidden
}

.dex-dialog-top-action-hidden {
  display: none;
  pointer-events: none
}

.dex-dialog-scroll-box {
  flex-grow: 1;
  overflow-y: auto
}

.dex-dialog-scroll-box.scroll-disable {
  overflow-y: unset
}

.dex-dialog-container,
.dex-dialog-customer-box {
  height: 100%
}

.dex-dialog-container.no-padding,
.dex-dialog-customer-box.no-padding {
  padding: 0
}

.dex-dialog .dex-dialog-footer-line {
  border-top: thin solid var(--dex-okd-dialog-window-split-line-border-color)
}

.dex-dialog .dex-dialog-header-line {
  border-bottom: thin solid var(--dex-okd-dialog-window-split-line-border-color)
}

.dex-dialog-btn-box {
  display: flex
}

.dex-dialog-btn-box.layout-right {
  justify-content: flex-end
}

.dex-dialog-btn-box.layout-left {
  justify-content: flex-start
}

.dex-dialog-btn-box.layout-full .dialog-btn {
  flex: 1 1
}

.dex-dialog .dex-dialog-window {
  background: var(--dex-okd-dialog-window-background);
  color: var(--dex-okd-dialog-window-default-text-color)
}

.dex-dialog .dex-dialog-window.container-mode {
  background: transparent;
  box-shadow: none
}

.dex-dialog .dex-dialog-title-container .modal-title {
  align-items: center;
  color: var(--dex-okd-dialog-title-color);
  display: flex
}

.dex-dialog .dex-dialog-title-container .modal-sub-title {
  color: var(--dex-okd-dialog-sub-title-color)
}

.dex-dialog .dex-dialog-c-btn {
  color: var(--dex-okd-color-gray-400);
  color: var(--dex-okd-dialog-title-icon-close-color, var(--dex-okd-color-gray-400))
}

.dex-dialog .dex-dialog-c-btn:hover {
  background-color: var(--dex-okd-color-background-hover);
  background-color: var(--dex-okd-dialog-title-icon-hover-background-color, var(--dex-okd-color-background-hover));
  border-radius: 4px;
  border-radius: var(--dex-okd-dialog-title-icon-hover-border-radius, 4px);
  color: var(--dex-okd-color-gray-900);
  color: var(--dex-okd-dialog-title-icon-close-hover-color, var(--dex-okd-color-gray-900))
}

.dex-dialog .dex-dialog-b-btn {
  color: var(--dex-okd-color-gray-900);
  color: var(--dex-okd-dialog-title-icon-back-color, var(--dex-okd-color-gray-900))
}

.dex-dialog .dex-dialog-b-btn:hover {
  background-color: var(--dex-okd-color-background-hover);
  background-color: var(--dex-okd-dialog-title-icon-hover-background-color, var(--dex-okd-color-background-hover));
  border-radius: 4px;
  border-radius: var(--dex-okd-dialog-title-icon-hover-border-radius, 4px)
}

.dex-dialog-mask {
  background: var(--dex-okd-dialog-window-mask-color)
}

.dex-dialog-scroll-bar-end::-webkit-scrollbar,
.dex-dialog-scroll-bar-start::-webkit-scrollbar {
  background-color: initial
}

.dex-dialog-scroll-bar-start::-webkit-scrollbar-button:vertical:start:increment {
  background-color: initial;
  display: block;
  height: var(--dex-okd-dialog-window-border-radius)
}

.dex-dialog-scroll-bar-end::-webkit-scrollbar-button:vertical:end:increment {
  background-color: initial;
  display: block;
  height: var(--dex-okd-dialog-window-border-radius)
}

@media (min-width:768px) {
  .dex-dialog-window {
    min-width: var(--dex-okd-dialog-window-min-width);
    width: auto
  }

  .dex-dialog-title-container {
    padding: var(--dex-okd-dialog-title-box-md-padding-vertical) var(--dex-okd-dialog-container-md-padding-horizontal)
  }

  .dex-dialog-container {
    padding: var(--dex-okd-dialog-container-md-padding-vertical) var(--dex-okd-dialog-container-md-padding-horizontal)
  }

  .dex-dialog-customer-box {
    padding: 0 var(--dex-okd-dialog-container-md-padding-horizontal)
  }

  .dex-dialog-footer-box {
    padding: var(--dex-okd-dialog-footer-box-md-padding-vertical) var(--dex-okd-dialog-container-md-padding-horizontal)
  }

  .dex-dialog-btn-box .dialog-btn.double-btn {
    width: auto
  }

  .dex-dialog-btn-box.layout-full {
    flex-direction: row
  }

  .dex-dialog-btn-box .dialog-btn+.dialog-btn {
    margin-left: 16px;
    margin-left: var(--dex-okd-dialog-footer-btn-md-margin-left, 16px)
  }
}

@media (max-width:767px) {
  .dex-dialog-title-container {
    padding: var(--dex-okd-dialog-title-box-sm-padding-vertical) var(--dex-okd-dialog-container-sm-padding-horizontal)
  }

  .dex-dialog-container {
    padding: var(--dex-okd-dialog-container-sm-padding-vertical) var(--dex-okd-dialog-container-sm-padding-horizontal)
  }

  .dex-dialog-customer-box {
    padding: 0 var(--dex-okd-dialog-container-sm-padding-horizontal)
  }

  .dex-dialog-footer-box {
    padding: var(--dex-okd-dialog-footer-box-sm-padding-top, 12px) var(--dex-okd-dialog-container-sm-padding-horizontal) var(--dex-okd-dialog-footer-box-sm-padding-bottom, 20px)
  }

  .dex-dialog-btn-box .dialog-btn {
    width: 100%
  }

  .dex-dialog-btn-box .dialog-btn+.dialog-btn {
    margin-left: 12px;
    margin-left: var(--dex-okd-dialog-footer-btn-sm-margin-left, 12px)
  }

  .dex-dialog-btn-box.layout-full {
    flex-direction: column-reverse
  }

  .dex-dialog-btn-box.layout-full .dialog-btn+.dialog-btn {
    margin-left: 0
  }

  .dex-dialog-btn-box.layout-full .double-btn:first-child {
    margin-top: 8px;
    margin-top: var(--dex-okd-dialog-footer-btn-full-sm-margin-top, 8px)
  }

  .dex-dialog-window {
    border-radius: 8px;
    border-radius: var(--dex-okd-dialog-window-sm-border-radius, 8px)
  }

  .dex-dialog-window.full-page {
    height: auto !important;
    min-height: calc(100% - 48px) !important
  }

  .dex-dialog-window.full-page-with-show-header {
    height: auto !important
  }

  .dex-dialog-window.bottom-align {
    border-radius: var(--dex-okd-dialog-window-border-radius) var(--dex-okd-dialog-window-border-radius) 0 0;
    bottom: 0;
    top: auto;
    transform: translate(-50%)
  }

  .dex-dialog-window.no-margin {
    min-width: unset;
    width: 100%
  }
}

.dex-dialog-mobile-mode .dex-dialog-title-container {
  padding: var(--dex-okd-dialog-title-box-sm-padding-vertical) var(--dex-okd-dialog-container-sm-padding-horizontal)
}

.dex-dialog-mobile-mode .dex-dialog-container {
  padding: var(--dex-okd-dialog-container-sm-padding-vertical) var(--dex-okd-dialog-container-sm-padding-horizontal)
}

.dex-dialog-mobile-mode .dex-dialog-customer-box {
  padding: 0 var(--dex-okd-dialog-container-sm-padding-horizontal)
}

.dex-dialog-mobile-mode .dex-dialog-footer-box {
  padding: var(--dex-okd-dialog-footer-box-sm-padding-top, 12px) var(--dex-okd-dialog-container-sm-padding-horizontal) var(--dex-okd-dialog-footer-box-sm-padding-bottom, 20px)
}

.dex-dialog-mobile-mode .dex-dialog-btn-box .dialog-btn {
  width: 100%
}

.dex-dialog-mobile-mode .dex-dialog-btn-box .dialog-btn+.dialog-btn {
  margin-left: 12px;
  margin-left: var(--dex-okd-dialog-footer-btn-sm-margin-left, 12px)
}

.dex-dialog-mobile-mode .dex-dialog-btn-box.layout-full {
  flex-direction: column-reverse
}

.dex-dialog-mobile-mode .dex-dialog-btn-box.layout-full .dialog-btn+.dialog-btn {
  margin-left: 0
}

.dex-dialog-mobile-mode .dex-dialog-btn-box.layout-full .double-btn:first-child {
  margin-top: 8px;
  margin-top: var(--dex-okd-dialog-footer-btn-full-sm-margin-top, 8px)
}

.dex-dialog-mobile-mode .dex-dialog-window {
  border-radius: 8px;
  border-radius: var(--dex-okd-dialog-window-sm-border-radius, 8px)
}

.dex-dialog-mobile-mode .dex-dialog-window.full-page {
  height: auto !important;
  min-height: calc(100% - 48px) !important
}

.dex-dialog-mobile-mode .dex-dialog-window.full-page-with-show-header {
  height: auto !important
}

.dex-dialog-mobile-mode .dex-dialog-window.bottom-align {
  border-radius: var(--dex-okd-dialog-window-border-radius) var(--dex-okd-dialog-window-border-radius) 0 0;
  bottom: 0;
  top: auto;
  transform: translate(-50%)
}

.dex-dialog-mobile-mode .dex-dialog-window.no-margin {
  min-width: unset;
  width: 100%
}

.dex-dialog-mobile-mode .dex-dialog-container.no-padding,
.dex-dialog-mobile-mode .dex-dialog-customer-box.no-padding {
  padding: 0
}

.dex-dialog-mobile-mode .dex-dialog-window {
  min-width: unset;
  width: calc(100% - 32px)
}

.dex-dialog.dex-action-dialog .dex-dialog-window.no-radius {
  border-radius: 0
}

.dex-dialog-group {
  overflow: hidden
}

.dex-dialog-group-window {
  display: flex;
  flex-direction: column
}

.dex-dialog.dex-tip-dialog .dex-dialog-tip-content {
  align-items: center;
  display: flex;
  flex-direction: column;
  justify-content: center;
  text-align: center
}

.dex-dialog.dex-tip-dialog .dex-dialog-tip-content .tip-title-box {
  width: 100%
}

.dex-dialog.dex-tip-dialog .dex-dialog-tip-content .tip-title {
  font-size: var(--dex-okd-dialog-tip-title-font-size);
  font-weight: 500;
  line-height: var(--dex-okd-dialog-tip-title-line-height);
  min-height: var(--dex-okd-dialog-tip-title-line-height)
}

.dex-dialog.dex-tip-dialog .dex-dialog-tip-content .tip-detail {
  font-size: var(--dex-okd-dialog-tip-detail-font-size);
  font-weight: 400;
  line-height: var(--dex-okd-dialog-tip-detail-line-height);
  margin-top: 8px
}

.dex-dialog.dex-tip-dialog .dex-dialog-tip-content .tip-detail+.tip-detail {
  margin-top: 2px
}

.dex-dialog.dex-tip-dialog .dex-dialog-tip-content .tip-title {
  color: var(--dex-okd-dialog-tip-title-color)
}

.dex-dialog.dex-tip-dialog .dex-dialog-tip-content .tip-detail {
  color: var(--dex-okd-dialog-tip-detail-color)
}

.dex-dialog.dex-tip-dialog .dex-dialog-footer-box {
  border-top: none
}

@media (max-width:767px) {
  .dex-dialog.dex-tip-dialog .dex-dialog-window.bottom-align {
    border-radius: var(--dex-okd-dialog-window-border-radius);
    bottom: 16px
  }

  .dex-dialog.dex-tip-dialog .dex-dialog-container {
    padding: var(--dex-okd-dialog-tip-container-sm-padding-top, 20px) var(--dex-okd-dialog-container-sm-padding-horizontal) var(--dex-okd-dialog-tip-container-sm-padding-bottom, 24px)
  }

  .dex-dialog.dex-tip-dialog .dex-dialog-footer-box {
    padding: 0 var(--dex-okd-dialog-container-sm-padding-horizontal) var(--dex-okd-dialog-tip-footer-box-sm-padding-vertical) var(--dex-okd-dialog-container-sm-padding-horizontal)
  }
}

@media (min-width:768px) {
  .dex-dialog.dex-tip-dialog .dex-dialog-tip-content {
    margin-left: auto;
    margin-right: auto;
    max-width: var(--dex-okd-dialog-tip-window-min-width)
  }

  .dex-dialog.dex-tip-dialog .dex-dialog-tip-content.two-btn {
    max-width: var(--dex-okd-dialog-tip-window-2btn-min-width)
  }

  .dex-dialog.dex-tip-dialog .dex-dialog-container {
    padding: var(--dex-okd-dialog-tip-container-md-padding-top, 28px) var(--dex-okd-dialog-container-sm-padding-horizontal) var(--dex-okd-dialog-tip-container-md-padding-bottom, 24px)
  }

  .dex-dialog.dex-tip-dialog .dex-dialog-footer-box {
    padding: 0 var(--dex-okd-dialog-container-md-padding-horizontal) var(--dex-okd-dialog-tip-footer-box-md-padding-vertical) var(--dex-okd-dialog-container-md-padding-horizontal)
  }
}

.dex-dialog-tip-icon-bg {
  align-items: center;
  display: flex;
  justify-content: center;
  margin-bottom: 12px
}

.dex-dialog-tip-icon-bg .tip-icon {
  font-size: var(--dex-okd-dialog-tip-icon-font-size)
}

.dex-dialog-alert-icon {
  margin-top: -6px
}

.dex-dialog .dex-dialog-window-tip {
  background-color: var(--dex-okd-dialog-window-background);
  background-color: var(--dex-okd-dialog-confirm-window-background, var(--dex-okd-dialog-window-background))
}

.dex-dialog.dex-new-tip-dialog .dex-dialog-new-tip-top {
  padding: 24px 24px 0;
  padding: var(--dex-okd-dialog-confirm-title-padding-top, 24px) var(--dex-okd-dialog-confirm-title-padding-horizontal, 24px) var(--dex-okd-dialog-confirm-title-padding-bottom, 0)
}

.dex-dialog.dex-new-tip-dialog .dex-dialog-container.dex-dialog-new-tip-container {
  color: #000;
  color: var(--dex-okd-dialog-confirm-container-color, #000);
  font-size: 14px;
  font-size: var(--dex-okd-dialog-confirm-container-font-size, 14px);
  line-height: 20px;
  line-height: var(--dex-okd-dialog-confirm-container-line-height, 20px)
}

@media (min-width:768px) {
  .dex-dialog.dex-new-tip-dialog .dex-dialog-window {
    max-width: 520px;
    max-width: var(--dex-okd-dialog-confirm-max-width, 520px);
    min-width: 280px;
    min-width: var(--dex-okd-dialog-confirm-min-width, 280px)
  }

  .dex-dialog.dex-new-tip-dialog .dex-dialog-container.dex-dialog-new-tip-container {
    padding-bottom: 32px;
    padding-bottom: var(--dex-okd-dialog-confirm-container-padding-bottom, 32px);
    padding-top: 32px;
    padding-top: var(--dex-okd-dialog-confirm-container-padding-top, 32px)
  }

  .dex-dialog.dex-new-tip-dialog .dex-dialog-footer-box {
    padding-bottom: 24px;
    padding-bottom: var(--dex-okd-dialog-confirm-footer-padding-bottom, 24px);
    padding-top: 0;
    padding-top: var(--dex-okd-dialog-confirm-footer-padding-top, 0)
  }
}

@media (max-width:767px) {
  .dex-dialog.dex-new-tip-dialog .dex-dialog-window {
    width: calc(100% - 64px)
  }

  .dex-dialog.dex-new-tip-dialog .dex-dialog-container.dex-dialog-new-tip-container {
    padding: 8px 24px 24px;
    padding: var(--dex-okd-dialog-confirm-container-sm-padding-top, 8px) var(--dex-okd-dialog-confirm-container-sm-padding-horizontal, 24px) var(--dex-okd-dialog-confirm-container-sm-padding-bottom, 24px)
  }

  .dex-dialog.dex-new-tip-dialog .dex-dialog-container.dex-dialog-no-title {
    padding-top: 24px;
    padding-top: var(--dex-okd-dialog-confirm-no-title-padding-top, 24px)
  }

  .dex-dialog.dex-new-tip-dialog .dex-dialog-footer-box.dex-dialog-new-tip-footer {
    padding: 0
  }

  .dex-dialog.dex-new-tip-dialog .dex-dialog-footer-box.dex-dialog-new-tip-footer .dex-dialog-tip-button {
    border: 0;
    border-radius: 0;
    border-top: thin solid #dbdbdb;
    border-top: thin solid var(--dex-okd-dialog-confirm-footer-sm-button-border-color, #dbdbdb)
  }

  .dex-dialog.dex-new-tip-dialog .dex-dialog-footer-box.dex-dialog-new-tip-footer .dex-dialog-tip-button-color {
    color: var(--dex-okd-color-blue-800);
    color: var(--dex-okd-dialog-confirm-footer-sm-button-color, var(--dex-okd-color-blue-800))
  }

  .dex-dialog.dex-new-tip-dialog .dex-dialog-footer-box.dex-dialog-new-tip-footer .dex-dialog-tip-button-confirm {
    font-weight: 700
  }

  .dex-dialog.dex-new-tip-dialog .dex-dialog-footer-box.dex-dialog-new-tip-footer .dex-dialog-tip-button-cancel {
    font-weight: 400
  }

  .dex-dialog.dex-new-tip-dialog .dex-dialog-footer-box.dex-dialog-new-tip-footer .dex-dialog-tip-only-one {
    border-radius: 0 0 var(--dex-okd-dialog-window-sm-border-radius) var(--dex-okd-dialog-window-sm-border-radius)
  }

  .dex-dialog.dex-new-tip-dialog .dex-dialog-footer-box.dex-dialog-new-tip-footer .dex-dialog-tip-border-top:first-child {
    border-radius: 0 0 var(--dex-okd-dialog-window-sm-border-radius) var(--dex-okd-dialog-window-sm-border-radius);
    margin-top: 0
  }

  .dex-dialog.dex-new-tip-dialog .dex-dialog-footer-box.dex-dialog-new-tip-footer .dex-dialog-tip-border-left:first-child {
    border-radius: 0 0 0 var(--dex-okd-dialog-window-sm-border-radius)
  }

  .dex-dialog.dex-new-tip-dialog .dex-dialog-footer-box.dex-dialog-new-tip-footer .dex-dialog-tip-border-left+.dex-dialog-tip-border-left {
    border-left: thin solid #dbdbdb;
    border-left: thin solid var(--dex-okd-dialog-confirm-footer-sm-button-border-color, #dbdbdb);
    border-radius: 0 0 var(--dex-okd-dialog-window-sm-border-radius) 0;
    margin-left: 0
  }
}

.dex-dialog-mobile-mode.dex-new-tip-dialog .dex-dialog-window {
  width: calc(100% - 64px)
}

.dex-dialog-mobile-mode.dex-new-tip-dialog .dex-dialog-container.dex-dialog-new-tip-container {
  padding: 8px 24px 24px;
  padding: var(--dex-okd-dialog-confirm-container-sm-padding-top, 8px) var(--dex-okd-dialog-confirm-container-sm-padding-horizontal, 24px) var(--dex-okd-dialog-confirm-container-sm-padding-bottom, 24px)
}

.dex-dialog-mobile-mode.dex-new-tip-dialog .dex-dialog-container.dex-dialog-no-title {
  padding-top: 24px;
  padding-top: var(--dex-okd-dialog-confirm-no-title-padding-top, 24px)
}

.dex-dialog-mobile-mode.dex-new-tip-dialog .dex-dialog-footer-box.dex-dialog-new-tip-footer {
  padding: 0
}

.dex-dialog-mobile-mode.dex-new-tip-dialog .dex-dialog-footer-box.dex-dialog-new-tip-footer .dex-dialog-tip-button {
  border: 0;
  border-radius: 0;
  border-top: thin solid #dbdbdb;
  border-top: thin solid var(--dex-okd-dialog-confirm-footer-sm-button-border-color, #dbdbdb)
}

.dex-dialog-mobile-mode.dex-new-tip-dialog .dex-dialog-footer-box.dex-dialog-new-tip-footer .dex-dialog-tip-button-color {
  color: var(--dex-okd-color-blue-800);
  color: var(--dex-okd-dialog-confirm-footer-sm-button-color, var(--dex-okd-color-blue-800))
}

.dex-dialog-mobile-mode.dex-new-tip-dialog .dex-dialog-footer-box.dex-dialog-new-tip-footer .dex-dialog-tip-button-confirm {
  font-weight: 700
}

.dex-dialog-mobile-mode.dex-new-tip-dialog .dex-dialog-footer-box.dex-dialog-new-tip-footer .dex-dialog-tip-button-cancel {
  font-weight: 400
}

.dex-dialog-mobile-mode.dex-new-tip-dialog .dex-dialog-footer-box.dex-dialog-new-tip-footer .dex-dialog-tip-only-one {
  border-radius: 0 0 var(--dex-okd-dialog-window-sm-border-radius) var(--dex-okd-dialog-window-sm-border-radius)
}

.dex-dialog-mobile-mode.dex-new-tip-dialog .dex-dialog-footer-box.dex-dialog-new-tip-footer .dex-dialog-tip-border-top:first-child {
  border-radius: 0 0 var(--dex-okd-dialog-window-sm-border-radius) var(--dex-okd-dialog-window-sm-border-radius);
  margin-top: 0
}

.dex-dialog-mobile-mode.dex-new-tip-dialog .dex-dialog-footer-box.dex-dialog-new-tip-footer .dex-dialog-tip-border-left:first-child {
  border-radius: 0 0 0 var(--dex-okd-dialog-window-sm-border-radius)
}

.dex-dialog-mobile-mode.dex-new-tip-dialog .dex-dialog-footer-box.dex-dialog-new-tip-footer .dex-dialog-tip-border-left+.dex-dialog-tip-border-left {
  border-left: thin solid #dbdbdb;
  border-left: thin solid var(--dex-okd-dialog-confirm-footer-sm-button-border-color, #dbdbdb);
  border-radius: 0 0 var(--dex-okd-dialog-window-sm-border-radius) 0;
  margin-left: 0
}

.iconfont.dex-dialog-tip-icon {
  align-self: flex-start;
  font-size: 22px;
  font-size: var(--dex-okd-dialog-confirm-icon-font-size, 22px);
  font-weight: 400;
  line-height: 22px;
  line-height: var(--dex-okd-dialog-confirm-icon-line-height, 22px);
  margin-right: 10px;
  margin-right: var(--dex-okd-dialog-confirm-icon-margin-right, 10px)
}

.dex-dialog-success-icon,
.dex-dialog-success-tip-icon {
  color: var(--dex-okd-dialog-tip-success-icon-color)
}

.dex-dialog-info-icon,
.dex-dialog-info-tip-icon {
  color: var(--dex-okd-dialog-tip-info-icon-color)
}

.dex-dialog-prompt-icon,
.dex-dialog-prompt-tip-icon {
  color: var(--dex-okd-dialog-tip-prompt-icon-color)
}

.dex-dialog-warn-icon,
.dex-dialog-warn-tip-icon {
  color: var(--dex-okd-dialog-tip-warn-icon-color)
}

.dex-dialog-alert-icon,
.dex-dialog-alert-tip-icon {
  color: var(--dex-okd-dialog-tip-alert-icon-color)
}

.dex-dialog-error-icon,
.dex-dialog-error-tip-icon {
  color: var(--dex-okd-dialog-tip-error-icon-color)
}

.dex-dialog .dex-dialog-confirmation-window {
  background-color: var(--dex-okd-dialog-window-background);
  background-color: var(--dex-okd-dialog-confirmation-window-background, var(--dex-okd-dialog-window-background))
}

.dex-dialog-confirmation {
  --inner-okd-dialog-close-btn-padding: 22px
}

.dex-dialog-confirmation-header {
  font-size: 16px;
  font-size: var(--dex-okd-dialog-title-font-size, 16px);
  font-weight: 700;
  font-weight: var(--dex-okd-dialog-title-font-weight, 700);
  line-height: var(--dex-okd-dialog-title-line-height);
  padding: 24px;
  padding: var(--dex-okd-dialog-confirmation-header-padding-top, 24px) var(--dex-okd-dialog-confirmation-padding-right, 24px) var(--dex-okd-dialog-confirmation-header-padding-top, 24px) var(--dex-okd-dialog-confirmation-padding-left, 24px)
}

.dex-dialog-confirmation-header-margin {
  margin-right: 36px
}

.dex-dialog-confirmation-container {
  flex-grow: 1;
  line-height: 22px;
  overflow-y: auto;
  padding-bottom: 8px;
  padding-left: 24px;
  padding-left: var(--dex-okd-dialog-confirmation-padding-left, 24px);
  padding-right: 24px;
  padding-right: var(--dex-okd-dialog-confirmation-padding-right, 24px);
  padding-top: 8px
}

.dex-dialog-confirmation-container-no-header {
  padding-top: 32px;
  padding-top: var(--dex-okd-dialog-confirmation-container-padding-top, 32px)
}

.dex-dialog-confirmation-container-no-footer {
  padding-bottom: 32px;
  padding-bottom: var(--dex-okd-dialog-confirmation-container-padding-bottom, 32px)
}

.dex-dialog-confirmation-footer {
  padding: 24px;
  padding: var(--dex-okd-dialog-confirmation-footer-padding-bottom, 24px) var(--dex-okd-dialog-confirmation-padding-right, 24px) var(--dex-okd-dialog-confirmation-footer-padding-bottom, 24px) var(--dex-okd-dialog-confirmation-padding-left, 24px)
}

.dex-dropdown-option {
  white-space: nowrap
}

@keyframes fadeIn {
  0% {
    opacity: 0
  }

  to {
    opacity: 1
  }
}

.dex-dragdrop-sortable-wrapper {
  background-color: #fff;
  background-color: var(--dex-okd-dragdrop-sortable-item-default-background, #fff);
  box-sizing: border-box;
  display: flex;
  margin-bottom: var(--dex-okd-inner-dragdrop-wrapper-gutter);
  position: relative;
  touch-action: manipulation;
  transform: translateZ(0);
  transform: translate3d(var(--dex-okd-inner-dragdrop-translate-x, 0), var(--dex-okd-inner-dragdrop-translate-y, 0), 0);
  transform-origin: 0 0;
  width: 100%
}

.dex-dragdrop-sortable-wrapper:nth-last-child(3) {
  margin-bottom: 0
}

.dex-dragdrop-sortable-wrapper.dex-dragdrop-sortable-fadeIn {
  animation: fadeIn .5s ease
}

.dex-dragdrop-sortable-horizontal {
  margin-bottom: 0;
  margin-right: var(--dex-okd-inner-dragdrop-wrapper-gutter)
}

.dex-dragdrop-sortable-horizontal:nth-last-child(3) {
  margin-right: 0
}

.dex-dragdrop-sortable-wrapper-dragging {
  animation: pop .2s cubic-bezier(.18, .67, .6, 1.22);
  border: 1px solid #0569ff;
  border: 1px solid var(--dex-okd-dragdrop-sortable-item-active-border-color, #0569ff);
  border-radius: 6px;
  box-shadow: 0 10px 15px -3px rgba(0, 0, 0, .1), 0 4px 6px -2px rgba(0, 0, 0, .05);
  box-shadow: var(--dex-okd-dragdrop-sortable-item-active-shadow, 0 10px 15px -3px rgba(0, 0, 0, .1), 0 4px 6px -2px rgba(0, 0, 0, .05));
  cursor: -webkit-grab;
  cursor: grab;
  opacity: 1;
  z-index: 9
}

.dex-dragdrop-sortable-wrapper.dex-dragdrop-sortable-wrapper-dragging .dex-dragdrop-sortable-item {
  border: none
}

.dex-dragdrop-sortable-wrapper.dex-dragdrop-sortable-wrapper-dragging .dex-dragdrop-sortable-item .dex-dragdrop-sortable-children {
  opacity: 1
}

.dex-dragdrop-sortable-dragging-hidden {
  visibility: hidden
}

.dex-dragdrop-sortable-item {
  -webkit-tap-highlight-color: transparent;
  border: 1px solid #ebebeb;
  border: 1px solid var(--dex-okd-dragdrop-sortable-item-default-border-color, #ebebeb);
  border-radius: 6px;
  box-sizing: border-box;
  display: flex;
  flex-grow: 1;
  position: relative;
  transform-origin: 50% 50%;
  transition: box-shadow .2s cubic-bezier(.18, .67, .6, 1.22)
}

.dex-dragdrop-sortable-item:focus-visible {
  outline: none
}

.dex-dragdrop-sortable-item-draggable {
  cursor: -webkit-grab;
  cursor: grab;
  touch-action: manipulation
}

.dex-dragdrop-sortable-dragging:not(.dex-dragdrop-sortable-dragOverlay) {
  background-color: #f5f9ff;
  background-color: var(--dex-okd-dragdrop-sortable-overlay-background-color, #f5f9ff);
  border: 1px dashed #205fec;
  border: 1px dashed var(--dex-okd-dragdrop-sortable-overlay-border-color, #205fec);
  z-index: 0
}

.dex-dragdrop-sortable-dragging:not(.dex-dragdrop-sortable-dragOverlay) .dex-dragdrop-sortable-children {
  opacity: 0;
  opacity: var(--dex-okd-inner-dragdrop-overlay-virtual-item-opacity, 0)
}

.dex-dragdrop-sortable-disabled.dex-dragdrop-sortable-withHandler .dex-dragdrop-sortable-actions,
.dex-dragdrop-sortable-disabled:not(.dex-dragdrop-sortable-withHandler) {
  cursor: not-allowed;
  opacity: .4
}

.dex-dragdrop-sortable-dragOverlay {
  animation: pop .2s cubic-bezier(.18, .67, .6, 1.22);
  border: 1px solid #0569ff;
  border: 1px solid var(--dex-okd-dragdrop-sortable-item-active-border-color, #0569ff);
  box-shadow: 0 10px 15px -3px rgba(0, 0, 0, .1), 0 4px 6px -2px rgba(0, 0, 0, .05);
  box-shadow: var(--dex-okd-dragdrop-sortable-item-active-shadow, 0 10px 15px -3px rgba(0, 0, 0, .1), 0 4px 6px -2px rgba(0, 0, 0, .05));
  cursor: -webkit-grab;
  cursor: grab;
  opacity: 1;
  z-index: 999
}

.dex-dragdrop-sortable-children {
  flex: 1 1
}

.dex-dragdrop-sortable-actions {
  align-items: center;
  color: #929292;
  color: var(--dex-okd-dragdrop-sortable-item-handler-default-color, #929292);
  cursor: -webkit-grab;
  cursor: grab;
  display: flex;
  height: 100%;
  padding: 0 20px
}

.dex-dragdrop-sortable-actions .dex-dragdrop-sortable-icon {
  font-size: 24px
}

.dex-drawer {
  background: var(--dex-okd-drawer-content-bg);
  outline: none;
  padding: 0 16px;
  width: 320px;
  z-index: 9600
}

.dex-drawer.no-padding {
  padding: 0
}

.dex-drawer-mask {
  background: var(--dex-okd-drawer-mask-color);
  z-index: 9600
}

.dex-drawer-right {
  box-shadow: -6px 0 16px 0 rgba(0, 0, 0, .08), -3px 0 6px -4px rgba(0, 0, 0, .12), -9px 0 28px 8px rgba(0, 0, 0, .05);
  box-shadow: var(--dex-okd-drawer-mask-right-box-shadow, -6px 0 16px 0 rgba(0, 0, 0, .08), -3px 0 6px -4px rgba(0, 0, 0, .12), -9px 0 28px 8px rgba(0, 0, 0, .05))
}

.dex-drawer-left {
  box-shadow: 6px 0 16px 0 rgba(0, 0, 0, .08), 3px 0 6px -4px rgba(0, 0, 0, .12), 9px 0 28px 8px rgba(0, 0, 0, .05);
  box-shadow: var(--dex-okd-drawer-mask-left-box-shadow, 6px 0 16px 0 rgba(0, 0, 0, .08), 3px 0 6px -4px rgba(0, 0, 0, .12), 9px 0 28px 8px rgba(0, 0, 0, .05))
}

.dex-label-reversed .dex-label-text {
  color: var(--dex-okd-input-reversed-label-color)
}

.dex-label-reversed .dex-label-action {
  color: var(--dex-okd-input-reversed-action-color)
}

.dex-input-reversed .dex-input-box {
  background: var(--dex-okd-input-reversed-default-background);
  border: thin solid var(--dex-okd-input-reversed-default-border-color);
  box-shadow: var(--dex-okd-input-reversed-default-shadow);
  transition: border-color .3s, box-shadow .3s
}

.dex-input-reversed .dex-input-input {
  color: var(--dex-okd-input-reversed-default-text-color)
}

.dex-input-reversed .dex-input-input::-webkit-input-placeholder {
  -webkit-text-fill-color: var(--dex-okd-input-reversed-default-placeholder-color);
  color: var(--dex-okd-input-reversed-default-placeholder-color)
}

.dex-input-reversed .dex-input-input:-moz-placeholder {
  -webkit-text-fill-color: var(--dex-okd-input-reversed-default-placeholder-color);
  color: var(--dex-okd-input-reversed-default-placeholder-color);
  opacity: 1
}

.dex-input-reversed .dex-input-input::-ms-input-placeholder {
  -webkit-text-fill-color: var(--dex-okd-input-reversed-default-placeholder-color);
  color: var(--dex-okd-input-reversed-default-placeholder-color)
}

.dex-input-reversed .dex-input-input:-webkit-autofill {
  -webkit-text-fill-color: var(--dex-okd-input-reversed-default-text-color) !important;
  border: none;
  -webkit-box-shadow: 0 0 0 30px var(--dex-okd-input-reversed-default-background) inset
}

.dex-input-reversed .dex-input-error {
  color: var(--dex-okd-input-reversed-error-tips-color)
}

.dex-input-reversed .dex-input-help-text,
.dex-input-reversed .dex-input-tips {
  color: var(--dex-okd-input-reversed-tips-text-color)
}

.dex-input.dex-input-reversed.hover .dex-input-box,
.dex-input.dex-input-reversed:hover .dex-input-box {
  background: var(--dex-okd-input-reversed-hover-background);
  border: thin solid var(--dex-okd-input-reversed-hover-border-color);
  box-shadow: var(--dex-okd-input-reversed-hover-shadow)
}

.dex-input.dex-input-reversed.hover .dex-input-box .dex-input-input,
.dex-input.dex-input-reversed:hover .dex-input-box .dex-input-input {
  -webkit-text-fill-color: var(--dex-okd-input-reversed-hover-text-color);
  caret-color: var(--dex-okd-input-reversed-hover-caret-color);
  color: var(--dex-okd-input-reversed-hover-text-color)
}

.dex-input.dex-input-reversed.hover .dex-input-box .dex-input-input::-webkit-input-placeholder,
.dex-input.dex-input-reversed:hover .dex-input-box .dex-input-input::-webkit-input-placeholder {
  -webkit-text-fill-color: var(--dex-okd-input-reversed-hover-placeholder-color);
  color: var(--dex-okd-input-reversed-hover-placeholder-color)
}

.dex-input.dex-input-reversed.hover .dex-input-box .dex-input-input:-moz-placeholder,
.dex-input.dex-input-reversed:hover .dex-input-box .dex-input-input:-moz-placeholder {
  -webkit-text-fill-color: var(--dex-okd-input-reversed-hover-placeholder-color);
  color: var(--dex-okd-input-reversed-hover-placeholder-color);
  opacity: 1
}

.dex-input.dex-input-reversed.hover .dex-input-box .dex-input-input::-ms-input-placeholder,
.dex-input.dex-input-reversed:hover .dex-input-box .dex-input-input::-ms-input-placeholder {
  -webkit-text-fill-color: var(--dex-okd-input-reversed-hover-placeholder-color);
  color: var(--dex-okd-input-reversed-hover-placeholder-color)
}

.dex-input.dex-input-reversed.focus .dex-input-box {
  background: var(--dex-okd-input-reversed-focus-background);
  border: thin solid var(--dex-okd-input-reversed-focus-border-color);
  box-shadow: var(--dex-okd-input-reversed-focus-shadow)
}

.dex-input.dex-input-reversed.focus .dex-input-box .dex-input-input {
  -webkit-text-fill-color: var(--dex-okd-input-reversed-focus-text-color);
  caret-color: var(--dex-okd-input-reversed-focus-caret-color);
  color: var(--dex-okd-input-reversed-focus-text-color)
}

.dex-input.dex-input-reversed.focus .dex-input-box .dex-input-input::-webkit-input-placeholder {
  -webkit-text-fill-color: var(--dex-okd-input-reversed-focus-placeholder-color);
  color: var(--dex-okd-input-reversed-focus-placeholder-color)
}

.dex-input.dex-input-reversed.focus .dex-input-box .dex-input-input:-moz-placeholder {
  -webkit-text-fill-color: var(--dex-okd-input-reversed-focus-placeholder-color);
  color: var(--dex-okd-input-reversed-focus-placeholder-color);
  opacity: 1
}

.dex-input.dex-input-reversed.focus .dex-input-box .dex-input-input::-ms-input-placeholder {
  -webkit-text-fill-color: var(--dex-okd-input-reversed-focus-placeholder-color);
  color: var(--dex-okd-input-reversed-focus-placeholder-color)
}

.dex-input.dex-input-reversed.disabled .dex-input-box {
  background: var(--dex-okd-input-reversed-disabled-background);
  border: thin solid var(--dex-okd-input-reversed-disabled-border-color);
  box-shadow: var(--dex-okd-input-reversed-disabled-shadow)
}

.dex-input.dex-input-reversed.disabled .dex-input-box .dex-input-input {
  -webkit-text-fill-color: var(--dex-okd-input-reversed-disabled-text-color);
  caret-color: var(--dex-okd-input-reversed-disabled-caret-color);
  color: var(--dex-okd-input-reversed-disabled-text-color)
}

.dex-input.dex-input-reversed.disabled .dex-input-box .dex-input-input::-webkit-input-placeholder {
  -webkit-text-fill-color: var(--dex-okd-input-reversed-disabled-placeholder-color);
  color: var(--dex-okd-input-reversed-disabled-placeholder-color)
}

.dex-input.dex-input-reversed.disabled .dex-input-box .dex-input-input:-moz-placeholder {
  -webkit-text-fill-color: var(--dex-okd-input-reversed-disabled-placeholder-color);
  color: var(--dex-okd-input-reversed-disabled-placeholder-color);
  opacity: 1
}

.dex-input.dex-input-reversed.disabled .dex-input-box .dex-input-input::-ms-input-placeholder {
  -webkit-text-fill-color: var(--dex-okd-input-reversed-disabled-placeholder-color);
  color: var(--dex-okd-input-reversed-disabled-placeholder-color)
}

.dex-input.dex-input-reversed.disabled .dex-input-input:-webkit-autofill {
  -webkit-text-fill-color: var(--dex-okd-input-reversed-disabled-text-color) !important;
  -webkit-box-shadow: 0 0 0 30px var(--dex-okd-input-reversed-disabled-background) inset
}

.dex-input.dex-input-reversed.error .dex-input-box {
  background: var(--dex-okd-input-reversed-error-background);
  border: thin solid var(--dex-okd-input-reversed-error-border-color);
  box-shadow: var(--dex-okd-input-reversed-error-shadow)
}

.dex-input.dex-input-reversed.error .dex-input-box .dex-input-input {
  -webkit-text-fill-color: var(--dex-okd-input-reversed-error-text-color);
  caret-color: var(--dex-okd-input-reversed-error-caret-color);
  color: var(--dex-okd-input-reversed-error-text-color)
}

.dex-input.dex-input-reversed.error .dex-input-box .dex-input-input::-webkit-input-placeholder {
  -webkit-text-fill-color: var(--dex-okd-input-reversed-error-placeholder-color);
  color: var(--dex-okd-input-reversed-error-placeholder-color)
}

.dex-input.dex-input-reversed.error .dex-input-box .dex-input-input:-moz-placeholder {
  -webkit-text-fill-color: var(--dex-okd-input-reversed-error-placeholder-color);
  color: var(--dex-okd-input-reversed-error-placeholder-color);
  opacity: 1
}

.dex-input.dex-input-reversed.error .dex-input-box .dex-input-input::-ms-input-placeholder {
  -webkit-text-fill-color: var(--dex-okd-input-reversed-error-placeholder-color);
  color: var(--dex-okd-input-reversed-error-placeholder-color)
}

.dex-input-reversed .dex-input-prefix .prefix-icon,
.dex-input-reversed .dex-input-suffix .suffix-icon,
.dex-input-reversed .dex-input-suffix .suffix-icon:hover {
  color: var(--dex-okd-input-reversed-icon-color)
}

.dex-input-reversed .dex-input-suffix .error-icon {
  color: var(--dex-okd-input-reversed-error-tips-color)
}

.dex-input-reversed .dex-input-number-suffix {
  border-left: 1px solid var(--dex-okd-input-reversed-default-border-color)
}

.dex-input-reversed .dex-input-number-suffix-part {
  background: var(--dex-okd-input-number-reversed-default-add-icon-background)
}

.dex-input-reversed .dex-input-number-suffix-part .icon {
  color: var(--dex-okd-input-number-reversed-default-add-icon-color)
}

.dex-input-reversed .dex-input-number-suffix-part .hover,
.dex-input-reversed .dex-input-number-suffix-part:hover {
  background: var(--dex-okd-input-number-reversed-hover-add-icon-background)
}

.dex-input-reversed .dex-input-number-suffix-part .hover .icon,
.dex-input-reversed .dex-input-number-suffix-part:hover .icon {
  color: var(--dex-okd-input-number-reversed-hover-add-icon-color)
}

.dex-input-reversed .dex-input-number-suffix-part .active,
.dex-input-reversed .dex-input-number-suffix-part:active {
  background: var(--dex-okd-input-number-reversed-active-add-icon-background)
}

.dex-input-reversed .dex-input-number-suffix-part .active .icon,
.dex-input-reversed .dex-input-number-suffix-part:active .icon {
  color: var(--dex-okd-input-number-reversed-active-add-icon-color)
}

.dex-input-reversed .dex-input-number-suffix-part .disabled,
.dex-input-reversed .dex-input-number-suffix-part-disabled {
  background: var(--dex-okd-input-number-reversed-disabled-add-icon-background)
}

.dex-input-reversed .dex-input-number-suffix-part .disabled .icon,
.dex-input-reversed .dex-input-number-suffix-part .disabled:hover .icon,
.dex-input-reversed .dex-input-number-suffix-part-disabled .icon,
.dex-input-reversed .dex-input-number-suffix-part-disabled:hover .icon {
  color: var(--dex-okd-input-number-reversed-disabled-add-icon-color)
}

.dex-input-reversed .dex-input-number-suffix-line {
  background: var(--dex-okd-input-reversed-default-border-color)
}

.dex-input-reversed.dex-input .dex-input-code-btn {
  color: var(--dex-okd-input-code-reversed-common-btn-color)
}

.dex-input-reversed.dex-input .dex-input-code-btn.disabled {
  color: var(--dex-okd-input-code-reversed-common-btn-disabled-color)
}

.dex-input-reversed.dex-input .dex-input-count-down {
  color: var(--dex-okd-input-code-reversed-common-count-color)
}

.dex-input-reversed.dex-input-search .dex-input-prefix .dex-input-search-prefix-icon {
  color: var(--dex-okd-input-search-reversed-prefix-icon-color)
}

.dex-input-reversed.dex-input-search .dex-input-error {
  color: var(--dex-okd-input-search-reversed-error-tips-color)
}

.dex-input-reversed.dex-input-search .dex-input-box {
  background-color: var(--dex-okd-input-search-reversed-default-background);
  border-color: var(--dex-okd-input-search-reversed-default-border-color);
  box-shadow: var(--dex-okd-input-search-reversed-default-shadow)
}

.dex-input-reversed.dex-input-search .dex-input-input {
  color: var(--dex-okd-input-search-reversed-default-text-color)
}

.dex-input-reversed.dex-input-search .dex-input-input::-webkit-input-placeholder {
  -webkit-text-fill-color: var(--dex-okd-input-search-reversed-default-placeholder-color);
  color: var(--dex-okd-input-search-reversed-default-placeholder-color)
}

.dex-input-reversed.dex-input-search .dex-input-input:-moz-placeholder {
  -webkit-text-fill-color: var(--dex-okd-input-search-reversed-default-placeholder-color);
  color: var(--dex-okd-input-search-reversed-default-placeholder-color);
  opacity: 1
}

.dex-input-reversed.dex-input-search .dex-input-input::-ms-input-placeholder {
  -webkit-text-fill-color: var(--dex-okd-input-search-reversed-default-placeholder-color);
  color: var(--dex-okd-input-search-reversed-default-placeholder-color)
}

.dex-input-reversed.dex-input-search.hover .dex-input-box,
.dex-input-reversed.dex-input-search:hover .dex-input-box {
  background: var(--dex-okd-input-search-reversed-hover-background);
  border: thin solid var(--dex-okd-input-search-reversed-hover-border-color);
  box-shadow: var(--dex-okd-input-search-reversed-hover-shadow)
}

.dex-input-reversed.dex-input-search.hover .dex-input-box .dex-input-input,
.dex-input-reversed.dex-input-search:hover .dex-input-box .dex-input-input {
  -webkit-text-fill-color: var(--dex-okd-input-search-reversed-hover-text-color);
  caret-color: var(--dex-okd-input-search-reversed-hover-caret-color);
  color: var(--dex-okd-input-search-reversed-hover-text-color)
}

.dex-input-reversed.dex-input-search.hover .dex-input-box .dex-input-input::-webkit-input-placeholder,
.dex-input-reversed.dex-input-search:hover .dex-input-box .dex-input-input::-webkit-input-placeholder {
  -webkit-text-fill-color: var(--dex-okd-input-search-reversed-hover-placeholder-color);
  color: var(--dex-okd-input-search-reversed-hover-placeholder-color)
}

.dex-input-reversed.dex-input-search.hover .dex-input-box .dex-input-input:-moz-placeholder,
.dex-input-reversed.dex-input-search:hover .dex-input-box .dex-input-input:-moz-placeholder {
  -webkit-text-fill-color: var(--dex-okd-input-search-reversed-hover-placeholder-color);
  color: var(--dex-okd-input-search-reversed-hover-placeholder-color);
  opacity: 1
}

.dex-input-reversed.dex-input-search.hover .dex-input-box .dex-input-input::-ms-input-placeholder,
.dex-input-reversed.dex-input-search:hover .dex-input-box .dex-input-input::-ms-input-placeholder {
  -webkit-text-fill-color: var(--dex-okd-input-search-reversed-hover-placeholder-color);
  color: var(--dex-okd-input-search-reversed-hover-placeholder-color)
}

.dex-input-reversed.dex-input-search.focus .dex-input-box {
  background: var(--dex-okd-input-search-reversed-focus-background);
  border: thin solid var(--dex-okd-input-search-reversed-focus-border-color);
  box-shadow: var(--dex-okd-input-search-reversed-focus-shadow)
}

.dex-input-reversed.dex-input-search.focus .dex-input-box .dex-input-input {
  -webkit-text-fill-color: var(--dex-okd-input-search-reversed-focus-text-color);
  caret-color: var(--dex-okd-input-search-reversed-focus-caret-color);
  color: var(--dex-okd-input-search-reversed-focus-text-color)
}

.dex-input-reversed.dex-input-search.focus .dex-input-box .dex-input-input::-webkit-input-placeholder {
  -webkit-text-fill-color: var(--dex-okd-input-search-reversed-focus-placeholder-color);
  color: var(--dex-okd-input-search-reversed-focus-placeholder-color)
}

.dex-input-reversed.dex-input-search.focus .dex-input-box .dex-input-input:-moz-placeholder {
  -webkit-text-fill-color: var(--dex-okd-input-search-reversed-focus-placeholder-color);
  color: var(--dex-okd-input-search-reversed-focus-placeholder-color);
  opacity: 1
}

.dex-input-reversed.dex-input-search.focus .dex-input-box .dex-input-input::-ms-input-placeholder {
  -webkit-text-fill-color: var(--dex-okd-input-search-reversed-focus-placeholder-color);
  color: var(--dex-okd-input-search-reversed-focus-placeholder-color)
}

.dex-input-reversed.dex-input-search.disabled .dex-input-box {
  background: var(--dex-okd-input-search-reversed-disabled-background);
  border: thin solid var(--dex-okd-input-search-reversed-disabled-border-color);
  box-shadow: var(--dex-okd-input-search-reversed-disabled-shadow)
}

.dex-input-reversed.dex-input-search.disabled .dex-input-box .dex-input-input {
  -webkit-text-fill-color: var(--dex-okd-input-search-reversed-disabled-text-color);
  caret-color: var(--dex-okd-input-search-reversed-disabled-caret-color);
  color: var(--dex-okd-input-search-reversed-disabled-text-color)
}

.dex-input-reversed.dex-input-search.disabled .dex-input-box .dex-input-input::-webkit-input-placeholder {
  -webkit-text-fill-color: var(--dex-okd-input-search-reversed-disabled-placeholder-color);
  color: var(--dex-okd-input-search-reversed-disabled-placeholder-color)
}

.dex-input-reversed.dex-input-search.disabled .dex-input-box .dex-input-input:-moz-placeholder {
  -webkit-text-fill-color: var(--dex-okd-input-search-reversed-disabled-placeholder-color);
  color: var(--dex-okd-input-search-reversed-disabled-placeholder-color);
  opacity: 1
}

.dex-input-reversed.dex-input-search.disabled .dex-input-box .dex-input-input::-ms-input-placeholder {
  -webkit-text-fill-color: var(--dex-okd-input-search-reversed-disabled-placeholder-color);
  color: var(--dex-okd-input-search-reversed-disabled-placeholder-color)
}

.dex-input-reversed.dex-input-search.error .dex-input-box {
  background: var(--dex-okd-input-search-reversed-error-background);
  border: thin solid var(--dex-okd-input-search-reversed-error-border-color);
  box-shadow: var(--dex-okd-input-search-reversed-error-shadow)
}

.dex-input-reversed.dex-input-search.error .dex-input-box .dex-input-input {
  -webkit-text-fill-color: var(--dex-okd-input-search-reversed-error-text-color);
  caret-color: var(--dex-okd-input-search-reversed-error-caret-color);
  color: var(--dex-okd-input-search-reversed-error-text-color)
}

.dex-input-reversed.dex-input-search.error .dex-input-box .dex-input-input::-webkit-input-placeholder {
  -webkit-text-fill-color: var(--dex-okd-input-search-reversed-error-placeholder-color);
  color: var(--dex-okd-input-search-reversed-error-placeholder-color)
}

.dex-input-reversed.dex-input-search.error .dex-input-box .dex-input-input:-moz-placeholder {
  -webkit-text-fill-color: var(--dex-okd-input-search-reversed-error-placeholder-color);
  color: var(--dex-okd-input-search-reversed-error-placeholder-color);
  opacity: 1
}

.dex-input-reversed.dex-input-search.error .dex-input-box .dex-input-input::-ms-input-placeholder {
  -webkit-text-fill-color: var(--dex-okd-input-search-reversed-error-placeholder-color);
  color: var(--dex-okd-input-search-reversed-error-placeholder-color)
}

.dex-input:hover .dex-input-number-suffix:not(.operation-always) {
  opacity: 1
}

.dex-input-number-inner {
  overflow: hidden
}

.dex-input-number-suffix {
  align-items: center;
  border-left: 1px solid var(--dex-okd-input-number-suffix-border-color, var(--dex-okd-input-default-border-color));
  cursor: pointer;
  display: flex;
  flex-direction: column;
  height: 100%;
  justify-content: center;
  line-height: 0;
  margin-left: 6px;
  overflow: hidden;
  text-align: center;
  transition: opacity .5s;
  width: 24px
}

.dex-input-number-suffix:not(.operation-always) {
  opacity: 0
}

.dex-input-number-suffix-part {
  align-items: center;
  background: var(--dex-okd-input-number-default-add-icon-background);
  box-sizing: border-box;
  display: flex;
  flex: 1 1;
  justify-content: center;
  width: 100%
}

.dex-input-number-suffix-part .icon {
  color: var(--dex-okd-input-number-default-add-icon-color);
  font-size: 13px
}

.dex-input-number-suffix-part .hover,
.dex-input-number-suffix-part:not(.dex-input-number-suffix-part-disabled):hover {
  background: var(--dex-okd-input-number-hover-add-icon-background)
}

.dex-input-number-suffix-part .hover .icon,
.dex-input-number-suffix-part:not(.dex-input-number-suffix-part-disabled):hover .icon {
  color: var(--dex-okd-input-number-hover-add-icon-color)
}

.dex-input-number-suffix-part .active,
.dex-input-number-suffix-part:not(.dex-input-number-suffix-part-disabled):active {
  background: var(--dex-okd-input-number-active-add-icon-background)
}

.dex-input-number-suffix-part .active .icon,
.dex-input-number-suffix-part:not(.dex-input-number-suffix-part-disabled):active .icon {
  color: var(--dex-okd-input-number-active-add-icon-color)
}

.dex-input-number-suffix-part-disabled {
  cursor: not-allowed
}

.dex-input-number-suffix-line {
  background: var(--dex-okd-input-default-border-color);
  background: var(--dex-okd-input-number-suffix-border-color, var(--dex-okd-input-default-border-color));
  height: 1px;
  width: 100%
}

.dex-input-number-suffix .up {
  transform: rotate(180deg)
}

.dex-input-number-localization {
  text-align: right
}

.dex-input-number-localization-percent {
  color: var(--dex-okd-input-default-text-color);
  display: inline-block
}

.dex-input-xl .dex-input-number-suffix.xl {
  border-bottom-right-radius: calc(var(--dex-okd-input-xl-border-radius) - 1px);
  border-top-right-radius: calc(var(--dex-okd-input-xl-border-radius) - 1px)
}

.dex-input-lg .dex-input-number-suffix.lg {
  border-bottom-right-radius: calc(var(--dex-okd-input-lg-border-radius) - 1px);
  border-top-right-radius: calc(var(--dex-okd-input-lg-border-radius) - 1px)
}

.dex-input-xs .dex-input-number-suffix.xs {
  border-bottom-right-radius: calc(var(--dex-okd-input-xs-border-radius) - 1px);
  border-top-right-radius: calc(var(--dex-okd-input-xs-border-radius) - 1px)
}

.dex-input-sm .dex-input-number-suffix.sm {
  border-bottom-right-radius: calc(var(--dex-okd-input-sm-border-radius) - 1px);
  border-top-right-radius: calc(var(--dex-okd-input-sm-border-radius) - 1px)
}

.dex-input-md .dex-input-number-suffix.md {
  border-bottom-right-radius: calc(var(--dex-okd-input-md-border-radius) - 1px);
  border-top-right-radius: calc(var(--dex-okd-input-md-border-radius) - 1px)
}

.dex-label {
  display: flex;
  width: 100%
}

.dex-label.top-right {
  justify-content: flex-end
}

.dex-label.top-between {
  justify-content: space-between
}

.dex-label-text {
  color: var(--dex-okd-input-label-color);
  font-weight: 500
}

.dex-label-action {
  color: var(--dex-okd-input-action-color);
  cursor: pointer;
  font-weight: 500
}

.dex-label.label-xl .dex-label-text {
  font-size: var(--dex-okd-input-xl-label-font-size);
  line-height: var(--dex-okd-input-xl-label-line-height);
  margin-bottom: 6px;
  margin-bottom: var(--dex-okd-input-xl-label-margin, 6px)
}

.dex-label.label-xl .dex-label-action {
  font-size: var(--dex-okd-input-xl-action-font-size);
  line-height: var(--dex-okd-input-xl-action-line-height);
  margin-bottom: 6px;
  margin-bottom: var(--dex-okd-input-xl-label-margin, 6px)
}

.dex-label.label-xl .dex-label-place {
  min-height: var(--dex-okd-input-xl-label-line-height)
}

.dex-label.label-lg .dex-label-text {
  font-size: var(--dex-okd-input-lg-label-font-size);
  line-height: var(--dex-okd-input-lg-label-line-height);
  margin-bottom: 6px;
  margin-bottom: var(--dex-okd-input-lg-label-margin, 6px)
}

.dex-label.label-lg .dex-label-action {
  font-size: var(--dex-okd-input-lg-action-font-size);
  line-height: var(--dex-okd-input-lg-action-line-height);
  margin-bottom: 6px;
  margin-bottom: var(--dex-okd-input-lg-label-margin, 6px)
}

.dex-label.label-lg .dex-label-place {
  min-height: var(--dex-okd-input-lg-label-line-height)
}

.dex-label.label-xs .dex-label-text {
  font-size: var(--dex-okd-input-xs-label-font-size);
  line-height: var(--dex-okd-input-xs-label-line-height);
  margin-bottom: 4px;
  margin-bottom: var(--dex-okd-input-xs-label-margin, 4px)
}

.dex-label.label-xs .dex-label-action {
  font-size: var(--dex-okd-input-xs-action-font-size);
  line-height: var(--dex-okd-input-xs-action-line-height);
  margin-bottom: 4px;
  margin-bottom: var(--dex-okd-input-xs-label-margin, 4px)
}

.dex-label.label-xs .dex-label-place {
  min-height: var(--dex-okd-input-xs-label-line-height)
}

.dex-label.label-sm .dex-label-text {
  font-size: var(--dex-okd-input-sm-label-font-size);
  line-height: var(--dex-okd-input-sm-label-line-height);
  margin-bottom: 4px;
  margin-bottom: var(--dex-okd-input-sm-label-margin, 4px)
}

.dex-label.label-sm .dex-label-action {
  font-size: var(--dex-okd-input-sm-action-font-size);
  line-height: var(--dex-okd-input-sm-action-line-height);
  margin-bottom: 4px;
  margin-bottom: var(--dex-okd-input-sm-label-margin, 4px)
}

.dex-label.label-sm .dex-label-place {
  min-height: var(--dex-okd-input-sm-label-line-height)
}

.dex-label.label-md .dex-label-text {
  font-size: var(--dex-okd-input-md-label-font-size);
  line-height: var(--dex-okd-input-md-label-line-height);
  margin-bottom: 4px;
  margin-bottom: var(--dex-okd-input-md-label-margin, 4px)
}

.dex-label.label-md .dex-label-action {
  font-size: var(--dex-okd-input-md-action-font-size);
  line-height: var(--dex-okd-input-md-action-line-height);
  margin-bottom: 4px;
  margin-bottom: var(--dex-okd-input-md-label-margin, 4px)
}

.dex-label.label-md .dex-label-place {
  min-height: var(--dex-okd-input-md-label-line-height)
}

.dex-input-caret-color {
  caret-color: var(--dex-okd-input-focus-caret-color)
}

.dex-input-caret-color input[type=search]::-webkit-search-cancel-button {
  -webkit-appearance: none;
  appearance: none
}

.dex-input-caret-color input[type=search]::-moz-search-cancel-button {
  -moz-appearance: none;
  appearance: none
}

.dex-input-caret-color input::-ms-clear,
.dex-input-caret-color input::-ms-reveal {
  display: none
}

.dex-input-caret-color input::-o-clear {
  display: none
}

.dex-input {
  align-items: flex-start;
  display: flex;
  flex-direction: column;
  position: relative
}

.dex-input input[type=search]::-webkit-search-cancel-button {
  -webkit-appearance: none;
  appearance: none
}

.dex-input input[type=search]::-moz-search-cancel-button {
  -moz-appearance: none;
  appearance: none
}

.dex-input input::-ms-clear,
.dex-input input::-ms-reveal {
  display: none
}

.dex-input input::-o-clear {
  display: none
}

.dex-input * {
  box-sizing: border-box
}

.dex-input-prefix,
.dex-input-suffix {
  align-items: center;
  display: flex;
  flex-shrink: 1;
  white-space: nowrap
}

.dex-input-input {
  background: transparent;
  border: none;
  color: var(--dex-okd-input-default-text-color);
  flex-grow: 1;
  font-family: inherit;
  height: 100%;
  outline: none;
  width: 100%
}

.dex-input-input::-webkit-input-placeholder {
  -webkit-text-fill-color: var(--dex-okd-input-default-placeholder-color);
  color: var(--dex-okd-input-default-placeholder-color)
}

.dex-input-input:-moz-placeholder {
  -webkit-text-fill-color: var(--dex-okd-input-default-placeholder-color);
  color: var(--dex-okd-input-default-placeholder-color);
  opacity: 1
}

.dex-input-input::-ms-input-placeholder {
  -webkit-text-fill-color: var(--dex-okd-input-default-placeholder-color);
  color: var(--dex-okd-input-default-placeholder-color)
}

.dex-input-input:-webkit-autofill {
  -webkit-text-fill-color: var(--dex-okd-input-default-text-color) !important;
  border: none;
  -webkit-box-shadow: 0 0 0 30px var(--dex-okd-input-default-background) inset
}

.dex-input-input.input-textarea {
  box-shadow: none;
  outline: none;
  resize: none
}

.dex-input-custom-placeholder {
  position: relative;
  width: 100%
}

.dex-input-ellipsis {
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap
}

.dex-input-placeholder {
  bottom: 0;
  color: var(--dex-okd-input-default-placeholder-color);
  left: 0;
  pointer-events: none;
  position: absolute;
  right: 0;
  top: 50%;
  transform: translateY(-50%)
}

.dex-input-tips-box {
  display: flex;
  width: 100%
}

.dex-input-error {
  color: var(--dex-okd-input-error-tips-color)
}

.dex-input-tips {
  display: inline-block
}

.dex-input-help-text,
.dex-input-tips {
  color: var(--dex-okd-input-tips-text-color)
}

.dex-input-help-text {
  flex-grow: 1;
  flex-shrink: 0;
  text-align: right
}

.dex-input.hover,
.dex-input:hover {
  cursor: text
}

.dex-input.hover .dex-input-box,
.dex-input:hover .dex-input-box {
  background: var(--dex-okd-input-hover-background);
  border: thin solid var(--dex-okd-input-hover-border-color);
  box-shadow: var(--dex-okd-input-hover-shadow)
}

.dex-input.hover .dex-input-box .dex-input-input,
.dex-input:hover .dex-input-box .dex-input-input {
  -webkit-text-fill-color: var(--dex-okd-input-hover-text-color);
  caret-color: var(--dex-okd-input-hover-caret-color);
  color: var(--dex-okd-input-hover-text-color)
}

.dex-input.hover .dex-input-box .dex-input-input::-webkit-input-placeholder,
.dex-input:hover .dex-input-box .dex-input-input::-webkit-input-placeholder {
  -webkit-text-fill-color: var(--dex-okd-input-hover-placeholder-color);
  color: var(--dex-okd-input-hover-placeholder-color)
}

.dex-input.hover .dex-input-box .dex-input-input:-moz-placeholder,
.dex-input:hover .dex-input-box .dex-input-input:-moz-placeholder {
  -webkit-text-fill-color: var(--dex-okd-input-hover-placeholder-color);
  color: var(--dex-okd-input-hover-placeholder-color);
  opacity: 1
}

.dex-input.hover .dex-input-box .dex-input-input::-ms-input-placeholder,
.dex-input:hover .dex-input-box .dex-input-input::-ms-input-placeholder {
  -webkit-text-fill-color: var(--dex-okd-input-hover-placeholder-color);
  color: var(--dex-okd-input-hover-placeholder-color)
}

.dex-input.focus .dex-input-box {
  background: var(--dex-okd-input-focus-background);
  border: thin solid var(--dex-okd-input-focus-border-color);
  box-shadow: var(--dex-okd-input-focus-shadow)
}

.dex-input.focus .dex-input-box .dex-input-input {
  -webkit-text-fill-color: var(--dex-okd-input-focus-text-color);
  caret-color: var(--dex-okd-input-focus-caret-color);
  color: var(--dex-okd-input-focus-text-color)
}

.dex-input.focus .dex-input-box .dex-input-input::-webkit-input-placeholder {
  -webkit-text-fill-color: var(--dex-okd-input-focus-placeholder-color);
  color: var(--dex-okd-input-focus-placeholder-color)
}

.dex-input.focus .dex-input-box .dex-input-input:-moz-placeholder {
  -webkit-text-fill-color: var(--dex-okd-input-focus-placeholder-color);
  color: var(--dex-okd-input-focus-placeholder-color);
  opacity: 1
}

.dex-input.focus .dex-input-box .dex-input-input::-ms-input-placeholder {
  -webkit-text-fill-color: var(--dex-okd-input-focus-placeholder-color);
  color: var(--dex-okd-input-focus-placeholder-color)
}

.dex-input.readonly .dex-input-box {
  background: var(--dex-okd-input-default-background);
  background: var(--dex-okd-input-readonly-background, var(--dex-okd-input-default-background));
  border: thin solid var(--dex-okd-input-readonly-border-color, var(--dex-okd-input-default-border-color));
  box-shadow: var(--dex-okd-input-default-shadow);
  box-shadow: var(--dex-okd-input-readonly-shadow, var(--dex-okd-input-default-shadow))
}

.dex-input.readonly .dex-input-box .dex-input-input {
  -webkit-text-fill-color: var(--dex-okd-input-default-text-color);
  -webkit-text-fill-color: var(--dex-okd-input-readonly-text-color, var(--dex-okd-input-default-text-color));
  caret-color: var(--dex-okd-input-default-caret-color);
  caret-color: var(--dex-okd-input-readonly-caret-color, var(--dex-okd-input-default-caret-color));
  color: var(--dex-okd-input-default-text-color);
  color: var(--dex-okd-input-readonly-text-color, var(--dex-okd-input-default-text-color))
}

.dex-input.readonly .dex-input-box .dex-input-input::-webkit-input-placeholder {
  -webkit-text-fill-color: var(--dex-okd-input-default-placeholder-color);
  -webkit-text-fill-color: var(--dex-okd-input-readonly-placeholder-color, var(--dex-okd-input-default-placeholder-color));
  color: var(--dex-okd-input-default-placeholder-color);
  color: var(--dex-okd-input-readonly-placeholder-color, var(--dex-okd-input-default-placeholder-color))
}

.dex-input.readonly .dex-input-box .dex-input-input:-moz-placeholder {
  -webkit-text-fill-color: var(--dex-okd-input-default-placeholder-color);
  -webkit-text-fill-color: var(--dex-okd-input-readonly-placeholder-color, var(--dex-okd-input-default-placeholder-color));
  color: var(--dex-okd-input-default-placeholder-color);
  color: var(--dex-okd-input-readonly-placeholder-color, var(--dex-okd-input-default-placeholder-color));
  opacity: 1
}

.dex-input.readonly .dex-input-box .dex-input-input::-ms-input-placeholder {
  -webkit-text-fill-color: var(--dex-okd-input-default-placeholder-color);
  -webkit-text-fill-color: var(--dex-okd-input-readonly-placeholder-color, var(--dex-okd-input-default-placeholder-color));
  color: var(--dex-okd-input-default-placeholder-color);
  color: var(--dex-okd-input-readonly-placeholder-color, var(--dex-okd-input-default-placeholder-color))
}

.dex-input.readonly.focus .dex-input-box {
  border-color: var(--dex-okd-input-focus-border-color)
}

.dex-input.disabled {
  cursor: not-allowed
}

.dex-input.disabled .dex-input-box {
  background: var(--dex-okd-input-disabled-background);
  border: thin solid var(--dex-okd-input-disabled-border-color);
  box-shadow: var(--dex-okd-input-disabled-shadow)
}

.dex-input.disabled .dex-input-box .dex-input-input {
  -webkit-text-fill-color: var(--dex-okd-input-disabled-text-color);
  caret-color: var(--dex-okd-input-disabled-caret-color);
  color: var(--dex-okd-input-disabled-text-color)
}

.dex-input.disabled .dex-input-box .dex-input-input::-webkit-input-placeholder {
  -webkit-text-fill-color: var(--dex-okd-input-disabled-placeholder-color);
  color: var(--dex-okd-input-disabled-placeholder-color)
}

.dex-input.disabled .dex-input-box .dex-input-input:-moz-placeholder {
  -webkit-text-fill-color: var(--dex-okd-input-disabled-placeholder-color);
  color: var(--dex-okd-input-disabled-placeholder-color);
  opacity: 1
}

.dex-input.disabled .dex-input-box .dex-input-input::-ms-input-placeholder {
  -webkit-text-fill-color: var(--dex-okd-input-disabled-placeholder-color);
  color: var(--dex-okd-input-disabled-placeholder-color)
}

.dex-input.disabled .dex-input-input {
  cursor: not-allowed;
  opacity: 1
}

.dex-input.disabled .dex-input-input:-webkit-autofill {
  -webkit-text-fill-color: var(--dex-okd-input-disabled-text-color) !important;
  -webkit-box-shadow: 0 0 0 30px var(--dex-okd-input-disabled-background) inset
}

.dex-input.error .dex-input-box {
  background: var(--dex-okd-input-error-background);
  border: thin solid var(--dex-okd-input-error-border-color);
  box-shadow: var(--dex-okd-input-error-shadow)
}

.dex-input.error .dex-input-box .dex-input-input {
  -webkit-text-fill-color: var(--dex-okd-input-error-text-color);
  caret-color: var(--dex-okd-input-error-caret-color);
  color: var(--dex-okd-input-error-text-color)
}

.dex-input.error .dex-input-box .dex-input-input::-webkit-input-placeholder {
  -webkit-text-fill-color: var(--dex-okd-input-error-placeholder-color);
  color: var(--dex-okd-input-error-placeholder-color)
}

.dex-input.error .dex-input-box .dex-input-input:-moz-placeholder {
  -webkit-text-fill-color: var(--dex-okd-input-error-placeholder-color);
  color: var(--dex-okd-input-error-placeholder-color);
  opacity: 1
}

.dex-input.error .dex-input-box .dex-input-input::-ms-input-placeholder {
  -webkit-text-fill-color: var(--dex-okd-input-error-placeholder-color);
  color: var(--dex-okd-input-error-placeholder-color)
}

.dex-input.error .dex-input-error {
  display: inline-block
}

.dex-input.no-border .dex-input-box {
  background: transparent;
  border: thin solid transparent;
  box-shadow: none
}

.dex-input-textarea-resize-virtual-dom::-webkit-scrollbar {
  display: none;
  height: 0;
  width: 0
}

.dex-input-box {
  align-items: center;
  background: var(--dex-okd-input-default-background);
  border: thin solid var(--dex-okd-input-default-border-color);
  box-shadow: var(--dex-okd-input-default-shadow);
  display: flex;
  transition: border-color .3s, box-shadow .3s;
  width: 100%
}

.dex-input-xl>.dex-input-box {
  border-radius: var(--dex-okd-input-xl-border-radius);
  height: var(--dex-okd-input-xl-height);
  padding: 0 8px;
  padding: 0 var(--dex-okd-input-xl-padding-horizontal, 8px)
}

.dex-input-xl>.dex-input-box.auto-size {
  height: -webkit-fit-content;
  height: -moz-fit-content;
  height: fit-content;
  min-height: var(--dex-okd-input-xl-height)
}

.dex-input-xl>.dex-input-box.no-padding-left {
  padding-left: 0
}

.dex-input-xl>.dex-input-box.no-padding-right {
  padding-right: 0
}

.dex-input-xl>.dex-input-box.ta {
  height: 100%;
  padding: 8px
}

.dex-input-xl>.dex-input-box.auto-resize-auto-height {
  height: -webkit-fit-content;
  height: -moz-fit-content;
  height: fit-content;
  min-height: var(--dex-okd-input-xl-height)
}

.dex-input-xl>.dex-input-box.input-circle {
  border-radius: 100px
}

.dex-input-xl .dex-input-input {
  font-size: var(--dex-okd-input-xl-text-font-size);
  padding: calc(var(--dex-okd-input-xl-height)/2 - var(--dex-okd-input-xl-text-font-size)/2 - 2px) 0
}

.dex-input-xl .dex-input-input::-webkit-input-placeholder {
  font-size: var(--dex-okd-input-xl-text-font-size);
  font-weight: 400;
  text-overflow: ellipsis
}

.dex-input-xl .dex-input-input:-moz-placeholder {
  font-size: var(--dex-okd-input-xl-text-font-size);
  font-weight: 400;
  text-overflow: ellipsis
}

.dex-input-xl .dex-input-input::-ms-input-placeholder {
  font-size: var(--dex-okd-input-xl-text-font-size);
  font-weight: 400;
  text-overflow: ellipsis
}

.dex-input-xl .dex-input-input.ta {
  padding: 0
}

.dex-input-xl .dex-input-input.textarea-auto-resize {
  line-height: var(--dex-okd-input-xl-text-font-size)
}

.dex-input-xl .dex-input-placeholder {
  font-size: var(--dex-okd-input-xl-text-font-size);
  height: calc(var(--dex-okd-input-xl-text-font-size) + 2px);
  line-height: calc(var(--dex-okd-input-xl-text-font-size) + 2px)
}

.dex-input-xl .dex-input.dex-input-place-mode .dex-input-tips-box {
  min-height: calc(var(--dex-okd-input-xl-tip-line-height) + 6px);
  min-height: calc(var(--dex-okd-input-xl-tip-line-height) + var(--dex-okd-input-xl-tip-margin, 6px))
}

.dex-input-xl .dex-input-error {
  font-size: var(--dex-okd-input-xl-error-font-size);
  line-height: var(--dex-okd-input-xl-error-line-height);
  margin-top: 6px;
  margin-top: var(--dex-okd-input-xl-tip-margin, 6px)
}

.dex-input-xl .dex-input-help-text,
.dex-input-xl .dex-input-tips {
  font-size: var(--dex-okd-input-xl-tip-font-size);
  line-height: var(--dex-okd-input-xl-tip-line-height);
  margin-top: 6px;
  margin-top: var(--dex-okd-input-xl-tip-margin, 6px)
}

.dex-input-lg>.dex-input-box {
  border-radius: var(--dex-okd-input-lg-border-radius);
  height: var(--dex-okd-input-lg-height);
  padding: 0 8px;
  padding: 0 var(--dex-okd-input-lg-padding-horizontal, 8px)
}

.dex-input-lg>.dex-input-box.auto-size {
  height: -webkit-fit-content;
  height: -moz-fit-content;
  height: fit-content;
  min-height: var(--dex-okd-input-lg-height)
}

.dex-input-lg>.dex-input-box.no-padding-left {
  padding-left: 0
}

.dex-input-lg>.dex-input-box.no-padding-right {
  padding-right: 0
}

.dex-input-lg>.dex-input-box.ta {
  height: 100%;
  padding: 8px
}

.dex-input-lg>.dex-input-box.auto-resize-auto-height {
  height: -webkit-fit-content;
  height: -moz-fit-content;
  height: fit-content;
  min-height: var(--dex-okd-input-lg-height)
}

.dex-input-lg>.dex-input-box.input-circle {
  border-radius: 100px
}

.dex-input-lg .dex-input-input {
  font-size: var(--dex-okd-input-lg-text-font-size);
  padding: calc(var(--dex-okd-input-lg-height)/2 - var(--dex-okd-input-lg-text-font-size)/2 - 2px) 0
}

.dex-input-lg .dex-input-input::-webkit-input-placeholder {
  font-size: var(--dex-okd-input-lg-text-font-size);
  font-weight: 400;
  text-overflow: ellipsis
}

.dex-input-lg .dex-input-input:-moz-placeholder {
  font-size: var(--dex-okd-input-lg-text-font-size);
  font-weight: 400;
  text-overflow: ellipsis
}

.dex-input-lg .dex-input-input::-ms-input-placeholder {
  font-size: var(--dex-okd-input-lg-text-font-size);
  font-weight: 400;
  text-overflow: ellipsis
}

.dex-input-lg .dex-input-input.ta {
  padding: 0
}

.dex-input-lg .dex-input-input.textarea-auto-resize {
  line-height: var(--dex-okd-input-lg-text-font-size)
}

.dex-input-lg .dex-input-placeholder {
  font-size: var(--dex-okd-input-lg-text-font-size);
  height: calc(var(--dex-okd-input-lg-text-font-size) + 2px);
  line-height: calc(var(--dex-okd-input-lg-text-font-size) + 2px)
}

.dex-input-lg .dex-input.dex-input-place-mode .dex-input-tips-box {
  min-height: calc(var(--dex-okd-input-lg-tip-line-height) + 6px);
  min-height: calc(var(--dex-okd-input-lg-tip-line-height) + var(--dex-okd-input-lg-tip-margin, 6px))
}

.dex-input-lg .dex-input-error {
  font-size: var(--dex-okd-input-lg-error-font-size);
  line-height: var(--dex-okd-input-lg-error-line-height);
  margin-top: 6px;
  margin-top: var(--dex-okd-input-lg-tip-margin, 6px)
}

.dex-input-lg .dex-input-help-text,
.dex-input-lg .dex-input-tips {
  font-size: var(--dex-okd-input-lg-tip-font-size);
  line-height: var(--dex-okd-input-lg-tip-line-height);
  margin-top: 6px;
  margin-top: var(--dex-okd-input-lg-tip-margin, 6px)
}

.dex-input-xs>.dex-input-box {
  border-radius: var(--dex-okd-input-xs-border-radius);
  height: var(--dex-okd-input-xs-height);
  padding: 0 8px;
  padding: 0 var(--dex-okd-input-xs-padding-horizontal, 8px)
}

.dex-input-xs>.dex-input-box.auto-size {
  height: -webkit-fit-content;
  height: -moz-fit-content;
  height: fit-content;
  min-height: var(--dex-okd-input-xs-height)
}

.dex-input-xs>.dex-input-box.no-padding-left {
  padding-left: 0
}

.dex-input-xs>.dex-input-box.no-padding-right {
  padding-right: 0
}

.dex-input-xs>.dex-input-box.ta {
  height: 100%;
  padding: 8px
}

.dex-input-xs>.dex-input-box.auto-resize-auto-height {
  height: -webkit-fit-content;
  height: -moz-fit-content;
  height: fit-content;
  min-height: var(--dex-okd-input-xs-height)
}

.dex-input-xs>.dex-input-box.input-circle {
  border-radius: 100px
}

.dex-input-xs .dex-input-input {
  font-size: var(--dex-okd-input-xs-text-font-size);
  padding: calc(var(--dex-okd-input-xs-height)/2 - var(--dex-okd-input-xs-text-font-size)/2 - 2px) 0
}

.dex-input-xs .dex-input-input::-webkit-input-placeholder {
  font-size: var(--dex-okd-input-xs-text-font-size);
  font-weight: 400;
  text-overflow: ellipsis
}

.dex-input-xs .dex-input-input:-moz-placeholder {
  font-size: var(--dex-okd-input-xs-text-font-size);
  font-weight: 400;
  text-overflow: ellipsis
}

.dex-input-xs .dex-input-input::-ms-input-placeholder {
  font-size: var(--dex-okd-input-xs-text-font-size);
  font-weight: 400;
  text-overflow: ellipsis
}

.dex-input-xs .dex-input-input.ta {
  padding: 0
}

.dex-input-xs .dex-input-input.textarea-auto-resize {
  line-height: var(--dex-okd-input-xs-text-font-size)
}

.dex-input-xs .dex-input-placeholder {
  font-size: var(--dex-okd-input-xs-text-font-size);
  height: calc(var(--dex-okd-input-xs-text-font-size) + 2px);
  line-height: calc(var(--dex-okd-input-xs-text-font-size) + 2px)
}

.dex-input-xs .dex-input.dex-input-place-mode .dex-input-tips-box {
  min-height: calc(var(--dex-okd-input-xs-tip-line-height) + 4px);
  min-height: calc(var(--dex-okd-input-xs-tip-line-height) + var(--dex-okd-input-xs-tip-margin, 4px))
}

.dex-input-xs .dex-input-error {
  font-size: var(--dex-okd-input-xs-error-font-size);
  line-height: var(--dex-okd-input-xs-error-line-height);
  margin-top: 4px;
  margin-top: var(--dex-okd-input-xs-tip-margin, 4px)
}

.dex-input-xs .dex-input-help-text,
.dex-input-xs .dex-input-tips {
  font-size: var(--dex-okd-input-xs-tip-font-size);
  line-height: var(--dex-okd-input-xs-tip-line-height);
  margin-top: 4px;
  margin-top: var(--dex-okd-input-xs-tip-margin, 4px)
}

.dex-input-sm>.dex-input-box {
  border-radius: var(--dex-okd-input-sm-border-radius);
  height: var(--dex-okd-input-sm-height);
  padding: 0 8px;
  padding: 0 var(--dex-okd-input-sm-padding-horizontal, 8px)
}

.dex-input-sm>.dex-input-box.auto-size {
  height: -webkit-fit-content;
  height: -moz-fit-content;
  height: fit-content;
  min-height: var(--dex-okd-input-sm-height)
}

.dex-input-sm>.dex-input-box.no-padding-left {
  padding-left: 0
}

.dex-input-sm>.dex-input-box.no-padding-right {
  padding-right: 0
}

.dex-input-sm>.dex-input-box.ta {
  height: 100%;
  padding: 8px
}

.dex-input-sm>.dex-input-box.auto-resize-auto-height {
  height: -webkit-fit-content;
  height: -moz-fit-content;
  height: fit-content;
  min-height: var(--dex-okd-input-sm-height)
}

.dex-input-sm>.dex-input-box.input-circle {
  border-radius: 100px
}

.dex-input-sm .dex-input-input {
  font-size: var(--dex-okd-input-sm-text-font-size);
  padding: calc(var(--dex-okd-input-sm-height)/2 - var(--dex-okd-input-sm-text-font-size)/2 - 2px) 0
}

.dex-input-sm .dex-input-input::-webkit-input-placeholder {
  font-size: var(--dex-okd-input-sm-text-font-size);
  font-weight: 400;
  text-overflow: ellipsis
}

.dex-input-sm .dex-input-input:-moz-placeholder {
  font-size: var(--dex-okd-input-sm-text-font-size);
  font-weight: 400;
  text-overflow: ellipsis
}

.dex-input-sm .dex-input-input::-ms-input-placeholder {
  font-size: var(--dex-okd-input-sm-text-font-size);
  font-weight: 400;
  text-overflow: ellipsis
}

.dex-input-sm .dex-input-input.ta {
  padding: 0
}

.dex-input-sm .dex-input-input.textarea-auto-resize {
  line-height: var(--dex-okd-input-sm-text-font-size)
}

.dex-input-sm .dex-input-placeholder {
  font-size: var(--dex-okd-input-sm-text-font-size);
  height: calc(var(--dex-okd-input-sm-text-font-size) + 2px);
  line-height: calc(var(--dex-okd-input-sm-text-font-size) + 2px)
}

.dex-input-sm .dex-input.dex-input-place-mode .dex-input-tips-box {
  min-height: calc(var(--dex-okd-input-sm-tip-line-height) + 4px);
  min-height: calc(var(--dex-okd-input-sm-tip-line-height) + var(--dex-okd-input-sm-tip-margin, 4px))
}

.dex-input-sm .dex-input-error {
  font-size: var(--dex-okd-input-sm-error-font-size);
  line-height: var(--dex-okd-input-sm-error-line-height);
  margin-top: 4px;
  margin-top: var(--dex-okd-input-sm-tip-margin, 4px)
}

.dex-input-sm .dex-input-help-text,
.dex-input-sm .dex-input-tips {
  font-size: var(--dex-okd-input-sm-tip-font-size);
  line-height: var(--dex-okd-input-sm-tip-line-height);
  margin-top: 4px;
  margin-top: var(--dex-okd-input-sm-tip-margin, 4px)
}

.dex-input-md>.dex-input-box {
  border-radius: var(--dex-okd-input-md-border-radius);
  height: var(--dex-okd-input-md-height);
  padding: 0 8px;
  padding: 0 var(--dex-okd-input-md-padding-horizontal, 8px)
}

.dex-input-md>.dex-input-box.auto-size {
  height: -webkit-fit-content;
  height: -moz-fit-content;
  height: fit-content;
  min-height: var(--dex-okd-input-md-height)
}

.dex-input-md>.dex-input-box.no-padding-left {
  padding-left: 0
}

.dex-input-md>.dex-input-box.no-padding-right {
  padding-right: 0
}

.dex-input-md>.dex-input-box.ta {
  height: 100%;
  padding: 8px
}

.dex-input-md>.dex-input-box.auto-resize-auto-height {
  height: -webkit-fit-content;
  height: -moz-fit-content;
  height: fit-content;
  min-height: var(--dex-okd-input-md-height)
}

.dex-input-md>.dex-input-box.input-circle {
  border-radius: 100px
}

.dex-input-md .dex-input-input {
  font-size: var(--dex-okd-input-md-text-font-size);
  padding: calc(var(--dex-okd-input-md-height)/2 - var(--dex-okd-input-md-text-font-size)/2 - 2px) 0
}

.dex-input-md .dex-input-input::-webkit-input-placeholder {
  font-size: var(--dex-okd-input-md-text-font-size);
  font-weight: 400;
  text-overflow: ellipsis
}

.dex-input-md .dex-input-input:-moz-placeholder {
  font-size: var(--dex-okd-input-md-text-font-size);
  font-weight: 400;
  text-overflow: ellipsis
}

.dex-input-md .dex-input-input::-ms-input-placeholder {
  font-size: var(--dex-okd-input-md-text-font-size);
  font-weight: 400;
  text-overflow: ellipsis
}

.dex-input-md .dex-input-input.ta {
  padding: 0
}

.dex-input-md .dex-input-input.textarea-auto-resize {
  line-height: var(--dex-okd-input-md-text-font-size)
}

.dex-input-md .dex-input-placeholder {
  font-size: var(--dex-okd-input-md-text-font-size);
  height: calc(var(--dex-okd-input-md-text-font-size) + 2px);
  line-height: calc(var(--dex-okd-input-md-text-font-size) + 2px)
}

.dex-input-md .dex-input.dex-input-place-mode .dex-input-tips-box {
  min-height: calc(var(--dex-okd-input-md-tip-line-height) + 4px);
  min-height: calc(var(--dex-okd-input-md-tip-line-height) + var(--dex-okd-input-md-tip-margin, 4px))
}

.dex-input-md .dex-input-error {
  font-size: var(--dex-okd-input-md-error-font-size);
  line-height: var(--dex-okd-input-md-error-line-height);
  margin-top: 4px;
  margin-top: var(--dex-okd-input-md-tip-margin, 4px)
}

.dex-input-md .dex-input-help-text,
.dex-input-md .dex-input-tips {
  font-size: var(--dex-okd-input-md-tip-font-size);
  line-height: var(--dex-okd-input-md-tip-line-height);
  margin-top: 4px;
  margin-top: var(--dex-okd-input-md-tip-margin, 4px)
}

.dex-input-prefix {
  height: 100%
}

.dex-input-prefix .prefix-icon {
  color: var(--dex-okd-input-icon-color)
}

.dex-input-prefix .select {
  padding-right: 8px
}

.dex-input-suffix {
  height: 100%
}

.dex-input-suffix .suffix-icon {
  color: var(--dex-okd-input-icon-color)
}

.dex-input-suffix .clean-icon {
  cursor: pointer
}

.dex-input-suffix .clean-icon:hover {
  color: #000;
  color: var(--dex-okd-input-search-suffix-icon-hover-color, #000)
}

.dex-input-suffix .error-icon {
  color: var(--dex-okd-input-error-tips-color)
}

.dex-input-xl .dex-input-prefix .prefix-icon {
  font-size: var(--dex-okd-input-xl-icon-size);
  margin-left: 0;
  margin-right: var(--dex-okd-input-xl-icon-margin)
}

.dex-input-xl .dex-input-suffix .suffix-icon {
  font-size: var(--dex-okd-input-xl-icon-size);
  margin-left: var(--dex-okd-input-xl-icon-margin);
  margin-right: 0
}

.dex-input-lg .dex-input-prefix .prefix-icon {
  font-size: var(--dex-okd-input-lg-icon-size);
  margin-left: 0;
  margin-right: var(--dex-okd-input-lg-icon-margin)
}

.dex-input-lg .dex-input-suffix .suffix-icon {
  font-size: var(--dex-okd-input-lg-icon-size);
  margin-left: var(--dex-okd-input-lg-icon-margin);
  margin-right: 0
}

.dex-input-xs .dex-input-prefix .prefix-icon {
  font-size: var(--dex-okd-input-xs-icon-size);
  margin-left: 0;
  margin-right: var(--dex-okd-input-xs-icon-margin)
}

.dex-input-xs .dex-input-suffix .suffix-icon {
  font-size: var(--dex-okd-input-xs-icon-size);
  margin-left: var(--dex-okd-input-xs-icon-margin);
  margin-right: 0
}

.dex-input-sm .dex-input-prefix .prefix-icon {
  font-size: var(--dex-okd-input-sm-icon-size);
  margin-left: 0;
  margin-right: var(--dex-okd-input-sm-icon-margin)
}

.dex-input-sm .dex-input-suffix .suffix-icon {
  font-size: var(--dex-okd-input-sm-icon-size);
  margin-left: var(--dex-okd-input-sm-icon-margin);
  margin-right: 0
}

.dex-input-md .dex-input-prefix .prefix-icon {
  font-size: var(--dex-okd-input-md-icon-size);
  margin-left: 0;
  margin-right: var(--dex-okd-input-md-icon-margin)
}

.dex-input-md .dex-input-suffix .suffix-icon {
  font-size: var(--dex-okd-input-md-icon-size);
  margin-left: var(--dex-okd-input-md-icon-margin);
  margin-right: 0
}

.dex-loadable {
  align-items: center;
  display: flex;
  height: 100%;
  justify-content: center;
  width: 100%
}

.dex-loadable .frendly-tips {
  min-width: 300px;
  text-align: center
}

.dex-loadable .margin-t-md {
  margin-top: 10px
}

.dex-loadable-img {
  height: 96px
}

@keyframes loadingLine {
  to {
    left: 100%
  }
}

.dex-loader-line {
  background: var(--dex-okd-loader-line-inactive-color);
  height: var(--dex-okd-loader-line-size);
  overflow: hidden;
  position: relative;
  width: 100%
}

.dex-loader-line,
.dex-loader-line .dex-loader-mark {
  border-radius: calc(var(--dex-okd-loader-line-size)/2)
}

.dex-loader-line .dex-loader-mark {
  background: var(--dex-okd-loader-line-active-color);
  height: 100%
}

.dex-loader-line.dex-loader-loading .dex-loader-mark {
  animation: loadingLine 2s linear infinite;
  left: -25%;
  position: absolute;
  top: 0
}

@keyframes okui-loader-rotation {
  0% {
    transform: rotate(0deg)
  }

  to {
    transform: rotate(1turn)
  }
}

.dex-loader-box {
  position: relative
}

.dex-loader-mask {
  align-items: center;
  background: var(--dex-okd-loader-mask-bg-color);
  display: flex;
  flex-direction: column;
  height: 100%;
  justify-content: center;
  left: 0;
  position: absolute;
  top: 0;
  width: 100%
}

.dex-loader-mask-text {
  color: var(--dex-okd-loader-mask-text-color);
  font-size: var(--dex-okd-loader-mask-text-font-size);
  font-weight: var(--dex-okd-loader-mask-text-font-weight);
  line-height: var(--dex-okd-loader-mask-text-line-height);
  margin-top: var(--dex-okd-loader-mask-text-margin-top)
}

.dex-loader-spin {
  animation: okui-loader-rotation 1s linear infinite;
  background-color: initial;
  border-style: solid;
  box-sizing: border-box;
  display: inline-flex
}

.dex-loader-spin-xl {
  border-radius: var(--dex-okd-loader-circle-xl-size);
  border-width: var(--dex-okd-loader-circle-xl-track-width);
  height: var(--dex-okd-loader-circle-xl-size);
  width: var(--dex-okd-loader-circle-xl-size)
}

.dex-loader-spin-lg {
  border-radius: var(--dex-okd-loader-circle-lg-size);
  border-width: var(--dex-okd-loader-circle-lg-track-width);
  height: var(--dex-okd-loader-circle-lg-size);
  width: var(--dex-okd-loader-circle-lg-size)
}

.dex-loader-spin-md {
  border-radius: var(--dex-okd-loader-circle-md-size);
  border-width: var(--dex-okd-loader-circle-md-track-width);
  height: var(--dex-okd-loader-circle-md-size);
  width: var(--dex-okd-loader-circle-md-size)
}

.dex-loader-spin-sm {
  border-radius: var(--dex-okd-loader-circle-sm-size);
  border-width: var(--dex-okd-loader-circle-sm-track-width);
  height: var(--dex-okd-loader-circle-sm-size);
  width: var(--dex-okd-loader-circle-sm-size)
}

.dex-loader-spin-primary {
  border-color: var(--dex-okd-loader-primary-inactive-color);
  border-top-color: var(--dex-okd-loader-primary-active-color)
}

.dex-loader-spin-neutral {
  border-color: var(--dex-okd-loader-neutral-inactive-color);
  border-top-color: var(--dex-okd-loader-neutral-active-color)
}

.dex-loader-inner-circle {
  border: none;
  border-radius: 0;
  overflow: hidden;
  transform: rotate(180deg)
}

.dex-loader-inner-fill-primary {
  background: var(--dex-okd-loader-primary-active-color)
}

.dex-loader-inner-fill-neutral {
  background: var(--dex-okd-loader-neutral-active-color)
}

.dex-loader-inner-track-primary {
  background: var(--dex-okd-loader-primary-inactive-color)
}

.dex-loader-inner-track-neutral {
  background: var(--dex-okd-loader-neutral-inactive-color)
}

.dex-loader-inner-track-right {
  height: 100%;
  overflow: hidden;
  position: absolute;
  right: 0
}

.dex-loader-inner-track-right-content {
  content: "";
  height: 100%;
  position: absolute;
  transform: rotate(0deg);
  transform-origin: left center;
  width: 100%
}

.dex-loader-inner-track-left {
  height: 100%;
  overflow: hidden;
  position: absolute
}

.dex-loader-inner-track-left-content {
  content: "";
  height: 100%;
  position: absolute;
  transform: rotate(0deg);
  transform-origin: right center;
  width: 100%
}

.dex-loader-inner-xl {
  border-radius: var(--dex-okd-loader-circle-xl-size);
  height: var(--dex-okd-loader-circle-xl-size);
  width: var(--dex-okd-loader-circle-xl-size)
}

.dex-loader-inner-xl-cover {
  background-color: var(--dex-okd-loader-circle-cover-background);
  border-radius: 100%;
  height: calc(var(--dex-okd-loader-circle-xl-size) - var(--dex-okd-loader-circle-xl-track-width)*2);
  left: 50%;
  position: absolute;
  top: 50%;
  transform: translate(-50%, -50%);
  width: calc(var(--dex-okd-loader-circle-xl-size) - var(--dex-okd-loader-circle-xl-track-width)*2)
}

.dex-loader-inner-track-xl {
  width: calc(var(--dex-okd-loader-circle-xl-size)/2)
}

.dex-loader-inner-track-xl-inner-track-left-content {
  border-radius: calc(var(--dex-okd-loader-circle-xl-size)/2) 0 0 calc(var(--dex-okd-loader-circle-xl-size)/2);
  width: 100%
}

.dex-loader-inner-track-xl-inner-track-right-content {
  border-radius: 0 calc(var(--dex-okd-loader-circle-xl-size)/2) calc(var(--dex-okd-loader-circle-xl-size)/2) 0;
  width: 100%
}

.dex-loader-inner-lg {
  border-radius: var(--dex-okd-loader-circle-lg-size);
  height: var(--dex-okd-loader-circle-lg-size);
  width: var(--dex-okd-loader-circle-lg-size)
}

.dex-loader-inner-lg-cover {
  background-color: var(--dex-okd-loader-circle-cover-background);
  border-radius: 100%;
  height: calc(var(--dex-okd-loader-circle-lg-size) - var(--dex-okd-loader-circle-lg-track-width)*2);
  left: 50%;
  position: absolute;
  top: 50%;
  transform: translate(-50%, -50%);
  width: calc(var(--dex-okd-loader-circle-lg-size) - var(--dex-okd-loader-circle-lg-track-width)*2)
}

.dex-loader-inner-track-lg {
  width: calc(var(--dex-okd-loader-circle-lg-size)/2)
}

.dex-loader-inner-track-lg-inner-track-left-content {
  border-radius: calc(var(--dex-okd-loader-circle-lg-size)/2) 0 0 calc(var(--dex-okd-loader-circle-lg-size)/2);
  width: 100%
}

.dex-loader-inner-track-lg-inner-track-right-content {
  border-radius: 0 calc(var(--dex-okd-loader-circle-lg-size)/2) calc(var(--dex-okd-loader-circle-lg-size)/2) 0;
  width: 100%
}

.dex-loader-inner-md {
  border-radius: var(--dex-okd-loader-circle-md-size);
  height: var(--dex-okd-loader-circle-md-size);
  width: var(--dex-okd-loader-circle-md-size)
}

.dex-loader-inner-md-cover {
  background-color: var(--dex-okd-loader-circle-cover-background);
  border-radius: 100%;
  height: calc(var(--dex-okd-loader-circle-md-size) - var(--dex-okd-loader-circle-md-track-width)*2);
  left: 50%;
  position: absolute;
  top: 50%;
  transform: translate(-50%, -50%);
  width: calc(var(--dex-okd-loader-circle-md-size) - var(--dex-okd-loader-circle-md-track-width)*2)
}

.dex-loader-inner-track-md {
  width: calc(var(--dex-okd-loader-circle-md-size)/2)
}

.dex-loader-inner-track-md-inner-track-left-content {
  border-radius: calc(var(--dex-okd-loader-circle-md-size)/2) 0 0 calc(var(--dex-okd-loader-circle-md-size)/2);
  width: 100%
}

.dex-loader-inner-track-md-inner-track-right-content {
  border-radius: 0 calc(var(--dex-okd-loader-circle-md-size)/2) calc(var(--dex-okd-loader-circle-md-size)/2) 0;
  width: 100%
}

.dex-loader-inner-sm {
  border-radius: var(--dex-okd-loader-circle-sm-size);
  height: var(--dex-okd-loader-circle-sm-size);
  width: var(--dex-okd-loader-circle-sm-size)
}

.dex-loader-inner-sm-cover {
  background-color: var(--dex-okd-loader-circle-cover-background);
  border-radius: 100%;
  height: calc(var(--dex-okd-loader-circle-sm-size) - var(--dex-okd-loader-circle-sm-track-width)*2);
  left: 50%;
  position: absolute;
  top: 50%;
  transform: translate(-50%, -50%);
  width: calc(var(--dex-okd-loader-circle-sm-size) - var(--dex-okd-loader-circle-sm-track-width)*2)
}

.dex-loader-inner-track-sm {
  width: calc(var(--dex-okd-loader-circle-sm-size)/2)
}

.dex-loader-inner-track-sm-inner-track-left-content {
  border-radius: calc(var(--dex-okd-loader-circle-sm-size)/2) 0 0 calc(var(--dex-okd-loader-circle-sm-size)/2);
  width: 100%
}

.dex-loader-inner-track-sm-inner-track-right-content {
  border-radius: 0 calc(var(--dex-okd-loader-circle-sm-size)/2) calc(var(--dex-okd-loader-circle-sm-size)/2) 0;
  width: 100%
}

.dex-mask {
  background: rgba(0, 0, 0, .65);
  background: var(--dex-okd-dialog-window-mask-color, rgba(0, 0, 0, .65));
  bottom: 0;
  left: 0;
  position: fixed;
  right: 0;
  top: 0
}

.dex-label {
  display: flex;
  width: 100%
}

.dex-label.top-right {
  justify-content: flex-end
}

.dex-label.top-between {
  justify-content: space-between
}

.dex-label-text {
  color: var(--dex-okd-input-label-color);
  font-weight: 500
}

.dex-label-action {
  color: var(--dex-okd-input-action-color);
  cursor: pointer;
  font-weight: 500
}

.dex-label.label-xl .dex-label-text {
  font-size: var(--dex-okd-input-xl-label-font-size);
  line-height: var(--dex-okd-input-xl-label-line-height);
  margin-bottom: 6px;
  margin-bottom: var(--dex-okd-input-xl-label-margin, 6px)
}

.dex-label.label-xl .dex-label-action {
  font-size: var(--dex-okd-input-xl-action-font-size);
  line-height: var(--dex-okd-input-xl-action-line-height);
  margin-bottom: 6px;
  margin-bottom: var(--dex-okd-input-xl-label-margin, 6px)
}

.dex-label.label-xl .dex-label-place {
  min-height: var(--dex-okd-input-xl-label-line-height)
}

.dex-label.label-lg .dex-label-text {
  font-size: var(--dex-okd-input-lg-label-font-size);
  line-height: var(--dex-okd-input-lg-label-line-height);
  margin-bottom: 6px;
  margin-bottom: var(--dex-okd-input-lg-label-margin, 6px)
}

.dex-label.label-lg .dex-label-action {
  font-size: var(--dex-okd-input-lg-action-font-size);
  line-height: var(--dex-okd-input-lg-action-line-height);
  margin-bottom: 6px;
  margin-bottom: var(--dex-okd-input-lg-label-margin, 6px)
}

.dex-label.label-lg .dex-label-place {
  min-height: var(--dex-okd-input-lg-label-line-height)
}

.dex-label.label-xs .dex-label-text {
  font-size: var(--dex-okd-input-xs-label-font-size);
  line-height: var(--dex-okd-input-xs-label-line-height);
  margin-bottom: 4px;
  margin-bottom: var(--dex-okd-input-xs-label-margin, 4px)
}

.dex-label.label-xs .dex-label-action {
  font-size: var(--dex-okd-input-xs-action-font-size);
  line-height: var(--dex-okd-input-xs-action-line-height);
  margin-bottom: 4px;
  margin-bottom: var(--dex-okd-input-xs-label-margin, 4px)
}

.dex-label.label-xs .dex-label-place {
  min-height: var(--dex-okd-input-xs-label-line-height)
}

.dex-label.label-sm .dex-label-text {
  font-size: var(--dex-okd-input-sm-label-font-size);
  line-height: var(--dex-okd-input-sm-label-line-height);
  margin-bottom: 4px;
  margin-bottom: var(--dex-okd-input-sm-label-margin, 4px)
}

.dex-label.label-sm .dex-label-action {
  font-size: var(--dex-okd-input-sm-action-font-size);
  line-height: var(--dex-okd-input-sm-action-line-height);
  margin-bottom: 4px;
  margin-bottom: var(--dex-okd-input-sm-label-margin, 4px)
}

.dex-label.label-sm .dex-label-place {
  min-height: var(--dex-okd-input-sm-label-line-height)
}

.dex-label.label-md .dex-label-text {
  font-size: var(--dex-okd-input-md-label-font-size);
  line-height: var(--dex-okd-input-md-label-line-height);
  margin-bottom: 4px;
  margin-bottom: var(--dex-okd-input-md-label-margin, 4px)
}

.dex-label.label-md .dex-label-action {
  font-size: var(--dex-okd-input-md-action-font-size);
  line-height: var(--dex-okd-input-md-action-line-height);
  margin-bottom: 4px;
  margin-bottom: var(--dex-okd-input-md-label-margin, 4px)
}

.dex-label.label-md .dex-label-place {
  min-height: var(--dex-okd-input-md-label-line-height)
}

.dex-input-caret-color {
  caret-color: var(--dex-okd-input-focus-caret-color)
}

.dex-input-caret-color input[type=search]::-webkit-search-cancel-button {
  -webkit-appearance: none;
  appearance: none
}

.dex-input-caret-color input[type=search]::-moz-search-cancel-button {
  -moz-appearance: none;
  appearance: none
}

.dex-input-caret-color input::-ms-clear,
.dex-input-caret-color input::-ms-reveal {
  display: none
}

.dex-input-caret-color input::-o-clear {
  display: none
}

.dex-input {
  align-items: flex-start;
  display: flex;
  flex-direction: column;
  position: relative
}

.dex-input input[type=search]::-webkit-search-cancel-button {
  -webkit-appearance: none;
  appearance: none
}

.dex-input input[type=search]::-moz-search-cancel-button {
  -moz-appearance: none;
  appearance: none
}

.dex-input input::-ms-clear,
.dex-input input::-ms-reveal {
  display: none
}

.dex-input input::-o-clear {
  display: none
}

.dex-input * {
  box-sizing: border-box
}

.dex-input-prefix,
.dex-input-suffix {
  align-items: center;
  display: flex;
  flex-shrink: 1;
  white-space: nowrap
}

.dex-input-input {
  background: transparent;
  border: none;
  color: var(--dex-okd-input-default-text-color);
  flex-grow: 1;
  font-family: inherit;
  height: 100%;
  outline: none;
  width: 100%
}

.dex-input-input::-webkit-input-placeholder {
  -webkit-text-fill-color: var(--dex-okd-input-default-placeholder-color);
  color: var(--dex-okd-input-default-placeholder-color)
}

.dex-input-input:-moz-placeholder {
  -webkit-text-fill-color: var(--dex-okd-input-default-placeholder-color);
  color: var(--dex-okd-input-default-placeholder-color);
  opacity: 1
}

.dex-input-input::-ms-input-placeholder {
  -webkit-text-fill-color: var(--dex-okd-input-default-placeholder-color);
  color: var(--dex-okd-input-default-placeholder-color)
}

.dex-input-input:-webkit-autofill {
  -webkit-text-fill-color: var(--dex-okd-input-default-text-color) !important;
  border: none;
  -webkit-box-shadow: 0 0 0 30px var(--dex-okd-input-default-background) inset
}

.dex-input-input.input-textarea {
  box-shadow: none;
  outline: none;
  resize: none
}

.dex-input-custom-placeholder {
  position: relative;
  width: 100%
}

.dex-input-ellipsis {
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap
}

.dex-input-placeholder {
  bottom: 0;
  color: var(--dex-okd-input-default-placeholder-color);
  left: 0;
  pointer-events: none;
  position: absolute;
  right: 0;
  top: 50%;
  transform: translateY(-50%)
}

.dex-input-tips-box {
  display: flex;
  width: 100%
}

.dex-input-error {
  color: var(--dex-okd-input-error-tips-color)
}

.dex-input-tips {
  display: inline-block
}

.dex-input-help-text,
.dex-input-tips {
  color: var(--dex-okd-input-tips-text-color)
}

.dex-input-help-text {
  flex-grow: 1;
  flex-shrink: 0;
  text-align: right
}

.dex-input.hover,
.dex-input:hover {
  cursor: text
}

.dex-input.hover .dex-input-box,
.dex-input:hover .dex-input-box {
  background: var(--dex-okd-input-hover-background);
  border: thin solid var(--dex-okd-input-hover-border-color);
  box-shadow: var(--dex-okd-input-hover-shadow)
}

.dex-input.hover .dex-input-box .dex-input-input,
.dex-input:hover .dex-input-box .dex-input-input {
  -webkit-text-fill-color: var(--dex-okd-input-hover-text-color);
  caret-color: var(--dex-okd-input-hover-caret-color);
  color: var(--dex-okd-input-hover-text-color)
}

.dex-input.hover .dex-input-box .dex-input-input::-webkit-input-placeholder,
.dex-input:hover .dex-input-box .dex-input-input::-webkit-input-placeholder {
  -webkit-text-fill-color: var(--dex-okd-input-hover-placeholder-color);
  color: var(--dex-okd-input-hover-placeholder-color)
}

.dex-input.hover .dex-input-box .dex-input-input:-moz-placeholder,
.dex-input:hover .dex-input-box .dex-input-input:-moz-placeholder {
  -webkit-text-fill-color: var(--dex-okd-input-hover-placeholder-color);
  color: var(--dex-okd-input-hover-placeholder-color);
  opacity: 1
}

.dex-input.hover .dex-input-box .dex-input-input::-ms-input-placeholder,
.dex-input:hover .dex-input-box .dex-input-input::-ms-input-placeholder {
  -webkit-text-fill-color: var(--dex-okd-input-hover-placeholder-color);
  color: var(--dex-okd-input-hover-placeholder-color)
}

.dex-input.focus .dex-input-box {
  background: var(--dex-okd-input-focus-background);
  border: thin solid var(--dex-okd-input-focus-border-color);
  box-shadow: var(--dex-okd-input-focus-shadow)
}

.dex-input.focus .dex-input-box .dex-input-input {
  -webkit-text-fill-color: var(--dex-okd-input-focus-text-color);
  caret-color: var(--dex-okd-input-focus-caret-color);
  color: var(--dex-okd-input-focus-text-color)
}

.dex-input.focus .dex-input-box .dex-input-input::-webkit-input-placeholder {
  -webkit-text-fill-color: var(--dex-okd-input-focus-placeholder-color);
  color: var(--dex-okd-input-focus-placeholder-color)
}

.dex-input.focus .dex-input-box .dex-input-input:-moz-placeholder {
  -webkit-text-fill-color: var(--dex-okd-input-focus-placeholder-color);
  color: var(--dex-okd-input-focus-placeholder-color);
  opacity: 1
}

.dex-input.focus .dex-input-box .dex-input-input::-ms-input-placeholder {
  -webkit-text-fill-color: var(--dex-okd-input-focus-placeholder-color);
  color: var(--dex-okd-input-focus-placeholder-color)
}

.dex-input.readonly .dex-input-box {
  background: var(--dex-okd-input-default-background);
  background: var(--dex-okd-input-readonly-background, var(--dex-okd-input-default-background));
  border: thin solid var(--dex-okd-input-readonly-border-color, var(--dex-okd-input-default-border-color));
  box-shadow: var(--dex-okd-input-default-shadow);
  box-shadow: var(--dex-okd-input-readonly-shadow, var(--dex-okd-input-default-shadow))
}

.dex-input.readonly .dex-input-box .dex-input-input {
  -webkit-text-fill-color: var(--dex-okd-input-default-text-color);
  -webkit-text-fill-color: var(--dex-okd-input-readonly-text-color, var(--dex-okd-input-default-text-color));
  caret-color: var(--dex-okd-input-default-caret-color);
  caret-color: var(--dex-okd-input-readonly-caret-color, var(--dex-okd-input-default-caret-color));
  color: var(--dex-okd-input-default-text-color);
  color: var(--dex-okd-input-readonly-text-color, var(--dex-okd-input-default-text-color))
}

.dex-input.readonly .dex-input-box .dex-input-input::-webkit-input-placeholder {
  -webkit-text-fill-color: var(--dex-okd-input-default-placeholder-color);
  -webkit-text-fill-color: var(--dex-okd-input-readonly-placeholder-color, var(--dex-okd-input-default-placeholder-color));
  color: var(--dex-okd-input-default-placeholder-color);
  color: var(--dex-okd-input-readonly-placeholder-color, var(--dex-okd-input-default-placeholder-color))
}

.dex-input.readonly .dex-input-box .dex-input-input:-moz-placeholder {
  -webkit-text-fill-color: var(--dex-okd-input-default-placeholder-color);
  -webkit-text-fill-color: var(--dex-okd-input-readonly-placeholder-color, var(--dex-okd-input-default-placeholder-color));
  color: var(--dex-okd-input-default-placeholder-color);
  color: var(--dex-okd-input-readonly-placeholder-color, var(--dex-okd-input-default-placeholder-color));
  opacity: 1
}

.dex-input.readonly .dex-input-box .dex-input-input::-ms-input-placeholder {
  -webkit-text-fill-color: var(--dex-okd-input-default-placeholder-color);
  -webkit-text-fill-color: var(--dex-okd-input-readonly-placeholder-color, var(--dex-okd-input-default-placeholder-color));
  color: var(--dex-okd-input-default-placeholder-color);
  color: var(--dex-okd-input-readonly-placeholder-color, var(--dex-okd-input-default-placeholder-color))
}

.dex-input.readonly.focus .dex-input-box {
  border-color: var(--dex-okd-input-focus-border-color)
}

.dex-input.disabled {
  cursor: not-allowed
}

.dex-input.disabled .dex-input-box {
  background: var(--dex-okd-input-disabled-background);
  border: thin solid var(--dex-okd-input-disabled-border-color);
  box-shadow: var(--dex-okd-input-disabled-shadow)
}

.dex-input.disabled .dex-input-box .dex-input-input {
  -webkit-text-fill-color: var(--dex-okd-input-disabled-text-color);
  caret-color: var(--dex-okd-input-disabled-caret-color);
  color: var(--dex-okd-input-disabled-text-color)
}

.dex-input.disabled .dex-input-box .dex-input-input::-webkit-input-placeholder {
  -webkit-text-fill-color: var(--dex-okd-input-disabled-placeholder-color);
  color: var(--dex-okd-input-disabled-placeholder-color)
}

.dex-input.disabled .dex-input-box .dex-input-input:-moz-placeholder {
  -webkit-text-fill-color: var(--dex-okd-input-disabled-placeholder-color);
  color: var(--dex-okd-input-disabled-placeholder-color);
  opacity: 1
}

.dex-input.disabled .dex-input-box .dex-input-input::-ms-input-placeholder {
  -webkit-text-fill-color: var(--dex-okd-input-disabled-placeholder-color);
  color: var(--dex-okd-input-disabled-placeholder-color)
}

.dex-input.disabled .dex-input-input {
  cursor: not-allowed;
  opacity: 1
}

.dex-input.disabled .dex-input-input:-webkit-autofill {
  -webkit-text-fill-color: var(--dex-okd-input-disabled-text-color) !important;
  -webkit-box-shadow: 0 0 0 30px var(--dex-okd-input-disabled-background) inset
}

.dex-input.error .dex-input-box {
  background: var(--dex-okd-input-error-background);
  border: thin solid var(--dex-okd-input-error-border-color);
  box-shadow: var(--dex-okd-input-error-shadow)
}

.dex-input.error .dex-input-box .dex-input-input {
  -webkit-text-fill-color: var(--dex-okd-input-error-text-color);
  caret-color: var(--dex-okd-input-error-caret-color);
  color: var(--dex-okd-input-error-text-color)
}

.dex-input.error .dex-input-box .dex-input-input::-webkit-input-placeholder {
  -webkit-text-fill-color: var(--dex-okd-input-error-placeholder-color);
  color: var(--dex-okd-input-error-placeholder-color)
}

.dex-input.error .dex-input-box .dex-input-input:-moz-placeholder {
  -webkit-text-fill-color: var(--dex-okd-input-error-placeholder-color);
  color: var(--dex-okd-input-error-placeholder-color);
  opacity: 1
}

.dex-input.error .dex-input-box .dex-input-input::-ms-input-placeholder {
  -webkit-text-fill-color: var(--dex-okd-input-error-placeholder-color);
  color: var(--dex-okd-input-error-placeholder-color)
}

.dex-input.error .dex-input-error {
  display: inline-block
}

.dex-input.no-border .dex-input-box {
  background: transparent;
  border: thin solid transparent;
  box-shadow: none
}

.dex-input-textarea-resize-virtual-dom::-webkit-scrollbar {
  display: none;
  height: 0;
  width: 0
}

.dex-input-box {
  align-items: center;
  background: var(--dex-okd-input-default-background);
  border: thin solid var(--dex-okd-input-default-border-color);
  box-shadow: var(--dex-okd-input-default-shadow);
  display: flex;
  transition: border-color .3s, box-shadow .3s;
  width: 100%
}

.dex-input-xl>.dex-input-box {
  border-radius: var(--dex-okd-input-xl-border-radius);
  height: var(--dex-okd-input-xl-height);
  padding: 0 8px;
  padding: 0 var(--dex-okd-input-xl-padding-horizontal, 8px)
}

.dex-input-xl>.dex-input-box.auto-size {
  height: -webkit-fit-content;
  height: -moz-fit-content;
  height: fit-content;
  min-height: var(--dex-okd-input-xl-height)
}

.dex-input-xl>.dex-input-box.no-padding-left {
  padding-left: 0
}

.dex-input-xl>.dex-input-box.no-padding-right {
  padding-right: 0
}

.dex-input-xl>.dex-input-box.ta {
  height: 100%;
  padding: 8px
}

.dex-input-xl>.dex-input-box.auto-resize-auto-height {
  height: -webkit-fit-content;
  height: -moz-fit-content;
  height: fit-content;
  min-height: var(--dex-okd-input-xl-height)
}

.dex-input-xl>.dex-input-box.input-circle {
  border-radius: 100px
}

.dex-input-xl .dex-input-input {
  font-size: var(--dex-okd-input-xl-text-font-size);
  padding: calc(var(--dex-okd-input-xl-height)/2 - var(--dex-okd-input-xl-text-font-size)/2 - 2px) 0
}

.dex-input-xl .dex-input-input::-webkit-input-placeholder {
  font-size: var(--dex-okd-input-xl-text-font-size);
  font-weight: 400;
  text-overflow: ellipsis
}

.dex-input-xl .dex-input-input:-moz-placeholder {
  font-size: var(--dex-okd-input-xl-text-font-size);
  font-weight: 400;
  text-overflow: ellipsis
}

.dex-input-xl .dex-input-input::-ms-input-placeholder {
  font-size: var(--dex-okd-input-xl-text-font-size);
  font-weight: 400;
  text-overflow: ellipsis
}

.dex-input-xl .dex-input-input.ta {
  padding: 0
}

.dex-input-xl .dex-input-input.textarea-auto-resize {
  line-height: var(--dex-okd-input-xl-text-font-size)
}

.dex-input-xl .dex-input-placeholder {
  font-size: var(--dex-okd-input-xl-text-font-size);
  height: calc(var(--dex-okd-input-xl-text-font-size) + 2px);
  line-height: calc(var(--dex-okd-input-xl-text-font-size) + 2px)
}

.dex-input-xl .dex-input.dex-input-place-mode .dex-input-tips-box {
  min-height: calc(var(--dex-okd-input-xl-tip-line-height) + 6px);
  min-height: calc(var(--dex-okd-input-xl-tip-line-height) + var(--dex-okd-input-xl-tip-margin, 6px))
}

.dex-input-xl .dex-input-error {
  font-size: var(--dex-okd-input-xl-error-font-size);
  line-height: var(--dex-okd-input-xl-error-line-height);
  margin-top: 6px;
  margin-top: var(--dex-okd-input-xl-tip-margin, 6px)
}

.dex-input-xl .dex-input-help-text,
.dex-input-xl .dex-input-tips {
  font-size: var(--dex-okd-input-xl-tip-font-size);
  line-height: var(--dex-okd-input-xl-tip-line-height);
  margin-top: 6px;
  margin-top: var(--dex-okd-input-xl-tip-margin, 6px)
}

.dex-input-lg>.dex-input-box {
  border-radius: var(--dex-okd-input-lg-border-radius);
  height: var(--dex-okd-input-lg-height);
  padding: 0 8px;
  padding: 0 var(--dex-okd-input-lg-padding-horizontal, 8px)
}

.dex-input-lg>.dex-input-box.auto-size {
  height: -webkit-fit-content;
  height: -moz-fit-content;
  height: fit-content;
  min-height: var(--dex-okd-input-lg-height)
}

.dex-input-lg>.dex-input-box.no-padding-left {
  padding-left: 0
}

.dex-input-lg>.dex-input-box.no-padding-right {
  padding-right: 0
}

.dex-input-lg>.dex-input-box.ta {
  height: 100%;
  padding: 8px
}

.dex-input-lg>.dex-input-box.auto-resize-auto-height {
  height: -webkit-fit-content;
  height: -moz-fit-content;
  height: fit-content;
  min-height: var(--dex-okd-input-lg-height)
}

.dex-input-lg>.dex-input-box.input-circle {
  border-radius: 100px
}

.dex-input-lg .dex-input-input {
  font-size: var(--dex-okd-input-lg-text-font-size);
  padding: calc(var(--dex-okd-input-lg-height)/2 - var(--dex-okd-input-lg-text-font-size)/2 - 2px) 0
}

.dex-input-lg .dex-input-input::-webkit-input-placeholder {
  font-size: var(--dex-okd-input-lg-text-font-size);
  font-weight: 400;
  text-overflow: ellipsis
}

.dex-input-lg .dex-input-input:-moz-placeholder {
  font-size: var(--dex-okd-input-lg-text-font-size);
  font-weight: 400;
  text-overflow: ellipsis
}

.dex-input-lg .dex-input-input::-ms-input-placeholder {
  font-size: var(--dex-okd-input-lg-text-font-size);
  font-weight: 400;
  text-overflow: ellipsis
}

.dex-input-lg .dex-input-input.ta {
  padding: 0
}

.dex-input-lg .dex-input-input.textarea-auto-resize {
  line-height: var(--dex-okd-input-lg-text-font-size)
}

.dex-input-lg .dex-input-placeholder {
  font-size: var(--dex-okd-input-lg-text-font-size);
  height: calc(var(--dex-okd-input-lg-text-font-size) + 2px);
  line-height: calc(var(--dex-okd-input-lg-text-font-size) + 2px)
}

.dex-input-lg .dex-input.dex-input-place-mode .dex-input-tips-box {
  min-height: calc(var(--dex-okd-input-lg-tip-line-height) + 6px);
  min-height: calc(var(--dex-okd-input-lg-tip-line-height) + var(--dex-okd-input-lg-tip-margin, 6px))
}

.dex-input-lg .dex-input-error {
  font-size: var(--dex-okd-input-lg-error-font-size);
  line-height: var(--dex-okd-input-lg-error-line-height);
  margin-top: 6px;
  margin-top: var(--dex-okd-input-lg-tip-margin, 6px)
}

.dex-input-lg .dex-input-help-text,
.dex-input-lg .dex-input-tips {
  font-size: var(--dex-okd-input-lg-tip-font-size);
  line-height: var(--dex-okd-input-lg-tip-line-height);
  margin-top: 6px;
  margin-top: var(--dex-okd-input-lg-tip-margin, 6px)
}

.dex-input-xs>.dex-input-box {
  border-radius: var(--dex-okd-input-xs-border-radius);
  height: var(--dex-okd-input-xs-height);
  padding: 0 8px;
  padding: 0 var(--dex-okd-input-xs-padding-horizontal, 8px)
}

.dex-input-xs>.dex-input-box.auto-size {
  height: -webkit-fit-content;
  height: -moz-fit-content;
  height: fit-content;
  min-height: var(--dex-okd-input-xs-height)
}

.dex-input-xs>.dex-input-box.no-padding-left {
  padding-left: 0
}

.dex-input-xs>.dex-input-box.no-padding-right {
  padding-right: 0
}

.dex-input-xs>.dex-input-box.ta {
  height: 100%;
  padding: 8px
}

.dex-input-xs>.dex-input-box.auto-resize-auto-height {
  height: -webkit-fit-content;
  height: -moz-fit-content;
  height: fit-content;
  min-height: var(--dex-okd-input-xs-height)
}

.dex-input-xs>.dex-input-box.input-circle {
  border-radius: 100px
}

.dex-input-xs .dex-input-input {
  font-size: var(--dex-okd-input-xs-text-font-size);
  padding: calc(var(--dex-okd-input-xs-height)/2 - var(--dex-okd-input-xs-text-font-size)/2 - 2px) 0
}

.dex-input-xs .dex-input-input::-webkit-input-placeholder {
  font-size: var(--dex-okd-input-xs-text-font-size);
  font-weight: 400;
  text-overflow: ellipsis
}

.dex-input-xs .dex-input-input:-moz-placeholder {
  font-size: var(--dex-okd-input-xs-text-font-size);
  font-weight: 400;
  text-overflow: ellipsis
}

.dex-input-xs .dex-input-input::-ms-input-placeholder {
  font-size: var(--dex-okd-input-xs-text-font-size);
  font-weight: 400;
  text-overflow: ellipsis
}

.dex-input-xs .dex-input-input.ta {
  padding: 0
}

.dex-input-xs .dex-input-input.textarea-auto-resize {
  line-height: var(--dex-okd-input-xs-text-font-size)
}

.dex-input-xs .dex-input-placeholder {
  font-size: var(--dex-okd-input-xs-text-font-size);
  height: calc(var(--dex-okd-input-xs-text-font-size) + 2px);
  line-height: calc(var(--dex-okd-input-xs-text-font-size) + 2px)
}

.dex-input-xs .dex-input.dex-input-place-mode .dex-input-tips-box {
  min-height: calc(var(--dex-okd-input-xs-tip-line-height) + 4px);
  min-height: calc(var(--dex-okd-input-xs-tip-line-height) + var(--dex-okd-input-xs-tip-margin, 4px))
}

.dex-input-xs .dex-input-error {
  font-size: var(--dex-okd-input-xs-error-font-size);
  line-height: var(--dex-okd-input-xs-error-line-height);
  margin-top: 4px;
  margin-top: var(--dex-okd-input-xs-tip-margin, 4px)
}

.dex-input-xs .dex-input-help-text,
.dex-input-xs .dex-input-tips {
  font-size: var(--dex-okd-input-xs-tip-font-size);
  line-height: var(--dex-okd-input-xs-tip-line-height);
  margin-top: 4px;
  margin-top: var(--dex-okd-input-xs-tip-margin, 4px)
}

.dex-input-sm>.dex-input-box {
  border-radius: var(--dex-okd-input-sm-border-radius);
  height: var(--dex-okd-input-sm-height);
  padding: 0 8px;
  padding: 0 var(--dex-okd-input-sm-padding-horizontal, 8px)
}

.dex-input-sm>.dex-input-box.auto-size {
  height: -webkit-fit-content;
  height: -moz-fit-content;
  height: fit-content;
  min-height: var(--dex-okd-input-sm-height)
}

.dex-input-sm>.dex-input-box.no-padding-left {
  padding-left: 0
}

.dex-input-sm>.dex-input-box.no-padding-right {
  padding-right: 0
}

.dex-input-sm>.dex-input-box.ta {
  height: 100%;
  padding: 8px
}

.dex-input-sm>.dex-input-box.auto-resize-auto-height {
  height: -webkit-fit-content;
  height: -moz-fit-content;
  height: fit-content;
  min-height: var(--dex-okd-input-sm-height)
}

.dex-input-sm>.dex-input-box.input-circle {
  border-radius: 100px
}

.dex-input-sm .dex-input-input {
  font-size: var(--dex-okd-input-sm-text-font-size);
  padding: calc(var(--dex-okd-input-sm-height)/2 - var(--dex-okd-input-sm-text-font-size)/2 - 2px) 0
}

.dex-input-sm .dex-input-input::-webkit-input-placeholder {
  font-size: var(--dex-okd-input-sm-text-font-size);
  font-weight: 400;
  text-overflow: ellipsis
}

.dex-input-sm .dex-input-input:-moz-placeholder {
  font-size: var(--dex-okd-input-sm-text-font-size);
  font-weight: 400;
  text-overflow: ellipsis
}

.dex-input-sm .dex-input-input::-ms-input-placeholder {
  font-size: var(--dex-okd-input-sm-text-font-size);
  font-weight: 400;
  text-overflow: ellipsis
}

.dex-input-sm .dex-input-input.ta {
  padding: 0
}

.dex-input-sm .dex-input-input.textarea-auto-resize {
  line-height: var(--dex-okd-input-sm-text-font-size)
}

.dex-input-sm .dex-input-placeholder {
  font-size: var(--dex-okd-input-sm-text-font-size);
  height: calc(var(--dex-okd-input-sm-text-font-size) + 2px);
  line-height: calc(var(--dex-okd-input-sm-text-font-size) + 2px)
}

.dex-input-sm .dex-input.dex-input-place-mode .dex-input-tips-box {
  min-height: calc(var(--dex-okd-input-sm-tip-line-height) + 4px);
  min-height: calc(var(--dex-okd-input-sm-tip-line-height) + var(--dex-okd-input-sm-tip-margin, 4px))
}

.dex-input-sm .dex-input-error {
  font-size: var(--dex-okd-input-sm-error-font-size);
  line-height: var(--dex-okd-input-sm-error-line-height);
  margin-top: 4px;
  margin-top: var(--dex-okd-input-sm-tip-margin, 4px)
}

.dex-input-sm .dex-input-help-text,
.dex-input-sm .dex-input-tips {
  font-size: var(--dex-okd-input-sm-tip-font-size);
  line-height: var(--dex-okd-input-sm-tip-line-height);
  margin-top: 4px;
  margin-top: var(--dex-okd-input-sm-tip-margin, 4px)
}

.dex-input-md>.dex-input-box {
  border-radius: var(--dex-okd-input-md-border-radius);
  height: var(--dex-okd-input-md-height);
  padding: 0 8px;
  padding: 0 var(--dex-okd-input-md-padding-horizontal, 8px)
}

.dex-input-md>.dex-input-box.auto-size {
  height: -webkit-fit-content;
  height: -moz-fit-content;
  height: fit-content;
  min-height: var(--dex-okd-input-md-height)
}

.dex-input-md>.dex-input-box.no-padding-left {
  padding-left: 0
}

.dex-input-md>.dex-input-box.no-padding-right {
  padding-right: 0
}

.dex-input-md>.dex-input-box.ta {
  height: 100%;
  padding: 8px
}

.dex-input-md>.dex-input-box.auto-resize-auto-height {
  height: -webkit-fit-content;
  height: -moz-fit-content;
  height: fit-content;
  min-height: var(--dex-okd-input-md-height)
}

.dex-input-md>.dex-input-box.input-circle {
  border-radius: 100px
}

.dex-input-md .dex-input-input {
  font-size: var(--dex-okd-input-md-text-font-size);
  padding: calc(var(--dex-okd-input-md-height)/2 - var(--dex-okd-input-md-text-font-size)/2 - 2px) 0
}

.dex-input-md .dex-input-input::-webkit-input-placeholder {
  font-size: var(--dex-okd-input-md-text-font-size);
  font-weight: 400;
  text-overflow: ellipsis
}

.dex-input-md .dex-input-input:-moz-placeholder {
  font-size: var(--dex-okd-input-md-text-font-size);
  font-weight: 400;
  text-overflow: ellipsis
}

.dex-input-md .dex-input-input::-ms-input-placeholder {
  font-size: var(--dex-okd-input-md-text-font-size);
  font-weight: 400;
  text-overflow: ellipsis
}

.dex-input-md .dex-input-input.ta {
  padding: 0
}

.dex-input-md .dex-input-input.textarea-auto-resize {
  line-height: var(--dex-okd-input-md-text-font-size)
}

.dex-input-md .dex-input-placeholder {
  font-size: var(--dex-okd-input-md-text-font-size);
  height: calc(var(--dex-okd-input-md-text-font-size) + 2px);
  line-height: calc(var(--dex-okd-input-md-text-font-size) + 2px)
}

.dex-input-md .dex-input.dex-input-place-mode .dex-input-tips-box {
  min-height: calc(var(--dex-okd-input-md-tip-line-height) + 4px);
  min-height: calc(var(--dex-okd-input-md-tip-line-height) + var(--dex-okd-input-md-tip-margin, 4px))
}

.dex-input-md .dex-input-error {
  font-size: var(--dex-okd-input-md-error-font-size);
  line-height: var(--dex-okd-input-md-error-line-height);
  margin-top: 4px;
  margin-top: var(--dex-okd-input-md-tip-margin, 4px)
}

.dex-input-md .dex-input-help-text,
.dex-input-md .dex-input-tips {
  font-size: var(--dex-okd-input-md-tip-font-size);
  line-height: var(--dex-okd-input-md-tip-line-height);
  margin-top: 4px;
  margin-top: var(--dex-okd-input-md-tip-margin, 4px)
}

.dex-input-prefix {
  height: 100%
}

.dex-input-prefix .prefix-icon {
  color: var(--dex-okd-input-icon-color)
}

.dex-input-prefix .select {
  padding-right: 8px
}

.dex-input-suffix {
  height: 100%
}

.dex-input-suffix .suffix-icon {
  color: var(--dex-okd-input-icon-color)
}

.dex-input-suffix .clean-icon:hover {
  color: #000;
  color: var(--dex-okd-input-search-suffix-icon-hover-color, #000)
}

.dex-input-suffix .error-icon {
  color: var(--dex-okd-input-error-tips-color)
}

.dex-input-xl .dex-input-prefix .prefix-icon {
  font-size: var(--dex-okd-input-xl-icon-size);
  margin-left: 0;
  margin-right: var(--dex-okd-input-xl-icon-margin)
}

.dex-input-xl .dex-input-suffix .suffix-icon {
  font-size: var(--dex-okd-input-xl-icon-size);
  margin-left: var(--dex-okd-input-xl-icon-margin);
  margin-right: 0
}

.dex-input-lg .dex-input-prefix .prefix-icon {
  font-size: var(--dex-okd-input-lg-icon-size);
  margin-left: 0;
  margin-right: var(--dex-okd-input-lg-icon-margin)
}

.dex-input-lg .dex-input-suffix .suffix-icon {
  font-size: var(--dex-okd-input-lg-icon-size);
  margin-left: var(--dex-okd-input-lg-icon-margin);
  margin-right: 0
}

.dex-input-xs .dex-input-prefix .prefix-icon {
  font-size: var(--dex-okd-input-xs-icon-size);
  margin-left: 0;
  margin-right: var(--dex-okd-input-xs-icon-margin)
}

.dex-input-xs .dex-input-suffix .suffix-icon {
  font-size: var(--dex-okd-input-xs-icon-size);
  margin-left: var(--dex-okd-input-xs-icon-margin);
  margin-right: 0
}

.dex-input-sm .dex-input-prefix .prefix-icon {
  font-size: var(--dex-okd-input-sm-icon-size);
  margin-left: 0;
  margin-right: var(--dex-okd-input-sm-icon-margin)
}

.dex-input-sm .dex-input-suffix .suffix-icon {
  font-size: var(--dex-okd-input-sm-icon-size);
  margin-left: var(--dex-okd-input-sm-icon-margin);
  margin-right: 0
}

.dex-input-md .dex-input-prefix .prefix-icon {
  font-size: var(--dex-okd-input-md-icon-size);
  margin-left: 0;
  margin-right: var(--dex-okd-input-md-icon-margin)
}

.dex-input-md .dex-input-suffix .suffix-icon {
  font-size: var(--dex-okd-input-md-icon-size);
  margin-left: var(--dex-okd-input-md-icon-margin);
  margin-right: 0
}

.dex-input:hover .dex-input-number-suffix:not(.operation-always) {
  opacity: 1
}

.dex-input-number-inner {
  overflow: hidden
}

.dex-input-number-suffix {
  align-items: center;
  border-left: 1px solid var(--dex-okd-input-number-suffix-border-color, var(--dex-okd-input-default-border-color));
  cursor: pointer;
  display: flex;
  flex-direction: column;
  height: 100%;
  justify-content: center;
  line-height: 0;
  margin-left: 6px;
  overflow: hidden;
  text-align: center;
  transition: opacity .5s;
  width: 24px
}

.dex-input-number-suffix:not(.operation-always) {
  opacity: 0
}

.dex-input-number-suffix-part {
  align-items: center;
  background: var(--dex-okd-input-number-default-add-icon-background);
  box-sizing: border-box;
  display: flex;
  flex: 1 1;
  justify-content: center;
  width: 100%
}

.dex-input-number-suffix-part .icon {
  color: var(--dex-okd-input-number-default-add-icon-color);
  font-size: 13px
}

.dex-input-number-suffix-part .hover,
.dex-input-number-suffix-part:not(.dex-input-number-suffix-part-disabled):hover {
  background: var(--dex-okd-input-number-hover-add-icon-background)
}

.dex-input-number-suffix-part .hover .icon,
.dex-input-number-suffix-part:not(.dex-input-number-suffix-part-disabled):hover .icon {
  color: var(--dex-okd-input-number-hover-add-icon-color)
}

.dex-input-number-suffix-part .active,
.dex-input-number-suffix-part:not(.dex-input-number-suffix-part-disabled):active {
  background: var(--dex-okd-input-number-active-add-icon-background)
}

.dex-input-number-suffix-part .active .icon,
.dex-input-number-suffix-part:not(.dex-input-number-suffix-part-disabled):active .icon {
  color: var(--dex-okd-input-number-active-add-icon-color)
}

.dex-input-number-suffix-part-disabled {
  cursor: not-allowed
}

.dex-input-number-suffix-line {
  background: var(--dex-okd-input-default-border-color);
  background: var(--dex-okd-input-number-suffix-border-color, var(--dex-okd-input-default-border-color));
  height: 1px;
  width: 100%
}

.dex-input-number-suffix .up {
  transform: rotate(180deg)
}

.dex-input-number-localization {
  text-align: right
}

.dex-input-number-localization-percent {
  color: var(--dex-okd-input-default-text-color);
  display: inline-block
}

.dex-input-xl .dex-input-number-suffix.xl {
  border-bottom-right-radius: calc(var(--dex-okd-input-xl-border-radius) - 1px);
  border-top-right-radius: calc(var(--dex-okd-input-xl-border-radius) - 1px)
}

.dex-input-lg .dex-input-number-suffix.lg {
  border-bottom-right-radius: calc(var(--dex-okd-input-lg-border-radius) - 1px);
  border-top-right-radius: calc(var(--dex-okd-input-lg-border-radius) - 1px)
}

.dex-input-xs .dex-input-number-suffix.xs {
  border-bottom-right-radius: calc(var(--dex-okd-input-xs-border-radius) - 1px);
  border-top-right-radius: calc(var(--dex-okd-input-xs-border-radius) - 1px)
}

.dex-input-sm .dex-input-number-suffix.sm {
  border-bottom-right-radius: calc(var(--dex-okd-input-sm-border-radius) - 1px);
  border-top-right-radius: calc(var(--dex-okd-input-sm-border-radius) - 1px)
}

.dex-input-md .dex-input-number-suffix.md {
  border-bottom-right-radius: calc(var(--dex-okd-input-md-border-radius) - 1px);
  border-top-right-radius: calc(var(--dex-okd-input-md-border-radius) - 1px)
}

.dex-input-suffix .suffix-icon+.dex-input-code-btn,
.dex-input-suffix .suffix-icon+.dex-input-count-down {
  margin-left: var(--dex-okd-input-md-icon-margin)
}

.dex-input-count-down {
  color: var(--dex-okd-input-code-common-count-color)
}

.dex-input input::-webkit-inner-spin-button,
.dex-input input::-webkit-outer-spin-button {
  -webkit-appearance: none !important;
  margin: 0
}

.dex-input input[type=number] {
  -moz-appearance: textfield
}

.dex-input-xl .dex-input-count-down {
  font-size: var(--dex-okd-input-code-xl-count-font-size);
  line-height: var(--dex-okd-input-code-xl-count-line-height)
}

.dex-input-lg .dex-input-count-down {
  font-size: var(--dex-okd-input-code-lg-count-font-size);
  line-height: var(--dex-okd-input-code-lg-count-line-height)
}

.dex-input-xs .dex-input-count-down {
  font-size: var(--dex-okd-input-code-xs-count-font-size);
  line-height: var(--dex-okd-input-code-xs-count-line-height)
}

.dex-input-sm .dex-input-count-down {
  font-size: var(--dex-okd-input-code-sm-count-font-size);
  line-height: var(--dex-okd-input-code-sm-count-line-height)
}

.dex-input-md .dex-input-count-down {
  font-size: var(--dex-okd-input-code-md-count-font-size);
  line-height: var(--dex-okd-input-code-md-count-line-height)
}

.dex-input-switch-icon.icon {
  cursor: pointer
}

.dex-input-prefix .dex-input-search-prefix-icon {
  color: var(--dex-okd-input-search-prefix-icon-color);
  cursor: pointer;
  font-size: var(--dex-okd-input-search-prefix-icon-size);
  margin-right: 8px
}

.dex-input-suffix .clean-icon {
  color: var(--dex-okd-input-search-suffix-icon-color);
  cursor: pointer;
  font-size: var(--dex-okd-input-search-suffix-icon-size)
}

.dex-input-search .dex-input-error {
  color: var(--dex-okd-input-search-error-tips-color)
}

.dex-input-search .dex-input-box {
  background-color: var(--dex-okd-input-search-default-background);
  border-color: var(--dex-okd-input-search-default-border-color);
  box-shadow: var(--dex-okd-input-search-default-shadow)
}

.dex-input-search .dex-input-input {
  color: var(--dex-okd-input-search-default-text-color)
}

.dex-input-search .dex-input-input::-webkit-input-placeholder {
  -webkit-text-fill-color: var(--dex-okd-input-search-default-placeholder-color);
  color: var(--dex-okd-input-search-default-placeholder-color)
}

.dex-input-search .dex-input-input:-moz-placeholder {
  -webkit-text-fill-color: var(--dex-okd-input-search-default-placeholder-color);
  color: var(--dex-okd-input-search-default-placeholder-color);
  opacity: 1
}

.dex-input-search .dex-input-input::-ms-input-placeholder {
  -webkit-text-fill-color: var(--dex-okd-input-search-default-placeholder-color);
  color: var(--dex-okd-input-search-default-placeholder-color)
}

.dex-input-search.hover .dex-input-box,
.dex-input-search:hover .dex-input-box {
  background: var(--dex-okd-input-search-hover-background);
  border: thin solid var(--dex-okd-input-search-hover-border-color);
  box-shadow: var(--dex-okd-input-search-hover-shadow)
}

.dex-input-search.hover .dex-input-box .dex-input-input,
.dex-input-search:hover .dex-input-box .dex-input-input {
  -webkit-text-fill-color: var(--dex-okd-input-search-hover-text-color);
  caret-color: var(--dex-okd-input-search-hover-caret-color);
  color: var(--dex-okd-input-search-hover-text-color)
}

.dex-input-search.hover .dex-input-box .dex-input-input::-webkit-input-placeholder,
.dex-input-search:hover .dex-input-box .dex-input-input::-webkit-input-placeholder {
  -webkit-text-fill-color: var(--dex-okd-input-search-hover-placeholder-color);
  color: var(--dex-okd-input-search-hover-placeholder-color)
}

.dex-input-search.hover .dex-input-box .dex-input-input:-moz-placeholder,
.dex-input-search:hover .dex-input-box .dex-input-input:-moz-placeholder {
  -webkit-text-fill-color: var(--dex-okd-input-search-hover-placeholder-color);
  color: var(--dex-okd-input-search-hover-placeholder-color);
  opacity: 1
}

.dex-input-search.hover .dex-input-box .dex-input-input::-ms-input-placeholder,
.dex-input-search:hover .dex-input-box .dex-input-input::-ms-input-placeholder {
  -webkit-text-fill-color: var(--dex-okd-input-search-hover-placeholder-color);
  color: var(--dex-okd-input-search-hover-placeholder-color)
}

.dex-input-search.focus .dex-input-box {
  background: var(--dex-okd-input-search-focus-background);
  border: thin solid var(--dex-okd-input-search-focus-border-color);
  box-shadow: var(--dex-okd-input-search-focus-shadow)
}

.dex-input-search.focus .dex-input-box .dex-input-input {
  -webkit-text-fill-color: var(--dex-okd-input-search-focus-text-color);
  caret-color: var(--dex-okd-input-search-focus-caret-color);
  color: var(--dex-okd-input-search-focus-text-color)
}

.dex-input-search.focus .dex-input-box .dex-input-input::-webkit-input-placeholder {
  -webkit-text-fill-color: var(--dex-okd-input-search-focus-placeholder-color);
  color: var(--dex-okd-input-search-focus-placeholder-color)
}

.dex-input-search.focus .dex-input-box .dex-input-input:-moz-placeholder {
  -webkit-text-fill-color: var(--dex-okd-input-search-focus-placeholder-color);
  color: var(--dex-okd-input-search-focus-placeholder-color);
  opacity: 1
}

.dex-input-search.focus .dex-input-box .dex-input-input::-ms-input-placeholder {
  -webkit-text-fill-color: var(--dex-okd-input-search-focus-placeholder-color);
  color: var(--dex-okd-input-search-focus-placeholder-color)
}

.dex-input-search.disabled .dex-input-box {
  background: var(--dex-okd-input-search-disabled-background);
  border: thin solid var(--dex-okd-input-search-disabled-border-color);
  box-shadow: var(--dex-okd-input-search-disabled-shadow)
}

.dex-input-search.disabled .dex-input-box .dex-input-input {
  -webkit-text-fill-color: var(--dex-okd-input-search-disabled-text-color);
  caret-color: var(--dex-okd-input-search-disabled-caret-color);
  color: var(--dex-okd-input-search-disabled-text-color)
}

.dex-input-search.disabled .dex-input-box .dex-input-input::-webkit-input-placeholder {
  -webkit-text-fill-color: var(--dex-okd-input-search-disabled-placeholder-color);
  color: var(--dex-okd-input-search-disabled-placeholder-color)
}

.dex-input-search.disabled .dex-input-box .dex-input-input:-moz-placeholder {
  -webkit-text-fill-color: var(--dex-okd-input-search-disabled-placeholder-color);
  color: var(--dex-okd-input-search-disabled-placeholder-color);
  opacity: 1
}

.dex-input-search.disabled .dex-input-box .dex-input-input::-ms-input-placeholder {
  -webkit-text-fill-color: var(--dex-okd-input-search-disabled-placeholder-color);
  color: var(--dex-okd-input-search-disabled-placeholder-color)
}

.dex-input-search.error .dex-input-box {
  background: var(--dex-okd-input-search-error-background);
  border: thin solid var(--dex-okd-input-search-error-border-color);
  box-shadow: var(--dex-okd-input-search-error-shadow)
}

.dex-input-search.error .dex-input-box .dex-input-input {
  -webkit-text-fill-color: var(--dex-okd-input-search-error-text-color);
  caret-color: var(--dex-okd-input-search-error-caret-color);
  color: var(--dex-okd-input-search-error-text-color)
}

.dex-input-search.error .dex-input-box .dex-input-input::-webkit-input-placeholder {
  -webkit-text-fill-color: var(--dex-okd-input-search-error-placeholder-color);
  color: var(--dex-okd-input-search-error-placeholder-color)
}

.dex-input-search.error .dex-input-box .dex-input-input:-moz-placeholder {
  -webkit-text-fill-color: var(--dex-okd-input-search-error-placeholder-color);
  color: var(--dex-okd-input-search-error-placeholder-color);
  opacity: 1
}

.dex-input-search.error .dex-input-box .dex-input-input::-ms-input-placeholder {
  -webkit-text-fill-color: var(--dex-okd-input-search-error-placeholder-color);
  color: var(--dex-okd-input-search-error-placeholder-color)
}

.dex-input-verify {
  display: flex;
  flex-direction: row;
  position: relative
}

.dex-input-verify * {
  box-sizing: border-box
}

.dex-input-verify .dex-input-verify-input:focus {
  border: 1px solid var(--dex-okd-input-focus-border-color);
  box-shadow: var(--dex-okd-input-focus-shadow)
}

.dex-input-verify .dex-input-verify-input {
  align-items: center;
  background: transparent;
  background: var(--dex-okd-input-default-background);
  border: thin solid var(--dex-okd-input-default-border-color);
  box-shadow: var(--dex-okd-input-default-shadow);
  caret-color: var(--dex-okd-input-focus-caret-color);
  color: var(--dex-okd-input-default-text-color);
  display: flex;
  font-family: inherit;
  outline: none;
  text-align: center;
  transition: border-color .3s, box-shadow .3s
}

.dex-input-verify .dex-input-verify-input:-webkit-autofill {
  -webkit-text-fill-color: var(--dex-okd-input-default-text-color) !important;
  border: none;
  -webkit-box-shadow: 0 0 0 30px var(--dex-okd-input-default-background) inset
}

.dex-input-verify .dex-input-verify-input.input-xl {
  border-radius: 6px;
  font-size: 26px;
  height: 44px;
  margin-right: 8px;
  width: 40px
}

.dex-input-verify .dex-input-verify-input.input-xl.auto-size {
  height: -webkit-fit-content;
  height: -moz-fit-content;
  height: fit-content;
  min-height: 44px
}

.dex-input-verify .dex-input-verify-input.input-xl:last-child {
  margin-right: unset
}

.dex-input-verify .dex-input-verify-input.input-lg {
  border-radius: 6px;
  font-size: 26px;
  height: 44px;
  margin-right: 8px;
  width: 40px
}

.dex-input-verify .dex-input-verify-input.input-lg.auto-size {
  height: -webkit-fit-content;
  height: -moz-fit-content;
  height: fit-content;
  min-height: 44px
}

.dex-input-verify .dex-input-verify-input.input-lg:last-child {
  margin-right: unset
}

.dex-input-verify .dex-input-verify-input.input-xs {
  border-radius: 6px;
  font-size: 26px;
  height: 44px;
  margin-right: 8px;
  width: 40px
}

.dex-input-verify .dex-input-verify-input.input-xs.auto-size {
  height: -webkit-fit-content;
  height: -moz-fit-content;
  height: fit-content;
  min-height: 44px
}

.dex-input-verify .dex-input-verify-input.input-xs:last-child {
  margin-right: unset
}

.dex-input-verify .dex-input-verify-input.input-sm {
  border-radius: 6px;
  font-size: 20px;
  height: 40px;
  margin-right: 10px;
  width: 40px
}

.dex-input-verify .dex-input-verify-input.input-sm.auto-size {
  height: -webkit-fit-content;
  height: -moz-fit-content;
  height: fit-content;
  min-height: 40px
}

.dex-input-verify .dex-input-verify-input.input-sm:last-child {
  margin-right: unset
}

.dex-input-verify .dex-input-verify-input.input-md {
  border-radius: 6px;
  font-size: 26px;
  height: 44px;
  margin-right: 8px;
  width: 40px
}

.dex-input-verify .dex-input-verify-input.input-md.auto-size {
  height: -webkit-fit-content;
  height: -moz-fit-content;
  height: fit-content;
  min-height: 44px
}

.dex-input-verify .dex-input-verify-input.input-md:last-child {
  margin-right: unset
}

.dex-input-verify .dex-input-verify-input.error {
  border-color: var(--dex-okd-input-verify-error-border-color, var(--dex-okd-input-error-border-color))
}

.dex-input-verify .dex-input-verify-input.disabled {
  -webkit-text-fill-color: var(--dex-okd-input-disabled-text-color);
  background: var(--dex-okd-input-disabled-background);
  border: thin solid var(--dex-okd-input-disabled-border-color);
  box-shadow: var(--dex-okd-input-disabled-shadow);
  caret-color: var(--dex-okd-input-disabled-caret-color);
  color: var(--dex-okd-input-disabled-text-color);
  cursor: not-allowed
}

.dex-notification-default {
  height: 100vh;
  position: fixed;
  width: 100vw
}

.dex-notification-default,
.dex-notification-wrap {
  box-sizing: border-box;
  display: flex;
  flex-direction: column;
  left: 0;
  line-height: 1;
  margin: 0;
  padding: 0;
  pointer-events: none;
  top: 0
}

.dex-notification-wrap {
  height: 100%;
  position: absolute;
  width: 100%
}

.dex-notification * {
  box-sizing: border-box
}

.dex-notification-container.container-remove {
  animation-duration: .55s;
  animation-name: NotificationOutTop
}

.dex-notification-box {
  animation-duration: .3s;
  background: var(--dex-okd-notification-box-background);
  border: thin solid var(--dex-okd-notification-box-border-color);
  border-radius: var(--dex-okd-notification-box-border-radius);
  box-shadow: var(--dex-okd-notification-box-shadow);
  display: inline-flex;
  line-height: 1;
  margin: calc(var(--dex-okd-notification-box-each-margin)/2) 0;
  max-width: var(--dex-okd-notification-box-max-width);
  min-width: var(--dex-okd-notification-box-min-width);
  overflow: hidden;
  padding: var(--dex-okd-notification-box-padding);
  pointer-events: all;
  position: relative
}

.dex-notification-box.auto-width {
  min-width: var(--dex-okd-notification-box-auto-width-min-width)
}

.dex-notification-box .dex-notification-icon-circle-container {
  display: inline-block;
  height: 20px;
  margin-right: var(--dex-okd-notification-box-icon-text-margin);
  position: relative;
  vertical-align: top;
  width: 20px
}

.dex-notification-box .dex-notification-icon-new {
  font-size: 20px;
  height: 100%;
  width: 100%
}

.dex-notification-box .dex-notification-content {
  display: inline-flex;
  flex: 1 1;
  flex-direction: column;
  flex-wrap: wrap;
  word-break: break-word
}

.dex-notification-box .dex-notification-inline {
  flex-direction: unset
}

.dex-notification-box .dex-notification-inline .dex-notification-action {
  margin-top: 0;
  width: auto
}

.dex-notification-box .dex-notification-title-box {
  display: inline-flex;
  flex: 1 1;
  flex-direction: column;
  flex-wrap: wrap
}

.dex-notification-box .dex-notification-title {
  color: var(--dex-okd-notification-title-color);
  flex: 1 1;
  flex-shrink: 0;
  font-size: var(--dex-okd-notification-title-font-size);
  font-weight: 500;
  line-height: var(--dex-okd-notification-title-line-height);
  text-align: left
}

.dex-notification-box .dex-notification-desc,
.dex-notification-box .dex-notification-text {
  color: var(--dex-okd-notification-text-color);
  font-size: var(--dex-okd-notification-text-font-size);
  line-height: var(--dex-okd-notification-text-line-height)
}

.dex-notification-box .dex-notification-desc {
  margin-top: 4px;
  text-align: left;
  width: 100%
}

.dex-notification-box .dex-notification-action {
  display: inline-block;
  margin-top: 12px;
  pointer-events: auto;
  text-align: left;
  width: 100%
}

.dex-notification-box .dex-notification-action .action-undo {
  color: var(--dex-okd-notification-action-confirm-btn-color)
}

.dex-notification-box .dex-notification-action .action-dismiss,
.dex-notification-box .dex-notification-action .action-undo {
  cursor: pointer;
  font-size: var(--dex-okd-notification-action-font-size);
  font-weight: 500;
  line-height: var(--dex-okd-notification-action-line-height)
}

.dex-notification-box .dex-notification-action .action-dismiss {
  color: var(--dex-okd-notification-action-cancel-btn-color)
}

.dex-notification-box .dex-notification-action .action-undo+.action-dismiss {
  margin-left: 16px
}

.dex-notification-box .dex-notification-close {
  -webkit-tap-highlight-color: transparent;
  color: var(--dex-okd-notification-box-close-icon-color);
  cursor: pointer;
  font-size: 22px;
  height: 22px;
  margin-left: 15px;
  pointer-events: auto;
  position: relative;
  top: -2px;
  width: 22px
}

.dex-notification-box.success .dex-notification-icon-new {
  color: var(--dex-okd-notification-success-icon-color)
}

.dex-notification-box.info .dex-notification-icon-new {
  color: var(--dex-okd-notification-info-icon-color)
}

.dex-notification-box.warn .dex-notification-icon-new {
  color: var(--dex-okd-notification-warn-icon-color)
}

.dex-notification-box.error .dex-notification-icon-new {
  color: var(--dex-okd-notification-error-icon-color)
}

.dex-notification-box.pending .dex-notification-icon-new {
  color: var(--dex-okd-notification-pending-icon-color)
}

.dex-notification.dex-notification-bottom,
.dex-notification.dex-notification-bottom-left,
.dex-notification.dex-notification-bottom-right {
  justify-content: flex-end
}

.dex-notification.dex-notification-bottom .container-remove,
.dex-notification.dex-notification-bottom-left .container-remove,
.dex-notification.dex-notification-bottom-right .container-remove {
  animation-name: NotificationOutBottom
}

.dex-notification.dex-notification-bottom-right .dex-notification-container,
.dex-notification.dex-notification-top-right .dex-notification-container {
  text-align: right
}

.dex-notification.dex-notification-bottom .dex-notification-container,
.dex-notification.dex-notification-top .dex-notification-container {
  text-align: center
}

.dex-notification.dex-notification-bottom-left .dex-notification-box,
.dex-notification.dex-notification-top-left .dex-notification-box {
  animation-name: NotificationInLeft
}

.dex-notification.dex-notification-bottom-right .dex-notification-box,
.dex-notification.dex-notification-top-right .dex-notification-box {
  animation-name: NotificationInRight
}

.dex-notification.dex-notification-top .dex-notification-box {
  animation-name: NotificationInTop
}

.dex-notification.dex-notification-bottom .dex-notification-box {
  animation-name: NotificationInBottom
}

@media (max-width:767px) {

  .dex-notification.dex-notification-bottom-left .dex-notification-container,
  .dex-notification.dex-notification-bottom-right .dex-notification-container,
  .dex-notification.dex-notification-top-left .dex-notification-container,
  .dex-notification.dex-notification-top-right .dex-notification-container {
    text-align: center
  }

  .dex-notification-box {
    min-width: unset;
    width: 100%
  }

  .dex-notification-box.auto-width {
    width: auto
  }
}

.dex-notification-box .dex-notification-icon-pending-poster,
.dex-notification-box .dex-notification-icon-success-poster {
  color: var(--dex-okd-notification-success-icon-color);
  color: var(--dex-okd-color-surface-success-default, var(--dex-okd-notification-success-icon-color));
  font-size: 20px;
  left: 50%;
  position: absolute;
  top: 50%;
  transform: translate(-50%, -50%)
}

.dex-notification-box .dex-notification-icon-error-poster {
  color: var(--dex-okd-notification-error-icon-color);
  color: var(--dex-okd-color-surface-danger-default, var(--dex-okd-notification-error-icon-color));
  font-size: 20px;
  left: 50%;
  position: absolute;
  top: 50%;
  transform: translate(-50%, -50%)
}

@keyframes NotificationInLeft {
  0% {
    opacity: 0;
    transform: translate3d(-30px, 0, 0)
  }

  to {
    opacity: 1;
    transform: translateZ(0)
  }
}

@keyframes NotificationInRight {
  0% {
    opacity: 0;
    transform: translate3d(30px, 0, 0)
  }

  to {
    opacity: 1;
    transform: translateZ(0)
  }
}

@keyframes NotificationInTop {
  0% {
    opacity: 0;
    transform: translate3d(0, -30px, 0)
  }

  to {
    opacity: 1;
    transform: translateZ(0)
  }
}

@keyframes NotificationInBottom {
  0% {
    opacity: 0;
    transform: translate3d(0, 30px, 0)
  }

  to {
    opacity: 1;
    transform: translateZ(0)
  }
}

@keyframes NotificationOutBottom {
  0% {
    max-height: 150px;
    opacity: 1;
    transform: translateZ(0)
  }

  to {
    max-height: 0;
    opacity: 0;
    transform: translate3d(0, 30px, 0)
  }
}

@keyframes NotificationOutTop {
  0% {
    max-height: 150px;
    opacity: 1;
    transform: translateZ(0)
  }

  to {
    max-height: 0;
    opacity: 0;
    transform: translate3d(0, -30px, 0)
  }
}

.dex-overflow {
  overflow: hidden
}

.dex-overflow-hidden {
  height: 0;
  opacity: 0;
  overflow-y: hidden;
  pointer-events: none;
  position: absolute
}

.dex-overflow_scroll {
  --dex-okd-inner-overflowscroll-nav-button-bg-color: var(--dex-okd-overflowscroll-icon-bg-start-color, #fff);
  position: relative;
  width: 100%
}

.dex-overflow_scroll-scroll {
  overflow-x: scroll;
  scroll-behavior: smooth;
  scrollbar-width: none;
  white-space: nowrap;
  width: 100%
}

.dex-overflow_scroll-scroll::-webkit-scrollbar {
  display: none;
  height: 0;
  width: 0
}

.dex-overflow_scroll-scroll-children {
  display: flex;
  white-space: nowrap;
  width: -webkit-fit-content;
  width: -moz-fit-content;
  width: fit-content
}

.dex-overflow_scroll-nav {
  cursor: pointer
}

.dex-overflow_scroll-nav-icon {
  align-items: center;
  background-image: linear-gradient(270deg, var(--dex-okd-inner-overflowscroll-nav-button-bg-color) 72.22%, hsla(0, 0%, 100%, 0) 100%);
  background-image: linear-gradient(270deg, var(--dex-okd-inner-overflowscroll-nav-button-bg-color) 72.22%, var(--dex-okd-overflowscroll-icon-bg-end-color, hsla(0, 0%, 100%, 0)) 100%);
  color: #929292;
  color: var(--dex-okd-overflowscroll-icon-color, #929292);
  display: flex;
  height: 100%;
  justify-content: center;
  position: absolute;
  top: 0;
  visibility: visible;
  width: 36px;
  z-index: 9
}

.dex-overflow_scroll-nav-icon:hover {
  color: #3d3d3d;
  color: var(--dex-okd-overflowscroll-icon-hover-color, #3d3d3d)
}

.dex-overflow_scroll-nav .icon-left {
  background-image: linear-gradient(-270deg, var(--dex-okd-inner-overflowscroll-nav-button-bg-color) 72.22%, hsla(0, 0%, 100%, 0) 100%);
  background-image: linear-gradient(-270deg, var(--dex-okd-inner-overflowscroll-nav-button-bg-color) 72.22%, var(--dex-okd-overflowscroll-icon-bg-end-color, hsla(0, 0%, 100%, 0)) 100%);
  left: 0
}

.dex-overflow_scroll-nav .icon-left-inner {
  transform: rotate(180deg)
}

.dex-overflow_scroll-nav .icon-right {
  right: 0
}

.dex-overflow_scroll-nav .icon-hide {
  visibility: hidden
}

.dex-overflow_scroll-right-alpha {
  background-image: linear-gradient(90deg, hsla(0, 0%, 100%, 0), #fff);
  background-image: linear-gradient(90deg, var(--dex-okd-overflowscroll-icon-bg-end-color, hsla(0, 0%, 100%, 0)), var(--dex-okd-overflowscroll-icon-bg-start-color, #fff));
  height: 100%;
  pointer-events: none;
  position: absolute;
  right: 0;
  top: 0;
  width: 20px;
  z-index: 9
}

.dex-pagination {
  align-items: center;
  display: flex;
  font-size: var(--dex-okd-pagination-default-font-size);
  padding: 0;
  -webkit-user-select: none;
  -moz-user-select: none;
  -ms-user-select: none;
  user-select: none
}

.dex-pagination-left {
  display: flex;
  justify-content: flex-start
}

.dex-pagination-center {
  display: flex;
  justify-content: center
}

.dex-pagination-right {
  display: flex;
  justify-content: flex-end
}

@media (max-width:767px) {
  .dex-pagination-hide {
    display: none
  }
}

.dex-pagination>li {
  list-style: none;
  outline: none
}

.dex-pagination>li+li {
  margin-left: var(--dex-okd-pagination-default-margin-horizontal-size)
}

.dex-pagination:after {
  clear: both;
  content: " ";
  display: block;
  height: 0;
  overflow: hidden;
  visibility: hidden
}

.dex-pagination-item {
  align-items: center;
  background: var(--dex-okd-pagination-normal-background-color);
  border-bottom: unset;
  border-radius: var(--dex-okd-pagination-default-border-radius);
  box-sizing: border-box;
  color: var(--dex-okd-pagination-normal-text-new-color);
  cursor: pointer;
  display: flex;
  float: left;
  height: var(--dex-okd-pagination-default-height-size);
  justify-content: center;
  line-height: var(--dex-okd-pagination-default-height-size);
  list-style: none;
  min-width: var(--dex-okd-pagination-default-min-width-size);
  outline: none;
  padding: var(--dex-okd-pagination-default-padding-vertical-size) var(--dex-okd-pagination-default-padding-horizontal-size);
  text-align: center
}

.dex-pagination-item:focus-visible {
  border-radius: var(--dex-okd-pagination-default-border-radius);
  outline: 2px solid var(--dex-okd-color-border-focus);
  outline-color: var(--dex-okd-color-border-focus);
  outline-offset: 2px;
  outline-style: solid;
  outline-width: 2px
}

.dex-pagination-item.hover-status,
.dex-pagination-item:hover:not(.dex-pagination-item-active) {
  background: var(--dex-okd-pagination-hover-background-color);
  color: var(--dex-okd-pagination-hover-text-new-color)
}

.dex-pagination-item-active {
  background: var(--dex-okd-pagination-active-background-color);
  color: var(--dex-okd-pagination-active-text-new-color)
}

.dex-pagination-item-link {
  text-decoration: none
}

.dex-pagination-item+.dex-pagination-item {
  margin-left: var(--dex-okd-pagination-default-margin-horizontal-size)
}

.dex-pagination-jump-next,
.dex-pagination-jump-prev {
  margin: 0 var(--dex-okd-pagination-default-margin-horizontal-size);
  outline: none
}

.dex-pagination-jump-next .jump-icon,
.dex-pagination-jump-prev .jump-icon {
  font-size: 18px;
  margin-top: 1px
}

.dex-pagination-jump-next.hover-status .jump-icon,
.dex-pagination-jump-next:hover .jump-icon,
.dex-pagination-jump-prev.hover-status .jump-icon,
.dex-pagination-jump-prev:hover .jump-icon {
  color: var(--dex-okd-pagination-icon-jump-hover-text-color)
}

.dex-pagination-jump-next-no-spacing {
  margin-right: 0
}

.dex-pagination-jump-next,
.dex-pagination-jump-prev,
.dex-pagination-next,
.dex-pagination-prev {
  cursor: pointer;
  float: left;
  height: var(--dex-okd-pagination-default-height-size);
  line-height: var(--dex-okd-pagination-default-height-size);
  list-style: none;
  min-width: var(--dex-okd-pagination-default-min-width-size);
  text-align: center
}

.dex-pagination-jump-next,
.dex-pagination-jump-prev {
  color: var(--dex-okd-pagination-icon-jump-text-color)
}

.dex-pagination-jump-next:focus-visible,
.dex-pagination-jump-prev:focus-visible {
  border-radius: 100px;
  outline: 2px solid var(--dex-okd-color-border-focus);
  outline-color: var(--dex-okd-color-border-focus);
  outline-offset: 2px;
  outline-style: solid;
  outline-width: 2px
}

.dex-pagination-next:focus-visible,
.dex-pagination-prev:focus-visible {
  border-radius: 100px;
  outline: 2px solid var(--dex-okd-color-border-focus);
  outline-color: var(--dex-okd-color-border-focus);
  outline-offset: 2px;
  outline-style: solid;
  outline-width: 2px
}

.dex-pagination-next .iconfont,
.dex-pagination-prev .iconfont {
  font-size: var(--dex-okd-pagination-icon-font-size)
}

.dex-pagination-next.hover-status,
.dex-pagination-next:not(.dex-pagination-disabled),
.dex-pagination-prev.hover-status,
.dex-pagination-prev:not(.dex-pagination-disabled) {
  background: var(--dex-okd-pagination-normal-background-color);
  border-radius: var(--dex-okd-pagination-default-border-radius);
  color: var(--dex-okd-pagination-normal-text-new-color)
}

.dex-pagination-next.hover-status:hover,
.dex-pagination-next:not(.dex-pagination-disabled):hover,
.dex-pagination-prev.hover-status:hover,
.dex-pagination-prev:not(.dex-pagination-disabled):hover {
  background: var(--dex-okd-pagination-hover-background-color);
  color: var(--dex-okd-pagination-hover-text-new-color)
}

.dex-pagination-prev {
  margin-right: var(--dex-okd-pagination-default-margin-horizontal-size)
}

.dex-pagination-next {
  margin-left: var(--dex-okd-pagination-default-margin-horizontal-size)
}

.dex-pagination-prev+.dex-pagination-next {
  margin-left: 0
}

.dex-pagination-disabled {
  color: var(--dex-okd-pagination-disabled-text-new-color);
  cursor: not-allowed
}

.dex-pagination-simple-icon {
  margin: 0
}

.dex-pagination-simple-pager {
  color: var(--dex-okd-pagination-simple-default-text-color);
  float: left;
  line-height: var(--dex-okd-pagination-simple-default-line-height);
  list-style: none
}

.dex-pagination-simple-pager-inner {
  margin: var(--dex-okd-pagination-simple-slash-margin-vertical) var(--dex-okd-pagination-simple-slash-margin-horizontal-size)
}

.dex-pagination.dex-pagination-load {
  background: var(--dex-okd-pagination-load-background);
  color: var(--dex-okd-pagination-load-text-color);
  display: none;
  margin: 24px auto
}

@media (max-width:767px) {

  .dex-pagination.dex-pagination-load,
  .dex-pagination.dex-pagination-loading {
    display: flex
  }
}

@media only screen and (max-width:1024px) {

  .dex-pagination-item-after-jump-prev,
  .dex-pagination-item-before-jump-next {
    display: none
  }
}

.dex-overflow_scroll-reversed .dex-overflow_scroll-nav-icon {
  background-image: linear-gradient(270deg, var(--dex-okd-color-gray-900) 72.22%, var(--dex-okd-color-gray-900) 100%);
  background-image: linear-gradient(270deg, var(--dex-okd-overflowscroll-reversed-icon-bg-start-color, var(--dex-okd-color-gray-900)) 72.22%, var(--dex-okd-overflowscroll-reversed-icon-bg-end-color, var(--dex-okd-color-gray-900)) 100%);
  color: #929292;
  color: var(--dex-okd-overflowscroll-reversed-icon-color, #929292)
}

.dex-overflow_scroll-reversed .dex-overflow_scroll-nav-icon:hover {
  color: #e4e2e2;
  color: var(--dex-okd-overflowscroll-reversed-icon-hover-color, #e4e2e2)
}

.dex-overflow_scroll-reversed .icon-left {
  background-image: linear-gradient(-270deg, var(--dex-okd-color-gray-900) 72.22%, var(--dex-okd-color-gray-900) 100%);
  background-image: linear-gradient(-270deg, var(--dex-okd-overflowscroll-reversed-icon-bg-start-color, var(--dex-okd-color-gray-900)) 72.22%, var(--dex-okd-overflowscroll-reversed-icon-bg-end-color, var(--dex-okd-color-gray-900)) 100%)
}

.dex-picker-view {
  box-sizing: border-box;
  display: flex;
  height: 100%;
  justify-content: center;
  position: relative;
  width: 100%
}

.dex-picker-view-button {
  box-sizing: border-box;
  height: 56px;
  padding-right: 23px;
  padding-top: 12px;
  text-align: right
}

.dex-picker-view-wheel-column {
  flex: 1 1;
  height: 100%;
  overflow-y: scroll;
  scrollbar-width: none
}

.dex-picker-view-wheel-column::-webkit-scrollbar {
  display: none
}

.dex-picker-view-wheel-column .column-item-container {
  height: 100%
}

.dex-picker-view-wheel-column-item {
  color: #929292;
  color: var(--dex-okd-pickerview-item-default-font-color, #929292);
  cursor: pointer;
  font-size: 14px;
  font-size: var(--dex-okd-pickerview-item-default-font-size, 14px);
  font-weight: 400;
  font-weight: var(--dex-okd-pickerview-item-default-font-weight, 400);
  height: 36px;
  height: var(--dex-okd-pickerview-item-default-height, 36px);
  line-height: 36px;
  line-height: var(--dex-okd-pickerview-item-default-height, 36px);
  text-align: center;
  -webkit-user-select: none;
  -moz-user-select: none;
  -ms-user-select: none;
  user-select: none;
  width: 100%
}

.dex-picker-view-wheel-column-item-active {
  color: #000;
  color: var(--dex-okd-pickerview-item-active-font-color, #000);
  font-weight: 500;
  font-weight: var(--dex-okd-pickerview-item-active-font-weight, 500)
}

@media (max-width:767px) {
  .dex-picker-view-wheel-column-item {
    font-size: 16px;
    font-size: var(--dex-okd-pickerview-sm-item-default-font-size, 16px)
  }
}

.dex-picker-view-wheel-column-empty {
  height: calc(50% - 18px);
  height: calc(50% - var(--dex-okd-pickerview-item-default-height, 36px)/2)
}

.dex-picker-view-mask {
  display: flex;
  flex-direction: column;
  height: 100%;
  justify-content: center;
  left: 0;
  pointer-events: none;
  position: absolute;
  top: 0;
  width: 100%;
  z-index: 1000
}

.dex-picker-view-mask-middle {
  border-bottom: 1px solid #ebebeb;
  border-bottom: 1px solid var(--dex-okd-pickerview-item-active-border-color, #ebebeb);
  border-top: 1px solid #ebebeb;
  border-top: 1px solid var(--dex-okd-pickerview-item-active-border-color, #ebebeb);
  box-sizing: border-box;
  flex: none;
  height: 36px;
  height: var(--dex-okd-pickerview-item-default-height, 36px)
}

.dex-negativebutton-xxs {
  font-size: 12px;
  font-size: var(--dex-okd-negativebutton-xxs-font-size, 12px);
  font-weight: 400;
  font-weight: var(--dex-okd-negativebutton-xxs-font-weight, 400);
  line-height: 16px;
  line-height: var(--dex-okd-negativebutton-xxs-line-height, 16px);
  min-width: 63px;
  min-width: var(--dex-okd-negativebutton-xxs-min-width, 63px);
  padding: 4px 12px;
  padding: var(--dex-okd-negativebutton-xxs-padding-vertical, 4px) var(--dex-okd-negativebutton-xxs-padding-horizontal, 12px)
}

.dex-negativebutton-xxs .dex-negativebutton-loader-circle {
  height: 14px;
  height: var(--dex-okd-negativebutton-xxs-loader-width, 14px);
  width: 14px;
  width: var(--dex-okd-negativebutton-xxs-loader-width, 14px)
}

.dex-negativebutton-xxs .dex-negativebutton-icon {
  font-size: 14px;
  font-size: var(--dex-okd-negativebutton-xxs-icon-size, 14px);
  font-weight: 400;
  font-weight: var(--dex-okd-negativebutton-xxs-font-weight, 400)
}

.dex-negativebutton-xxs .dex-negativebutton-icon-leading {
  margin-right: 6px;
  margin-right: var(--dex-okd-negativebutton-xxs-icon-margin-right, 6px)
}

.dex-negativebutton-xxs .dex-negativebutton-icon-tailing {
  margin-left: 6px;
  margin-left: var(--dex-okd-negativebutton-xxs-icon-margin-right, 6px)
}

.dex-negativebutton-loading-text .dex-negativebutton-loader {
  margin-right: var(--dex-okd-negativebutton-xxs-loader-margin-right, 6px)
}

.dex-negativebutton-xs {
  font-size: 12px;
  font-size: var(--dex-okd-negativebutton-xs-font-size, 12px);
  font-weight: 400;
  font-weight: var(--dex-okd-negativebutton-xs-font-weight, 400);
  line-height: 16px;
  line-height: var(--dex-okd-negativebutton-xs-line-height, 16px);
  min-width: 63px;
  min-width: var(--dex-okd-negativebutton-xs-min-width, 63px);
  padding: 6px 12px;
  padding: var(--dex-okd-negativebutton-xs-padding-vertical, 6px) var(--dex-okd-negativebutton-xs-padding-horizontal, 12px)
}

.dex-negativebutton-xs .dex-negativebutton-loader-circle {
  height: 14px;
  height: var(--dex-okd-negativebutton-xs-loader-width, 14px);
  width: 14px;
  width: var(--dex-okd-negativebutton-xs-loader-width, 14px)
}

.dex-negativebutton-xs .dex-negativebutton-icon {
  font-size: 14px;
  font-size: var(--dex-okd-negativebutton-xs-icon-size, 14px);
  font-weight: 400;
  font-weight: var(--dex-okd-negativebutton-xs-font-weight, 400)
}

.dex-negativebutton-xs .dex-negativebutton-icon-leading {
  margin-right: 6px;
  margin-right: var(--dex-okd-negativebutton-xs-icon-margin-right, 6px)
}

.dex-negativebutton-xs .dex-negativebutton-icon-tailing {
  margin-left: 6px;
  margin-left: var(--dex-okd-negativebutton-xs-icon-margin-right, 6px)
}

.dex-negativebutton-loading-text .dex-negativebutton-loader {
  margin-right: var(--dex-okd-negativebutton-xs-loader-margin-right, 6px)
}

.dex-negativebutton-s {
  font-size: 14px;
  font-size: var(--dex-okd-negativebutton-s-font-size, 14px);
  font-weight: 400;
  font-weight: var(--dex-okd-negativebutton-s-font-weight, 400);
  line-height: 16px;
  line-height: var(--dex-okd-negativebutton-s-line-height, 16px);
  min-width: 72px;
  min-width: var(--dex-okd-negativebutton-s-min-width, 72px);
  padding: 8px 12px;
  padding: var(--dex-okd-negativebutton-s-padding-vertical, 8px) var(--dex-okd-negativebutton-s-padding-horizontal, 12px)
}

.dex-negativebutton-s .dex-negativebutton-loader-circle {
  height: 14px;
  height: var(--dex-okd-negativebutton-s-loader-width, 14px);
  width: 14px;
  width: var(--dex-okd-negativebutton-s-loader-width, 14px)
}

.dex-negativebutton-s .dex-negativebutton-icon {
  font-size: 14px;
  font-size: var(--dex-okd-negativebutton-s-icon-size, 14px);
  font-weight: 400;
  font-weight: var(--dex-okd-negativebutton-s-font-weight, 400)
}

.dex-negativebutton-s .dex-negativebutton-icon-leading {
  margin-right: 6px;
  margin-right: var(--dex-okd-negativebutton-s-icon-margin-right, 6px)
}

.dex-negativebutton-s .dex-negativebutton-icon-tailing {
  margin-left: 6px;
  margin-left: var(--dex-okd-negativebutton-s-icon-margin-right, 6px)
}

.dex-negativebutton-loading-text .dex-negativebutton-loader {
  margin-right: var(--dex-okd-negativebutton-s-loader-margin-right, 6px)
}

.dex-negativebutton-sm {
  font-size: 14px;
  font-size: var(--dex-okd-negativebutton-sm-font-size, 14px);
  font-weight: 400;
  font-weight: var(--dex-okd-negativebutton-sm-font-weight, 400);
  line-height: 16px;
  line-height: var(--dex-okd-negativebutton-sm-line-height, 16px);
  min-width: 81px;
  min-width: var(--dex-okd-negativebutton-sm-min-width, 81px);
  padding: 10px 16px;
  padding: var(--dex-okd-negativebutton-sm-padding-vertical, 10px) var(--dex-okd-negativebutton-sm-padding-horizontal, 16px)
}

.dex-negativebutton-sm .dex-negativebutton-loader-circle {
  height: 16px;
  height: var(--dex-okd-negativebutton-sm-loader-width, 16px);
  width: 16px;
  width: var(--dex-okd-negativebutton-sm-loader-width, 16px)
}

.dex-negativebutton-sm .dex-negativebutton-icon {
  font-size: 16px;
  font-size: var(--dex-okd-negativebutton-sm-icon-size, 16px);
  font-weight: 400;
  font-weight: var(--dex-okd-negativebutton-sm-font-weight, 400)
}

.dex-negativebutton-sm .dex-negativebutton-icon-leading {
  margin-right: 6px;
  margin-right: var(--dex-okd-negativebutton-sm-icon-margin-right, 6px)
}

.dex-negativebutton-sm .dex-negativebutton-icon-tailing {
  margin-left: 6px;
  margin-left: var(--dex-okd-negativebutton-sm-icon-margin-right, 6px)
}

.dex-negativebutton-loading-text .dex-negativebutton-loader {
  margin-right: var(--dex-okd-negativebutton-sm-loader-margin-right, 6px)
}

.dex-negativebutton-md {
  font-size: 14px;
  font-size: var(--dex-okd-negativebutton-md-font-size, 14px);
  font-weight: 400;
  font-weight: var(--dex-okd-negativebutton-md-font-weight, 400);
  line-height: 16px;
  line-height: var(--dex-okd-negativebutton-md-line-height, 16px);
  min-width: 90px;
  min-width: var(--dex-okd-negativebutton-md-min-width, 90px);
  padding: 12px 16px;
  padding: var(--dex-okd-negativebutton-md-padding-vertical, 12px) var(--dex-okd-negativebutton-md-padding-horizontal, 16px)
}

.dex-negativebutton-md .dex-negativebutton-loader-circle {
  height: 16px;
  height: var(--dex-okd-negativebutton-md-loader-width, 16px);
  width: 16px;
  width: var(--dex-okd-negativebutton-md-loader-width, 16px)
}

.dex-negativebutton-md .dex-negativebutton-icon {
  font-size: 16px;
  font-size: var(--dex-okd-negativebutton-md-icon-size, 16px);
  font-weight: 400;
  font-weight: var(--dex-okd-negativebutton-md-font-weight, 400)
}

.dex-negativebutton-md .dex-negativebutton-icon-leading {
  margin-right: 6px;
  margin-right: var(--dex-okd-negativebutton-md-icon-margin-right, 6px)
}

.dex-negativebutton-md .dex-negativebutton-icon-tailing {
  margin-left: 6px;
  margin-left: var(--dex-okd-negativebutton-md-icon-margin-right, 6px)
}

.dex-negativebutton-loading-text .dex-negativebutton-loader {
  margin-right: 6px;
  margin-right: var(--dex-okd-negativebutton-md-loader-margin-right, 6px)
}

.dex-negativebutton-lg {
  font-size: 16px;
  font-size: var(--dex-okd-negativebutton-lg-font-size, 16px);
  font-weight: 500;
  font-weight: var(--dex-okd-negativebutton-lg-font-weight, 500);
  line-height: 20px;
  line-height: var(--dex-okd-negativebutton-lg-line-height, 20px);
  min-width: 108px;
  min-width: var(--dex-okd-negativebutton-lg-min-width, 108px);
  padding: 14px 24px;
  padding: var(--dex-okd-negativebutton-lg-padding-vertical, 14px) var(--dex-okd-negativebutton-lg-padding-horizontal, 24px)
}

.dex-negativebutton-lg .dex-negativebutton-loader-circle {
  height: 20px;
  height: var(--dex-okd-negativebutton-lg-loader-width, 20px);
  width: 20px;
  width: var(--dex-okd-negativebutton-lg-loader-width, 20px)
}

.dex-negativebutton-lg .dex-negativebutton-icon {
  font-size: 20px;
  font-size: var(--dex-okd-negativebutton-lg-icon-size, 20px);
  font-weight: 500;
  font-weight: var(--dex-okd-negativebutton-lg-font-weight, 500)
}

.dex-negativebutton-lg .dex-negativebutton-icon-leading {
  margin-right: 8px;
  margin-right: var(--dex-okd-negativebutton-lg-icon-margin-right, 8px)
}

.dex-negativebutton-lg .dex-negativebutton-icon-tailing {
  margin-left: 8px;
  margin-left: var(--dex-okd-negativebutton-lg-icon-margin-right, 8px)
}

.dex-negativebutton-loading-text .dex-negativebutton-loader {
  margin-right: var(--dex-okd-negativebutton-lg-loader-margin-right, 8px)
}

.dex-negativebutton-xl {
  font-size: 18px;
  font-size: var(--dex-okd-negativebutton-xl-font-size, 18px);
  font-weight: 500;
  font-weight: var(--dex-okd-negativebutton-xl-font-weight, 500);
  line-height: 24px;
  line-height: var(--dex-okd-negativebutton-xl-line-height, 24px);
  min-width: 126px;
  min-width: var(--dex-okd-negativebutton-xl-min-width, 126px);
  padding: 16px 44px;
  padding: var(--dex-okd-negativebutton-xl-padding-vertical, 16px) var(--dex-okd-negativebutton-xl-padding-horizontal, 44px)
}

.dex-negativebutton-xl .dex-negativebutton-loader-circle {
  height: 20px;
  height: var(--dex-okd-negativebutton-xl-loader-width, 20px);
  width: 20px;
  width: var(--dex-okd-negativebutton-xl-loader-width, 20px)
}

.dex-negativebutton-xl .dex-negativebutton-icon {
  font-size: 20px;
  font-size: var(--dex-okd-negativebutton-xl-icon-size, 20px);
  font-weight: 500;
  font-weight: var(--dex-okd-negativebutton-xl-font-weight, 500)
}

.dex-negativebutton-xl .dex-negativebutton-icon-leading {
  margin-right: 8px;
  margin-right: var(--dex-okd-negativebutton-xl-icon-margin-right, 8px)
}

.dex-negativebutton-xl .dex-negativebutton-icon-tailing {
  margin-left: 8px;
  margin-left: var(--dex-okd-negativebutton-xl-icon-margin-right, 8px)
}

.dex-negativebutton-loading-text .dex-negativebutton-loader {
  margin-right: 8px;
  margin-right: var(--dex-okd-negativebutton-xl-loader-margin-right, 8px)
}

.dex-negativebutton {
  align-items: center;
  background-color: var(--dex-okd-color-surface-pnl-loss-default);
  background-color: var(--dex-okd-negativebutton-default-background, var(--dex-okd-color-surface-pnl-loss-default));
  border-radius: 50px;
  border-radius: var(--dex-okd-negativebutton-border-radius, 50px);
  box-sizing: border-box;
  color: var(--dex-okd-color-content-pnl-loss-oncolor);
  color: var(--dex-okd-negativebutton-default-color, var(--dex-okd-color-content-pnl-loss-oncolor));
  cursor: pointer;
  display: inline-flex;
  justify-content: center;
  outline: none;
  position: relative;
  text-decoration: none;
  touch-action: manipulation;
  -webkit-user-select: none;
  -moz-user-select: none;
  -ms-user-select: none;
  user-select: none
}

.dex-negativebutton:focus-visible {
  border-radius: 50px;
  border-radius: var(--dex-okd-negativebutton-border-radius, 50px);
  outline: 2px solid var(--dex-okd-color-border-focus);
  outline-color: var(--dex-okd-color-border-focus);
  outline-offset: 2px;
  outline-style: solid;
  outline-width: 2px
}

.dex-negativebutton.hover,
.dex-negativebutton:not(.dex-negativebutton-disabled):not(.dex-negativebutton-loading):hover {
  background-color: var(--dex-okd-color-surface-pnl-loss-hovered);
  background-color: var(--dex-okd-negativebutton-hover-background, var(--dex-okd-color-surface-pnl-loss-hovered))
}

.dex-negativebutton.active,
.dex-negativebutton:not(.dex-negativebutton-disabled):not(.dex-negativebutton-loading):active {
  background-color: var(--dex-okd-color-surface-pnl-loss-pressed);
  background-color: var(--dex-okd-negativebutton-active-background, var(--dex-okd-color-surface-pnl-loss-pressed))
}

.dex-negativebutton-disabled,
.dex-negativebutton.disabled {
  background-color: var(--dex-okd-color-surface-interactive-disabled);
  background-color: var(--dex-okd-negativebutton-disabled-background, var(--dex-okd-color-surface-interactive-disabled));
  color: var(--dex-okd-color-content-interactive-disabled);
  color: var(--dex-okd-negativebutton-disabled-color, var(--dex-okd-color-content-interactive-disabled));
  cursor: not-allowed
}

.dex-negativebutton-loading,
.dex-negativebutton.loading {
  background-color: var(--dex-okd-color-surface-pnl-loss-pressed);
  background-color: var(--dex-okd-negativebutton-loading-background, var(--dex-okd-color-surface-pnl-loss-pressed));
  color: transparent
}

.dex-negativebutton-loading .dex-negativebutton-loader,
.dex-negativebutton.loading .dex-negativebutton-loader {
  display: flex;
  position: absolute
}

.dex-negativebutton-loading-text {
  background-color: var(--dex-okd-color-surface-pnl-loss-pressed);
  background-color: var(--dex-okd-negativebutton-loading-background, var(--dex-okd-color-surface-pnl-loss-pressed));
  display: flex
}

.dex-negativebutton-block,
.dex-negativebutton.block {
  display: flex;
  width: 100%
}

.dex-negativebutton-ellipsis {
  display: block;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  width: 100%
}

.dex-negativebutton-loader-circle {
  border-color: var(--dex-okd-negativebutton-loader-track-color, var(--dex-okd-color-border-interactive-oncolor));
  border-top-color: var(--dex-okd-negativebutton-loader-mark-color, var(--dex-okd-color-content-static-inverse));
  border-width: 2px;
  border-width: var(--dex-okd-negativebutton-loader-border-width, 2px)
}

.dex-powerLink {
  color: inherit;
  text-decoration: none
}

.dex-powerLink-a11y:focus-visible {
  border-radius: 2px;
  outline: 2px solid var(--dex-okd-color-border-focus);
  outline-color: var(--dex-okd-color-border-focus);
  outline-offset: 2px;
  outline-style: solid;
  outline-width: 2px
}

.dex-picture {
  display: inline-block
}

.dex-picture-font {
  font-size: 0;
  line-height: 1
}

.dex-picture-cover {
  object-fit: cover
}

.dex-picture-contain {
  object-fit: contain
}

.dex-plain-button {
  color: inherit;
  cursor: pointer;
  font: inherit;
  text-align: unset
}

.dex-plain-button:focus-visible {
  border-radius: 4px;
  outline: 2px solid var(--dex-okd-color-border-focus);
  outline-color: var(--dex-okd-color-border-focus);
  outline-offset: 2px;
  outline-style: solid;
  outline-width: 2px
}

.dex-plain-button[disabled] {
  cursor: not-allowed
}

.dex-plain-button-as-div {
  display: block;
  line-height: inherit;
  width: 100%
}

.dex-popup {
  display: inline-flex;
  position: relative;
  width: -webkit-fit-content;
  width: -moz-fit-content;
  width: fit-content
}

.dex-popup-layer {
  display: none;
  opacity: 0;
  outline: none;
  position: absolute;
  transition: opacity .3s
}

.dex-popup-layer-visible {
  display: block;
  opacity: 1
}

.dex-popup-layer-arrow-inner {
  border: 1px solid transparent;
  border-radius: 2px;
  box-sizing: border-box;
  display: block;
  height: 100%;
  transform: rotate(45deg);
  transform-origin: center;
  width: 100%
}

.dex-popup-layer.dex-popup-overflow[data-popper-reference-hidden] {
  pointer-events: none;
  visibility: hidden
}

.dex-popup-white-board .dex-popup-layer-arrow-inner,
.dex-popup-white-board-content {
  background-color: var(--dex-okd-popup-white-board-background);
  border: 1px solid rgba(0, 0, 0, .05)
}

.dex-popup-white-board-content {
  border-radius: 4px;
  box-shadow: var(--dex-okd-popup-white-board-shadow)
}

.dex-popup-placement-lg-top {
  padding-bottom: 9px
}

.dex-popup-placement-lg-bottom {
  padding-top: 9px
}

.dex-popup-placement-lg-left {
  padding-right: 9px
}

.dex-popup-placement-lg-right {
  padding-left: 9px
}

.dex-popup-arrow-lg .dex-popup-layer-arrow {
  height: 14px;
  width: 14px
}

.dex-popup-arrow-lg[data-popper-placement*=top] {
  padding: 0 0 9px
}

.dex-popup-arrow-lg[data-popper-placement*=bottom] {
  padding: 9px 0 0
}

.dex-popup-arrow-lg[data-popper-placement*=left] {
  padding: 0 9px 0 0
}

.dex-popup-arrow-lg[data-popper-placement*=right] {
  padding: 0 0 0 9px
}

.dex-popup-arrow-lg[data-popper-placement*=top] .dex-popup-layer-arrow {
  margin-top: -17px;
  top: 100%
}

.dex-popup-arrow-lg[data-popper-placement*=top] .dex-popup-layer-arrow-inner {
  border-left-color: transparent !important;
  border-top-color: transparent !important
}

.dex-popup-arrow-lg[data-popper-placement*=right] .dex-popup-layer-arrow {
  margin-right: -17px;
  right: 100%
}

.dex-popup-arrow-lg[data-popper-placement*=right] .dex-popup-layer-arrow-inner {
  border-right-color: transparent !important;
  border-top-color: transparent !important
}

.dex-popup-arrow-lg[data-popper-placement*=bottom] .dex-popup-layer-arrow {
  bottom: 100%;
  margin-bottom: -17px
}

.dex-popup-arrow-lg[data-popper-placement*=bottom] .dex-popup-layer-arrow-inner {
  border-bottom-color: transparent !important;
  border-right-color: transparent !important
}

.dex-popup-arrow-lg[data-popper-placement*=left] .dex-popup-layer-arrow {
  left: 100%;
  margin-left: -17px
}

.dex-popup-arrow-lg[data-popper-placement*=left] .dex-popup-layer-arrow-inner {
  border-bottom-color: transparent !important;
  border-left-color: transparent !important
}

.dex-popup-placement-md-top {
  padding-bottom: 7px
}

.dex-popup-placement-md-bottom {
  padding-top: 7px
}

.dex-popup-placement-md-left {
  padding-right: 7px
}

.dex-popup-placement-md-right {
  padding-left: 7px
}

.dex-popup-arrow-md .dex-popup-layer-arrow {
  height: 10px;
  width: 10px
}

.dex-popup-arrow-md[data-popper-placement*=top] {
  padding: 0 0 7px
}

.dex-popup-arrow-md[data-popper-placement*=bottom] {
  padding: 7px 0 0
}

.dex-popup-arrow-md[data-popper-placement*=left] {
  padding: 0 7px 0 0
}

.dex-popup-arrow-md[data-popper-placement*=right] {
  padding: 0 0 0 7px
}

.dex-popup-arrow-md[data-popper-placement*=top] .dex-popup-layer-arrow {
  margin-top: -13px;
  top: 100%
}

.dex-popup-arrow-md[data-popper-placement*=top] .dex-popup-layer-arrow-inner {
  border-left-color: transparent !important;
  border-top-color: transparent !important
}

.dex-popup-arrow-md[data-popper-placement*=right] .dex-popup-layer-arrow {
  margin-right: -13px;
  right: 100%
}

.dex-popup-arrow-md[data-popper-placement*=right] .dex-popup-layer-arrow-inner {
  border-right-color: transparent !important;
  border-top-color: transparent !important
}

.dex-popup-arrow-md[data-popper-placement*=bottom] .dex-popup-layer-arrow {
  bottom: 100%;
  margin-bottom: -13px
}

.dex-popup-arrow-md[data-popper-placement*=bottom] .dex-popup-layer-arrow-inner {
  border-bottom-color: transparent !important;
  border-right-color: transparent !important
}

.dex-popup-arrow-md[data-popper-placement*=left] .dex-popup-layer-arrow {
  left: 100%;
  margin-left: -13px
}

.dex-popup-arrow-md[data-popper-placement*=left] .dex-popup-layer-arrow-inner {
  border-bottom-color: transparent !important;
  border-left-color: transparent !important
}

.dex-popover .dex-popup-layer-content {
  padding: 0
}

.dex-popover .dex-popup-layer-arrow-inner {
  background-color: var(--dex-okd-popover-layer-background);
  border-color: var(--dex-okd-popover-layer-border-color)
}

.dex-popover-arrow-special .dex-popup-layer-arrow[change-color] .dex-popup-layer-arrow-inner {
  background-color: var(--dex-okd-popover-title-background)
}

.dex-popover-arrow-special[data-popper-placement*=bottom] .dex-popup-layer-arrow-inner {
  background-color: var(--dex-okd-popover-title-background) !important
}

.dex-popover-content {
  background-color: var(--dex-okd-popover-layer-background);
  border: 1px solid var(--dex-okd-popover-layer-border-color);
  border-radius: 4px;
  box-shadow: var(--dex-okd-popover-common-layer-shadow);
  max-width: var(--dex-okd-popover-common-layer-width)
}

.dex-popover-content-title {
  background-color: var(--dex-okd-popover-title-background);
  border-top-left-radius: 4px;
  border-top-right-radius: 4px;
  color: var(--dex-okd-popover-title-color);
  font-weight: 500;
  line-height: 20px;
  padding: 8px 12px;
  position: relative
}

.dex-popover-content-desc {
  background-color: var(--dex-okd-popover-desc-background);
  border-bottom-left-radius: 4px;
  border-bottom-right-radius: 4px;
  color: var(--dex-okd-popover-desc-color);
  overflow: hidden;
  padding: var(--dex-okd-popover-common-padding)
}

.dex-popover-content-desc .dex-popover-content-desc-link {
  color: var(--dex-okd-popover-link-color);
  cursor: pointer;
  font-weight: 500;
  padding-left: 4px;
  text-decoration: underline
}

.dex-popover-content-desc-button {
  color: var(--dex-okd-popover-action-color);
  cursor: pointer;
  float: right;
  font-weight: 500;
  margin-top: 20px;
  overflow: hidden;
  padding: 0 10px;
  text-align: right
}

.dex-popover-content-desc-radius {
  border-top-left-radius: 4px;
  border-top-right-radius: 4px
}

.dex-popover-md .dex-popover-content {
  font-size: var(--dex-okd-popover-md-font-size);
  line-height: var(--dex-okd-popover-md-line-height)
}

.dex-popover-md .dex-popover-content-title {
  font-size: var(--dex-okd-popover-md-title-font-size)
}

.dex-popover-sm .dex-popover-content {
  font-size: var(--dex-okd-popover-sm-font-size);
  line-height: var(--dex-okd-popover-sm-line-height)
}

.dex-popover-sm .dex-popover-content-title {
  font-size: var(--dex-okd-popover-sm-title-font-size)
}

.dex-positivebutton-xxs {
  font-size: 12px;
  font-size: var(--dex-okd-positivebutton-xxs-font-size, 12px);
  font-weight: 400;
  font-weight: var(--dex-okd-positivebutton-xxs-font-weight, 400);
  line-height: 16px;
  line-height: var(--dex-okd-positivebutton-xxs-line-height, 16px);
  min-width: 63px;
  min-width: var(--dex-okd-positivebutton-xxs-min-width, 63px);
  padding: 4px 12px;
  padding: var(--dex-okd-positivebutton-xxs-padding-vertical, 4px) var(--dex-okd-positivebutton-xxs-padding-horizontal, 12px)
}

.dex-positivebutton-xxs .dex-positivebutton-loader-circle {
  height: 14px;
  height: var(--dex-okd-positivebutton-xxs-loader-width, 14px);
  width: 14px;
  width: var(--dex-okd-positivebutton-xxs-loader-width, 14px)
}

.dex-positivebutton-xxs .dex-positivebutton-icon {
  font-size: 14px;
  font-size: var(--dex-okd-positivebutton-xxs-icon-size, 14px);
  font-weight: 400;
  font-weight: var(--dex-okd-positivebutton-xxs-font-weight, 400)
}

.dex-positivebutton-xxs .dex-positivebutton-icon-leading {
  margin-right: 6px;
  margin-right: var(--dex-okd-positivebutton-xxs-icon-margin-right, 6px)
}

.dex-positivebutton-xxs .dex-positivebutton-icon-tailing {
  margin-left: 6px;
  margin-left: var(--dex-okd-positivebutton-xxs-icon-margin-right, 6px)
}

.dex-positivebutton-loading-text .dex-positivebutton-loader {
  margin-right: var(--dex-okd-positivebutton-xxs-loader-margin-right, 6px)
}

.dex-positivebutton-xs {
  font-size: 12px;
  font-size: var(--dex-okd-positivebutton-xs-font-size, 12px);
  font-weight: 400;
  font-weight: var(--dex-okd-positivebutton-xs-font-weight, 400);
  line-height: 16px;
  line-height: var(--dex-okd-positivebutton-xs-line-height, 16px);
  min-width: 63px;
  min-width: var(--dex-okd-positivebutton-xs-min-width, 63px);
  padding: 6px 12px;
  padding: var(--dex-okd-positivebutton-xs-padding-vertical, 6px) var(--dex-okd-positivebutton-xs-padding-horizontal, 12px)
}

.dex-positivebutton-xs .dex-positivebutton-loader-circle {
  height: 14px;
  height: var(--dex-okd-positivebutton-xs-loader-width, 14px);
  width: 14px;
  width: var(--dex-okd-positivebutton-xs-loader-width, 14px)
}

.dex-positivebutton-xs .dex-positivebutton-icon {
  font-size: 14px;
  font-size: var(--dex-okd-positivebutton-xs-icon-size, 14px);
  font-weight: 400;
  font-weight: var(--dex-okd-positivebutton-xs-font-weight, 400)
}

.dex-positivebutton-xs .dex-positivebutton-icon-leading {
  margin-right: 6px;
  margin-right: var(--dex-okd-positivebutton-xs-icon-margin-right, 6px)
}

.dex-positivebutton-xs .dex-positivebutton-icon-tailing {
  margin-left: 6px;
  margin-left: var(--dex-okd-positivebutton-xs-icon-margin-right, 6px)
}

.dex-positivebutton-loading-text .dex-positivebutton-loader {
  margin-right: var(--dex-okd-positivebutton-xs-loader-margin-right, 6px)
}

.dex-positivebutton-s {
  font-size: 14px;
  font-size: var(--dex-okd-positivebutton-s-font-size, 14px);
  font-weight: 400;
  font-weight: var(--dex-okd-positivebutton-s-font-weight, 400);
  line-height: 16px;
  line-height: var(--dex-okd-positivebutton-s-line-height, 16px);
  min-width: 72px;
  min-width: var(--dex-okd-positivebutton-s-min-width, 72px);
  padding: 8px 12px;
  padding: var(--dex-okd-positivebutton-s-padding-vertical, 8px) var(--dex-okd-positivebutton-s-padding-horizontal, 12px)
}

.dex-positivebutton-s .dex-positivebutton-loader-circle {
  height: 14px;
  height: var(--dex-okd-positivebutton-s-loader-width, 14px);
  width: 14px;
  width: var(--dex-okd-positivebutton-s-loader-width, 14px)
}

.dex-positivebutton-s .dex-positivebutton-icon {
  font-size: 14px;
  font-size: var(--dex-okd-positivebutton-s-icon-size, 14px);
  font-weight: 400;
  font-weight: var(--dex-okd-positivebutton-s-font-weight, 400)
}

.dex-positivebutton-s .dex-positivebutton-icon-leading {
  margin-right: 6px;
  margin-right: var(--dex-okd-positivebutton-s-icon-margin-right, 6px)
}

.dex-positivebutton-s .dex-positivebutton-icon-tailing {
  margin-left: 6px;
  margin-left: var(--dex-okd-positivebutton-s-icon-margin-right, 6px)
}

.dex-positivebutton-loading-text .dex-positivebutton-loader {
  margin-right: var(--dex-okd-positivebutton-s-loader-margin-right, 6px)
}

.dex-positivebutton-sm {
  font-size: 14px;
  font-size: var(--dex-okd-positivebutton-sm-font-size, 14px);
  font-weight: 400;
  font-weight: var(--dex-okd-positivebutton-sm-font-weight, 400);
  line-height: 16px;
  line-height: var(--dex-okd-positivebutton-sm-line-height, 16px);
  min-width: 81px;
  min-width: var(--dex-okd-positivebutton-sm-min-width, 81px);
  padding: 10px 16px;
  padding: var(--dex-okd-positivebutton-sm-padding-vertical, 10px) var(--dex-okd-positivebutton-sm-padding-horizontal, 16px)
}

.dex-positivebutton-sm .dex-positivebutton-loader-circle {
  height: 16px;
  height: var(--dex-okd-positivebutton-sm-loader-width, 16px);
  width: 16px;
  width: var(--dex-okd-positivebutton-sm-loader-width, 16px)
}

.dex-positivebutton-sm .dex-positivebutton-icon {
  font-size: 16px;
  font-size: var(--dex-okd-positivebutton-sm-icon-size, 16px);
  font-weight: 400;
  font-weight: var(--dex-okd-positivebutton-sm-font-weight, 400)
}

.dex-positivebutton-sm .dex-positivebutton-icon-leading {
  margin-right: 6px;
  margin-right: var(--dex-okd-positivebutton-sm-icon-margin-right, 6px)
}

.dex-positivebutton-sm .dex-positivebutton-icon-tailing {
  margin-left: 6px;
  margin-left: var(--dex-okd-positivebutton-sm-icon-margin-right, 6px)
}

.dex-positivebutton-loading-text .dex-positivebutton-loader {
  margin-right: var(--dex-okd-positivebutton-sm-loader-margin-right, 6px)
}

.dex-positivebutton-md {
  font-size: 14px;
  font-size: var(--dex-okd-positivebutton-md-font-size, 14px);
  font-weight: 400;
  font-weight: var(--dex-okd-positivebutton-md-font-weight, 400);
  line-height: 16px;
  line-height: var(--dex-okd-positivebutton-md-line-height, 16px);
  min-width: 90px;
  min-width: var(--dex-okd-positivebutton-md-min-width, 90px);
  padding: 12px 16px;
  padding: var(--dex-okd-positivebutton-md-padding-vertical, 12px) var(--dex-okd-positivebutton-md-padding-horizontal, 16px)
}

.dex-positivebutton-md .dex-positivebutton-loader-circle {
  height: 16px;
  height: var(--dex-okd-positivebutton-md-loader-width, 16px);
  width: 16px;
  width: var(--dex-okd-positivebutton-md-loader-width, 16px)
}

.dex-positivebutton-md .dex-positivebutton-icon {
  font-size: 16px;
  font-size: var(--dex-okd-positivebutton-md-icon-size, 16px);
  font-weight: 400;
  font-weight: var(--dex-okd-positivebutton-md-font-weight, 400)
}

.dex-positivebutton-md .dex-positivebutton-icon-leading {
  margin-right: 6px;
  margin-right: var(--dex-okd-positivebutton-md-icon-margin-right, 6px)
}

.dex-positivebutton-md .dex-positivebutton-icon-tailing {
  margin-left: 6px;
  margin-left: var(--dex-okd-positivebutton-md-icon-margin-right, 6px)
}

.dex-positivebutton-loading-text .dex-positivebutton-loader {
  margin-right: 6px;
  margin-right: var(--dex-okd-positivebutton-md-loader-margin-right, 6px)
}

.dex-positivebutton-lg {
  font-size: 16px;
  font-size: var(--dex-okd-positivebutton-lg-font-size, 16px);
  font-weight: 500;
  font-weight: var(--dex-okd-positivebutton-lg-font-weight, 500);
  line-height: 20px;
  line-height: var(--dex-okd-positivebutton-lg-line-height, 20px);
  min-width: 108px;
  min-width: var(--dex-okd-positivebutton-lg-min-width, 108px);
  padding: 14px 24px;
  padding: var(--dex-okd-positivebutton-lg-padding-vertical, 14px) var(--dex-okd-positivebutton-lg-padding-horizontal, 24px)
}

.dex-positivebutton-lg .dex-positivebutton-loader-circle {
  height: 20px;
  height: var(--dex-okd-positivebutton-lg-loader-width, 20px);
  width: 20px;
  width: var(--dex-okd-positivebutton-lg-loader-width, 20px)
}

.dex-positivebutton-lg .dex-positivebutton-icon {
  font-size: 20px;
  font-size: var(--dex-okd-positivebutton-lg-icon-size, 20px);
  font-weight: 500;
  font-weight: var(--dex-okd-positivebutton-lg-font-weight, 500)
}

.dex-positivebutton-lg .dex-positivebutton-icon-leading {
  margin-right: 8px;
  margin-right: var(--dex-okd-positivebutton-lg-icon-margin-right, 8px)
}

.dex-positivebutton-lg .dex-positivebutton-icon-tailing {
  margin-left: 8px;
  margin-left: var(--dex-okd-positivebutton-lg-icon-margin-right, 8px)
}

.dex-positivebutton-loading-text .dex-positivebutton-loader {
  margin-right: var(--dex-okd-positivebutton-lg-loader-margin-right, 8px)
}

.dex-positivebutton-xl {
  font-size: 18px;
  font-size: var(--dex-okd-positivebutton-xl-font-size, 18px);
  font-weight: 500;
  font-weight: var(--dex-okd-positivebutton-xl-font-weight, 500);
  line-height: 24px;
  line-height: var(--dex-okd-positivebutton-xl-line-height, 24px);
  min-width: 126px;
  min-width: var(--dex-okd-positivebutton-xl-min-width, 126px);
  padding: 16px 44px;
  padding: var(--dex-okd-positivebutton-xl-padding-vertical, 16px) var(--dex-okd-positivebutton-xl-padding-horizontal, 44px)
}

.dex-positivebutton-xl .dex-positivebutton-loader-circle {
  height: 20px;
  height: var(--dex-okd-positivebutton-xl-loader-width, 20px);
  width: 20px;
  width: var(--dex-okd-positivebutton-xl-loader-width, 20px)
}

.dex-positivebutton-xl .dex-positivebutton-icon {
  font-size: 20px;
  font-size: var(--dex-okd-positivebutton-xl-icon-size, 20px);
  font-weight: 500;
  font-weight: var(--dex-okd-positivebutton-xl-font-weight, 500)
}

.dex-positivebutton-xl .dex-positivebutton-icon-leading {
  margin-right: 8px;
  margin-right: var(--dex-okd-positivebutton-xl-icon-margin-right, 8px)
}

.dex-positivebutton-xl .dex-positivebutton-icon-tailing {
  margin-left: 8px;
  margin-left: var(--dex-okd-positivebutton-xl-icon-margin-right, 8px)
}

.dex-positivebutton-loading-text .dex-positivebutton-loader {
  margin-right: 8px;
  margin-right: var(--dex-okd-positivebutton-xl-loader-margin-right, 8px)
}

.dex-positivebutton {
  align-items: center;
  background-color: var(--dex-okd-color-surface-pnl-profit-default);
  background-color: var(--dex-okd-positivebutton-default-background, var(--dex-okd-color-surface-pnl-profit-default));
  border-radius: 50px;
  border-radius: var(--dex-okd-positivebutton-border-radius, 50px);
  box-sizing: border-box;
  color: var(--dex-okd-color-content-pnl-profit-oncolor);
  color: var(--dex-okd-positivebutton-default-color, var(--dex-okd-color-content-pnl-profit-oncolor));
  cursor: pointer;
  display: inline-flex;
  justify-content: center;
  outline: none;
  position: relative;
  text-decoration: none;
  touch-action: manipulation;
  -webkit-user-select: none;
  -moz-user-select: none;
  -ms-user-select: none;
  user-select: none
}

.dex-positivebutton:focus-visible {
  border-radius: 50px;
  border-radius: var(--dex-okd-positivebutton-border-radius, 50px);
  outline: 2px solid var(--dex-okd-color-border-focus);
  outline-color: var(--dex-okd-color-border-focus);
  outline-offset: 2px;
  outline-style: solid;
  outline-width: 2px
}

.dex-positivebutton.hover,
.dex-positivebutton:not(.dex-positivebutton-disabled):not(.dex-positivebutton-loading):hover {
  background-color: var(--dex-okd-color-surface-pnl-profit-hovered);
  background-color: var(--dex-okd-positivebutton-hover-background, var(--dex-okd-color-surface-pnl-profit-hovered))
}

.dex-positivebutton.active,
.dex-positivebutton:not(.dex-positivebutton-disabled):not(.dex-positivebutton-loading):active {
  background-color: var(--dex-okd-color-surface-pnl-profit-pressed);
  background-color: var(--dex-okd-positivebutton-active-background, var(--dex-okd-color-surface-pnl-profit-pressed))
}

.dex-positivebutton-disabled,
.dex-positivebutton.disabled {
  background-color: var(--dex-okd-color-surface-interactive-disabled);
  background-color: var(--dex-okd-positivebutton-disabled-background, var(--dex-okd-color-surface-interactive-disabled));
  color: var(--dex-okd-color-content-interactive-disabled);
  color: var(--dex-okd-positivebutton-disabled-color, var(--dex-okd-color-content-interactive-disabled));
  cursor: not-allowed
}

.dex-positivebutton-loading,
.dex-positivebutton.loading {
  background-color: var(--dex-okd-color-surface-pnl-profit-pressed);
  background-color: var(--dex-okd-positivebutton-loading-background, var(--dex-okd-color-surface-pnl-profit-pressed));
  color: transparent
}

.dex-positivebutton-loading .dex-positivebutton-loader,
.dex-positivebutton.loading .dex-positivebutton-loader {
  display: flex;
  position: absolute
}

.dex-positivebutton-loading-text {
  background-color: var(--dex-okd-color-surface-pnl-profit-pressed);
  background-color: var(--dex-okd-positivebutton-loading-background, var(--dex-okd-color-surface-pnl-profit-pressed));
  display: flex
}

.dex-positivebutton-block,
.dex-positivebutton.block {
  display: flex;
  width: 100%
}

.dex-positivebutton-ellipsis {
  display: block;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  width: 100%
}

.dex-positivebutton-loader-circle {
  border-color: var(--dex-okd-positivebutton-loader-track-color, var(--dex-okd-color-content-pnl-profit-oncolor));
  border-top-color: var(--dex-okd-positivebutton-loader-mark-color, var(--dex-okd-color-border-pnl-profit-default));
  border-width: 2px;
  border-width: var(--dex-okd-positivebutton-loader-border-width, 2px)
}

@keyframes loadingCircle {
  0% {
    transform: rotate(0deg)
  }

  to {
    transform: rotate(1turn)
  }
}

.dex-switch {
  background: var(--dex-okd-switch-off-default-track-color);
  border: 0;
  border-radius: calc(var(--dex-okd-switch-md-height)/2);
  box-sizing: border-box;
  cursor: pointer;
  height: var(--dex-okd-switch-md-height);
  outline: none;
  position: relative;
  transition: left .36s;
  vertical-align: middle;
  width: var(--dex-okd-switch-md-width)
}

.dex-switch:focus-visible {
  outline: 2px solid var(--dex-okd-color-border-focus);
  outline-color: var(--dex-okd-color-border-focus);
  outline-offset: 2px;
  outline-style: solid;
  outline-width: 2px
}

.dex-switch-handler {
  align-items: center;
  background: var(--dex-okd-switch-off-default-handler-color);
  border-radius: 100%;
  box-shadow: var(--dex-okd-switch-off-default-handler-shadow);
  display: flex;
  height: var(--dex-okd-switch-md-handler-size);
  justify-content: center;
  left: calc((var(--dex-okd-switch-md-height) - var(--dex-okd-switch-md-handler-size))/2);
  position: absolute;
  top: calc((var(--dex-okd-switch-md-height) - var(--dex-okd-switch-md-handler-size))/2);
  transition: left .36s;
  width: var(--dex-okd-switch-md-handler-size)
}

.dex-switch .switch-handler-loader {
  height: calc(var(--dex-okd-switch-md-handler-size) - 6px);
  width: calc(var(--dex-okd-switch-md-handler-size) - 6px)
}

.dex-switch .switch-on-loader {
  border-color: var(--dex-okd-switch-on-loading-handler-color);
  border-top-color: var(--dex-okd-switch-on-loading-mark-color)
}

.dex-switch .switch-off-loader {
  border-color: var(--dex-okd-switch-off-loading-handler-color);
  border-top-color: var(--dex-okd-switch-off-loading-mark-color)
}

.dex-switch-label {
  color: var(--dex-okd-switch-label-font-color);
  font-family: inherit;
  font-size: var(--dex-okd-switch-md-label-size);
  font-weight: 500;
  margin-left: 18px;
  vertical-align: middle
}

.dex-switch-small {
  height: var(--dex-okd-switch-sm-height);
  width: var(--dex-okd-switch-sm-width)
}

.dex-switch.dex-switch-small .dex-switch-handler {
  height: var(--dex-okd-switch-sm-handler-size);
  width: var(--dex-okd-switch-sm-handler-size)
}

.dex-switch.dex-switch-small .switch-handler-loader {
  height: calc(var(--dex-okd-switch-sm-handler-size) - 2px);
  width: calc(var(--dex-okd-switch-sm-handler-size) - 2px)
}

.dex-switch-small+.dex-switch-label {
  font-size: var(--dex-okd-switch-sm-label-size)
}

.dex-switch.dex-switch-loading {
  background-color: var(--dex-okd-switch-off-loading-track-color);
  cursor: not-allowed
}

.dex-switch.dex-switch-select {
  background-color: var(--dex-okd-switch-on-default-track-color)
}

.dex-switch.dex-switch-select .dex-switch-handler {
  background: var(--dex-okd-switch-on-default-handler-color);
  box-shadow: var(--dex-okd-switch-on-default-handler-shadow);
  left: calc((var(--dex-okd-switch-md-height) - var(--dex-okd-switch-md-handler-size))/2 + var(--dex-okd-switch-md-width) - (var(--dex-okd-switch-md-height) - var(--dex-okd-switch-md-handler-size))/2*2 - var(--dex-okd-switch-md-handler-size))
}

.dex-switch.dex-switch-select.dex-switch-small .dex-switch-handler {
  left: calc((var(--dex-okd-switch-md-height) - var(--dex-okd-switch-md-handler-size))/2 + var(--dex-okd-switch-sm-width) - (var(--dex-okd-switch-sm-height) - var(--dex-okd-switch-sm-handler-size))/2*2 - var(--dex-okd-switch-sm-handler-size))
}

.dex-switch.dex-switch-select.dex-switch-loading {
  background-color: var(--dex-okd-switch-on-loading-track-color)
}

.dex-switch.dex-switch-disabled {
  background-color: var(--dex-okd-switch-off-disabled-track-color);
  cursor: not-allowed
}

.dex-switch.dex-switch-disabled .dex-switch-handler {
  background: var(--dex-okd-switch-off-disabled-handler-color);
  box-shadow: var(--dex-okd-switch-off-disabled-handler-shadow)
}

.dex-switch.dex-switch-select.dex-switch-disabled {
  background-color: var(--dex-okd-switch-on-disabled-track-color)
}

.dex-switch.dex-switch-select.dex-switch-disabled .dex-switch-handler {
  background: var(--dex-okd-switch-on-disabled-handler-color);
  box-shadow: var(--dex-okd-switch-on-disabled-handler-shadow)
}

.dex-switch-theme-icon.add-weight {
  color: var(--dex-okd-color-content-primary);
  color: var(--dex-okd-switch-theme-icon-color, var(--dex-okd-color-content-primary));
  font-size: 12px
}

.dex-steps {
  -webkit-tap-highlight-color: transparent;
  -webkit-appearance: none;
  box-sizing: border-box;
  cursor: inherit;
  display: flex;
  font-family: inherit;
  font-weight: 500;
  justify-content: center;
  margin-bottom: 0;
  outline: none;
  position: relative;
  text-decoration: none;
  touch-action: manipulation;
  transition: all .3s cubic-bezier(.165, .84, .44, 1);
  -webkit-user-select: none;
  -moz-user-select: none;
  -ms-user-select: none;
  user-select: none;
  width: 100%
}

.dex-steps-item {
  display: inline-block;
  flex: 1 1;
  overflow: hidden;
  position: relative;
  vertical-align: top
}

.dex-steps-item-button {
  width: 100%
}

.dex-steps-item-container {
  outline: none
}

.dex-steps-item:last-child {
  flex: none
}

.dex-steps-item:last-child>.dex-steps-item-content:after,
.dex-steps-item:last-child>.dex-steps-item-tail {
  display: none
}

.dex-steps-item-content,
.dex-steps-item-icon {
  display: inline-block;
  vertical-align: top
}

.dex-steps-item-content {
  margin-left: var(--dex-okd-steps-horizontal-content-margin-left);
  position: relative
}

.dex-steps-item-content:after {
  background-image: linear-gradient(270deg, transparent 0, transparent 50%, #dbdbdb 0, #dbdbdb);
  background-image: linear-gradient(to left, transparent 0, transparent 50%, var(--dex-okd-steps-process-tail-color, #dbdbdb) 50%, var(--dex-okd-steps-process-tail-color, #dbdbdb) 100%);
  background-repeat: repeat-x;
  background-size: 4px 1px;
  background-size: var(--dex-okd-steps-common-waiting-border-width, 4px) 1px;
  content: "";
  display: block;
  height: 1px;
  left: 100%;
  position: absolute;
  top: 10px;
  width: 9999px
}

.dex-steps-item-content-no-left {
  margin-left: 0
}

.dex-steps-item-icon {
  align-items: center;
  border: 1px solid;
  border-radius: 50%;
  box-sizing: border-box;
  display: inline-flex;
  font-size: var(--dex-okd-steps-common-icon-font-size);
  height: var(--dex-okd-steps-common-icon-size);
  justify-content: center;
  line-height: var(--dex-okd-steps-common-icon-size);
  text-align: center;
  transition: background-color .3s, border-color .3s;
  width: var(--dex-okd-steps-common-icon-size)
}

.dex-steps-item-icon .dex-steps-item-icon-num {
  font-weight: 500;
  line-height: 1;
  position: relative
}

.dex-steps-item-icon .dex-steps-item-icon-num,
.dex-steps-item-icon .dex-steps-item-icon-num .dex-steps-item-checkmark {
  font-size: var(--dex-okd-steps-common-icon-font-size)
}

.dex-steps-item-tail {
  height: 1px;
  line-height: 0;
  position: absolute;
  top: calc(var(--dex-okd-steps-common-icon-size)/2);
  width: 100%
}

.dex-steps-item-tail:after {
  background-image: linear-gradient(270deg, transparent 0, transparent 50%, #dbdbdb 0, #dbdbdb);
  background-image: linear-gradient(to left, transparent 0, transparent 50%, var(--dex-okd-steps-process-tail-color, #dbdbdb) 50%, var(--dex-okd-steps-process-tail-color, #dbdbdb) 100%);
  background-repeat: repeat-x;
  background-size: 4px 1px;
  background-size: var(--dex-okd-steps-common-waiting-border-width, 4px) 1px;
  border-radius: 1px;
  content: "";
  display: inline-block;
  height: 1px;
  position: absolute;
  top: 0;
  width: 100%
}

.dex-steps-item-title {
  display: inline-block;
  font-size: var(--dex-okd-steps-common-title-font-size);
  line-height: 20px;
  line-height: var(--dex-okd-steps-common-title-line-height, 20px);
  padding-right: 12px;
  position: relative
}

.dex-steps-item-description {
  font-size: var(--dex-okd-steps-common-description-font-size);
  line-height: 16px;
  line-height: var(--dex-okd-steps-common-description-line-height, 16px);
  margin-top: 2px
}

.dex-steps-item.dex-steps-item-finish .dex-steps-item-content:after,
.dex-steps-item.dex-steps-item-finish .dex-steps-item-tail:after {
  background-color: #000;
  background-color: var(--dex-okd-steps-finish-tail-color, #000);
  background-image: none
}

.dex-steps-item-process .dex-steps-item-icon {
  background: var(--dex-okd-steps-process-background);
  border: 1px solid #000;
  border: 1px solid var(--dex-okd-steps-process-icon-border-color, #000)
}

.dex-steps-item-process .dex-steps-item-icon-num {
  color: var(--dex-okd-steps-process-icon-color)
}

.dex-steps-item-process .dex-steps-item-title {
  color: var(--dex-okd-steps-process-title-color)
}

.dex-steps-item-process .dex-steps-item-description {
  color: var(--dex-okd-steps-process-description-color);
  font-weight: 400
}

.dex-steps-item-waiting .dex-steps-item-icon {
  background: var(--dex-okd-steps-waiting-background);
  border: 1px solid #dbdbdb;
  border: 1px solid var(--dex-okd-steps-waiting-icon-border-color, #dbdbdb)
}

.dex-steps-item-waiting .dex-steps-item-icon-num {
  color: var(--dex-okd-steps-waiting-icon-color)
}

.dex-steps-item-waiting .dex-steps-item-title {
  color: var(--dex-okd-steps-waiting-title-color)
}

.dex-steps-item-waiting .dex-steps-item-description {
  color: var(--dex-okd-steps-waiting-description-color);
  font-weight: 400
}

.dex-steps-item-finish .dex-steps-item-icon {
  background: var(--dex-okd-steps-finish-background);
  border: 1px solid #1a1a1a;
  border: 1px solid var(--dex-okd-steps-finish-icon-border-color, #1a1a1a)
}

.dex-steps-item-finish .dex-steps-item-icon-num {
  color: var(--dex-okd-steps-finish-icon-color)
}

.dex-steps-item-finish .dex-steps-item-title {
  color: var(--dex-okd-steps-finish-title-color)
}

.dex-steps-item-finish .dex-steps-item-description {
  color: var(--dex-okd-steps-finish-description-color);
  font-weight: 400
}

.dex-steps-horizontal:not(.dex-steps-label-vertical):not(.dex-steps-label-vertical-left) .dex-steps-item {
  margin-right: 16px;
  white-space: nowrap
}

.dex-steps-horizontal:not(.dex-steps-label-vertical):not(.dex-steps-label-vertical-left) .dex-steps-item-container {
  display: flex
}

.dex-steps-horizontal:not(.dex-steps-label-vertical):not(.dex-steps-label-vertical-left) .dex-steps-item:last-child {
  margin-right: 0
}

.dex-steps-horizontal:not(.dex-steps-label-vertical):not(.dex-steps-label-vertical-left) .dex-steps-item:last-child .dex-steps-item-title {
  padding-right: 0
}

.dex-steps-horizontal:not(.dex-steps-label-vertical):not(.dex-steps-label-vertical-left) .dex-steps-item-tail {
  display: none
}

.dex-steps-horizontal:not(.dex-steps-label-vertical):not(.dex-steps-label-vertical-left) .dex-steps-item-description {
  max-width: var(--dex-okd-steps-label-vertical-description-max-width);
  white-space: normal
}

.dex-steps-vertical {
  display: flex;
  flex-direction: column
}

.dex-steps-vertical .dex-steps-item {
  display: block;
  flex: 1 0 auto;
  overflow: visible
}

.dex-steps-vertical .dex-steps-item-container {
  min-height: 72px
}

.dex-steps-vertical .dex-steps-item-container:last-child {
  min-height: unset
}

.dex-steps-vertical .dex-steps-item-icon {
  float: left;
  margin-right: var(--dex-okd-steps-vertical-icon-margin-right)
}

.dex-steps-vertical .dex-steps-item-content {
  display: block;
  margin-left: var(--dex-okd-steps-vertical-content-margin-left)
}

.dex-steps-vertical .dex-steps-item-content:after {
  display: none
}

.dex-steps-vertical .dex-steps-item-title {
  margin-top: 1px
}

.dex-steps-vertical .dex-steps-item-description {
  padding-bottom: var(--dex-okd-steps-vertical-description-padding-bottom)
}

.dex-steps-vertical .dex-steps-item-tail {
  bottom: 12px;
  height: calc(100% - var(--dex-okd-steps-common-icon-size));
  left: calc(var(--dex-okd-steps-common-icon-size)/2);
  padding: 0;
  position: absolute;
  top: var(--dex-okd-steps-common-icon-size);
  width: 1px
}

.dex-steps-vertical .dex-steps-item-tail:after {
  background-image: linear-gradient(180deg, transparent 0, transparent 50%, #dbdbdb 0, #dbdbdb);
  background-image: linear-gradient(to bottom, transparent 0, transparent 50%, var(--dex-okd-steps-process-tail-color, #dbdbdb) 50%, var(--dex-okd-steps-process-tail-color, #dbdbdb) 100%);
  background-repeat: repeat-y;
  background-size: 1px 4px;
  background-size: 1px var(--dex-okd-steps-common-waiting-border-width, 4px);
  height: 100%;
  width: 1px
}

.dex-steps-vertical .dex-steps-item:not(:last-child) .dex-steps-item-tail {
  display: block
}

.dex-steps-vertical .dex-steps-item .dex-steps-item-content:after {
  display: none
}

.dex-steps-vertical .dex-steps-item-finish .dex-steps-item-tail:after {
  background-color: #000;
  background-color: var(--dex-okd-steps-finish-tail-color, #000);
  background-image: none
}

.dex-steps-label-vertical .dex-steps-item {
  overflow: visible
}

.dex-steps-label-vertical .dex-steps-item-tail {
  margin-left: calc(var(--dex-okd-steps-common-icon-size) + var(--dex-okd-steps-style-margin-left, 42px));
  padding: 0
}

.dex-steps-label-vertical .dex-steps-item-tail:after {
  width: calc(100% - var(--dex-okd-steps-common-icon-size))
}

.dex-steps-label-vertical .dex-steps-item-content {
  display: block;
  margin-left: unset;
  margin-top: var(--dex-okd-steps-label-vertical-content-margin-top);
  text-align: center;
  width: calc(var(--dex-okd-steps-common-icon-size)/2*2 + 84px);
  width: calc((var(--dex-okd-steps-common-icon-size)/2 + var(--dex-okd-steps-style-margin-left, 42px))*2)
}

.dex-steps-label-vertical .dex-steps-item-content:after {
  display: none
}

.dex-steps-label-vertical .dex-steps-item-icon {
  display: inline-flex;
  margin-left: 42px;
  margin-left: var(--dex-okd-steps-style-margin-left, 42px)
}

.dex-steps-label-vertical .dex-steps-item-title {
  padding-left: 0;
  padding-right: 0
}

.dex-steps-label-vertical-left .dex-steps-item {
  overflow: visible
}

.dex-steps-label-vertical-left .dex-steps-item-tail {
  margin-left: unset;
  padding: 0
}

.dex-steps-label-vertical-left .dex-steps-item-tail:after {
  left: var(--dex-okd-steps-common-icon-size);
  width: calc(100% - var(--dex-okd-steps-common-icon-size))
}

.dex-steps-label-vertical-left .dex-steps-item-content {
  display: block;
  margin-left: unset;
  margin-top: var(--dex-okd-steps-label-vertical-content-margin-top);
  text-align: left;
  width: calc(var(--dex-okd-steps-common-icon-size)/2*2 + 84px);
  width: calc((var(--dex-okd-steps-common-icon-size)/2 + var(--dex-okd-steps-style-margin-left, 42px))*2)
}

.dex-steps-label-vertical-left .dex-steps-item-content:after {
  display: none
}

.dex-steps-label-vertical-left .dex-steps-item-icon {
  display: inline-flex;
  margin-left: unset
}

.dex-steps-label-vertical-left .dex-steps-item-title {
  padding-left: 0;
  padding-right: 0
}

.dex-steps-circle .dex-steps-item-icon {
  border-radius: 50%;
  box-sizing: border-box;
  display: inline-flex;
  height: 8px;
  height: var(--dex-okd-steps-circle-icon-size, 8px);
  line-height: 8px;
  line-height: var(--dex-okd-steps-circle-icon-size, 8px);
  text-align: center;
  transition: background-color .3s, border-color .3s;
  width: 8px;
  width: var(--dex-okd-steps-circle-icon-size, 8px)
}

.dex-steps-circle .dex-steps-item-icon .dex-steps-item-icon-num {
  display: none
}

.dex-steps-circle .dex-steps-item-process .dex-steps-item-icon {
  background: #000;
  background: var(--dex-okd-steps-circle-process-bg-color, #000);
  border: 0 solid #000;
  border: 0 solid var(--dex-okd-steps-circle-process-bg-color, #000)
}

.dex-steps-circle .dex-steps-item-waiting .dex-steps-item-icon {
  background: #dbdbdb;
  background: var(--dex-okd-steps-circle-waiting-bg-color, #dbdbdb);
  border: 0 solid #dbdbdb;
  border: 0 solid var(--dex-okd-steps-circle-waiting-bg-color, #dbdbdb)
}

.dex-steps-circle .dex-steps-item-finish .dex-steps-item-icon {
  background: #000;
  background: var(--dex-okd-steps-circle-finish-bg-color, #000);
  border: 0 solid #000;
  border: 0 solid var(--dex-okd-steps-circle-finish-bg-color, #000)
}

.dex-steps-circle.dex-steps-horizontal .dex-steps-item-tail {
  margin-left: calc(var(--dex-okd-steps-common-icon-size) + var(--dex-okd-steps-style-margin-left, 42px))
}

.dex-steps-circle.dex-steps-horizontal .dex-steps-item-tail:after {
  width: calc(100% - var(--dex-okd-steps-common-icon-size))
}

.dex-steps-circle.dex-steps-horizontal .dex-steps-item-content {
  width: calc(var(--dex-okd-steps-common-icon-size)/2*2 + 84px);
  width: calc((var(--dex-okd-steps-common-icon-size)/2 + var(--dex-okd-steps-style-margin-left, 42px))*2)
}

.dex-steps-circle.dex-steps-horizontal .dex-steps-item-icon {
  display: inline-flex;
  margin-left: 42px;
  margin-left: var(--dex-okd-steps-style-margin-left, 42px)
}

.dex-steps-circle.dex-steps-horizontal .dex-steps-item {
  overflow: visible
}

.dex-steps-circle.dex-steps-horizontal .dex-steps-item-tail {
  margin-left: 50px;
  margin-left: calc(var(--dex-okd-steps-circle-icon-size, 8px) + var(--dex-okd-steps-style-margin-left, 42px));
  padding: 0;
  top: 4px;
  top: calc(var(--dex-okd-steps-circle-icon-size, 8px)/2)
}

.dex-steps-circle.dex-steps-horizontal .dex-steps-item-tail:after {
  width: calc(100% - 8px);
  width: calc(100% - var(--dex-okd-steps-circle-icon-size, 8px))
}

.dex-steps-circle.dex-steps-horizontal .dex-steps-item-content {
  display: block;
  margin-left: unset;
  margin-top: var(--dex-okd-steps-label-vertical-content-margin-top);
  text-align: center;
  width: 92px;
  width: calc((var(--dex-okd-steps-circle-icon-size, 8px)/2 + var(--dex-okd-steps-style-margin-left, 42px))*2)
}

.dex-steps-circle.dex-steps-horizontal .dex-steps-item-content:after {
  display: none
}

.dex-steps-circle.dex-steps-horizontal .dex-steps-item-title {
  padding-left: 0;
  padding-right: 0
}

.dex-steps-circle.dex-steps-vertical .dex-steps-item-tail {
  bottom: 12px;
  height: calc(100% - 8px);
  height: calc(100% - var(--dex-okd-steps-circle-icon-size, 8px));
  left: 4px;
  left: calc(var(--dex-okd-steps-circle-icon-size, 8px)/2);
  padding: 0;
  position: absolute;
  top: 14px;
  top: calc(var(--dex-okd-steps-circle-icon-size, 8px) + var(--dex-okd-steps-circle-icon-margin-top, 6px));
  width: 1px
}

.dex-steps-circle.dex-steps-vertical .dex-steps-item-tail:after {
  background-image: linear-gradient(180deg, transparent 0, transparent 50%, #dbdbdb 0, #dbdbdb);
  background-image: linear-gradient(to bottom, transparent 0, transparent 50%, var(--dex-okd-steps-process-tail-color, #dbdbdb) 50%, var(--dex-okd-steps-process-tail-color, #dbdbdb) 100%);
  background-repeat: repeat-y;
  background-size: 1px 4px;
  background-size: 1px var(--dex-okd-steps-common-waiting-border-width, 4px);
  height: 100%;
  top: 0;
  width: 1px
}

.dex-steps-circle.dex-steps-vertical .dex-steps-item .dex-steps-item-icon {
  margin-top: 6px;
  margin-top: var(--dex-okd-steps-circle-icon-margin-top, 6px)
}

.dex-steps-circle.dex-steps-vertical .dex-steps-item:not(:last-child) .dex-steps-item-tail {
  display: block
}

.dex-steps-circle.dex-steps-vertical .dex-steps-item-finish .dex-steps-item-tail:after {
  background-color: #000;
  background-color: var(--dex-okd-steps-finish-tail-color, #000);
  background-image: none
}

.dex-steps .dex-steps-item-icon.dex-steps-item-custom-icon {
  background: transparent;
  border: none
}

.dex-table-thead {
  background-color: var(--dex-okd-table-thead-bg-color);
  background-color: var(--dex-okd-inner-table-background, var(--dex-okd-table-thead-bg-color))
}

.dex-table-thead .dex-table-row-slide .dex-table-cell:first-child {
  padding-left: 0
}

.dex-table-thead .dex-table-row-slide .dex-table-cell:last-child {
  padding-right: 0
}

.dex-table-thead .dex-table-cell {
  background-color: var(--dex-okd-table-thead-cell-bg-color);
  background-color: var(--dex-okd-inner-table-background, var(--dex-okd-table-thead-cell-bg-color));
  color: #959dad;
  color: var(--dex-okd-table-thead-cell-font-color, #959dad);
  font-size: 12px;
  font-size: var(--dex-okd-table-thead-cell-font-size, 12px);
  font-weight: 400;
  padding: 12px;
  padding: var(--dex-okd-table-thead-cell-padding-vertical, 12px) var(--dex-okd-table-thead-cell-padding-horizontal, 12px);
  position: relative;
  text-align: left
}

.dex-table-thead .dex-table-cell.dex-table-column-has-sorters {
  cursor: pointer;
  padding: 0 12px;
  transition: padding .3s
}

.dex-table-thead .dex-table-cell-sorters {
  align-items: center;
  display: inline-flex
}

.dex-table-thead .dex-table-cell-sorters-between {
  align-items: center;
  display: flex;
  justify-content: space-between;
  width: 100%
}

.dex-table-thead .dex-table-cell-sorters-between .dex-table-cell-title {
  flex: 1 1;
  width: calc(100% - 15px);
  width: calc(100% - var(--dex-okd-table-cell-sorter-icon-font-size, 12px) - 3px)
}

.dex-table-thead .dex-table-cell-sorter {
  font: 12px;
  line-height: 12px;
  margin-left: 3px
}

.dex-table-thead .dex-table-cell-sorter-inner {
  display: inline-flex;
  flex-direction: column;
  transform: scale(.5);
  transform: scale(var(--dex-okd-table-cell-sorter-inner-scale, .5))
}

.dex-table-thead .dex-table-cell-sorter-inner .dex-table-cell-filled-down,
.dex-table-thead .dex-table-cell-sorter-inner .dex-table-cell-filled-up {
  color: #ced3de;
  color: var(--dex-okd-table-cell-sorter-icon-color, #ced3de);
  font-size: 12px;
  font-size: var(--dex-okd-table-cell-sorter-icon-font-size, 12px)
}

.dex-table-thead .dex-table-cell-sorter-inner .dex-table-cell-filled-down.active,
.dex-table-thead .dex-table-cell-sorter-inner .dex-table-cell-filled-up.active {
  color: #000;
  color: var(--dex-okd-table-cell-sorter-icon-active-color, #000)
}

.dex-table-thead-sticky {
  position: -webkit-sticky;
  position: sticky;
  top: 0;
  z-index: 3
}

.dex-table-tbody {
  position: relative
}

.dex-table-tbody .dex-table-row {
  background-color: var(--dex-okd-table-tbody-cell-bg-color);
  background-color: var(--dex-okd-inner-table-background, var(--dex-okd-table-tbody-cell-bg-color))
}

.dex-table-tbody .dex-table-row-vir {
  display: grid;
  grid-template-columns: var(--dex-okd-inner-table-grid-template-columns)
}

.dex-table-tbody .dex-table-row-hover:hover {
  background-color: #000;
  background-color: var(--dex-okd-table-tbody-row-bg-hover-color, #000)
}

.dex-table-tbody .dex-table-row-slide .dex-table-cell:first-child {
  padding-left: 0
}

.dex-table-tbody .dex-table-row-slide .dex-table-cell:last-child {
  padding-right: 0
}

.dex-table-tbody .dex-table-cell {
  background-color: inherit;
  color: #3f475a;
  color: var(--dex-okd-table-tbody-cell-font-color, #3f475a);
  font-size: 12px;
  font-size: var(--dex-okd-table-tbody-cell-font-size, 12px);
  font-weight: 400;
  padding: 12px;
  padding: var(--dex-okd-table-tbody-cell-padding-vertical, 12px) var(--dex-okd-table-tbody-cell-padding-horizontal, 12px);
  text-align: left
}

.dex-table-tbody .dex-table-expanded-row .dex-table-cell {
  padding: 0
}

.dex-table-tbody .dex-table-placeholder-row-fixed {
  margin: -12px;
  margin: calc(var(--dex-okd-table-tbody-cell-padding-vertical, 12px)*-1) calc(var(--dex-okd-table-tbody-cell-padding-horizontal, 12px)*-1);
  padding: 12px;
  padding: var(--dex-okd-table-tbody-cell-padding-vertical, 12px) var(--dex-okd-table-tbody-cell-padding-horizontal, 12px)
}

.dex-table-wrapper {
  position: relative;
  width: 100%
}

.dex-table-wrapper * {
  box-sizing: border-box
}

.dex-table-wrapper .dex-table table {
  border-collapse: initial;
  border-spacing: 0;
  width: 100%
}

.dex-table-wrapper .dex-table-bordered {
  border: 1px solid #f0f0f0;
  border: 1px solid var(--dex-okd-table-cell-bordered-color, #f0f0f0);
  border-bottom: 0
}

.dex-table-wrapper .dex-table-bordered .dex-table-tbody tr,
.dex-table-wrapper .dex-table-bordered .dex-table-thead tr {
  position: relative
}

.dex-table-wrapper .dex-table .dex-table-sticky-holder {
  position: -webkit-sticky;
  position: sticky;
  top: 0;
  z-index: 3
}

.dex-table-wrapper .dex-table-pagination {
  margin-top: 10px;
  margin-top: var(--dex-okd-table-pagination-margin-top, 10px)
}

.dex-table-wrapper .dex-table-fixed-column-box-shadow.dex-table-ping-left .dex-table-cell-fix-left,
.dex-table-wrapper .dex-table-ping-left .dex-table-cell-fix-left-last,
.dex-table-wrapper .dex-table-ping-left .dex-table-cell-fix-right-first,
.dex-table-wrapper .dex-table-ping-right .dex-table-cell-fix-left-last,
.dex-table-wrapper .dex-table-ping-right .dex-table-cell-fix-right-first {
  z-index: 2
}

.dex-table-wrapper .dex-table-fixed-column-box-shadow.dex-table-ping-left .dex-table-cell-fix-left.dex-table-cell-fix-left-first:after,
.dex-table-wrapper .dex-table-fixed-column-box-shadow.dex-table-ping-left .dex-table-cell-fix-left.dex-table-cell-fix-left-last:after {
  bottom: 0;
  box-shadow: inset 10px 0 8px -8px #00000026;
  box-shadow: inset var(--dex-okd-table-fix-left-box-shadow, 10px 0 8px -8px #00000026);
  content: "";
  pointer-events: none;
  position: absolute;
  right: 0;
  top: 0;
  transform: translate(100%);
  transition: box-shadow .3s;
  width: 30px;
  width: var(--dex-okd-table-fix-left-box-inner-width, 30px)
}

.dex-table-wrapper .dex-table-fixed-column-box-shadow.dex-table-ping-right .dex-table-cell-fix-right {
  z-index: 2
}

.dex-table-wrapper .dex-table-fixed-column-box-shadow.dex-table-ping-right .dex-table-cell-fix-right.dex-table-cell-fix-right-first:after,
.dex-table-wrapper .dex-table-fixed-column-box-shadow.dex-table-ping-right .dex-table-cell-fix-right.dex-table-cell-fix-right-last:after {
  bottom: 0;
  box-shadow: inset -10px 0 8px -8px #00000026;
  box-shadow: inset var(--dex-okd-table-fix-right-box-shadow, -10px 0 8px -8px #00000026);
  content: "";
  left: 0;
  pointer-events: none;
  position: absolute;
  top: 0;
  transform: translate(-100%);
  transition: box-shadow .3s;
  width: 30px;
  width: var(--dex-okd-table-fix-right-box-inner-width, 30px)
}

.dex-table-full-height {
  height: 100%
}

.dex-table-scroll-style ::-webkit-scrollbar {
  border-radius: 8px;
  height: 6px
}

.dex-table-virtual-scroll-style ::-webkit-scrollbar {
  width: 0
}

.dex-table-scroll-style ::-webkit-scrollbar-thumb,
.dex-table-scroll-style ::-webkit-scrollbar-track {
  border-radius: 8px
}

.dex-table-scroll-style ::-webkit-scrollbar-button {
  display: none
}

.dex-table-scroll-style ::-webkit-scrollbar-corner {
  background-color: initial
}

.dex-table-placeholder {
  display: flex;
  justify-content: center;
  padding: 100px 0;
  padding: var(--dex-okd-table-placeholder-padding-vertical, 100px) var(--dex-okd-table-placeholder-padding-horizontal, 0)
}

.dex-table-cell {
  word-wrap: break-word;
  position: relative
}

.dex-table-cell .dex-table-cell-ellipsis,
.dex-table-cell .dex-table-cell-ellipsis>* {
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap
}

.dex-table-cell .dex-table-cell-ellipsis-tooltip {
  display: inline-block;
  max-width: 100%
}

.dex-table-cell-border-bottom {
  border-bottom: 1px solid #f0f0f0;
  border-bottom: 1px solid var(--dex-okd-table-cell-bordered-color, #f0f0f0)
}

.dex-table-cell-border-right {
  border-right: 1px solid #f0f0f0;
  border-right: 1px solid var(--dex-okd-table-cell-bordered-color, #f0f0f0)
}

.dex-table-cell-border-right:last-child {
  border-right: 0
}

.dex-suggestion-chips {
  align-items: center;
  border: 1px solid transparent;
  cursor: pointer;
  display: flex;
  justify-content: center;
  text-align: center
}

.dex-suggestion-chips.dex-suggestion-chips-sm {
  border-radius: 8px;
  border-radius: var(--dex-okd-suggestionchips-sm-border-radius, 8px);
  font-size: 12px;
  font-size: var(--dex-okd-suggestionchips-sm-font-size, 12px);
  font-weight: 400;
  font-weight: var(--dex-okd-suggestionchips-sm-font-weight, 400);
  line-height: 16px;
  line-height: var(--dex-okd-suggestionchips-sm-line-height, 16px);
  min-height: 28px;
  min-height: var(--dex-okd-suggestionchips-sm-min-height, 28px);
  min-width: 32px;
  min-width: var(--dex-okd-suggestionchips-sm-min-width, 32px);
  padding: 0 8px;
  padding: var(--dex-okd-suggestionchips-sm-padding-vertical, 0) var(--dex-okd-suggestionchips-sm-padding-horizontal, 8px)
}

.dex-suggestion-chips.dex-suggestion-chips-md {
  border-radius: 8px;
  border-radius: var(--dex-okd-suggestionchips-md-border-radius, 8px);
  font-size: 14px;
  font-size: var(--dex-okd-suggestionchips-md-font-size, 14px);
  font-weight: 400;
  font-weight: var(--dex-okd-suggestionchips-md-font-weight, 400);
  line-height: 16px;
  line-height: var(--dex-okd-suggestionchips-md-line-height, 16px);
  min-height: 32px;
  min-height: var(--dex-okd-suggestionchips-md-min-height, 32px);
  min-width: 32px;
  min-width: var(--dex-okd-suggestionchips-md-min-width, 32px);
  padding: 0 8px;
  padding: var(--dex-okd-suggestionchips-md-padding-vertical, 0) var(--dex-okd-suggestionchips-md-padding-horizontal, 8px)
}

.dex-suggestion-chips-truncate {
  -webkit-box-orient: vertical;
  -webkit-line-clamp: 2;
  display: -webkit-box;
  overflow: hidden
}

.dex-suggestion-chips-primary {
  background: var(--dex-okd-color-background-surface-primary);
  background: var(--dex-okd-suggestionchips-primary-default-background, var(--dex-okd-color-background-surface-primary));
  color: var(--dex-okd-color-content-primary);
  color: var(--dex-okd-suggestionchips-primary-default-font-color, var(--dex-okd-color-content-primary))
}

.dex-suggestion-chips-primary.hover,
.dex-suggestion-chips-primary:not(.dex-suggestion-chips-primary-disabled):not(.dex-suggestion-chips-primary-focus):hover {
  background: var(--dex-okd-color-background-surface-pressed);
  background: var(--dex-okd-suggestionchips-primary-hover-background, var(--dex-okd-color-background-surface-pressed));
  color: var(--dex-okd-color-content-primary);
  color: var(--dex-okd-suggestionchips-primary-hover-font-color, var(--dex-okd-color-content-primary))
}

.dex-suggestion-chips-primary.active,
.dex-suggestion-chips-primary:not(.dex-suggestion-chips-primary-disabled):active {
  background: var(--dex-okd-color-background-surface-pressed);
  background: var(--dex-okd-suggestionchips-primary-active-background, var(--dex-okd-color-background-surface-pressed));
  color: var(--dex-okd-color-content-primary);
  color: var(--dex-okd-suggestionchips-primary-active-font-color, var(--dex-okd-color-content-primary))
}

.dex-suggestion-chips-primary.dex-suggestion-chips-primary-disabled,
.dex-suggestion-chips-primary.disabled {
  background: var(--dex-okd-color-background-surface-disable);
  background: var(--dex-okd-suggestionchips-primary-disabled-background, var(--dex-okd-color-background-surface-disable));
  color: var(--dex-okd-color-content-disabled);
  color: var(--dex-okd-suggestionchips-primary-disabled-font-color, var(--dex-okd-color-content-disabled));
  cursor: not-allowed
}

.dex-suggestion-chips-secondary {
  background: transparent;
  background: var(--dex-okd-suggestionchips-secondary-default-background, transparent);
  border-color: var(--dex-okd-suggestionchips-secondary-default-border-color, var(--dex-okd-color-border-primary));
  color: var(--dex-okd-color-content-primary);
  color: var(--dex-okd-suggestionchips-secondary-default-font-color, var(--dex-okd-color-content-primary))
}

.dex-suggestion-chips-secondary.hover,
.dex-suggestion-chips-secondary:not(.dex-suggestion-chips-secondary-disabled):not(.dex-suggestion-chips-secondary-focus):hover {
  background: var(--dex-okd-color-background-surface-pressed);
  background: var(--dex-okd-suggestionchips-secondary-hover-background, var(--dex-okd-color-background-surface-pressed));
  border-color: transparent;
  border-color: var(--dex-okd-suggestionchips-secondary-hover-border-color, transparent);
  color: var(--dex-okd-color-content-primary);
  color: var(--dex-okd-suggestionchips-secondary-hover-font-color, var(--dex-okd-color-content-primary))
}

.dex-suggestion-chips-secondary.active,
.dex-suggestion-chips-secondary:not(.dex-suggestion-chips-secondary-disabled):active {
  background: var(--dex-okd-color-background-surface-pressed);
  background: var(--dex-okd-suggestionchips-secondary-active-background, var(--dex-okd-color-background-surface-pressed));
  border-color: transparent;
  border-color: var(--dex-okd-suggestionchips-secondary-active-border-color, transparent);
  color: var(--dex-okd-color-content-primary);
  color: var(--dex-okd-suggestionchips-secondary-active-font-color, var(--dex-okd-color-content-primary))
}

.dex-suggestion-chips-secondary.dex-suggestion-chips-secondary-disabled,
.dex-suggestion-chips-secondary.disabled {
  background: transparent;
  background: var(--dex-okd-suggestionchips-secondary-disabled-background, transparent);
  border-color: var(--dex-okd-suggestionchips-secondary-disabled-border-color, var(--dex-okd-color-border-primary));
  color: var(--dex-okd-color-content-disabled);
  color: var(--dex-okd-suggestionchips-secondary-disabled-font-color, var(--dex-okd-color-content-disabled));
  cursor: not-allowed
}

.dex-suggestion-chips-tertiary {
  background: transparent;
  background: var(--dex-okd-suggestionchips-tertiary-default-background, transparent);
  color: var(--dex-okd-color-content-primary);
  color: var(--dex-okd-suggestionchips-tertiary-default-font-color, var(--dex-okd-color-content-primary))
}

.dex-suggestion-chips-tertiary.hover,
.dex-suggestion-chips-tertiary:not(.dex-suggestion-chips-tertiary-disabled):not(.dex-suggestion-chips-tertiary-focus):hover {
  background: var(--dex-okd-color-background-surface-pressed);
  background: var(--dex-okd-suggestionchips-tertiary-hover-background, var(--dex-okd-color-background-surface-pressed));
  color: var(--dex-okd-color-content-primary);
  color: var(--dex-okd-suggestionchips-tertiary-hover-font-color, var(--dex-okd-color-content-primary))
}

.dex-suggestion-chips-tertiary.active,
.dex-suggestion-chips-tertiary:not(.dex-suggestion-chips-tertiary-disabled):active {
  background: var(--dex-okd-color-background-surface-pressed);
  background: var(--dex-okd-suggestionchips-tertiary-active-background, var(--dex-okd-color-background-surface-pressed));
  color: var(--dex-okd-color-content-primary);
  color: var(--dex-okd-suggestionchips-tertiary-active-font-color, var(--dex-okd-color-content-primary))
}

.dex-suggestion-chips-tertiary.dex-suggestion-chips-tertiary-disabled,
.dex-suggestion-chips-tertiary.disabled {
  background: var(--dex-okd-color-background-surface-disable);
  background: var(--dex-okd-suggestionchips-tertiary-disabled-background, var(--dex-okd-color-background-surface-disable));
  color: var(--dex-okd-color-content-disabled);
  color: var(--dex-okd-suggestionchips-tertiary-disabled-font-color, var(--dex-okd-color-content-disabled));
  cursor: not-allowed
}

.dex-tabs-pane.dex-tabs-pane-outline-highlight {
  background-color: initial;
  background-color: var(--dex-okd-tabs-pane-outline-highlight-default-background-color, transparent);
  border-color: #dbdbdb;
  border-color: var(--dex-okd-tabs-pane-outline-highlight-default-border-color, #dbdbdb);
  border-style: solid;
  color: #929292;
  color: var(--dex-okd-tabs-pane-outline-highlight-default-text-color, #929292)
}

.dex-tabs-pane.dex-tabs-pane-outline-highlight.dex-tabs-active {
  background-color: initial;
  background-color: var(--dex-okd-tabs-pane-outline-highlight-active-background-color, transparent);
  border-color: #000;
  border-color: var(--dex-okd-tabs-pane-outline-highlight-active-border-color, #000);
  color: #000;
  color: var(--dex-okd-tabs-pane-outline-highlight-active-text-color, #000)
}

.dex-tabs-pane.dex-tabs-pane-outline-highlight.dex-tabs-active:focus-visible {
  outline: 2px solid var(--dex-okd-color-border-focus);
  outline-color: #000;
  outline-color: var(--dex-okd-tabs-pane-outline-highlight-active-text-color, #000);
  outline-offset: -4px;
  outline-style: solid;
  outline-width: 2px
}

.dex-tabs-pane.dex-tabs-pane-outline-highlight:hover:not(.dex-tabs-active) {
  background-color: initial;
  background-color: var(--dex-okd-tabs-pane-outline-highlight-hover-background-color, transparent);
  border-color: #dbdbdb;
  border-color: var(--dex-okd-tabs-pane-outline-highlight-hover-border-color, #dbdbdb);
  color: #000;
  color: var(--dex-okd-tabs-pane-outline-highlight-hover-text-color, #000)
}

.dex-tabs-pane.dex-tabs-pane-outline-primary {
  background-color: initial;
  background-color: var(--dex-okd-tabs-pane-outline-primary-default-background-color, transparent);
  border-color: transparent;
  border-color: var(--dex-okd-tabs-pane-outline-primary-default-border-color, transparent);
  border-style: solid;
  color: #929292;
  color: var(--dex-okd-tabs-pane-outline-primary-default-text-color, #929292)
}

.dex-tabs-pane.dex-tabs-pane-outline-primary.dex-tabs-active {
  background-color: initial;
  background-color: var(--dex-okd-tabs-pane-outline-primary-active-background-color, transparent);
  border-color: #000;
  border-color: var(--dex-okd-tabs-pane-outline-primary-active-border-color, #000);
  color: #000;
  color: var(--dex-okd-tabs-pane-outline-primary-active-text-color, #000)
}

.dex-tabs-pane.dex-tabs-pane-outline-primary.dex-tabs-active:focus-visible {
  outline: 2px solid var(--dex-okd-color-border-focus);
  outline-color: #000;
  outline-color: var(--dex-okd-tabs-pane-outline-primary-active-text-color, #000);
  outline-offset: -4px;
  outline-style: solid;
  outline-width: 2px
}

.dex-tabs-pane.dex-tabs-pane-outline-primary:hover:not(.dex-tabs-active) {
  background-color: initial;
  background-color: var(--dex-okd-tabs-pane-outline-primary-hover-background-color, transparent);
  border-color: transparent;
  border-color: var(--dex-okd-tabs-pane-outline-primary-hover-border-color, transparent);
  color: #000;
  color: var(--dex-okd-tabs-pane-outline-primary-hover-text-color, #000)
}

.dex-tabs-pane.dex-tabs-pane-outline-secondary {
  background-color: initial;
  background-color: var(--dex-okd-tabs-pane-outline-secondary-default-background-color, transparent);
  border-color: #000;
  border-color: var(--dex-okd-tabs-pane-outline-secondary-default-border-color, #000);
  border-style: solid;
  color: #fff;
  color: var(--dex-okd-tabs-pane-outline-secondary-default-text-color, #fff)
}

.dex-tabs-pane.dex-tabs-pane-outline-secondary.dex-tabs-active {
  background-color: initial;
  background-color: var(--dex-okd-tabs-pane-outline-secondary-active-background-color, transparent);
  border-color: #000;
  border-color: var(--dex-okd-tabs-pane-outline-secondary-active-border-color, #000);
  color: #fff;
  color: var(--dex-okd-tabs-pane-outline-secondary-active-text-color, #fff)
}

.dex-tabs-pane.dex-tabs-pane-outline-secondary.dex-tabs-active:focus-visible {
  outline: 2px solid var(--dex-okd-color-border-focus);
  outline-color: #fff;
  outline-color: var(--dex-okd-tabs-pane-outline-secondary-active-text-color, #fff);
  outline-offset: -4px;
  outline-style: solid;
  outline-width: 2px
}

.dex-tabs-pane.dex-tabs-pane-outline-secondary:hover:not(.dex-tabs-active) {
  background-color: initial;
  background-color: var(--dex-okd-tabs-pane-outline-secondary-hover-background-color, transparent);
  border-color: #000;
  border-color: var(--dex-okd-tabs-pane-outline-secondary-hover-border-color, #000);
  color: #fff;
  color: var(--dex-okd-tabs-pane-outline-secondary-hover-text-color, #fff)
}

.dex-tabs-pane.dex-tabs-pane-outline-reversed {
  background-color: #f7f7f7;
  background-color: var(--dex-okd-tabs-pane-outline-reversed-default-background-color, #f7f7f7);
  border-color: #f7f7f7;
  border-color: var(--dex-okd-tabs-pane-outline-reversed-default-border-color, #f7f7f7);
  border-style: solid;
  color: #3d3d3d;
  color: var(--dex-okd-tabs-pane-outline-reversed-default-text-color, #3d3d3d)
}

.dex-tabs-pane.dex-tabs-pane-outline-reversed:focus-visible {
  outline: 2px solid var(--dex-okd-color-border-focus);
  outline-color: #fff;
  outline-color: var(--dex-okd-tabs-pane-outline-reversed-active-text-color, #fff);
  outline-offset: -4px;
  outline-style: solid;
  outline-width: 2px
}

.dex-tabs-pane.dex-tabs-pane-outline-reversed.dex-tabs-active {
  background-color: #000;
  background-color: var(--dex-okd-tabs-pane-outline-reversed-active-background-color, #000);
  border-color: #000;
  border-color: var(--dex-okd-tabs-pane-outline-reversed-active-border-color, #000);
  color: #fff;
  color: var(--dex-okd-tabs-pane-outline-reversed-active-text-color, #fff)
}

.dex-tabs-pane.dex-tabs-pane-outline-reversed.dex-tabs-active:focus-visible {
  outline: 2px solid var(--dex-okd-color-border-focus);
  outline-color: #fff;
  outline-color: var(--dex-okd-tabs-pane-outline-reversed-active-text-color, #fff);
  outline-offset: -4px;
  outline-style: solid;
  outline-width: 2px
}

.dex-tabs-pane.dex-tabs-pane-outline-reversed:hover:not(.dex-tabs-active) {
  background-color: #ebebeb;
  background-color: var(--dex-okd-tabs-pane-outline-reversed-hover-background-color, #ebebeb);
  border-color: #ebebeb;
  border-color: var(--dex-okd-tabs-pane-outline-reversed-hover-border-color, #ebebeb);
  color: #3d3d3d;
  color: var(--dex-okd-tabs-pane-outline-reversed-hover-text-color, #3d3d3d)
}

.dex-tabs-pane.dex-tabs-pane-fill-highlight {
  background-color: #f7f7f7;
  background-color: var(--dex-okd-tabs-pane-fill-highlight-default-background-color, #f7f7f7);
  border-color: #f7f7f7;
  border-color: var(--dex-okd-tabs-pane-fill-highlight-default-border-color, #f7f7f7);
  border-style: solid;
  color: #3d3d3d;
  color: var(--dex-okd-tabs-pane-fill-highlight-default-text-color, #3d3d3d)
}

.dex-tabs-pane.dex-tabs-pane-fill-highlight.dex-tabs-active {
  background-color: #000;
  background-color: var(--dex-okd-tabs-pane-fill-highlight-active-background-color, #000);
  border-color: #000;
  border-color: var(--dex-okd-tabs-pane-fill-highlight-active-border-color, #000);
  color: #fff;
  color: var(--dex-okd-tabs-pane-fill-highlight-active-text-color, #fff)
}

.dex-tabs-pane.dex-tabs-pane-fill-highlight.dex-tabs-active:focus-visible {
  outline: 2px solid var(--dex-okd-color-border-focus);
  outline-color: #fff;
  outline-color: var(--dex-okd-tabs-pane-fill-highlight-active-text-color, #fff);
  outline-offset: -4px;
  outline-style: solid;
  outline-width: 2px
}

.dex-tabs-pane.dex-tabs-pane-fill-highlight:hover:not(.dex-tabs-active) {
  background-color: #ebebeb;
  background-color: var(--dex-okd-tabs-pane-fill-highlight-hover-background-color, #ebebeb);
  border-color: #ebebeb;
  border-color: var(--dex-okd-tabs-pane-fill-highlight-hover-border-color, #ebebeb);
  color: #3d3d3d;
  color: var(--dex-okd-tabs-pane-fill-highlight-hover-text-color, #3d3d3d)
}

.dex-tabs-pane.dex-tabs-pane-fill-primary {
  background-color: #f7f7f7;
  background-color: var(--dex-okd-tabs-pane-fill-primary-default-background-color, #f7f7f7);
  border-color: #f7f7f7;
  border-color: var(--dex-okd-tabs-pane-fill-primary-default-border-color, #f7f7f7);
  border-style: solid;
  color: #929292;
  color: var(--dex-okd-tabs-pane-fill-primary-default-text-color, #929292)
}

.dex-tabs-pane.dex-tabs-pane-fill-primary.dex-tabs-active {
  background-color: #f7f7f7;
  background-color: var(--dex-okd-tabs-pane-fill-primary-active-background-color, #f7f7f7);
  border-color: #f7f7f7;
  border-color: var(--dex-okd-tabs-pane-fill-primary-active-border-color, #f7f7f7);
  color: #000;
  color: var(--dex-okd-tabs-pane-fill-primary-active-text-color, #000)
}

.dex-tabs-pane.dex-tabs-pane-fill-primary.dex-tabs-active:focus-visible {
  outline: 2px solid var(--dex-okd-color-border-focus);
  outline-color: #000;
  outline-color: var(--dex-okd-tabs-pane-fill-primary-active-text-color, #000);
  outline-offset: -4px;
  outline-style: solid;
  outline-width: 2px
}

.dex-tabs-pane.dex-tabs-pane-fill-primary:hover:not(.dex-tabs-active) {
  background-color: #ebebeb;
  background-color: var(--dex-okd-tabs-pane-fill-primary-hover-background-color, #ebebeb);
  border-color: #ebebeb;
  border-color: var(--dex-okd-tabs-pane-fill-primary-hover-border-color, #ebebeb);
  color: #000;
  color: var(--dex-okd-tabs-pane-fill-primary-hover-text-color, #000)
}

.dex-tabs-pane.dex-tabs-pane-fill-secondary {
  background-color: initial;
  background-color: var(--dex-okd-tabs-pane-fill-secondary-default-background-color, transparent);
  border-color: transparent;
  border-color: var(--dex-okd-tabs-pane-fill-secondary-default-border-color, transparent);
  border-style: solid;
  color: #929292;
  color: var(--dex-okd-tabs-pane-fill-secondary-default-text-color, #929292)
}

.dex-tabs-pane.dex-tabs-pane-fill-secondary.dex-tabs-active {
  background-color: #f7f7f7;
  background-color: var(--dex-okd-tabs-pane-fill-secondary-active-background-color, #f7f7f7);
  border-color: #f7f7f7;
  border-color: var(--dex-okd-tabs-pane-fill-secondary-active-border-color, #f7f7f7);
  color: #000;
  color: var(--dex-okd-tabs-pane-fill-secondary-active-text-color, #000)
}

.dex-tabs-pane.dex-tabs-pane-fill-secondary.dex-tabs-active:focus-visible {
  outline: 2px solid var(--dex-okd-color-border-focus);
  outline-color: #000;
  outline-color: var(--dex-okd-tabs-pane-fill-secondary-active-text-color, #000);
  outline-offset: -4px;
  outline-style: solid;
  outline-width: 2px
}

.dex-tabs-pane.dex-tabs-pane-fill-secondary:hover:not(.dex-tabs-active) {
  background-color: initial;
  background-color: var(--dex-okd-tabs-pane-fill-secondary-hover-background-color, transparent);
  border-color: transparent;
  border-color: var(--dex-okd-tabs-pane-fill-secondary-hover-border-color, transparent);
  color: #000;
  color: var(--dex-okd-tabs-pane-fill-secondary-hover-text-color, #000)
}

.dex-tabs-pane.dex-tabs-pane-fill-reversed {
  background-color: #f7f7f7;
  background-color: var(--dex-okd-tabs-pane-fill-reversed-default-background-color, #f7f7f7);
  border-color: #f7f7f7;
  border-color: var(--dex-okd-tabs-pane-fill-reversed-default-border-color, #f7f7f7);
  border-style: solid;
  color: #3d3d3d;
  color: var(--dex-okd-tabs-pane-fill-reversed-default-text-color, #3d3d3d)
}

.dex-tabs-pane.dex-tabs-pane-fill-reversed:focus-visible {
  outline: 2px solid var(--dex-okd-color-border-focus);
  outline-color: #fff;
  outline-color: var(--dex-okd-tabs-pane-fill-reversed-active-text-color, #fff);
  outline-offset: -4px;
  outline-style: solid;
  outline-width: 2px
}

.dex-tabs-pane.dex-tabs-pane-fill-reversed.dex-tabs-active {
  background-color: #000;
  background-color: var(--dex-okd-tabs-pane-fill-reversed-active-background-color, #000);
  border-color: #000;
  border-color: var(--dex-okd-tabs-pane-fill-reversed-active-border-color, #000);
  color: #fff;
  color: var(--dex-okd-tabs-pane-fill-reversed-active-text-color, #fff)
}

.dex-tabs-pane.dex-tabs-pane-fill-reversed.dex-tabs-active:focus-visible {
  outline: 2px solid var(--dex-okd-color-border-focus);
  outline-color: #fff;
  outline-color: var(--dex-okd-tabs-pane-fill-reversed-active-text-color, #fff);
  outline-offset: -4px;
  outline-style: solid;
  outline-width: 2px
}

.dex-tabs-pane.dex-tabs-pane-fill-reversed:hover:not(.dex-tabs-active) {
  background-color: #ebebeb;
  background-color: var(--dex-okd-tabs-pane-fill-reversed-hover-background-color, #ebebeb);
  border-color: #ebebeb;
  border-color: var(--dex-okd-tabs-pane-fill-reversed-hover-border-color, #ebebeb);
  color: #3d3d3d;
  color: var(--dex-okd-tabs-pane-fill-reversed-hover-text-color, #3d3d3d)
}

.dex-tabs-pane.dex-tabs-pane-text-highlight {
  background-color: initial;
  background-color: var(--dex-okd-tabs-pane-text-highlight-default-background-color, transparent);
  border-color: transparent;
  border-color: var(--dex-okd-tabs-pane-text-highlight-default-border-color, transparent);
  border-style: solid;
  color: #929292;
  color: var(--dex-okd-tabs-pane-text-highlight-default-text-color, #929292)
}

.dex-tabs-pane.dex-tabs-pane-text-highlight.dex-tabs-active {
  background-color: initial;
  background-color: var(--dex-okd-tabs-pane-text-highlight-active-background-color, transparent);
  border-color: transparent;
  border-color: var(--dex-okd-tabs-pane-text-highlight-active-border-color, transparent);
  color: #000;
  color: var(--dex-okd-tabs-pane-text-highlight-active-text-color, #000)
}

.dex-tabs-pane.dex-tabs-pane-text-highlight.dex-tabs-active:focus-visible {
  outline: 2px solid var(--dex-okd-color-border-focus);
  outline-color: #000;
  outline-color: var(--dex-okd-tabs-pane-text-highlight-active-text-color, #000);
  outline-offset: -4px;
  outline-style: solid;
  outline-width: 2px
}

.dex-tabs-pane.dex-tabs-pane-text-highlight:hover:not(.dex-tabs-active) {
  background-color: initial;
  background-color: var(--dex-okd-tabs-pane-text-highlight-hover-background-color, transparent);
  border-color: transparent;
  border-color: var(--dex-okd-tabs-pane-text-highlight-hover-border-color, transparent);
  color: #000;
  color: var(--dex-okd-tabs-pane-text-highlight-hover-text-color, #000)
}

.dex-tabs-pane.dex-tabs-pane-text-primary {
  background-color: initial;
  background-color: var(--dex-okd-tabs-pane-text-primary-default-background-color, transparent);
  border-color: #000;
  border-color: var(--dex-okd-tabs-pane-text-primary-default-border-color, #000);
  border-style: solid;
  color: #fff;
  color: var(--dex-okd-tabs-pane-text-primary-default-text-color, #fff)
}

.dex-tabs-pane.dex-tabs-pane-text-primary.dex-tabs-active {
  background-color: initial;
  background-color: var(--dex-okd-tabs-pane-text-primary-active-background-color, transparent);
  border-color: #000;
  border-color: var(--dex-okd-tabs-pane-text-primary-active-border-color, #000);
  color: #fff;
  color: var(--dex-okd-tabs-pane-text-primary-active-text-color, #fff)
}

.dex-tabs-pane.dex-tabs-pane-text-primary.dex-tabs-active:focus-visible {
  outline: 2px solid var(--dex-okd-color-border-focus);
  outline-color: #fff;
  outline-color: var(--dex-okd-tabs-pane-text-primary-active-text-color, #fff);
  outline-offset: -4px;
  outline-style: solid;
  outline-width: 2px
}

.dex-tabs-pane.dex-tabs-pane-text-primary:hover:not(.dex-tabs-active) {
  background-color: initial;
  background-color: var(--dex-okd-tabs-pane-text-primary-hover-background-color, transparent);
  border-color: #000;
  border-color: var(--dex-okd-tabs-pane-text-primary-hover-border-color, #000);
  color: #fff;
  color: var(--dex-okd-tabs-pane-text-primary-hover-text-color, #fff)
}

.dex-tabs-pane.dex-tabs-pane-text-secondary {
  background-color: initial;
  background-color: var(--dex-okd-tabs-pane-text-secondary-default-background-color, transparent);
  border-color: #000;
  border-color: var(--dex-okd-tabs-pane-text-secondary-default-border-color, #000);
  border-style: solid;
  color: #fff;
  color: var(--dex-okd-tabs-pane-text-secondary-default-text-color, #fff)
}

.dex-tabs-pane.dex-tabs-pane-text-secondary.dex-tabs-active {
  background-color: initial;
  background-color: var(--dex-okd-tabs-pane-text-secondary-active-background-color, transparent);
  border-color: #000;
  border-color: var(--dex-okd-tabs-pane-text-secondary-active-border-color, #000);
  color: #fff;
  color: var(--dex-okd-tabs-pane-text-secondary-active-text-color, #fff)
}

.dex-tabs-pane.dex-tabs-pane-text-secondary.dex-tabs-active:focus-visible {
  outline: 2px solid var(--dex-okd-color-border-focus);
  outline-color: #fff;
  outline-color: var(--dex-okd-tabs-pane-text-secondary-active-text-color, #fff);
  outline-offset: -4px;
  outline-style: solid;
  outline-width: 2px
}

.dex-tabs-pane.dex-tabs-pane-text-secondary:hover:not(.dex-tabs-active) {
  background-color: initial;
  background-color: var(--dex-okd-tabs-pane-text-secondary-hover-background-color, transparent);
  border-color: #000;
  border-color: var(--dex-okd-tabs-pane-text-secondary-hover-border-color, #000);
  color: #fff;
  color: var(--dex-okd-tabs-pane-text-secondary-hover-text-color, #fff)
}

.dex-tabs-pane.dex-tabs-pane-text-reversed {
  background-color: #f7f7f7;
  background-color: var(--dex-okd-tabs-pane-text-reversed-default-background-color, #f7f7f7);
  border-color: #f7f7f7;
  border-color: var(--dex-okd-tabs-pane-text-reversed-default-border-color, #f7f7f7);
  border-style: solid;
  color: #3d3d3d;
  color: var(--dex-okd-tabs-pane-text-reversed-default-text-color, #3d3d3d)
}

.dex-tabs-pane.dex-tabs-pane-text-reversed:focus-visible {
  outline: 2px solid var(--dex-okd-color-border-focus);
  outline-color: #fff;
  outline-color: var(--dex-okd-tabs-pane-text-reversed-active-text-color, #fff);
  outline-offset: -4px;
  outline-style: solid;
  outline-width: 2px
}

.dex-tabs-pane.dex-tabs-pane-text-reversed.dex-tabs-active {
  background-color: #000;
  background-color: var(--dex-okd-tabs-pane-text-reversed-active-background-color, #000);
  border-color: #000;
  border-color: var(--dex-okd-tabs-pane-text-reversed-active-border-color, #000);
  color: #fff;
  color: var(--dex-okd-tabs-pane-text-reversed-active-text-color, #fff)
}

.dex-tabs-pane.dex-tabs-pane-text-reversed.dex-tabs-active:focus-visible {
  outline: 2px solid var(--dex-okd-color-border-focus);
  outline-color: #fff;
  outline-color: var(--dex-okd-tabs-pane-text-reversed-active-text-color, #fff);
  outline-offset: -4px;
  outline-style: solid;
  outline-width: 2px
}

.dex-tabs-pane.dex-tabs-pane-text-reversed:hover:not(.dex-tabs-active) {
  background-color: #ebebeb;
  background-color: var(--dex-okd-tabs-pane-text-reversed-hover-background-color, #ebebeb);
  border-color: #ebebeb;
  border-color: var(--dex-okd-tabs-pane-text-reversed-hover-border-color, #ebebeb);
  color: #3d3d3d;
  color: var(--dex-okd-tabs-pane-text-reversed-hover-text-color, #3d3d3d)
}

.dex-tabs-pane-xxs.category-size {
  border-radius: 4px;
  border-radius: var(--dex-okd-tabs-pane-xxs-border-radius, 4px);
  border-width: 1px;
  border-width: var(--dex-okd-tabs-pane-xxs-border-width, 1px);
  font-size: 12px;
  font-size: var(--dex-okd-tabs-pane-xxs-font-size, 12px);
  font-weight: 400;
  font-weight: var(--dex-okd-tabs-pane-xxs-font-weight, 400);
  height: 24px;
  height: var(--dex-okd-tabs-pane-xxs-height, 24px);
  margin-right: 8px;
  margin-right: var(--dex-okd-tabs-pane-xxs-margin-right, 8px);
  padding: 0 8px;
  padding: 0 var(--dex-okd-tabs-pane-xxs-padding-vertical, 8px)
}

.dex-tabs-pane-xxs.category-size:last-child {
  margin-right: 0
}

.dex-tabs-pane-xxs.category-size.dex-tabs-active {
  font-weight: 500;
  font-weight: var(--dex-okd-tabs-pane-xxs-active-font-weight, 500)
}

.dex-tabs-pane-xxs.category-size:hover:not(.dex-tabs-active) {
  font-weight: 500;
  font-weight: var(--dex-okd-tabs-pane-xxs-hover-font-weight, 500)
}

.dex-tabs-pane-xxs.category-size.dex-tabs-pane-circle {
  border-radius: 12px;
  border-radius: calc(var(--dex-okd-tabs-pane-xxs-height, 24px)/2)
}

.dex-tabs-pane-xs.category-size {
  border-radius: 4px;
  border-radius: var(--dex-okd-tabs-pane-xs-border-radius, 4px);
  border-width: 1px;
  border-width: var(--dex-okd-tabs-pane-xs-border-width, 1px);
  font-size: 12px;
  font-size: var(--dex-okd-tabs-pane-xs-font-size, 12px);
  font-weight: 400;
  font-weight: var(--dex-okd-tabs-pane-xs-font-weight, 400);
  height: 24px;
  height: var(--dex-okd-tabs-pane-xs-height, 24px);
  margin-right: 8px;
  margin-right: var(--dex-okd-tabs-pane-xs-margin-right, 8px);
  padding: 0 8px;
  padding: 0 var(--dex-okd-tabs-pane-xs-padding-vertical, 8px)
}

.dex-tabs-pane-xs.category-size:last-child {
  margin-right: 0
}

.dex-tabs-pane-xs.category-size.dex-tabs-active {
  font-weight: 500;
  font-weight: var(--dex-okd-tabs-pane-xs-active-font-weight, 500)
}

.dex-tabs-pane-xs.category-size:hover:not(.dex-tabs-active) {
  font-weight: 500;
  font-weight: var(--dex-okd-tabs-pane-xs-hover-font-weight, 500)
}

.dex-tabs-pane-xs.category-size.dex-tabs-pane-circle {
  border-radius: 12px;
  border-radius: calc(var(--dex-okd-tabs-pane-xs-height, 24px)/2)
}

.dex-tabs-pane-sm.category-size {
  border-radius: 4px;
  border-radius: var(--dex-okd-tabs-pane-sm-border-radius, 4px);
  border-width: 1px;
  border-width: var(--dex-okd-tabs-pane-sm-border-width, 1px);
  font-size: 12px;
  font-size: var(--dex-okd-tabs-pane-sm-font-size, 12px);
  font-weight: 400;
  font-weight: var(--dex-okd-tabs-pane-sm-font-weight, 400);
  height: 28px;
  height: var(--dex-okd-tabs-pane-sm-height, 28px);
  margin-right: 8px;
  margin-right: var(--dex-okd-tabs-pane-sm-margin-right, 8px);
  padding: 0 8px;
  padding: 0 var(--dex-okd-tabs-pane-sm-padding-vertical, 8px)
}

.dex-tabs-pane-sm.category-size:last-child {
  margin-right: 0
}

.dex-tabs-pane-sm.category-size.dex-tabs-active {
  font-weight: 500;
  font-weight: var(--dex-okd-tabs-pane-sm-active-font-weight, 500)
}

.dex-tabs-pane-sm.category-size:hover:not(.dex-tabs-active) {
  font-weight: 500;
  font-weight: var(--dex-okd-tabs-pane-sm-hover-font-weight, 500)
}

.dex-tabs-pane-sm.category-size.dex-tabs-pane-circle {
  border-radius: 14px;
  border-radius: calc(var(--dex-okd-tabs-pane-sm-height, 28px)/2)
}

.dex-tabs-pane-md.category-size {
  border-radius: 6px;
  border-radius: var(--dex-okd-tabs-pane-md-border-radius, 6px);
  border-width: 1px;
  border-width: var(--dex-okd-tabs-pane-md-border-width, 1px);
  font-size: 14px;
  font-size: var(--dex-okd-tabs-pane-md-font-size, 14px);
  font-weight: 400;
  font-weight: var(--dex-okd-tabs-pane-md-font-weight, 400);
  height: 32px;
  height: var(--dex-okd-tabs-pane-md-height, 32px);
  margin-right: 8px;
  margin-right: var(--dex-okd-tabs-pane-md-margin-right, 8px);
  padding: 0 8px;
  padding: 0 var(--dex-okd-tabs-pane-md-padding-vertical, 8px)
}

.dex-tabs-pane-md.category-size:last-child {
  margin-right: 0
}

.dex-tabs-pane-md.category-size.dex-tabs-active {
  font-weight: 500;
  font-weight: var(--dex-okd-tabs-pane-md-active-font-weight, 500)
}

.dex-tabs-pane-md.category-size:hover:not(.dex-tabs-active) {
  font-weight: 500;
  font-weight: var(--dex-okd-tabs-pane-md-hover-font-weight, 500)
}

.dex-tabs-pane-md.category-size.dex-tabs-pane-circle {
  border-radius: 16px;
  border-radius: calc(var(--dex-okd-tabs-pane-md-height, 32px)/2)
}

.dex-tabs-pane-lg.category-size {
  border-radius: 6px;
  border-radius: var(--dex-okd-tabs-pane-lg-border-radius, 6px);
  border-width: 1px;
  border-width: var(--dex-okd-tabs-pane-lg-border-width, 1px);
  font-size: 14px;
  font-size: var(--dex-okd-tabs-pane-lg-font-size, 14px);
  font-weight: 400;
  font-weight: var(--dex-okd-tabs-pane-lg-font-weight, 400);
  height: 36px;
  height: var(--dex-okd-tabs-pane-lg-height, 36px);
  margin-right: 8px;
  margin-right: var(--dex-okd-tabs-pane-lg-margin-right, 8px);
  padding: 0 12px;
  padding: 0 var(--dex-okd-tabs-pane-lg-padding-vertical, 12px)
}

.dex-tabs-pane-lg.category-size:last-child {
  margin-right: 0
}

.dex-tabs-pane-lg.category-size.dex-tabs-active {
  font-weight: 500;
  font-weight: var(--dex-okd-tabs-pane-lg-active-font-weight, 500)
}

.dex-tabs-pane-lg.category-size:hover:not(.dex-tabs-active) {
  font-weight: 500;
  font-weight: var(--dex-okd-tabs-pane-lg-hover-font-weight, 500)
}

.dex-tabs-pane-lg.category-size.dex-tabs-pane-circle {
  border-radius: 18px;
  border-radius: calc(var(--dex-okd-tabs-pane-lg-height, 36px)/2)
}

.dex-tabs-pane-xl.category-size {
  border-radius: 8px;
  border-radius: var(--dex-okd-tabs-pane-xl-border-radius, 8px);
  border-width: 1px;
  border-width: var(--dex-okd-tabs-pane-xl-border-width, 1px);
  font-size: 14px;
  font-size: var(--dex-okd-tabs-pane-xl-font-size, 14px);
  font-weight: 400;
  font-weight: var(--dex-okd-tabs-pane-xl-font-weight, 400);
  height: 40px;
  height: var(--dex-okd-tabs-pane-xl-height, 40px);
  margin-right: 8px;
  margin-right: var(--dex-okd-tabs-pane-xl-margin-right, 8px);
  padding: 0 16px;
  padding: 0 var(--dex-okd-tabs-pane-xl-padding-vertical, 16px)
}

.dex-tabs-pane-xl.category-size:last-child {
  margin-right: 0
}

.dex-tabs-pane-xl.category-size.dex-tabs-active {
  font-weight: 500;
  font-weight: var(--dex-okd-tabs-pane-xl-active-font-weight, 500)
}

.dex-tabs-pane-xl.category-size:hover:not(.dex-tabs-active) {
  font-weight: 500;
  font-weight: var(--dex-okd-tabs-pane-xl-hover-font-weight, 500)
}

.dex-tabs-pane-xl.category-size.dex-tabs-pane-circle {
  border-radius: 20px;
  border-radius: calc(var(--dex-okd-tabs-pane-xl-height, 40px)/2)
}

.dex-tabs-pane-xxl.category-size {
  border-radius: 8px;
  border-radius: var(--dex-okd-tabs-pane-xxl-border-radius, 8px);
  border-width: 1px;
  border-width: var(--dex-okd-tabs-pane-xxl-border-width, 1px);
  font-size: 16px;
  font-size: var(--dex-okd-tabs-pane-xxl-font-size, 16px);
  font-weight: 400;
  font-weight: var(--dex-okd-tabs-pane-xxl-font-weight, 400);
  height: 44px;
  height: var(--dex-okd-tabs-pane-xxl-height, 44px);
  margin-right: 8px;
  margin-right: var(--dex-okd-tabs-pane-xxl-margin-right, 8px);
  padding: 0 16px;
  padding: 0 var(--dex-okd-tabs-pane-xxl-padding-vertical, 16px)
}

.dex-tabs-pane-xxl.category-size:last-child {
  margin-right: 0
}

.dex-tabs-pane-xxl.category-size.dex-tabs-active {
  font-weight: 500;
  font-weight: var(--dex-okd-tabs-pane-xxl-active-font-weight, 500)
}

.dex-tabs-pane-xxl.category-size:hover:not(.dex-tabs-active) {
  font-weight: 500;
  font-weight: var(--dex-okd-tabs-pane-xxl-hover-font-weight, 500)
}

.dex-tabs-pane-xxl.category-size.dex-tabs-pane-circle {
  border-radius: 22px;
  border-radius: calc(var(--dex-okd-tabs-pane-xxl-height, 44px)/2)
}

.dex-tabs-pane-xxxl.category-size {
  border-radius: 10px;
  border-radius: var(--dex-okd-tabs-pane-xxxl-border-radius, 10px);
  border-width: 1px;
  border-width: var(--dex-okd-tabs-pane-xxxl-border-width, 1px);
  font-size: 18px;
  font-size: var(--dex-okd-tabs-pane-xxxl-font-size, 18px);
  font-weight: 400;
  font-weight: var(--dex-okd-tabs-pane-xxxl-font-weight, 400);
  height: 50px;
  height: var(--dex-okd-tabs-pane-xxxl-height, 50px);
  margin-right: 8px;
  margin-right: var(--dex-okd-tabs-pane-xxxl-margin-right, 8px);
  padding: 0 16px;
  padding: 0 var(--dex-okd-tabs-pane-xxxl-padding-vertical, 16px)
}

.dex-tabs-pane-xxxl.category-size:last-child {
  margin-right: 0
}

.dex-tabs-pane-xxxl.category-size.dex-tabs-active {
  font-weight: 500;
  font-weight: var(--dex-okd-tabs-pane-xxxl-active-font-weight, 500)
}

.dex-tabs-pane-xxxl.category-size:hover:not(.dex-tabs-active) {
  font-weight: 500;
  font-weight: var(--dex-okd-tabs-pane-xxxl-hover-font-weight, 500)
}

.dex-tabs-pane-xxxl.category-size.dex-tabs-pane-circle {
  border-radius: 25px;
  border-radius: calc(var(--dex-okd-tabs-pane-xxxl-height, 50px)/2)
}

.dex-tabs-pane-xxs:last-child {
  margin-right: 0 !important
}

.dex-tabs-pane-xxs.dex-tabs-pane-underline {
  font-size: var(--dex-okd-tabs-xxs-underline-font-size);
  font-weight: 400;
  font-weight: var(--dex-okd-tabs-xxs-underline-font-weight, 400);
  margin-right: var(--dex-okd-tabs-xxs-underline-spacing);
  padding: 0 var(--dex-okd-tabs-xxs-underline-label-padding)
}

.dex-tabs-pane-xxs.dex-tabs-pane-underline.dex-tabs-pane-circle {
  border-radius: calc(var(--dex-okd-tabs-xxs-underline-height)/2)
}

.dex-tabs-pane-xxs.dex-tabs-pane-underline-active {
  font-weight: 400;
  font-weight: var(--dex-okd-tabs-xxs-underline-active-font-weight, 400)
}

.dex-tabs-pane-xxs.dex-tabs-pane-button {
  border-radius: 4px;
  border-radius: var(--dex-okd-tabs-xxs-button-border-radius, 4px);
  font-size: var(--dex-okd-tabs-xxs-button-font-size);
  font-weight: var(--dex-okd-tabs-xxs-button-font-weight);
  margin-right: var(--dex-okd-tabs-xxs-button-spacing);
  padding: 0 var(--dex-okd-tabs-xxs-button-label-padding)
}

.dex-tabs-pane-xxs.dex-tabs-pane-button.dex-tabs-pane-circle {
  border-radius: calc(var(--dex-okd-tabs-xxs-button-height)/2)
}

.dex-tabs-pane-xxs.dex-tabs-pane-button-active {
  font-weight: 400;
  font-weight: var(--dex-okd-tabs-xxs-button-active-font-weight, 400)
}

.dex-tabs-pane-xxs.dex-tabs-pane-muted {
  border-radius: 4px;
  border-radius: var(--dex-okd-tabs-xxs-muted-border-radius, 4px);
  font-size: var(--dex-okd-tabs-xxs-muted-font-size);
  font-weight: var(--dex-okd-tabs-xxs-muted-font-weight);
  margin-right: var(--dex-okd-tabs-xxs-muted-spacing);
  padding: 0 var(--dex-okd-tabs-xxs-muted-label-padding)
}

.dex-tabs-pane-xxs.dex-tabs-pane-muted.dex-tabs-pane-circle {
  border-radius: calc(var(--dex-okd-tabs-xxs-muted-height)/2)
}

.dex-tabs-pane-xxs.dex-tabs-pane-muted-active {
  font-weight: 400;
  font-weight: var(--dex-okd-tabs-xxs-muted-active-font-weight, 400)
}

.dex-tabs-pane-xxs.dex-tabs-pane-segmented {
  border-radius: 4px;
  border-radius: var(--dex-okd-tabs-xxs-segmented-border-radius, 4px);
  font-size: var(--dex-okd-tabs-xxs-segmented-font-size);
  font-weight: var(--dex-okd-tabs-xxs-segmented-font-weight);
  margin-right: var(--dex-okd-tabs-xxs-segmented-spacing);
  padding: 0 var(--dex-okd-tabs-xxs-segmented-label-padding)
}

.dex-tabs-pane-xxs.dex-tabs-pane-segmented-active {
  font-weight: 400;
  font-weight: var(--dex-okd-tabs-xxs-segmented-active-font-weight, 400)
}

.dex-tabs-pane-xxs.dex-tabs-pane-segmented.dex-tabs-pane-circle {
  border-radius: calc(var(--dex-okd-tabs-xxs-segmented-height)/2)
}

.dex-tabs-pane-list-xxs .dex-tabs-pane-list-nav-icon .icon {
  font-size: var(--dex-okd-tabs-xxs-common-icon-size)
}

.dex-tabs-pane-list-xxs.dex-tabs-pane-list-underline {
  font-size: var(--dex-okd-tabs-xxs-underline-font-size);
  height: var(--dex-okd-tabs-xxs-underline-height)
}

.dex-tabs-pane-list-xxs.dex-tabs-pane-list-underline .dex-tabs-pane-list-circle {
  border-radius: calc(var(--dex-okd-tabs-xxs-underline-height)/2)
}

.dex-tabs-pane-list-xxs.dex-tabs-pane-list-button {
  font-size: var(--dex-okd-tabs-xxs-button-font-size);
  height: var(--dex-okd-tabs-xxs-button-height);
  line-height: var(--dex-okd-tabs-xxs-button-height)
}

.dex-tabs-pane-list-xxs.dex-tabs-pane-list-button .dex-tabs-pane-list-container {
  border-radius: 4px;
  border-radius: var(--dex-okd-tabs-xxs-button-container-border-radius, 4px)
}

.dex-tabs-pane-list-xxs.dex-tabs-pane-list-button .dex-tabs-pane-list-circle {
  border-radius: calc(var(--dex-okd-tabs-xxs-button-height)/2)
}

.dex-tabs-pane-list-xxs.dex-tabs-pane-list-muted {
  font-size: var(--dex-okd-tabs-xxs-muted-font-size);
  height: var(--dex-okd-tabs-xxs-muted-height);
  line-height: var(--dex-okd-tabs-xxs-muted-height)
}

.dex-tabs-pane-list-xxs.dex-tabs-pane-list-muted .dex-tabs-pane-list-container {
  border-radius: 4px;
  border-radius: var(--dex-okd-tabs-xxs-muted-container-border-radius, 4px)
}

.dex-tabs-pane-list-xxs.dex-tabs-pane-list-muted .dex-tabs-pane-list-circle {
  border-radius: calc(var(--dex-okd-tabs-xxs-muted-height)/2)
}

.dex-tabs-pane-list-xxs.dex-tabs-pane-list-segmented {
  font-size: var(--dex-okd-tabs-xxs-segmented-font-size);
  height: var(--dex-okd-tabs-xxs-segmented-height);
  line-height: var(--dex-okd-tabs-xxs-segmented-height)
}

.dex-tabs-pane-list-xxs.dex-tabs-pane-list-segmented .dex-tabs-pane-list-container {
  border-radius: 4px;
  border-radius: var(--dex-okd-tabs-xxs-segmented-container-border-radius, 4px)
}

.dex-tabs-pane-list-xxs.dex-tabs-pane-list-segmented .dex-tabs-pane-list-circle {
  border-radius: calc(var(--dex-okd-tabs-xxs-segmented-height)/2)
}

.dex-tabs-pane-list-xxs.dex-tabs-pane-list-segmented .dex-tabs-pane-list-flex {
  padding: var(--dex-okd-tabs-xxs-segmented-container-padding)
}

.dex-tabs-pane-xs:last-child {
  margin-right: 0 !important
}

.dex-tabs-pane-xs.dex-tabs-pane-underline {
  font-size: var(--dex-okd-tabs-xs-underline-font-size);
  font-weight: 400;
  font-weight: var(--dex-okd-tabs-xs-underline-font-weight, 400);
  margin-right: var(--dex-okd-tabs-xs-underline-spacing);
  padding: 0 var(--dex-okd-tabs-xs-underline-label-padding)
}

.dex-tabs-pane-xs.dex-tabs-pane-underline.dex-tabs-pane-circle {
  border-radius: calc(var(--dex-okd-tabs-xs-underline-height)/2)
}

.dex-tabs-pane-xs.dex-tabs-pane-underline-active {
  font-weight: 400;
  font-weight: var(--dex-okd-tabs-xs-underline-active-font-weight, 400)
}

.dex-tabs-pane-xs.dex-tabs-pane-button {
  border-radius: 4px;
  border-radius: var(--dex-okd-tabs-xs-button-border-radius, 4px);
  font-size: var(--dex-okd-tabs-xs-button-font-size);
  font-weight: var(--dex-okd-tabs-xs-button-font-weight);
  margin-right: var(--dex-okd-tabs-xs-button-spacing);
  padding: 0 var(--dex-okd-tabs-xs-button-label-padding)
}

.dex-tabs-pane-xs.dex-tabs-pane-button.dex-tabs-pane-circle {
  border-radius: calc(var(--dex-okd-tabs-xs-button-height)/2)
}

.dex-tabs-pane-xs.dex-tabs-pane-button-active {
  font-weight: 400;
  font-weight: var(--dex-okd-tabs-xs-button-active-font-weight, 400)
}

.dex-tabs-pane-xs.dex-tabs-pane-muted {
  border-radius: 4px;
  border-radius: var(--dex-okd-tabs-xs-muted-border-radius, 4px);
  font-size: var(--dex-okd-tabs-xs-muted-font-size);
  font-weight: var(--dex-okd-tabs-xs-muted-font-weight);
  margin-right: var(--dex-okd-tabs-xs-muted-spacing);
  padding: 0 var(--dex-okd-tabs-xs-muted-label-padding)
}

.dex-tabs-pane-xs.dex-tabs-pane-muted.dex-tabs-pane-circle {
  border-radius: calc(var(--dex-okd-tabs-xs-muted-height)/2)
}

.dex-tabs-pane-xs.dex-tabs-pane-muted-active {
  font-weight: 400;
  font-weight: var(--dex-okd-tabs-xs-muted-active-font-weight, 400)
}

.dex-tabs-pane-xs.dex-tabs-pane-segmented {
  border-radius: 4px;
  border-radius: var(--dex-okd-tabs-xs-segmented-border-radius, 4px);
  font-size: var(--dex-okd-tabs-xs-segmented-font-size);
  font-weight: var(--dex-okd-tabs-xs-segmented-font-weight);
  margin-right: var(--dex-okd-tabs-xs-segmented-spacing);
  padding: 0 var(--dex-okd-tabs-xs-segmented-label-padding)
}

.dex-tabs-pane-xs.dex-tabs-pane-segmented-active {
  font-weight: 400;
  font-weight: var(--dex-okd-tabs-xs-segmented-active-font-weight, 400)
}

.dex-tabs-pane-xs.dex-tabs-pane-segmented.dex-tabs-pane-circle {
  border-radius: calc(var(--dex-okd-tabs-xs-segmented-height)/2)
}

.dex-tabs-pane-list-xs .dex-tabs-pane-list-nav-icon .icon {
  font-size: var(--dex-okd-tabs-xs-common-icon-size)
}

.dex-tabs-pane-list-xs.dex-tabs-pane-list-underline {
  font-size: var(--dex-okd-tabs-xs-underline-font-size);
  height: var(--dex-okd-tabs-xs-underline-height)
}

.dex-tabs-pane-list-xs.dex-tabs-pane-list-underline .dex-tabs-pane-list-circle {
  border-radius: calc(var(--dex-okd-tabs-xs-underline-height)/2)
}

.dex-tabs-pane-list-xs.dex-tabs-pane-list-button {
  font-size: var(--dex-okd-tabs-xs-button-font-size);
  height: var(--dex-okd-tabs-xs-button-height);
  line-height: var(--dex-okd-tabs-xs-button-height)
}

.dex-tabs-pane-list-xs.dex-tabs-pane-list-button .dex-tabs-pane-list-container {
  border-radius: 4px;
  border-radius: var(--dex-okd-tabs-xs-button-container-border-radius, 4px)
}

.dex-tabs-pane-list-xs.dex-tabs-pane-list-button .dex-tabs-pane-list-circle {
  border-radius: calc(var(--dex-okd-tabs-xs-button-height)/2)
}

.dex-tabs-pane-list-xs.dex-tabs-pane-list-muted {
  font-size: var(--dex-okd-tabs-xs-muted-font-size);
  height: var(--dex-okd-tabs-xs-muted-height);
  line-height: var(--dex-okd-tabs-xs-muted-height)
}

.dex-tabs-pane-list-xs.dex-tabs-pane-list-muted .dex-tabs-pane-list-container {
  border-radius: 4px;
  border-radius: var(--dex-okd-tabs-xs-muted-container-border-radius, 4px)
}

.dex-tabs-pane-list-xs.dex-tabs-pane-list-muted .dex-tabs-pane-list-circle {
  border-radius: calc(var(--dex-okd-tabs-xs-muted-height)/2)
}

.dex-tabs-pane-list-xs.dex-tabs-pane-list-segmented {
  font-size: var(--dex-okd-tabs-xs-segmented-font-size);
  height: var(--dex-okd-tabs-xs-segmented-height);
  line-height: var(--dex-okd-tabs-xs-segmented-height)
}

.dex-tabs-pane-list-xs.dex-tabs-pane-list-segmented .dex-tabs-pane-list-container {
  border-radius: 4px;
  border-radius: var(--dex-okd-tabs-xs-segmented-container-border-radius, 4px)
}

.dex-tabs-pane-list-xs.dex-tabs-pane-list-segmented .dex-tabs-pane-list-circle {
  border-radius: calc(var(--dex-okd-tabs-xs-segmented-height)/2)
}

.dex-tabs-pane-list-xs.dex-tabs-pane-list-segmented .dex-tabs-pane-list-flex {
  padding: var(--dex-okd-tabs-xs-segmented-container-padding)
}

.dex-tabs-pane-sm:last-child {
  margin-right: 0 !important
}

.dex-tabs-pane-sm.dex-tabs-pane-underline {
  font-size: var(--dex-okd-tabs-sm-underline-font-size);
  font-weight: 400;
  font-weight: var(--dex-okd-tabs-sm-underline-font-weight, 400);
  margin-right: var(--dex-okd-tabs-sm-underline-spacing);
  padding: 0 var(--dex-okd-tabs-sm-underline-label-padding)
}

.dex-tabs-pane-sm.dex-tabs-pane-underline.dex-tabs-pane-circle {
  border-radius: calc(var(--dex-okd-tabs-sm-underline-height)/2)
}

.dex-tabs-pane-sm.dex-tabs-pane-underline-active {
  font-weight: 400;
  font-weight: var(--dex-okd-tabs-sm-underline-active-font-weight, 400)
}

.dex-tabs-pane-sm.dex-tabs-pane-button {
  border-radius: 4px;
  border-radius: var(--dex-okd-tabs-sm-button-border-radius, 4px);
  font-size: var(--dex-okd-tabs-sm-button-font-size);
  font-weight: var(--dex-okd-tabs-sm-button-font-weight);
  margin-right: var(--dex-okd-tabs-sm-button-spacing);
  padding: 0 var(--dex-okd-tabs-sm-button-label-padding)
}

.dex-tabs-pane-sm.dex-tabs-pane-button.dex-tabs-pane-circle {
  border-radius: calc(var(--dex-okd-tabs-sm-button-height)/2)
}

.dex-tabs-pane-sm.dex-tabs-pane-button-active {
  font-weight: 400;
  font-weight: var(--dex-okd-tabs-sm-button-active-font-weight, 400)
}

.dex-tabs-pane-sm.dex-tabs-pane-muted {
  border-radius: 4px;
  border-radius: var(--dex-okd-tabs-sm-muted-border-radius, 4px);
  font-size: var(--dex-okd-tabs-sm-muted-font-size);
  font-weight: var(--dex-okd-tabs-sm-muted-font-weight);
  margin-right: var(--dex-okd-tabs-sm-muted-spacing);
  padding: 0 var(--dex-okd-tabs-sm-muted-label-padding)
}

.dex-tabs-pane-sm.dex-tabs-pane-muted.dex-tabs-pane-circle {
  border-radius: calc(var(--dex-okd-tabs-sm-muted-height)/2)
}

.dex-tabs-pane-sm.dex-tabs-pane-muted-active {
  font-weight: 400;
  font-weight: var(--dex-okd-tabs-sm-muted-active-font-weight, 400)
}

.dex-tabs-pane-sm.dex-tabs-pane-segmented {
  border-radius: 4px;
  border-radius: var(--dex-okd-tabs-sm-segmented-border-radius, 4px);
  font-size: var(--dex-okd-tabs-sm-segmented-font-size);
  font-weight: var(--dex-okd-tabs-sm-segmented-font-weight);
  margin-right: var(--dex-okd-tabs-sm-segmented-spacing);
  padding: 0 var(--dex-okd-tabs-sm-segmented-label-padding)
}

.dex-tabs-pane-sm.dex-tabs-pane-segmented-active {
  font-weight: 400;
  font-weight: var(--dex-okd-tabs-sm-segmented-active-font-weight, 400)
}

.dex-tabs-pane-sm.dex-tabs-pane-segmented.dex-tabs-pane-circle {
  border-radius: calc(var(--dex-okd-tabs-sm-segmented-height)/2)
}

.dex-tabs-pane-list-sm .dex-tabs-pane-list-nav-icon .icon {
  font-size: var(--dex-okd-tabs-sm-common-icon-size)
}

.dex-tabs-pane-list-sm.dex-tabs-pane-list-underline {
  font-size: var(--dex-okd-tabs-sm-underline-font-size);
  height: var(--dex-okd-tabs-sm-underline-height)
}

.dex-tabs-pane-list-sm.dex-tabs-pane-list-underline .dex-tabs-pane-list-circle {
  border-radius: calc(var(--dex-okd-tabs-sm-underline-height)/2)
}

.dex-tabs-pane-list-sm.dex-tabs-pane-list-button {
  font-size: var(--dex-okd-tabs-sm-button-font-size);
  height: var(--dex-okd-tabs-sm-button-height);
  line-height: var(--dex-okd-tabs-sm-button-height)
}

.dex-tabs-pane-list-sm.dex-tabs-pane-list-button .dex-tabs-pane-list-container {
  border-radius: 4px;
  border-radius: var(--dex-okd-tabs-sm-button-container-border-radius, 4px)
}

.dex-tabs-pane-list-sm.dex-tabs-pane-list-button .dex-tabs-pane-list-circle {
  border-radius: calc(var(--dex-okd-tabs-sm-button-height)/2)
}

.dex-tabs-pane-list-sm.dex-tabs-pane-list-muted {
  font-size: var(--dex-okd-tabs-sm-muted-font-size);
  height: var(--dex-okd-tabs-sm-muted-height);
  line-height: var(--dex-okd-tabs-sm-muted-height)
}

.dex-tabs-pane-list-sm.dex-tabs-pane-list-muted .dex-tabs-pane-list-container {
  border-radius: 4px;
  border-radius: var(--dex-okd-tabs-sm-muted-container-border-radius, 4px)
}

.dex-tabs-pane-list-sm.dex-tabs-pane-list-muted .dex-tabs-pane-list-circle {
  border-radius: calc(var(--dex-okd-tabs-sm-muted-height)/2)
}

.dex-tabs-pane-list-sm.dex-tabs-pane-list-segmented {
  font-size: var(--dex-okd-tabs-sm-segmented-font-size);
  height: var(--dex-okd-tabs-sm-segmented-height);
  line-height: var(--dex-okd-tabs-sm-segmented-height)
}

.dex-tabs-pane-list-sm.dex-tabs-pane-list-segmented .dex-tabs-pane-list-container {
  border-radius: 4px;
  border-radius: var(--dex-okd-tabs-sm-segmented-container-border-radius, 4px)
}

.dex-tabs-pane-list-sm.dex-tabs-pane-list-segmented .dex-tabs-pane-list-circle {
  border-radius: calc(var(--dex-okd-tabs-sm-segmented-height)/2)
}

.dex-tabs-pane-list-sm.dex-tabs-pane-list-segmented .dex-tabs-pane-list-flex {
  padding: var(--dex-okd-tabs-sm-segmented-container-padding)
}

.dex-tabs-pane-md:last-child {
  margin-right: 0 !important
}

.dex-tabs-pane-md.dex-tabs-pane-underline {
  font-size: var(--dex-okd-tabs-md-underline-font-size);
  font-weight: 400;
  font-weight: var(--dex-okd-tabs-md-underline-font-weight, 400);
  margin-right: var(--dex-okd-tabs-md-underline-spacing);
  padding: 0 var(--dex-okd-tabs-md-underline-label-padding)
}

.dex-tabs-pane-md.dex-tabs-pane-underline.dex-tabs-pane-circle {
  border-radius: calc(var(--dex-okd-tabs-md-underline-height)/2)
}

.dex-tabs-pane-md.dex-tabs-pane-underline-active {
  font-weight: 400;
  font-weight: var(--dex-okd-tabs-md-underline-active-font-weight, 400)
}

.dex-tabs-pane-md.dex-tabs-pane-button {
  border-radius: 4px;
  border-radius: var(--dex-okd-tabs-md-button-border-radius, 4px);
  font-size: var(--dex-okd-tabs-md-button-font-size);
  font-weight: var(--dex-okd-tabs-md-button-font-weight);
  margin-right: var(--dex-okd-tabs-md-button-spacing);
  padding: 0 var(--dex-okd-tabs-md-button-label-padding)
}

.dex-tabs-pane-md.dex-tabs-pane-button.dex-tabs-pane-circle {
  border-radius: calc(var(--dex-okd-tabs-md-button-height)/2)
}

.dex-tabs-pane-md.dex-tabs-pane-button-active {
  font-weight: 400;
  font-weight: var(--dex-okd-tabs-md-button-active-font-weight, 400)
}

.dex-tabs-pane-md.dex-tabs-pane-muted {
  border-radius: 4px;
  border-radius: var(--dex-okd-tabs-md-muted-border-radius, 4px);
  font-size: var(--dex-okd-tabs-md-muted-font-size);
  font-weight: var(--dex-okd-tabs-md-muted-font-weight);
  margin-right: var(--dex-okd-tabs-md-muted-spacing);
  padding: 0 var(--dex-okd-tabs-md-muted-label-padding)
}

.dex-tabs-pane-md.dex-tabs-pane-muted.dex-tabs-pane-circle {
  border-radius: calc(var(--dex-okd-tabs-md-muted-height)/2)
}

.dex-tabs-pane-md.dex-tabs-pane-muted-active {
  font-weight: 400;
  font-weight: var(--dex-okd-tabs-md-muted-active-font-weight, 400)
}

.dex-tabs-pane-md.dex-tabs-pane-segmented {
  border-radius: 4px;
  border-radius: var(--dex-okd-tabs-md-segmented-border-radius, 4px);
  font-size: var(--dex-okd-tabs-md-segmented-font-size);
  font-weight: var(--dex-okd-tabs-md-segmented-font-weight);
  margin-right: var(--dex-okd-tabs-md-segmented-spacing);
  padding: 0 var(--dex-okd-tabs-md-segmented-label-padding)
}

.dex-tabs-pane-md.dex-tabs-pane-segmented-active {
  font-weight: 400;
  font-weight: var(--dex-okd-tabs-md-segmented-active-font-weight, 400)
}

.dex-tabs-pane-md.dex-tabs-pane-segmented.dex-tabs-pane-circle {
  border-radius: calc(var(--dex-okd-tabs-md-segmented-height)/2)
}

.dex-tabs-pane-list-md .dex-tabs-pane-list-nav-icon .icon {
  font-size: var(--dex-okd-tabs-md-common-icon-size)
}

.dex-tabs-pane-list-md.dex-tabs-pane-list-underline {
  font-size: var(--dex-okd-tabs-md-underline-font-size);
  height: var(--dex-okd-tabs-md-underline-height)
}

.dex-tabs-pane-list-md.dex-tabs-pane-list-underline .dex-tabs-pane-list-circle {
  border-radius: calc(var(--dex-okd-tabs-md-underline-height)/2)
}

.dex-tabs-pane-list-md.dex-tabs-pane-list-button {
  font-size: var(--dex-okd-tabs-md-button-font-size);
  height: var(--dex-okd-tabs-md-button-height);
  line-height: var(--dex-okd-tabs-md-button-height)
}

.dex-tabs-pane-list-md.dex-tabs-pane-list-button .dex-tabs-pane-list-container {
  border-radius: 4px;
  border-radius: var(--dex-okd-tabs-md-button-container-border-radius, 4px)
}

.dex-tabs-pane-list-md.dex-tabs-pane-list-button .dex-tabs-pane-list-circle {
  border-radius: calc(var(--dex-okd-tabs-md-button-height)/2)
}

.dex-tabs-pane-list-md.dex-tabs-pane-list-muted {
  font-size: var(--dex-okd-tabs-md-muted-font-size);
  height: var(--dex-okd-tabs-md-muted-height);
  line-height: var(--dex-okd-tabs-md-muted-height)
}

.dex-tabs-pane-list-md.dex-tabs-pane-list-muted .dex-tabs-pane-list-container {
  border-radius: 4px;
  border-radius: var(--dex-okd-tabs-md-muted-container-border-radius, 4px)
}

.dex-tabs-pane-list-md.dex-tabs-pane-list-muted .dex-tabs-pane-list-circle {
  border-radius: calc(var(--dex-okd-tabs-md-muted-height)/2)
}

.dex-tabs-pane-list-md.dex-tabs-pane-list-segmented {
  font-size: var(--dex-okd-tabs-md-segmented-font-size);
  height: var(--dex-okd-tabs-md-segmented-height);
  line-height: var(--dex-okd-tabs-md-segmented-height)
}

.dex-tabs-pane-list-md.dex-tabs-pane-list-segmented .dex-tabs-pane-list-container {
  border-radius: 4px;
  border-radius: var(--dex-okd-tabs-md-segmented-container-border-radius, 4px)
}

.dex-tabs-pane-list-md.dex-tabs-pane-list-segmented .dex-tabs-pane-list-circle {
  border-radius: calc(var(--dex-okd-tabs-md-segmented-height)/2)
}

.dex-tabs-pane-list-md.dex-tabs-pane-list-segmented .dex-tabs-pane-list-flex {
  padding: var(--dex-okd-tabs-md-segmented-container-padding)
}

.dex-tabs-pane-lg:last-child {
  margin-right: 0 !important
}

.dex-tabs-pane-lg.dex-tabs-pane-underline {
  font-size: var(--dex-okd-tabs-lg-underline-font-size);
  font-weight: 400;
  font-weight: var(--dex-okd-tabs-lg-underline-font-weight, 400);
  margin-right: var(--dex-okd-tabs-lg-underline-spacing);
  padding: 0 var(--dex-okd-tabs-lg-underline-label-padding)
}

.dex-tabs-pane-lg.dex-tabs-pane-underline.dex-tabs-pane-circle {
  border-radius: calc(var(--dex-okd-tabs-lg-underline-height)/2)
}

.dex-tabs-pane-lg.dex-tabs-pane-underline-active {
  font-weight: 400;
  font-weight: var(--dex-okd-tabs-lg-underline-active-font-weight, 400)
}

.dex-tabs-pane-lg.dex-tabs-pane-button {
  border-radius: 4px;
  border-radius: var(--dex-okd-tabs-lg-button-border-radius, 4px);
  font-size: var(--dex-okd-tabs-lg-button-font-size);
  font-weight: var(--dex-okd-tabs-lg-button-font-weight);
  margin-right: var(--dex-okd-tabs-lg-button-spacing);
  padding: 0 var(--dex-okd-tabs-lg-button-label-padding)
}

.dex-tabs-pane-lg.dex-tabs-pane-button.dex-tabs-pane-circle {
  border-radius: calc(var(--dex-okd-tabs-lg-button-height)/2)
}

.dex-tabs-pane-lg.dex-tabs-pane-button-active {
  font-weight: 400;
  font-weight: var(--dex-okd-tabs-lg-button-active-font-weight, 400)
}

.dex-tabs-pane-lg.dex-tabs-pane-muted {
  border-radius: 4px;
  border-radius: var(--dex-okd-tabs-lg-muted-border-radius, 4px);
  font-size: var(--dex-okd-tabs-lg-muted-font-size);
  font-weight: var(--dex-okd-tabs-lg-muted-font-weight);
  margin-right: var(--dex-okd-tabs-lg-muted-spacing);
  padding: 0 var(--dex-okd-tabs-lg-muted-label-padding)
}

.dex-tabs-pane-lg.dex-tabs-pane-muted.dex-tabs-pane-circle {
  border-radius: calc(var(--dex-okd-tabs-lg-muted-height)/2)
}

.dex-tabs-pane-lg.dex-tabs-pane-muted-active {
  font-weight: 400;
  font-weight: var(--dex-okd-tabs-lg-muted-active-font-weight, 400)
}

.dex-tabs-pane-lg.dex-tabs-pane-segmented {
  border-radius: 4px;
  border-radius: var(--dex-okd-tabs-lg-segmented-border-radius, 4px);
  font-size: var(--dex-okd-tabs-lg-segmented-font-size);
  font-weight: var(--dex-okd-tabs-lg-segmented-font-weight);
  margin-right: var(--dex-okd-tabs-lg-segmented-spacing);
  padding: 0 var(--dex-okd-tabs-lg-segmented-label-padding)
}

.dex-tabs-pane-lg.dex-tabs-pane-segmented-active {
  font-weight: 400;
  font-weight: var(--dex-okd-tabs-lg-segmented-active-font-weight, 400)
}

.dex-tabs-pane-lg.dex-tabs-pane-segmented.dex-tabs-pane-circle {
  border-radius: calc(var(--dex-okd-tabs-lg-segmented-height)/2)
}

.dex-tabs-pane-list-lg .dex-tabs-pane-list-nav-icon .icon {
  font-size: var(--dex-okd-tabs-lg-common-icon-size)
}

.dex-tabs-pane-list-lg.dex-tabs-pane-list-underline {
  font-size: var(--dex-okd-tabs-lg-underline-font-size);
  height: var(--dex-okd-tabs-lg-underline-height)
}

.dex-tabs-pane-list-lg.dex-tabs-pane-list-underline .dex-tabs-pane-list-circle {
  border-radius: calc(var(--dex-okd-tabs-lg-underline-height)/2)
}

.dex-tabs-pane-list-lg.dex-tabs-pane-list-button {
  font-size: var(--dex-okd-tabs-lg-button-font-size);
  height: var(--dex-okd-tabs-lg-button-height);
  line-height: var(--dex-okd-tabs-lg-button-height)
}

.dex-tabs-pane-list-lg.dex-tabs-pane-list-button .dex-tabs-pane-list-container {
  border-radius: 4px;
  border-radius: var(--dex-okd-tabs-lg-button-container-border-radius, 4px)
}

.dex-tabs-pane-list-lg.dex-tabs-pane-list-button .dex-tabs-pane-list-circle {
  border-radius: calc(var(--dex-okd-tabs-lg-button-height)/2)
}

.dex-tabs-pane-list-lg.dex-tabs-pane-list-muted {
  font-size: var(--dex-okd-tabs-lg-muted-font-size);
  height: var(--dex-okd-tabs-lg-muted-height);
  line-height: var(--dex-okd-tabs-lg-muted-height)
}

.dex-tabs-pane-list-lg.dex-tabs-pane-list-muted .dex-tabs-pane-list-container {
  border-radius: 4px;
  border-radius: var(--dex-okd-tabs-lg-muted-container-border-radius, 4px)
}

.dex-tabs-pane-list-lg.dex-tabs-pane-list-muted .dex-tabs-pane-list-circle {
  border-radius: calc(var(--dex-okd-tabs-lg-muted-height)/2)
}

.dex-tabs-pane-list-lg.dex-tabs-pane-list-segmented {
  font-size: var(--dex-okd-tabs-lg-segmented-font-size);
  height: var(--dex-okd-tabs-lg-segmented-height);
  line-height: var(--dex-okd-tabs-lg-segmented-height)
}

.dex-tabs-pane-list-lg.dex-tabs-pane-list-segmented .dex-tabs-pane-list-container {
  border-radius: 4px;
  border-radius: var(--dex-okd-tabs-lg-segmented-container-border-radius, 4px)
}

.dex-tabs-pane-list-lg.dex-tabs-pane-list-segmented .dex-tabs-pane-list-circle {
  border-radius: calc(var(--dex-okd-tabs-lg-segmented-height)/2)
}

.dex-tabs-pane-list-lg.dex-tabs-pane-list-segmented .dex-tabs-pane-list-flex {
  padding: var(--dex-okd-tabs-lg-segmented-container-padding)
}

.dex-tabs-pane-xl:last-child {
  margin-right: 0 !important
}

.dex-tabs-pane-xl.dex-tabs-pane-underline {
  font-size: var(--dex-okd-tabs-xl-underline-font-size);
  font-weight: 400;
  font-weight: var(--dex-okd-tabs-xl-underline-font-weight, 400);
  margin-right: var(--dex-okd-tabs-xl-underline-spacing);
  padding: 0 var(--dex-okd-tabs-xl-underline-label-padding)
}

.dex-tabs-pane-xl.dex-tabs-pane-underline.dex-tabs-pane-circle {
  border-radius: calc(var(--dex-okd-tabs-xl-underline-height)/2)
}

.dex-tabs-pane-xl.dex-tabs-pane-underline-active {
  font-weight: 400;
  font-weight: var(--dex-okd-tabs-xl-underline-active-font-weight, 400)
}

.dex-tabs-pane-xl.dex-tabs-pane-button {
  border-radius: 4px;
  border-radius: var(--dex-okd-tabs-xl-button-border-radius, 4px);
  font-size: var(--dex-okd-tabs-xl-button-font-size);
  font-weight: var(--dex-okd-tabs-xl-button-font-weight);
  margin-right: var(--dex-okd-tabs-xl-button-spacing);
  padding: 0 var(--dex-okd-tabs-xl-button-label-padding)
}

.dex-tabs-pane-xl.dex-tabs-pane-button.dex-tabs-pane-circle {
  border-radius: calc(var(--dex-okd-tabs-xl-button-height)/2)
}

.dex-tabs-pane-xl.dex-tabs-pane-button-active {
  font-weight: 400;
  font-weight: var(--dex-okd-tabs-xl-button-active-font-weight, 400)
}

.dex-tabs-pane-xl.dex-tabs-pane-muted {
  border-radius: 4px;
  border-radius: var(--dex-okd-tabs-xl-muted-border-radius, 4px);
  font-size: var(--dex-okd-tabs-xl-muted-font-size);
  font-weight: var(--dex-okd-tabs-xl-muted-font-weight);
  margin-right: var(--dex-okd-tabs-xl-muted-spacing);
  padding: 0 var(--dex-okd-tabs-xl-muted-label-padding)
}

.dex-tabs-pane-xl.dex-tabs-pane-muted.dex-tabs-pane-circle {
  border-radius: calc(var(--dex-okd-tabs-xl-muted-height)/2)
}

.dex-tabs-pane-xl.dex-tabs-pane-muted-active {
  font-weight: 400;
  font-weight: var(--dex-okd-tabs-xl-muted-active-font-weight, 400)
}

.dex-tabs-pane-xl.dex-tabs-pane-segmented {
  border-radius: 4px;
  border-radius: var(--dex-okd-tabs-xl-segmented-border-radius, 4px);
  font-size: var(--dex-okd-tabs-xl-segmented-font-size);
  font-weight: var(--dex-okd-tabs-xl-segmented-font-weight);
  margin-right: var(--dex-okd-tabs-xl-segmented-spacing);
  padding: 0 var(--dex-okd-tabs-xl-segmented-label-padding)
}

.dex-tabs-pane-xl.dex-tabs-pane-segmented-active {
  font-weight: 400;
  font-weight: var(--dex-okd-tabs-xl-segmented-active-font-weight, 400)
}

.dex-tabs-pane-xl.dex-tabs-pane-segmented.dex-tabs-pane-circle {
  border-radius: calc(var(--dex-okd-tabs-xl-segmented-height)/2)
}

.dex-tabs-pane-list-xl .dex-tabs-pane-list-nav-icon .icon {
  font-size: var(--dex-okd-tabs-xl-common-icon-size)
}

.dex-tabs-pane-list-xl.dex-tabs-pane-list-underline {
  font-size: var(--dex-okd-tabs-xl-underline-font-size);
  height: var(--dex-okd-tabs-xl-underline-height)
}

.dex-tabs-pane-list-xl.dex-tabs-pane-list-underline .dex-tabs-pane-list-circle {
  border-radius: calc(var(--dex-okd-tabs-xl-underline-height)/2)
}

.dex-tabs-pane-list-xl.dex-tabs-pane-list-button {
  font-size: var(--dex-okd-tabs-xl-button-font-size);
  height: var(--dex-okd-tabs-xl-button-height);
  line-height: var(--dex-okd-tabs-xl-button-height)
}

.dex-tabs-pane-list-xl.dex-tabs-pane-list-button .dex-tabs-pane-list-container {
  border-radius: 4px;
  border-radius: var(--dex-okd-tabs-xl-button-container-border-radius, 4px)
}

.dex-tabs-pane-list-xl.dex-tabs-pane-list-button .dex-tabs-pane-list-circle {
  border-radius: calc(var(--dex-okd-tabs-xl-button-height)/2)
}

.dex-tabs-pane-list-xl.dex-tabs-pane-list-muted {
  font-size: var(--dex-okd-tabs-xl-muted-font-size);
  height: var(--dex-okd-tabs-xl-muted-height);
  line-height: var(--dex-okd-tabs-xl-muted-height)
}

.dex-tabs-pane-list-xl.dex-tabs-pane-list-muted .dex-tabs-pane-list-container {
  border-radius: 4px;
  border-radius: var(--dex-okd-tabs-xl-muted-container-border-radius, 4px)
}

.dex-tabs-pane-list-xl.dex-tabs-pane-list-muted .dex-tabs-pane-list-circle {
  border-radius: calc(var(--dex-okd-tabs-xl-muted-height)/2)
}

.dex-tabs-pane-list-xl.dex-tabs-pane-list-segmented {
  font-size: var(--dex-okd-tabs-xl-segmented-font-size);
  height: var(--dex-okd-tabs-xl-segmented-height);
  line-height: var(--dex-okd-tabs-xl-segmented-height)
}

.dex-tabs-pane-list-xl.dex-tabs-pane-list-segmented .dex-tabs-pane-list-container {
  border-radius: 4px;
  border-radius: var(--dex-okd-tabs-xl-segmented-container-border-radius, 4px)
}

.dex-tabs-pane-list-xl.dex-tabs-pane-list-segmented .dex-tabs-pane-list-circle {
  border-radius: calc(var(--dex-okd-tabs-xl-segmented-height)/2)
}

.dex-tabs-pane-list-xl.dex-tabs-pane-list-segmented .dex-tabs-pane-list-flex {
  padding: var(--dex-okd-tabs-xl-segmented-container-padding)
}

.dex-tabs-pane-xxl:last-child {
  margin-right: 0 !important
}

.dex-tabs-pane-xxl.dex-tabs-pane-underline {
  font-size: var(--dex-okd-tabs-xxl-underline-font-size);
  font-weight: 400;
  font-weight: var(--dex-okd-tabs-xxl-underline-font-weight, 400);
  margin-right: var(--dex-okd-tabs-xxl-underline-spacing);
  padding: 0 var(--dex-okd-tabs-xxl-underline-label-padding)
}

.dex-tabs-pane-xxl.dex-tabs-pane-underline.dex-tabs-pane-circle {
  border-radius: calc(var(--dex-okd-tabs-xxl-underline-height)/2)
}

.dex-tabs-pane-xxl.dex-tabs-pane-underline-active {
  font-weight: 400;
  font-weight: var(--dex-okd-tabs-xxl-underline-active-font-weight, 400)
}

.dex-tabs-pane-xxl.dex-tabs-pane-button {
  border-radius: 4px;
  border-radius: var(--dex-okd-tabs-xxl-button-border-radius, 4px);
  font-size: var(--dex-okd-tabs-xxl-button-font-size);
  font-weight: var(--dex-okd-tabs-xxl-button-font-weight);
  margin-right: var(--dex-okd-tabs-xxl-button-spacing);
  padding: 0 var(--dex-okd-tabs-xxl-button-label-padding)
}

.dex-tabs-pane-xxl.dex-tabs-pane-button.dex-tabs-pane-circle {
  border-radius: calc(var(--dex-okd-tabs-xxl-button-height)/2)
}

.dex-tabs-pane-xxl.dex-tabs-pane-button-active {
  font-weight: 400;
  font-weight: var(--dex-okd-tabs-xxl-button-active-font-weight, 400)
}

.dex-tabs-pane-xxl.dex-tabs-pane-muted {
  border-radius: 4px;
  border-radius: var(--dex-okd-tabs-xxl-muted-border-radius, 4px);
  font-size: var(--dex-okd-tabs-xxl-muted-font-size);
  font-weight: var(--dex-okd-tabs-xxl-muted-font-weight);
  margin-right: var(--dex-okd-tabs-xxl-muted-spacing);
  padding: 0 var(--dex-okd-tabs-xxl-muted-label-padding)
}

.dex-tabs-pane-xxl.dex-tabs-pane-muted.dex-tabs-pane-circle {
  border-radius: calc(var(--dex-okd-tabs-xxl-muted-height)/2)
}

.dex-tabs-pane-xxl.dex-tabs-pane-muted-active {
  font-weight: 400;
  font-weight: var(--dex-okd-tabs-xxl-muted-active-font-weight, 400)
}

.dex-tabs-pane-xxl.dex-tabs-pane-segmented {
  border-radius: 4px;
  border-radius: var(--dex-okd-tabs-xxl-segmented-border-radius, 4px);
  font-size: var(--dex-okd-tabs-xxl-segmented-font-size);
  font-weight: var(--dex-okd-tabs-xxl-segmented-font-weight);
  margin-right: var(--dex-okd-tabs-xxl-segmented-spacing);
  padding: 0 var(--dex-okd-tabs-xxl-segmented-label-padding)
}

.dex-tabs-pane-xxl.dex-tabs-pane-segmented-active {
  font-weight: 400;
  font-weight: var(--dex-okd-tabs-xxl-segmented-active-font-weight, 400)
}

.dex-tabs-pane-xxl.dex-tabs-pane-segmented.dex-tabs-pane-circle {
  border-radius: calc(var(--dex-okd-tabs-xxl-segmented-height)/2)
}

.dex-tabs-pane-list-xxl .dex-tabs-pane-list-nav-icon .icon {
  font-size: var(--dex-okd-tabs-xxl-common-icon-size)
}

.dex-tabs-pane-list-xxl.dex-tabs-pane-list-underline {
  font-size: var(--dex-okd-tabs-xxl-underline-font-size);
  height: var(--dex-okd-tabs-xxl-underline-height)
}

.dex-tabs-pane-list-xxl.dex-tabs-pane-list-underline .dex-tabs-pane-list-circle {
  border-radius: calc(var(--dex-okd-tabs-xxl-underline-height)/2)
}

.dex-tabs-pane-list-xxl.dex-tabs-pane-list-button {
  font-size: var(--dex-okd-tabs-xxl-button-font-size);
  height: var(--dex-okd-tabs-xxl-button-height);
  line-height: var(--dex-okd-tabs-xxl-button-height)
}

.dex-tabs-pane-list-xxl.dex-tabs-pane-list-button .dex-tabs-pane-list-container {
  border-radius: 4px;
  border-radius: var(--dex-okd-tabs-xxl-button-container-border-radius, 4px)
}

.dex-tabs-pane-list-xxl.dex-tabs-pane-list-button .dex-tabs-pane-list-circle {
  border-radius: calc(var(--dex-okd-tabs-xxl-button-height)/2)
}

.dex-tabs-pane-list-xxl.dex-tabs-pane-list-muted {
  font-size: var(--dex-okd-tabs-xxl-muted-font-size);
  height: var(--dex-okd-tabs-xxl-muted-height);
  line-height: var(--dex-okd-tabs-xxl-muted-height)
}

.dex-tabs-pane-list-xxl.dex-tabs-pane-list-muted .dex-tabs-pane-list-container {
  border-radius: 4px;
  border-radius: var(--dex-okd-tabs-xxl-muted-container-border-radius, 4px)
}

.dex-tabs-pane-list-xxl.dex-tabs-pane-list-muted .dex-tabs-pane-list-circle {
  border-radius: calc(var(--dex-okd-tabs-xxl-muted-height)/2)
}

.dex-tabs-pane-list-xxl.dex-tabs-pane-list-segmented {
  font-size: var(--dex-okd-tabs-xxl-segmented-font-size);
  height: var(--dex-okd-tabs-xxl-segmented-height);
  line-height: var(--dex-okd-tabs-xxl-segmented-height)
}

.dex-tabs-pane-list-xxl.dex-tabs-pane-list-segmented .dex-tabs-pane-list-container {
  border-radius: 4px;
  border-radius: var(--dex-okd-tabs-xxl-segmented-container-border-radius, 4px)
}

.dex-tabs-pane-list-xxl.dex-tabs-pane-list-segmented .dex-tabs-pane-list-circle {
  border-radius: calc(var(--dex-okd-tabs-xxl-segmented-height)/2)
}

.dex-tabs-pane-list-xxl.dex-tabs-pane-list-segmented .dex-tabs-pane-list-flex {
  padding: var(--dex-okd-tabs-xxl-segmented-container-padding)
}

.dex-tabs-pane-xxxl:last-child {
  margin-right: 0 !important
}

.dex-tabs-pane-xxxl.dex-tabs-pane-underline {
  font-size: var(--dex-okd-tabs-xxxl-underline-font-size);
  font-weight: 400;
  font-weight: var(--dex-okd-tabs-xxxl-underline-font-weight, 400);
  margin-right: var(--dex-okd-tabs-xxxl-underline-spacing);
  padding: 0 var(--dex-okd-tabs-xxxl-underline-label-padding)
}

.dex-tabs-pane-xxxl.dex-tabs-pane-underline.dex-tabs-pane-circle {
  border-radius: calc(var(--dex-okd-tabs-xxxl-underline-height)/2)
}

.dex-tabs-pane-xxxl.dex-tabs-pane-underline-active {
  font-weight: 400;
  font-weight: var(--dex-okd-tabs-xxxl-underline-active-font-weight, 400)
}

.dex-tabs-pane-xxxl.dex-tabs-pane-button {
  border-radius: 4px;
  border-radius: var(--dex-okd-tabs-xxxl-button-border-radius, 4px);
  font-size: var(--dex-okd-tabs-xxxl-button-font-size);
  font-weight: var(--dex-okd-tabs-xxxl-button-font-weight);
  margin-right: var(--dex-okd-tabs-xxxl-button-spacing);
  padding: 0 var(--dex-okd-tabs-xxxl-button-label-padding)
}

.dex-tabs-pane-xxxl.dex-tabs-pane-button.dex-tabs-pane-circle {
  border-radius: calc(var(--dex-okd-tabs-xxxl-button-height)/2)
}

.dex-tabs-pane-xxxl.dex-tabs-pane-button-active {
  font-weight: 400;
  font-weight: var(--dex-okd-tabs-xxxl-button-active-font-weight, 400)
}

.dex-tabs-pane-xxxl.dex-tabs-pane-muted {
  border-radius: 4px;
  border-radius: var(--dex-okd-tabs-xxxl-muted-border-radius, 4px);
  font-size: var(--dex-okd-tabs-xxxl-muted-font-size);
  font-weight: var(--dex-okd-tabs-xxxl-muted-font-weight);
  margin-right: var(--dex-okd-tabs-xxxl-muted-spacing);
  padding: 0 var(--dex-okd-tabs-xxxl-muted-label-padding)
}

.dex-tabs-pane-xxxl.dex-tabs-pane-muted.dex-tabs-pane-circle {
  border-radius: calc(var(--dex-okd-tabs-xxxl-muted-height)/2)
}

.dex-tabs-pane-xxxl.dex-tabs-pane-muted-active {
  font-weight: 400;
  font-weight: var(--dex-okd-tabs-xxxl-muted-active-font-weight, 400)
}

.dex-tabs-pane-xxxl.dex-tabs-pane-segmented {
  border-radius: 4px;
  border-radius: var(--dex-okd-tabs-xxxl-segmented-border-radius, 4px);
  font-size: var(--dex-okd-tabs-xxxl-segmented-font-size);
  font-weight: var(--dex-okd-tabs-xxxl-segmented-font-weight);
  margin-right: var(--dex-okd-tabs-xxxl-segmented-spacing);
  padding: 0 var(--dex-okd-tabs-xxxl-segmented-label-padding)
}

.dex-tabs-pane-xxxl.dex-tabs-pane-segmented-active {
  font-weight: 400;
  font-weight: var(--dex-okd-tabs-xxxl-segmented-active-font-weight, 400)
}

.dex-tabs-pane-xxxl.dex-tabs-pane-segmented.dex-tabs-pane-circle {
  border-radius: calc(var(--dex-okd-tabs-xxxl-segmented-height)/2)
}

.dex-tabs-pane-list-xxxl .dex-tabs-pane-list-nav-icon .icon {
  font-size: var(--dex-okd-tabs-xxxl-common-icon-size)
}

.dex-tabs-pane-list-xxxl.dex-tabs-pane-list-underline {
  font-size: var(--dex-okd-tabs-xxxl-underline-font-size);
  height: var(--dex-okd-tabs-xxxl-underline-height)
}

.dex-tabs-pane-list-xxxl.dex-tabs-pane-list-underline .dex-tabs-pane-list-circle {
  border-radius: calc(var(--dex-okd-tabs-xxxl-underline-height)/2)
}

.dex-tabs-pane-list-xxxl.dex-tabs-pane-list-button {
  font-size: var(--dex-okd-tabs-xxxl-button-font-size);
  height: var(--dex-okd-tabs-xxxl-button-height);
  line-height: var(--dex-okd-tabs-xxxl-button-height)
}

.dex-tabs-pane-list-xxxl.dex-tabs-pane-list-button .dex-tabs-pane-list-container {
  border-radius: 4px;
  border-radius: var(--dex-okd-tabs-xxxl-button-container-border-radius, 4px)
}

.dex-tabs-pane-list-xxxl.dex-tabs-pane-list-button .dex-tabs-pane-list-circle {
  border-radius: calc(var(--dex-okd-tabs-xxxl-button-height)/2)
}

.dex-tabs-pane-list-xxxl.dex-tabs-pane-list-muted {
  font-size: var(--dex-okd-tabs-xxxl-muted-font-size);
  height: var(--dex-okd-tabs-xxxl-muted-height);
  line-height: var(--dex-okd-tabs-xxxl-muted-height)
}

.dex-tabs-pane-list-xxxl.dex-tabs-pane-list-muted .dex-tabs-pane-list-container {
  border-radius: 4px;
  border-radius: var(--dex-okd-tabs-xxxl-muted-container-border-radius, 4px)
}

.dex-tabs-pane-list-xxxl.dex-tabs-pane-list-muted .dex-tabs-pane-list-circle {
  border-radius: calc(var(--dex-okd-tabs-xxxl-muted-height)/2)
}

.dex-tabs-pane-list-xxxl.dex-tabs-pane-list-segmented {
  font-size: var(--dex-okd-tabs-xxxl-segmented-font-size);
  height: var(--dex-okd-tabs-xxxl-segmented-height);
  line-height: var(--dex-okd-tabs-xxxl-segmented-height)
}

.dex-tabs-pane-list-xxxl.dex-tabs-pane-list-segmented .dex-tabs-pane-list-container {
  border-radius: 4px;
  border-radius: var(--dex-okd-tabs-xxxl-segmented-container-border-radius, 4px)
}

.dex-tabs-pane-list-xxxl.dex-tabs-pane-list-segmented .dex-tabs-pane-list-circle {
  border-radius: calc(var(--dex-okd-tabs-xxxl-segmented-height)/2)
}

.dex-tabs-pane-list-xxxl.dex-tabs-pane-list-segmented .dex-tabs-pane-list-flex {
  padding: var(--dex-okd-tabs-xxxl-segmented-container-padding)
}

.dex-tabs-pane.dex-tabs-pane-blue-no-border.dex-tabs-pane-underline-active {
  border-bottom-color: transparent
}

.dex-tabs-pane-blue.dex-tabs-pane-underline {
  color: var(--dex-okd-tabs-underline-pane-common-label-color)
}

.dex-tabs-pane-blue.dex-tabs-pane-underline:focus-visible {
  outline: 2px solid var(--dex-okd-color-border-focus);
  outline-color: var(--dex-okd-color-border-focus);
  outline-offset: -2px;
  outline-style: solid;
  outline-width: 2px
}

.dex-tabs-pane-blue.dex-tabs-pane-underline-active {
  border-bottom-color: var(--dex-okd-tabs-underline-pane-blue-border-active-color)
}

.dex-tabs-pane-blue.dex-tabs-pane-underline-active,
.dex-tabs-pane-blue.dex-tabs-pane-underline:hover:not(.is-mobile) {
  color: var(--dex-okd-tabs-underline-pane-blue-label-active-color)
}

.dex-tabs-pane-blue.dex-tabs-pane-button {
  color: var(--dex-okd-tabs-button-pane-common-label-color)
}

.dex-tabs-pane-blue.dex-tabs-pane-button-active {
  background-color: var(--dex-okd-tabs-button-pane-blue-bg-active-color);
  border-color: transparent;
  color: var(--dex-okd-tabs-button-pane-blue-label-active-color)
}

.dex-tabs-pane-blue.dex-tabs-pane-button:hover:not(.is-mobile) {
  border-color: var(--dex-okd-tabs-button-pane-blue-bg-active-color)
}

.dex-tabs-pane-blue.dex-tabs-pane-muted {
  color: var(--dex-okd-tabs-muted-pane-common-label-color)
}

.dex-tabs-pane-blue.dex-tabs-pane-muted-active {
  border-color: var(--dex-okd-tabs-muted-pane-blue-border-active-color)
}

.dex-tabs-pane-blue.dex-tabs-pane-muted-active,
.dex-tabs-pane-blue.dex-tabs-pane-muted:hover:not(.is-mobile) {
  color: var(--dex-okd-tabs-muted-pane-blue-label-active-color)
}

.dex-tabs-pane-blue.dex-tabs-pane-segmented {
  color: var(--dex-okd-tabs-segmented-pane-common-label-color)
}

.dex-tabs-pane-blue.dex-tabs-pane-segmented-active {
  background-color: var(--dex-okd-tabs-segmented-pane-blue-bg-active-color);
  color: var(--dex-okd-tabs-segmented-pane-blue-label-active-color)
}

.dex-tabs-pane-blue.dex-tabs-pane-segmented-active:focus-visible {
  outline: 2px solid var(--dex-okd-color-border-focus);
  outline-color: var(--dex-okd-tabs-segmented-pane-blue-label-active-color);
  outline-offset: -4px;
  outline-style: solid;
  outline-width: 2px
}

.dex-tabs-pane-list-blue .dex-tabs-transitions-underline {
  background-color: var(--dex-okd-tabs-underline-pane-blue-border-active-color)
}

.dex-tabs-pane.dex-tabs-pane-grey-no-border.dex-tabs-pane-underline-active {
  border-bottom-color: transparent
}

.dex-tabs-pane-grey.dex-tabs-pane-underline {
  color: var(--dex-okd-tabs-underline-pane-common-label-color)
}

.dex-tabs-pane-grey.dex-tabs-pane-underline:focus-visible {
  outline: 2px solid var(--dex-okd-color-border-focus);
  outline-color: var(--dex-okd-color-border-focus);
  outline-offset: -2px;
  outline-style: solid;
  outline-width: 2px
}

.dex-tabs-pane-grey.dex-tabs-pane-underline-active {
  border-bottom-color: var(--dex-okd-tabs-underline-pane-grey-border-active-color)
}

.dex-tabs-pane-grey.dex-tabs-pane-underline-active,
.dex-tabs-pane-grey.dex-tabs-pane-underline:hover:not(.is-mobile) {
  color: var(--dex-okd-tabs-underline-pane-grey-label-active-color)
}

.dex-tabs-pane-grey.dex-tabs-pane-button {
  color: var(--dex-okd-tabs-button-pane-common-label-color)
}

.dex-tabs-pane-grey.dex-tabs-pane-button-active {
  background-color: var(--dex-okd-tabs-button-pane-grey-bg-active-color);
  border-color: transparent;
  color: var(--dex-okd-tabs-button-pane-grey-label-active-color)
}

.dex-tabs-pane-grey.dex-tabs-pane-button:hover:not(.is-mobile) {
  border-color: var(--dex-okd-tabs-button-pane-grey-bg-active-color)
}

.dex-tabs-pane-grey.dex-tabs-pane-muted {
  color: var(--dex-okd-tabs-muted-pane-common-label-color)
}

.dex-tabs-pane-grey.dex-tabs-pane-muted-active {
  border-color: var(--dex-okd-tabs-muted-pane-grey-border-active-color)
}

.dex-tabs-pane-grey.dex-tabs-pane-muted-active,
.dex-tabs-pane-grey.dex-tabs-pane-muted:hover:not(.is-mobile) {
  color: var(--dex-okd-tabs-muted-pane-grey-label-active-color)
}

.dex-tabs-pane-grey.dex-tabs-pane-segmented {
  color: var(--dex-okd-tabs-segmented-pane-common-label-color)
}

.dex-tabs-pane-grey.dex-tabs-pane-segmented-active {
  background-color: var(--dex-okd-tabs-segmented-pane-grey-bg-active-color);
  color: var(--dex-okd-tabs-segmented-pane-grey-label-active-color)
}

.dex-tabs-pane-grey.dex-tabs-pane-segmented-active:focus-visible {
  outline: 2px solid var(--dex-okd-color-border-focus);
  outline-color: var(--dex-okd-tabs-segmented-pane-grey-label-active-color);
  outline-offset: -4px;
  outline-style: solid;
  outline-width: 2px
}

.dex-tabs-pane-list-grey .dex-tabs-transitions-underline {
  background-color: var(--dex-okd-tabs-underline-pane-grey-border-active-color)
}

.dex-tabs-pane.dex-tabs-pane-green-no-border.dex-tabs-pane-underline-active {
  border-bottom-color: transparent
}

.dex-tabs-pane-green.dex-tabs-pane-underline {
  color: var(--dex-okd-tabs-underline-pane-common-label-color)
}

.dex-tabs-pane-green.dex-tabs-pane-underline:focus-visible {
  outline: 2px solid var(--dex-okd-color-border-focus);
  outline-color: var(--dex-okd-color-border-focus);
  outline-offset: -2px;
  outline-style: solid;
  outline-width: 2px
}

.dex-tabs-pane-green.dex-tabs-pane-underline-active {
  border-bottom-color: var(--dex-okd-tabs-underline-pane-green-border-active-color)
}

.dex-tabs-pane-green.dex-tabs-pane-underline-active,
.dex-tabs-pane-green.dex-tabs-pane-underline:hover:not(.is-mobile) {
  color: var(--dex-okd-tabs-underline-pane-green-label-active-color)
}

.dex-tabs-pane-green.dex-tabs-pane-button {
  color: var(--dex-okd-tabs-button-pane-common-label-color)
}

.dex-tabs-pane-green.dex-tabs-pane-button-active {
  background-color: var(--dex-okd-tabs-button-pane-green-bg-active-color);
  border-color: transparent;
  color: var(--dex-okd-tabs-button-pane-green-label-active-color)
}

.dex-tabs-pane-green.dex-tabs-pane-button:hover:not(.is-mobile) {
  border-color: var(--dex-okd-tabs-button-pane-green-bg-active-color)
}

.dex-tabs-pane-green.dex-tabs-pane-muted {
  color: var(--dex-okd-tabs-muted-pane-common-label-color)
}

.dex-tabs-pane-green.dex-tabs-pane-muted-active {
  border-color: var(--dex-okd-tabs-muted-pane-green-border-active-color)
}

.dex-tabs-pane-green.dex-tabs-pane-muted-active,
.dex-tabs-pane-green.dex-tabs-pane-muted:hover:not(.is-mobile) {
  color: var(--dex-okd-tabs-muted-pane-green-label-active-color)
}

.dex-tabs-pane-green.dex-tabs-pane-segmented {
  color: var(--dex-okd-tabs-segmented-pane-common-label-color)
}

.dex-tabs-pane-green.dex-tabs-pane-segmented-active {
  background-color: var(--dex-okd-tabs-segmented-pane-green-bg-active-color);
  color: var(--dex-okd-tabs-segmented-pane-green-label-active-color)
}

.dex-tabs-pane-green.dex-tabs-pane-segmented-active:focus-visible {
  outline: 2px solid var(--dex-okd-color-border-focus);
  outline-color: var(--dex-okd-tabs-segmented-pane-green-label-active-color);
  outline-offset: -4px;
  outline-style: solid;
  outline-width: 2px
}

.dex-tabs-pane-list-green .dex-tabs-transitions-underline {
  background-color: var(--dex-okd-tabs-underline-pane-green-border-active-color)
}

.dex-tabs-pane.dex-tabs-pane-red-no-border.dex-tabs-pane-underline-active {
  border-bottom-color: transparent
}

.dex-tabs-pane-red.dex-tabs-pane-underline {
  color: var(--dex-okd-tabs-underline-pane-common-label-color)
}

.dex-tabs-pane-red.dex-tabs-pane-underline:focus-visible {
  outline: 2px solid var(--dex-okd-color-border-focus);
  outline-color: var(--dex-okd-color-border-focus);
  outline-offset: -2px;
  outline-style: solid;
  outline-width: 2px
}

.dex-tabs-pane-red.dex-tabs-pane-underline-active {
  border-bottom-color: var(--dex-okd-tabs-underline-pane-red-border-active-color)
}

.dex-tabs-pane-red.dex-tabs-pane-underline-active,
.dex-tabs-pane-red.dex-tabs-pane-underline:hover:not(.is-mobile) {
  color: var(--dex-okd-tabs-underline-pane-red-label-active-color)
}

.dex-tabs-pane-red.dex-tabs-pane-button {
  color: var(--dex-okd-tabs-button-pane-common-label-color)
}

.dex-tabs-pane-red.dex-tabs-pane-button-active {
  background-color: var(--dex-okd-tabs-button-pane-red-bg-active-color);
  border-color: transparent;
  color: var(--dex-okd-tabs-button-pane-red-label-active-color)
}

.dex-tabs-pane-red.dex-tabs-pane-button:hover:not(.is-mobile) {
  border-color: var(--dex-okd-tabs-button-pane-red-bg-active-color)
}

.dex-tabs-pane-red.dex-tabs-pane-muted {
  color: var(--dex-okd-tabs-muted-pane-common-label-color)
}

.dex-tabs-pane-red.dex-tabs-pane-muted-active {
  border-color: var(--dex-okd-tabs-muted-pane-red-border-active-color)
}

.dex-tabs-pane-red.dex-tabs-pane-muted-active,
.dex-tabs-pane-red.dex-tabs-pane-muted:hover:not(.is-mobile) {
  color: var(--dex-okd-tabs-muted-pane-red-label-active-color)
}

.dex-tabs-pane-red.dex-tabs-pane-segmented {
  color: var(--dex-okd-tabs-segmented-pane-common-label-color)
}

.dex-tabs-pane-red.dex-tabs-pane-segmented-active {
  background-color: var(--dex-okd-tabs-segmented-pane-red-bg-active-color);
  color: var(--dex-okd-tabs-segmented-pane-red-label-active-color)
}

.dex-tabs-pane-red.dex-tabs-pane-segmented-active:focus-visible {
  outline: 2px solid var(--dex-okd-color-border-focus);
  outline-color: var(--dex-okd-tabs-segmented-pane-red-label-active-color);
  outline-offset: -4px;
  outline-style: solid;
  outline-width: 2px
}

.dex-tabs-pane-list-red .dex-tabs-transitions-underline {
  background-color: var(--dex-okd-tabs-underline-pane-red-border-active-color)
}

.dex-tabs-pane {
  align-items: center;
  box-sizing: border-box;
  color: var(--dex-okd-tabs-common-pane-label-color);
  cursor: pointer;
  display: flex;
  font-weight: 500;
  height: 100%;
  justify-content: center;
  text-align: center;
  white-space: nowrap
}

.dex-tabs-pane:focus-visible {
  outline: 2px solid var(--dex-okd-color-border-focus);
  outline-color: var(--dex-okd-color-border-focus);
  outline-offset: -4px;
  outline-style: solid;
  outline-width: 2px
}

.dex-tabs-pane-underline {
  border-bottom: 2px solid transparent;
  padding-top: 2px
}

.dex-tabs-pane.no-active-border {
  border-bottom: none;
  padding-top: 0
}

.dex-tabs-pane-button {
  border: 1px solid var(--dex-okd-tabs-button-pane-common-border-color);
  border-radius: var(--dex-okd-tabs-button-pane-common-border-radius)
}

.dex-tabs-pane-button.dex-tabs-pane-button-no-border {
  border: none
}

.dex-tabs-pane-muted {
  border: 1px solid var(--dex-okd-tabs-muted-pane-common-border-color);
  border-radius: var(--dex-okd-tabs-muted-pane-common-border-radius)
}

.dex-tabs-pane-segmented {
  border-radius: var(--dex-okd-tabs-segmented-pane-common-border-radius);
  line-height: 1
}

.dex-tabs-pane-segmented-active {
  box-shadow: var(--dex-okd-tabs-segmented-pane-common-shadow)
}

.dex-tabs-pane-no-padding {
  padding: 0 !important
}

.dex-tabs .dex-tabs-pane.dex-tabs-pane-spacing {
  margin-right: var(--dex-okd-inner-tabs-spacing)
}

a.dex-tabs-pane {
  text-decoration: none
}

.dex-tabs-panel {
  display: none;
  width: 100%
}

.dex-tabs-panel:focus-visible {
  outline: 2px solid var(--dex-okd-color-border-focus);
  outline-color: var(--dex-okd-color-border-focus);
  outline-offset: -2px;
  outline-style: solid;
  outline-width: 1px
}

.dex-tabs-panel-show {
  display: block
}

.dex-tabs-pane-list {
  box-sizing: border-box;
  display: flex;
  flex-shrink: 0;
  position: relative;
  width: 100%
}

.dex-tabs-pane-list-wrapper {
  display: flex;
  flex: 1 1;
  overflow: hidden;
  position: relative
}

.dex-tabs-pane-list-center {
  justify-content: center
}

.dex-tabs-pane-list-slot {
  height: 100%
}

.dex-tabs-pane-list-container {
  box-sizing: border-box;
  display: flex;
  overflow: scroll;
  position: relative;
  scroll-behavior: smooth;
  scrollbar-width: none
}

.dex-tabs-pane-list-container::-webkit-scrollbar {
  display: none;
  height: 0;
  width: 0
}

.dex-tabs-pane-list-nav {
  --dex-okd-inner-tabs-nav-button-bg-color: var(--dex-okd-tabs-common-pane-nav-icon-bg-color-1);
  cursor: pointer
}

.dex-tabs-pane-list-nav-icon {
  align-items: center;
  background-image: linear-gradient(270deg, var(--dex-okd-inner-tabs-nav-button-bg-color) 72.22%, var(--dex-okd-tabs-common-pane-nav-icon-bg-color-2) 100%);
  color: var(--dex-okd-tabs-common-pane-icon-color);
  display: flex;
  height: 100%;
  justify-content: center;
  position: absolute;
  top: 0;
  width: 36px;
  z-index: 9
}

.dex-tabs-pane-list-nav-icon:hover {
  color: var(--dex-okd-tabs-common-pane-icon-active-color)
}

.dex-tabs-pane-list-nav .icon-left {
  background-image: linear-gradient(-270deg, var(--dex-okd-inner-tabs-nav-button-bg-color) 72.22%, var(--dex-okd-tabs-common-pane-nav-icon-bg-color-2) 100%);
  left: 0
}

.dex-tabs-pane-list-nav .icon-left-inner {
  transform: rotate(180deg)
}

.dex-tabs-pane-list-nav .icon-right {
  right: 0
}

.dex-tabs-pane-list-flex-shrink {
  display: flex;
  flex-shrink: 0;
  position: relative;
  transition: transform .2s
}

.dex-tabs-pane-list-flex {
  flex: 1 1
}

.dex-tabs-pane-list-overflow {
  overflow: unset
}

.dex-tabs-pane-list-average,
.dex-tabs-pane-list-average .dex-tabs-pane {
  flex: 1 1
}

.dex-tabs-pane-list-right-alpha {
  background-image: linear-gradient(90deg, hsla(0, 0%, 100%, 0) 0, var(--dex-okd-tabs-common-pane-icon-bg-color) 100%);
  height: 100%;
  pointer-events: none;
  position: absolute;
  right: 0;
  top: 0;
  width: 20px;
  z-index: 9
}

.dex-tabs-pane-list-underline {
  border-bottom: 1px solid var(--dex-okd-tabs-underline-pane-common-border-color)
}

.dex-tabs-pane-list-underline-no-line {
  border-bottom: none
}

.dex-tabs-pane-list-segmented .dex-tabs-pane-list-container {
  background-color: var(--dex-okd-tabs-segmented-pane-common-list-bg-color);
  border-radius: 4px
}

.dex-tabs-panel-list {
  display: flex;
  flex: auto;
  width: 100%
}

.dex-tabs {
  display: flex;
  flex-direction: column;
  height: 100%;
  width: 100%
}

.dex-tabs-transitions-underline {
  bottom: 0;
  height: 2px;
  left: 0;
  position: absolute;
  transition: all .3s
}

.dex-tag-fill-grey {
  background-color: var(--dex-okd-tag-fill-grey-background-color);
  border-color: var(--dex-okd-tag-fill-grey-border-color);
  color: var(--dex-okd-tag-fill-grey-font-color)
}

.dex-tag-fill-lightgrey {
  background-color: hsla(0, 0%, 100%, 0);
  background-color: var(--dex-okd-tag-fill-lightgrey-background-color, hsla(0, 0%, 100%, 0));
  border-color: hsla(0, 0%, 100%, 0);
  border-color: var(--dex-okd-tag-fill-lightgrey-border-color, hsla(0, 0%, 100%, 0));
  color: hsla(0, 0%, 100%, 0);
  color: var(--dex-okd-tag-fill-lightgrey-font-color, hsla(0, 0%, 100%, 0))
}

.dex-tag-fill-tangerine {
  background-color: hsla(0, 0%, 100%, 0);
  background-color: var(--dex-okd-tag-fill-tangerine-background-color, hsla(0, 0%, 100%, 0));
  border-color: hsla(0, 0%, 100%, 0);
  border-color: var(--dex-okd-tag-fill-tangerine-border-color, hsla(0, 0%, 100%, 0));
  color: hsla(0, 0%, 100%, 0);
  color: var(--dex-okd-tag-fill-tangerine-font-color, hsla(0, 0%, 100%, 0))
}

.dex-tag-fill-lime {
  background-color: var(--dex-okd-tag-fill-lime-background-color);
  border-color: var(--dex-okd-tag-fill-lime-border-color);
  color: var(--dex-okd-tag-fill-lime-font-color)
}

.dex-tag-outline-grey {
  background-color: var(--dex-okd-tag-outline-grey-background-color);
  border-color: var(--dex-okd-tag-outline-grey-border-color);
  color: var(--dex-okd-tag-outline-grey-font-color)
}

.dex-tag-outline-lightgrey {
  background-color: var(--dex-okd-tag-outline-lightgrey-background-color);
  border-color: var(--dex-okd-tag-outline-lightgrey-border-color);
  color: var(--dex-okd-tag-outline-lightgrey-font-color)
}

.dex-tag-outline-green {
  background-color: var(--dex-okd-tag-outline-green-background-color);
  border-color: var(--dex-okd-tag-outline-green-border-color);
  color: var(--dex-okd-tag-outline-green-font-color)
}

.dex-tag-outline-red {
  background-color: var(--dex-okd-tag-outline-red-background-color);
  border-color: var(--dex-okd-tag-outline-red-border-color);
  color: var(--dex-okd-tag-outline-red-font-color)
}

.dex-tag-outline-tangerine {
  background-color: var(--dex-okd-tag-outline-tangerine-background-color);
  border-color: var(--dex-okd-tag-outline-tangerine-border-color);
  color: var(--dex-okd-tag-outline-tangerine-font-color)
}

.dex-tag-outline-lime {
  background-color: hsla(0, 0%, 100%, 0);
  background-color: var(--dex-okd-tag-outline-lime-background-color, hsla(0, 0%, 100%, 0));
  border-color: hsla(0, 0%, 100%, 0);
  border-color: var(--dex-okd-tag-outline-lime-border-color, hsla(0, 0%, 100%, 0));
  color: hsla(0, 0%, 100%, 0);
  color: var(--dex-okd-tag-outline-lime-font-color, hsla(0, 0%, 100%, 0))
}

.dex-tag.dex-tag-fill-lime {
  font-weight: 700
}

.dex-tag-fill-green {
  background-color: var(--dex-okd-tag-fill-green-background-color);
  border-color: var(--dex-okd-tag-fill-green-border-color);
  color: var(--dex-okd-tag-fill-green-font-color)
}

.dex-tag-sm {
  --dex-okd-tag-inner-height: var(--dex-okd-tag-sm-height, 16px);
  border-radius: 4px;
  border-radius: var(--dex-okd-tag-sm-border-radius, 4px);
  border-width: 1px;
  border-width: var(--dex-okd-tag-sm-border-width, 1px);
  font-size: 12px;
  font-size: var(--dex-okd-tag-sm-font-size, 12px);
  font-weight: 400;
  font-weight: var(--dex-okd-tag-sm-font-weight, 400);
  line-height: 16px;
  line-height: var(--dex-okd-tag-sm-line-height, 16px);
  padding: 2px 4px;
  padding: var(--dex-okd-tag-sm-padding-vertical, 2px) var(--dex-okd-tag-sm-padding-horizontal, 4px)
}

.dex-tag-sm .dex-tag-icon {
  font-size: 12px;
  font-size: var(--dex-okd-tag-sm-icon-size, 12px)
}

.dex-tag-md {
  --dex-okd-tag-inner-height: var(--dex-okd-tag-md-height, 20px);
  border-radius: 4px;
  border-radius: var(--dex-okd-tag-md-border-radius, 4px);
  border-width: 1px;
  border-width: var(--dex-okd-tag-md-border-width, 1px);
  font-size: 12px;
  font-size: var(--dex-okd-tag-md-font-size, 12px);
  font-weight: 400;
  font-weight: var(--dex-okd-tag-md-font-weight, 400);
  line-height: 16px;
  line-height: var(--dex-okd-tag-md-line-height, 16px);
  padding: 2px 4px;
  padding: var(--dex-okd-tag-md-padding-vertical, 2px) var(--dex-okd-tag-md-padding-horizontal, 4px)
}

.dex-tag-md .dex-tag-icon {
  font-size: 16px;
  font-size: var(--dex-okd-tag-md-icon-size, 16px)
}

.dex-tag-lg {
  --dex-okd-tag-inner-height: var(--dex-okd-tag-lg-height, 24px);
  border-radius: 4px;
  border-radius: var(--dex-okd-tag-lg-border-radius, 4px);
  border-width: 1px;
  border-width: var(--dex-okd-tag-lg-border-width, 1px);
  font-size: 12px;
  font-size: var(--dex-okd-tag-lg-font-size, 12px);
  font-weight: 400;
  font-weight: var(--dex-okd-tag-lg-font-weight, 400);
  line-height: 16px;
  line-height: var(--dex-okd-tag-lg-line-height, 16px);
  padding: 2px 4px;
  padding: var(--dex-okd-tag-lg-padding-vertical, 2px) var(--dex-okd-tag-lg-padding-horizontal, 4px)
}

.dex-tag-lg .dex-tag-icon {
  font-size: 16px;
  font-size: var(--dex-okd-tag-lg-icon-size, 16px)
}

.dex-tag-fixed-height {
  height: var(--dex-okd-tag-inner-height);
  padding-bottom: 0;
  padding-top: 0
}

.dex-tag {
  align-items: center;
  border-style: solid;
  box-sizing: border-box;
  display: inline-flex
}

.dex-tag-ellipsis {
  max-width: 200px;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap
}

.dex-tag-icon {
  padding-right: 2px
}

.dex-tag-fill-red {
  background-color: var(--dex-okd-tag-fill-red-background-color);
  border-color: var(--dex-okd-tag-fill-red-border-color);
  color: var(--dex-okd-tag-fill-red-font-color)
}

.dex-textbutton {
  align-items: center;
  box-sizing: border-box;
  color: var(--dex-okd-color-content-primary);
  color: var(--dex-okd-textbutton-default-color, var(--dex-okd-color-content-primary));
  cursor: pointer;
  display: inline-flex;
  justify-content: center;
  text-decoration: none
}

.dex-textbutton-leading-icon {
  font-weight: 400;
  margin-right: 4px;
  margin-right: var(--dex-okd-textbutton-leading-icon-margin-right, 4px)
}

.dex-textbutton-trailing-icon {
  font-weight: 400;
  margin-left: 4px;
  margin-left: var(--dex-okd-textbutton-trailing-icon-margin-left, 4px)
}

.dex-textbutton-padding {
  border-radius: 50px;
  border-radius: var(--dex-okd-textbutton-border-radius, 50px)
}

.dex-textbutton-sm {
  font-size: 12px;
  font-size: var(--dex-okd-textbutton-sm-font-size, 12px);
  line-height: 16px;
  line-height: var(--dex-okd-textbutton-sm-line-height, 16px)
}

.dex-textbutton-padding.dex-textbutton-sm {
  min-height: 32px;
  min-height: var(--dex-okd-textbutton-sm-min-height, 32px);
  min-width: 40px;
  min-width: var(--dex-okd-textbutton-sm-min-width, 40px);
  padding: 8px 12px;
  padding: var(--dex-okd-textbutton-sm-padding-vertical, 8px) var(--dex-okd-textbutton-sm-padding-horizontal, 12px)
}

.dex-textbutton .dex-textbutton-icon-sm {
  font-size: 16px;
  font-size: var(--dex-okd-textbutton-icon-sm-font-size, 16px)
}

.dex-textbutton-md {
  font-size: 14px;
  font-size: var(--dex-okd-textbutton-md-font-size, 14px);
  line-height: 16px;
  line-height: var(--dex-okd-textbutton-md-line-height, 16px)
}

.dex-textbutton-padding.dex-textbutton-md {
  min-height: 36px;
  min-height: var(--dex-okd-textbutton-md-min-height, 36px);
  min-width: 48px;
  min-width: var(--dex-okd-textbutton-md-min-width, 48px);
  padding: 8px 12px;
  padding: var(--dex-okd-textbutton-md-padding-vertical, 8px) var(--dex-okd-textbutton-md-padding-horizontal, 12px)
}

.dex-textbutton .dex-textbutton-icon-md {
  font-size: 16px;
  font-size: var(--dex-okd-textbutton-icon-md-font-size, 16px)
}

.dex-textbutton-lg {
  font-size: 16px;
  font-size: var(--dex-okd-textbutton-lg-font-size, 16px);
  line-height: 20px;
  line-height: var(--dex-okd-textbutton-lg-line-height, 20px)
}

.dex-textbutton-padding.dex-textbutton-lg {
  min-height: 40px;
  min-height: var(--dex-okd-textbutton-lg-min-height, 40px);
  min-width: 56px;
  min-width: var(--dex-okd-textbutton-lg-min-width, 56px);
  padding: 8px 16px;
  padding: var(--dex-okd-textbutton-lg-padding-vertical, 8px) var(--dex-okd-textbutton-lg-padding-horizontal, 16px)
}

.dex-textbutton .dex-textbutton-icon-lg {
  font-size: 18px;
  font-size: var(--dex-okd-textbutton-icon-lg-font-size, 18px)
}

.dex-textbutton-regular {
  font-weight: 400;
  font-weight: var(--dex-okd-textbutton-regular-font-weight, 400)
}

.dex-textbutton-medium {
  font-weight: 500;
  font-weight: var(--dex-okd-textbutton-medium-font-weight, 500)
}

.dex-textbutton-bold {
  font-weight: 700;
  font-weight: var(--dex-okd-textbutton-bold-font-weight, 700)
}

.dex-textbutton.hover,
.dex-textbutton:not(.dex-textbutton-disabled):hover {
  color: var(--dex-okd-color-content-primary);
  color: var(--dex-okd-textbutton-hover-color, var(--dex-okd-color-content-primary))
}

.dex-textbutton.hover.dex-textbutton-padding,
.dex-textbutton:not(.dex-textbutton-disabled):hover.dex-textbutton-padding {
  background-color: var(--dex-okd-color-background-surface-pressed);
  background-color: var(--dex-okd-textbutton-hover-background, var(--dex-okd-color-background-surface-pressed))
}

.dex-textbutton.active,
.dex-textbutton:not(.dex-textbutton-disabled):active {
  color: var(--dex-okd-color-content-primary);
  color: var(--dex-okd-textbutton-active-color, var(--dex-okd-color-content-primary))
}

.dex-textbutton.active.dex-textbutton-padding,
.dex-textbutton:not(.dex-textbutton-disabled):active.dex-textbutton-padding {
  background-color: var(--dex-okd-color-background-surface-pressed);
  background-color: var(--dex-okd-textbutton-active-background, var(--dex-okd-color-background-surface-pressed))
}

.dex-textbutton-disabled,
.dex-textbutton.disabled {
  color: var(--dex-okd-color-content-disabled);
  color: var(--dex-okd-textbutton-disabled-color, var(--dex-okd-color-content-disabled));
  cursor: not-allowed
}

.dex-typo-h1 {
  font-size: var(--dex-okd-typography-h1-font-size);
  line-height: var(--dex-okd-typography-h1-line-height)
}

.dex-typo-h2 {
  font-size: var(--dex-okd-typography-h2-font-size);
  line-height: var(--dex-okd-typography-h2-line-height)
}

.dex-typo-h3 {
  font-size: var(--dex-okd-typography-h3-font-size);
  line-height: var(--dex-okd-typography-h3-line-height)
}

.dex-typo-h4 {
  font-size: var(--dex-okd-typography-h4-font-size);
  line-height: var(--dex-okd-typography-h4-line-height)
}

.dex-typo-h5 {
  font-size: var(--dex-okd-typography-h5-font-size);
  line-height: var(--dex-okd-typography-h5-line-height)
}

.dex-typo-h6 {
  font-size: var(--dex-okd-typography-h6-font-size);
  line-height: var(--dex-okd-typography-h6-line-height)
}

.dex-typo-text-base {
  font-size: var(--dex-okd-typography-text-base-font-size);
  line-height: var(--dex-okd-typography-text-base-line-height)
}

.dex-typo-text-md {
  font-size: var(--dex-okd-typography-text-md-font-size);
  line-height: var(--dex-okd-typography-text-md-line-height)
}

.dex-typo-text-xs {
  font-size: var(--dex-okd-typography-text-xs-font-size);
  line-height: var(--dex-okd-typography-text-xs-line-height)
}

.header-weight-medium {
  font-weight: var(--dex-okd-typography-header-medium-font-weight)
}

.header-weight-amplified {
  font-weight: var(--dex-okd-typography-header-amplified-font-weight)
}

.text-weight-medium {
  font-weight: var(--dex-okd-typography-text-medium-font-weight)
}

.text-weight-amplified {
  font-weight: var(--dex-okd-typography-text-amplified-font-weight)
}

.header-color-muted {
  color: var(--dex-okd-typography-header-muted-color)
}

.header-color-medium {
  color: var(--dex-okd-typography-header-medium-color)
}

.header-color-amplified {
  color: var(--dex-okd-typography-header-amplified-color)
}

.text-color-muted {
  color: var(--dex-okd-typography-text-muted-color)
}

.text-color-medium {
  color: var(--dex-okd-typography-text-medium-color)
}

.text-color-amplified {
  color: var(--dex-okd-typography-text-amplified-color)
}

.dex-tooltip .dex-popup-layer-content {
  word-wrap: break-word;
  border-radius: 2px;
  color: var(--dex-okd-tooltip-default-font-color);
  font-size: 12px;
  line-height: 16px;
  max-width: 160px;
  padding: 8px
}

.dex-tooltip .dex-popup-layer-arrow-inner,
.dex-tooltip .dex-popup-layer-content {
  background-color: var(--dex-okd-tooltip-neutral-background)
}

.dex-tooltip-negative .dex-popup-layer-arrow-inner,
.dex-tooltip-negative .dex-popup-layer-content {
  background-color: var(--dex-okd-tooltip-negative-background)
}

.dex-tooltip-positive .dex-popup-layer-arrow-inner,
.dex-tooltip-positive .dex-popup-layer-content {
  background-color: var(--dex-okd-tooltip-positive-background)
}

.dex-tooltip-informative .dex-popup-layer-arrow-inner,
.dex-tooltip-informative .dex-popup-layer-content {
  background-color: var(--dex-okd-tooltip-informative-background)
}

.dex-dropzone-patch-dialog {
  padding-top: 0
}

.dex-dropzone-patch-dialog-top {
  height: 0
}

.dex-dropzone-patch-preview {
  display: block;
  margin: 0 auto;
  max-height: 80vh;
  max-width: 70vw
}

.dex-transition-fade {
  transition: opacity .3s linear
}

.dex-transition-fade-active {
  will-change: opacity
}

.dex-transition-fade-ease-out {
  transition-timing-function: cubic-bezier(.5, 0, .52, 1)
}

.dex-transition-fade-entered,
.dex-transition-fade-entering {
  opacity: 1
}

.dex-transition-fade-exited,
.dex-transition-fade-exiting {
  opacity: 0
}

.dex-transition-slide {
  -webkit-backface-visibility: hidden;
  backface-visibility: hidden;
  perspective: 1000px;
  position: fixed;
  transform: translateY(100%);
  transform-style: preserve-3d;
  transition: transform .3s linear, opacity .3s linear
}

.dex-transition-slide-active {
  will-change: transform, opacity
}

.dex-transition-slide-cubic {
  transition-timing-function: ease
}

.dex-transition-slide-top {
  left: 0;
  top: 0;
  width: 100%
}

.dex-transition-slide-bottom {
  bottom: 0;
  left: 0;
  width: 100%
}

.dex-transition-slide-left {
  height: 100%;
  left: 0;
  top: 0
}

.dex-transition-slide-right {
  height: 100%;
  right: 0;
  top: 0
}

.dex-transition-slide-entered,
.dex-transition-slide-entering {
  opacity: 1;
  transform: none
}

.dex-transition-slide-exited,
.dex-transition-slide-exiting {
  opacity: 0
}

.dex-transition-slide-exited.dex-transition-slide-top,
.dex-transition-slide-exiting.dex-transition-slide-top {
  transform: translateY(-100%)
}

.dex-transition-slide-exited.dex-transition-slide-bottom,
.dex-transition-slide-exiting.dex-transition-slide-bottom {
  transform: translateY(100%)
}

.dex-transition-slide-exited.dex-transition-slide-left,
.dex-transition-slide-exiting.dex-transition-slide-left {
  transform: translateX(-100%)
}

.dex-transition-slide-exited.dex-transition-slide-right,
.dex-transition-slide-exiting.dex-transition-slide-right {
  transform: translateX(100%)
}

@media (hover:none) and (pointer:coarse) {
  .dex-transition-slide {
    transition-duration: .2s
  }
}

.dex-dropzone-preview-dialog {
  padding-top: 0
}

.dex-dropzone:hover .dex-dropzone-preview-mask {
  background: rgba(0, 0, 0, .4);
  opacity: 1
}

.dex-dropzone:focus-within .preview-focus {
  background: rgba(0, 0, 0, .4);
  opacity: 1
}

.dex-dropzone-status-box {
  align-items: center;
  display: flex;
  flex-direction: column;
  width: 100%
}

.dex-dropzone-text-btn {
  color: var(--dex-okd-upload-text-btn-color);
  text-decoration: underline
}

.dex-dropzone-logo {
  color: #dbdbdb;
  color: var(--dex-okd-upload-default-logo-color, #dbdbdb)
}

.dex-dropzone-icon-url {
  margin-bottom: 12px;
  width: 64px
}

.dex-dropzone-loader {
  margin-bottom: 12px
}

.dex-dropzone-preview {
  align-items: center;
  box-sizing: border-box;
  cursor: auto;
  display: flex;
  justify-content: center;
  padding: 8px
}

.dex-dropzone-preview,
.dex-dropzone-preview-img {
  height: 100%;
  width: 100%
}

.dex-dropzone-preview-mask {
  bottom: 8px;
  left: 8px;
  opacity: 0;
  position: absolute;
  right: 8px;
  text-align: center;
  top: 8px;
  transition: all .3s;
  visibility: visible
}

.dex-dropzone-preview-icon {
  display: flex;
  left: 50%;
  position: absolute;
  top: 50%;
  transform: translate(-50%, -50%)
}

.dex-dropzone-preview-mask .icon-box+.icon-box {
  margin-left: 40px
}

.dex-dropzone-preview-mask .icon-box {
  color: #fff;
  color: var(--dex-okd-upload-default-icon-color, #fff);
  cursor: pointer;
  font-size: 30px
}

.dex-dropzone-title {
  color: #929292;
  color: var(--dex-okd-upload-default-label-color, #929292);
  font-size: var(--dex-okd-upload-pc-label-font-size);
  font-weight: 500;
  line-height: var(--dex-okd-upload-pc-label-line-height);
  margin-bottom: 8px;
  padding: 0 10px;
  text-align: center
}

.dex-dropzone-label {
  padding-left: 8px
}

.dex-dropzone-desc {
  box-sizing: border-box;
  color: #929292;
  color: var(--dex-okd-upload-default-desc-color, #929292);
  font-size: var(--dex-okd-upload-pc-desc-font-size);
  font-weight: 400;
  line-height: var(--dex-okd-upload-pc-desc-line-height);
  max-width: 100%;
  overflow: hidden;
  padding: 0 1em;
  text-align: center;
  text-overflow: ellipsis;
  white-space: break-spaces
}

.dex-dropzone-active .dex-dropzone-area {
  background-color: var(--dex-okd-upload-active-background-color);
  border-color: var(--dex-okd-upload-active-border-color)
}

.dex-dropzone-active .dex-dropzone-title {
  color: var(--dex-okd-upload-active-label-color)
}

.dex-dropzone-active .dex-dropzone-desc {
  display: none
}

.dex-dropzone-area .dex-dropzone-logo {
  font-size: 48px
}

.dex-dropzone-active .dex-dropzone-logo {
  color: var(--dex-okd-upload-active-logo-color)
}

.dex-dropzone-error .dex-dropzone-area {
  background-color: var(--dex-okd-upload-error-background-color);
  border-color: var(--dex-okd-upload-error-border-color)
}

.dex-dropzone-error .dex-dropzone-title {
  color: var(--dex-okd-upload-error-label-color)
}

.dex-dropzone-error .dex-dropzone-logo {
  color: var(--dex-okd-upload-error-logo-color)
}

.dex-dropzone-error .dex-dropzone-retry {
  color: var(--dex-okd-upload-error-retry-text-color);
  cursor: pointer
}

.dex-dropzone-success .dex-dropzone-area {
  border-color: var(--dex-okd-upload-success-border-color);
  border-style: solid
}

.dex-dropzone-success .dex-dropzone-logo {
  color: var(--dex-okd-upload-success-logo-color)
}

.dex-dropzone-uploading .dex-dropzone-area {
  border-style: solid
}

.dex-dropzone-disabled {
  cursor: not-allowed
}

.dex-dropzone-disabled .dex-dropzone-logo {
  color: var(--dex-okd-upload-default-logo-color);
  color: var(--dex-okd-upload-disabled-logo-color, var(--dex-okd-upload-default-logo-color))
}

.dex-dropzone-disabled .dex-dropzone-title {
  color: var(--dex-okd-upload-default-label-color);
  color: var(--dex-okd-upload-disabled-label-color, var(--dex-okd-upload-default-label-color))
}

.dex-dropzone-disabled .dex-dropzone-desc {
  color: var(--dex-okd-upload-default-desc-color);
  color: var(--dex-okd-upload-disabled-desc-color, var(--dex-okd-upload-default-desc-color))
}

.dex-dropzone-disabled .dex-dropzone-area {
  background-color: #f9f9f9;
  background-color: var(--dex-okd-upload-disabled-background, #f9f9f9);
  border-color: #ced3de;
  border-color: var(--dex-okd-upload-disabled-border-color, #ced3de);
  border-style: solid
}

@media (max-width:767px) {
  .dex-dropzone-title {
    align-items: center;
    display: flex;
    flex-direction: column;
    font-size: var(--dex-okd-upload-mobile-label-font-size);
    line-height: var(--dex-okd-upload-mobile-label-line-height);
    margin-bottom: 0
  }

  .dex-dropzone-title .dex-dropzone-label {
    display: none
  }

  .dex-dropzone-desc {
    font-size: var(--dex-okd-upload-mobile-desc-font-size);
    line-height: var(--dex-okd-upload-mobile-desc-line-height);
    white-space: nowrap
  }

  .dex-dropzone-area .dex-dropzone-logo {
    font-size: 32px
  }

  .dex-dropzone-logo.dex-dropzone-logo-xl {
    display: none
  }

  .dex-dropzone-logo.dex-dropzone-logo-md {
    display: unset
  }
}

.dex-dropzone-preview-picture {
  display: block;
  margin: 0 auto;
  max-height: 80vh;
  max-width: 70vw
}

.dex-dropzone-preview-picture-sm {
  height: 100%;
  object-fit: contain;
  width: 100%
}

.dex-dropzone {
  cursor: pointer;
  display: inline-flex;
  flex-direction: column;
  width: 100%
}

.dex-dropzone-focus {
  border-radius: 4px;
  outline: 2px solid var(--dex-okd-color-border-focus);
  outline-color: var(--dex-okd-color-border-focus);
  outline-offset: 2px;
  outline-style: solid;
  outline-width: 2px
}

.dex-dropzone-contents {
  display: contents
}

.dex-dropzone-area {
  align-items: center;
  background-color: initial;
  background-color: var(--dex-okd-upload-default-background-color, transparent);
  border: 2px dashed #dbdbdb;
  border: 2px dashed var(--dex-okd-upload-default-border-color, #dbdbdb);
  border-radius: 4px;
  box-sizing: border-box;
  display: flex;
  flex-direction: column;
  flex-shrink: 0;
  height: 100%;
  justify-content: center;
  position: relative;
  transition: all .3s;
  width: 100%
}

.dex-dropzone-status-area {
  display: contents
}

.dex-dropzone-input-file {
  display: block
}

.dex-dropzone-patch-mobile {
  display: flex;
  flex-wrap: wrap;
  margin-right: -8px
}

.dex-dropzone-patch-mobile-entry {
  height: 100px;
  margin-right: 8px;
  width: 100px
}

.dex-dropzone-patch-mobile-entry .dex-dropzone-patch-mobile-entry-icon {
  font-size: 32px
}

.dex-dropzone-patch-mobile-entry-disabled {
  cursor: not-allowed
}

.dex-dropzone-patch-mobile-block {
  align-items: center;
  background: #f9f9f9;
  background: var(--dex-okd-upload-patch-item-background, #f9f9f9);
  border: 1px solid #ebebeb;
  border: 1px solid var(--dex-okd-upload-patch-item-mobile-default-border-color, #ebebeb);
  border-radius: 4px;
  box-sizing: border-box;
  color: #929292;
  color: var(--dex-okd-upload-patch-item-desc-color, #929292);
  display: flex;
  flex-direction: column;
  font-size: 12px;
  height: 100px;
  justify-content: center;
  margin-bottom: 8px;
  margin-right: 8px;
  padding: 4px;
  position: relative;
  width: 100px
}

.dex-dropzone-patch-mobile-uploading {
  border-color: #ebebeb;
  border-color: var(--dex-okd-upload-patch-item-mobile-active-border-color, #ebebeb)
}

.dex-dropzone-patch-mobile-success {
  border-color: #ebebeb;
  border-color: var(--dex-okd-upload-patch-item-mobile-success-border-color, #ebebeb)
}

.dex-dropzone-patch-mobile-error {
  border-color: #ebebeb;
  border-color: var(--dex-okd-upload-patch-item-mobile-error-border-color, #ebebeb)
}

.dex-dropzone-patch-mobile-img {
  cursor: pointer;
  height: 100%;
  left: 0;
  top: 0;
  width: 100%
}

.dex-dropzone-patch-mobile-img .placeholder-icon {
  color: #dbdbdb;
  color: var(--dex-okd-upload-patch-item-placeholder-icon-color, #dbdbdb);
  font-size: 36px
}

.dex-dropzone-patch-mobile-content {
  display: flex;
  flex-direction: column
}

.dex-dropzone-patch-mobile-gap {
  margin-bottom: 4px
}

.dex-dropzone-patch-mobile-loader {
  height: 16px;
  width: 16px
}

.dex-dropzone-patch-mobile .dex-dropzone-patch-mobile-icon-success {
  color: #05c28c;
  color: var(--dex-okd-upload-patch-item-success-icon-color, #05c28c);
  font-size: 24px
}

.dex-dropzone-patch-mobile .dex-dropzone-patch-mobile-icon-error {
  color: #e3493f;
  color: var(--dex-okd-upload-patch-item-error-icon-color, #e3493f);
  font-size: 24px
}

.dex-dropzone-patch-mobile-retry {
  color: #0569ff;
  color: var(--dex-okd-upload-patch-item-retry-text-color, #0569ff);
  cursor: pointer;
  font-size: 12px;
  font-weight: 500;
  line-height: 16px
}

.dex-dropzone-patch-mobile .dex-dropzone-patch-mobile-remove {
  color: #000;
  color: var(--dex-okd-upload-patch-item-mobile-remove-icon-color, #000);
  cursor: pointer;
  font-size: 16px;
  position: absolute;
  right: 0;
  top: 0;
  transform: translate(50%, -50%)
}

.dex-dropzone-patch-item {
  align-items: center;
  background: #f9f9f9;
  background: var(--dex-okd-upload-patch-item-background, #f9f9f9);
  border-radius: 4px;
  display: flex;
  justify-content: space-between;
  list-style: none;
  margin-top: 8px;
  padding: 8px
}

.dex-dropzone-patch-item-block {
  display: flex
}

.dex-dropzone-patch-item-img {
  cursor: pointer;
  height: 36px;
  margin-right: 12px;
  width: 36px
}

.dex-dropzone-patch-item-img .placeholder-icon {
  color: #dbdbdb;
  color: var(--dex-okd-upload-patch-item-placeholder-icon-color, #dbdbdb);
  font-size: 36px
}

.dex-dropzone-patch-item-content {
  display: flex;
  flex-direction: column
}

.dex-dropzone-patch-item-title {
  color: #3d3d3d;
  color: var(--dex-okd-upload-patch-item-title-color, #3d3d3d);
  font-size: 14px;
  line-height: 16px
}

.dex-dropzone-patch-item-desc {
  align-items: center;
  color: #929292;
  color: var(--dex-okd-upload-patch-item-desc-color, #929292);
  display: flex;
  font-size: 12px;
  margin-top: 4px
}

.dex-dropzone-patch-item-gap {
  margin-right: 4px
}

.dex-dropzone-patch-item-loader {
  height: 16px;
  width: 16px
}

.dex-dropzone-patch-item-icon-success {
  color: #05c28c;
  color: var(--dex-okd-upload-patch-item-success-icon-color, #05c28c);
  font-size: 12px
}

.dex-dropzone-patch-item-icon-error {
  color: #e3493f;
  color: var(--dex-okd-upload-patch-item-error-icon-color, #e3493f);
  font-size: 12px
}

.dex-dropzone-patch-item-error-text {
  color: #e3493f;
  color: var(--dex-okd-upload-patch-item-error-text-color, #e3493f)
}

.dex-dropzone-patch-item-retry {
  color: #0569ff;
  color: var(--dex-okd-upload-patch-item-retry-text-color, #0569ff);
  cursor: pointer;
  font-size: 12px;
  font-weight: 500;
  line-height: 16px
}

.dex-dropzone-patch-item .remove-icon {
  color: #bdbdbd;
  color: var(--dex-okd-upload-patch-item-remove-icon-color, #bdbdbd);
  cursor: pointer;
  font-size: 20px
}

.dex-dropzone-patch-item-dot {
  background-color: #929292;
  background-color: var(--dex-okd-upload-patch-item-desc-color, #929292);
  border-radius: 50%;
  height: 3px;
  margin: 0 6px;
  width: 3px
}

.dex-dropzone-patch {
  width: 100%
}

.dex-dropzone-patch-file-number {
  color: #000;
  color: var(--dex-okd-upload-patch-tip-color, #000);
  margin-top: 12px
}

.dex-dropzone-patch-entry {
  width: 100%
}

.dex-dropzone-patch-entry .dex-dropzone-patch-entry-icon {
  font-size: 48px
}

.dex-dropzone-patch-entry-disabled {
  cursor: not-allowed
}

@media (max-width:767px) {
  .dex-dropzone-patch-file-number {
    display: none
  }
}

.dex-dropzone-simple-weight.dex-dropzone-simple {
  height: 100px;
  width: 100px
}

.dex-dropzone-simple-weight.dex-dropzone-simple .dex-dropzone-desc,
.dex-dropzone-simple-weight.dex-dropzone-simple .dex-dropzone-title {
  display: none
}

.dex-dropzone-simple-weight.dex-dropzone-simple .dex-dropzone-loader {
  margin-bottom: 0
}

.dex-dropzone-simple-weight.dex-dropzone-simple .dex-dropzone-area .dex-dropzone-logo {
  font-size: 40px
}

.dex-dropzone-simple-weight.dex-dropzone-simple .dex-dropzone-preview-mask .dex-dropzone-icon-delete {
  font-size: 24px
}

.dex-dropzone-simple-weight.dex-dropzone-simple .dex-dropzone-preview-mask .icon-box+.icon-box {
  margin-left: 12px
}

.dex-dropzone-simple-weight.dex-dropzone-simple .dex-dropzone-preview-mask .dex-dropzone-icon-zoomin {
  font-size: 24px
}

.dex-dropzone-simple-weight.dex-dropzone-simple .simple-container {
  width: 100%
}

.dex-dropzone-simple-error {
  color: var(--dex-okd-upload-error-label-color);
  font-size: 12px;
  font-weight: 500;
  line-height: 16px;
  margin-top: 4px;
  max-width: 100px
}

.dex-dropzone-simple-try-again {
  color: var(--dex-okd-upload-error-retry-text-color);
  cursor: pointer;
  font-size: 12px;
  font-weight: 500;
  line-height: 16px;
  margin-left: 4px
}

.dex-virtual-list-empty {
  align-items: center;
  display: flex;
  height: 100%;
  justify-content: center
}

.dex-video-animation-box {
  position: relative
}

.dex-video-animation-pic {
  height: 100%;
  left: 0;
  position: absolute;
  top: 0;
  width: 100%
}

.dex-okds-link {
  --ok-icon-font-family: "dex-ok-b983c4766d"
}

.dex-okds-link:before {
  content: "\e053";
  font-family: dex-ok-b983c4766d
}

.dex-okds-mail {
  --ok-icon-font-family: "dex-ok-b983c4766d"
}

.dex-okds-mail:before {
  content: "\e058";
  font-family: dex-ok-b983c4766d
}

.dex-okds-computer-outline {
  --ok-icon-font-family: "dex-ok-b983c4766d"
}

.dex-okds-computer-outline:before {
  content: "\e0a9";
  font-family: dex-ok-b983c4766d
}

.dex-okds-fire-flame_filled {
  --ok-icon-font-family: "dex-ok-b983c4766d"
}

.dex-okds-fire-flame_filled:before {
  content: "\e0a8";
  font-family: dex-ok-b983c4766d
}

.dex-okds-trash {
  --ok-icon-font-family: "dex-ok-b983c4766d"
}

.dex-okds-trash:before {
  content: "\e089";
  font-family: dex-ok-b983c4766d
}

.dex-okds-locked {
  --ok-icon-font-family: "dex-ok-b983c4766d"
}

.dex-okds-locked:before {
  content: "\e056";
  font-family: dex-ok-b983c4766d
}

.dex-okds-unlocked {
  --ok-icon-font-family: "dex-ok-b983c4766d"
}

.dex-okds-unlocked:before {
  content: "\e08a";
  font-family: dex-ok-b983c4766d
}

.dex-okds-verified-filled {
  --ok-icon-font-family: "dex-ok-b983c4766d"
}

.dex-okds-verified-filled:before {
  content: "\e0a7";
  font-family: dex-ok-b983c4766d
}

.dex-okds-trending-up {
  --ok-icon-font-family: "dex-ok-b983c4766d"
}

.dex-okds-trending-up:before {
  content: "\e0a6";
  font-family: dex-ok-b983c4766d
}

.dex-okds-toggle-units {
  --ok-icon-font-family: "dex-ok-b983c4766d"
}

.dex-okds-toggle-units:before {
  content: "\e0a5";
  font-family: dex-ok-b983c4766d
}

.dex-okds-chevron-right-text-button {
  --ok-icon-font-family: "dex-ok-b983c4766d"
}

.dex-okds-chevron-right-text-button:before {
  content: "\e0a4";
  font-family: dex-ok-b983c4766d
}

.dex-okds-calendar {
  --ok-icon-font-family: "dex-ok-b983c4766d"
}

.dex-okds-calendar:before {
  content: "\e01e";
  font-family: dex-ok-b983c4766d
}

.dex-okds-p2p {
  --ok-icon-font-family: "dex-ok-b983c4766d"
}

.dex-okds-p2p:before {
  content: "\e0a3";
  font-family: dex-ok-b983c4766d
}

.dex-okds-express-buy {
  --ok-icon-font-family: "dex-ok-b983c4766d"
}

.dex-okds-express-buy:before {
  content: "\e0a2";
  font-family: dex-ok-b983c4766d
}

.dex-okds-cash-fiat {
  --ok-icon-font-family: "dex-ok-b983c4766d"
}

.dex-okds-cash-fiat:before {
  content: "\e0a1";
  font-family: dex-ok-b983c4766d
}

.dex-okds-chevron-down {
  --ok-icon-font-family: "dex-ok-b983c4766d"
}

.dex-okds-chevron-down:before {
  content: "\e0a0";
  font-family: dex-ok-b983c4766d
}

.dex-okds-chevron-up {
  --ok-icon-font-family: "dex-ok-b983c4766d"
}

.dex-okds-chevron-up:before {
  content: "\e09f";
  font-family: dex-ok-b983c4766d
}

.dex-okds-xbtc {
  --ok-icon-font-family: "dex-ok-b983c4766d"
}

.dex-okds-xbtc:before {
  content: "\e09e";
  font-family: dex-ok-b983c4766d
}

.dex-okds-selected {
  --ok-icon-font-family: "dex-ok-b983c4766d"
}

.dex-okds-selected:before {
  content: "\e09c";
  font-family: dex-ok-b983c4766d
}

.dex-okds-unselected {
  --ok-icon-font-family: "dex-ok-b983c4766d"
}

.dex-okds-unselected:before {
  content: "\e09d";
  font-family: dex-ok-b983c4766d
}

.dex-okds-checkmark {
  --ok-icon-font-family: "dex-ok-b983c4766d"
}

.dex-okds-checkmark:before {
  content: "\e022";
  font-family: dex-ok-b983c4766d
}

.dex-okds-refresh {
  --ok-icon-font-family: "dex-ok-b983c4766d"
}

.dex-okds-refresh:before {
  content: "\e09b";
  font-family: dex-ok-b983c4766d
}

.dex-okds-draw {
  --ok-icon-font-family: "dex-ok-b983c4766d"
}

.dex-okds-draw:before {
  content: "\e09a";
  font-family: dex-ok-b983c4766d
}

.dex-okds-sun {
  --ok-icon-font-family: "dex-ok-b983c4766d"
}

.dex-okds-sun:before {
  content: "\e099";
  font-family: dex-ok-b983c4766d
}

.dex-okds-moon {
  --ok-icon-font-family: "dex-ok-b983c4766d"
}

.dex-okds-moon:before {
  content: "\e098";
  font-family: dex-ok-b983c4766d
}

.dex-okds-clear {
  --ok-icon-font-family: "dex-ok-b983c4766d"
}

.dex-okds-clear:before {
  content: "\e097";
  font-family: dex-ok-b983c4766d
}

.dex-okds-thumb_up {
  --ok-icon-font-family: "dex-ok-b983c4766d"
}

.dex-okds-thumb_up:before {
  content: "\e096";
  font-family: dex-ok-b983c4766d
}

.dex-okds-thumb_down {
  --ok-icon-font-family: "dex-ok-b983c4766d"
}

.dex-okds-thumb_down:before {
  content: "\e095";
  font-family: dex-ok-b983c4766d
}

.dex-okds-zoom-out {
  --ok-icon-font-family: "dex-ok-b983c4766d"
}

.dex-okds-zoom-out:before {
  content: "\e094";
  font-family: dex-ok-b983c4766d
}

.dex-okds-zoom-in {
  --ok-icon-font-family: "dex-ok-b983c4766d"
}

.dex-okds-zoom-in:before {
  content: "\e093";
  font-family: dex-ok-b983c4766d
}

.dex-okds-information-circle {
  --ok-icon-font-family: "dex-ok-b983c4766d"
}

.dex-okds-information-circle:before {
  content: "\e055";
  font-family: dex-ok-b983c4766d
}

.dex-okds-warning-circle-fill {
  --ok-icon-font-family: "dex-ok-b983c4766d"
}

.dex-okds-warning-circle-fill:before {
  content: "\e07d";
  font-family: dex-ok-b983c4766d
}

.dex-okds-success-circle-fill {
  --ok-icon-font-family: "dex-ok-b983c4766d"
}

.dex-okds-success-circle-fill:before {
  content: "\e084";
  font-family: dex-ok-b983c4766d
}

.dex-okds-information-circle-fill {
  --ok-icon-font-family: "dex-ok-b983c4766d"
}

.dex-okds-information-circle-fill:before {
  content: "\e052";
  font-family: dex-ok-b983c4766d
}

.dex-okds-fail-circle-fill {
  --ok-icon-font-family: "dex-ok-b983c4766d"
}

.dex-okds-fail-circle-fill:before {
  content: "\e02f";
  font-family: dex-ok-b983c4766d
}

.dex-okds-arrow-chevron-right-centered-xs {
  --ok-icon-font-family: "dex-ok-b983c4766d"
}

.dex-okds-arrow-chevron-right-centered-xs:before {
  content: "\e092";
  font-family: dex-ok-b983c4766d
}

.dex-okds-arrow-chevron-right-centered-sm {
  --ok-icon-font-family: "dex-ok-b983c4766d"
}

.dex-okds-arrow-chevron-right-centered-sm:before {
  content: "\e015";
  font-family: dex-ok-b983c4766d
}

.dex-okds-arrow-chevron-right-centered-md {
  --ok-icon-font-family: "dex-ok-b983c4766d"
}

.dex-okds-arrow-chevron-right-centered-md:before {
  content: "\e014";
  font-family: dex-ok-b983c4766d
}

.dex-okds-arrow-pointer-right-xs {
  --ok-icon-font-family: "dex-ok-b983c4766d"
}

.dex-okds-arrow-pointer-right-xs:before {
  content: "\e091";
  font-family: dex-ok-b983c4766d
}

.dex-okds-arrow-pointer-right-sm {
  --ok-icon-font-family: "dex-ok-b983c4766d"
}

.dex-okds-arrow-pointer-right-sm:before {
  content: "\e00e";
  font-family: dex-ok-b983c4766d
}

.dex-okds-arrow-pointer-right-md {
  --ok-icon-font-family: "dex-ok-b983c4766d"
}

.dex-okds-arrow-pointer-right-md:before {
  content: "\e00d";
  font-family: dex-ok-b983c4766d
}

.dex-okds-user {
  --ok-icon-font-family: "dex-ok-b983c4766d"
}

.dex-okds-user:before {
  content: "\e07b";
  font-family: dex-ok-b983c4766d
}

.dex-okds-plus-circle-filled {
  --ok-icon-font-family: "dex-ok-b983c4766d"
}

.dex-okds-plus-circle-filled:before {
  content: "\e065";
  font-family: dex-ok-b983c4766d
}

.dex-okds-intermediate {
  --ok-icon-font-family: "dex-ok-b983c4766d"
}

.dex-okds-intermediate:before {
  content: "\e090";
  font-family: dex-ok-b983c4766d
}

.dex-okds-arrow-chevron-left-centered-sm {
  --ok-icon-font-family: "dex-ok-b983c4766d"
}

.dex-okds-arrow-chevron-left-centered-sm:before {
  content: "\e013";
  font-family: dex-ok-b983c4766d
}

.dex-okds-eye-hide {
  --ok-icon-font-family: "dex-ok-b983c4766d"
}

.dex-okds-eye-hide:before {
  content: "\e03d";
  font-family: dex-ok-b983c4766d
}

.dex-okds-eye-show {
  --ok-icon-font-family: "dex-ok-b983c4766d"
}

.dex-okds-eye-show:before {
  content: "\e03f";
  font-family: dex-ok-b983c4766d
}

.dex-okds-copy {
  --ok-icon-font-family: "dex-ok-b983c4766d"
}

.dex-okds-copy:before {
  content: "\e033";
  font-family: dex-ok-b983c4766d
}

.dex-okds-history {
  --ok-icon-font-family: "dex-ok-b983c4766d"
}

.dex-okds-history:before {
  content: "\e04f";
  font-family: dex-ok-b983c4766d
}

.dex-okds-back-to-top {
  --ok-icon-font-family: "dex-ok-b983c4766d"
}

.dex-okds-back-to-top:before {
  content: "\e08f";
  font-family: dex-ok-b983c4766d
}

.dex-okds-clock {
  --ok-icon-font-family: "dex-ok-b983c4766d"
}

.dex-okds-clock:before {
  content: "\e028";
  font-family: dex-ok-b983c4766d
}

.dex-okds-hamburger-setting {
  --ok-icon-font-family: "dex-ok-b983c4766d"
}

.dex-okds-hamburger-setting:before {
  content: "\e04c";
  font-family: dex-ok-b983c4766d
}

.dex-okds-fees {
  --ok-icon-font-family: "dex-ok-b983c4766d"
}

.dex-okds-fees:before {
  content: "\e040";
  font-family: dex-ok-b983c4766d
}

.dex-okds-open-link {
  --ok-icon-font-family: "dex-ok-b983c4766d"
}

.dex-okds-open-link:before {
  content: "\e05d";
  font-family: dex-ok-b983c4766d
}

.dex-okds-setting {
  --ok-icon-font-family: "dex-ok-b983c4766d"
}

.dex-okds-setting:before {
  content: "\e074";
  font-family: dex-ok-b983c4766d
}

.dex-okds-crown {
  --ok-icon-font-family: "dex-ok-b983c4766d"
}

.dex-okds-crown:before {
  content: "\e08e";
  font-family: dex-ok-b983c4766d
}

.dex-okds-share {
  --ok-icon-font-family: "dex-ok-b983c4766d"
}

.dex-okds-share:before {
  content: "\e078";
  font-family: dex-ok-b983c4766d
}

.dex-okds-support {
  --ok-icon-font-family: "dex-ok-b983c4766d"
}

.dex-okds-support:before {
  content: "\e086";
  font-family: dex-ok-b983c4766d
}

.dex-okds-analysis {
  --ok-icon-font-family: "dex-ok-b983c4766d"
}

.dex-okds-analysis:before {
  content: "\e003";
  font-family: dex-ok-b983c4766d
}

.dex-okds-academy {
  --ok-icon-font-family: "dex-ok-b983c4766d"
}

.dex-okds-academy:before {
  content: "\e000";
  font-family: dex-ok-b983c4766d
}

.dex-okds-action-reverse {
  --ok-icon-font-family: "dex-ok-b983c4766d"
}

.dex-okds-action-reverse:before {
  content: "\e001";
  font-family: dex-ok-b983c4766d
}

.dex-okds-aed {
  --ok-icon-font-family: "dex-ok-b983c4766d"
}

.dex-okds-aed:before {
  content: "\e002";
  font-family: dex-ok-b983c4766d
}

.dex-okds-arrow-cheveron-alignleft-md {
  --ok-icon-font-family: "dex-ok-b983c4766d"
}

.dex-okds-arrow-cheveron-alignleft-md:before {
  content: "\e004";
  font-family: dex-ok-b983c4766d
}

.dex-okds-arrow-cheveron-first-md {
  --ok-icon-font-family: "dex-ok-b983c4766d"
}

.dex-okds-arrow-cheveron-first-md:before {
  content: "\e005";
  font-family: dex-ok-b983c4766d
}

.dex-okds-arrow-cheveron-last-md {
  --ok-icon-font-family: "dex-ok-b983c4766d"
}

.dex-okds-arrow-cheveron-last-md:before {
  content: "\e006";
  font-family: dex-ok-b983c4766d
}

.dex-okds-arrow-chevron-down-md {
  --ok-icon-font-family: "dex-ok-b983c4766d"
}

.dex-okds-arrow-chevron-down-md:before {
  content: "\e007";
  font-family: dex-ok-b983c4766d
}

.dex-okds-arrow-chevron-down-sm {
  --ok-icon-font-family: "dex-ok-b983c4766d"
}

.dex-okds-arrow-chevron-down-sm:before {
  content: "\e008";
  font-family: dex-ok-b983c4766d
}

.dex-okds-arrow-pointer-down-md {
  --ok-icon-font-family: "dex-ok-b983c4766d"
}

.dex-okds-arrow-pointer-down-md:before {
  content: "\e009";
  font-family: dex-ok-b983c4766d
}

.dex-okds-arrow-pointer-down-sm {
  --ok-icon-font-family: "dex-ok-b983c4766d"
}

.dex-okds-arrow-pointer-down-sm:before {
  content: "\e00a";
  font-family: dex-ok-b983c4766d
}

.dex-okds-arrow-pointer-left-md {
  --ok-icon-font-family: "dex-ok-b983c4766d"
}

.dex-okds-arrow-pointer-left-md:before {
  content: "\e00b";
  font-family: dex-ok-b983c4766d
}

.dex-okds-arrow-pointer-left-sm {
  --ok-icon-font-family: "dex-ok-b983c4766d"
}

.dex-okds-arrow-pointer-left-sm:before {
  content: "\e00c";
  font-family: dex-ok-b983c4766d
}

.dex-okds-arrow-pointer-up-md {
  --ok-icon-font-family: "dex-ok-b983c4766d"
}

.dex-okds-arrow-pointer-up-md:before {
  content: "\e00f";
  font-family: dex-ok-b983c4766d
}

.dex-okds-arrow-pointer-up-sm {
  --ok-icon-font-family: "dex-ok-b983c4766d"
}

.dex-okds-arrow-pointer-up-sm:before {
  content: "\e010";
  font-family: dex-ok-b983c4766d
}

.dex-okds-arrow-chevron-up-md {
  --ok-icon-font-family: "dex-ok-b983c4766d"
}

.dex-okds-arrow-chevron-up-md:before {
  content: "\e011";
  font-family: dex-ok-b983c4766d
}

.dex-okds-arrow-chevron-left-centered-md {
  --ok-icon-font-family: "dex-ok-b983c4766d"
}

.dex-okds-arrow-chevron-left-centered-md:before {
  content: "\e012";
  font-family: dex-ok-b983c4766d
}

.dex-okds-arrow-chevron-up-sm {
  --ok-icon-font-family: "dex-ok-b983c4766d"
}

.dex-okds-arrow-chevron-up-sm:before {
  content: "\e016";
  font-family: dex-ok-b983c4766d
}

.dex-okds-bell {
  --ok-icon-font-family: "dex-ok-b983c4766d"
}

.dex-okds-bell:before {
  content: "\e017";
  font-family: dex-ok-b983c4766d
}

.dex-okds-authenticator {
  --ok-icon-font-family: "dex-ok-b983c4766d"
}

.dex-okds-authenticator:before {
  content: "\e018";
  font-family: dex-ok-b983c4766d
}

.dex-okds-borrow {
  --ok-icon-font-family: "dex-ok-b983c4766d"
}

.dex-okds-borrow:before {
  content: "\e019";
  font-family: dex-ok-b983c4766d
}

.dex-okds-brl {
  --ok-icon-font-family: "dex-ok-b983c4766d"
}

.dex-okds-brl:before {
  content: "\e01a";
  font-family: dex-ok-b983c4766d
}

.dex-okds-brush {
  --ok-icon-font-family: "dex-ok-b983c4766d"
}

.dex-okds-brush:before {
  content: "\e01b";
  font-family: dex-ok-b983c4766d
}

.dex-okds-cancel-order {
  --ok-icon-font-family: "dex-ok-b983c4766d"
}

.dex-okds-cancel-order:before {
  content: "\e01c";
  font-family: dex-ok-b983c4766d
}

.dex-okds-candlestick {
  --ok-icon-font-family: "dex-ok-b983c4766d"
}

.dex-okds-candlestick:before {
  content: "\e01d";
  font-family: dex-ok-b983c4766d
}

.dex-okds-carets-filled-down {
  --ok-icon-font-family: "dex-ok-b983c4766d"
}

.dex-okds-carets-filled-down:before {
  content: "\e01f";
  font-family: dex-ok-b983c4766d
}

.dex-okds-chat-bubble {
  --ok-icon-font-family: "dex-ok-b983c4766d"
}

.dex-okds-chat-bubble:before {
  content: "\e020";
  font-family: dex-ok-b983c4766d
}

.dex-okds-carets-filled-up {
  --ok-icon-font-family: "dex-ok-b983c4766d"
}

.dex-okds-carets-filled-up:before {
  content: "\e021";
  font-family: dex-ok-b983c4766d
}

.dex-okds-clear-fill {
  --ok-icon-font-family: "dex-ok-b983c4766d"
}

.dex-okds-clear-fill:before {
  content: "\e023";
  font-family: dex-ok-b983c4766d
}

.dex-okds-assets {
  --ok-icon-font-family: "dex-ok-b983c4766d"
}

.dex-okds-assets:before {
  content: "\e024";
  font-family: dex-ok-b983c4766d
}

.dex-okds-bank {
  --ok-icon-font-family: "dex-ok-b983c4766d"
}

.dex-okds-bank:before {
  content: "\e025";
  font-family: dex-ok-b983c4766d
}

.dex-okds-clock-filled {
  --ok-icon-font-family: "dex-ok-b983c4766d"
}

.dex-okds-clock-filled:before {
  content: "\e026";
  font-family: dex-ok-b983c4766d
}

.dex-okds-clock-outline {
  --ok-icon-font-family: "dex-ok-b983c4766d"
}

.dex-okds-clock-outline:before {
  content: "\e027";
  font-family: dex-ok-b983c4766d
}

.dex-okds-close {
  --ok-icon-font-family: "dex-ok-b983c4766d"
}

.dex-okds-close:before {
  content: "\e029";
  font-family: dex-ok-b983c4766d
}

.dex-okds-communication-call {
  --ok-icon-font-family: "dex-ok-b983c4766d"
}

.dex-okds-communication-call:before {
  content: "\e02a";
  font-family: dex-ok-b983c4766d
}

.dex-okds-communication-idcard {
  --ok-icon-font-family: "dex-ok-b983c4766d"
}

.dex-okds-communication-idcard:before {
  content: "\e02b";
  font-family: dex-ok-b983c4766d
}

.dex-okds-communication-img-failed {
  --ok-icon-font-family: "dex-ok-b983c4766d"
}

.dex-okds-communication-img-failed:before {
  content: "\e02c";
  font-family: dex-ok-b983c4766d
}

.dex-okds-communications-faceid {
  --ok-icon-font-family: "dex-ok-b983c4766d"
}

.dex-okds-communications-faceid:before {
  content: "\e02d";
  font-family: dex-ok-b983c4766d
}

.dex-okds-eye-show-filled {
  --ok-icon-font-family: "dex-ok-b983c4766d"
}

.dex-okds-eye-show-filled:before {
  content: "\e02e";
  font-family: dex-ok-b983c4766d
}

.dex-okds-communication-img {
  --ok-icon-font-family: "dex-ok-b983c4766d"
}

.dex-okds-communication-img:before {
  content: "\e030";
  font-family: dex-ok-b983c4766d
}

.dex-okds-convertokb {
  --ok-icon-font-family: "dex-ok-b983c4766d"
}

.dex-okds-convertokb:before {
  content: "\e031";
  font-family: dex-ok-b983c4766d
}

.dex-okds-cursor-drag {
  --ok-icon-font-family: "dex-ok-b983c4766d"
}

.dex-okds-cursor-drag:before {
  content: "\e032";
  font-family: dex-ok-b983c4766d
}

.dex-okds-data-line-chart {
  --ok-icon-font-family: "dex-ok-b983c4766d"
}

.dex-okds-data-line-chart:before {
  content: "\e034";
  font-family: dex-ok-b983c4766d
}

.dex-okds-deposit {
  --ok-icon-font-family: "dex-ok-b983c4766d"
}

.dex-okds-deposit:before {
  content: "\e035";
  font-family: dex-ok-b983c4766d
}

.dex-okds-cursor-zoom {
  --ok-icon-font-family: "dex-ok-b983c4766d"
}

.dex-okds-cursor-zoom:before {
  content: "\e036";
  font-family: dex-ok-b983c4766d
}

.dex-okds-download {
  --ok-icon-font-family: "dex-ok-b983c4766d"
}

.dex-okds-download:before {
  content: "\e037";
  font-family: dex-ok-b983c4766d
}

.dex-okds-exchange {
  --ok-icon-font-family: "dex-ok-b983c4766d"
}

.dex-okds-exchange:before {
  content: "\e038";
  font-family: dex-ok-b983c4766d
}

.dex-okds-developers {
  --ok-icon-font-family: "dex-ok-b983c4766d"
}

.dex-okds-developers:before {
  content: "\e039";
  font-family: dex-ok-b983c4766d
}

.dex-okds-eur {
  --ok-icon-font-family: "dex-ok-b983c4766d"
}

.dex-okds-eur:before {
  content: "\e03a";
  font-family: dex-ok-b983c4766d
}

.dex-okds-edit {
  --ok-icon-font-family: "dex-ok-b983c4766d"
}

.dex-okds-edit:before {
  content: "\e03b";
  font-family: dex-ok-b983c4766d
}

.dex-okds-expand {
  --ok-icon-font-family: "dex-ok-b983c4766d"
}

.dex-okds-expand:before {
  content: "\e03c";
  font-family: dex-ok-b983c4766d
}

.dex-okds-eye-hide-filled {
  --ok-icon-font-family: "dex-ok-b983c4766d"
}

.dex-okds-eye-hide-filled:before {
  content: "\e03e";
  font-family: dex-ok-b983c4766d
}

.dex-okds-fail-circle {
  --ok-icon-font-family: "dex-ok-b983c4766d"
}

.dex-okds-fail-circle:before {
  content: "\e041";
  font-family: dex-ok-b983c4766d
}

.dex-okds-filter {
  --ok-icon-font-family: "dex-ok-b983c4766d"
}

.dex-okds-filter:before {
  content: "\e042";
  font-family: dex-ok-b983c4766d
}

.dex-okds-finance-bank {
  --ok-icon-font-family: "dex-ok-b983c4766d"
}

.dex-okds-finance-bank:before {
  content: "\e043";
  font-family: dex-ok-b983c4766d
}

.dex-okds-finance-seagull {
  --ok-icon-font-family: "dex-ok-b983c4766d"
}

.dex-okds-finance-seagull:before {
  content: "\e044";
  font-family: dex-ok-b983c4766d
}

.dex-okds-finance-earn {
  --ok-icon-font-family: "dex-ok-b983c4766d"
}

.dex-okds-finance-earn:before {
  content: "\e045";
  font-family: dex-ok-b983c4766d
}

.dex-okds-futures {
  --ok-icon-font-family: "dex-ok-b983c4766d"
}

.dex-okds-futures:before {
  content: "\e046";
  font-family: dex-ok-b983c4766d
}

.dex-okds-funding-rates {
  --ok-icon-font-family: "dex-ok-b983c4766d"
}

.dex-okds-funding-rates:before {
  content: "\e047";
  font-family: dex-ok-b983c4766d
}

.dex-okds-gbp {
  --ok-icon-font-family: "dex-ok-b983c4766d"
}

.dex-okds-gbp:before {
  content: "\e048";
  font-family: dex-ok-b983c4766d
}

.dex-okds-guide {
  --ok-icon-font-family: "dex-ok-b983c4766d"
}

.dex-okds-guide:before {
  content: "\e049";
  font-family: dex-ok-b983c4766d
}

.dex-okds-hamburger-edit {
  --ok-icon-font-family: "dex-ok-b983c4766d"
}

.dex-okds-hamburger-edit:before {
  content: "\e04a";
  font-family: dex-ok-b983c4766d
}

.dex-okds-hamburger-search {
  --ok-icon-font-family: "dex-ok-b983c4766d"
}

.dex-okds-hamburger-search:before {
  content: "\e04b";
  font-family: dex-ok-b983c4766d
}

.dex-okds-hamburger {
  --ok-icon-font-family: "dex-ok-b983c4766d"
}

.dex-okds-hamburger:before {
  content: "\e04d";
  font-family: dex-ok-b983c4766d
}

.dex-okds-hierachy {
  --ok-icon-font-family: "dex-ok-b983c4766d"
}

.dex-okds-hierachy:before {
  content: "\e04e";
  font-family: dex-ok-b983c4766d
}

.dex-okds-id-card {
  --ok-icon-font-family: "dex-ok-b983c4766d"
}

.dex-okds-id-card:before {
  content: "\e050";
  font-family: dex-ok-b983c4766d
}

.dex-okds-img {
  --ok-icon-font-family: "dex-ok-b983c4766d"
}

.dex-okds-img:before {
  content: "\e051";
  font-family: dex-ok-b983c4766d
}

.dex-okds-insurance-fund {
  --ok-icon-font-family: "dex-ok-b983c4766d"
}

.dex-okds-insurance-fund:before {
  content: "\e054";
  font-family: dex-ok-b983c4766d
}

.dex-okds-language {
  --ok-icon-font-family: "dex-ok-b983c4766d"
}

.dex-okds-language:before {
  content: "\e057";
  font-family: dex-ok-b983c4766d
}

.dex-okds-margin {
  --ok-icon-font-family: "dex-ok-b983c4766d"
}

.dex-okds-margin:before {
  content: "\e059";
  font-family: dex-ok-b983c4766d
}

.dex-okds-logout {
  --ok-icon-font-family: "dex-ok-b983c4766d"
}

.dex-okds-logout:before {
  content: "\e05a";
  font-family: dex-ok-b983c4766d
}

.dex-okds-minus {
  --ok-icon-font-family: "dex-ok-b983c4766d"
}

.dex-okds-minus:before {
  content: "\e05b";
  font-family: dex-ok-b983c4766d
}

.dex-okds-more {
  --ok-icon-font-family: "dex-ok-b983c4766d"
}

.dex-okds-more:before {
  content: "\e05c";
  font-family: dex-ok-b983c4766d
}

.dex-okds-network-fee-standard {
  --ok-icon-font-family: "dex-ok-b983c4766d"
}

.dex-okds-network-fee-standard:before {
  content: "\e05e";
  font-family: dex-ok-b983c4766d
}

.dex-okds-option {
  --ok-icon-font-family: "dex-ok-b983c4766d"
}

.dex-okds-option:before {
  content: "\e05f";
  font-family: dex-ok-b983c4766d
}

.dex-okds-orders {
  --ok-icon-font-family: "dex-ok-b983c4766d"
}

.dex-okds-orders:before {
  content: "\e060";
  font-family: dex-ok-b983c4766d
}

.dex-okds-pending-circle {
  --ok-icon-font-family: "dex-ok-b983c4766d"
}

.dex-okds-pending-circle:before {
  content: "\e061";
  font-family: dex-ok-b983c4766d
}

.dex-okds-pie-chart {
  --ok-icon-font-family: "dex-ok-b983c4766d"
}

.dex-okds-pie-chart:before {
  content: "\e062";
  font-family: dex-ok-b983c4766d
}

.dex-okds-place-order {
  --ok-icon-font-family: "dex-ok-b983c4766d"
}

.dex-okds-place-order:before {
  content: "\e063";
  font-family: dex-ok-b983c4766d
}

.dex-okds-play {
  --ok-icon-font-family: "dex-ok-b983c4766d"
}

.dex-okds-play:before {
  content: "\e064";
  font-family: dex-ok-b983c4766d
}

.dex-okds-plus-circle {
  --ok-icon-font-family: "dex-ok-b983c4766d"
}

.dex-okds-plus-circle:before {
  content: "\e066";
  font-family: dex-ok-b983c4766d
}

.dex-okds-plus {
  --ok-icon-font-family: "dex-ok-b983c4766d"
}

.dex-okds-plus:before {
  content: "\e067";
  font-family: dex-ok-b983c4766d
}

.dex-okds-profile {
  --ok-icon-font-family: "dex-ok-b983c4766d"
}

.dex-okds-profile:before {
  content: "\e068";
  font-family: dex-ok-b983c4766d
}

.dex-okds-qrcode {
  --ok-icon-font-family: "dex-ok-b983c4766d"
}

.dex-okds-qrcode:before {
  content: "\e069";
  font-family: dex-ok-b983c4766d
}

.dex-okds-question-mark-circle-fill {
  --ok-icon-font-family: "dex-ok-b983c4766d"
}

.dex-okds-question-mark-circle-fill:before {
  content: "\e06a";
  font-family: dex-ok-b983c4766d
}

.dex-okds-question-mark-circle {
  --ok-icon-font-family: "dex-ok-b983c4766d"
}

.dex-okds-question-mark-circle:before {
  content: "\e06b";
  font-family: dex-ok-b983c4766d
}

.dex-okds-sort-up-center-aligned {
  --ok-icon-font-family: "dex-ok-b983c4766d"
}

.dex-okds-sort-up-center-aligned:before {
  content: "\e06c";
  font-family: dex-ok-b983c4766d
}

.dex-okds-records {
  --ok-icon-font-family: "dex-ok-b983c4766d"
}

.dex-okds-records:before {
  content: "\e06d";
  font-family: dex-ok-b983c4766d
}

.dex-okds-red-packe {
  --ok-icon-font-family: "dex-ok-b983c4766d"
}

.dex-okds-red-packe:before {
  content: "\e06e";
  font-family: dex-ok-b983c4766d
}

.dex-okds-scan {
  --ok-icon-font-family: "dex-ok-b983c4766d"
}

.dex-okds-scan:before {
  content: "\e06f";
  font-family: dex-ok-b983c4766d
}

.dex-okds-report-centre {
  --ok-icon-font-family: "dex-ok-b983c4766d"
}

.dex-okds-report-centre:before {
  content: "\e070";
  font-family: dex-ok-b983c4766d
}

.dex-okds-security-fill {
  --ok-icon-font-family: "dex-ok-b983c4766d"
}

.dex-okds-security-fill:before {
  content: "\e071";
  font-family: dex-ok-b983c4766d
}

.dex-okds-search {
  --ok-icon-font-family: "dex-ok-b983c4766d"
}

.dex-okds-search:before {
  content: "\e072";
  font-family: dex-ok-b983c4766d
}

.dex-okds-security {
  --ok-icon-font-family: "dex-ok-b983c4766d"
}

.dex-okds-security:before {
  content: "\e073";
  font-family: dex-ok-b983c4766d
}

.dex-okds-transfer {
  --ok-icon-font-family: "dex-ok-b983c4766d"
}

.dex-okds-transfer:before {
  content: "\e075";
  font-family: dex-ok-b983c4766d
}

.dex-okds-settlement-history {
  --ok-icon-font-family: "dex-ok-b983c4766d"
}

.dex-okds-settlement-history:before {
  content: "\e076";
  font-family: dex-ok-b983c4766d
}

.dex-okds-trends {
  --ok-icon-font-family: "dex-ok-b983c4766d"
}

.dex-okds-trends:before {
  content: "\e077";
  font-family: dex-ok-b983c4766d
}

.dex-okds-sort-default-center-aligned {
  --ok-icon-font-family: "dex-ok-b983c4766d"
}

.dex-okds-sort-default-center-aligned:before {
  content: "\e079";
  font-family: dex-ok-b983c4766d
}

.dex-okds-sort-default {
  --ok-icon-font-family: "dex-ok-b983c4766d"
}

.dex-okds-sort-default:before {
  content: "\e07a";
  font-family: dex-ok-b983c4766d
}

.dex-okds-sort-down-center-aligned-svg {
  --ok-icon-font-family: "dex-ok-b983c4766d"
}

.dex-okds-sort-down-center-aligned-svg:before {
  content: "\e07c";
  font-family: dex-ok-b983c4766d
}

.dex-okds-withdraw {
  --ok-icon-font-family: "dex-ok-b983c4766d"
}

.dex-okds-withdraw:before {
  content: "\e07e";
  font-family: dex-ok-b983c4766d
}

.dex-okds-sort-down {
  --ok-icon-font-family: "dex-ok-b983c4766d"
}

.dex-okds-sort-down:before {
  content: "\e07f";
  font-family: dex-ok-b983c4766d
}

.dex-okds-sort-up {
  --ok-icon-font-family: "dex-ok-b983c4766d"
}

.dex-okds-sort-up:before {
  content: "\e080";
  font-family: dex-ok-b983c4766d
}

.dex-okds-star-filled {
  --ok-icon-font-family: "dex-ok-b983c4766d"
}

.dex-okds-star-filled:before {
  content: "\e081";
  font-family: dex-ok-b983c4766d
}

.dex-okds-star {
  --ok-icon-font-family: "dex-ok-b983c4766d"
}

.dex-okds-star:before {
  content: "\e082";
  font-family: dex-ok-b983c4766d
}

.dex-okds-strong-alert {
  --ok-icon-font-family: "dex-ok-b983c4766d"
}

.dex-okds-strong-alert:before {
  content: "\e083";
  font-family: dex-ok-b983c4766d
}

.dex-okds-success-circle {
  --ok-icon-font-family: "dex-ok-b983c4766d"
}

.dex-okds-success-circle:before {
  content: "\e085";
  font-family: dex-ok-b983c4766d
}

.dex-okds-trade-1 {
  --ok-icon-font-family: "dex-ok-b983c4766d"
}

.dex-okds-trade-1:before {
  content: "\e087";
  font-family: dex-ok-b983c4766d
}

.dex-okds-transfer-circle {
  --ok-icon-font-family: "dex-ok-b983c4766d"
}

.dex-okds-transfer-circle:before {
  content: "\e088";
  font-family: dex-ok-b983c4766d
}

.dex-okds-unlink {
  --ok-icon-font-family: "dex-ok-b983c4766d"
}

.dex-okds-unlink:before {
  content: "\e08b";
  font-family: dex-ok-b983c4766d
}

.dex-okds-usd {
  --ok-icon-font-family: "dex-ok-b983c4766d"
}

.dex-okds-usd:before {
  content: "\e08c";
  font-family: dex-ok-b983c4766d
}

.dex-okds-warning-circle {
  --ok-icon-font-family: "dex-ok-b983c4766d"
}

.dex-okds-warning-circle:before {
  content: "\e08d";
  font-family: dex-ok-b983c4766d
}

.iconfont {
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
  font-size: 16px;
  font-style: normal
}

.iconfont:before {
  display: inline-block
}

@font-face {
  font-display: block;
  font-family: dex-ok-b983c4766d;
  font-style: normal;
  src: url(../7037698b1d9e17ea03b4.woff2) format("woff2")
}

[dir=rtl] .dex-okds-arrow-cheveron-alignleft-md:before,
[dir=rtl] .dex-okds-arrow-cheveron-first-md:before,
[dir=rtl] .dex-okds-arrow-cheveron-last-md:before,
[dir=rtl] .dex-okds-arrow-chevron-left-centered-md:before,
[dir=rtl] .dex-okds-arrow-chevron-left-centered-sm:before,
[dir=rtl] .dex-okds-arrow-chevron-right-centered-md:before,
[dir=rtl] .dex-okds-arrow-chevron-right-centered-sm:before,
[dir=rtl] .dex-okds-arrow-chevron-right-centered-xs:before,
[dir=rtl] .dex-okds-arrow-pointer-left-md:before,
[dir=rtl] .dex-okds-arrow-pointer-left-sm:before,
[dir=rtl] .dex-okds-arrow-pointer-right-md:before,
[dir=rtl] .dex-okds-arrow-pointer-right-sm:before,
[dir=rtl] .dex-okds-arrow-pointer-right-xs:before,
[dir=rtl] .dex-okds-communication-idcard:before,
[dir=rtl] .dex-okds-copy:before,
[dir=rtl] .dex-okds-eye-hide-filled:before,
[dir=rtl] .dex-okds-eye-hide:before,
[dir=rtl] .dex-okds-guide:before,
[dir=rtl] .dex-okds-logout:before,
[dir=rtl] .dex-okds-network-fee-standard:before,
[dir=rtl] .dex-okds-open-link:before,
[dir=rtl] .dex-okds-orders:before,
[dir=rtl] .dex-okds-question-mark-circle-fill:before,
[dir=rtl] .dex-okds-question-mark-circle:before,
[dir=rtl] .dex-okds-report-centre:before {
  transform: scaleX(-1)
}

.theme-light {
  --dex-okd-color-gray-050: #f9f9f9;
  --dex-okd-color-gray-100: #ebebeb;
  --dex-okd-color-gray-200: #dbdbdb;
  --dex-okd-color-gray-300: #bdbdbd;
  --dex-okd-color-gray-400: #929292;
  --dex-okd-color-gray-500: #6e6e6e;
  --dex-okd-color-gray-600: #545454;
  --dex-okd-color-gray-700: #3d3d3d;
  --dex-okd-color-gray-800: #1a1a1a;
  --dex-okd-color-gray-900: #000;
  --dex-okd-color-blue-050: #f5f9ff;
  --dex-okd-color-blue-100: #d1e3ff;
  --dex-okd-color-blue-200: #afcfff;
  --dex-okd-color-blue-300: #8dbbff;
  --dex-okd-color-blue-400: #6ba6ff;
  --dex-okd-color-blue-500: #4992ff;
  --dex-okd-color-blue-600: #277dff;
  --dex-okd-color-blue-700: #0569ff;
  --dex-okd-color-blue-800: #005eea;
  --dex-okd-color-blue-900: #0051ca;
  --dex-okd-color-green-050: #f2fff7;
  --dex-okd-color-green-100: #d2f4de;
  --dex-okd-color-green-200: #a5e9be;
  --dex-okd-color-green-300: #78de9d;
  --dex-okd-color-green-400: #4bd37d;
  --dex-okd-color-green-500: #31bd65;
  --dex-okd-color-green-600: #18a04a;
  --dex-okd-color-green-700: #127837;
  --dex-okd-color-green-800: #0c5025;
  --dex-okd-color-green-900: #0c5025;
  --dex-okd-color-red-050: #fff8f9;
  --dex-okd-color-red-100: #fcdce5;
  --dex-okd-color-red-200: #f9b9ca;
  --dex-okd-color-red-300: #f796b0;
  --dex-okd-color-red-400: #f07596;
  --dex-okd-color-red-500: #f1507b;
  --dex-okd-color-red-600: #c14062;
  --dex-okd-color-red-700: #91304a;
  --dex-okd-color-red-800: #602031;
  --dex-okd-color-red-900: #301019;
  --dex-okd-color-orange-050: #fef9f6;
  --dex-okd-color-orange-100: #fce3d4;
  --dex-okd-color-orange-200: #fbceb4;
  --dex-okd-color-orange-300: #f9b994;
  --dex-okd-color-orange-400: #f7a474;
  --dex-okd-color-orange-500: #f58f54;
  --dex-okd-color-orange-600: #f6813d;
  --dex-okd-color-orange-700: #f16514;
  --dex-okd-color-orange-800: #e96010;
  --dex-okd-color-orange-900: #bf4803;
  --dex-okd-color-yellow-050: #fffcf5;
  --dex-okd-color-yellow-100: #fff2d1;
  --dex-okd-color-yellow-200: #ffe9af;
  --dex-okd-color-yellow-300: #ffdf8d;
  --dex-okd-color-yellow-400: #ffd66b;
  --dex-okd-color-yellow-500: #ffcc49;
  --dex-okd-color-yellow-600: #ffc327;
  --dex-okd-color-yellow-700: #ffb905;
  --dex-okd-color-yellow-800: #eaa900;
  --dex-okd-color-yellow-900: #d29801;
  --dex-okd-color-text-white: #fff;
  --dex-okd-color-text-black: #1f2933;
  --dex-okd-color-background-1: #fff;
  --dex-okd-color-background-2: #f7f7f7;
  --dex-okd-color-transparent: transparent;
  --dex-okd-color-white: #fff;
  --dex-okd-color-black: #000;
  --dex-okd-color-line-muted: #ebebeb;
  --dex-okd-color-line-secondary: #dbdbdb;
  --dex-okd-color-line-amplifed: #bdbdbd;
  --dex-okd-color-text-lighter: #bdbdbd;
  --dex-okd-color-text-light: #929292;
  --dex-okd-color-text-secondary: #3d3d3d;
  --dex-okd-color-text-amplifed: #000;
  --dex-okd-color-background-3: #f2f2f2;
  --dex-okd-color-fq-blue-lv1: #0569ff;
  --dex-okd-color-fq-green-lv1: #19cc5b;
  --dex-okd-color-fq-red-lv1: #f1507b;
  --dex-okd-color-fq-orange-lv1: #f16514;
  --dex-okd-color-fq-blue-lv2: #0569ff;
  --dex-okd-color-background-hover: #ebebeb;
  --dex-okd-color-prefer-red-chart: #f1507b;
  --dex-okd-color-prefer-red-bg: #eb4b6d;
  --dex-okd-color-prefer-green-chart: #19cc5b;
  --dex-okd-color-prefer-green-bg: #31bd65;
  --dex-okd-color-prefer-red-text: #eb4b6d;
  --dex-okd-color-prefer-green-text: #31bd65;
  --dex-okd-color-branded-primary: #bcff2f;
  --dex-okd-color-fq-critical: #eb4b6d;
  --dex-okd-color-fq-warning: #f16514;
  --dex-okd-color-fq-positive: #31bd65;
  --dex-okd-color-fq-neutral: #000;
  --dex-okd-color-fq-accent: #0569ff;
  --dex-okd-color-prefer-neutral-text: #929292;
  --dex-okd-color-prefer-neutral-bg: #929292;
  --dex-okd-color-background-base-primary: #fff;
  --dex-okd-color-background-base-secondary: #fafafa;
  --dex-okd-color-background-surface-primary: #f3f3f3;
  --dex-okd-color-background-surface-secondary: #f6f6f6;
  --dex-okd-color-background-surface-pressed: #d9d9d9;
  --dex-okd-color-background-surface-disable: #fafafa;
  --dex-okd-color-background-scrim: rgba(0, 0, 0, .43);
  --dex-okd-color-container-primary: #fff;
  --dex-okd-color-container-secondary: #fafafa;
  --dex-okd-color-container-tertiary: #fff;
  --dex-okd-color-container-contrast: #414141;
  --dex-okd-color-container-inverse: #0e0e0e;
  --dex-okd-color-content-primary: #000;
  --dex-okd-color-content-secondary: #383838;
  --dex-okd-color-content-tertiary: #5b5b5b;
  --dex-okd-color-content-contrast: #909090;
  --dex-okd-color-content-disabled: #b3b3b3;
  --dex-okd-color-content-inverse: #fff;
  --dex-okd-color-border-primary: #e6e6e6;
  --dex-okd-color-border-secondary: #b3b3b3;
  --dex-okd-color-border-contrast: #fafafa;
  --dex-okd-color-border-selected: #000;
  --dex-okd-color-semantic-neutral: #000;
  --dex-okd-color-semantic-notice: #ffb117;
  --dex-okd-color-semantic-positive: #31bd65;
  --dex-okd-color-semantic-negative: #eb4b6d;
  --dex-okd-color-semantic-informative: #8a91ff;
  --dex-okd-color-semantic-highlight: #bcff2f;
  --dex-okd-color-dvp-neutral: rgba(0, 0, 0, .57);
  --dex-okd-color-dvp-profit: #00bc4b;
  --dex-okd-color-dvp-loss: #f5384f;
  --dex-okd-color-categorical-01: #8a91ff;
  --dex-okd-color-categorical-02: #ffb117;
  --dex-okd-color-categorical-03: #bcff2f;
  --dex-okd-color-categorical-04: #12e366;
  --dex-okd-color-categorical-05: #ff7888;
  --dex-okd-color-common-transparent: hsla(0, 0%, 100%, 0);
  --dex-okd-color-transparent-black: transparent;
  --dex-okd-color-transparent-white: transparent;
  --dex-okd-color-alert-info: #f7f7f7;
  --dex-okd-color-alert-success: #eaf8f0;
  --dex-okd-color-alert-warning: #fef9f6;
  --dex-okd-color-alert-error: #fdedf0;
  --dex-okd-color-common-background-2: #f3f3f3;
  --dex-okd-color-data-visualization-category-01: #8a91ff;
  --dex-okd-color-data-visualization-category-02: #ffb117;
  --dex-okd-color-data-visualization-category-03: #bcff2f;
  --dex-okd-color-data-visualization-category-04: #12e366;
  --dex-okd-color-data-visualization-category-05: #ff7888;
  --dex-okd-color-preference-loss: #f5384f;
  --dex-okd-color-preference-profit: #00bc4b;
  --dex-okd-color-preference-neutral: rgba(0, 0, 0, .57);
  --dex-okd-color-border-focus: #000;
  --dex-okd-color-background-base-primary_alternative: #fff;
  --dex-okd-color-link-content: #4c2fff;
  --dex-okd-color-link-accent-content-primary: #2b6d17;
  --dex-okd-color-background-surface-contrast: #fff;
  --dex-okd-color-background-surface-brand: #000;
  --dex-okd-color-border-tertiary: #f3f3f3;
  --dex-okd-color-content-brand: #000;
  --dex-okd-color-modal-primary: #fff;
  --dex-okd-color-modal-secondary: #fff;
  --dex-okd-color-modal-tertiary: #fff;
  --dex-okd-color-modal-contrast: #4d4d4d;
  --dex-okd-color-card-primary: #f6f6f6;
  --dex-okd-color-card-secondary: #f6f6f6;
  --dex-okd-color-brand-primary: #2b6d17;
  --dex-okd-color-brand-primary-alternative: #2b6d17;
  --dex-okd-color-brand-secondary: #8ec51d;
  --dex-okd-color-brand-tertiary: #bcff2f;
  --dex-okd-color-brand-content: #e6ffb0;
  --dex-okd-color-brand-content-contrast: #e6ffb0;
  --dex-okd-color-global-fixed-always-dark: #000;
  --dex-okd-color-global-fixed-always-light: #fff;
  --dex-okd-color-surface-structural-subbase: #f6f6f6;
  --dex-okd-color-surface-info-default: #4a4a4a;
  --dex-okd-color-surface-info-subtle: #f6f6f6;
  --dex-okd-color-surface-warning-default: #fea01d;
  --dex-okd-color-surface-warning-subtle: #ffedcb;
  --dex-okd-color-surface-success-default: #3c8f24;
  --dex-okd-color-surface-success-subtle: #e9f4d1;
  --dex-okd-color-surface-danger-default: #d33a4c;
  --dex-okd-color-surface-danger-subtle: #fee0e3;
  --dex-okd-color-surface-interactive-default: rgba(0, 0, 0, .06);
  --dex-okd-color-surface-interactive-hovered: rgba(0, 0, 0, .09);
  --dex-okd-color-surface-interactive-pressed: rgba(0, 0, 0, .14);
  --dex-okd-color-surface-interactive-disabled: rgba(0, 0, 0, .03);
  --dex-okd-color-surface-interactive-oncolor-default: hsla(0, 0%, 100%, .9);
  --dex-okd-color-surface-interactive-oncolor-hovered: hsla(0, 0%, 100%, .7);
  --dex-okd-color-surface-interactive-oncolor-pressed: hsla(0, 0%, 100%, .5);
  --dex-okd-color-surface-interactive-emphasis-default: rgba(0, 0, 0, .99);
  --dex-okd-color-surface-interactive-emphasis-hovered: rgba(0, 0, 0, .8);
  --dex-okd-color-surface-interactive-emphasis-pressed: rgba(0, 0, 0, .7);
  --dex-okd-color-surface-interactive-emphasis-disabled: rgba(0, 0, 0, .03);
  --dex-okd-color-surface-interactive-selected-default: #000;
  --dex-okd-color-surface-interactive-selected-subtle: rgba(0, 0, 0, .06);
  --dex-okd-color-surface-interactive-selected-oncolor: hsla(0, 0%, 100%, .9);
  --dex-okd-color-surface-structural-base: #fff;
  --dex-okd-color-surface-structural-layer-1: #f6f6f6;
  --dex-okd-color-surface-structural-layer-2: #e9e9e9;
  --dex-okd-color-surface-structural-layer-3: #dcdcdc;
  --dex-okd-color-surface-structural-highlight: var(--global-color-highlight);
  --dex-okd-color-surface-structural-inverse: #000;
  --dex-okd-color-surface-structural-elevated-default: #fff;
  --dex-okd-color-surface-structural-elevated-contrast: #fff;
  --dex-okd-color-surface-structural-overlay: rgba(0, 0, 0, .4);
  --dex-okd-color-border-static-default: rgba(0, 0, 0, .14);
  --dex-okd-color-border-static-subtle: rgba(0, 0, 0, .06);
  --dex-okd-color-border-static-dotted: rgba(0, 0, 0, .32);
  --dex-okd-color-border-interactive-default: rgba(0, 0, 0, .32);
  --dex-okd-color-border-interactive-hovered: #333;
  --dex-okd-color-border-interactive-pressed: #000;
  --dex-okd-color-border-interactive-focused: #000;
  --dex-okd-color-border-interactive-selected: #000;
  --dex-okd-color-border-interactive-error: #ba2133;
  --dex-okd-color-border-interactive-emphasis: #4a4a4a;
  --dex-okd-color-border-interactive-oncolor: #e9e9e9;
  --dex-okd-color-border-static-emphasis: #4a4a4a;
  --dex-okd-color-border-static-experience: var(--global-color-experience-default);
  --dex-okd-color-border-static-highlight: var(--global-color-highlight);
  --dex-okd-color-border-static-overlay: hsla(0, 0%, 100%, .9);
  --dex-okd-color-border-interactive-disabled: rgba(0, 0, 0, .14);
  --dex-okd-color-border-info-default: #212121;
  --dex-okd-color-border-info-subtle: #757575;
  --dex-okd-color-border-warning-default: #ba5d00;
  --dex-okd-color-border-warning-subtle: #ffedcb;
  --dex-okd-color-border-success-default: #2b6d17;
  --dex-okd-color-border-success-subtle: #e9f4d1;
  --dex-okd-color-border-danger-default: #ba2133;
  --dex-okd-color-border-danger-subtle: #fee0e3;
  --dex-okd-color-content-static-default: #000;
  --dex-okd-color-content-interactive-default: #4a4a4a;
  --dex-okd-color-content-interactive-subtle: #757575;
  --dex-okd-color-content-interactive-hovered: #212121;
  --dex-okd-color-content-static-subtle: #5e5e5e;
  --dex-okd-color-content-interactive-pressed: #000;
  --dex-okd-color-content-static-inverse: #fff;
  --dex-okd-color-content-static-highlight: var(--global-color-highlight);
  --dex-okd-color-content-static-placeholder: rgba(0, 0, 0, .22);
  --dex-okd-color-content-interactive-active: #000;
  --dex-okd-color-content-interactive-selected: #000;
  --dex-okd-color-content-interactive-error: #ba2133;
  --dex-okd-color-content-interactive-disabled: rgba(0, 0, 0, .14);
  --dex-okd-color-content-info-default: #212121;
  --dex-okd-color-content-info-subtle: #757575;
  --dex-okd-color-content-warning-default: #ba5d00;
  --dex-okd-color-content-warning-subtle: #ffedcb;
  --dex-okd-color-content-success-default: #2b6d17;
  --dex-okd-color-content-success-subtle: #e9f4d1;
  --dex-okd-color-content-danger-default: #ba2133;
  --dex-okd-color-content-danger-subtle: #fee0e3;
  --dex-okd-color-content-illustration-default: #000;
  --dex-okd-color-content-dataviz-categorical-1: var(--global-color-feature-default);
  --dex-okd-color-content-dataviz-categorical-2: #0b5bcb;
  --dex-okd-color-content-dataviz-categorical-3: #e28400;
  --dex-okd-color-content-dataviz-categorical-4: #dbb01d;
  --dex-okd-color-content-dataviz-categorical-5: #9543ff;
  --dex-okd-color-content-dataviz-categorical-6: #5e5e5e;
  --dex-okd-color-content-dataviz-categorical-7: #858585;
  --dex-okd-color-content-dataviz-categorical-8: #afafaf;
  --dex-okd-color-content-illustration-inverse: #fff;
  --dex-okd-color-content-illustration-experience: var(--global-color-experience-default);
  --dex-okd-color-content-illustration-highlight: var(--global-color-highlight);
  --dex-okd-color-global-alpha-matching-5: hsla(0, 0%, 100%, .05);
  --dex-okd-color-global-alpha-matching-10: hsla(0, 0%, 100%, .1);
  --dex-okd-color-global-alpha-matching-20: hsla(0, 0%, 100%, .2);
  --dex-okd-color-global-alpha-matching-30: hsla(0, 0%, 100%, .3);
  --dex-okd-color-global-alpha-matching-40: hsla(0, 0%, 100%, .4);
  --dex-okd-color-global-alpha-matching-50: hsla(0, 0%, 100%, .5);
  --dex-okd-color-global-alpha-matching-60: hsla(0, 0%, 100%, .6);
  --dex-okd-color-global-alpha-matching-70: hsla(0, 0%, 100%, .7);
  --dex-okd-color-global-alpha-matching-80: hsla(0, 0%, 100%, .8);
  --dex-okd-color-global-alpha-matching-90: hsla(0, 0%, 100%, .9);
  --dex-okd-color-global-alpha-inverse-5: rgba(0, 0, 0, .03);
  --dex-okd-color-global-alpha-pnl-profit: var(--global-color-profit-alpha);
  --dex-okd-color-global-alpha-pnl-loss: var(--global-color-loss-alpha);
  --dex-okd-color-global-alpha-feature-1: rgba(43, 109, 23, .16);
  --dex-okd-color-global-alpha-inverse-10: rgba(0, 0, 0, .06);
  --dex-okd-color-global-alpha-inverse-20: rgba(0, 0, 0, .14);
  --dex-okd-color-global-alpha-inverse-30: rgba(0, 0, 0, .22);
  --dex-okd-color-global-alpha-inverse-40: rgba(0, 0, 0, .32);
  --dex-okd-color-global-alpha-inverse-50: rgba(0, 0, 0, .44);
  --dex-okd-color-global-alpha-inverse-60: rgba(0, 0, 0, .57);
  --dex-okd-color-global-alpha-inverse-70: rgba(0, 0, 0, .7);
  --dex-okd-color-global-alpha-inverse-80: rgba(0, 0, 0, .8);
  --dex-okd-color-global-alpha-inverse-90: rgba(0, 0, 0, .9);
  --dex-okd-color-surface-pnl-profit-default: var(--global-color-profit-surface-default);
  --dex-okd-color-surface-pnl-profit-hovered: var(--global-color-profit-surface-hovered);
  --dex-okd-color-surface-pnl-profit-pressed: var(--global-color-profit-surface-pressed);
  --dex-okd-color-surface-pnl-profit-tint: var(--global-color-profit-tint);
  --dex-okd-color-surface-pnl-loss-default: var(--global-color-loss-surface-default);
  --dex-okd-color-surface-pnl-loss-hovered: var(--global-color-loss-surface-hovered);
  --dex-okd-color-surface-pnl-loss-pressed: var(--global-color-loss-surface-pressed);
  --dex-okd-color-surface-pnl-loss-tint: var(--global-color-loss-tint);
  --dex-okd-color-surface-pnl-neutral-default: var(--global-color-neutral-surface-default);
  --dex-okd-color-surface-pnl-neutral-hovered: var(--global-color-neutral-surface-hovered);
  --dex-okd-color-surface-pnl-neutral-pressed: var(--global-color-neutral-surface-pressed);
  --dex-okd-color-surface-interactive-feature-default: var(--global-color-feature-default);
  --dex-okd-color-surface-interactive-experience-default: var(--global-color-experience-default);
  --dex-okd-color-surface-interactive-experience-hovered: var(--global-color-experience-hovered);
  --dex-okd-color-surface-interactive-experience-pressed: var(--global-color-experience-pressed);
  --dex-okd-color-surface-interactive-feature-hovered: var(--global-color-feature-hovered);
  --dex-okd-color-surface-interactive-feature-pressed: var(--global-color-feature-pressed);
  --dex-okd-color-surface-pnl-loss-graph: var(--global-color-loss-graph);
  --dex-okd-color-surface-structural-feature: var(--global-color-feature-default);
  --dex-okd-color-surface-structural-experience: var(--global-color-experience-default);
  --dex-okd-color-border-interactive-feature-default: var(--global-color-feature-default);
  --dex-okd-color-border-interactive-feature-hovered: var(--global-color-feature-hovered);
  --dex-okd-color-border-interactive-feature-pressed: var(--global-color-feature-pressed);
  --dex-okd-color-border-static-feature: var(--global-color-feature-default);
  --dex-okd-color-content-static-subtler: #858585;
  --dex-okd-color-content-static-feature: var(--global-color-feature-default);
  --dex-okd-color-content-static-experience: var(--global-color-experience-default);
  --dex-okd-color-content-pnl-profit-default: var(--global-color-profit-default);
  --dex-okd-color-content-illustration-feature: var(--global-color-feature-default);
  --dex-okd-color-content-pnl-profit-oncolor: var(--global-color-profit-oncolor);
  --dex-okd-color-content-pnl-loss-default: var(--global-color-loss-default);
  --dex-okd-color-content-pnl-loss-oncolor: var(--global-color-loss-oncolor);
  --dex-okd-color-content-pnl-neutral-default: var(--global-color-neutral-default);
  --dex-okd-color-content-pnl-neutral-oncolor: var(--global-color-neutral-oncolor);
  --dex-okd-color-surface-pnl-profit-graph: var(--global-color-profit-graph);
  --dex-okd-color-surface-pnl-neutral-graph: var(--global-color-neutral-graph);
  --dex-okd-color-border-interactive-experience-default: var(--global-color-experience-default);
  --dex-okd-color-border-interactive-experience-hovered: var(--global-color-experience-hovered);
  --dex-okd-color-border-interactive-experience-pressed: var(--global-color-experience-pressed);
  --dex-okd-color-content-interactive-feature-default: var(--global-color-feature-default);
  --dex-okd-color-content-interactive-feature-hovered: var(--global-color-feature-hovered);
  --dex-okd-color-content-interactive-feature-pressed: var(--global-color-feature-pressed);
  --dex-okd-color-content-interactive-experience-default: var(--global-color-experience-default);
  --dex-okd-color-content-interactive-experience-alternative: var(--global-color-experience-alternative);
  --dex-okd-color-content-interactive-experience-accent: var(--global-color-experience-accent);
  --dex-okd-color-content-interactive-experience-hovered: var(--global-color-experience-hovered);
  --dex-okd-color-content-interactive-experience-pressed: var(--global-color-experience-pressed);
  --dex-okd-color-content-interactive-experience-inverse: var(--global-color-experience-inverse);
  --dex-okd-color-content-interactive-feature-inverse-default: var(--global-color-feature-primary-inverse-default);
  --dex-okd-color-content-interactive-feature-inverse-hovered: var(--global-color-feature-primary-inverse-hovered);
  --dex-okd-color-content-interactive-feature-inverse-pressed: var(--global-color-feature-primary-inverse-pressed);
  --dex-okd-color-surface-interactive-feature-inverse-default: var(--global-color-feature-primary-inverse-default);
  --dex-okd-color-surface-interactive-feature-inverse-hovered: var(--global-color-feature-primary-inverse-hovered);
  --dex-okd-color-surface-interactive-feature-inverse-pressed: var(--global-color-feature-primary-inverse-pressed);
  --dex-okd-color-border-pnl-loss-default: var(--global-color-loss-default);
  --dex-okd-color-border-pnl-loss-graph: var(--global-color-loss-graph);
  --dex-okd-color-border-pnl-profit-default: var(--global-color-profit-default);
  --dex-okd-color-border-pnl-profit-graph: var(--global-color-profit-graph);
  --dex-okd-color-border-pnl-neutral-graph: var(--global-color-neutral-graph);
  --dex-okd-color-content-static-notification: #e05a6a;
  --dex-okd-color-surface-interactive-unselected-default: rgba(0, 0, 0, .32);
  --dex-okd-color-surface-structural-elevated-layer-1: #f6f6f6;
  --dex-okd-color-surface-interactive-destructive-default: #e05a6a;
  --dex-okd-color-surface-interactive-destructive-hovered: #d33a4c;
  --dex-okd-color-surface-interactive-destructive-pressed: #ba2133;
  --dex-okd-color-surface-structural-web-only-base: #f6f6f6;
  --dex-okd-color-surface-structural-web-only-layer-1: #fff;
  --dex-okd-color-global-fixed-shadow: rgba(0, 0, 0, .16);
  --dex-okd-color-surface-interactive-destructive-subtle-default: #fee0e3;
  --dex-okd-color-surface-interactive-destructive-subtle-hovered: #ffbec5;
  --dex-okd-color-surface-interactive-destructive-subtle-pressed: #ff8f9c;
  --dex-okd-color-global-fixed-always-light-20: hsla(0, 0%, 100%, .2);
  --dex-okd-color-surface-pnl-profit-default-new: var(--global-color-profit-surface-default-new);
  --dex-okd-color-surface-pnl-profit-emphasis: var(--global-color-profit-surface-emphasis);
  --dex-okd-color-surface-pnl-loss-default-new: var(--global-color-loss-surface-default-new);
  --dex-okd-color-surface-pnl-loss-emphasis: var(--global-color-loss-surface-emphasis);
  --dex-okd-color-content-pnl-profit-oncolor-default: var(--global-color-profit-default);
  --dex-okd-color-content-pnl-profit-oncolor-emphasis: var(--global-color-profit-oncolor);
  --dex-okd-color-content-pnl-loss-oncolor-default: var(--global-color-loss-default);
  --dex-okd-color-content-pnl-loss-oncolor-emphasis: var(--global-color-loss-oncolor);
  --dex-okd-color-surface-pnl-profit-gradient-max: var(--global-color-profit-gradient-max);
  --dex-okd-color-surface-pnl-profit-gradient-min: var(--global-color-profit-gradient-min);
  --dex-okd-color-surface-pnl-loss-gradient-max: rgba(252, 70, 171, .2);
  --dex-okd-color-surface-pnl-loss-gradient-min: rgba(252, 70, 171, 0);
  --dex-okd-font-size-base: 16px;
  --dex-okd-font-size-md: 14px;
  --dex-okd-font-size-xs: 12px;
  --dex-okd-line-height-base: 20px;
  --dex-okd-line-height-md: 20px;
  --dex-okd-line-height-xs: 16px;
  --dex-okd-shadow-none: 0 0 0 0 transparent;
  --dex-okd-shadow-xs: 0 0 0 1px #0000000d;
  --dex-okd-shadow-sm: 0 1px 2px 0 #0000000d;
  --dex-okd-shadow-default: 0 1px 3px 0 #0000001a, 0 1px 2px 0 #0000000f;
  --dex-okd-shadow-md: 0 4px 6px -1px #0000001a, 0 2px 4px -1px #0000000f;
  --dex-okd-shadow-lg: 0 10px 15px -3px #0000001a, 0 4px 6px -2px #0000000d;
  --dex-okd-shadow-xl: 0 20px 25px -5px #0000001a, 0 10px 10px -5px #0000000a;
  --dex-okd-shadow-2xl: 0 25px 50px -12px #00000040;
  --dex-okd-border-radius-none: 0;
  --dex-okd-border-radius-sm: 2px;
  --dex-okd-border-radius-md: 4px;
  --dex-okd-border-radius-lg: 6px;
  --dex-okd-border-radius-xl: 8px;
  --dex-okd-border-radius-xxl: 10px;
  --dex-okd-border-radius-xxxl: 12px;
  --dex-okd-font-family: HarmonyOS Sans, SF Pro Text, SF Pro Icons, Arial, Helvetica Neue, Helvetica, sans-serif;
  --dex-okd-text-display-lg-font-size: 56px;
  --dex-okd-text-display-lg-font-weight: 500;
  --dex-okd-text-display-lg-line-height: 1.32;
  --dex-okd-text-display-md-font-size: 40px;
  --dex-okd-text-display-md-font-weight: 500;
  --dex-okd-text-display-md-line-height: 52px;
  --dex-okd-text-display-sm-font-size: 40px;
  --dex-okd-text-display-sm-font-weight: 500;
  --dex-okd-text-display-sm-line-height: 52px;
  --dex-okd-text-heading-lg-font-size: 30px;
  --dex-okd-text-heading-lg-font-weight: 500;
  --dex-okd-text-heading-lg-line-height: 40px;
  --dex-okd-text-heading-md-font-size: 24px;
  --dex-okd-text-heading-md-font-weight: 500;
  --dex-okd-text-heading-md-line-height: 30px;
  --dex-okd-text-heading-sm-font-size: 18px;
  --dex-okd-text-heading-sm-font-weight: 500;
  --dex-okd-text-heading-sm-line-height: 24px;
  --dex-okd-text-heading-xl-font-size: 36px;
  --dex-okd-text-heading-xl-line-height: 1.32;
  --dex-okd-text-heading-xl-font-weight: 600;
  --dex-okd-text-heading-xxl-font-size: 40px;
  --dex-okd-text-heading-xxl-line-height: 1.32;
  --dex-okd-text-heading-xxl-font-weight: 600;
  --dex-okd-text-heading-overline-font-size: 12px;
  --dex-okd-text-heading-overline-line-height: 15px;
  --dex-okd-text-heading-overline-font-weight: 500;
  --dex-okd-text-body-sm-regular-font-size: 14px;
  --dex-okd-text-body-sm-regular-font-weight: 400;
  --dex-okd-text-body-sm-regular-line-height: 21px;
  --dex-okd-text-body-sm-bold-font-size: 14px;
  --dex-okd-text-body-sm-bold-font-weight: 500;
  --dex-okd-text-body-sm-bold-line-height: 21px;
  --dex-okd-text-body-md-regular-font-size: 16px;
  --dex-okd-text-body-md-regular-font-weight: 400;
  --dex-okd-text-body-md-regular-line-height: 24px;
  --dex-okd-text-body-md-bold-font-size: 16px;
  --dex-okd-text-body-md-bold-font-weight: 500;
  --dex-okd-text-body-md-bold-line-height: 24px;
  --dex-okd-text-body-xs-regular-font-size: 12px;
  --dex-okd-text-body-xs-regular-font-weight: 400;
  --dex-okd-text-body-xs-regular-line-height: 18px;
  --dex-okd-text-body-xs-bold-font-size: 12px;
  --dex-okd-text-body-xs-bold-font-weight: 500;
  --dex-okd-text-body-xs-bold-line-height: 18px;
  --dex-okd-font-weight-400: 400;
  --dex-okd-font-weight-500: 500;
  --dex-okd-font-weight-600: 600;
  --dex-okd-font-weight-700: 700;
  --dex-okd-font-weight-800: 800;
  --dex-okd-font-weight-900: 900;
  --dex-okd-font-weight-regular: 400;
  --dex-okd-font-weight-medium: 500;
  --dex-okd-font-weight-bold: 700
}

.theme-dark {
  --dex-okd-color-gray-050: #000;
  --dex-okd-color-gray-100: #2e2e2e;
  --dex-okd-color-gray-200: #404040;
  --dex-okd-color-gray-300: #6c6c6c;
  --dex-okd-color-gray-400: #909090;
  --dex-okd-color-gray-500: #b0b0b0;
  --dex-okd-color-gray-600: #ccc;
  --dex-okd-color-gray-700: #e3e3e3;
  --dex-okd-color-gray-800: #f0f0f0;
  --dex-okd-color-gray-900: #fafafa;
  --dex-okd-color-blue-050: #051738;
  --dex-okd-color-blue-100: #082356;
  --dex-okd-color-blue-200: #0c3178;
  --dex-okd-color-blue-300: #0f3c94;
  --dex-okd-color-blue-400: #1148b0;
  --dex-okd-color-blue-500: #1453cc;
  --dex-okd-color-blue-600: #175fe8;
  --dex-okd-color-blue-700: #1e6bff;
  --dex-okd-color-blue-800: #3077ff;
  --dex-okd-color-blue-900: #4283ff;
  --dex-okd-color-green-050: #002b1f;
  --dex-okd-color-green-100: #062b12;
  --dex-okd-color-green-200: #0c5625;
  --dex-okd-color-green-300: #138037;
  --dex-okd-color-green-400: #19ab4a;
  --dex-okd-color-green-500: #25a750;
  --dex-okd-color-green-600: #4cde7d;
  --dex-okd-color-green-700: #79e69d;
  --dex-okd-color-green-800: #a5efbe;
  --dex-okd-color-green-900: #d2f7de;
  --dex-okd-color-red-050: #270b12;
  --dex-okd-color-red-100: #300e17;
  --dex-okd-color-red-200: #601d2e;
  --dex-okd-color-red-300: #902b44;
  --dex-okd-color-red-400: #c03a5b;
  --dex-okd-color-red-500: #f04872;
  --dex-okd-color-red-600: #f76489;
  --dex-okd-color-red-700: #f994ae;
  --dex-okd-color-red-800: #f9b6c7;
  --dex-okd-color-red-900: #fff8f9;
  --dex-okd-color-orange-050: #361604;
  --dex-okd-color-orange-100: #532206;
  --dex-okd-color-orange-200: #743008;
  --dex-okd-color-orange-300: #8f3b0a;
  --dex-okd-color-orange-400: #aa460c;
  --dex-okd-color-orange-500: #c5510e;
  --dex-okd-color-orange-600: #e15c0f;
  --dex-okd-color-orange-700: #f76816;
  --dex-okd-color-orange-800: #f87428;
  --dex-okd-color-orange-900: #fa8c4d;
  --dex-okd-color-yellow-050: #2d2104;
  --dex-okd-color-yellow-100: #493603;
  --dex-okd-color-yellow-200: #674b04;
  --dex-okd-color-yellow-300: #7f5d05;
  --dex-okd-color-yellow-400: #966e06;
  --dex-okd-color-yellow-500: #ae8007;
  --dex-okd-color-yellow-600: #c69208;
  --dex-okd-color-yellow-700: #dba20e;
  --dex-okd-color-yellow-800: #dea921;
  --dex-okd-color-yellow-900: #e0b134;
  --dex-okd-color-text-white: #fff;
  --dex-okd-color-text-black: #1f2933;
  --dex-okd-color-background-1: #121212;
  --dex-okd-color-background-2: #1a1a1a;
  --dex-okd-color-transparent: transparent;
  --dex-okd-color-white: #fff;
  --dex-okd-color-black: #000;
  --dex-okd-color-line-muted: #2e2e2e;
  --dex-okd-color-line-amplifed: #6c6c6c;
  --dex-okd-color-line-secondary: #404040;
  --dex-okd-color-text-lighter: #6c6c6c;
  --dex-okd-color-text-light: #909090;
  --dex-okd-color-text-secondary: #e3e3e3;
  --dex-okd-color-text-amplifed: #fafafa;
  --dex-okd-color-background-3: #242424;
  --dex-okd-color-fq-blue-lv1: #3077ff;
  --dex-okd-color-fq-blue-lv2: #1e6bff;
  --dex-okd-color-fq-green-lv1: #1fd65c;
  --dex-okd-color-fq-red-lv1: #f04872;
  --dex-okd-color-fq-orange-lv1: #f76816;
  --dex-okd-color-prefer-red-chart: #f04872;
  --dex-okd-color-prefer-red-bg: #ca3f64;
  --dex-okd-color-prefer-green-chart: #1fd65c;
  --dex-okd-color-prefer-green-bg: #25a750;
  --dex-okd-color-prefer-red-text: #ca3f64;
  --dex-okd-color-prefer-green-text: #25a750;
  --dex-okd-color-branded-primary: #bcff2f;
  --dex-okd-color-fq-critical: #f04872;
  --dex-okd-color-fq-positive: #25a750;
  --dex-okd-color-fq-warning: #f76816;
  --dex-okd-color-fq-accent: #1e6bff;
  --dex-okd-color-fq-neutral: #fafafa;
  --dex-okd-color-prefer-neutral-bg: #909090;
  --dex-okd-color-prefer-neutral-text: #909090;
  --dex-okd-color-background-base-primary: #000;
  --dex-okd-color-background-base-secondary: #121212;
  --dex-okd-color-background-surface-primary: #1d1d1d;
  --dex-okd-color-background-surface-secondary: #121212;
  --dex-okd-color-background-surface-pressed: #383838;
  --dex-okd-color-background-surface-disable: #0e0e0e;
  --dex-okd-color-background-scrim: rgba(0, 0, 0, .68);
  --dex-okd-color-container-primary: #272727;
  --dex-okd-color-container-secondary: #272727;
  --dex-okd-color-container-tertiary: #383838;
  --dex-okd-color-container-contrast: #414141;
  --dex-okd-color-container-inverse: #fafafa;
  --dex-okd-color-content-primary: #fff;
  --dex-okd-color-content-secondary: #e6e6e6;
  --dex-okd-color-content-tertiary: #b3b3b3;
  --dex-okd-color-content-contrast: #909090;
  --dex-okd-color-content-disabled: #5b5b5b;
  --dex-okd-color-content-inverse: #000;
  --dex-okd-color-border-primary: #383838;
  --dex-okd-color-border-secondary: #4d4d4d;
  --dex-okd-color-border-contrast: #000;
  --dex-okd-color-border-selected: #fff;
  --dex-okd-color-semantic-neutral: #fff;
  --dex-okd-color-semantic-notice: #ffb117;
  --dex-okd-color-semantic-positive: #25a750;
  --dex-okd-color-semantic-negative: #ca3f64;
  --dex-okd-color-semantic-informative: #8a91ff;
  --dex-okd-color-semantic-highlight: #bcff2f;
  --dex-okd-color-dvp-neutral: hsla(0, 0%, 100%, .76);
  --dex-okd-color-dvp-profit: #25a750;
  --dex-okd-color-dvp-loss: #ca3f64;
  --dex-okd-color-categorical-01: #5f62ff;
  --dex-okd-color-categorical-02: #ffb117;
  --dex-okd-color-categorical-03: #bcff2f;
  --dex-okd-color-categorical-04: #00bc4b;
  --dex-okd-color-categorical-05: #f5384f;
  --dex-okd-color-transparent-white: transparent;
  --dex-okd-color-transparent-black: hsla(0, 0%, 100%, .02);
  --dex-okd-color-common-transparent: hsla(0, 0%, 100%, 0);
  --dex-okd-color-container-lv2: #1a1a1a;
  --dex-okd-color-alert-info: #2e2e2e;
  --dex-okd-color-alert-success: #002b1f;
  --dex-okd-color-alert-warning: #361604;
  --dex-okd-color-alert-error: #270b12;
  --dex-okd-color-common-background-2: #383838;
  --dex-okd-color-data-visualization-category-01: #5f62ff;
  --dex-okd-color-data-visualization-category-02: #ffb117;
  --dex-okd-color-data-visualization-category-03: #bcff2f;
  --dex-okd-color-data-visualization-category-04: #00bc4b;
  --dex-okd-color-data-visualization-category-05: #f5384f;
  --dex-okd-color-preference-loss: #ca3f64;
  --dex-okd-color-preference-profit: #25a750;
  --dex-okd-color-preference-neutral: hsla(0, 0%, 100%, .76);
  --dex-okd-color-border-focus: #fff;
  --dex-okd-color-background-base-primary_alternative: #000;
  --dex-okd-color-link-content: #8a91ff;
  --dex-okd-color-link-accent-content-primary: #bcff2f;
  --dex-okd-color-background-surface-contrast: #272727;
  --dex-okd-color-background-surface-brand: #bcff2f;
  --dex-okd-color-border-tertiary: #0e0e0e;
  --dex-okd-color-content-brand: #bcff2f;
  --dex-okd-color-modal-primary: #0e0e0e;
  --dex-okd-color-modal-secondary: #272727;
  --dex-okd-color-modal-tertiary: #383838;
  --dex-okd-color-modal-contrast: #4d4d4d;
  --dex-okd-color-card-primary: #0e0e0e;
  --dex-okd-color-card-secondary: #121212;
  --dex-okd-color-brand-primary: #121212;
  --dex-okd-color-brand-primary-alternative: #bcff2f;
  --dex-okd-color-brand-secondary: #272727;
  --dex-okd-color-brand-tertiary: #383838;
  --dex-okd-color-brand-content: #e6ffb0;
  --dex-okd-color-brand-content-contrast: #000;
  --dex-okd-color-global-fixed-always-dark: #000;
  --dex-okd-color-global-fixed-always-light: #fff;
  --dex-okd-color-surface-structural-subbase: #121212;
  --dex-okd-color-surface-info-default: #b8b8b8;
  --dex-okd-color-surface-info-subtle: #121212;
  --dex-okd-color-surface-warning-default: #f5a915;
  --dex-okd-color-surface-warning-subtle: #4d3200;
  --dex-okd-color-surface-success-default: #3c8f24;
  --dex-okd-color-surface-success-subtle: #192400;
  --dex-okd-color-surface-danger-default: #ff5d73;
  --dex-okd-color-surface-danger-subtle: #420a10;
  --dex-okd-color-surface-interactive-default: hsla(0, 0%, 100%, .13);
  --dex-okd-color-surface-interactive-hovered: hsla(0, 0%, 100%, .16);
  --dex-okd-color-surface-interactive-pressed: hsla(0, 0%, 100%, .22);
  --dex-okd-color-surface-interactive-disabled: hsla(0, 0%, 100%, .08);
  --dex-okd-color-surface-interactive-oncolor-default: hsla(0, 0%, 100%, .1);
  --dex-okd-color-surface-interactive-oncolor-hovered: hsla(0, 0%, 100%, .15);
  --dex-okd-color-surface-interactive-oncolor-pressed: hsla(0, 0%, 100%, .2);
  --dex-okd-color-surface-interactive-emphasis-default: hsla(0, 0%, 100%, .99);
  --dex-okd-color-surface-interactive-emphasis-hovered: hsla(0, 0%, 100%, .8);
  --dex-okd-color-surface-interactive-emphasis-pressed: hsla(0, 0%, 100%, .7);
  --dex-okd-color-surface-interactive-emphasis-disabled: hsla(0, 0%, 100%, .08);
  --dex-okd-color-surface-interactive-selected-default: #fff;
  --dex-okd-color-surface-interactive-selected-subtle: hsla(0, 0%, 100%, .13);
  --dex-okd-color-surface-interactive-selected-oncolor: hsla(0, 0%, 100%, .1);
  --dex-okd-color-surface-structural-base: #000;
  --dex-okd-color-surface-structural-layer-1: #121212;
  --dex-okd-color-surface-structural-layer-2: #2c2c2c;
  --dex-okd-color-surface-structural-layer-3: #3f3f3f;
  --dex-okd-color-surface-structural-highlight: var(--global-color-highlight);
  --dex-okd-color-surface-structural-inverse: #fff;
  --dex-okd-color-surface-structural-elevated-default: #171717;
  --dex-okd-color-surface-structural-elevated-contrast: #343434;
  --dex-okd-color-surface-structural-overlay: rgba(0, 0, 0, .6);
  --dex-okd-color-border-static-default: hsla(0, 0%, 100%, .22);
  --dex-okd-color-border-static-subtle: hsla(0, 0%, 100%, .13);
  --dex-okd-color-border-static-dotted: hsla(0, 0%, 100%, .4);
  --dex-okd-color-border-interactive-default: hsla(0, 0%, 100%, .4);
  --dex-okd-color-border-interactive-hovered: #cfcfcf;
  --dex-okd-color-border-interactive-pressed: #fff;
  --dex-okd-color-border-interactive-focused: #fff;
  --dex-okd-color-border-interactive-selected: #fff;
  --dex-okd-color-border-interactive-error: #f57a8a;
  --dex-okd-color-border-interactive-emphasis: #b8b8b8;
  --dex-okd-color-border-interactive-oncolor: #2c2c2c;
  --dex-okd-color-border-static-emphasis: #b8b8b8;
  --dex-okd-color-border-static-experience: var(--global-color-experience-default);
  --dex-okd-color-border-static-highlight: var(--global-color-highlight);
  --dex-okd-color-border-static-overlay: hsla(0, 0%, 100%, .1);
  --dex-okd-color-border-interactive-disabled: hsla(0, 0%, 100%, .22);
  --dex-okd-color-border-info-default: #ebebeb;
  --dex-okd-color-border-info-subtle: #7d7d7d;
  --dex-okd-color-border-warning-default: #ffc452;
  --dex-okd-color-border-warning-subtle: #4d3200;
  --dex-okd-color-border-success-default: #49a92d;
  --dex-okd-color-border-success-subtle: #192400;
  --dex-okd-color-border-danger-default: #f57a8a;
  --dex-okd-color-border-danger-subtle: #420a10;
  --dex-okd-color-content-static-default: #fff;
  --dex-okd-color-content-interactive-default: #b8b8b8;
  --dex-okd-color-content-interactive-subtle: #7d7d7d;
  --dex-okd-color-content-interactive-hovered: #ebebeb;
  --dex-okd-color-content-static-subtle: #969696;
  --dex-okd-color-content-interactive-pressed: #fff;
  --dex-okd-color-content-static-inverse: #000;
  --dex-okd-color-content-static-highlight: var(--global-color-highlight);
  --dex-okd-color-content-static-placeholder: hsla(0, 0%, 100%, .3);
  --dex-okd-color-content-interactive-active: #fff;
  --dex-okd-color-content-interactive-selected: #fff;
  --dex-okd-color-content-interactive-error: #f57a8a;
  --dex-okd-color-content-interactive-disabled: hsla(0, 0%, 100%, .22);
  --dex-okd-color-content-info-default: #ebebeb;
  --dex-okd-color-content-info-subtle: #7d7d7d;
  --dex-okd-color-content-warning-default: #ffc452;
  --dex-okd-color-content-warning-subtle: #4d3200;
  --dex-okd-color-content-success-default: #49a92d;
  --dex-okd-color-content-success-subtle: #192400;
  --dex-okd-color-content-danger-default: #f57a8a;
  --dex-okd-color-content-danger-subtle: #420a10;
  --dex-okd-color-content-illustration-default: #fff;
  --dex-okd-color-content-dataviz-categorical-1: var(--global-color-feature-default);
  --dex-okd-color-content-dataviz-categorical-2: #277ae7;
  --dex-okd-color-content-dataviz-categorical-3: #ffb729;
  --dex-okd-color-content-dataviz-categorical-4: #edc746;
  --dex-okd-color-content-dataviz-categorical-5: #ac6cff;
  --dex-okd-color-content-dataviz-categorical-6: #969696;
  --dex-okd-color-content-dataviz-categorical-7: #636363;
  --dex-okd-color-content-dataviz-categorical-8: #454545;
  --dex-okd-color-content-illustration-inverse: #000;
  --dex-okd-color-content-illustration-experience: var(--global-color-experience-default);
  --dex-okd-color-content-illustration-highlight: var(--global-color-highlight);
  --dex-okd-color-global-alpha-matching-5: rgba(0, 0, 0, .05);
  --dex-okd-color-global-alpha-matching-10: rgba(0, 0, 0, .1);
  --dex-okd-color-global-alpha-matching-20: rgba(0, 0, 0, .2);
  --dex-okd-color-global-alpha-matching-30: rgba(0, 0, 0, .3);
  --dex-okd-color-global-alpha-matching-40: rgba(0, 0, 0, .4);
  --dex-okd-color-global-alpha-matching-50: rgba(0, 0, 0, .5);
  --dex-okd-color-global-alpha-matching-60: rgba(0, 0, 0, .6);
  --dex-okd-color-global-alpha-matching-70: rgba(0, 0, 0, .7);
  --dex-okd-color-global-alpha-matching-80: rgba(0, 0, 0, .8);
  --dex-okd-color-global-alpha-matching-90: rgba(0, 0, 0, .9);
  --dex-okd-color-global-alpha-inverse-5: hsla(0, 0%, 100%, .08);
  --dex-okd-color-global-alpha-pnl-profit: var(--global-color-profit-alpha);
  --dex-okd-color-global-alpha-pnl-loss: var(--global-color-loss-alpha);
  --dex-okd-color-global-alpha-feature-1: rgba(188, 255, 47, .16);
  --dex-okd-color-global-alpha-inverse-10: hsla(0, 0%, 100%, .13);
  --dex-okd-color-global-alpha-inverse-20: hsla(0, 0%, 100%, .22);
  --dex-okd-color-global-alpha-inverse-30: hsla(0, 0%, 100%, .3);
  --dex-okd-color-global-alpha-inverse-40: hsla(0, 0%, 100%, .4);
  --dex-okd-color-global-alpha-inverse-50: hsla(0, 0%, 100%, .5);
  --dex-okd-color-global-alpha-inverse-60: hsla(0, 0%, 100%, .6);
  --dex-okd-color-global-alpha-inverse-70: hsla(0, 0%, 100%, .7);
  --dex-okd-color-global-alpha-inverse-80: hsla(0, 0%, 100%, .8);
  --dex-okd-color-global-alpha-inverse-90: hsla(0, 0%, 100%, .9);
  --dex-okd-color-surface-pnl-profit-default: var(--global-color-profit-surface-default);
  --dex-okd-color-surface-pnl-profit-hovered: var(--global-color-profit-surface-hovered);
  --dex-okd-color-surface-pnl-profit-pressed: var(--global-color-profit-surface-pressed);
  --dex-okd-color-surface-pnl-profit-tint: var(--global-color-profit-tint);
  --dex-okd-color-surface-pnl-loss-default: var(--global-color-loss-surface-default);
  --dex-okd-color-surface-pnl-loss-hovered: var(--global-color-loss-surface-hovered);
  --dex-okd-color-surface-pnl-loss-pressed: var(--global-color-loss-surface-pressed);
  --dex-okd-color-surface-pnl-loss-tint: var(--global-color-loss-tint);
  --dex-okd-color-surface-pnl-neutral-default: var(--global-color-neutral-surface-default);
  --dex-okd-color-surface-pnl-neutral-hovered: var(--global-color-neutral-surface-hovered);
  --dex-okd-color-surface-pnl-neutral-pressed: var(--global-color-neutral-surface-pressed);
  --dex-okd-color-surface-interactive-feature-default: var(--global-color-feature-default);
  --dex-okd-color-surface-interactive-experience-default: var(--global-color-experience-default);
  --dex-okd-color-surface-interactive-experience-hovered: var(--global-color-experience-hovered);
  --dex-okd-color-surface-interactive-experience-pressed: var(--global-color-experience-pressed);
  --dex-okd-color-surface-interactive-feature-hovered: var(--global-color-feature-hovered);
  --dex-okd-color-surface-interactive-feature-pressed: var(--global-color-feature-pressed);
  --dex-okd-color-surface-pnl-loss-graph: var(--global-color-loss-graph);
  --dex-okd-color-surface-structural-feature: var(--global-color-feature-default);
  --dex-okd-color-surface-structural-experience: var(--global-color-experience-default);
  --dex-okd-color-border-interactive-feature-default: var(--global-color-feature-default);
  --dex-okd-color-border-interactive-feature-hovered: var(--global-color-feature-hovered);
  --dex-okd-color-border-interactive-feature-pressed: var(--global-color-feature-pressed);
  --dex-okd-color-border-static-feature: var(--global-color-feature-default);
  --dex-okd-color-content-static-subtler: #636363;
  --dex-okd-color-content-static-feature: var(--global-color-feature-default);
  --dex-okd-color-content-static-experience: var(--global-color-experience-default);
  --dex-okd-color-content-pnl-profit-default: var(--global-color-profit-default);
  --dex-okd-color-content-illustration-feature: var(--global-color-feature-default);
  --dex-okd-color-content-pnl-profit-oncolor: var(--global-color-profit-oncolor);
  --dex-okd-color-content-pnl-loss-default: var(--global-color-loss-default);
  --dex-okd-color-content-pnl-loss-oncolor: var(--global-color-loss-oncolor);
  --dex-okd-color-content-pnl-neutral-default: var(--global-color-neutral-default);
  --dex-okd-color-content-pnl-neutral-oncolor: var(--global-color-neutral-oncolor);
  --dex-okd-color-surface-pnl-profit-graph: var(--global-color-profit-graph);
  --dex-okd-color-surface-pnl-neutral-graph: var(--global-color-neutral-graph);
  --dex-okd-color-border-interactive-experience-default: var(--global-color-experience-default);
  --dex-okd-color-border-interactive-experience-hovered: var(--global-color-experience-hovered);
  --dex-okd-color-border-interactive-experience-pressed: var(--global-color-experience-pressed);
  --dex-okd-color-content-interactive-feature-default: var(--global-color-feature-default);
  --dex-okd-color-content-interactive-feature-hovered: var(--global-color-feature-hovered);
  --dex-okd-color-content-interactive-feature-pressed: var(--global-color-feature-pressed);
  --dex-okd-color-content-interactive-experience-default: var(--global-color-experience-default);
  --dex-okd-color-content-interactive-experience-alternative: var(--global-color-experience-alternative);
  --dex-okd-color-content-interactive-experience-accent: var(--global-color-experience-accent);
  --dex-okd-color-content-interactive-experience-hovered: var(--global-color-experience-hovered);
  --dex-okd-color-content-interactive-experience-pressed: var(--global-color-experience-pressed);
  --dex-okd-color-content-interactive-experience-inverse: var(--global-color-experience-inverse);
  --dex-okd-color-content-interactive-feature-inverse-default: var(--global-color-feature-primary-inverse-default);
  --dex-okd-color-content-interactive-feature-inverse-hovered: var(--global-color-feature-primary-inverse-hovered);
  --dex-okd-color-content-interactive-feature-inverse-pressed: var(--global-color-feature-primary-inverse-pressed);
  --dex-okd-color-surface-interactive-feature-inverse-default: var(--global-color-feature-primary-inverse-default);
  --dex-okd-color-surface-interactive-feature-inverse-hovered: var(--global-color-feature-primary-inverse-hovered);
  --dex-okd-color-surface-interactive-feature-inverse-pressed: var(--global-color-feature-primary-inverse-pressed);
  --dex-okd-color-border-pnl-loss-default: var(--global-color-loss-default);
  --dex-okd-color-border-pnl-loss-graph: var(--global-color-loss-graph);
  --dex-okd-color-border-pnl-profit-default: var(--global-color-profit-default);
  --dex-okd-color-border-pnl-profit-graph: var(--global-color-profit-graph);
  --dex-okd-color-border-pnl-neutral-graph: var(--global-color-neutral-graph);
  --dex-okd-color-content-static-notification: #f5384f;
  --dex-okd-color-surface-interactive-unselected-default: hsla(0, 0%, 100%, .4);
  --dex-okd-color-surface-structural-elevated-layer-1: #2c2c2c;
  --dex-okd-color-surface-interactive-destructive-default: #f5384f;
  --dex-okd-color-surface-interactive-destructive-hovered: #ff5d73;
  --dex-okd-color-surface-interactive-destructive-pressed: #f57a8a;
  --dex-okd-color-surface-structural-web-only-base: #000;
  --dex-okd-color-surface-structural-web-only-layer-1: #121212;
  --dex-okd-color-global-fixed-shadow: rgba(0, 0, 0, .16);
  --dex-okd-color-surface-interactive-destructive-subtle-default: #420a10;
  --dex-okd-color-surface-interactive-destructive-subtle-hovered: #840916;
  --dex-okd-color-surface-interactive-destructive-subtle-pressed: #c8142a;
  --dex-okd-color-global-fixed-always-light-20: hsla(0, 0%, 100%, .2);
  --dex-okd-color-surface-pnl-profit-default-new: var(--global-color-profit-surface-default-new);
  --dex-okd-color-surface-pnl-profit-emphasis: var(--global-color-profit-surface-emphasis);
  --dex-okd-color-surface-pnl-loss-default-new: var(--global-color-loss-surface-default-new);
  --dex-okd-color-surface-pnl-loss-emphasis: var(--global-color-loss-surface-emphasis);
  --dex-okd-color-content-pnl-profit-oncolor-default: var(--global-color-profit-default);
  --dex-okd-color-content-pnl-profit-oncolor-emphasis: var(--global-color-profit-oncolor);
  --dex-okd-color-content-pnl-loss-oncolor-default: var(--global-color-loss-default);
  --dex-okd-color-content-pnl-loss-oncolor-emphasis: var(--global-color-loss-oncolor);
  --dex-okd-color-surface-pnl-profit-gradient-max: var(--global-color-profit-gradient-max);
  --dex-okd-color-surface-pnl-profit-gradient-min: var(--global-color-profit-gradient-min);
  --dex-okd-color-surface-pnl-loss-gradient-max: rgba(252, 70, 171, .2);
  --dex-okd-color-surface-pnl-loss-gradient-min: rgba(252, 70, 171, 0);
  --dex-okd-font-size-base: 16px;
  --dex-okd-font-size-md: 14px;
  --dex-okd-font-size-xs: 12px;
  --dex-okd-line-height-base: 20px;
  --dex-okd-line-height-md: 20px;
  --dex-okd-line-height-xs: 16px;
  --dex-okd-shadow-none: 0 0 0 0 transparent;
  --dex-okd-shadow-xs: 0 0 0 1px #0000000d;
  --dex-okd-shadow-sm: 0 1px 2px 0 #0000000d;
  --dex-okd-shadow-default: 0 1px 3px 0 #0000001a, 0 1px 2px 0 #0000000f;
  --dex-okd-shadow-md: 0 4px 6px -1px #0000001a, 0 2px 4px -1px #0000000f;
  --dex-okd-shadow-lg: 0 10px 15px -3px #0000001a, 0 4px 6px -2px #0000000d;
  --dex-okd-shadow-xl: 0 20px 25px -5px #0000001a, 0 10px 10px -5px #0000000a;
  --dex-okd-shadow-2xl: 0 25px 50px -12px #00000040;
  --dex-okd-border-radius-none: 0;
  --dex-okd-border-radius-sm: 2px;
  --dex-okd-border-radius-md: 4px;
  --dex-okd-border-radius-lg: 6px;
  --dex-okd-border-radius-xl: 8px;
  --dex-okd-border-radius-xxl: 10px;
  --dex-okd-border-radius-xxxl: 12px;
  --dex-okd-font-family: HarmonyOS Sans, SF Pro Text, SF Pro Icons, Arial, Helvetica Neue, Helvetica, sans-serif;
  --dex-okd-text-display-lg-font-size: 56px;
  --dex-okd-text-display-lg-font-weight: 500;
  --dex-okd-text-display-lg-line-height: 1.32;
  --dex-okd-text-display-md-font-size: 40px;
  --dex-okd-text-display-md-font-weight: 500;
  --dex-okd-text-display-md-line-height: 52px;
  --dex-okd-text-display-sm-font-size: 40px;
  --dex-okd-text-display-sm-font-weight: 500;
  --dex-okd-text-display-sm-line-height: 52px;
  --dex-okd-text-heading-lg-font-size: 30px;
  --dex-okd-text-heading-lg-font-weight: 500;
  --dex-okd-text-heading-lg-line-height: 40px;
  --dex-okd-text-heading-md-font-size: 24px;
  --dex-okd-text-heading-md-font-weight: 500;
  --dex-okd-text-heading-md-line-height: 30px;
  --dex-okd-text-heading-sm-font-size: 18px;
  --dex-okd-text-heading-sm-font-weight: 500;
  --dex-okd-text-heading-sm-line-height: 24px;
  --dex-okd-text-heading-xl-font-size: 36px;
  --dex-okd-text-heading-xl-line-height: 1.32;
  --dex-okd-text-heading-xl-font-weight: 600;
  --dex-okd-text-heading-xxl-font-size: 40px;
  --dex-okd-text-heading-xxl-line-height: 1.32;
  --dex-okd-text-heading-xxl-font-weight: 600;
  --dex-okd-text-heading-overline-font-size: 12px;
  --dex-okd-text-heading-overline-line-height: 15px;
  --dex-okd-text-heading-overline-font-weight: 500;
  --dex-okd-text-body-sm-regular-font-size: 14px;
  --dex-okd-text-body-sm-regular-font-weight: 400;
  --dex-okd-text-body-sm-regular-line-height: 21px;
  --dex-okd-text-body-sm-bold-font-size: 14px;
  --dex-okd-text-body-sm-bold-font-weight: 500;
  --dex-okd-text-body-sm-bold-line-height: 21px;
  --dex-okd-text-body-md-regular-font-size: 16px;
  --dex-okd-text-body-md-regular-font-weight: 400;
  --dex-okd-text-body-md-regular-line-height: 24px;
  --dex-okd-text-body-md-bold-font-size: 16px;
  --dex-okd-text-body-md-bold-font-weight: 500;
  --dex-okd-text-body-md-bold-line-height: 24px;
  --dex-okd-text-body-xs-regular-font-size: 12px;
  --dex-okd-text-body-xs-regular-font-weight: 400;
  --dex-okd-text-body-xs-regular-line-height: 18px;
  --dex-okd-text-body-xs-bold-font-size: 12px;
  --dex-okd-text-body-xs-bold-font-weight: 500;
  --dex-okd-text-body-xs-bold-line-height: 18px;
  --dex-okd-font-weight-400: 400;
  --dex-okd-font-weight-500: 500;
  --dex-okd-font-weight-600: 600;
  --dex-okd-font-weight-700: 700;
  --dex-okd-font-weight-800: 800;
  --dex-okd-font-weight-900: 900;
  --dex-okd-font-weight-regular: 400;
  --dex-okd-font-weight-medium: 500;
  --dex-okd-font-weight-bold: 700
}

.theme-light .dex-button-var,
.theme-light.dex-button-var {
  --dex-okd-button-primary-normal-default-background: #0569ff;
  --dex-okd-button-primary-normal-hover-background: #4992ff;
  --dex-okd-button-primary-normal-active-background: #005eea;
  --dex-okd-button-primary-normal-focus-background: #0569ff;
  --dex-okd-button-primary-normal-disabled-background: #ebebeb;
  --dex-okd-button-primary-normal-default-border-color: #0569ff;
  --dex-okd-button-primary-normal-hover-border-color: #4992ff;
  --dex-okd-button-primary-normal-active-border-color: #005eea;
  --dex-okd-button-primary-normal-focus-border-color: #0569ff;
  --dex-okd-button-primary-normal-disabled-border-color: #ebebeb;
  --dex-okd-button-primary-normal-default-font-color: #fff;
  --dex-okd-button-primary-normal-hover-font-color: #fff;
  --dex-okd-button-primary-normal-active-font-color: #fff;
  --dex-okd-button-primary-normal-focus-font-color: #fff;
  --dex-okd-button-primary-normal-disabled-font-color: #bdbdbd;
  --dex-okd-button-primary-normal-default-icon-color: #fff;
  --dex-okd-button-primary-normal-hover-icon-color: #fff;
  --dex-okd-button-primary-normal-active-icon-color: #fff;
  --dex-okd-button-primary-normal-focus-icon-color: #fff;
  --dex-okd-button-primary-normal-disabled-icon-color: #bdbdbd;
  --dex-okd-button-primary-normal-default-shadow: var(--dex-okd-shadow-none);
  --dex-okd-button-primary-normal-hover-shadow: var(--dex-okd-shadow-none);
  --dex-okd-button-primary-normal-active-shadow: var(--dex-okd-shadow-none);
  --dex-okd-button-primary-normal-focus-shadow: var(--dex-okd-shadow-sm), 0px 0px 0px 3px rgba(175, 207, 255, .45);
  --dex-okd-button-primary-normal-disabled-shadow: var(--dex-okd-shadow-none);
  --dex-okd-button-primary-normal-loader-track-color: #4992ff;
  --dex-okd-button-primary-normal-loader-mark-color: #fff;
  --dex-okd-button-primary-red-default-background: #91304a;
  --dex-okd-button-primary-red-hover-background: #f1507b;
  --dex-okd-button-primary-red-active-background: #602031;
  --dex-okd-button-primary-red-focus-background: #91304a;
  --dex-okd-button-primary-red-disabled-background: #ebebeb;
  --dex-okd-button-primary-red-default-border-color: #91304a;
  --dex-okd-button-primary-red-hover-border-color: #f1507b;
  --dex-okd-button-primary-red-active-border-color: #602031;
  --dex-okd-button-primary-red-focus-border-color: #602031;
  --dex-okd-button-primary-red-disabled-border-color: #ebebeb;
  --dex-okd-button-primary-red-default-font-color: #fff;
  --dex-okd-button-primary-red-hover-font-color: #fff;
  --dex-okd-button-primary-red-active-font-color: #fff;
  --dex-okd-button-primary-red-focus-font-color: #fff;
  --dex-okd-button-primary-red-disabled-font-color: #bdbdbd;
  --dex-okd-button-primary-red-default-icon-color: #fff;
  --dex-okd-button-primary-red-hover-icon-color: #fff;
  --dex-okd-button-primary-red-active-icon-color: #fff;
  --dex-okd-button-primary-red-focus-icon-color: #fff;
  --dex-okd-button-primary-red-disabled-icon-color: #bdbdbd;
  --dex-okd-button-primary-red-default-shadow: var(--dex-okd-shadow-sm);
  --dex-okd-button-primary-red-hover-shadow: var(--dex-okd-shadow-none);
  --dex-okd-button-primary-red-active-shadow: var(--dex-okd-shadow-none);
  --dex-okd-button-primary-red-focus-shadow: var(--dex-okd-shadow-sm), 0px 0px 0px 3px rgba(247, 150, 176, .45);
  --dex-okd-button-primary-red-disabled-shadow: var(--dex-okd-shadow-none);
  --dex-okd-button-primary-red-loader-track-color: #f1507b;
  --dex-okd-button-primary-red-loader-mark-color: #fff;
  --dex-okd-button-primary-green-default-background: #127837;
  --dex-okd-button-primary-green-hover-background: #31bd65;
  --dex-okd-button-primary-green-active-background: #0c5025;
  --dex-okd-button-primary-green-focus-background: #127837;
  --dex-okd-button-primary-green-disabled-background: #ebebeb;
  --dex-okd-button-primary-green-default-border-color: #127837;
  --dex-okd-button-primary-green-hover-border-color: #31bd65;
  --dex-okd-button-primary-green-active-border-color: #0c5025;
  --dex-okd-button-primary-green-focus-border-color: #127837;
  --dex-okd-button-primary-green-disabled-border-color: #ebebeb;
  --dex-okd-button-primary-green-default-font-color: #fff;
  --dex-okd-button-primary-green-hover-font-color: #fff;
  --dex-okd-button-primary-green-active-font-color: #fff;
  --dex-okd-button-primary-green-focus-font-color: #fff;
  --dex-okd-button-primary-green-disabled-font-color: #bdbdbd;
  --dex-okd-button-primary-green-default-icon-color: #fff;
  --dex-okd-button-primary-green-hover-icon-color: #fff;
  --dex-okd-button-primary-green-active-icon-color: #fff;
  --dex-okd-button-primary-green-focus-icon-color: #fff;
  --dex-okd-button-primary-green-disabled-icon-color: #bdbdbd;
  --dex-okd-button-primary-green-default-shadow: var(--dex-okd-shadow-sm);
  --dex-okd-button-primary-green-hover-shadow: var(--dex-okd-shadow-none);
  --dex-okd-button-primary-green-active-shadow: var(--dex-okd-shadow-none);
  --dex-okd-button-primary-green-focus-shadow: var(--dex-okd-shadow-sm), 0px 0px 0px 3px rgba(120, 222, 157, .45);
  --dex-okd-button-primary-green-disabled-shadow: var(--dex-okd-shadow-none);
  --dex-okd-button-primary-green-loader-track-color: #31bd65;
  --dex-okd-button-primary-green-loader-mark-color: #fff;
  --dex-okd-button-secondary-normal-default-background: #d1e3ff;
  --dex-okd-button-secondary-normal-hover-background: #f5f9ff;
  --dex-okd-button-secondary-normal-active-background: #afcfff;
  --dex-okd-button-secondary-normal-focus-background: #d1e3ff;
  --dex-okd-button-secondary-normal-disabled-background: #ebebeb;
  --dex-okd-button-secondary-normal-default-border-color: #d1e3ff;
  --dex-okd-button-secondary-normal-hover-border-color: #f5f9ff;
  --dex-okd-button-secondary-normal-active-border-color: #afcfff;
  --dex-okd-button-secondary-normal-focus-border-color: #d1e3ff;
  --dex-okd-button-secondary-normal-disabled-border-color: #ebebeb;
  --dex-okd-button-secondary-normal-default-font-color: #005eea;
  --dex-okd-button-secondary-normal-hover-font-color: #005eea;
  --dex-okd-button-secondary-normal-active-font-color: #005eea;
  --dex-okd-button-secondary-normal-focus-font-color: #005eea;
  --dex-okd-button-secondary-normal-disabled-font-color: #bdbdbd;
  --dex-okd-button-secondary-normal-default-icon-color: #0569ff;
  --dex-okd-button-secondary-normal-hover-icon-color: #0569ff;
  --dex-okd-button-secondary-normal-active-icon-color: #0569ff;
  --dex-okd-button-secondary-normal-focus-icon-color: #0569ff;
  --dex-okd-button-secondary-normal-disabled-icon-color: #bdbdbd;
  --dex-okd-button-secondary-normal-default-shadow: var(--dex-okd-shadow-none);
  --dex-okd-button-secondary-normal-hover-shadow: var(--dex-okd-shadow-none);
  --dex-okd-button-secondary-normal-active-shadow: var(--dex-okd-shadow-none);
  --dex-okd-button-secondary-normal-focus-shadow: 0px 0px 0px 3px rgba(175, 207, 255, .45);
  --dex-okd-button-secondary-normal-disabled-shadow: var(--dex-okd-shadow-none);
  --dex-okd-button-secondary-normal-loader-track-color: #f5f9ff;
  --dex-okd-button-secondary-normal-loader-mark-color: #0569ff;
  --dex-okd-button-secondary-grey-default-background: #ebebeb;
  --dex-okd-button-secondary-grey-hover-background: #f9f9f9;
  --dex-okd-button-secondary-grey-active-background: #dbdbdb;
  --dex-okd-button-secondary-grey-focus-background: #ebebeb;
  --dex-okd-button-secondary-grey-disabled-background: #f9f9f9;
  --dex-okd-button-secondary-grey-default-border-color: #ebebeb;
  --dex-okd-button-secondary-grey-hover-border-color: #f9f9f9;
  --dex-okd-button-secondary-grey-active-border-color: #dbdbdb;
  --dex-okd-button-secondary-grey-focus-border-color: #ebebeb;
  --dex-okd-button-secondary-grey-disabled-border-color: #f9f9f9;
  --dex-okd-button-secondary-grey-default-font-color: #3d3d3d;
  --dex-okd-button-secondary-grey-hover-font-color: #3d3d3d;
  --dex-okd-button-secondary-grey-active-font-color: #3d3d3d;
  --dex-okd-button-secondary-grey-focus-font-color: #3d3d3d;
  --dex-okd-button-secondary-grey-disabled-font-color: #bdbdbd;
  --dex-okd-button-secondary-grey-default-icon-color: #3d3d3d;
  --dex-okd-button-secondary-grey-hover-icon-color: #3d3d3d;
  --dex-okd-button-secondary-grey-active-icon-color: #3d3d3d;
  --dex-okd-button-secondary-grey-focus-icon-color: #3d3d3d;
  --dex-okd-button-secondary-grey-disabled-icon-color: #bdbdbd;
  --dex-okd-button-secondary-grey-default-shadow: var(--dex-okd-shadow-sm);
  --dex-okd-button-secondary-grey-hover-shadow: var(--dex-okd-shadow-none);
  --dex-okd-button-secondary-grey-active-shadow: var(--dex-okd-shadow-none);
  --dex-okd-button-secondary-grey-focus-shadow: var(--dex-okd-shadow-sm), 0px 0px 0px 3px var(--dex-okd-color-gray-200);
  --dex-okd-button-secondary-grey-disabled-shadow: var(--dex-okd-shadow-none);
  --dex-okd-button-secondary-grey-loader-track-color: #dbdbdb;
  --dex-okd-button-secondary-grey-loader-mark-color: #3d3d3d;
  --dex-okd-button-basic-normal-default-background: #fff;
  --dex-okd-button-basic-normal-hover-background: #fff;
  --dex-okd-button-basic-normal-active-background: #f9f9f9;
  --dex-okd-button-basic-normal-focus-background: #fff;
  --dex-okd-button-basic-normal-disabled-background: #fff;
  --dex-okd-button-basic-normal-default-border-color: #dbdbdb;
  --dex-okd-button-basic-normal-hover-border-color: #dbdbdb;
  --dex-okd-button-basic-normal-active-border-color: #dbdbdb;
  --dex-okd-button-basic-normal-focus-border-color: #8dbbff;
  --dex-okd-button-basic-normal-disabled-border-color: #dbdbdb;
  --dex-okd-button-basic-normal-default-font-color: #3d3d3d;
  --dex-okd-button-basic-normal-hover-font-color: #929292;
  --dex-okd-button-basic-normal-active-font-color: #000;
  --dex-okd-button-basic-normal-focus-font-color: #3d3d3d;
  --dex-okd-button-basic-normal-disabled-font-color: #bdbdbd;
  --dex-okd-button-basic-normal-default-icon-color: #3d3d3d;
  --dex-okd-button-basic-normal-hover-icon-color: #3d3d3d;
  --dex-okd-button-basic-normal-active-icon-color: #3d3d3d;
  --dex-okd-button-basic-normal-focus-icon-color: #3d3d3d;
  --dex-okd-button-basic-normal-disabled-icon-color: #bdbdbd;
  --dex-okd-button-basic-normal-default-shadow: var(--dex-okd-shadow-sm);
  --dex-okd-button-basic-normal-hover-shadow: var(--dex-okd-shadow-none);
  --dex-okd-button-basic-normal-active-shadow: var(--dex-okd-shadow-none);
  --dex-okd-button-basic-normal-focus-shadow: 0px 0px 0px 3px rgba(175, 207, 255, .45);
  --dex-okd-button-basic-normal-disabled-shadow: var(--dex-okd-shadow-none);
  --dex-okd-button-basic-normal-loader-track-color: #d1e3ff;
  --dex-okd-button-basic-normal-loader-mark-color: #0569ff;
  --dex-okd-button-plain-normal-default-background: transparent;
  --dex-okd-button-plain-normal-hover-background: #f5f9ff;
  --dex-okd-button-plain-normal-active-background: #f5f9ff;
  --dex-okd-button-plain-normal-focus-background: #f5f9ff;
  --dex-okd-button-plain-normal-disabled-background: #f9f9f9;
  --dex-okd-button-plain-normal-default-border-color: transparent;
  --dex-okd-button-plain-normal-hover-border-color: transparent;
  --dex-okd-button-plain-normal-active-border-color: transparent;
  --dex-okd-button-plain-normal-focus-border-color: transparent;
  --dex-okd-button-plain-normal-disabled-border-color: transparent;
  --dex-okd-button-plain-normal-default-font-color: #005eea;
  --dex-okd-button-plain-normal-hover-font-color: #005eea;
  --dex-okd-button-plain-normal-active-font-color: #005eea;
  --dex-okd-button-plain-normal-focus-font-color: #005eea;
  --dex-okd-button-plain-normal-disabled-font-color: rgba(0, 94, 234, .45);
  --dex-okd-button-plain-normal-default-icon-color: #005eea;
  --dex-okd-button-plain-normal-hover-icon-color: #005eea;
  --dex-okd-button-plain-normal-active-icon-color: #005eea;
  --dex-okd-button-plain-normal-focus-icon-color: #005eea;
  --dex-okd-button-plain-normal-disabled-icon-color: rgba(0, 94, 234, .45);
  --dex-okd-button-plain-normal-default-shadow: none;
  --dex-okd-button-plain-normal-hover-shadow: none;
  --dex-okd-button-plain-normal-active-shadow: none;
  --dex-okd-button-plain-normal-focus-shadow: none;
  --dex-okd-button-plain-normal-disabled-shadow: none;
  --dex-okd-button-plain-red-default-background: transparent;
  --dex-okd-button-plain-red-hover-background: #fff8f9;
  --dex-okd-button-plain-red-active-background: #fff8f9;
  --dex-okd-button-plain-red-focus-background: #fff8f9;
  --dex-okd-button-plain-red-disabled-background: #f9f9f9;
  --dex-okd-button-plain-red-default-border-color: transparent;
  --dex-okd-button-plain-red-hover-border-color: transparent;
  --dex-okd-button-plain-red-active-border-color: transparent;
  --dex-okd-button-plain-red-focus-border-color: transparent;
  --dex-okd-button-plain-red-disabled-border-color: transparent;
  --dex-okd-button-plain-red-default-font-color: #602031;
  --dex-okd-button-plain-red-hover-font-color: #602031;
  --dex-okd-button-plain-red-active-font-color: #602031;
  --dex-okd-button-plain-red-focus-font-color: #602031;
  --dex-okd-button-plain-red-disabled-font-color: rgba(96, 32, 49, .45);
  --dex-okd-button-plain-red-default-icon-color: #602031;
  --dex-okd-button-plain-red-hover-icon-color: #602031;
  --dex-okd-button-plain-red-active-icon-color: #602031;
  --dex-okd-button-plain-red-focus-icon-color: #602031;
  --dex-okd-button-plain-red-disabled-icon-color: rgba(96, 32, 49, .45);
  --dex-okd-button-plain-red-default-shadow: none;
  --dex-okd-button-plain-red-hover-shadow: none;
  --dex-okd-button-plain-red-active-shadow: none;
  --dex-okd-button-plain-red-focus-shadow: none;
  --dex-okd-button-plain-red-disabled-shadow: none;
  --dex-okd-button-plain-green-default-background: transparent;
  --dex-okd-button-plain-green-hover-background: #f2fff7;
  --dex-okd-button-plain-green-active-background: #f2fff7;
  --dex-okd-button-plain-green-focus-background: #f2fff7;
  --dex-okd-button-plain-green-disabled-background: #f9f9f9;
  --dex-okd-button-plain-green-default-border-color: transparent;
  --dex-okd-button-plain-green-hover-border-color: transparent;
  --dex-okd-button-plain-green-active-border-color: transparent;
  --dex-okd-button-plain-green-focus-border-color: transparent;
  --dex-okd-button-plain-green-disabled-border-color: transparent;
  --dex-okd-button-plain-green-default-font-color: #0c5025;
  --dex-okd-button-plain-green-hover-font-color: #0c5025;
  --dex-okd-button-plain-green-active-font-color: #0c5025;
  --dex-okd-button-plain-green-focus-font-color: #0c5025;
  --dex-okd-button-plain-green-disabled-font-color: rgba(12, 80, 37, .45);
  --dex-okd-button-plain-green-default-icon-color: #0c5025;
  --dex-okd-button-plain-green-hover-icon-color: #0c5025;
  --dex-okd-button-plain-green-active-icon-color: #0c5025;
  --dex-okd-button-plain-green-focus-icon-color: #0c5025;
  --dex-okd-button-plain-green-disabled-icon-color: rgba(12, 80, 37, .45);
  --dex-okd-button-plain-green-default-shadow: none;
  --dex-okd-button-plain-green-hover-shadow: none;
  --dex-okd-button-plain-green-active-shadow: none;
  --dex-okd-button-plain-green-focus-shadow: none;
  --dex-okd-button-plain-green-disabled-shadow: none;
  --dex-okd-button-plain-orange-default-background: transparent;
  --dex-okd-button-plain-orange-hover-background: #fef9f6;
  --dex-okd-button-plain-orange-active-background: #fef9f6;
  --dex-okd-button-plain-orange-focus-background: #fef9f6;
  --dex-okd-button-plain-orange-disabled-background: #f9f9f9;
  --dex-okd-button-plain-orange-default-border-color: transparent;
  --dex-okd-button-plain-orange-hover-border-color: transparent;
  --dex-okd-button-plain-orange-active-border-color: transparent;
  --dex-okd-button-plain-orange-focus-border-color: transparent;
  --dex-okd-button-plain-orange-disabled-border-color: transparent;
  --dex-okd-button-plain-orange-default-font-color: #e96010;
  --dex-okd-button-plain-orange-hover-font-color: #e96010;
  --dex-okd-button-plain-orange-active-font-color: #e96010;
  --dex-okd-button-plain-orange-focus-font-color: #e96010;
  --dex-okd-button-plain-orange-disabled-font-color: rgba(233, 96, 16, .45);
  --dex-okd-button-plain-orange-default-icon-color: #e96010;
  --dex-okd-button-plain-orange-hover-icon-color: #e96010;
  --dex-okd-button-plain-orange-active-icon-color: #e96010;
  --dex-okd-button-plain-orange-focus-icon-color: #e96010;
  --dex-okd-button-plain-orange-disabled-icon-color: rgba(233, 96, 16, .45);
  --dex-okd-button-plain-orange-default-shadow: none;
  --dex-okd-button-plain-orange-hover-shadow: none;
  --dex-okd-button-plain-orange-active-shadow: none;
  --dex-okd-button-plain-orange-focus-shadow: none;
  --dex-okd-button-plain-orange-disabled-shadow: none;
  --dex-okd-button-plain-yellow-default-background: transparent;
  --dex-okd-button-plain-yellow-hover-background: #fffcf5;
  --dex-okd-button-plain-yellow-active-background: #fffcf5;
  --dex-okd-button-plain-yellow-focus-background: #fffcf5;
  --dex-okd-button-plain-yellow-disabled-background: #f9f9f9;
  --dex-okd-button-plain-yellow-default-border-color: transparent;
  --dex-okd-button-plain-yellow-hover-border-color: transparent;
  --dex-okd-button-plain-yellow-active-border-color: transparent;
  --dex-okd-button-plain-yellow-focus-border-color: transparent;
  --dex-okd-button-plain-yellow-disabled-border-color: transparent;
  --dex-okd-button-plain-yellow-default-font-color: #eaa900;
  --dex-okd-button-plain-yellow-hover-font-color: #eaa900;
  --dex-okd-button-plain-yellow-active-font-color: #eaa900;
  --dex-okd-button-plain-yellow-focus-font-color: #eaa900;
  --dex-okd-button-plain-yellow-disabled-font-color: rgba(234, 169, 0, .45);
  --dex-okd-button-plain-yellow-default-icon-color: #eaa900;
  --dex-okd-button-plain-yellow-hover-icon-color: #eaa900;
  --dex-okd-button-plain-yellow-active-icon-color: #eaa900;
  --dex-okd-button-plain-yellow-focus-icon-color: #eaa900;
  --dex-okd-button-plain-yellow-disabled-icon-color: rgba(234, 169, 0, .45);
  --dex-okd-button-plain-yellow-default-shadow: none;
  --dex-okd-button-plain-yellow-hover-shadow: none;
  --dex-okd-button-plain-yellow-active-shadow: none;
  --dex-okd-button-plain-yellow-focus-shadow: none;
  --dex-okd-button-plain-yellow-disabled-shadow: none;
  --dex-okd-button-xxs-font-size: var(--dex-okd-font-size-xs);
  --dex-okd-button-xs-font-size: var(--dex-okd-font-size-xs);
  --dex-okd-button-sm-font-size: var(--dex-okd-font-size-md);
  --dex-okd-button-md-font-size: var(--dex-okd-font-size-md);
  --dex-okd-button-lg-font-size: var(--dex-okd-font-size-base);
  --dex-okd-button-xl-font-size: 18px;
  --dex-okd-button-xxs-icon-size: 14px;
  --dex-okd-button-xs-icon-size: 14px;
  --dex-okd-button-sm-icon-size: 18px;
  --dex-okd-button-md-icon-size: 18px;
  --dex-okd-button-lg-icon-size: 18px;
  --dex-okd-button-xl-icon-size: 18px;
  --dex-okd-button-xxs-icon-margin: 6px;
  --dex-okd-button-xs-icon-margin: 6px;
  --dex-okd-button-sm-icon-margin: 6px;
  --dex-okd-button-md-icon-margin: 6px;
  --dex-okd-button-lg-icon-margin: 8px;
  --dex-okd-button-xl-icon-margin: 8px;
  --dex-okd-button-xxs-line-height: var(--dex-okd-line-height-xs);
  --dex-okd-button-xs-line-height: var(--dex-okd-line-height-xs);
  --dex-okd-button-sm-line-height: var(--dex-okd-line-height-md);
  --dex-okd-button-md-line-height: var(--dex-okd-line-height-md);
  --dex-okd-button-lg-line-height: var(--dex-okd-line-height-base);
  --dex-okd-button-xl-line-height: var(--dex-okd-line-height-base);
  --dex-okd-button-xxs-padding-horizontal: 8px;
  --dex-okd-button-xxs-padding-vertical: 3px;
  --dex-okd-button-xs-padding-horizontal: 8px;
  --dex-okd-button-xs-padding-vertical: 5px;
  --dex-okd-button-sm-padding-horizontal: 12px;
  --dex-okd-button-sm-padding-vertical: 7px;
  --dex-okd-button-md-padding-horizontal: 16px;
  --dex-okd-button-md-padding-vertical: 9px;
  --dex-okd-button-lg-padding-horizontal: 24px;
  --dex-okd-button-lg-padding-vertical: 13px;
  --dex-okd-button-xl-padding-horizontal: 24px;
  --dex-okd-button-xl-padding-vertical: 17px;
  --dex-okd-button-xxs-min-width: 63px;
  --dex-okd-button-xs-min-width: 63px;
  --dex-okd-button-sm-min-width: 81px;
  --dex-okd-button-md-min-width: 90px;
  --dex-okd-button-lg-min-width: 108px;
  --dex-okd-button-xl-min-width: 126px;
  --dex-okd-button-xxs-border-radius: 60px;
  --dex-okd-button-xs-border-radius: 60px;
  --dex-okd-button-sm-border-radius: 60px;
  --dex-okd-button-md-border-radius: 60px;
  --dex-okd-button-lg-border-radius: 60px;
  --dex-okd-button-xl-border-radius: 60px;
  --dex-okd-button-xxs-border-size: 1px;
  --dex-okd-button-xs-border-size: 1px;
  --dex-okd-button-sm-border-size: 1px;
  --dex-okd-button-md-border-size: 1px;
  --dex-okd-button-lg-border-size: 1px;
  --dex-okd-button-xl-border-size: 1px;
  --dex-okd-button-xl-loader-size: 18px;
  --dex-okd-button-lg-loader-size: 14px;
  --dex-okd-button-md-loader-size: 14px;
  --dex-okd-button-sm-loader-size: 14px;
  --dex-okd-button-xs-loader-size: 14px;
  --dex-okd-button-xxs-loader-size: 14px;
  --dex-okd-button-xl-loader-text-margin-left: 8px;
  --dex-okd-button-lg-loader-text-margin-left: 8px;
  --dex-okd-button-md-loader-text-margin-left: 6px;
  --dex-okd-button-sm-loader-text-margin-left: 6px;
  --dex-okd-button-xs-loader-text-margin-left: 6px;
  --dex-okd-button-xxs-loader-text-margin-left: 6px;
  --dex-okd-button-s-font-size: 14px;
  --dex-okd-button-s-icon-size: 18px;
  --dex-okd-button-s-icon-margin: 6px;
  --dex-okd-button-s-line-height: 16px;
  --dex-okd-button-s-padding-horizontal: 12px;
  --dex-okd-button-s-padding-vertical: 7px;
  --dex-okd-button-s-min-width: 72px;
  --dex-okd-button-s-border-radius: 60px;
  --dex-okd-button-s-loader-size: 14px;
  --dex-okd-button-s-loader-text-margin-left: 6px;
  --dex-okd-button-xl-font-weight: 600;
  --dex-okd-button-lg-font-weight: 500;
  --dex-okd-button-md-font-weight: 500;
  --dex-okd-button-sm-font-weight: 500;
  --dex-okd-button-rect-xxs-border-radius: 4px;
  --dex-okd-button-rect-xs-border-radius: 4px;
  --dex-okd-button-rect-sm-border-radius: 4px;
  --dex-okd-button-rect-s-border-radius: 4px;
  --dex-okd-button-rect-md-border-radius: 4px;
  --dex-okd-button-rect-lg-border-radius: 8px;
  --dex-okd-button-rect-xl-border-radius: 8px;
  --dex-okd-button-fill-highlight-default-background: var(--dex-okd-color-container-inverse);
  --dex-okd-button-fill-highlight-hover-background: var(--dex-okd-color-container-contrast);
  --dex-okd-button-fill-highlight-active-background: var(--dex-okd-color-container-contrast);
  --dex-okd-button-fill-highlight-focus-background: #000;
  --dex-okd-button-fill-highlight-disabled-background: #f3f3f3;
  --dex-okd-button-fill-highlight-default-border-color: var(--dex-okd-color-common-transparent);
  --dex-okd-button-fill-highlight-hover-border-color: var(--dex-okd-color-common-transparent);
  --dex-okd-button-fill-highlight-active-border-color: var(--dex-okd-color-common-transparent);
  --dex-okd-button-fill-highlight-focus-border-color: #000;
  --dex-okd-button-fill-highlight-disabled-border-color: var(--dex-okd-color-common-transparent);
  --dex-okd-button-fill-highlight-default-font-color: var(--dex-okd-color-content-inverse);
  --dex-okd-button-fill-highlight-hover-font-color: var(--dex-okd-color-content-inverse);
  --dex-okd-button-fill-highlight-active-font-color: var(--dex-okd-color-content-inverse);
  --dex-okd-button-fill-highlight-focus-font-color: #fff;
  --dex-okd-button-fill-highlight-disabled-font-color: var(--dex-okd-color-content-disabled);
  --dex-okd-button-fill-highlight-default-icon-color: var(--dex-okd-color-content-inverse);
  --dex-okd-button-fill-highlight-hover-icon-color: var(--dex-okd-color-content-inverse);
  --dex-okd-button-fill-highlight-active-icon-color: var(--dex-okd-color-content-inverse);
  --dex-okd-button-fill-highlight-focus-icon-color: #fff;
  --dex-okd-button-fill-highlight-disabled-icon-color: var(--dex-okd-color-content-disabled);
  --dex-okd-button-fill-highlight-default-shadow: var(--dex-okd-shadow-none);
  --dex-okd-button-fill-highlight-hover-shadow: var(--dex-okd-shadow-none);
  --dex-okd-button-fill-highlight-active-shadow: var(--dex-okd-shadow-none);
  --dex-okd-button-fill-highlight-focus-shadow: 0px 0px 0px 1.5px #fff, 0px 0px 0px 3.5px #1d202359;
  --dex-okd-button-fill-highlight-disabled-shadow: var(--dex-okd-shadow-none);
  --dex-okd-button-fill-highlight-loader-track-color: hsla(0, 0%, 98%, .26);
  --dex-okd-button-fill-highlight-loader-mark-color: var(--dex-okd-color-border-contrast);
  --dex-okd-button-fill-highlight-border-size: 0px;
  --dex-okd-button-fill-primary-default-background: var(--dex-okd-color-container-inverse);
  --dex-okd-button-fill-primary-hover-background: var(--dex-okd-color-container-inverse);
  --dex-okd-button-fill-primary-active-background: var(--dex-okd-color-container-inverse);
  --dex-okd-button-fill-primary-focus-background: #0051ca;
  --dex-okd-button-fill-primary-disabled-background: #f3f3f3;
  --dex-okd-button-fill-primary-default-border-color: var(--dex-okd-color-container-inverse);
  --dex-okd-button-fill-primary-hover-border-color: var(--dex-okd-color-common-transparent);
  --dex-okd-button-fill-primary-active-border-color: transparent;
  --dex-okd-button-fill-primary-focus-border-color: transparent;
  --dex-okd-button-fill-primary-disabled-border-color: var(--dex-okd-color-background-surface-primary);
  --dex-okd-button-fill-primary-default-font-color: var(--dex-okd-color-content-inverse);
  --dex-okd-button-fill-primary-hover-font-color: hsla(0, 0%, 100%, .6);
  --dex-okd-button-fill-primary-active-font-color: var(--dex-okd-color-content-inverse);
  --dex-okd-button-fill-primary-focus-font-color: #fff;
  --dex-okd-button-fill-primary-disabled-font-color: var(--dex-okd-color-content-disabled);
  --dex-okd-button-fill-primary-default-icon-color: var(--dex-okd-color-content-inverse);
  --dex-okd-button-fill-primary-hover-icon-color: hsla(0, 0%, 100%, .6);
  --dex-okd-button-fill-primary-active-icon-color: var(--dex-okd-color-content-inverse);
  --dex-okd-button-fill-primary-focus-icon-color: #fff;
  --dex-okd-button-fill-primary-disabled-icon-color: var(--dex-okd-color-content-disabled);
  --dex-okd-button-fill-primary-default-shadow: var(--dex-okd-shadow-none);
  --dex-okd-button-fill-primary-hover-shadow: var(--dex-okd-shadow-none);
  --dex-okd-button-fill-primary-active-shadow: var(--dex-okd-shadow-none);
  --dex-okd-button-fill-primary-focus-shadow: 0px 0px 0px 1.5px #fff, 0px 0px 0px 3.5px #2d60e040;
  --dex-okd-button-fill-primary-disabled-shadow: var(--dex-okd-shadow-none);
  --dex-okd-button-fill-primary-loader-track-color: hsla(0, 0%, 98%, .26);
  --dex-okd-button-fill-primary-loader-mark-color: var(--dex-okd-color-border-contrast);
  --dex-okd-button-fill-primary-border-size: 0px;
  --dex-okd-button-fill-secondary-default-background: #f5f9ff;
  --dex-okd-button-fill-secondary-hover-background: #d1e3ff;
  --dex-okd-button-fill-secondary-active-background: #afcfff;
  --dex-okd-button-fill-secondary-focus-background: #d1e3ff;
  --dex-okd-button-fill-secondary-disabled-background: #f5f9ff;
  --dex-okd-button-fill-secondary-default-border-color: #f5f9ff;
  --dex-okd-button-fill-secondary-hover-border-color: #d1e3ff;
  --dex-okd-button-fill-secondary-active-border-color: #afcfff;
  --dex-okd-button-fill-secondary-focus-border-color: #d1e3ff;
  --dex-okd-button-fill-secondary-disabled-border-color: #f5f9ff;
  --dex-okd-button-fill-secondary-default-font-color: #005eea;
  --dex-okd-button-fill-secondary-hover-font-color: #005eea;
  --dex-okd-button-fill-secondary-active-font-color: #005eea;
  --dex-okd-button-fill-secondary-focus-font-color: #005eea;
  --dex-okd-button-fill-secondary-disabled-font-color: #8dbbff;
  --dex-okd-button-fill-secondary-default-icon-color: #0569ff;
  --dex-okd-button-fill-secondary-hover-icon-color: #0569ff;
  --dex-okd-button-fill-secondary-active-icon-color: #0569ff;
  --dex-okd-button-fill-secondary-focus-icon-color: #0569ff;
  --dex-okd-button-fill-secondary-disabled-icon-color: #bdbdbd;
  --dex-okd-button-fill-secondary-default-shadow: var(--dex-okd-shadow-none);
  --dex-okd-button-fill-secondary-hover-shadow: var(--dex-okd-shadow-none);
  --dex-okd-button-fill-secondary-active-shadow: var(--dex-okd-shadow-none);
  --dex-okd-button-fill-secondary-focus-shadow: 0px 0px 0px 1.5px #fff, 0px 0px 0px 3.5px #2d60e040;
  --dex-okd-button-fill-secondary-disabled-shadow: var(--dex-okd-shadow-none);
  --dex-okd-button-fill-secondary-loader-track-color: #f5f9ff;
  --dex-okd-button-fill-secondary-loader-mark-color: #0569ff;
  --dex-okd-button-fill-secondary-border-size: 0px;
  --dex-okd-button-fill-tertiary-border-size: 0px;
  --dex-okd-button-fill-tertiary-default-background: var(--dex-okd-color-container-primary);
  --dex-okd-button-fill-tertiary-hover-background: var(--dex-okd-color-container-primary);
  --dex-okd-button-fill-tertiary-focus-background: hsla(0, 0%, 100%, .8);
  --dex-okd-button-fill-tertiary-active-background: var(--dex-okd-color-container-primary);
  --dex-okd-button-fill-tertiary-disabled-background: hsla(0, 0%, 100%, .06);
  --dex-okd-button-fill-tertiary-disabled-font-color: hsla(0, 0%, 100%, .36);
  --dex-okd-button-fill-tertiary-disabled-border-color: hsla(0, 0%, 100%, .06);
  --dex-okd-button-fill-tertiary-default-border-color: var(--dex-okd-color-container-primary);
  --dex-okd-button-fill-tertiary-hover-border-color: hsla(0, 0%, 100%, 0);
  --dex-okd-button-fill-tertiary-focus-border-color: rgba(48, 16, 25, 0);
  --dex-okd-button-fill-tertiary-active-border-color: hsla(0, 0%, 100%, 0);
  --dex-okd-button-fill-tertiary-loader-track-color: var(--dex-okd-color-border-primary);
  --dex-okd-button-fill-tertiary-loader-mark-color: var(--dex-okd-color-border-selected);
  --dex-okd-button-fill-tertiary-default-font-color: var(--dex-okd-color-content-primary);
  --dex-okd-button-fill-tertiary-default-icon-color: var(--dex-okd-color-content-primary);
  --dex-okd-button-fill-tertiary-default-shadow: 0px 0px 0px 0px transparent;
  --dex-okd-button-fill-tertiary-hover-font-color: var(--dex-okd-color-content-contrast);
  --dex-okd-button-fill-tertiary-hover-icon-color: var(--dex-okd-color-content-contrast);
  --dex-okd-button-fill-tertiary-hover-shadow: 0px 0px 0px 0px transparent;
  --dex-okd-button-fill-tertiary-focus-font-color: #000;
  --dex-okd-button-fill-tertiary-focus-icon-color: #000;
  --dex-okd-button-fill-tertiary-focus-shadow: 0px 0px 0px 0px transparent;
  --dex-okd-button-fill-tertiary-active-font-color: var(--dex-okd-color-content-contrast);
  --dex-okd-button-fill-tertiary-active-icon-color: var(--dex-okd-color-content-contrast);
  --dex-okd-button-fill-tertiary-active-shadow: 0px 0px 0px 0px transparent;
  --dex-okd-button-fill-tertiary-disabled-icon-color: hsla(0, 0%, 100%, .36);
  --dex-okd-button-fill-tertiary-disabled-shadow: 0px 0px 0px 0px transparent;
  --dex-okd-button-fill-quaternary-border-size: 0px;
  --dex-okd-button-fill-quaternary-default-background: hsla(0, 0%, 100%, .15);
  --dex-okd-button-fill-quaternary-default-font-color: #fff;
  --dex-okd-button-fill-quaternary-default-border-color: transparent;
  --dex-okd-button-fill-quaternary-hover-background: hsla(0, 0%, 100%, .25);
  --dex-okd-button-fill-quaternary-hover-border-color: transparent;
  --dex-okd-button-fill-quaternary-hover-font-color: hsla(0, 0%, 100%, .25);
  --dex-okd-button-fill-quaternary-focus-background: hsla(0, 0%, 100%, .25);
  --dex-okd-button-fill-quaternary-focus-border-color: transparent;
  --dex-okd-button-fill-quaternary-focus-font-color: #fff;
  --dex-okd-button-fill-quaternary-active-background: hsla(0, 0%, 100%, .25);
  --dex-okd-button-fill-quaternary-active-border-color: transparent;
  --dex-okd-button-fill-quaternary-active-font-color: #fff;
  --dex-okd-button-fill-quaternary-disabled-background: hsla(0, 0%, 100%, .15);
  --dex-okd-button-fill-quaternary-disabled-font-color: hsla(0, 0%, 100%, .25);
  --dex-okd-button-fill-quaternary-disabled-border-color: transparent;
  --dex-okd-button-fill-quaternary-loader-track-color: hsla(0, 0%, 100%, .25);
  --dex-okd-button-fill-quaternary-loader-mark-color: #fff;
  --dex-okd-button-fill-quaternary-default-icon-color: #fff;
  --dex-okd-button-fill-quaternary-default-shadow: 0px 0px 0px 0px transparent;
  --dex-okd-button-fill-quaternary-hover-icon-color: #fff;
  --dex-okd-button-fill-quaternary-hover-shadow: 0px 0px 0px 0px transparent;
  --dex-okd-button-fill-quaternary-focus-icon-color: #fff;
  --dex-okd-button-fill-quaternary-focus-shadow: 0px 0px 0px 0px transparent;
  --dex-okd-button-fill-quaternary-active-icon-color: #fff;
  --dex-okd-button-fill-quaternary-active-shadow: 0px 0px 0px 0px transparent;
  --dex-okd-button-fill-quaternary-disabled-icon-color: #fff;
  --dex-okd-button-fill-quaternary-disabled-shadow: 0px 0px 0px 0px transparent;
  --dex-okd-button-fill-red-default-background: var(--dex-okd-color-semantic-negative);
  --dex-okd-button-fill-red-hover-background: rgba(235, 75, 109, .8);
  --dex-okd-button-fill-red-active-background: rgba(235, 75, 109, .8);
  --dex-okd-button-fill-red-focus-background: #602031;
  --dex-okd-button-fill-red-disabled-background: #f3f3f3;
  --dex-okd-button-fill-red-default-border-color: var(--dex-okd-color-semantic-negative);
  --dex-okd-button-fill-red-hover-border-color: transparent;
  --dex-okd-button-fill-red-active-border-color: transparent;
  --dex-okd-button-fill-red-focus-border-color: #602031;
  --dex-okd-button-fill-red-disabled-border-color: var(--dex-okd-color-common-transparent);
  --dex-okd-button-fill-red-default-font-color: var(--dex-okd-color-content-inverse);
  --dex-okd-button-fill-red-hover-font-color: var(--dex-okd-color-content-inverse);
  --dex-okd-button-fill-red-active-font-color: var(--dex-okd-color-content-inverse);
  --dex-okd-button-fill-red-focus-font-color: #fff;
  --dex-okd-button-fill-red-disabled-font-color: var(--dex-okd-color-content-disabled);
  --dex-okd-button-fill-red-default-icon-color: var(--dex-okd-color-content-inverse);
  --dex-okd-button-fill-red-hover-icon-color: var(--dex-okd-color-content-inverse);
  --dex-okd-button-fill-red-active-icon-color: var(--dex-okd-color-content-inverse);
  --dex-okd-button-fill-red-focus-icon-color: #fff;
  --dex-okd-button-fill-red-disabled-icon-color: var(--dex-okd-color-content-disabled);
  --dex-okd-button-fill-red-default-shadow: 0 0 0 0 transparent;
  --dex-okd-button-fill-red-hover-shadow: var(--dex-okd-shadow-none);
  --dex-okd-button-fill-red-active-shadow: var(--dex-okd-shadow-none);
  --dex-okd-button-fill-red-focus-shadow: 0px 0px 0px 1.5px #fff, 0px 0px 0px 3.5px #e35e5e66;
  --dex-okd-button-fill-red-disabled-shadow: var(--dex-okd-shadow-none);
  --dex-okd-button-fill-red-loader-track-color: hsla(0, 0%, 98%, .26);
  --dex-okd-button-fill-red-loader-mark-color: var(--dex-okd-color-border-contrast);
  --dex-okd-button-fill-red-border-size: 0px;
  --dex-okd-button-fill-green-default-background: var(--dex-okd-color-semantic-positive);
  --dex-okd-button-fill-green-hover-background: rgba(49, 189, 101, .8);
  --dex-okd-button-fill-green-active-background: rgba(49, 189, 101, .8);
  --dex-okd-button-fill-green-focus-background: #0c5025;
  --dex-okd-button-fill-green-disabled-background: #f3f3f3;
  --dex-okd-button-fill-green-default-border-color: var(--dex-okd-color-semantic-positive);
  --dex-okd-button-fill-green-hover-border-color: transparent;
  --dex-okd-button-fill-green-active-border-color: transparent;
  --dex-okd-button-fill-green-focus-border-color: transparent;
  --dex-okd-button-fill-green-disabled-border-color: var(--dex-okd-color-common-transparent);
  --dex-okd-button-fill-green-default-font-color: var(--dex-okd-color-content-inverse);
  --dex-okd-button-fill-green-hover-font-color: var(--dex-okd-color-content-inverse);
  --dex-okd-button-fill-green-active-font-color: var(--dex-okd-color-content-inverse);
  --dex-okd-button-fill-green-focus-font-color: #fff;
  --dex-okd-button-fill-green-disabled-font-color: var(--dex-okd-color-content-disabled);
  --dex-okd-button-fill-green-default-icon-color: var(--dex-okd-color-content-inverse);
  --dex-okd-button-fill-green-hover-icon-color: var(--dex-okd-color-content-inverse);
  --dex-okd-button-fill-green-active-icon-color: var(--dex-okd-color-content-inverse);
  --dex-okd-button-fill-green-focus-icon-color: #fff;
  --dex-okd-button-fill-green-disabled-icon-color: var(--dex-okd-color-content-disabled);
  --dex-okd-button-fill-green-default-shadow: 0 0 0 0 transparent;
  --dex-okd-button-fill-green-hover-shadow: var(--dex-okd-shadow-none);
  --dex-okd-button-fill-green-active-shadow: var(--dex-okd-shadow-none);
  --dex-okd-button-fill-green-focus-shadow: 0px 0px 0px 1px #fff, 0px 0px 0px 3.5px #2ead6573;
  --dex-okd-button-fill-green-disabled-shadow: var(--dex-okd-shadow-none);
  --dex-okd-button-fill-green-loader-track-color: hsla(0, 0%, 98%, .26);
  --dex-okd-button-fill-green-loader-mark-color: var(--dex-okd-color-border-contrast);
  --dex-okd-button-fill-green-border-size: 0px;
  --dex-okd-button-fill-grey-default-background: var(--dex-okd-color-background-surface-primary);
  --dex-okd-button-fill-grey-hover-background: #e6e6e6;
  --dex-okd-button-fill-grey-active-background: #f3f3f3;
  --dex-okd-button-fill-grey-focus-background: hsla(0, 0%, 86%, .5);
  --dex-okd-button-fill-grey-disabled-background: #f3f3f3;
  --dex-okd-button-fill-grey-default-border-color: var(--dex-okd-color-background-surface-primary);
  --dex-okd-button-fill-grey-hover-border-color: transparent;
  --dex-okd-button-fill-grey-active-border-color: transparent;
  --dex-okd-button-fill-grey-focus-border-color: #dbdbdb;
  --dex-okd-button-fill-grey-disabled-border-color: var(--dex-okd-color-background-surface-disable);
  --dex-okd-button-fill-grey-default-font-color: var(--dex-okd-color-content-primary);
  --dex-okd-button-fill-grey-hover-font-color: var(--dex-okd-color-content-primary);
  --dex-okd-button-fill-grey-active-font-color: var(--dex-okd-color-content-primary);
  --dex-okd-button-fill-grey-focus-font-color: #3d3d3d;
  --dex-okd-button-fill-grey-disabled-font-color: var(--dex-okd-color-content-disabled);
  --dex-okd-button-fill-grey-default-icon-color: var(--dex-okd-color-content-primary);
  --dex-okd-button-fill-grey-hover-icon-color: var(--dex-okd-color-content-primary);
  --dex-okd-button-fill-grey-active-icon-color: var(--dex-okd-color-content-primary);
  --dex-okd-button-fill-grey-focus-icon-color: #3d3d3d;
  --dex-okd-button-fill-grey-disabled-icon-color: var(--dex-okd-color-content-disabled);
  --dex-okd-button-fill-grey-default-shadow: 0 0 0 0 transparent;
  --dex-okd-button-fill-grey-hover-shadow: var(--dex-okd-shadow-none);
  --dex-okd-button-fill-grey-active-shadow: var(--dex-okd-shadow-none);
  --dex-okd-button-fill-grey-focus-shadow: 0px 0px 0px 0px #00000000, 0px 0px 0px 3.5px #d8dce673;
  --dex-okd-button-fill-grey-disabled-shadow: var(--dex-okd-shadow-none);
  --dex-okd-button-fill-grey-loader-track-color: var(--dex-okd-color-border-primary);
  --dex-okd-button-fill-grey-loader-mark-color: var(--dex-okd-color-border-selected);
  --dex-okd-button-fill-grey-border-size: 0px;
  --dex-okd-button-outline-highlight-border-size: 1.5px;
  --dex-okd-button-outline-highlight-hover-background: var(--dex-okd-color-container-inverse);
  --dex-okd-button-outline-highlight-hover-font-color: var(--dex-okd-color-content-inverse);
  --dex-okd-button-outline-highlight-focus-background: #000;
  --dex-okd-button-outline-highlight-focus-border-color: #000;
  --dex-okd-button-outline-highlight-focus-font-color: #fff;
  --dex-okd-button-outline-highlight-active-background: var(--dex-okd-color-container-inverse);
  --dex-okd-button-outline-highlight-active-font-color: var(--dex-okd-color-content-inverse);
  --dex-okd-button-outline-highlight-disabled-font-color: var(--dex-okd-color-content-disabled);
  --dex-okd-button-outline-highlight-disabled-border-color: var(--dex-okd-color-border-primary);
  --dex-okd-button-outline-highlight-hover-border-color: var(--dex-okd-color-border-selected);
  --dex-okd-button-outline-highlight-active-border-color: var(--dex-okd-color-border-selected);
  --dex-okd-button-outline-highlight-loader-track-color: #dbdbdb;
  --dex-okd-button-outline-highlight-loader-mark-color: #000;
  --dex-okd-button-outline-highlight-default-background: transparent;
  --dex-okd-button-outline-highlight-default-border-color: var(--dex-okd-color-border-selected);
  --dex-okd-button-outline-highlight-default-font-color: var(--dex-okd-color-content-primary);
  --dex-okd-button-outline-highlight-default-icon-color: var(--dex-okd-color-content-primary);
  --dex-okd-button-outline-highlight-default-shadow: 0px 0px 0px 0px transparent;
  --dex-okd-button-outline-highlight-hover-icon-color: var(--dex-okd-color-content-inverse);
  --dex-okd-button-outline-highlight-hover-shadow: 0px 0px 0px 0px transparent;
  --dex-okd-button-outline-highlight-focus-icon-color: #fff;
  --dex-okd-button-outline-highlight-focus-shadow: 0px 0px 0px 0px transparent;
  --dex-okd-button-outline-highlight-active-icon-color: var(--dex-okd-color-content-inverse);
  --dex-okd-button-outline-highlight-active-shadow: 0px 0px 0px 0px transparent;
  --dex-okd-button-outline-highlight-disabled-background: transparent;
  --dex-okd-button-outline-highlight-disabled-icon-color: var(--dex-okd-color-content-disabled);
  --dex-okd-button-outline-highlight-disabled-shadow: 0px 0px 0px 0px transparent;
  --dex-okd-button-outline-primary-default-background: hsla(0, 0%, 100%, 0);
  --dex-okd-button-outline-primary-hover-background: #f3f3f3;
  --dex-okd-button-outline-primary-active-background: #f3f3f3;
  --dex-okd-button-outline-primary-focus-background: #f7f7f7;
  --dex-okd-button-outline-primary-disabled-background: #f3f3f3;
  --dex-okd-button-outline-primary-default-border-color: var(--dex-okd-color-border-secondary);
  --dex-okd-button-outline-primary-hover-border-color: var(--dex-okd-color-border-secondary);
  --dex-okd-button-outline-primary-active-border-color: var(--dex-okd-color-border-secondary);
  --dex-okd-button-outline-primary-focus-border-color: #dbdbdb;
  --dex-okd-button-outline-primary-disabled-border-color: var(--dex-okd-color-border-primary);
  --dex-okd-button-outline-primary-default-font-color: var(--dex-okd-color-content-primary);
  --dex-okd-button-outline-primary-hover-font-color: var(--dex-okd-color-content-primary);
  --dex-okd-button-outline-primary-active-font-color: var(--dex-okd-color-content-primary);
  --dex-okd-button-outline-primary-focus-font-color: #000;
  --dex-okd-button-outline-primary-disabled-font-color: var(--dex-okd-color-content-disabled);
  --dex-okd-button-outline-primary-default-icon-color: var(--dex-okd-color-content-primary);
  --dex-okd-button-outline-primary-hover-icon-color: var(--dex-okd-color-content-primary);
  --dex-okd-button-outline-primary-active-icon-color: var(--dex-okd-color-content-primary);
  --dex-okd-button-outline-primary-focus-icon-color: #000;
  --dex-okd-button-outline-primary-disabled-icon-color: var(--dex-okd-color-content-disabled);
  --dex-okd-button-outline-primary-default-shadow: 0 0 0 0 transparent;
  --dex-okd-button-outline-primary-hover-shadow: var(--dex-okd-shadow-none);
  --dex-okd-button-outline-primary-active-shadow: var(--dex-okd-shadow-none);
  --dex-okd-button-outline-primary-focus-shadow: 0px 0px 0px 3px #00000014;
  --dex-okd-button-outline-primary-disabled-shadow: var(--dex-okd-shadow-none);
  --dex-okd-button-outline-primary-loader-track-color: #dbdbdb;
  --dex-okd-button-outline-primary-loader-mark-color: #000;
  --dex-okd-button-outline-primary-border-size: 1px;
  --dex-okd-button-outline-secondary-default-background: #fff;
  --dex-okd-button-outline-secondary-hover-background: #f7f7f7;
  --dex-okd-button-outline-secondary-active-background: #f9f9f9;
  --dex-okd-button-outline-secondary-focus-background: #f7f7f7;
  --dex-okd-button-outline-secondary-disabled-background: #fff;
  --dex-okd-button-outline-secondary-default-border-color: #dbdbdb;
  --dex-okd-button-outline-secondary-hover-border-color: #dbdbdb;
  --dex-okd-button-outline-secondary-active-border-color: #dbdbdb;
  --dex-okd-button-outline-secondary-focus-border-color: #dbdbdb;
  --dex-okd-button-outline-secondary-disabled-border-color: #ebebeb;
  --dex-okd-button-outline-secondary-default-font-color: #000;
  --dex-okd-button-outline-secondary-hover-font-color: #000;
  --dex-okd-button-outline-secondary-active-font-color: #000;
  --dex-okd-button-outline-secondary-focus-font-color: #000;
  --dex-okd-button-outline-secondary-disabled-font-color: #bdbdbd;
  --dex-okd-button-outline-secondary-default-icon-color: #000;
  --dex-okd-button-outline-secondary-hover-icon-color: #000;
  --dex-okd-button-outline-secondary-active-icon-color: #000;
  --dex-okd-button-outline-secondary-focus-icon-color: #000;
  --dex-okd-button-outline-secondary-disabled-icon-color: #bdbdbd;
  --dex-okd-button-outline-secondary-default-shadow: 0 0 0 0 transparent;
  --dex-okd-button-outline-secondary-hover-shadow: var(--dex-okd-shadow-none);
  --dex-okd-button-outline-secondary-active-shadow: var(--dex-okd-shadow-none);
  --dex-okd-button-outline-secondary-focus-shadow: 0px 0px 0px 3px #00000014;
  --dex-okd-button-outline-secondary-disabled-shadow: var(--dex-okd-shadow-none);
  --dex-okd-button-outline-secondary-loader-track-color: rgba(0, 0, 0, .25);
  --dex-okd-button-outline-secondary-loader-mark-color: #000;
  --dex-okd-button-outline-secondary-border-size: 1px;
  --dex-okd-button-outline-tertiary-border-size: 1.5px;
  --dex-okd-button-outline-tertiary-default-background: transparent;
  --dex-okd-button-outline-tertiary-default-border-color: var(--dex-okd-color-border-contrast);
  --dex-okd-button-outline-tertiary-default-font-color: var(--dex-okd-color-content-inverse);
  --dex-okd-button-outline-tertiary-default-icon-color: var(--dex-okd-color-content-inverse);
  --dex-okd-button-outline-tertiary-default-shadow: 0px 0px 0px 0px transparent;
  --dex-okd-button-outline-tertiary-hover-background: var(--dex-okd-color-container-primary);
  --dex-okd-button-outline-tertiary-hover-shadow: 0px 0px 0px 0px transparent;
  --dex-okd-button-outline-tertiary-hover-icon-color: var(--dex-okd-color-content-primary);
  --dex-okd-button-outline-tertiary-hover-font-color: var(--dex-okd-color-content-primary);
  --dex-okd-button-outline-tertiary-hover-border-color: var(--dex-okd-color-container-primary);
  --dex-okd-button-outline-tertiary-focus-shadow: 0px 0px 0px 0px transparent;
  --dex-okd-button-outline-tertiary-focus-icon-color: #000;
  --dex-okd-button-outline-tertiary-focus-font-color: #000;
  --dex-okd-button-outline-tertiary-focus-border-color: #fff;
  --dex-okd-button-outline-tertiary-focus-background: #fff;
  --dex-okd-button-outline-tertiary-active-shadow: 0px 0px 0px 0px transparent;
  --dex-okd-button-outline-tertiary-active-icon-color: var(--dex-okd-color-content-primary);
  --dex-okd-button-outline-tertiary-active-font-color: var(--dex-okd-color-content-primary);
  --dex-okd-button-outline-tertiary-active-border-color: var(--dex-okd-color-container-primary);
  --dex-okd-button-outline-tertiary-active-background: var(--dex-okd-color-container-primary);
  --dex-okd-button-outline-tertiary-disabled-shadow: 0px 0px 0px 0px transparent;
  --dex-okd-button-outline-tertiary-disabled-icon-color: hsla(0, 0%, 100%, .36);
  --dex-okd-button-outline-tertiary-disabled-font-color: var(--dex-okd-color-content-inverse);
  --dex-okd-button-outline-tertiary-disabled-border-color: hsla(0, 0%, 98%, .12);
  --dex-okd-button-outline-tertiary-disabled-background: transparent;
  --dex-okd-button-outline-tertiary-loader-mark-color: var(--dex-okd-color-border-contrast);
  --dex-okd-button-outline-tertiary-loader-track-color: hsla(0, 0%, 98%, .3);
  --dex-okd-button-text-primary-default-background: var(--dex-okd-color-common-transparent);
  --dex-okd-button-text-primary-hover-background: #f3f3f3;
  --dex-okd-button-text-primary-active-background: #f3f3f3;
  --dex-okd-button-text-primary-focus-background: #f5f9ff;
  --dex-okd-button-text-primary-disabled-background: undefined;
  --dex-okd-button-text-primary-default-border-color: var(--dex-okd-color-common-transparent);
  --dex-okd-button-text-primary-hover-border-color: var(--dex-okd-color-common-transparent);
  --dex-okd-button-text-primary-active-border-color: var(--dex-okd-color-common-transparent);
  --dex-okd-button-text-primary-focus-border-color: transparent;
  --dex-okd-button-text-primary-disabled-border-color: var(--dex-okd-color-common-transparent);
  --dex-okd-button-text-primary-default-font-color: var(--dex-okd-color-content-primary);
  --dex-okd-button-text-primary-hover-font-color: var(--dex-okd-color-content-primary);
  --dex-okd-button-text-primary-active-font-color: var(--dex-okd-color-content-primary);
  --dex-okd-button-text-primary-focus-font-color: #005eea;
  --dex-okd-button-text-primary-disabled-font-color: var(--dex-okd-color-content-disabled);
  --dex-okd-button-text-primary-default-icon-color: var(--dex-okd-color-content-primary);
  --dex-okd-button-text-primary-hover-icon-color: var(--dex-okd-color-content-primary);
  --dex-okd-button-text-primary-active-icon-color: var(--dex-okd-color-content-primary);
  --dex-okd-button-text-primary-focus-icon-color: #005eea;
  --dex-okd-button-text-primary-disabled-icon-color: var(--dex-okd-color-content-disabled);
  --dex-okd-button-text-primary-default-shadow: none;
  --dex-okd-button-text-primary-hover-shadow: none;
  --dex-okd-button-text-primary-active-shadow: none;
  --dex-okd-button-text-primary-focus-shadow: none;
  --dex-okd-button-text-primary-disabled-shadow: none;
  --dex-okd-button-text-primary-border-size: 1px;
  --dex-okd-button-text-secondary-default-background: transparent;
  --dex-okd-button-text-secondary-hover-background: #f5f9ff;
  --dex-okd-button-text-secondary-active-background: #f5f9ff;
  --dex-okd-button-text-secondary-focus-background: #f5f9ff;
  --dex-okd-button-text-secondary-disabled-background: #f9f9f9;
  --dex-okd-button-text-secondary-default-border-color: transparent;
  --dex-okd-button-text-secondary-hover-border-color: transparent;
  --dex-okd-button-text-secondary-active-border-color: transparent;
  --dex-okd-button-text-secondary-focus-border-color: transparent;
  --dex-okd-button-text-secondary-disabled-border-color: transparent;
  --dex-okd-button-text-secondary-default-font-color: #0569ff;
  --dex-okd-button-text-secondary-hover-font-color: #005eea;
  --dex-okd-button-text-secondary-active-font-color: #005eea;
  --dex-okd-button-text-secondary-focus-font-color: #005eea;
  --dex-okd-button-text-secondary-disabled-font-color: rgba(0, 94, 234, .45);
  --dex-okd-button-text-secondary-default-icon-color: #0569ff;
  --dex-okd-button-text-secondary-hover-icon-color: #005eea;
  --dex-okd-button-text-secondary-active-icon-color: #005eea;
  --dex-okd-button-text-secondary-focus-icon-color: #005eea;
  --dex-okd-button-text-secondary-disabled-icon-color: rgba(0, 94, 234, .45);
  --dex-okd-button-text-secondary-default-shadow: none;
  --dex-okd-button-text-secondary-hover-shadow: none;
  --dex-okd-button-text-secondary-active-shadow: none;
  --dex-okd-button-text-secondary-focus-shadow: none;
  --dex-okd-button-text-secondary-disabled-shadow: none;
  --dex-okd-button-text-secondary-border-size: 1px;
  --dex-okd-button-text-red-default-background: var(--dex-okd-color-common-transparent);
  --dex-okd-button-text-red-hover-background: rgba(235, 75, 109, .05);
  --dex-okd-button-text-red-active-background: rgba(235, 75, 109, .05);
  --dex-okd-button-text-red-focus-background: #fff8f9;
  --dex-okd-button-text-red-disabled-background: hsla(0, 0%, 98%, 0);
  --dex-okd-button-text-red-default-border-color: transparent;
  --dex-okd-button-text-red-hover-border-color: var(--dex-okd-color-common-transparent);
  --dex-okd-button-text-red-active-border-color: var(--dex-okd-color-common-transparent);
  --dex-okd-button-text-red-focus-border-color: transparent;
  --dex-okd-button-text-red-disabled-border-color: var(--dex-okd-color-common-transparent);
  --dex-okd-button-text-red-default-font-color: #eb4b6d;
  --dex-okd-button-text-red-hover-font-color: var(--dex-okd-color-semantic-negative);
  --dex-okd-button-text-red-active-font-color: var(--dex-okd-color-semantic-negative);
  --dex-okd-button-text-red-focus-font-color: #602031;
  --dex-okd-button-text-red-disabled-font-color: rgba(235, 75, 109, .45);
  --dex-okd-button-text-red-default-icon-color: #602031;
  --dex-okd-button-text-red-hover-icon-color: #eb4b6d;
  --dex-okd-button-text-red-active-icon-color: var(--dex-okd-color-semantic-negative);
  --dex-okd-button-text-red-focus-icon-color: #602031;
  --dex-okd-button-text-red-disabled-icon-color: rgba(235, 75, 109, .45);
  --dex-okd-button-text-red-default-shadow: none;
  --dex-okd-button-text-red-hover-shadow: none;
  --dex-okd-button-text-red-active-shadow: none;
  --dex-okd-button-text-red-focus-shadow: none;
  --dex-okd-button-text-red-disabled-shadow: none;
  --dex-okd-button-text-red-border-size: 1px;
  --dex-okd-button-text-green-default-background: var(--dex-okd-color-common-transparent);
  --dex-okd-button-text-green-hover-background: rgba(49, 189, 101, .05);
  --dex-okd-button-text-green-active-background: rgba(49, 189, 101, .05);
  --dex-okd-button-text-green-focus-background: #f2fff7;
  --dex-okd-button-text-green-disabled-background: hsla(0, 0%, 98%, 0);
  --dex-okd-button-text-green-default-border-color: var(--dex-okd-color-common-transparent);
  --dex-okd-button-text-green-hover-border-color: var(--dex-okd-color-common-transparent);
  --dex-okd-button-text-green-active-border-color: var(--dex-okd-color-common-transparent);
  --dex-okd-button-text-green-focus-border-color: transparent;
  --dex-okd-button-text-green-disabled-border-color: var(--dex-okd-color-common-transparent);
  --dex-okd-button-text-green-default-font-color: var(--dex-okd-color-semantic-positive);
  --dex-okd-button-text-green-hover-font-color: var(--dex-okd-color-semantic-positive);
  --dex-okd-button-text-green-active-font-color: var(--dex-okd-color-semantic-positive);
  --dex-okd-button-text-green-focus-font-color: #0c5025;
  --dex-okd-button-text-green-disabled-font-color: rgba(49, 189, 101, .45);
  --dex-okd-button-text-green-default-icon-color: var(--dex-okd-color-semantic-positive);
  --dex-okd-button-text-green-hover-icon-color: var(--dex-okd-color-semantic-positive);
  --dex-okd-button-text-green-active-icon-color: var(--dex-okd-color-semantic-positive);
  --dex-okd-button-text-green-focus-icon-color: #0c5025;
  --dex-okd-button-text-green-disabled-icon-color: rgba(49, 189, 101, .45);
  --dex-okd-button-text-green-default-shadow: none;
  --dex-okd-button-text-green-hover-shadow: none;
  --dex-okd-button-text-green-active-shadow: none;
  --dex-okd-button-text-green-focus-shadow: none;
  --dex-okd-button-text-green-disabled-shadow: none;
  --dex-okd-button-text-green-border-size: 1px;
  --dex-okd-button-text-yellow-default-background: var(--dex-okd-color-common-transparent);
  --dex-okd-button-text-yellow-hover-background: rgba(255, 177, 23, .05);
  --dex-okd-button-text-yellow-active-background: rgba(255, 177, 23, .05);
  --dex-okd-button-text-yellow-focus-background: #fffcf5;
  --dex-okd-button-text-yellow-disabled-background: hsla(0, 0%, 98%, 0);
  --dex-okd-button-text-yellow-default-border-color: var(--dex-okd-color-common-transparent);
  --dex-okd-button-text-yellow-hover-border-color: var(--dex-okd-color-common-transparent);
  --dex-okd-button-text-yellow-active-border-color: var(--dex-okd-color-common-transparent);
  --dex-okd-button-text-yellow-focus-border-color: transparent;
  --dex-okd-button-text-yellow-disabled-border-color: var(--dex-okd-color-common-transparent);
  --dex-okd-button-text-yellow-default-font-color: var(--dex-okd-color-semantic-notice);
  --dex-okd-button-text-yellow-hover-font-color: var(--dex-okd-color-semantic-notice);
  --dex-okd-button-text-yellow-active-font-color: var(--dex-okd-color-semantic-notice);
  --dex-okd-button-text-yellow-focus-font-color: #eaa900;
  --dex-okd-button-text-yellow-disabled-font-color: rgba(255, 177, 23, .45);
  --dex-okd-button-text-yellow-default-icon-color: var(--dex-okd-color-semantic-notice);
  --dex-okd-button-text-yellow-hover-icon-color: var(--dex-okd-color-semantic-notice);
  --dex-okd-button-text-yellow-active-icon-color: var(--dex-okd-color-semantic-notice);
  --dex-okd-button-text-yellow-focus-icon-color: #eaa900;
  --dex-okd-button-text-yellow-disabled-icon-color: rgba(255, 177, 23, .45);
  --dex-okd-button-text-yellow-default-shadow: none;
  --dex-okd-button-text-yellow-hover-shadow: none;
  --dex-okd-button-text-yellow-active-shadow: none;
  --dex-okd-button-text-yellow-focus-shadow: none;
  --dex-okd-button-text-yellow-disabled-shadow: none;
  --dex-okd-button-text-yellow-border-size: 1px;
  --dex-okd-button-text-orange-default-background: transparent;
  --dex-okd-button-text-orange-hover-background: #fef9f6;
  --dex-okd-button-text-orange-active-background: #fef9f6;
  --dex-okd-button-text-orange-focus-background: #fef9f6;
  --dex-okd-button-text-orange-disabled-background: #f9f9f9;
  --dex-okd-button-text-orange-default-border-color: transparent;
  --dex-okd-button-text-orange-hover-border-color: transparent;
  --dex-okd-button-text-orange-active-border-color: transparent;
  --dex-okd-button-text-orange-focus-border-color: transparent;
  --dex-okd-button-text-orange-disabled-border-color: transparent;
  --dex-okd-button-text-orange-default-font-color: #e96010;
  --dex-okd-button-text-orange-hover-font-color: #e96010;
  --dex-okd-button-text-orange-active-font-color: #e96010;
  --dex-okd-button-text-orange-focus-font-color: #e96010;
  --dex-okd-button-text-orange-disabled-font-color: rgba(233, 96, 16, .45);
  --dex-okd-button-text-orange-default-icon-color: #e96010;
  --dex-okd-button-text-orange-hover-icon-color: #e96010;
  --dex-okd-button-text-orange-active-icon-color: #e96010;
  --dex-okd-button-text-orange-focus-icon-color: #e96010;
  --dex-okd-button-text-orange-disabled-icon-color: rgba(233, 96, 16, .45);
  --dex-okd-button-text-orange-default-shadow: none;
  --dex-okd-button-text-orange-hover-shadow: none;
  --dex-okd-button-text-orange-active-shadow: none;
  --dex-okd-button-text-orange-focus-shadow: none;
  --dex-okd-button-text-orange-disabled-shadow: none;
  --dex-okd-button-text-orange-border-size: 1px
}

.theme-dark .dex-button-var,
.theme-dark.dex-button-var {
  --dex-okd-button-primary-normal-default-background: #4283ff;
  --dex-okd-button-primary-normal-hover-background: #1e6bff;
  --dex-okd-button-primary-normal-active-background: #0f3c94;
  --dex-okd-button-primary-normal-focus-background: #4283ff;
  --dex-okd-button-primary-normal-disabled-background: #909090;
  --dex-okd-button-primary-normal-default-border-color: #4283ff;
  --dex-okd-button-primary-normal-hover-border-color: #1e6bff;
  --dex-okd-button-primary-normal-active-border-color: #0f3c94;
  --dex-okd-button-primary-normal-focus-border-color: #4283ff;
  --dex-okd-button-primary-normal-disabled-border-color: #909090;
  --dex-okd-button-primary-normal-default-font-color: #fff;
  --dex-okd-button-primary-normal-hover-font-color: #fff;
  --dex-okd-button-primary-normal-active-font-color: #fff;
  --dex-okd-button-primary-normal-focus-font-color: #fff;
  --dex-okd-button-primary-normal-disabled-font-color: #b0b0b0;
  --dex-okd-button-primary-normal-default-icon-color: #fff;
  --dex-okd-button-primary-normal-hover-icon-color: #fff;
  --dex-okd-button-primary-normal-active-icon-color: #fff;
  --dex-okd-button-primary-normal-focus-icon-color: #fff;
  --dex-okd-button-primary-normal-disabled-icon-color: #b0b0b0;
  --dex-okd-button-primary-normal-default-shadow: var(--dex-okd-shadow-none);
  --dex-okd-button-primary-normal-hover-shadow: var(--dex-okd-shadow-none);
  --dex-okd-button-primary-normal-active-shadow: var(--dex-okd-shadow-none);
  --dex-okd-button-primary-normal-focus-shadow: 0px 0px 0px 3px var(--dex-okd-color-blue-200);
  --dex-okd-button-primary-normal-disabled-shadow: var(--dex-okd-shadow-none);
  --dex-okd-button-primary-normal-loader-track-color: hsla(0, 0%, 100%, .24);
  --dex-okd-button-primary-normal-loader-mark-color: #fff;
  --dex-okd-button-primary-red-default-background: #fff8f9;
  --dex-okd-button-primary-red-hover-background: #f994ae;
  --dex-okd-button-primary-red-active-background: #902b44;
  --dex-okd-button-primary-red-focus-background: #fff8f9;
  --dex-okd-button-primary-red-disabled-background: #909090;
  --dex-okd-button-primary-red-default-border-color: #fff8f9;
  --dex-okd-button-primary-red-hover-border-color: #f994ae;
  --dex-okd-button-primary-red-active-border-color: #902b44;
  --dex-okd-button-primary-red-focus-border-color: #fff8f9;
  --dex-okd-button-primary-red-disabled-border-color: #909090;
  --dex-okd-button-primary-red-default-font-color: #fff;
  --dex-okd-button-primary-red-hover-font-color: #fff;
  --dex-okd-button-primary-red-active-font-color: #fff;
  --dex-okd-button-primary-red-focus-font-color: #fff;
  --dex-okd-button-primary-red-disabled-font-color: #b0b0b0;
  --dex-okd-button-primary-red-default-icon-color: #fff;
  --dex-okd-button-primary-red-hover-icon-color: #fff;
  --dex-okd-button-primary-red-active-icon-color: #fff;
  --dex-okd-button-primary-red-focus-icon-color: #fff;
  --dex-okd-button-primary-red-disabled-icon-color: #b0b0b0;
  --dex-okd-button-primary-red-default-shadow: var(--dex-okd-shadow-sm);
  --dex-okd-button-primary-red-hover-shadow: var(--dex-okd-shadow-none);
  --dex-okd-button-primary-red-active-shadow: var(--dex-okd-shadow-none);
  --dex-okd-button-primary-red-focus-shadow: 0px 0px 0px 3px var(--dex-okd-color-red-200);
  --dex-okd-button-primary-red-disabled-shadow: var(--dex-okd-shadow-none);
  --dex-okd-button-primary-red-loader-track-color: hsla(0, 0%, 100%, .24);
  --dex-okd-button-primary-red-loader-mark-color: #fff;
  --dex-okd-button-primary-green-default-background: #d2f7de;
  --dex-okd-button-primary-green-hover-background: #79e69d;
  --dex-okd-button-primary-green-active-background: #138037;
  --dex-okd-button-primary-green-focus-background: #d2f7de;
  --dex-okd-button-primary-green-disabled-background: #909090;
  --dex-okd-button-primary-green-default-border-color: #d2f7de;
  --dex-okd-button-primary-green-hover-border-color: #79e69d;
  --dex-okd-button-primary-green-active-border-color: #138037;
  --dex-okd-button-primary-green-focus-border-color: #d2f7de;
  --dex-okd-button-primary-green-disabled-border-color: #909090;
  --dex-okd-button-primary-green-default-font-color: #fff;
  --dex-okd-button-primary-green-hover-font-color: #fff;
  --dex-okd-button-primary-green-active-font-color: #fff;
  --dex-okd-button-primary-green-focus-font-color: #fff;
  --dex-okd-button-primary-green-disabled-font-color: #b0b0b0;
  --dex-okd-button-primary-green-default-icon-color: #fff;
  --dex-okd-button-primary-green-hover-icon-color: #fff;
  --dex-okd-button-primary-green-active-icon-color: #fff;
  --dex-okd-button-primary-green-focus-icon-color: #fff;
  --dex-okd-button-primary-green-disabled-icon-color: #b0b0b0;
  --dex-okd-button-primary-green-default-shadow: var(--dex-okd-shadow-sm);
  --dex-okd-button-primary-green-hover-shadow: var(--dex-okd-shadow-none);
  --dex-okd-button-primary-green-active-shadow: var(--dex-okd-shadow-none);
  --dex-okd-button-primary-green-focus-shadow: 0px 0px 0px 3px var(--dex-okd-color-green-200);
  --dex-okd-button-primary-green-disabled-shadow: var(--dex-okd-shadow-none);
  --dex-okd-button-primary-green-loader-track-color: hsla(0, 0%, 100%, .24);
  --dex-okd-button-primary-green-loader-mark-color: #fff;
  --dex-okd-button-secondary-normal-default-background: #909090;
  --dex-okd-button-secondary-normal-hover-background: #b0b0b0;
  --dex-okd-button-secondary-normal-active-background: #6c6c6c;
  --dex-okd-button-secondary-normal-focus-background: #909090;
  --dex-okd-button-secondary-normal-disabled-background: #909090;
  --dex-okd-button-secondary-normal-default-border-color: #909090;
  --dex-okd-button-secondary-normal-hover-border-color: #b0b0b0;
  --dex-okd-button-secondary-normal-active-border-color: #6c6c6c;
  --dex-okd-button-secondary-normal-focus-border-color: #909090;
  --dex-okd-button-secondary-normal-disabled-border-color: #909090;
  --dex-okd-button-secondary-normal-default-font-color: #fff;
  --dex-okd-button-secondary-normal-hover-font-color: #fff;
  --dex-okd-button-secondary-normal-active-font-color: #fff;
  --dex-okd-button-secondary-normal-focus-font-color: #fff;
  --dex-okd-button-secondary-normal-disabled-font-color: #b0b0b0;
  --dex-okd-button-secondary-normal-default-icon-color: #fff;
  --dex-okd-button-secondary-normal-hover-icon-color: #fff;
  --dex-okd-button-secondary-normal-active-icon-color: #fff;
  --dex-okd-button-secondary-normal-focus-icon-color: #fff;
  --dex-okd-button-secondary-normal-disabled-icon-color: #b0b0b0;
  --dex-okd-button-secondary-normal-default-shadow: var(--dex-okd-shadow-none);
  --dex-okd-button-secondary-normal-hover-shadow: var(--dex-okd-shadow-none);
  --dex-okd-button-secondary-normal-active-shadow: var(--dex-okd-shadow-none);
  --dex-okd-button-secondary-normal-focus-shadow: 0px 0px 0px 3px var(--dex-okd-color-gray-200);
  --dex-okd-button-secondary-normal-disabled-shadow: var(--dex-okd-shadow-none);
  --dex-okd-button-secondary-normal-loader-track-color: #ccc;
  --dex-okd-button-secondary-normal-loader-mark-color: #fff;
  --dex-okd-button-secondary-grey-default-background: #909090;
  --dex-okd-button-secondary-grey-hover-background: #b0b0b0;
  --dex-okd-button-secondary-grey-active-background: #6c6c6c;
  --dex-okd-button-secondary-grey-focus-background: #909090;
  --dex-okd-button-secondary-grey-disabled-background: #404040;
  --dex-okd-button-secondary-grey-default-border-color: #909090;
  --dex-okd-button-secondary-grey-hover-border-color: #b0b0b0;
  --dex-okd-button-secondary-grey-active-border-color: #6c6c6c;
  --dex-okd-button-secondary-grey-focus-border-color: #909090;
  --dex-okd-button-secondary-grey-disabled-border-color: #404040;
  --dex-okd-button-secondary-grey-default-font-color: #fff;
  --dex-okd-button-secondary-grey-hover-font-color: #fff;
  --dex-okd-button-secondary-grey-active-font-color: #fff;
  --dex-okd-button-secondary-grey-focus-font-color: #fff;
  --dex-okd-button-secondary-grey-disabled-font-color: #ccc;
  --dex-okd-button-secondary-grey-default-icon-color: #fff;
  --dex-okd-button-secondary-grey-hover-icon-color: #fff;
  --dex-okd-button-secondary-grey-active-icon-color: #fff;
  --dex-okd-button-secondary-grey-focus-icon-color: #fff;
  --dex-okd-button-secondary-grey-disabled-icon-color: #ccc;
  --dex-okd-button-secondary-grey-default-shadow: var(--dex-okd-shadow-sm);
  --dex-okd-button-secondary-grey-hover-shadow: var(--dex-okd-shadow-none);
  --dex-okd-button-secondary-grey-active-shadow: var(--dex-okd-shadow-none);
  --dex-okd-button-secondary-grey-focus-shadow: 0px 0px 0px 3px var(--dex-okd-color-gray-200);
  --dex-okd-button-secondary-grey-disabled-shadow: var(--dex-okd-shadow-none);
  --dex-okd-button-secondary-grey-loader-track-color: #ccc;
  --dex-okd-button-secondary-grey-loader-mark-color: #fafafa;
  --dex-okd-button-basic-normal-default-background: transparent;
  --dex-okd-button-basic-normal-hover-background: #404040;
  --dex-okd-button-basic-normal-active-background: #6c6c6c;
  --dex-okd-button-basic-normal-focus-background: transparent;
  --dex-okd-button-basic-normal-disabled-background: transparent;
  --dex-okd-button-basic-normal-default-border-color: #b0b0b0;
  --dex-okd-button-basic-normal-hover-border-color: #b0b0b0;
  --dex-okd-button-basic-normal-active-border-color: #b0b0b0;
  --dex-okd-button-basic-normal-focus-border-color: #b0b0b0;
  --dex-okd-button-basic-normal-disabled-border-color: #909090;
  --dex-okd-button-basic-normal-default-font-color: #fff;
  --dex-okd-button-basic-normal-hover-font-color: #fff;
  --dex-okd-button-basic-normal-active-font-color: #fff;
  --dex-okd-button-basic-normal-focus-font-color: #fff;
  --dex-okd-button-basic-normal-disabled-font-color: #b0b0b0;
  --dex-okd-button-basic-normal-default-icon-color: #fff;
  --dex-okd-button-basic-normal-hover-icon-color: #fff;
  --dex-okd-button-basic-normal-active-icon-color: #fff;
  --dex-okd-button-basic-normal-focus-icon-color: #fff;
  --dex-okd-button-basic-normal-disabled-icon-color: #b0b0b0;
  --dex-okd-button-basic-normal-default-shadow: var(--dex-okd-shadow-none);
  --dex-okd-button-basic-normal-hover-shadow: var(--dex-okd-shadow-none);
  --dex-okd-button-basic-normal-active-shadow: var(--dex-okd-shadow-none);
  --dex-okd-button-basic-normal-focus-shadow: 0px 0px 0px 3px var(--dex-okd-color-gray-300);
  --dex-okd-button-basic-normal-disabled-shadow: var(--dex-okd-shadow-none);
  --dex-okd-button-basic-normal-loader-track-color: #909090;
  --dex-okd-button-basic-normal-loader-mark-color: #fff;
  --dex-okd-button-plain-normal-default-background: transparent;
  --dex-okd-button-plain-normal-hover-background: #051738;
  --dex-okd-button-plain-normal-active-background: #051738;
  --dex-okd-button-plain-normal-focus-background: #051738;
  --dex-okd-button-plain-normal-disabled-background: transparent;
  --dex-okd-button-plain-normal-default-border-color: transparent;
  --dex-okd-button-plain-normal-hover-border-color: transparent;
  --dex-okd-button-plain-normal-active-border-color: transparent;
  --dex-okd-button-plain-normal-focus-border-color: transparent;
  --dex-okd-button-plain-normal-disabled-border-color: transparent;
  --dex-okd-button-plain-normal-default-font-color: #3077ff;
  --dex-okd-button-plain-normal-hover-font-color: #4283ff;
  --dex-okd-button-plain-normal-active-font-color: #4283ff;
  --dex-okd-button-plain-normal-focus-font-color: #4283ff;
  --dex-okd-button-plain-normal-disabled-font-color: #ccc;
  --dex-okd-button-plain-normal-default-icon-color: #3077ff;
  --dex-okd-button-plain-normal-hover-icon-color: #4283ff;
  --dex-okd-button-plain-normal-active-icon-color: #4283ff;
  --dex-okd-button-plain-normal-focus-icon-color: #4283ff;
  --dex-okd-button-plain-normal-disabled-icon-color: #ccc;
  --dex-okd-button-plain-normal-default-shadow: none;
  --dex-okd-button-plain-normal-hover-shadow: none;
  --dex-okd-button-plain-normal-active-shadow: none;
  --dex-okd-button-plain-normal-focus-shadow: none;
  --dex-okd-button-plain-normal-disabled-shadow: none;
  --dex-okd-button-plain-red-default-background: transparent;
  --dex-okd-button-plain-red-hover-background: #270b12;
  --dex-okd-button-plain-red-active-background: #270b12;
  --dex-okd-button-plain-red-focus-background: #270b12;
  --dex-okd-button-plain-red-disabled-background: #000;
  --dex-okd-button-plain-red-default-border-color: transparent;
  --dex-okd-button-plain-red-hover-border-color: transparent;
  --dex-okd-button-plain-red-active-border-color: transparent;
  --dex-okd-button-plain-red-focus-border-color: transparent;
  --dex-okd-button-plain-red-disabled-border-color: transparent;
  --dex-okd-button-plain-red-default-font-color: #f9b6c7;
  --dex-okd-button-plain-red-hover-font-color: #f9b6c7;
  --dex-okd-button-plain-red-active-font-color: #f9b6c7;
  --dex-okd-button-plain-red-focus-font-color: #f9b6c7;
  --dex-okd-button-plain-red-disabled-font-color: rgba(249, 182, 199, .45);
  --dex-okd-button-plain-red-default-icon-color: #f9b6c7;
  --dex-okd-button-plain-red-hover-icon-color: #f9b6c7;
  --dex-okd-button-plain-red-active-icon-color: #f9b6c7;
  --dex-okd-button-plain-red-focus-icon-color: #f9b6c7;
  --dex-okd-button-plain-red-disabled-icon-color: rgba(249, 182, 199, .45);
  --dex-okd-button-plain-red-default-shadow: none;
  --dex-okd-button-plain-red-hover-shadow: none;
  --dex-okd-button-plain-red-active-shadow: none;
  --dex-okd-button-plain-red-focus-shadow: none;
  --dex-okd-button-plain-red-disabled-shadow: none;
  --dex-okd-button-plain-green-default-background: transparent;
  --dex-okd-button-plain-green-hover-background: #002b1f;
  --dex-okd-button-plain-green-active-background: #002b1f;
  --dex-okd-button-plain-green-focus-background: #002b1f;
  --dex-okd-button-plain-green-disabled-background: #000;
  --dex-okd-button-plain-green-default-border-color: transparent;
  --dex-okd-button-plain-green-hover-border-color: transparent;
  --dex-okd-button-plain-green-active-border-color: transparent;
  --dex-okd-button-plain-green-focus-border-color: transparent;
  --dex-okd-button-plain-green-disabled-border-color: transparent;
  --dex-okd-button-plain-green-default-font-color: #a5efbe;
  --dex-okd-button-plain-green-hover-font-color: #a5efbe;
  --dex-okd-button-plain-green-active-font-color: #a5efbe;
  --dex-okd-button-plain-green-focus-font-color: #a5efbe;
  --dex-okd-button-plain-green-disabled-font-color: rgba(165, 239, 190, .45);
  --dex-okd-button-plain-green-default-icon-color: #a5efbe;
  --dex-okd-button-plain-green-hover-icon-color: #a5efbe;
  --dex-okd-button-plain-green-active-icon-color: #a5efbe;
  --dex-okd-button-plain-green-focus-icon-color: #a5efbe;
  --dex-okd-button-plain-green-disabled-icon-color: rgba(165, 239, 190, .45);
  --dex-okd-button-plain-green-default-shadow: none;
  --dex-okd-button-plain-green-hover-shadow: none;
  --dex-okd-button-plain-green-active-shadow: none;
  --dex-okd-button-plain-green-focus-shadow: none;
  --dex-okd-button-plain-green-disabled-shadow: none;
  --dex-okd-button-plain-orange-default-background: transparent;
  --dex-okd-button-plain-orange-hover-background: #361604;
  --dex-okd-button-plain-orange-active-background: #361604;
  --dex-okd-button-plain-orange-focus-background: #361604;
  --dex-okd-button-plain-orange-disabled-background: #000;
  --dex-okd-button-plain-orange-default-border-color: transparent;
  --dex-okd-button-plain-orange-hover-border-color: transparent;
  --dex-okd-button-plain-orange-active-border-color: transparent;
  --dex-okd-button-plain-orange-focus-border-color: transparent;
  --dex-okd-button-plain-orange-disabled-border-color: transparent;
  --dex-okd-button-plain-orange-default-font-color: #f87428;
  --dex-okd-button-plain-orange-hover-font-color: #f87428;
  --dex-okd-button-plain-orange-active-font-color: #f87428;
  --dex-okd-button-plain-orange-focus-font-color: #f87428;
  --dex-okd-button-plain-orange-disabled-font-color: rgba(248, 116, 40, .45);
  --dex-okd-button-plain-orange-default-icon-color: #f87428;
  --dex-okd-button-plain-orange-hover-icon-color: #f87428;
  --dex-okd-button-plain-orange-active-icon-color: #f87428;
  --dex-okd-button-plain-orange-focus-icon-color: #f87428;
  --dex-okd-button-plain-orange-disabled-icon-color: rgba(248, 116, 40, .45);
  --dex-okd-button-plain-orange-default-shadow: none;
  --dex-okd-button-plain-orange-hover-shadow: none;
  --dex-okd-button-plain-orange-active-shadow: none;
  --dex-okd-button-plain-orange-focus-shadow: none;
  --dex-okd-button-plain-orange-disabled-shadow: none;
  --dex-okd-button-plain-yellow-default-background: transparent;
  --dex-okd-button-plain-yellow-hover-background: #2d2104;
  --dex-okd-button-plain-yellow-active-background: #2d2104;
  --dex-okd-button-plain-yellow-focus-background: #2d2104;
  --dex-okd-button-plain-yellow-disabled-background: #000;
  --dex-okd-button-plain-yellow-default-border-color: transparent;
  --dex-okd-button-plain-yellow-hover-border-color: transparent;
  --dex-okd-button-plain-yellow-active-border-color: transparent;
  --dex-okd-button-plain-yellow-focus-border-color: transparent;
  --dex-okd-button-plain-yellow-disabled-border-color: transparent;
  --dex-okd-button-plain-yellow-default-font-color: #dea921;
  --dex-okd-button-plain-yellow-hover-font-color: #dea921;
  --dex-okd-button-plain-yellow-active-font-color: #dea921;
  --dex-okd-button-plain-yellow-focus-font-color: #dea921;
  --dex-okd-button-plain-yellow-disabled-font-color: rgba(222, 169, 33, .45);
  --dex-okd-button-plain-yellow-default-icon-color: #dea921;
  --dex-okd-button-plain-yellow-hover-icon-color: #dea921;
  --dex-okd-button-plain-yellow-active-icon-color: #dea921;
  --dex-okd-button-plain-yellow-focus-icon-color: #dea921;
  --dex-okd-button-plain-yellow-disabled-icon-color: rgba(222, 169, 33, .45);
  --dex-okd-button-plain-yellow-default-shadow: none;
  --dex-okd-button-plain-yellow-hover-shadow: none;
  --dex-okd-button-plain-yellow-active-shadow: none;
  --dex-okd-button-plain-yellow-focus-shadow: none;
  --dex-okd-button-plain-yellow-disabled-shadow: none;
  --dex-okd-button-xxs-font-size: var(--dex-okd-font-size-xs);
  --dex-okd-button-xs-font-size: var(--dex-okd-font-size-xs);
  --dex-okd-button-sm-font-size: var(--dex-okd-font-size-md);
  --dex-okd-button-md-font-size: var(--dex-okd-font-size-md);
  --dex-okd-button-lg-font-size: var(--dex-okd-font-size-base);
  --dex-okd-button-xl-font-size: 18px;
  --dex-okd-button-xxs-icon-size: 14px;
  --dex-okd-button-xs-icon-size: 14px;
  --dex-okd-button-sm-icon-size: 18px;
  --dex-okd-button-md-icon-size: 18px;
  --dex-okd-button-lg-icon-size: 18px;
  --dex-okd-button-xl-icon-size: 18px;
  --dex-okd-button-xxs-icon-margin: 6px;
  --dex-okd-button-xs-icon-margin: 6px;
  --dex-okd-button-sm-icon-margin: 6px;
  --dex-okd-button-md-icon-margin: 6px;
  --dex-okd-button-lg-icon-margin: 8px;
  --dex-okd-button-xl-icon-margin: 8px;
  --dex-okd-button-xxs-line-height: var(--dex-okd-line-height-xs);
  --dex-okd-button-xs-line-height: var(--dex-okd-line-height-xs);
  --dex-okd-button-sm-line-height: var(--dex-okd-line-height-md);
  --dex-okd-button-md-line-height: var(--dex-okd-line-height-md);
  --dex-okd-button-lg-line-height: var(--dex-okd-line-height-base);
  --dex-okd-button-xl-line-height: var(--dex-okd-line-height-base);
  --dex-okd-button-xxs-padding-horizontal: 8px;
  --dex-okd-button-xxs-padding-vertical: 3px;
  --dex-okd-button-xs-padding-horizontal: 8px;
  --dex-okd-button-xs-padding-vertical: 5px;
  --dex-okd-button-sm-padding-horizontal: 12px;
  --dex-okd-button-sm-padding-vertical: 7px;
  --dex-okd-button-md-padding-horizontal: 16px;
  --dex-okd-button-md-padding-vertical: 9px;
  --dex-okd-button-lg-padding-horizontal: 24px;
  --dex-okd-button-lg-padding-vertical: 13px;
  --dex-okd-button-xl-padding-horizontal: 24px;
  --dex-okd-button-xl-padding-vertical: 17px;
  --dex-okd-button-xxs-min-width: 63px;
  --dex-okd-button-xs-min-width: 63px;
  --dex-okd-button-sm-min-width: 81px;
  --dex-okd-button-md-min-width: 90px;
  --dex-okd-button-lg-min-width: 108px;
  --dex-okd-button-xl-min-width: 126px;
  --dex-okd-button-xxs-border-radius: 60px;
  --dex-okd-button-xs-border-radius: 60px;
  --dex-okd-button-sm-border-radius: 60px;
  --dex-okd-button-md-border-radius: 60px;
  --dex-okd-button-lg-border-radius: 60px;
  --dex-okd-button-xl-border-radius: 60px;
  --dex-okd-button-xxs-border-size: 1px;
  --dex-okd-button-xs-border-size: 1px;
  --dex-okd-button-sm-border-size: 1px;
  --dex-okd-button-md-border-size: 1px;
  --dex-okd-button-lg-border-size: 1px;
  --dex-okd-button-xl-border-size: 1px;
  --dex-okd-button-xl-loader-size: 18px;
  --dex-okd-button-lg-loader-size: 14px;
  --dex-okd-button-md-loader-size: 14px;
  --dex-okd-button-sm-loader-size: 14px;
  --dex-okd-button-xs-loader-size: 14px;
  --dex-okd-button-xxs-loader-size: 14px;
  --dex-okd-button-xl-loader-text-margin-left: 8px;
  --dex-okd-button-lg-loader-text-margin-left: 8px;
  --dex-okd-button-md-loader-text-margin-left: 6px;
  --dex-okd-button-sm-loader-text-margin-left: 6px;
  --dex-okd-button-xs-loader-text-margin-left: 6px;
  --dex-okd-button-xxs-loader-text-margin-left: 6px;
  --dex-okd-button-s-font-size: 14px;
  --dex-okd-button-s-icon-size: 18px;
  --dex-okd-button-s-icon-margin: 6px;
  --dex-okd-button-s-line-height: 16px;
  --dex-okd-button-s-padding-horizontal: 12px;
  --dex-okd-button-s-padding-vertical: 7px;
  --dex-okd-button-s-min-width: 72px;
  --dex-okd-button-s-border-radius: 60px;
  --dex-okd-button-s-loader-size: 14px;
  --dex-okd-button-s-loader-text-margin-left: 6px;
  --dex-okd-button-rect-xxs-border-radius: 4px;
  --dex-okd-button-rect-xs-border-radius: 4px;
  --dex-okd-button-rect-sm-border-radius: 4px;
  --dex-okd-button-rect-s-border-radius: 4px;
  --dex-okd-button-rect-md-border-radius: 4px;
  --dex-okd-button-rect-lg-border-radius: 8px;
  --dex-okd-button-rect-xl-border-radius: 8px;
  --dex-okd-button-fill-highlight-default-background: var(--dex-okd-color-container-inverse);
  --dex-okd-button-fill-highlight-hover-background: var(--dex-okd-color-container-inverse);
  --dex-okd-button-fill-highlight-active-background: var(--dex-okd-color-container-inverse);
  --dex-okd-button-fill-highlight-focus-background: #fafafa;
  --dex-okd-button-fill-highlight-disabled-background: #1d1d1d;
  --dex-okd-button-fill-highlight-default-border-color: var(--dex-okd-color-common-transparent);
  --dex-okd-button-fill-highlight-hover-border-color: var(--dex-okd-color-common-transparent);
  --dex-okd-button-fill-highlight-active-border-color: var(--dex-okd-color-common-transparent);
  --dex-okd-button-fill-highlight-focus-border-color: #fafafa;
  --dex-okd-button-fill-highlight-disabled-border-color: var(--dex-okd-color-common-transparent);
  --dex-okd-button-fill-highlight-default-font-color: var(--dex-okd-color-content-inverse);
  --dex-okd-button-fill-highlight-hover-font-color: var(--dex-okd-color-content-contrast);
  --dex-okd-button-fill-highlight-active-font-color: var(--dex-okd-color-content-contrast);
  --dex-okd-button-fill-highlight-focus-font-color: #000;
  --dex-okd-button-fill-highlight-disabled-font-color: var(--dex-okd-color-content-disabled);
  --dex-okd-button-fill-highlight-default-icon-color: var(--dex-okd-color-content-inverse);
  --dex-okd-button-fill-highlight-hover-icon-color: var(--dex-okd-color-content-contrast);
  --dex-okd-button-fill-highlight-active-icon-color: var(--dex-okd-color-content-contrast);
  --dex-okd-button-fill-highlight-focus-icon-color: #000;
  --dex-okd-button-fill-highlight-disabled-icon-color: var(--dex-okd-color-content-disabled);
  --dex-okd-button-fill-highlight-default-shadow: var(--dex-okd-shadow-none);
  --dex-okd-button-fill-highlight-hover-shadow: var(--dex-okd-shadow-none);
  --dex-okd-button-fill-highlight-active-shadow: var(--dex-okd-shadow-none);
  --dex-okd-button-fill-highlight-focus-shadow: 0px 0px 0px 1.5px #000, 0px 0px 0px 4px #fafafa40;
  --dex-okd-button-fill-highlight-disabled-shadow: var(--dex-okd-shadow-none);
  --dex-okd-button-fill-highlight-loader-track-color: rgba(0, 0, 0, .26);
  --dex-okd-button-fill-highlight-loader-mark-color: var(--dex-okd-color-border-contrast);
  --dex-okd-button-fill-highlight-border-size: 0px;
  --dex-okd-button-fill-primary-default-background: var(--dex-okd-color-container-inverse);
  --dex-okd-button-fill-primary-hover-background: var(--dex-okd-color-container-inverse);
  --dex-okd-button-fill-primary-active-background: var(--dex-okd-color-container-inverse);
  --dex-okd-button-fill-primary-focus-background: #1453cc;
  --dex-okd-button-fill-primary-disabled-background: #1d1d1d;
  --dex-okd-button-fill-primary-default-border-color: var(--dex-okd-color-container-inverse);
  --dex-okd-button-fill-primary-hover-border-color: var(--dex-okd-color-common-transparent);
  --dex-okd-button-fill-primary-active-border-color: transparent;
  --dex-okd-button-fill-primary-focus-border-color: transparent;
  --dex-okd-button-fill-primary-disabled-border-color: var(--dex-okd-color-background-surface-primary);
  --dex-okd-button-fill-primary-default-font-color: var(--dex-okd-color-content-inverse);
  --dex-okd-button-fill-primary-hover-font-color: var(--dex-okd-color-content-contrast);
  --dex-okd-button-fill-primary-active-font-color: var(--dex-okd-color-content-contrast);
  --dex-okd-button-fill-primary-focus-font-color: #fff;
  --dex-okd-button-fill-primary-disabled-font-color: var(--dex-okd-color-content-disabled);
  --dex-okd-button-fill-primary-default-icon-color: var(--dex-okd-color-content-inverse);
  --dex-okd-button-fill-primary-hover-icon-color: rgba(0, 0, 0, .6);
  --dex-okd-button-fill-primary-active-icon-color: var(--dex-okd-color-content-contrast);
  --dex-okd-button-fill-primary-focus-icon-color: #fff;
  --dex-okd-button-fill-primary-disabled-icon-color: var(--dex-okd-color-content-disabled);
  --dex-okd-button-fill-primary-default-shadow: var(--dex-okd-shadow-none);
  --dex-okd-button-fill-primary-hover-shadow: var(--dex-okd-shadow-none);
  --dex-okd-button-fill-primary-active-shadow: var(--dex-okd-shadow-none);
  --dex-okd-button-fill-primary-focus-shadow: 0px 0px 0px 1.5px #121212, 0px 0px 0px 4px #2676ff8c;
  --dex-okd-button-fill-primary-disabled-shadow: var(--dex-okd-shadow-none);
  --dex-okd-button-fill-primary-loader-track-color: rgba(0, 0, 0, .26);
  --dex-okd-button-fill-primary-loader-mark-color: var(--dex-okd-color-border-contrast);
  --dex-okd-button-fill-primary-border-size: 0px;
  --dex-okd-button-fill-secondary-default-background: hsla(0, 0%, 98%, .06);
  --dex-okd-button-fill-secondary-hover-background: hsla(0, 0%, 100%, .15);
  --dex-okd-button-fill-secondary-active-background: hsla(0, 0%, 100%, .15);
  --dex-okd-button-fill-secondary-focus-background: hsla(0, 0%, 100%, .15);
  --dex-okd-button-fill-secondary-disabled-background: hsla(0, 0%, 100%, .06);
  --dex-okd-button-fill-secondary-default-border-color: transparent;
  --dex-okd-button-fill-secondary-hover-border-color: transparent;
  --dex-okd-button-fill-secondary-active-border-color: transparent;
  --dex-okd-button-fill-secondary-focus-border-color: transparent;
  --dex-okd-button-fill-secondary-disabled-border-color: #242424;
  --dex-okd-button-fill-secondary-default-font-color: #fafafa;
  --dex-okd-button-fill-secondary-hover-font-color: #fff;
  --dex-okd-button-fill-secondary-active-font-color: #fff;
  --dex-okd-button-fill-secondary-focus-font-color: #fff;
  --dex-okd-button-fill-secondary-disabled-font-color: #6c6c6c;
  --dex-okd-button-fill-secondary-default-icon-color: #fafafa;
  --dex-okd-button-fill-secondary-hover-icon-color: #fafafa;
  --dex-okd-button-fill-secondary-active-icon-color: #fff;
  --dex-okd-button-fill-secondary-focus-icon-color: #fff;
  --dex-okd-button-fill-secondary-disabled-icon-color: #6c6c6c;
  --dex-okd-button-fill-secondary-default-shadow: var(--dex-okd-shadow-none);
  --dex-okd-button-fill-secondary-hover-shadow: var(--dex-okd-shadow-none);
  --dex-okd-button-fill-secondary-active-shadow: var(--dex-okd-shadow-none);
  --dex-okd-button-fill-secondary-focus-shadow: 0px 0px 0px 1.5px #121212, 0px 0px 0px 4px #ffffff1a;
  --dex-okd-button-fill-secondary-disabled-shadow: var(--dex-okd-shadow-none);
  --dex-okd-button-fill-secondary-loader-track-color: #6c6c6c;
  --dex-okd-button-fill-secondary-loader-mark-color: #fff;
  --dex-okd-button-fill-secondary-border-size: 0px;
  --dex-okd-button-fill-tertiary-border-size: 0px;
  --dex-okd-button-fill-tertiary-default-background: var(--dex-okd-color-container-primary);
  --dex-okd-button-fill-tertiary-hover-background: var(--dex-okd-color-container-primary);
  --dex-okd-button-fill-tertiary-focus-background: hsla(0, 0%, 100%, .8);
  --dex-okd-button-fill-tertiary-active-background: var(--dex-okd-color-container-primary);
  --dex-okd-button-fill-tertiary-disabled-background: rgba(39, 39, 39, .06);
  --dex-okd-button-fill-tertiary-default-border-color: var(--dex-okd-color-container-primary);
  --dex-okd-button-fill-tertiary-hover-border-color: rgba(39, 39, 39, 0);
  --dex-okd-button-fill-tertiary-focus-border-color: hsla(0, 0%, 100%, 0);
  --dex-okd-button-fill-tertiary-active-border-color: rgba(39, 39, 39, 0);
  --dex-okd-button-fill-tertiary-disabled-border-color: rgba(39, 39, 39, .06);
  --dex-okd-button-fill-tertiary-default-font-color: var(--dex-okd-color-content-primary);
  --dex-okd-button-fill-tertiary-default-icon-color: var(--dex-okd-color-content-primary);
  --dex-okd-button-fill-tertiary-hover-font-color: var(--dex-okd-color-content-contrast);
  --dex-okd-button-fill-tertiary-hover-icon-color: var(--dex-okd-color-content-contrast);
  --dex-okd-button-fill-tertiary-focus-font-color: #000;
  --dex-okd-button-fill-tertiary-focus-icon-color: #000;
  --dex-okd-button-fill-tertiary-active-icon-color: var(--dex-okd-color-content-contrast);
  --dex-okd-button-fill-tertiary-active-font-color: var(--dex-okd-color-content-contrast);
  --dex-okd-button-fill-tertiary-disabled-icon-color: rgba(0, 0, 0, .36);
  --dex-okd-button-fill-tertiary-disabled-font-color: rgba(0, 0, 0, .36);
  --dex-okd-button-fill-tertiary-default-shadow: 0px 0px 0px 0px transparent;
  --dex-okd-button-fill-tertiary-hover-shadow: 0px 0px 0px 0px transparent;
  --dex-okd-button-fill-tertiary-focus-shadow: 0px 0px 0px 0px transparent;
  --dex-okd-button-fill-tertiary-active-shadow: 0px 0px 0px 0px transparent;
  --dex-okd-button-fill-tertiary-disabled-shadow: 0px 0px 0px 0px transparent;
  --dex-okd-button-fill-tertiary-loader-track-color: var(--dex-okd-color-border-primary);
  --dex-okd-button-fill-tertiary-loader-mark-color: var(--dex-okd-color-border-selected);
  --dex-okd-button-fill-quaternary-border-size: 0px;
  --dex-okd-button-fill-quaternary-default-background: hsla(0, 0%, 100%, .06);
  --dex-okd-button-fill-quaternary-default-border-color: transparent;
  --dex-okd-button-fill-quaternary-default-icon-color: #fff;
  --dex-okd-button-fill-quaternary-default-font-color: #fff;
  --dex-okd-button-fill-quaternary-hover-icon-color: #fff;
  --dex-okd-button-fill-quaternary-hover-font-color: #fff;
  --dex-okd-button-fill-quaternary-hover-border-color: transparent;
  --dex-okd-button-fill-quaternary-hover-background: hsla(0, 0%, 100%, .15);
  --dex-okd-button-fill-quaternary-focus-icon-color: #fff;
  --dex-okd-button-fill-quaternary-focus-font-color: #fff;
  --dex-okd-button-fill-quaternary-focus-border-color: transparent;
  --dex-okd-button-fill-quaternary-focus-background: hsla(0, 0%, 100%, .15);
  --dex-okd-button-fill-quaternary-active-icon-color: #fff;
  --dex-okd-button-fill-quaternary-active-font-color: #fff;
  --dex-okd-button-fill-quaternary-active-border-color: transparent;
  --dex-okd-button-fill-quaternary-active-background: hsla(0, 0%, 100%, .15);
  --dex-okd-button-fill-quaternary-disabled-icon-color: hsla(0, 0%, 100%, .3);
  --dex-okd-button-fill-quaternary-disabled-font-color: hsla(0, 0%, 100%, .3);
  --dex-okd-button-fill-quaternary-disabled-border-color: transparent;
  --dex-okd-button-fill-quaternary-disabled-background: hsla(0, 0%, 100%, .06);
  --dex-okd-button-fill-quaternary-loader-mark-color: #fff;
  --dex-okd-button-fill-quaternary-loader-track-color: hsla(0, 0%, 100%, .15);
  --dex-okd-button-fill-quaternary-default-shadow: 0px 0px 0px 0px transparent;
  --dex-okd-button-fill-quaternary-hover-shadow: 0px 0px 0px 0px transparent;
  --dex-okd-button-fill-quaternary-focus-shadow: 0px 0px 0px 0px transparent;
  --dex-okd-button-fill-quaternary-active-shadow: 0px 0px 0px 0px transparent;
  --dex-okd-button-fill-quaternary-disabled-shadow: 0px 0px 0px 0px transparent;
  --dex-okd-button-fill-red-default-background: var(--dex-okd-color-semantic-negative);
  --dex-okd-button-fill-red-hover-background: rgba(202, 63, 100, .8);
  --dex-okd-button-fill-red-active-background: rgba(202, 63, 100, .8);
  --dex-okd-button-fill-red-focus-background: #f04872;
  --dex-okd-button-fill-red-disabled-background: #1d1d1d;
  --dex-okd-button-fill-red-default-border-color: var(--dex-okd-color-semantic-negative);
  --dex-okd-button-fill-red-hover-border-color: transparent;
  --dex-okd-button-fill-red-active-border-color: transparent;
  --dex-okd-button-fill-red-focus-border-color: transparent;
  --dex-okd-button-fill-red-disabled-border-color: var(--dex-okd-color-common-transparent);
  --dex-okd-button-fill-red-default-font-color: var(--dex-okd-color-content-primary);
  --dex-okd-button-fill-red-hover-font-color: var(--dex-okd-color-content-primary);
  --dex-okd-button-fill-red-active-font-color: var(--dex-okd-color-content-primary);
  --dex-okd-button-fill-red-focus-font-color: #fff;
  --dex-okd-button-fill-red-disabled-font-color: var(--dex-okd-color-content-disabled);
  --dex-okd-button-fill-red-default-icon-color: var(--dex-okd-color-content-primary);
  --dex-okd-button-fill-red-hover-icon-color: var(--dex-okd-color-content-primary);
  --dex-okd-button-fill-red-active-icon-color: var(--dex-okd-color-content-primary);
  --dex-okd-button-fill-red-focus-icon-color: #fff;
  --dex-okd-button-fill-red-disabled-icon-color: var(--dex-okd-color-content-disabled);
  --dex-okd-button-fill-red-default-shadow: var(--dex-okd-shadow-sm);
  --dex-okd-button-fill-red-hover-shadow: var(--dex-okd-shadow-none);
  --dex-okd-button-fill-red-active-shadow: var(--dex-okd-shadow-none);
  --dex-okd-button-fill-red-focus-shadow: 0px 0px 0px 1.5px #121212, 0px 0px 0px 4px #bf474780;
  --dex-okd-button-fill-red-disabled-shadow: var(--dex-okd-shadow-none);
  --dex-okd-button-fill-red-loader-track-color: hsla(0, 0%, 100%, .15);
  --dex-okd-button-fill-red-loader-mark-color: var(--dex-okd-color-border-selected);
  --dex-okd-button-fill-red-border-size: 0px;
  --dex-okd-button-fill-green-default-background: var(--dex-okd-color-semantic-positive);
  --dex-okd-button-fill-green-hover-background: rgba(37, 167, 80, .8);
  --dex-okd-button-fill-green-active-background: rgba(37, 167, 80, .8);
  --dex-okd-button-fill-green-focus-background: #25a750;
  --dex-okd-button-fill-green-disabled-background: #1d1d1d;
  --dex-okd-button-fill-green-default-border-color: var(--dex-okd-color-semantic-positive);
  --dex-okd-button-fill-green-hover-border-color: transparent;
  --dex-okd-button-fill-green-active-border-color: transparent;
  --dex-okd-button-fill-green-focus-border-color: #25a750;
  --dex-okd-button-fill-green-disabled-border-color: var(--dex-okd-color-common-transparent);
  --dex-okd-button-fill-green-default-font-color: var(--dex-okd-color-content-primary);
  --dex-okd-button-fill-green-hover-font-color: var(--dex-okd-color-content-primary);
  --dex-okd-button-fill-green-active-font-color: var(--dex-okd-color-content-primary);
  --dex-okd-button-fill-green-focus-font-color: #fff;
  --dex-okd-button-fill-green-disabled-font-color: var(--dex-okd-color-content-disabled);
  --dex-okd-button-fill-green-default-icon-color: var(--dex-okd-color-content-primary);
  --dex-okd-button-fill-green-hover-icon-color: var(--dex-okd-color-content-primary);
  --dex-okd-button-fill-green-active-icon-color: var(--dex-okd-color-content-primary);
  --dex-okd-button-fill-green-focus-icon-color: #fff;
  --dex-okd-button-fill-green-disabled-icon-color: var(--dex-okd-color-content-disabled);
  --dex-okd-button-fill-green-default-shadow: var(--dex-okd-shadow-sm);
  --dex-okd-button-fill-green-hover-shadow: var(--dex-okd-shadow-none);
  --dex-okd-button-fill-green-active-shadow: var(--dex-okd-shadow-none);
  --dex-okd-button-fill-green-focus-shadow: 0px 0px 0px 1.5px #121212, 0px 0px 0px 4px #33b06a8c;
  --dex-okd-button-fill-green-disabled-shadow: var(--dex-okd-shadow-none);
  --dex-okd-button-fill-green-loader-track-color: hsla(0, 0%, 100%, .15);
  --dex-okd-button-fill-green-loader-mark-color: var(--dex-okd-color-border-selected);
  --dex-okd-button-fill-green-border-size: 0px;
  --dex-okd-button-fill-grey-default-background: #1d1d1d;
  --dex-okd-button-fill-grey-hover-background: #272727;
  --dex-okd-button-fill-grey-active-background: #1d1d1d;
  --dex-okd-button-fill-grey-focus-background: rgba(64, 64, 64, .6);
  --dex-okd-button-fill-grey-disabled-background: #1d1d1d;
  --dex-okd-button-fill-grey-default-border-color: var(--dex-okd-color-background-surface-primary);
  --dex-okd-button-fill-grey-hover-border-color: transparent;
  --dex-okd-button-fill-grey-active-border-color: transparent;
  --dex-okd-button-fill-grey-focus-border-color: #404040;
  --dex-okd-button-fill-grey-disabled-border-color: var(--dex-okd-color-background-surface-disable);
  --dex-okd-button-fill-grey-default-font-color: var(--dex-okd-color-content-primary);
  --dex-okd-button-fill-grey-hover-font-color: var(--dex-okd-color-content-primary);
  --dex-okd-button-fill-grey-active-font-color: var(--dex-okd-color-content-primary);
  --dex-okd-button-fill-grey-focus-font-color: #fff;
  --dex-okd-button-fill-grey-disabled-font-color: var(--dex-okd-color-content-disabled);
  --dex-okd-button-fill-grey-default-icon-color: var(--dex-okd-color-content-primary);
  --dex-okd-button-fill-grey-hover-icon-color: var(--dex-okd-color-content-primary);
  --dex-okd-button-fill-grey-active-icon-color: var(--dex-okd-color-content-primary);
  --dex-okd-button-fill-grey-focus-icon-color: #fff;
  --dex-okd-button-fill-grey-disabled-icon-color: var(--dex-okd-color-content-disabled);
  --dex-okd-button-fill-grey-default-shadow: 0 0 0 0 transparent;
  --dex-okd-button-fill-grey-hover-shadow: var(--dex-okd-shadow-none);
  --dex-okd-button-fill-grey-active-shadow: 0 0 0 0 transparent;
  --dex-okd-button-fill-grey-focus-shadow: 0px 0px 0px 1.5px #121212, 0px 0px 0px 4px #ffffff1a;
  --dex-okd-button-fill-grey-disabled-shadow: var(--dex-okd-shadow-none);
  --dex-okd-button-fill-grey-loader-track-color: var(--dex-okd-color-border-primary);
  --dex-okd-button-fill-grey-loader-mark-color: var(--dex-okd-color-border-selected);
  --dex-okd-button-fill-grey-border-size: 0px;
  --dex-okd-button-outline-highlight-border-size: 1px;
  --dex-okd-button-outline-highlight-default-background: transparent;
  --dex-okd-button-outline-highlight-default-border-color: var(--dex-okd-color-border-selected);
  --dex-okd-button-outline-highlight-default-font-color: var(--dex-okd-color-content-primary);
  --dex-okd-button-outline-highlight-hover-background: var(--dex-okd-color-container-inverse);
  --dex-okd-button-outline-highlight-hover-border-color: var(--dex-okd-color-border-selected);
  --dex-okd-button-outline-highlight-hover-font-color: var(--dex-okd-color-content-inverse);
  --dex-okd-button-outline-highlight-hover-icon-color: var(--dex-okd-color-content-inverse);
  --dex-okd-button-outline-highlight-hover-shadow: 0px 0px 0px 0px transparent;
  --dex-okd-button-outline-highlight-default-shadow: 0px 0px 0px 0px transparent;
  --dex-okd-button-outline-highlight-focus-background: #fff;
  --dex-okd-button-outline-highlight-focus-border-color: #fff;
  --dex-okd-button-outline-highlight-focus-font-color: #000;
  --dex-okd-button-outline-highlight-focus-icon-color: #000;
  --dex-okd-button-outline-highlight-focus-shadow: 0px 0px 0px 0px transparent;
  --dex-okd-button-outline-highlight-default-icon-color: var(--dex-okd-color-content-primary);
  --dex-okd-button-outline-highlight-active-background: var(--dex-okd-color-container-inverse);
  --dex-okd-button-outline-highlight-active-border-color: var(--dex-okd-color-border-selected);
  --dex-okd-button-outline-highlight-active-font-color: var(--dex-okd-color-content-inverse);
  --dex-okd-button-outline-highlight-active-icon-color: var(--dex-okd-color-content-inverse);
  --dex-okd-button-outline-highlight-active-shadow: 0px 0px 0px 0px transparent;
  --dex-okd-button-outline-highlight-disabled-background: transparent;
  --dex-okd-button-outline-highlight-disabled-font-color: var(--dex-okd-color-content-disabled);
  --dex-okd-button-outline-highlight-disabled-icon-color: var(--dex-okd-color-content-disabled);
  --dex-okd-button-outline-highlight-disabled-border-color: var(--dex-okd-color-border-primary);
  --dex-okd-button-outline-highlight-loader-track-color: hsla(0, 0%, 100%, .25);
  --dex-okd-button-outline-highlight-loader-mark-color: #fff;
  --dex-okd-button-outline-highlight-disabled-shadow: 0px 0px 0px 0px transparent;
  --dex-okd-button-outline-primary-default-background: transparent;
  --dex-okd-button-outline-primary-hover-background: #1d1d1d;
  --dex-okd-button-outline-primary-active-background: #1d1d1d;
  --dex-okd-button-outline-primary-focus-background: #242424;
  --dex-okd-button-outline-primary-disabled-background: #1d1d1d;
  --dex-okd-button-outline-primary-default-border-color: var(--dex-okd-color-border-secondary);
  --dex-okd-button-outline-primary-hover-border-color: var(--dex-okd-color-border-secondary);
  --dex-okd-button-outline-primary-active-border-color: var(--dex-okd-color-border-secondary);
  --dex-okd-button-outline-primary-focus-border-color: #404040;
  --dex-okd-button-outline-primary-disabled-border-color: var(--dex-okd-color-border-primary);
  --dex-okd-button-outline-primary-default-font-color: var(--dex-okd-color-content-primary);
  --dex-okd-button-outline-primary-hover-font-color: var(--dex-okd-color-content-primary);
  --dex-okd-button-outline-primary-active-font-color: var(--dex-okd-color-content-primary);
  --dex-okd-button-outline-primary-focus-font-color: #fff;
  --dex-okd-button-outline-primary-disabled-font-color: var(--dex-okd-color-content-disabled);
  --dex-okd-button-outline-primary-default-icon-color: var(--dex-okd-color-content-primary);
  --dex-okd-button-outline-primary-hover-icon-color: var(--dex-okd-color-content-primary);
  --dex-okd-button-outline-primary-active-icon-color: var(--dex-okd-color-content-primary);
  --dex-okd-button-outline-primary-focus-icon-color: #fff;
  --dex-okd-button-outline-primary-disabled-icon-color: var(--dex-okd-color-content-disabled);
  --dex-okd-button-outline-primary-default-shadow: var(--dex-okd-shadow-none);
  --dex-okd-button-outline-primary-hover-shadow: var(--dex-okd-shadow-none);
  --dex-okd-button-outline-primary-active-shadow: var(--dex-okd-shadow-none);
  --dex-okd-button-outline-primary-focus-shadow: 0px 0px 0px 3.5px #ffffff1a;
  --dex-okd-button-outline-primary-disabled-shadow: var(--dex-okd-shadow-none);
  --dex-okd-button-outline-primary-loader-track-color: hsla(0, 0%, 56%, .25);
  --dex-okd-button-outline-primary-loader-mark-color: #fff;
  --dex-okd-button-outline-primary-border-size: 1px;
  --dex-okd-button-outline-secondary-default-background: transparent;
  --dex-okd-button-outline-secondary-hover-background: #242424;
  --dex-okd-button-outline-secondary-active-background: #242424;
  --dex-okd-button-outline-secondary-focus-background: #242424;
  --dex-okd-button-outline-secondary-disabled-background: transparent;
  --dex-okd-button-outline-secondary-default-border-color: #404040;
  --dex-okd-button-outline-secondary-hover-border-color: #404040;
  --dex-okd-button-outline-secondary-active-border-color: #404040;
  --dex-okd-button-outline-secondary-focus-border-color: #404040;
  --dex-okd-button-outline-secondary-disabled-border-color: #2e2e2e;
  --dex-okd-button-outline-secondary-default-font-color: #fafafa;
  --dex-okd-button-outline-secondary-hover-font-color: #fafafa;
  --dex-okd-button-outline-secondary-active-font-color: #fafafa;
  --dex-okd-button-outline-secondary-focus-font-color: #fafafa;
  --dex-okd-button-outline-secondary-disabled-font-color: #6c6c6c;
  --dex-okd-button-outline-secondary-default-icon-color: #fafafa;
  --dex-okd-button-outline-secondary-hover-icon-color: #fafafa;
  --dex-okd-button-outline-secondary-active-icon-color: #fafafa;
  --dex-okd-button-outline-secondary-focus-icon-color: #fafafa;
  --dex-okd-button-outline-secondary-disabled-icon-color: #6c6c6c;
  --dex-okd-button-outline-secondary-default-shadow: var(--dex-okd-shadow-none);
  --dex-okd-button-outline-secondary-hover-shadow: var(--dex-okd-shadow-none);
  --dex-okd-button-outline-secondary-active-shadow: 0 0 0 0 transparent;
  --dex-okd-button-outline-secondary-focus-shadow: 0px 0px 0px 3.5px #ffffff1a;
  --dex-okd-button-outline-secondary-disabled-shadow: var(--dex-okd-shadow-none);
  --dex-okd-button-outline-secondary-loader-track-color: hsla(0, 0%, 100%, .25);
  --dex-okd-button-outline-secondary-loader-mark-color: #fff;
  --dex-okd-button-outline-secondary-border-size: 1px;
  --dex-okd-button-outline-tertiary-border-size: 1.5px;
  --dex-okd-button-outline-tertiary-default-shadow: 0px 0px 0px 0px transparent;
  --dex-okd-button-outline-tertiary-default-icon-color: var(--dex-okd-color-content-inverse);
  --dex-okd-button-outline-tertiary-default-font-color: var(--dex-okd-color-content-inverse);
  --dex-okd-button-outline-tertiary-default-border-color: var(--dex-okd-color-border-contrast);
  --dex-okd-button-outline-tertiary-default-background: transparent;
  --dex-okd-button-outline-tertiary-hover-icon-color: var(--dex-okd-color-content-primary);
  --dex-okd-button-outline-tertiary-hover-font-color: var(--dex-okd-color-content-primary);
  --dex-okd-button-outline-tertiary-hover-border-color: var(--dex-okd-color-container-primary);
  --dex-okd-button-outline-tertiary-hover-background: var(--dex-okd-color-container-primary);
  --dex-okd-button-outline-tertiary-hover-shadow: 0px 0px 0px 0px transparent;
  --dex-okd-button-outline-tertiary-focus-shadow: 0px 0px 0px 0px transparent;
  --dex-okd-button-outline-tertiary-focus-icon-color: #000;
  --dex-okd-button-outline-tertiary-focus-font-color: #000;
  --dex-okd-button-outline-tertiary-focus-border-color: #fff;
  --dex-okd-button-outline-tertiary-focus-background: #fff;
  --dex-okd-button-outline-tertiary-active-shadow: 0px 0px 0px 0px transparent;
  --dex-okd-button-outline-tertiary-active-icon-color: var(--dex-okd-color-content-primary);
  --dex-okd-button-outline-tertiary-active-font-color: var(--dex-okd-color-content-primary);
  --dex-okd-button-outline-tertiary-active-border-color: var(--dex-okd-color-container-primary);
  --dex-okd-button-outline-tertiary-active-background: var(--dex-okd-color-container-primary);
  --dex-okd-button-outline-tertiary-disabled-shadow: 0px 0px 0px 0px transparent;
  --dex-okd-button-outline-tertiary-disabled-icon-color: rgba(0, 0, 0, .36);
  --dex-okd-button-outline-tertiary-disabled-font-color: var(--dex-okd-color-content-inverse);
  --dex-okd-button-outline-tertiary-disabled-border-color: rgba(0, 0, 0, .12);
  --dex-okd-button-outline-tertiary-disabled-background: transparent;
  --dex-okd-button-outline-tertiary-loader-mark-color: var(--dex-okd-color-border-contrast);
  --dex-okd-button-outline-tertiary-loader-track-color: rgba(0, 0, 0, .3);
  --dex-okd-button-text-primary-default-background: var(--dex-okd-color-common-transparent);
  --dex-okd-button-text-primary-hover-background: #1d1d1d;
  --dex-okd-button-text-primary-active-background: #1d1d1d;
  --dex-okd-button-text-primary-focus-background: #051738;
  --dex-okd-button-text-primary-disabled-background: undefined;
  --dex-okd-button-text-primary-default-border-color: var(--dex-okd-color-common-transparent);
  --dex-okd-button-text-primary-hover-border-color: var(--dex-okd-color-common-transparent);
  --dex-okd-button-text-primary-active-border-color: var(--dex-okd-color-common-transparent);
  --dex-okd-button-text-primary-focus-border-color: transparent;
  --dex-okd-button-text-primary-disabled-border-color: var(--dex-okd-color-common-transparent);
  --dex-okd-button-text-primary-default-font-color: var(--dex-okd-color-content-primary);
  --dex-okd-button-text-primary-hover-font-color: var(--dex-okd-color-content-primary);
  --dex-okd-button-text-primary-active-font-color: var(--dex-okd-color-content-primary);
  --dex-okd-button-text-primary-focus-font-color: #4283ff;
  --dex-okd-button-text-primary-disabled-font-color: var(--dex-okd-color-content-disabled);
  --dex-okd-button-text-primary-default-icon-color: var(--dex-okd-color-content-primary);
  --dex-okd-button-text-primary-hover-icon-color: var(--dex-okd-color-content-primary);
  --dex-okd-button-text-primary-active-icon-color: var(--dex-okd-color-content-primary);
  --dex-okd-button-text-primary-focus-icon-color: #4283ff;
  --dex-okd-button-text-primary-disabled-icon-color: var(--dex-okd-color-content-disabled);
  --dex-okd-button-text-primary-default-shadow: none;
  --dex-okd-button-text-primary-hover-shadow: none;
  --dex-okd-button-text-primary-active-shadow: none;
  --dex-okd-button-text-primary-focus-shadow: none;
  --dex-okd-button-text-primary-disabled-shadow: none;
  --dex-okd-button-text-primary-border-size: 1px;
  --dex-okd-button-text-secondary-default-background: transparent;
  --dex-okd-button-text-secondary-hover-background: #051738;
  --dex-okd-button-text-secondary-active-background: #051738;
  --dex-okd-button-text-secondary-focus-background: #051738;
  --dex-okd-button-text-secondary-disabled-background: transparent;
  --dex-okd-button-text-secondary-default-border-color: transparent;
  --dex-okd-button-text-secondary-hover-border-color: transparent;
  --dex-okd-button-text-secondary-active-border-color: transparent;
  --dex-okd-button-text-secondary-focus-border-color: transparent;
  --dex-okd-button-text-secondary-disabled-border-color: transparent;
  --dex-okd-button-text-secondary-default-font-color: #4283ff;
  --dex-okd-button-text-secondary-hover-font-color: #4283ff;
  --dex-okd-button-text-secondary-active-font-color: #4283ff;
  --dex-okd-button-text-secondary-focus-font-color: #4283ff;
  --dex-okd-button-text-secondary-disabled-font-color: #6c6c6c;
  --dex-okd-button-text-secondary-default-icon-color: #4283ff;
  --dex-okd-button-text-secondary-hover-icon-color: #4283ff;
  --dex-okd-button-text-secondary-active-icon-color: #4283ff;
  --dex-okd-button-text-secondary-focus-icon-color: #4283ff;
  --dex-okd-button-text-secondary-disabled-icon-color: #6c6c6c;
  --dex-okd-button-text-secondary-default-shadow: none;
  --dex-okd-button-text-secondary-hover-shadow: none;
  --dex-okd-button-text-secondary-active-shadow: none;
  --dex-okd-button-text-secondary-focus-shadow: none;
  --dex-okd-button-text-secondary-disabled-shadow: none;
  --dex-okd-button-text-secondary-border-size: 1px;
  --dex-okd-button-text-red-default-background: var(--dex-okd-color-common-transparent);
  --dex-okd-button-text-red-hover-background: rgba(202, 63, 100, .05);
  --dex-okd-button-text-red-active-background: rgba(202, 63, 100, .05);
  --dex-okd-button-text-red-focus-background: #270b12;
  --dex-okd-button-text-red-disabled-background: hsla(0, 0%, 5%, 0);
  --dex-okd-button-text-red-default-border-color: transparent;
  --dex-okd-button-text-red-hover-border-color: var(--dex-okd-color-common-transparent);
  --dex-okd-button-text-red-active-border-color: var(--dex-okd-color-common-transparent);
  --dex-okd-button-text-red-focus-border-color: transparent;
  --dex-okd-button-text-red-disabled-border-color: var(--dex-okd-color-common-transparent);
  --dex-okd-button-text-red-default-font-color: #ca3f64;
  --dex-okd-button-text-red-hover-font-color: var(--dex-okd-color-semantic-negative);
  --dex-okd-button-text-red-active-font-color: var(--dex-okd-color-semantic-negative);
  --dex-okd-button-text-red-focus-font-color: #f9b6c7;
  --dex-okd-button-text-red-disabled-font-color: rgba(202, 63, 100, .45);
  --dex-okd-button-text-red-default-icon-color: #ca3f64;
  --dex-okd-button-text-red-hover-icon-color: rgba(202, 63, 100, .1);
  --dex-okd-button-text-red-active-icon-color: var(--dex-okd-color-semantic-negative);
  --dex-okd-button-text-red-focus-icon-color: #f9b6c7;
  --dex-okd-button-text-red-disabled-icon-color: rgba(202, 63, 100, .45);
  --dex-okd-button-text-red-default-shadow: none;
  --dex-okd-button-text-red-hover-shadow: none;
  --dex-okd-button-text-red-active-shadow: none;
  --dex-okd-button-text-red-focus-shadow: none;
  --dex-okd-button-text-red-disabled-shadow: none;
  --dex-okd-button-text-red-border-size: 1px;
  --dex-okd-button-text-green-default-background: var(--dex-okd-color-common-transparent);
  --dex-okd-button-text-green-hover-background: rgba(37, 167, 80, .05);
  --dex-okd-button-text-green-active-background: rgba(37, 167, 80, .05);
  --dex-okd-button-text-green-focus-background: #002b1f;
  --dex-okd-button-text-green-disabled-background: hsla(0, 0%, 5%, 0);
  --dex-okd-button-text-green-default-border-color: var(--dex-okd-color-common-transparent);
  --dex-okd-button-text-green-hover-border-color: var(--dex-okd-color-common-transparent);
  --dex-okd-button-text-green-active-border-color: var(--dex-okd-color-common-transparent);
  --dex-okd-button-text-green-focus-border-color: transparent;
  --dex-okd-button-text-green-disabled-border-color: var(--dex-okd-color-common-transparent);
  --dex-okd-button-text-green-default-font-color: var(--dex-okd-color-semantic-positive);
  --dex-okd-button-text-green-hover-font-color: var(--dex-okd-color-semantic-positive);
  --dex-okd-button-text-green-active-font-color: var(--dex-okd-color-semantic-positive);
  --dex-okd-button-text-green-focus-font-color: #a5efbe;
  --dex-okd-button-text-green-disabled-font-color: rgba(37, 167, 80, .45);
  --dex-okd-button-text-green-default-icon-color: var(--dex-okd-color-semantic-positive);
  --dex-okd-button-text-green-hover-icon-color: var(--dex-okd-color-semantic-positive);
  --dex-okd-button-text-green-active-icon-color: var(--dex-okd-color-semantic-positive);
  --dex-okd-button-text-green-focus-icon-color: #a5efbe;
  --dex-okd-button-text-green-disabled-icon-color: rgba(37, 167, 80, .45);
  --dex-okd-button-text-green-default-shadow: none;
  --dex-okd-button-text-green-hover-shadow: none;
  --dex-okd-button-text-green-active-shadow: none;
  --dex-okd-button-text-green-focus-shadow: none;
  --dex-okd-button-text-green-disabled-shadow: none;
  --dex-okd-button-text-green-border-size: 1px;
  --dex-okd-button-text-yellow-default-background: var(--dex-okd-color-common-transparent);
  --dex-okd-button-text-yellow-hover-background: rgba(255, 177, 23, .05);
  --dex-okd-button-text-yellow-active-background: rgba(255, 177, 23, .05);
  --dex-okd-button-text-yellow-focus-background: #2d2104;
  --dex-okd-button-text-yellow-disabled-background: hsla(0, 0%, 5%, 0);
  --dex-okd-button-text-yellow-default-border-color: var(--dex-okd-color-common-transparent);
  --dex-okd-button-text-yellow-hover-border-color: var(--dex-okd-color-common-transparent);
  --dex-okd-button-text-yellow-active-border-color: var(--dex-okd-color-common-transparent);
  --dex-okd-button-text-yellow-focus-border-color: transparent;
  --dex-okd-button-text-yellow-disabled-border-color: var(--dex-okd-color-common-transparent);
  --dex-okd-button-text-yellow-default-font-color: var(--dex-okd-color-semantic-notice);
  --dex-okd-button-text-yellow-hover-font-color: var(--dex-okd-color-semantic-notice);
  --dex-okd-button-text-yellow-active-font-color: var(--dex-okd-color-semantic-notice);
  --dex-okd-button-text-yellow-focus-font-color: #dea921;
  --dex-okd-button-text-yellow-disabled-font-color: rgba(255, 177, 23, .45);
  --dex-okd-button-text-yellow-default-icon-color: var(--dex-okd-color-semantic-notice);
  --dex-okd-button-text-yellow-hover-icon-color: var(--dex-okd-color-semantic-notice);
  --dex-okd-button-text-yellow-active-icon-color: var(--dex-okd-color-semantic-notice);
  --dex-okd-button-text-yellow-focus-icon-color: #dea921;
  --dex-okd-button-text-yellow-disabled-icon-color: rgba(255, 177, 23, .45);
  --dex-okd-button-text-yellow-default-shadow: none;
  --dex-okd-button-text-yellow-hover-shadow: none;
  --dex-okd-button-text-yellow-active-shadow: none;
  --dex-okd-button-text-yellow-focus-shadow: none;
  --dex-okd-button-text-yellow-disabled-shadow: none;
  --dex-okd-button-text-yellow-border-size: 1px
}

.theme-light .dex-message-var,
.theme-light.dex-message-var {
  --dex-okd-message-success-icon-color: var(--dex-okd-color-semantic-positive);
  --dex-okd-message-info-icon-color: var(--dex-okd-color-content-primary);
  --dex-okd-message-warn-icon-color: var(--dex-okd-color-semantic-notice);
  --dex-okd-message-error-icon-color: var(--dex-okd-color-semantic-negative);
  --dex-okd-message-title-color: var(--dex-okd-color-content-primary);
  --dex-okd-message-text-color: var(--dex-okd-color-content-secondary);
  --dex-okd-message-action-confirm-btn-color: var(--dex-okd-color-content-primary);
  --dex-okd-message-action-cancel-btn-color: var(--dex-okd-color-content-primary);
  --dex-okd-message-box-close-icon-color: var(--dex-okd-color-content-contrast);
  --dex-okd-message-box-shadow: var(--dex-okd-shadow-xl);
  --dex-okd-message-box-background: var(--dex-okd-color-modal-tertiary);
  --dex-okd-message-box-border-color: var(--dex-okd-color-border-primary);
  --dex-okd-message-box-border-radius: var(--dex-okd-border-radius-md);
  --dex-okd-message-box-padding: 16px;
  --dex-okd-message-box-each-margin: 14px;
  --dex-okd-message-box-max-width: 700px;
  --dex-okd-message-box-min-width: 451px;
  --dex-okd-message-box-auto-width-min-width: 100px;
  --dex-okd-message-box-icon-text-margin: 15px;
  --dex-okd-message-title-font-size: var(--dex-okd-font-size-md);
  --dex-okd-message-title-line-height: var(--dex-okd-line-height-md);
  --dex-okd-message-text-font-size: var(--dex-okd-font-size-md);
  --dex-okd-message-text-line-height: var(--dex-okd-line-height-md);
  --dex-okd-message-action-font-size: var(--dex-okd-font-size-md);
  --dex-okd-message-action-line-height: var(--dex-okd-line-height-md);
  --dex-okd-message-pending-icon-color: var(--dex-okd-color-content-primary)
}

.theme-dark .dex-button-var,
.theme-dark.dex-button-var {
  --dex-okd-button-text-orange-default-background: transparent;
  --dex-okd-button-text-orange-hover-background: #361604;
  --dex-okd-button-text-orange-active-background: #361604;
  --dex-okd-button-text-orange-focus-background: #361604;
  --dex-okd-button-text-orange-disabled-background: #000;
  --dex-okd-button-text-orange-default-border-color: transparent;
  --dex-okd-button-text-orange-hover-border-color: transparent;
  --dex-okd-button-text-orange-active-border-color: transparent;
  --dex-okd-button-text-orange-focus-border-color: transparent;
  --dex-okd-button-text-orange-disabled-border-color: transparent;
  --dex-okd-button-text-orange-default-font-color: #fa8c4d;
  --dex-okd-button-text-orange-hover-font-color: #f87428;
  --dex-okd-button-text-orange-active-font-color: #f87428;
  --dex-okd-button-text-orange-focus-font-color: #f87428;
  --dex-okd-button-text-orange-disabled-font-color: rgba(248, 116, 40, .45);
  --dex-okd-button-text-orange-default-icon-color: #f87428;
  --dex-okd-button-text-orange-hover-icon-color: #f87428;
  --dex-okd-button-text-orange-active-icon-color: #f87428;
  --dex-okd-button-text-orange-focus-icon-color: #f87428;
  --dex-okd-button-text-orange-disabled-icon-color: rgba(248, 116, 40, .45);
  --dex-okd-button-text-orange-default-shadow: none;
  --dex-okd-button-text-orange-hover-shadow: none;
  --dex-okd-button-text-orange-active-shadow: none;
  --dex-okd-button-text-orange-focus-shadow: none;
  --dex-okd-button-text-orange-disabled-shadow: none;
  --dex-okd-button-text-orange-border-size: 1px
}

.theme-dark .dex-message-var,
.theme-dark.dex-message-var {
  --dex-okd-message-success-icon-color: var(--dex-okd-color-semantic-positive);
  --dex-okd-message-info-icon-color: var(--dex-okd-color-content-primary);
  --dex-okd-message-warn-icon-color: var(--dex-okd-color-semantic-notice);
  --dex-okd-message-error-icon-color: var(--dex-okd-color-semantic-negative);
  --dex-okd-message-title-color: var(--dex-okd-color-content-primary);
  --dex-okd-message-text-color: var(--dex-okd-color-content-secondary);
  --dex-okd-message-action-confirm-btn-color: var(--dex-okd-color-content-primary);
  --dex-okd-message-action-cancel-btn-color: var(--dex-okd-color-content-primary);
  --dex-okd-message-box-close-icon-color: var(--dex-okd-color-content-contrast);
  --dex-okd-message-box-shadow: var(--dex-okd-shadow-xl);
  --dex-okd-message-box-background: var(--dex-okd-color-modal-tertiary);
  --dex-okd-message-box-border-color: var(--dex-okd-color-border-secondary);
  --dex-okd-message-box-border-radius: var(--dex-okd-border-radius-md);
  --dex-okd-message-box-padding: 16px;
  --dex-okd-message-box-each-margin: 14px;
  --dex-okd-message-box-max-width: 700px;
  --dex-okd-message-box-min-width: 451px;
  --dex-okd-message-box-auto-width-min-width: 100px;
  --dex-okd-message-box-icon-text-margin: 15px;
  --dex-okd-message-title-font-size: var(--dex-okd-font-size-md);
  --dex-okd-message-title-line-height: var(--dex-okd-line-height-md);
  --dex-okd-message-text-font-size: var(--dex-okd-font-size-md);
  --dex-okd-message-text-line-height: var(--dex-okd-line-height-md);
  --dex-okd-message-action-font-size: var(--dex-okd-font-size-md);
  --dex-okd-message-action-line-height: var(--dex-okd-line-height-md);
  --dex-okd-message-pending-icon-color: var(--dex-okd-color-content-primary)
}

.theme-light .dex-loader-var,
.theme-light.dex-loader-var {
  --dex-okd-loader-line-active-color: var(--dex-okd-color-border-selected);
  --dex-okd-loader-line-inactive-color: var(--dex-okd-color-border-primary);
  --dex-okd-loader-primary-active-color: #000;
  --dex-okd-loader-primary-inactive-color: #dbdbdb;
  --dex-okd-loader-neutral-active-color: #3d3d3d;
  --dex-okd-loader-neutral-inactive-color: #dbdbdb;
  --dex-okd-loader-mask-bg-color: hsla(0, 0%, 100%, .85);
  --dex-okd-loader-circle-xl-size: 38px;
  --dex-okd-loader-circle-lg-size: 30px;
  --dex-okd-loader-circle-md-size: 22px;
  --dex-okd-loader-circle-sm-size: 14px;
  --dex-okd-loader-circle-xl-track-width: 2px;
  --dex-okd-loader-circle-lg-track-width: 2px;
  --dex-okd-loader-circle-md-track-width: 1.82px;
  --dex-okd-loader-circle-sm-track-width: 1.5px;
  --dex-okd-loader-line-size: 4px;
  --dex-okd-loader-circle-cover-background: #fff;
  --dex-okd-loader-mask-text-font-size: 14px;
  --dex-okd-loader-mask-text-line-height: 16px;
  --dex-okd-loader-mask-text-font-weight: 400;
  --dex-okd-loader-mask-text-color: #000;
  --dex-okd-loader-mask-text-margin-top: 10px
}

.theme-light .dex-notification-var,
.theme-light.dex-notification-var {
  --dex-okd-notification-success-icon-color: var(--dex-okd-color-semantic-positive);
  --dex-okd-notification-info-icon-color: var(--dex-okd-color-content-primary);
  --dex-okd-notification-warn-icon-color: var(--dex-okd-color-semantic-notice);
  --dex-okd-notification-error-icon-color: var(--dex-okd-color-semantic-negative);
  --dex-okd-notification-title-color: var(--dex-okd-color-content-primary);
  --dex-okd-notification-text-color: var(--dex-okd-color-content-secondary);
  --dex-okd-notification-action-confirm-btn-color: var(--dex-okd-color-content-primary);
  --dex-okd-notification-action-cancel-btn-color: var(--dex-okd-color-content-primary);
  --dex-okd-notification-box-close-icon-color: var(--dex-okd-color-content-contrast);
  --dex-okd-notification-box-shadow: var(--dex-okd-shadow-xl);
  --dex-okd-notification-box-background: var(--dex-okd-color-modal-tertiary);
  --dex-okd-notification-box-border-color: var(--dex-okd-color-border-primary);
  --dex-okd-notification-box-border-radius: 4px;
  --dex-okd-notification-box-padding: 16px;
  --dex-okd-notification-box-each-margin: 14px;
  --dex-okd-notification-box-max-width: 700px;
  --dex-okd-notification-box-min-width: 451px;
  --dex-okd-notification-box-auto-width-min-width: 100px;
  --dex-okd-notification-box-icon-text-margin: 15px;
  --dex-okd-notification-title-font-size: var(--dex-okd-font-size-md);
  --dex-okd-notification-title-line-height: var(--dex-okd-line-height-md);
  --dex-okd-notification-text-font-size: var(--dex-okd-font-size-md);
  --dex-okd-notification-text-line-height: var(--dex-okd-line-height-md);
  --dex-okd-notification-action-font-size: var(--dex-okd-font-size-md);
  --dex-okd-notification-action-line-height: var(--dex-okd-line-height-md);
  --dex-okd-notification-pending-icon-color: var(--dex-okd-color-content-primary);
  --dex-okd-notification-box-horizontal-padding: 16px;
  --dex-okd-notification-box-vertical-padding: 12px
}

.theme-dark .dex-loader-var,
.theme-dark.dex-loader-var {
  --dex-okd-loader-line-active-color: var(--dex-okd-color-border-selected);
  --dex-okd-loader-line-inactive-color: var(--dex-okd-color-border-primary);
  --dex-okd-loader-primary-active-color: #fafafa;
  --dex-okd-loader-primary-inactive-color: #404040;
  --dex-okd-loader-neutral-active-color: #fff;
  --dex-okd-loader-neutral-inactive-color: #ffffff40;
  --dex-okd-loader-mask-bg-color: #00000040;
  --dex-okd-loader-circle-xl-size: 38px;
  --dex-okd-loader-circle-lg-size: 30px;
  --dex-okd-loader-circle-md-size: 22px;
  --dex-okd-loader-circle-sm-size: 14px;
  --dex-okd-loader-circle-xl-track-width: 2px;
  --dex-okd-loader-circle-lg-track-width: 2px;
  --dex-okd-loader-circle-md-track-width: 1.82px;
  --dex-okd-loader-circle-sm-track-width: 1.5px;
  --dex-okd-loader-line-size: 4px;
  --dex-okd-loader-circle-cover-background: #1a1a1a;
  --dex-okd-loader-mask-text-font-size: 14px;
  --dex-okd-loader-mask-text-line-height: 16px;
  --dex-okd-loader-mask-text-font-weight: 400;
  --dex-okd-loader-mask-text-color: #fafafa;
  --dex-okd-loader-mask-text-margin-top: 10px
}

.theme-dark .dex-notification-var,
.theme-dark.dex-notification-var {
  --dex-okd-notification-success-icon-color: var(--dex-okd-color-semantic-positive);
  --dex-okd-notification-info-icon-color: var(--dex-okd-color-content-primary);
  --dex-okd-notification-warn-icon-color: var(--dex-okd-color-semantic-notice);
  --dex-okd-notification-error-icon-color: var(--dex-okd-color-semantic-negative);
  --dex-okd-notification-title-color: var(--dex-okd-color-content-primary);
  --dex-okd-notification-text-color: var(--dex-okd-color-content-secondary);
  --dex-okd-notification-action-confirm-btn-color: var(--dex-okd-color-content-primary);
  --dex-okd-notification-action-cancel-btn-color: var(--dex-okd-color-content-primary);
  --dex-okd-notification-box-close-icon-color: var(--dex-okd-color-content-contrast);
  --dex-okd-notification-box-shadow: var(--dex-okd-shadow-xl);
  --dex-okd-notification-box-background: var(--dex-okd-color-modal-tertiary);
  --dex-okd-notification-box-border-color: var(--dex-okd-color-border-secondary);
  --dex-okd-notification-box-border-radius: 4px;
  --dex-okd-notification-box-padding: 16px;
  --dex-okd-notification-box-each-margin: 14px;
  --dex-okd-notification-box-max-width: 700px;
  --dex-okd-notification-box-min-width: 451px;
  --dex-okd-notification-box-auto-width-min-width: 100px;
  --dex-okd-notification-box-icon-text-margin: 15px;
  --dex-okd-notification-title-font-size: var(--dex-okd-font-size-md);
  --dex-okd-notification-title-line-height: var(--dex-okd-line-height-md);
  --dex-okd-notification-text-font-size: var(--dex-okd-font-size-md);
  --dex-okd-notification-text-line-height: var(--dex-okd-line-height-md);
  --dex-okd-notification-action-font-size: var(--dex-okd-font-size-md);
  --dex-okd-notification-action-line-height: var(--dex-okd-line-height-md);
  --dex-okd-notification-pending-icon-color: var(--dex-okd-color-content-primary);
  --dex-okd-notification-box-horizontal-padding: 16px;
  --dex-okd-notification-box-vertical-padding: 12px
}

.theme-light .dex-empty-var,
.theme-light.dex-empty-var {
  --dex-okd-empty-img-width: 100px;
  --dex-okd-empty-img-height: 100px;
  --dex-okd-empty-img-margin-bottom: 4px;
  --dex-okd-empty-title-font-size: 16px;
  --dex-okd-empty-title-light-height: 20px;
  --dex-okd-empty-title-margin-bottom: 4px;
  --dex-okd-empty-title-color: var(--dex-okd-color-content-primary);
  --dex-okd-empty-desc-font-size: 14px;
  --dex-okd-empty-desc-light-height: 158%;
  --dex-okd-empty-desc-margin-bottom: 16px;
  --dex-okd-empty-desc-color: var(--dex-okd-color-content-tertiary);
  --dex-okd-empty-title-line-height: 20px;
  --dex-okd-empty-desc-line-height: 20px;
  --dex-okd-empty-title-font-weight: 500;
  --dex-okd-empty-desc-font-weight: 400;
  --dex-okd-empty-sm-title-font-size: 14px;
  --dex-okd-empty-sm-title-line-height: 16px;
  --dex-okd-empty-sm-title-margin-bottom: 4px;
  --dex-okd-empty-sm-desc-font-size: 12px;
  --dex-okd-empty-sm-desc-line-height: 18px;
  --dex-okd-empty-sm-desc-margin-bottom: 16px
}

.theme-light .dex-popup-var,
.theme-light.dex-popup-var {
  --dex-okd-popup-white-board-background: var(--dex-okd-color-modal-primary);
  --dex-okd-popup-white-board-shadow: #0000000d 0px 4px 6px -2px, #0000001a 0px 10px 15px -3px
}

.theme-light .dex-input-var,
.theme-light.dex-input-var {
  --dex-okd-input-default-text-color: var(--dex-okd-color-content-primary);
  --dex-okd-input-default-placeholder-color: var(--dex-okd-color-content-disabled);
  --dex-okd-input-default-border-color: transparent;
  --dex-okd-input-default-caret-color: var(--dex-okd-color-content-primary);
  --dex-okd-input-default-shadow: 0px 0px 0px 0px transparent;
  --dex-okd-input-default-background: #f3f3f3;
  --dex-okd-input-hover-text-color: var(--dex-okd-color-content-primary);
  --dex-okd-input-hover-placeholder-color: var(--dex-okd-color-content-disabled);
  --dex-okd-input-hover-border-color: transparent;
  --dex-okd-input-hover-caret-color: var(--dex-okd-color-content-primary);
  --dex-okd-input-hover-shadow: 0 0 0 0 transparent;
  --dex-okd-input-hover-background: #f3f3f3;
  --dex-okd-input-focus-text-color: var(--dex-okd-color-content-primary);
  --dex-okd-input-focus-placeholder-color: var(--dex-okd-color-content-disabled);
  --dex-okd-input-focus-border-color: var(--dex-okd-color-border-selected);
  --dex-okd-input-focus-caret-color: var(--dex-okd-color-content-brand);
  --dex-okd-input-focus-shadow: 0px 0px 0px 0px #00000000;
  --dex-okd-input-focus-background: #f3f3f3;
  --dex-okd-input-disabled-text-color: var(--dex-okd-color-content-disabled);
  --dex-okd-input-disabled-placeholder-color: var(--dex-okd-color-content-disabled);
  --dex-okd-input-disabled-border-color: var(--dex-okd-color-border-primary);
  --dex-okd-input-disabled-caret-color: var(--dex-okd-color-content-disabled);
  --dex-okd-input-disabled-shadow: 0 0 0 0 transparent;
  --dex-okd-input-disabled-background: #f3f3f3;
  --dex-okd-input-error-text-color: var(--dex-okd-color-content-primary);
  --dex-okd-input-error-placeholder-color: var(--dex-okd-color-content-disabled);
  --dex-okd-input-error-border-color: var(--dex-okd-color-semantic-negative);
  --dex-okd-input-error-caret-color: var(--dex-okd-color-content-brand);
  --dex-okd-input-error-shadow: var(--dex-okd-shadow-sm);
  --dex-okd-input-error-background: #f3f3f3;
  --dex-okd-input-error-tips-color: var(--dex-okd-color-semantic-negative);
  --dex-okd-input-tips-text-color: var(--dex-okd-color-content-contrast);
  --dex-okd-input-icon-color: var(--dex-okd-color-content-contrast);
  --dex-okd-input-label-color: var(--dex-okd-color-content-primary);
  --dex-okd-input-action-color: var(--dex-okd-color-content-primary);
  --dex-okd-input-md-label-font-size: var(--dex-okd-font-size-md);
  --dex-okd-input-sm-label-font-size: var(--dex-okd-font-size-xs);
  --dex-okd-input-xs-label-font-size: var(--dex-okd-font-size-xs);
  --dex-okd-input-md-label-line-height: var(--dex-okd-line-height-md);
  --dex-okd-input-sm-label-line-height: var(--dex-okd-line-height-xs);
  --dex-okd-input-xs-label-line-height: var(--dex-okd-line-height-xs);
  --dex-okd-input-md-action-font-size: var(--dex-okd-font-size-md);
  --dex-okd-input-sm-action-font-size: var(--dex-okd-font-size-xs);
  --dex-okd-input-xs-action-font-size: var(--dex-okd-font-size-xs);
  --dex-okd-input-md-action-line-height: var(--dex-okd-line-height-md);
  --dex-okd-input-sm-action-line-height: var(--dex-okd-line-height-xs);
  --dex-okd-input-xs-action-line-height: var(--dex-okd-line-height-xs);
  --dex-okd-input-md-height: 40px;
  --dex-okd-input-md-text-font-size: var(--dex-okd-font-size-md);
  --dex-okd-input-md-border-radius: 8px;
  --dex-okd-input-md-error-font-size: 14px;
  --dex-okd-input-md-error-line-height: 16px;
  --dex-okd-input-md-tip-font-size: 14px;
  --dex-okd-input-md-tip-line-height: 16px;
  --dex-okd-input-md-icon-size: 20px;
  --dex-okd-input-md-icon-margin: 6px;
  --dex-okd-input-sm-height: 32px;
  --dex-okd-input-sm-text-font-size: 12px;
  --dex-okd-input-sm-border-radius: 8px;
  --dex-okd-input-sm-error-font-size: var(--dex-okd-font-size-xs);
  --dex-okd-input-sm-error-line-height: var(--dex-okd-line-height-xs);
  --dex-okd-input-sm-tip-font-size: var(--dex-okd-font-size-xs);
  --dex-okd-input-sm-tip-line-height: var(--dex-okd-line-height-xs);
  --dex-okd-input-sm-icon-size: 16px;
  --dex-okd-input-sm-icon-margin: 4px;
  --dex-okd-input-xs-height: 28px;
  --dex-okd-input-xs-text-font-size: var(--dex-okd-font-size-xs);
  --dex-okd-input-xs-border-radius: 8px;
  --dex-okd-input-xs-error-font-size: var(--dex-okd-font-size-xs);
  --dex-okd-input-xs-error-line-height: var(--dex-okd-line-height-xs);
  --dex-okd-input-xs-tip-font-size: var(--dex-okd-font-size-xs);
  --dex-okd-input-xs-tip-line-height: var(--dex-okd-line-height-xs);
  --dex-okd-input-xs-icon-size: 16px;
  --dex-okd-input-xs-icon-margin: 4px;
  --dex-okd-input-number-default-add-icon-color: var(--dex-okd-color-content-disabled);
  --dex-okd-input-number-default-add-icon-background: transparent;
  --dex-okd-input-number-hover-add-icon-color: var(--dex-okd-color-content-primary);
  --dex-okd-input-number-hover-add-icon-background: var(--dex-okd-color-background-surface-pressed);
  --dex-okd-input-number-active-add-icon-color: #bdbdbd;
  --dex-okd-input-number-active-add-icon-background: #ebebeb;
  --dex-okd-input-number-disabled-add-icon-color: var(--dex-okd-color-content-disabled);
  --dex-okd-input-number-disabled-add-icon-background: var(--dex-okd-color-content-disabled);
  --dex-okd-input-code-common-btn-color: #0569ff;
  --dex-okd-input-code-common-btn-disabled-color: #bdbdbd;
  --dex-okd-input-code-common-count-color: var(--dex-okd-color-content-disabled);
  --dex-okd-input-code-md-btn-font-size: var(--dex-okd-font-size-md);
  --dex-okd-input-code-md-btn-line-height: var(--dex-okd-line-height-md);
  --dex-okd-input-code-md-count-font-size: var(--dex-okd-font-size-md);
  --dex-okd-input-code-md-count-line-height: var(--dex-okd-line-height-md);
  --dex-okd-input-code-sm-btn-font-size: var(--dex-okd-font-size-xs);
  --dex-okd-input-code-sm-btn-line-height: var(--dex-okd-line-height-xs);
  --dex-okd-input-code-sm-count-font-size: var(--dex-okd-font-size-xs);
  --dex-okd-input-code-sm-count-line-height: var(--dex-okd-line-height-xs);
  --dex-okd-input-code-xs-btn-font-size: var(--dex-okd-font-size-xs);
  --dex-okd-input-code-xs-btn-line-height: var(--dex-okd-line-height-xs);
  --dex-okd-input-code-xs-count-font-size: var(--dex-okd-font-size-xs);
  --dex-okd-input-code-xs-count-line-height: var(--dex-okd-line-height-xs);
  --dex-okd-input-search-default-text-color: var(--dex-okd-color-content-primary);
  --dex-okd-input-search-default-placeholder-color: var(--dex-okd-color-content-disabled);
  --dex-okd-input-search-default-border-color: transparent;
  --dex-okd-input-search-default-caret-color: var(--dex-okd-color-content-primary);
  --dex-okd-input-search-default-shadow: 0px 0px 0px 0px transparent;
  --dex-okd-input-search-default-background: #f3f3f3;
  --dex-okd-input-search-hover-text-color: var(--dex-okd-color-content-primary);
  --dex-okd-input-search-hover-placeholder-color: var(--dex-okd-color-content-disabled);
  --dex-okd-input-search-hover-border-color: transparent;
  --dex-okd-input-search-hover-caret-color: var(--dex-okd-color-content-primary);
  --dex-okd-input-search-hover-shadow: 0px 0px 0px 0px #0000001a;
  --dex-okd-input-search-hover-background: #f3f3f3;
  --dex-okd-input-search-focus-text-color: var(--dex-okd-color-content-primary);
  --dex-okd-input-search-focus-placeholder-color: var(--dex-okd-color-content-disabled);
  --dex-okd-input-search-focus-border-color: var(--dex-okd-color-border-selected);
  --dex-okd-input-search-focus-caret-color: var(--dex-okd-color-content-brand);
  --dex-okd-input-search-focus-shadow: 0px 0px 0px 0px #00000000;
  --dex-okd-input-search-focus-background: #f3f3f3;
  --dex-okd-input-search-error-text-color: var(--dex-okd-color-content-primary);
  --dex-okd-input-search-error-placeholder-color: var(--dex-okd-color-content-disabled);
  --dex-okd-input-search-error-border-color: var(--dex-okd-color-semantic-negative);
  --dex-okd-input-search-error-caret-color: var(--dex-okd-color-content-primary);
  --dex-okd-input-search-error-shadow: 0 1px 2px 0 #0000000d;
  --dex-okd-input-search-error-background: #f3f3f3;
  --dex-okd-input-search-disabled-text-color: var(--dex-okd-color-content-disabled);
  --dex-okd-input-search-disabled-placeholder-color: var(--dex-okd-color-content-disabled);
  --dex-okd-input-search-disabled-border-color: transparent;
  --dex-okd-input-search-disabled-caret-color: var(--dex-okd-color-content-disabled);
  --dex-okd-input-search-disabled-shadow: 0px 0px 0px 0px transparent;
  --dex-okd-input-search-disabled-background: #f3f3f3;
  --dex-okd-input-search-prefix-icon-color: var(--dex-okd-color-content-contrast);
  --dex-okd-input-search-prefix-icon-size: 16px;
  --dex-okd-input-search-suffix-icon-color: var(--dex-okd-color-content-contrast);
  --dex-okd-input-search-suffix-icon-size: 13px;
  --dex-okd-input-search-error-tips-color: var(--dex-okd-color-semantic-negative);
  --dex-okd-input-verify-md-width: 40px;
  --dex-okd-input-verify-md-height: 44px;
  --dex-okd-input-lg-height: 44px;
  --dex-okd-input-lg-border-radius: 8px;
  --dex-okd-input-lg-label-font-size: 14px;
  --dex-okd-input-lg-label-line-height: 20px;
  --dex-okd-input-lg-label-margin: 8px;
  --dex-okd-input-lg-action-font-size: 14px;
  --dex-okd-input-lg-action-line-height: 20px;
  --dex-okd-input-lg-text-font-size: 14px;
  --dex-okd-input-lg-error-font-size: 14px;
  --dex-okd-input-lg-error-line-height: 16px;
  --dex-okd-input-lg-tip-margin: 4px;
  --dex-okd-input-lg-tip-font-size: 14px;
  --dex-okd-input-lg-tip-line-height: 16px;
  --dex-okd-input-md-label-margin: 8px;
  --dex-okd-input-md-tip-margin: 4px;
  --dex-okd-input-sm-label-margin: 8px;
  --dex-okd-input-sm-tip-margin: 4px;
  --dex-okd-input-xs-label-margin: 8px;
  --dex-okd-input-xs-tip-margin: 4px;
  --dex-okd-input-xl-height: 48px;
  --dex-okd-input-xl-text-font-size: 14px;
  --dex-okd-input-xl-border-radius: 8px;
  --dex-okd-input-lg-icon-size: 20px;
  --dex-okd-input-lg-icon-margin: 8px;
  --dex-okd-input-xl-label-line-height: 20px;
  --dex-okd-input-xl-icon-size: 20px;
  --dex-okd-input-xl-icon-margin: 12px;
  --dex-okd-input-xl-error-font-size: 14px;
  --dex-okd-input-xl-error-line-height: 16px;
  --dex-okd-input-xl-action-font-size: 14px;
  --dex-okd-input-xl-action-line-height: 20px;
  --dex-okd-input-xl-label-margin: 8px;
  --dex-okd-input-xl-label-font-size: 14px;
  --dex-okd-input-xl-tip-font-size: 14px;
  --dex-okd-input-xl-tip-margin: 6px;
  --dex-okd-input-xl-tip-line-height: 16px;
  --dex-okd-input-verify-xl-height: px;
  --dex-okd-input-verify-xl-width: px;
  --dex-okd-input-xs-padding-horizontal: 8px;
  --dex-okd-input-sm-padding-horizontal: 8px;
  --dex-okd-input-md-padding-horizontal: 8px;
  --dex-okd-input-lg-padding-horizontal: 12px;
  --dex-okd-input-xl-padding-horizontal: 12px;
  --dex-okd-input-reversed-default-text-color: var(--dex-okd-color-content-inverse);
  --dex-okd-input-reversed-default-placeholder-color: hsla(0, 0%, 100%, .36);
  --dex-okd-input-reversed-default-border-color: transparent;
  --dex-okd-input-reversed-default-caret-color: var(--dex-okd-color-content-inverse);
  --dex-okd-input-reversed-default-shadow: 0 0 0 0 transparent;
  --dex-okd-input-reversed-default-background: #1d1d1d;
  --dex-okd-input-reversed-hover-text-color: var(--dex-okd-color-content-inverse);
  --dex-okd-input-reversed-hover-placeholder-color: hsla(0, 0%, 100%, .36);
  --dex-okd-input-reversed-hover-border-color: var(--dex-okd-color-transparent-black);
  --dex-okd-input-reversed-hover-caret-color: var(--dex-okd-color-content-contrast);
  --dex-okd-input-reversed-hover-shadow: 0px 0px 0px 0px transparent;
  --dex-okd-input-reversed-hover-background: #1d1d1d;
  --dex-okd-input-reversed-focus-text-color: var(--dex-okd-color-content-inverse);
  --dex-okd-input-reversed-focus-placeholder-color: hsla(0, 0%, 100%, .36);
  --dex-okd-input-reversed-focus-border-color: #fff;
  --dex-okd-input-reversed-focus-caret-color: var(--dex-okd-color-semantic-highlight);
  --dex-okd-input-reversed-focus-shadow: 0px 0px 0px 0px #ffffff00;
  --dex-okd-input-reversed-focus-background: #1d1d1d;
  --dex-okd-input-reversed-disabled-text-color: #545454;
  --dex-okd-input-reversed-disabled-placeholder-color: #545454;
  --dex-okd-input-reversed-disabled-border-color: #383838;
  --dex-okd-input-reversed-disabled-caret-color: #0569ff;
  --dex-okd-input-reversed-disabled-shadow: 0 0 0 0 transparent;
  --dex-okd-input-reversed-disabled-background: #1d1d1d;
  --dex-okd-input-reversed-error-text-color: var(--dex-okd-color-content-inverse);
  --dex-okd-input-reversed-error-placeholder-color: hsla(0, 0%, 100%, .36);
  --dex-okd-input-reversed-error-border-color: var(--dex-okd-color-semantic-negative);
  --dex-okd-input-reversed-error-caret-color: var(--dex-okd-color-content-contrast);
  --dex-okd-input-reversed-error-shadow: 0 0 0 0 transparent;
  --dex-okd-input-reversed-error-background: #1d1d1d;
  --dex-okd-input-reversed-error-tips-color: var(--dex-okd-color-semantic-negative);
  --dex-okd-input-reversed-tips-text-color: var(--dex-okd-color-content-contrast);
  --dex-okd-input-reversed-icon-color: #929292;
  --dex-okd-input-reversed-label-color: #dbdbdb;
  --dex-okd-input-reversed-action-color: var(--dex-okd-color-content-inverse);
  --dex-okd-input-number-reversed-default-add-icon-color: #6e6e6e;
  --dex-okd-input-number-reversed-default-add-icon-background: transparent;
  --dex-okd-input-number-reversed-hover-add-icon-color: #fff;
  --dex-okd-input-number-reversed-hover-add-icon-background: #272727;
  --dex-okd-input-number-reversed-active-add-icon-color: #6e6e6e;
  --dex-okd-input-number-reversed-active-add-icon-background: transparent;
  --dex-okd-input-number-reversed-disabled-add-icon-color: #6e6e6e;
  --dex-okd-input-number-reversed-disabled-add-icon-background: transparent;
  --dex-okd-input-code-reversed-common-btn-color: var(--dex-okd-color-content-inverse);
  --dex-okd-input-code-reversed-common-btn-disabled-color: #545454;
  --dex-okd-input-code-reversed-common-count-color: #545454;
  --dex-okd-input-search-reversed-default-text-color: #fff;
  --dex-okd-input-search-reversed-default-placeholder-color: #666;
  --dex-okd-input-search-reversed-default-border-color: transparent;
  --dex-okd-input-search-reversed-default-caret-color: #fff;
  --dex-okd-input-search-reversed-default-shadow: 0px 0px 0px 0px #f9f9f91a;
  --dex-okd-input-search-reversed-default-background: #1d1d1d;
  --dex-okd-input-search-reversed-hover-text-color: #fff;
  --dex-okd-input-search-reversed-hover-placeholder-color: #3d3d3d;
  --dex-okd-input-search-reversed-hover-border-color: transparent;
  --dex-okd-input-search-reversed-hover-caret-color: #fff;
  --dex-okd-input-search-reversed-hover-shadow: 0px 0px 0px 2px #f9f9f91a;
  --dex-okd-input-search-reversed-hover-background: #1d1d1d;
  --dex-okd-input-search-reversed-focus-text-color: #fff;
  --dex-okd-input-search-reversed-focus-placeholder-color: #3d3d3d;
  --dex-okd-input-search-reversed-focus-border-color: #fff;
  --dex-okd-input-search-reversed-focus-caret-color: var(--dex-okd-color-semantic-highlight);
  --dex-okd-input-search-reversed-focus-shadow: 0 0 0 0 transparent;
  --dex-okd-input-search-reversed-focus-background: #1d1d1d;
  --dex-okd-input-search-reversed-error-text-color: #fff;
  --dex-okd-input-search-reversed-error-placeholder-color: #3d3d3d;
  --dex-okd-input-search-reversed-error-border-color: #eb4b6d;
  --dex-okd-input-search-reversed-error-caret-color: var(--dex-okd-color-semantic-highlight);
  --dex-okd-input-search-reversed-error-shadow: 0 0 0 0 transparent;
  --dex-okd-input-search-reversed-error-background: #000;
  --dex-okd-input-search-reversed-disabled-text-color: #6e6e6e;
  --dex-okd-input-search-reversed-disabled-placeholder-color: #3d3d3d;
  --dex-okd-input-search-reversed-disabled-border-color: transparent;
  --dex-okd-input-search-reversed-disabled-caret-color: transparent;
  --dex-okd-input-search-reversed-disabled-shadow: 0 0 0 0 transparent;
  --dex-okd-input-search-reversed-disabled-background: #1a1a1a;
  --dex-okd-input-search-reversed-prefix-icon-color: #bdbdbd;
  --dex-okd-input-search-reversed-error-tips-color: #eb4b6d;
  --dex-okd-input-search-suffix-icon-hover-color: #000;
  --dex-okd-input-verify-xl-border-radius: 8pxpx;
  --dex-okd-input-code-xl-btn-font-size: 12px;
  --dex-okd-input-number-suffix-border-color: var(--dex-okd-color-border-primary);
  --dex-okd-input-verify-md-border-radius: 6px;
  --dex-okd-input-verify-md-text-font-size: 26px;
  --dex-okd-input-verify-md-margin: 8px;
  --dex-okd-input-readonly-text-color: var(--dex-okd-color-content-primary);
  --dex-okd-input-readonly-placeholder-color: var(--dex-okd-input-default-placeholder-color);
  --dex-okd-input-readonly-border-color: var(--dex-okd-color-border-primary);
  --dex-okd-input-readonly-caret-color: var(--dex-okd-input-default-caret-color);
  --dex-okd-input-readonly-shadow: var(--dex-okd-input-default-shadow);
  --dex-okd-input-readonly-background: var(--dex-okd-color-transparent-white)
}

.theme-dark .dex-empty-var,
.theme-dark.dex-empty-var {
  --dex-okd-empty-img-width: 100px;
  --dex-okd-empty-img-height: 100px;
  --dex-okd-empty-img-margin-bottom: 4px;
  --dex-okd-empty-title-font-size: 16px;
  --dex-okd-empty-title-light-height: 20px;
  --dex-okd-empty-title-margin-bottom: 4px;
  --dex-okd-empty-title-color: var(--dex-okd-color-content-primary);
  --dex-okd-empty-desc-font-size: 14px;
  --dex-okd-empty-desc-light-height: 158%;
  --dex-okd-empty-desc-margin-bottom: 16px;
  --dex-okd-empty-desc-color: var(--dex-okd-color-content-tertiary);
  --dex-okd-empty-title-line-height: 20px;
  --dex-okd-empty-desc-line-height: 20px;
  --dex-okd-empty-title-font-weight: 500;
  --dex-okd-empty-desc-font-weight: 400;
  --dex-okd-empty-sm-title-font-size: 14px;
  --dex-okd-empty-sm-title-line-height: 16px;
  --dex-okd-empty-sm-title-margin-bottom: 4px;
  --dex-okd-empty-sm-desc-font-size: 12px;
  --dex-okd-empty-sm-desc-line-height: 18px;
  --dex-okd-empty-sm-desc-margin-bottom: 16px
}

.theme-dark .dex-popup-var,
.theme-dark.dex-popup-var {
  --dex-okd-popup-white-board-background: var(--dex-okd-color-modal-primary);
  --dex-okd-popup-white-board-shadow: #0000000d 0px 4px 6px -2px, #0000001a 0px 10px 15px -3px
}

.theme-dark .dex-input-var,
.theme-dark.dex-input-var {
  --dex-okd-input-default-text-color: var(--dex-okd-color-content-primary);
  --dex-okd-input-default-placeholder-color: var(--dex-okd-color-content-disabled);
  --dex-okd-input-default-border-color: transparent;
  --dex-okd-input-default-caret-color: var(--dex-okd-color-content-primary);
  --dex-okd-input-default-shadow: 0px 0px 0px 0px transparent;
  --dex-okd-input-default-background: #1d1d1d;
  --dex-okd-input-hover-text-color: var(--dex-okd-color-content-primary);
  --dex-okd-input-hover-placeholder-color: var(--dex-okd-color-content-disabled);
  --dex-okd-input-hover-border-color: transparent;
  --dex-okd-input-hover-caret-color: var(--dex-okd-color-content-primary);
  --dex-okd-input-hover-shadow: 0px 0px 0px 0px #fafafa33;
  --dex-okd-input-hover-background: #1d1d1d;
  --dex-okd-input-focus-text-color: var(--dex-okd-color-content-primary);
  --dex-okd-input-focus-placeholder-color: var(--dex-okd-color-content-disabled);
  --dex-okd-input-focus-border-color: var(--dex-okd-color-border-selected);
  --dex-okd-input-focus-caret-color: var(--dex-okd-color-content-brand);
  --dex-okd-input-focus-shadow: 0px 0px 0px 0px #00000000;
  --dex-okd-input-focus-background: #1d1d1d;
  --dex-okd-input-disabled-text-color: var(--dex-okd-color-content-disabled);
  --dex-okd-input-disabled-placeholder-color: var(--dex-okd-color-content-disabled);
  --dex-okd-input-disabled-border-color: var(--dex-okd-color-border-primary);
  --dex-okd-input-disabled-caret-color: var(--dex-okd-color-content-disabled);
  --dex-okd-input-disabled-shadow: var(--dex-okd-shadow-sm);
  --dex-okd-input-disabled-background: #1d1d1d;
  --dex-okd-input-error-text-color: var(--dex-okd-color-content-primary);
  --dex-okd-input-error-placeholder-color: var(--dex-okd-color-content-disabled);
  --dex-okd-input-error-border-color: var(--dex-okd-color-semantic-negative);
  --dex-okd-input-error-caret-color: var(--dex-okd-color-content-brand);
  --dex-okd-input-error-shadow: var(--dex-okd-shadow-sm);
  --dex-okd-input-error-background: #1d1d1d;
  --dex-okd-input-error-tips-color: var(--dex-okd-color-semantic-negative);
  --dex-okd-input-tips-text-color: var(--dex-okd-color-content-contrast);
  --dex-okd-input-icon-color: var(--dex-okd-color-content-contrast);
  --dex-okd-input-label-color: var(--dex-okd-color-content-primary);
  --dex-okd-input-action-color: var(--dex-okd-color-content-primary);
  --dex-okd-input-md-label-font-size: var(--dex-okd-font-size-md);
  --dex-okd-input-sm-label-font-size: var(--dex-okd-font-size-xs);
  --dex-okd-input-xs-label-font-size: var(--dex-okd-font-size-xs);
  --dex-okd-input-md-label-line-height: 20px;
  --dex-okd-input-sm-label-line-height: var(--dex-okd-line-height-xs);
  --dex-okd-input-xs-label-line-height: var(--dex-okd-line-height-xs);
  --dex-okd-input-md-action-font-size: var(--dex-okd-font-size-md);
  --dex-okd-input-sm-action-font-size: var(--dex-okd-font-size-xs);
  --dex-okd-input-xs-action-font-size: var(--dex-okd-font-size-xs);
  --dex-okd-input-md-action-line-height: 20px;
  --dex-okd-input-sm-action-line-height: var(--dex-okd-line-height-xs);
  --dex-okd-input-xs-action-line-height: var(--dex-okd-line-height-xs);
  --dex-okd-input-md-height: 40px;
  --dex-okd-input-md-text-font-size: var(--dex-okd-font-size-md);
  --dex-okd-input-md-border-radius: 8px;
  --dex-okd-input-md-error-font-size: 14px;
  --dex-okd-input-md-error-line-height: 16px;
  --dex-okd-input-md-tip-font-size: 14px;
  --dex-okd-input-md-tip-line-height: 16px;
  --dex-okd-input-md-icon-size: 20px;
  --dex-okd-input-md-icon-margin: 6px;
  --dex-okd-input-sm-height: 32px;
  --dex-okd-input-sm-text-font-size: var(--dex-okd-font-size-xs);
  --dex-okd-input-sm-border-radius: 8px;
  --dex-okd-input-sm-error-font-size: var(--dex-okd-font-size-xs);
  --dex-okd-input-sm-error-line-height: var(--dex-okd-line-height-xs);
  --dex-okd-input-sm-tip-font-size: var(--dex-okd-font-size-xs);
  --dex-okd-input-sm-tip-line-height: var(--dex-okd-line-height-xs);
  --dex-okd-input-sm-icon-size: 16px;
  --dex-okd-input-sm-icon-margin: 4px;
  --dex-okd-input-xs-height: 28px;
  --dex-okd-input-xs-text-font-size: var(--dex-okd-font-size-xs);
  --dex-okd-input-xs-border-radius: 8px;
  --dex-okd-input-xs-error-font-size: var(--dex-okd-font-size-xs);
  --dex-okd-input-xs-error-line-height: var(--dex-okd-line-height-xs);
  --dex-okd-input-xs-tip-font-size: var(--dex-okd-font-size-xs);
  --dex-okd-input-xs-tip-line-height: var(--dex-okd-line-height-xs);
  --dex-okd-input-xs-icon-size: 16px;
  --dex-okd-input-xs-icon-margin: 4px;
  --dex-okd-input-number-default-add-icon-color: var(--dex-okd-color-content-disabled);
  --dex-okd-input-number-default-add-icon-background: transparent;
  --dex-okd-input-number-hover-add-icon-color: var(--dex-okd-color-content-primary);
  --dex-okd-input-number-hover-add-icon-background: var(--dex-okd-color-background-surface-pressed);
  --dex-okd-input-number-active-add-icon-color: #e3e3e3;
  --dex-okd-input-number-active-add-icon-background: #404040;
  --dex-okd-input-number-disabled-add-icon-color: var(--dex-okd-color-content-disabled);
  --dex-okd-input-number-disabled-add-icon-background: var(--dex-okd-color-content-disabled);
  --dex-okd-input-code-common-btn-color: #4283ff;
  --dex-okd-input-code-common-btn-disabled-color: #6c6c6c;
  --dex-okd-input-code-common-count-color: var(--dex-okd-color-content-disabled);
  --dex-okd-input-code-md-btn-font-size: var(--dex-okd-font-size-md);
  --dex-okd-input-code-md-btn-line-height: var(--dex-okd-line-height-md);
  --dex-okd-input-code-md-count-font-size: var(--dex-okd-font-size-md);
  --dex-okd-input-code-md-count-line-height: var(--dex-okd-line-height-md);
  --dex-okd-input-code-sm-btn-font-size: var(--dex-okd-font-size-xs);
  --dex-okd-input-code-sm-btn-line-height: var(--dex-okd-line-height-xs);
  --dex-okd-input-code-sm-count-font-size: var(--dex-okd-font-size-xs);
  --dex-okd-input-code-sm-count-line-height: var(--dex-okd-line-height-xs);
  --dex-okd-input-code-xs-btn-font-size: var(--dex-okd-font-size-xs);
  --dex-okd-input-code-xs-btn-line-height: var(--dex-okd-line-height-xs);
  --dex-okd-input-code-xs-count-font-size: var(--dex-okd-font-size-xs);
  --dex-okd-input-code-xs-count-line-height: var(--dex-okd-line-height-xs);
  --dex-okd-input-search-default-text-color: var(--dex-okd-color-content-primary);
  --dex-okd-input-search-default-placeholder-color: var(--dex-okd-color-content-disabled);
  --dex-okd-input-search-default-border-color: transparent;
  --dex-okd-input-search-default-caret-color: var(--dex-okd-color-content-primary);
  --dex-okd-input-search-default-shadow: 0px 0px 0px 0px transparent;
  --dex-okd-input-search-default-background: #1d1d1d;
  --dex-okd-input-search-hover-text-color: var(--dex-okd-color-content-primary);
  --dex-okd-input-search-hover-placeholder-color: var(--dex-okd-color-content-disabled);
  --dex-okd-input-search-hover-border-color: transparent;
  --dex-okd-input-search-hover-caret-color: var(--dex-okd-color-content-primary);
  --dex-okd-input-search-hover-shadow: 0px 0px 0px 0px #0000001a;
  --dex-okd-input-search-hover-background: #1d1d1d;
  --dex-okd-input-search-focus-text-color: var(--dex-okd-color-content-primary);
  --dex-okd-input-search-focus-placeholder-color: var(--dex-okd-color-content-disabled);
  --dex-okd-input-search-focus-border-color: var(--dex-okd-color-border-selected);
  --dex-okd-input-search-focus-caret-color: var(--dex-okd-color-content-brand);
  --dex-okd-input-search-focus-shadow: 0px 0px 0px 0px #00000000;
  --dex-okd-input-search-focus-background: #1d1d1d;
  --dex-okd-input-search-error-text-color: var(--dex-okd-color-content-primary);
  --dex-okd-input-search-error-placeholder-color: var(--dex-okd-color-content-disabled);
  --dex-okd-input-search-error-border-color: var(--dex-okd-color-semantic-negative);
  --dex-okd-input-search-error-caret-color: var(--dex-okd-color-semantic-highlight);
  --dex-okd-input-search-error-shadow: 0 1px 2px 0 #0000000d;
  --dex-okd-input-search-error-background: #1d1d1d;
  --dex-okd-input-search-disabled-text-color: var(--dex-okd-color-content-disabled);
  --dex-okd-input-search-disabled-placeholder-color: var(--dex-okd-color-content-disabled);
  --dex-okd-input-search-disabled-border-color: transparent;
  --dex-okd-input-search-disabled-caret-color: var(--dex-okd-color-content-disabled);
  --dex-okd-input-search-disabled-shadow: 0px 0px 0px 0px #0000000d;
  --dex-okd-input-search-disabled-background: #1d1d1d;
  --dex-okd-input-search-error-tips-color: var(--dex-okd-color-semantic-negative);
  --dex-okd-input-search-suffix-icon-size: 13px;
  --dex-okd-input-search-suffix-icon-color: var(--dex-okd-color-content-contrast);
  --dex-okd-input-search-prefix-icon-color: var(--dex-okd-color-content-contrast);
  --dex-okd-input-search-prefix-icon-size: 20px;
  --dex-okd-input-verify-md-width: 40px;
  --dex-okd-input-verify-md-height: 44px;
  --dex-okd-input-lg-label-font-size: 14px;
  --dex-okd-input-lg-label-line-height: 20px;
  --dex-okd-input-lg-label-margin: 8px;
  --dex-okd-input-lg-action-font-size: 14px;
  --dex-okd-input-lg-action-line-height: 20px;
  --dex-okd-input-lg-tip-font-size: 14px;
  --dex-okd-input-lg-tip-line-height: 16px;
  --dex-okd-input-lg-tip-margin: 6px;
  --dex-okd-input-lg-error-font-size: 14px;
  --dex-okd-input-lg-error-line-height: 16px;
  --dex-okd-input-lg-height: 44px;
  --dex-okd-input-lg-text-font-size: 14px;
  --dex-okd-input-lg-border-radius: 8px;
  --dex-okd-input-md-label-margin: 8px;
  --dex-okd-input-md-tip-margin: 4px;
  --dex-okd-input-sm-label-margin: 8px;
  --dex-okd-input-sm-tip-margin: 4px;
  --dex-okd-input-xs-label-margin: 8px;
  --dex-okd-input-xs-tip-margin: 4px;
  --dex-okd-input-lg-icon-size: 20px;
  --dex-okd-input-lg-icon-margin: 8px;
  --dex-okd-input-xl-label-line-height: 20px;
  --dex-okd-input-xl-label-font-size: 14px;
  --dex-okd-input-xl-label-margin: 8px;
  --dex-okd-input-xl-action-line-height: 20px;
  --dex-okd-input-xl-action-font-size: 14px;
  --dex-okd-input-xl-tip-font-size: 14px;
  --dex-okd-input-xl-tip-line-height: 16px;
  --dex-okd-input-xl-tip-margin: 6px;
  --dex-okd-input-xl-error-font-size: 14px;
  --dex-okd-input-xl-error-line-height: 16px;
  --dex-okd-input-xl-icon-size: 20px;
  --dex-okd-input-xl-icon-margin: 8px;
  --dex-okd-input-xl-height: 48px;
  --dex-okd-input-xl-text-font-size: 14px;
  --dex-okd-input-xl-border-radius: 8px;
  --dex-okd-input-verify-xl-height: px;
  --dex-okd-input-verify-xl-width: px;
  --dex-okd-input-xs-padding-horizontal: 8px;
  --dex-okd-input-sm-padding-horizontal: 8px;
  --dex-okd-input-md-padding-horizontal: 8px;
  --dex-okd-input-lg-padding-horizontal: 12px;
  --dex-okd-input-xl-padding-horizontal: 12px;
  --dex-okd-input-reversed-default-text-color: var(--dex-okd-color-content-inverse);
  --dex-okd-input-reversed-default-placeholder-color: rgba(0, 0, 0, .36);
  --dex-okd-input-reversed-default-border-color: transparent;
  --dex-okd-input-reversed-default-caret-color: var(--dex-okd-color-content-inverse);
  --dex-okd-input-reversed-default-shadow: 0 0 0 0 transparent;
  --dex-okd-input-reversed-default-background: #f3f3f3;
  --dex-okd-input-reversed-hover-text-color: var(--dex-okd-color-content-inverse);
  --dex-okd-input-reversed-hover-placeholder-color: rgba(0, 0, 0, .36);
  --dex-okd-input-reversed-hover-border-color: var(--dex-okd-color-transparent-black);
  --dex-okd-input-reversed-hover-caret-color: var(--dex-okd-color-content-contrast);
  --dex-okd-input-reversed-hover-shadow: 0 0 0 0 transparent;
  --dex-okd-input-reversed-hover-background: #f3f3f3;
  --dex-okd-input-reversed-focus-text-color: var(--dex-okd-color-content-inverse);
  --dex-okd-input-reversed-focus-placeholder-color: rgba(0, 0, 0, .36);
  --dex-okd-input-reversed-focus-border-color: #000;
  --dex-okd-input-reversed-focus-caret-color: var(--dex-okd-color-content-inverse);
  --dex-okd-input-reversed-focus-shadow: 0px 0px 0px 0px #ffffff00;
  --dex-okd-input-reversed-focus-background: #f3f3f3;
  --dex-okd-input-reversed-disabled-text-color: #ccc;
  --dex-okd-input-reversed-disabled-placeholder-color: #ccc;
  --dex-okd-input-reversed-disabled-border-color: #e6e6e6;
  --dex-okd-input-reversed-disabled-caret-color: #000;
  --dex-okd-input-reversed-disabled-shadow: 0 0 0 0 transparent;
  --dex-okd-input-reversed-disabled-background: #f6f6f6;
  --dex-okd-input-reversed-error-text-color: var(--dex-okd-color-content-inverse);
  --dex-okd-input-reversed-error-placeholder-color: rgba(0, 0, 0, .36);
  --dex-okd-input-reversed-error-border-color: var(--dex-okd-color-semantic-negative);
  --dex-okd-input-reversed-error-caret-color: var(--dex-okd-color-content-inverse);
  --dex-okd-input-reversed-error-shadow: 0 0 0 0 transparent;
  --dex-okd-input-reversed-error-background: #f3f3f3;
  --dex-okd-input-reversed-error-tips-color: var(--dex-okd-color-semantic-negative);
  --dex-okd-input-reversed-tips-text-color: var(--dex-okd-color-content-contrast);
  --dex-okd-input-reversed-icon-color: #6c6c6c;
  --dex-okd-input-reversed-label-color: #000;
  --dex-okd-input-reversed-action-color: var(--dex-okd-color-content-inverse);
  --dex-okd-input-number-reversed-default-add-icon-color: #909090;
  --dex-okd-input-number-reversed-default-add-icon-background: transparent;
  --dex-okd-input-number-reversed-hover-add-icon-color: #000;
  --dex-okd-input-number-reversed-hover-add-icon-background: #272727;
  --dex-okd-input-number-reversed-active-add-icon-color: #909090;
  --dex-okd-input-number-reversed-active-add-icon-background: transparent;
  --dex-okd-input-number-reversed-disabled-add-icon-color: #b0b0b0;
  --dex-okd-input-number-reversed-disabled-add-icon-background: transparent;
  --dex-okd-input-code-reversed-common-btn-color: var(--dex-okd-color-content-inverse);
  --dex-okd-input-code-reversed-common-btn-disabled-color: #6c6c6c;
  --dex-okd-input-code-reversed-common-count-color: var(--dex-okd-color-content-tertiary);
  --dex-okd-input-search-reversed-default-text-color: #000;
  --dex-okd-input-search-reversed-default-placeholder-color: #666;
  --dex-okd-input-search-reversed-default-border-color: transparent;
  --dex-okd-input-search-reversed-default-caret-color: #000;
  --dex-okd-input-search-reversed-default-shadow: 0 0 0 0 transparent;
  --dex-okd-input-search-reversed-default-background: #f3f3f3;
  --dex-okd-input-search-reversed-hover-text-color: #000;
  --dex-okd-input-search-reversed-hover-placeholder-color: #ccc;
  --dex-okd-input-search-reversed-hover-border-color: var(--dex-okd-color-transparent-white);
  --dex-okd-input-search-reversed-hover-caret-color: #000;
  --dex-okd-input-search-reversed-hover-shadow: 0px 0px 0px 0px #1212121a;
  --dex-okd-input-search-reversed-hover-background: #f3f3f3;
  --dex-okd-input-search-reversed-focus-text-color: #000;
  --dex-okd-input-search-reversed-focus-placeholder-color: #ccc;
  --dex-okd-input-search-reversed-focus-border-color: transparent;
  --dex-okd-input-search-reversed-focus-caret-color: var(--dex-okd-color-content-inverse);
  --dex-okd-input-search-reversed-focus-shadow: 0px 0px 0px 0px #1212121a;
  --dex-okd-input-search-reversed-focus-background: #f3f3f3;
  --dex-okd-input-search-reversed-error-text-color: #000;
  --dex-okd-input-search-reversed-error-placeholder-color: #ccc;
  --dex-okd-input-search-reversed-error-border-color: #f04872;
  --dex-okd-input-search-reversed-error-caret-color: var(--dex-okd-color-content-inverse);
  --dex-okd-input-search-reversed-error-shadow: 0 0 0 0 transparent;
  --dex-okd-input-search-reversed-error-background: transparent;
  --dex-okd-input-search-reversed-disabled-text-color: #000;
  --dex-okd-input-search-reversed-disabled-placeholder-color: #ccc;
  --dex-okd-input-search-reversed-disabled-border-color: transparent;
  --dex-okd-input-search-reversed-disabled-caret-color: transparent;
  --dex-okd-input-search-reversed-disabled-shadow: 0 0 0 0 transparent;
  --dex-okd-input-search-reversed-disabled-background: #f0f0f0;
  --dex-okd-input-search-reversed-prefix-icon-color: #6c6c6c;
  --dex-okd-input-search-reversed-error-tips-color: #f04872;
  --dex-okd-input-search-suffix-icon-hover-color: var(--dex-okd-color-content-contrast);
  --dex-okd-input-verify-xl-border-radius: 8px;
  --dex-okd-input-code-xl-btn-font-size: 12px;
  --dex-okd-input-number-suffix-border-color: var(--dex-okd-color-border-primary);
  --dex-okd-input-verify-md-border-radius: 6px;
  --dex-okd-input-verify-md-text-font-size: 26px;
  --dex-okd-input-verify-md-margin: 8px;
  --dex-okd-input-readonly-text-color: var(--dex-okd-color-content-primary);
  --dex-okd-input-readonly-placeholder-color: var(--dex-okd-input-default-placeholder-color);
  --dex-okd-input-readonly-border-color: var(--dex-okd-color-border-primary);
  --dex-okd-input-readonly-caret-color: var(--dex-okd-input-default-caret-color);
  --dex-okd-input-readonly-shadow: var(--dex-okd-input-default-shadow);
  --dex-okd-input-readonly-background: var(--dex-okd-color-transparent-white)
}

.theme-light .dex-select-var,
.theme-light.dex-select-var {
  --dex-okd-select-common-placeholder-color: #bdbdbd;
  --dex-okd-select-common-text-color: #3d3d3d;
  --dex-okd-select-common-title-color: var(--dex-okd-color-content-contrast);
  --dex-okd-select-common-border-color: #ebebeb;
  --dex-okd-select-option-default-text-color: var(--dex-okd-color-content-primary);
  --dex-okd-select-option-hover-text-color: #000;
  --dex-okd-select-option-active-text-color: var(--dex-okd-color-content-primary);
  --dex-okd-select-option-disabled-text-color: var(--dex-okd-color-content-disabled);
  --dex-okd-select-option-default-bg: var(--dex-okd-color-common-transparent);
  --dex-okd-select-option-hover-bg: #f9f9f9;
  --dex-okd-select-option-active-bg: var(--dex-okd-color-common-transparent);
  --dex-okd-select-option-disabled-bg: var(--dex-okd-color-common-transparent);
  --dex-okd-select-check-default-icon-color: var(--dex-okd-color-content-primary);
  --dex-okd-select-empty-default-icon-color: var(--dex-okd-color-content-tertiary);
  --dex-okd-select-empty-default-text-color: var(--dex-okd-color-content-contrast);
  --dex-okd-select-search-input-bg: #ebebeb;
  --dex-okd-select-search-input-placeholder-color: #929292;
  --dex-okd-select-search-input-color: #000;
  --dex-okd-select-search-input-icon-color: #6e6e6e;
  --dex-okd-select-search-input-border-radius: 4px;
  --dex-okd-select-drop-box-border-color: var(--dex-okd-color-border-primary);
  --dex-okd-select-drop-box-shadow: var(--dex-okd-shadow-lg);
  --dex-okd-select-drop-box-bg: var(--dex-okd-color-modal-primary);
  --dex-okd-select-drop-box-margin-top: 4px;
  --dex-okd-select-drop-box-border-radius: 8px;
  --dex-okd-select-text-select-default-icon-size: var(--dex-okd-font-size-xs);
  --dex-okd-select-text-select-default-font-color: var(--dex-okd-color-content-secondary);
  --dex-okd-select-text-select-hover-font-color: var(--dex-okd-color-content-primary);
  --dex-okd-select-text-select-select-font-color: var(--dex-okd-color-content-primary);
  --dex-okd-select-text-select-disabled-font-color: var(--dex-okd-color-content-disabled);
  --dex-okd-select-text-select-default-icon-color: var(--dex-okd-color-content-primary);
  --dex-okd-select-text-select-hover-icon-color: var(--dex-okd-color-content-primary);
  --dex-okd-select-text-select-select-icon-color: var(--dex-okd-color-content-primary);
  --dex-okd-select-text-select-disabled-icon-color: var(--dex-okd-color-content-disabled);
  --dex-okd-select-input-select-default-icon-color: var(--dex-okd-color-content-primary);
  --dex-okd-select-input-select-default-icon-size: 16px;
  --dex-okd-select-md-title-font-size: 10px;
  --dex-okd-select-sm-title-font-size: 10px;
  --dex-okd-select-xs-title-font-size: 10px;
  --dex-okd-select-md-title-line-height: var(--dex-okd-select-md-title-font-size);
  --dex-okd-select-sm-title-line-height: var(--dex-okd-select-md-title-font-size);
  --dex-okd-select-xs-title-line-height: var(--dex-okd-select-md-title-font-size);
  --dex-okd-select-md-title-padding-horizontal: 16px;
  --dex-okd-select-md-title-padding-top: 12px;
  --dex-okd-select-md-title-padding-bottom: 4px;
  --dex-okd-select-sm-title-padding-horizontal: 12px;
  --dex-okd-select-sm-title-padding-top: 4px;
  --dex-okd-select-sm-title-padding-bottom: 4px;
  --dex-okd-select-xs-title-padding-horizontal: 12px;
  --dex-okd-select-xs-title-padding-top: 4px;
  --dex-okd-select-xs-title-padding-bottom: 4px;
  --dex-okd-select-md-text-font-size: var(--dex-okd-font-size-md);
  --dex-okd-select-sm-text-font-size: var(--dex-okd-font-size-xs);
  --dex-okd-select-xs-text-font-size: var(--dex-okd-font-size-xs);
  --dex-okd-select-md-option-font-size: var(--dex-okd-font-size-md);
  --dex-okd-select-sm-option-font-size: var(--dex-okd-font-size-xs);
  --dex-okd-select-xs-option-font-size: var(--dex-okd-font-size-xs);
  --dex-okd-select-md-option-line-height: var(--dex-okd-line-height-md);
  --dex-okd-select-sm-option-line-height: var(--dex-okd-line-height-xs);
  --dex-okd-select-xs-option-line-height: var(--dex-okd-line-height-xs);
  --dex-okd-select-md-option-padding-horizontal: 16px;
  --dex-okd-select-md-option-padding-vertical: 12px;
  --dex-okd-select-sm-option-padding-horizontal: 12px;
  --dex-okd-select-sm-option-padding-vertical: 8px;
  --dex-okd-select-xs-option-padding-horizontal: 12px;
  --dex-okd-select-xs-option-padding-vertical: 8px;
  --dex-okd-select-md-check-icon-font-size: 16px;
  --dex-okd-select-sm-check-icon-font-size: 16px;
  --dex-okd-select-xs-check-icon-font-size: 16px;
  --dex-okd-select-md-empty-icon-font-size: 24px;
  --dex-okd-select-sm-empty-icon-font-size: 24px;
  --dex-okd-select-xs-empty-icon-font-size: 24px;
  --dex-okd-select-md-empty-font-size: var(--dex-okd-font-size-md);
  --dex-okd-select-sm-empty-font-size: var(--dex-okd-font-size-md);
  --dex-okd-select-xs-empty-font-size: var(--dex-okd-font-size-md);
  --dex-okd-select-md-search-input-font-size: var(--dex-okd-font-size-md);
  --dex-okd-select-sm-search-input-font-size: var(--dex-okd-font-size-md);
  --dex-okd-select-xs-search-input-font-size: var(--dex-okd-font-size-md);
  --dex-okd-select-md-search-icon-size: 18px;
  --dex-okd-select-sm-search-icon-size: 18px;
  --dex-okd-select-xs-search-icon-size: 18px;
  --dex-okd-select-md-text-select-font-size: var(--dex-okd-font-size-md);
  --dex-okd-select-sm-text-select-font-size: var(--dex-okd-font-size-xs);
  --dex-okd-select-xs-text-select-font-size: var(--dex-okd-font-size-xs);
  --dex-okd-select-md-search-margin-vertical: 8px;
  --dex-okd-select-md-search-margin-horizontal: 16px;
  --dex-okd-select-md-search-height: 28px;
  --dex-okd-select-sm-search-margin-vertical: 8px;
  --dex-okd-select-sm-search-margin-horizontal: 12px;
  --dex-okd-select-sm-search-height: 28px;
  --dex-okd-select-xs-search-margin-vertical: 8px;
  --dex-okd-select-xs-search-margin-horizontal: 12px;
  --dex-okd-select-xs-search-height: 28px;
  --dex-okd-select-option-common-line-color: var(--dex-okd-color-border-primary);
  --dex-okd-select-option-common-line-height: 1px;
  --dex-okd-select-option-common-line-margin-vertical: 6px;
  --dex-okd-select-md-search-padding-vertical: 5px;
  --dex-okd-select-md-search-padding-horizontal: 8px;
  --dex-okd-select-sm-search-padding-vertical: 5px;
  --dex-okd-select-sm-search-padding-horizontal: 8px;
  --dex-okd-select-xs-search-padding-vertical: 5px;
  --dex-okd-select-xs-search-padding-horizontal: 8px;
  --dex-okd-select-mobile-option-container-padding-vertical: 8px;
  --dex-okd-select-mobile-option-item-container-padding-top: 8px;
  --dex-okd-select-search-input-clear-icon-color: #bdbdbd;
  --dex-okd-select-md-search-clear-icon-size: 14px;
  --dex-okd-select-sm-search-clear-icon-size: 14px;
  --dex-okd-select-xs-search-clear-icon-size: 14px;
  --dex-okd-select-lg-title-padding-top: 12px;
  --dex-okd-select-lg-title-padding-bottom: 4px;
  --dex-okd-select-lg-title-padding-horizontal: 16px;
  --dex-okd-select-lg-title-font-size: 12px;
  --dex-okd-select-lg-title-line-height: var(--dex-okd-select-lg-title-font-size);
  --dex-okd-select-lg-option-line-height: var(--dex-okd-select-lg-option-line-height);
  --dex-okd-select-lg-option-padding-vertical: 12px;
  --dex-okd-select-lg-option-padding-horizontal: 16px;
  --dex-okd-select-lg-option-font-size: 14px;
  --dex-okd-select-lg-empty-icon-font-size: 24px;
  --dex-okd-select-lg-empty-font-size: 14px;
  --dex-okd-select-lg-search-margin-horizontal: 16px;
  --dex-okd-select-lg-search-margin-vertical: 8px;
  --dex-okd-select-lg-search-padding-horizontal: 8px;
  --dex-okd-select-lg-search-padding-vertical: 4px;
  --dex-okd-select-lg-search-height: 28px;
  --dex-okd-select-lg-search-icon-size: 18px;
  --dex-okd-select-lg-search-clear-icon-size: 14px;
  --dex-okd-select-lg-search-input-font-size: 14px;
  --dex-okd-select-lg-text-select-font-size: 14px;
  --dex-okd-select-lg-check-icon-font-size: var(--dex-okd-select-md-check-icon-font-size);
  --dex-okd-select-lg-text-font-size: 14px;
  --dex-okd-select-xl-title-padding-top: 12px;
  --dex-okd-select-xl-title-padding-bottom: 4px;
  --dex-okd-select-xl-title-padding-horizontal: 16px;
  --dex-okd-select-xl-title-font-size: 12px;
  --dex-okd-select-xl-title-line-height: var(--dex-okd-select-xl-title-font-size);
  --dex-okd-select-xl-option-line-height: var(--dex-okd-select-xl-option-line-height);
  --dex-okd-select-xl-option-padding-vertical: 12px;
  --dex-okd-select-xl-option-padding-horizontal: 16px;
  --dex-okd-select-xl-option-font-size: 14px;
  --dex-okd-select-xl-empty-icon-font-size: 24px;
  --dex-okd-select-xl-empty-font-size: 14px;
  --dex-okd-select-xl-search-margin-horizontal: 16px;
  --dex-okd-select-xl-search-margin-vertical: 8px;
  --dex-okd-select-xl-search-padding-horizontal: 8px;
  --dex-okd-select-xl-search-padding-vertical: 4px;
  --dex-okd-select-xl-search-height: 28px;
  --dex-okd-select-xl-search-icon-size: 18px;
  --dex-okd-select-xl-search-clear-icon-size: 14px;
  --dex-okd-select-xl-search-input-font-size: 14px;
  --dex-okd-select-xl-text-select-font-size: 14px;
  --dex-okd-select-xl-check-icon-font-size: var(--dex-okd-select-md-check-icon-font-size);
  --dex-okd-select-xl-text-font-size: 14px;
  --dex-okd-select-mobile-option-line-height: 20px;
  --dex-okd-select-mobile-option-padding-vertical: 18px;
  --dex-okd-select-mobile-option-padding-horizontal: 16px;
  --dex-okd-select-mobile-option-font-size: 16px;
  --dex-okd-select-mobile-option-icon-font-size: 24px;
  --dex-okd-select-mobile-option-title-padding-top: var(--dex-okd-select-md-title-padding-top);
  --dex-okd-select-mobile-option-title-padding-bottom: var(--dex-okd-select-md-title-padding-bottom);
  --dex-okd-select-mobile-option-title-padding-horizontal: var(--dex-okd-select-md-title-padding-horizontal);
  --dex-okd-select-mobile-option-title-font-size: var(--dex-okd-select-md-title-font-size);
  --dex-okd-select-mobile-option-title-line-height: var(--dex-okd-select-md-title-line-height);
  --dex-okd-select-xl-option-icon-font-size: 20px;
  --dex-okd-select-lg-option-icon-font-size: 20px;
  --dex-okd-select-md-option-icon-font-size: 20px;
  --dex-okd-select-sm-option-icon-font-size: 16px;
  --dex-okd-select-xs-option-icon-font-size: 16px;
  --dex-okd-select-xl-tag-icon-font-size: 16px;
  --dex-okd-select-lg-tag-icon-font-size: 16px;
  --dex-okd-select-md-tag-icon-font-size: 16px;
  --dex-okd-select-sm-tag-icon-font-size: 14px;
  --dex-okd-select-xs-tag-icon-font-size: 14px;
  --dex-okd-select-xl-reference-icon-font-size: 20px;
  --dex-okd-select-lg-reference-icon-font-size: 20px;
  --dex-okd-select-md-reference-icon-font-size: 20px;
  --dex-okd-select-sm-reference-icon-font-size: 16px;
  --dex-okd-select-xs-reference-icon-font-size: 16px;
  --dex-okd-select-xl-tag-text-font-size: 14px;
  --dex-okd-select-lg-tag-text-font-size: 14px;
  --dex-okd-select-md-tag-text-font-size: 14px;
  --dex-okd-select-sm-tag-text-font-size: 12px;
  --dex-okd-select-xs-tag-text-font-size: 12px;
  --dex-okd-select-xl-tag-height: 32px;
  --dex-okd-select-lg-tag-height: 32px;
  --dex-okd-select-md-tag-height: 24px;
  --dex-okd-select-sm-tag-height: 24px;
  --dex-okd-select-xs-tag-height: 20px;
  --dex-okd-select-tag-default-background: var(--dex-okd-color-background-surface-contrast);
  --dex-okd-select-tag-disabled-background: var(--dex-okd-color-background-surface-contrast);
  --dex-okd-select-tag-text-default-color: var(--dex-okd-color-content-primary);
  --dex-okd-select-tag-text-disabled-color: var(--dex-okd-color-content-disabled);
  --dex-okd-select-tag-icon-default-color: var(--dex-okd-color-content-contrast);
  --dex-okd-select-tag-icon-hover-color: var(--dex-okd-color-content-primary);
  --dex-okd-select-tag-icon-disabled-color: var(--dex-okd-color-content-disabled);
  --dex-okd-select-reference-icon-default-color: var(--dex-okd-color-content-contrast);
  --dex-okd-select-reference-icon-hover-color: var(--dex-okd-color-content-primary);
  --dex-okd-select-xl-arrow-icon-font-size: 16px;
  --dex-okd-select-lg-arrow-icon-font-size: 16px;
  --dex-okd-select-md-arrow-icon-font-size: 16px;
  --dex-okd-select-sm-arrow-icon-font-size: 14px;
  --dex-okd-select-xs-arrow-icon-font-size: 14px;
  --dex-okd-select-tag-icon-padding-left: 4px;
  --dex-okd-select-tag-border-radius: 4px;
  --dex-okd-select-tag-margin-right: 4px;
  --dex-okd-select-tag-margin-bottom: 4px;
  --dex-okd-select-tag-padding-horizontal: 8px;
  --dex-okd-select-xl-input-suffix-margin-left: 16px;
  --dex-okd-select-lg-input-suffix-margin-left: 16px;
  --dex-okd-select-md-input-suffix-margin-left: 16px;
  --dex-okd-select-sm-input-suffix-margin-left: 16px;
  --dex-okd-select-xs-input-suffix-margin-left: 12px;
  --dex-okd-select-xl-tag-margin-right: 4px;
  --dex-okd-select-lg-tag-margin-right: 4px;
  --dex-okd-select-md-tag-margin-right: 4px;
  --dex-okd-select-sm-tag-margin-right: 4px;
  --dex-okd-select-xs-tag-margin-right: 4px;
  --dex-okd-select-input-select-disabled-icon-color: var(--dex-okd-color-content-disabled)
}

.theme-dark .dex-select-var,
.theme-dark.dex-select-var {
  --dex-okd-select-common-placeholder-color: #ccc;
  --dex-okd-select-common-text-color: #fafafa;
  --dex-okd-select-common-title-color: var(--dex-okd-color-content-contrast);
  --dex-okd-select-common-border-color: #2e2e2e;
  --dex-okd-select-option-default-text-color: var(--dex-okd-color-content-primary);
  --dex-okd-select-option-hover-text-color: #fafafa;
  --dex-okd-select-option-active-text-color: var(--dex-okd-color-content-primary);
  --dex-okd-select-option-disabled-text-color: var(--dex-okd-color-content-disabled);
  --dex-okd-select-option-default-bg: var(--dex-okd-color-common-transparent);
  --dex-okd-select-option-hover-bg: hsla(0, 0%, 98%, .05);
  --dex-okd-select-option-active-bg: var(--dex-okd-color-common-transparent);
  --dex-okd-select-option-disabled-bg: var(--dex-okd-color-common-transparent);
  --dex-okd-select-check-default-icon-color: var(--dex-okd-color-content-primary);
  --dex-okd-select-empty-default-icon-color: var(--dex-okd-color-content-contrast);
  --dex-okd-select-empty-default-text-color: var(--dex-okd-color-content-contrast);
  --dex-okd-select-search-input-bg: rgba(64, 64, 64, .5);
  --dex-okd-select-search-input-placeholder-color: #6c6c6c;
  --dex-okd-select-search-input-color: #fafafa;
  --dex-okd-select-search-input-icon-color: #909090;
  --dex-okd-select-search-input-border-radius: 4px;
  --dex-okd-select-drop-box-border-color: var(--dex-okd-color-border-primary);
  --dex-okd-select-drop-box-shadow: var(--dex-okd-shadow-sm), var(--dex-okd-shadow-md);
  --dex-okd-select-drop-box-bg: var(--dex-okd-color-modal-primary);
  --dex-okd-select-drop-box-margin-top: 4px;
  --dex-okd-select-drop-box-border-radius: 8px;
  --dex-okd-select-text-select-default-icon-size: var(--dex-okd-font-size-xs);
  --dex-okd-select-text-select-default-font-color: var(--dex-okd-color-content-secondary);
  --dex-okd-select-text-select-hover-font-color: var(--dex-okd-color-content-primary);
  --dex-okd-select-text-select-select-font-color: var(--dex-okd-color-content-primary);
  --dex-okd-select-text-select-disabled-font-color: var(--dex-okd-color-content-disabled);
  --dex-okd-select-text-select-default-icon-color: var(--dex-okd-color-content-primary);
  --dex-okd-select-text-select-hover-icon-color: var(--dex-okd-color-content-primary);
  --dex-okd-select-text-select-select-icon-color: var(--dex-okd-color-content-primary);
  --dex-okd-select-text-select-disabled-icon-color: var(--dex-okd-color-content-disabled);
  --dex-okd-select-input-select-default-icon-color: var(--dex-okd-color-content-primary);
  --dex-okd-select-input-select-default-icon-size: 16px;
  --dex-okd-select-md-title-font-size: 10px;
  --dex-okd-select-sm-title-font-size: 10px;
  --dex-okd-select-xs-title-font-size: 10px;
  --dex-okd-select-md-title-line-height: var(--dex-okd-select-md-title-font-size);
  --dex-okd-select-sm-title-line-height: var(--dex-okd-select-md-title-font-size);
  --dex-okd-select-xs-title-line-height: var(--dex-okd-select-md-title-font-size);
  --dex-okd-select-md-title-padding-horizontal: 16px;
  --dex-okd-select-md-title-padding-top: 4px;
  --dex-okd-select-md-title-padding-bottom: 4px;
  --dex-okd-select-sm-title-padding-horizontal: 12px;
  --dex-okd-select-sm-title-padding-top: 4px;
  --dex-okd-select-sm-title-padding-bottom: 4px;
  --dex-okd-select-xs-title-padding-horizontal: 12px;
  --dex-okd-select-xs-title-padding-top: 4px;
  --dex-okd-select-xs-title-padding-bottom: 4px;
  --dex-okd-select-md-text-font-size: var(--dex-okd-font-size-md);
  --dex-okd-select-sm-text-font-size: var(--dex-okd-font-size-xs);
  --dex-okd-select-xs-text-font-size: var(--dex-okd-font-size-xs);
  --dex-okd-select-md-option-font-size: var(--dex-okd-font-size-md);
  --dex-okd-select-sm-option-font-size: var(--dex-okd-font-size-xs);
  --dex-okd-select-xs-option-font-size: var(--dex-okd-font-size-xs);
  --dex-okd-select-md-option-line-height: var(--dex-okd-line-height-md);
  --dex-okd-select-sm-option-line-height: var(--dex-okd-line-height-xs);
  --dex-okd-select-xs-option-line-height: var(--dex-okd-line-height-xs);
  --dex-okd-select-md-option-padding-horizontal: 16px;
  --dex-okd-select-md-option-padding-vertical: 8px;
  --dex-okd-select-sm-option-padding-horizontal: 12px;
  --dex-okd-select-sm-option-padding-vertical: 8px;
  --dex-okd-select-xs-option-padding-horizontal: 12px;
  --dex-okd-select-xs-option-padding-vertical: 8px;
  --dex-okd-select-md-check-icon-font-size: 16px;
  --dex-okd-select-sm-check-icon-font-size: 16px;
  --dex-okd-select-xs-check-icon-font-size: 16px;
  --dex-okd-select-md-empty-icon-font-size: 24px;
  --dex-okd-select-sm-empty-icon-font-size: 24px;
  --dex-okd-select-xs-empty-icon-font-size: 24px;
  --dex-okd-select-md-empty-font-size: var(--dex-okd-font-size-md);
  --dex-okd-select-sm-empty-font-size: var(--dex-okd-font-size-md);
  --dex-okd-select-xs-empty-font-size: var(--dex-okd-font-size-md);
  --dex-okd-select-md-search-input-font-size: var(--dex-okd-font-size-md);
  --dex-okd-select-sm-search-input-font-size: var(--dex-okd-font-size-md);
  --dex-okd-select-xs-search-input-font-size: var(--dex-okd-font-size-md);
  --dex-okd-select-md-search-icon-size: 18px;
  --dex-okd-select-sm-search-icon-size: 18px;
  --dex-okd-select-xs-search-icon-size: 18px;
  --dex-okd-select-md-search-margin-vertical: 8px;
  --dex-okd-select-md-search-margin-horizontal: 16px;
  --dex-okd-select-md-search-height: 28px;
  --dex-okd-select-sm-search-margin-vertical: 8px;
  --dex-okd-select-sm-search-margin-horizontal: 12px;
  --dex-okd-select-sm-search-height: 28px;
  --dex-okd-select-xs-search-margin-vertical: 8px;
  --dex-okd-select-xs-search-margin-horizontal: 12px;
  --dex-okd-select-xs-search-height: 28px;
  --dex-okd-select-option-common-line-color: var(--dex-okd-color-border-primary);
  --dex-okd-select-option-common-line-height: 1px;
  --dex-okd-select-option-common-line-margin-vertical: 6px;
  --dex-okd-select-md-search-padding-vertical: 5px;
  --dex-okd-select-md-search-padding-horizontal: 8px;
  --dex-okd-select-sm-search-padding-vertical: 5px;
  --dex-okd-select-sm-search-padding-horizontal: 8px;
  --dex-okd-select-xs-search-padding-vertical: 5px;
  --dex-okd-select-xs-search-padding-horizontal: 8px;
  --dex-okd-select-mobile-option-container-padding-vertical: 8px;
  --dex-okd-select-mobile-option-item-container-padding-top: 8px;
  --dex-okd-select-search-input-clear-icon-color: #6c6c6c;
  --dex-okd-select-md-search-clear-icon-size: 14px;
  --dex-okd-select-sm-search-clear-icon-size: 14px;
  --dex-okd-select-xs-search-clear-icon-size: 14px;
  --dex-okd-select-lg-title-padding-top: 12px;
  --dex-okd-select-lg-title-padding-bottom: 14px;
  --dex-okd-select-lg-title-padding-horizontal: 16px;
  --dex-okd-select-lg-title-font-size: 12px;
  --dex-okd-select-lg-title-line-height: var(--dex-okd-select-lg-title-font-size);
  --dex-okd-select-lg-option-line-height: var(--dex-okd-select-lg-option-line-height);
  --dex-okd-select-lg-option-padding-vertical: 12px;
  --dex-okd-select-lg-option-padding-horizontal: 16px;
  --dex-okd-select-lg-option-font-size: 14px;
  --dex-okd-select-lg-empty-icon-font-size: 24px;
  --dex-okd-select-lg-empty-font-size: 14px;
  --dex-okd-select-lg-search-margin-horizontal: 16px;
  --dex-okd-select-lg-search-margin-vertical: 8px;
  --dex-okd-select-lg-search-padding-horizontal: 8px;
  --dex-okd-select-lg-search-padding-vertical: 4px;
  --dex-okd-select-lg-search-height: 28px;
  --dex-okd-select-lg-search-icon-size: 18px;
  --dex-okd-select-lg-search-clear-icon-size: 14px;
  --dex-okd-select-lg-search-input-font-size: 14px;
  --dex-okd-select-lg-text-select-font-size: 14px;
  --dex-okd-select-lg-check-icon-font-size: var(--dex-okd-select-md-check-icon-font-size);
  --dex-okd-select-lg-text-font-size: 14px;
  --dex-okd-select-xl-title-padding-top: 12px;
  --dex-okd-select-xl-title-padding-bottom: 14px;
  --dex-okd-select-xl-title-padding-horizontal: 16px;
  --dex-okd-select-xl-title-font-size: 12px;
  --dex-okd-select-xl-title-line-height: var(--dex-okd-select-xl-title-font-size);
  --dex-okd-select-xl-option-line-height: var(--dex-okd-select-xl-option-line-height);
  --dex-okd-select-xl-option-padding-vertical: 12px;
  --dex-okd-select-xl-option-padding-horizontal: 16px;
  --dex-okd-select-xl-option-font-size: 14px;
  --dex-okd-select-xl-empty-icon-font-size: 24px;
  --dex-okd-select-xl-empty-font-size: 14px;
  --dex-okd-select-xl-search-margin-horizontal: 16px;
  --dex-okd-select-xl-search-margin-vertical: 8px;
  --dex-okd-select-xl-search-padding-horizontal: 8px;
  --dex-okd-select-xl-search-padding-vertical: 4px;
  --dex-okd-select-xl-search-height: 28px;
  --dex-okd-select-xl-search-icon-size: 18px;
  --dex-okd-select-xl-search-clear-icon-size: 14px;
  --dex-okd-select-xl-search-input-font-size: 14px;
  --dex-okd-select-xl-text-select-font-size: 14px;
  --dex-okd-select-xl-check-icon-font-size: var(--dex-okd-select-md-check-icon-font-size);
  --dex-okd-select-xl-text-font-size: 14px;
  --dex-okd-select-sm-text-select-font-size: 12px;
  --dex-okd-select-mobile-option-line-height: 20px;
  --dex-okd-select-mobile-option-padding-vertical: 18px;
  --dex-okd-select-mobile-option-padding-horizontal: 16px;
  --dex-okd-select-mobile-option-font-size: 16px;
  --dex-okd-select-mobile-option-icon-font-size: 24px;
  --dex-okd-select-mobile-option-title-padding-top: var(--dex-okd-select-md-title-padding-top);
  --dex-okd-select-mobile-option-title-padding-bottom: var(--dex-okd-select-md-title-padding-bottom);
  --dex-okd-select-mobile-option-title-padding-horizontal: var(--dex-okd-select-md-title-padding-horizontal);
  --dex-okd-select-mobile-option-title-font-size: var(--dex-okd-select-md-title-font-size);
  --dex-okd-select-mobile-option-title-line-height: var(--dex-okd-select-md-title-line-height);
  --dex-okd-select-xl-option-icon-font-size: 20px;
  --dex-okd-select-lg-option-icon-font-size: 20px;
  --dex-okd-select-md-option-icon-font-size: 20px;
  --dex-okd-select-sm-option-icon-font-size: 16px;
  --dex-okd-select-xs-option-icon-font-size: 16px;
  --dex-okd-select-xl-tag-icon-font-size: 16px;
  --dex-okd-select-lg-tag-icon-font-size: 16px;
  --dex-okd-select-md-tag-icon-font-size: 16px;
  --dex-okd-select-sm-tag-icon-font-size: 14px;
  --dex-okd-select-xs-tag-icon-font-size: 14px;
  --dex-okd-select-xl-reference-icon-font-size: 20px;
  --dex-okd-select-lg-reference-icon-font-size: 20px;
  --dex-okd-select-md-reference-icon-font-size: 20px;
  --dex-okd-select-sm-reference-icon-font-size: 16px;
  --dex-okd-select-xs-reference-icon-font-size: 16px;
  --dex-okd-select-xl-tag-text-font-size: 14px;
  --dex-okd-select-lg-tag-text-font-size: 14px;
  --dex-okd-select-md-tag-text-font-size: 14px;
  --dex-okd-select-sm-tag-text-font-size: 12px;
  --dex-okd-select-xs-tag-text-font-size: 12px;
  --dex-okd-select-xl-tag-height: 32px;
  --dex-okd-select-lg-tag-height: 32px;
  --dex-okd-select-md-tag-height: 24px;
  --dex-okd-select-sm-tag-height: 24px;
  --dex-okd-select-xs-tag-height: 20px;
  --dex-okd-select-tag-default-background: var(--dex-okd-color-background-surface-contrast);
  --dex-okd-select-tag-disabled-background: var(--dex-okd-color-background-surface-contrast);
  --dex-okd-select-tag-text-default-color: var(--dex-okd-color-content-primary);
  --dex-okd-select-tag-text-disabled-color: var(--dex-okd-color-content-disabled);
  --dex-okd-select-tag-icon-default-color: var(--dex-okd-color-content-contrast);
  --dex-okd-select-tag-icon-hover-color: var(--dex-okd-color-content-primary);
  --dex-okd-select-tag-icon-disabled-color: var(--dex-okd-color-content-disabled);
  --dex-okd-select-reference-icon-default-color: var(--dex-okd-color-content-contrast);
  --dex-okd-select-reference-icon-hover-color: var(--dex-okd-color-content-primary);
  --dex-okd-select-xl-arrow-icon-font-size: 16px;
  --dex-okd-select-lg-arrow-icon-font-size: 16px;
  --dex-okd-select-md-arrow-icon-font-size: 16px;
  --dex-okd-select-sm-arrow-icon-font-size: 14px;
  --dex-okd-select-xs-arrow-icon-font-size: 14px;
  --dex-okd-select-tag-icon-padding-left: 4px;
  --dex-okd-select-tag-border-radius: 4px;
  --dex-okd-select-tag-margin-right: 4px;
  --dex-okd-select-tag-margin-bottom: 4px;
  --dex-okd-select-tag-padding-horizontal: 8px;
  --dex-okd-select-xl-input-suffix-margin-left: 16px;
  --dex-okd-select-lg-input-suffix-margin-left: 16px;
  --dex-okd-select-md-input-suffix-margin-left: 16px;
  --dex-okd-select-sm-input-suffix-margin-left: 16px;
  --dex-okd-select-xs-input-suffix-margin-left: 12px;
  --dex-okd-select-xl-tag-margin-right: 4px;
  --dex-okd-select-lg-tag-margin-right: 4px;
  --dex-okd-select-md-tag-margin-right: 4px;
  --dex-okd-select-sm-tag-margin-right: 4px;
  --dex-okd-select-xs-tag-margin-right: 4px;
  --dex-okd-select-input-select-disabled-icon-color: var(--dex-okd-color-content-disabled)
}

.theme-light .dex-tabs-var,
.theme-light.dex-tabs-var {
  --dex-okd-tabs-pane-bg-color: transparent;
  --dex-okd-tabs-pane-label-color: #929292;
  --dex-okd-tabs-pane-label-active-color: #3d3d3d;
  --dex-okd-tabs-pane-icon-color: #929292;
  --dex-okd-tabs-pane-icon-active-color: #3d3d3d;
  --dex-okd-tabs-pane-icon-bg-color: #fff;
  --dex-okd-tabs-pane-slot-bg-color: transparent;
  --dex-okd-tabs-pane-active-color: #0569ff;
  --dex-okd-tabs-pane-background-color: #fff;
  --dex-okd-tabs-pane-nav-shadow-color: #ebebeb;
  --dex-okd-tabs-green-color: #127837;
  --dex-okd-tabs-blue-color: #0569ff;
  --dex-okd-tabs-red-color: #91304a;
  --dex-okd-tabs-underline-pane-list-border-color: #ebebeb;
  --dex-okd-tabs-underline-pane-list-bg-color: #ebebeb;
  --dex-okd-tabs-underline-pane-blue-label-active-color: var(--dex-okd-color-content-primary);
  --dex-okd-tabs-underline-pane-blue-border-active-color: var(--dex-okd-color-border-selected);
  --dex-okd-tabs-underline-pane-green-border-active-color: var(--dex-okd-color-border-pnl-profit-default);
  --dex-okd-tabs-underline-pane-green-label-active-color: var(--dex-okd-color-content-pnl-profit-default);
  --dex-okd-tabs-underline-pane-red-border-active-color: var(--dex-okd-color-border-pnl-loss-default);
  --dex-okd-tabs-underline-pane-red-label-active-color: var(--dex-okd-color-content-pnl-loss-default);
  --dex-okd-tabs-underline-pane-grey-border-active-color: var(--dex-okd-color-border-selected);
  --dex-okd-tabs-underline-pane-grey-label-active-color: var(--dex-okd-color-content-primary);
  --dex-okd-tabs-segmented-pane-bg-color: transparent;
  --dex-okd-tabs-segmented-pane-green-bg-active-color: var(--dex-okd-color-surface-pnl-profit-emphasis);
  --dex-okd-tabs-segmented-pane-green-label-active-color: var(--dex-okd-color-content-pnl-profit-oncolor-emphasis);
  --dex-okd-tabs-segmented-pane-red-bg-active-color: var(--dex-okd-color-surface-pnl-loss-emphasis);
  --dex-okd-tabs-segmented-pane-red-label-active-color: var(--dex-okd-color-content-pnl-loss-oncolor-emphasis);
  --dex-okd-tabs-segmented-pane-blue-bg-active-color: #000;
  --dex-okd-tabs-segmented-pane-blue-label-active-color: #fff;
  --dex-okd-tabs-segmented-pane-grey-bg-active-color: #fff;
  --dex-okd-tabs-segmented-pane-grey-label-active-color: var(--dex-okd-color-content-primary);
  --segmented-pane-label-active-color: var(--dex-okd-tabs-pane-icon-active-color);
  --dex-okd-tabs-segmented-pane-bg-shadow-color: 0px 2px 4px -1px #0000000f, 0px 4px 6px -1px #0000001a;
  --dex-okd-tabs-segmented-pane-list-bg-color: #ebebeb;
  --dex-okd-tabs-muted-pane-border-color: #dbdbdb;
  --dex-okd-tabs-muted-pane-blue-border-active-color: var(--dex-okd-color-border-secondary);
  --dex-okd-tabs-muted-pane-blue-label-active-color: var(--dex-okd-color-content-secondary);
  --dex-okd-tabs-muted-pane-green-border-active-color: var(--dex-okd-color-border-pnl-profit-default);
  --dex-okd-tabs-muted-pane-green-label-active-color: var(--dex-okd-color-content-pnl-profit-default);
  --dex-okd-tabs-muted-pane-red-border-active-color: var(--dex-okd-color-border-pnl-loss-graph);
  --dex-okd-tabs-muted-pane-red-label-active-color: var(--dex-okd-color-content-pnl-loss-default);
  --dex-okd-tabs-muted-pane-grey-border-active-color: var(--dex-okd-color-border-secondary);
  --dex-okd-tabs-muted-pane-grey-label-active-color: var(--dex-okd-color-content-secondary);
  --dex-okd-tabs-button-pane-bg-color: transparent;
  --dex-okd-tabs-button-pane-border-color: #dbdbdb;
  --dex-okd-tabs-button-pane-blue-bg-active-color: var(--dex-okd-color-background-surface-primary);
  --dex-okd-tabs-button-pane-blue-label-active-color: var(--dex-okd-color-content-primary);
  --dex-okd-tabs-button-pane-green-bg-active-color: var(--dex-okd-color-surface-pnl-profit-emphasis);
  --dex-okd-tabs-button-pane-green-label-active-color: var(--dex-okd-color-content-pnl-profit-oncolor-emphasis);
  --dex-okd-tabs-button-pane-red-bg-active-color: var(--dex-okd-color-surface-pnl-loss-emphasis);
  --dex-okd-tabs-button-pane-red-label-active-color: var(--dex-okd-color-content-pnl-loss-oncolor-emphasis);
  --dex-okd-tabs-button-pane-grey-bg-active-color: #f3f3f3;
  --dex-okd-tabs-button-pane-grey-label-active-color: var(--dex-okd-color-content-primary);
  --dex-okd-tabs-lg-font-size: var(--dex-okd-font-size-md);
  --dex-okd-tabs-md-font-size: var(--dex-okd-font-size-md);
  --dex-okd-tabs-sm-font-size: var(--dex-okd-font-size-xs);
  --dex-okd-tabs-xs-font-size: var(--dex-okd-font-size-xs);
  --dex-okd-tabs-lg-icon-size: 16px;
  --dex-okd-tabs-md-icon-size: 16px;
  --dex-okd-tabs-sm-icon-size: 14px;
  --dex-okd-tabs-xs-icon-size: 14px;
  --dex-okd-tabs-lg-height: 44px;
  --dex-okd-tabs-md-height: 40px;
  --dex-okd-tabs-sm-height: 36px;
  --dex-okd-tabs-xs-height: 28px;
  --dex-okd-tabs-lg-label-padding: 16px;
  --dex-okd-tabs-md-label-padding: 16px;
  --dex-okd-tabs-sm-label-padding: 10px;
  --dex-okd-tabs-xs-label-padding: 10px;
  --dex-okd-tabs-lg-gutter-padding: 4px;
  --dex-okd-tabs-md-gutter-padding: 4px;
  --dex-okd-tabs-sm-gutter-padding: 3px;
  --dex-okd-tabs-xs-gutter-padding: 3px;
  --dex-okd-tabs-lg-margin: 16px;
  --dex-okd-tabs-md-margin: 12px;
  --dex-okd-tabs-sm-margin: 8px;
  --dex-okd-tabs-xs-margin: 8px;
  --dex-okd-tabs-lg-icon-width: 10px;
  --dex-okd-tabs-md-icon-width: 10px;
  --dex-okd-tabs-sm-icon-width: 8px;
  --dex-okd-tabs-xs-icon-width: 8px;
  --dex-okd-tabs-underline-pane-common-border-color: var(--dex-okd-color-border-primary);
  --dex-okd-tabs-underline-pane-common-bg-color: var(--dex-okd-color-border-primary);
  --dex-okd-tabs-button-pane-common-border-color: var(--dex-okd-color-border-primary);
  --dex-okd-tabs-muted-pane-common-border-color: var(--dex-okd-color-transparent-white);
  --dex-okd-tabs-segmented-pane-common-list-bg-color: #f3f3f3;
  --dex-okd-tabs-segmented-pane-common-shadow: 0px 0px 0px 0px #0000001a;
  --dex-okd-tabs-common-pane-icon-color: var(--dex-okd-color-content-contrast);
  --dex-okd-tabs-common-pane-icon-active-color: var(--dex-okd-color-content-secondary);
  --dex-okd-tabs-common-pane-icon-bg-color: var(--dex-okd-color-content-inverse);
  --dex-okd-tabs-common-pane-label-color: var(--dex-okd-color-content-contrast);
  --dex-okd-tabs-common-pane-nav-shadow-color: var(--dex-okd-color-content-contrast);
  --dex-okd-tabs-xs-underline-height: 28px;
  --dex-okd-tabs-underline-pane-common-label-color: var(--dex-okd-color-content-contrast);
  --dex-okd-tabs-button-pane-common-bg-color: var(--dex-okd-color-transparent-white);
  --dex-okd-tabs-button-pane-common-label-color: var(--dex-okd-color-content-contrast);
  --dex-okd-tabs-muted-pane-common-label-color: var(--dex-okd-color-content-contrast);
  --dex-okd-tabs-segmented-pane-common-bg-color: var(--dex-okd-color-transparent-white);
  --dex-okd-tabs-segmented-pane-common-label-color: var(--dex-okd-color-content-contrast);
  --dex-okd-tabs-xs-underline-font-size: 12px;
  --dex-okd-tabs-xs-underline-label-padding: 0px;
  --dex-okd-tabs-xs-underline-spacing: 24px;
  --dex-okd-tabs-xs-common-icon-size: 14px;
  --dex-okd-tabs-xs-button-font-size: 12px;
  --dex-okd-tabs-xs-button-height: 28px;
  --dex-okd-tabs-xs-button-label-padding: 8px;
  --dex-okd-tabs-xs-button-spacing: 8px;
  --dex-okd-tabs-xs-muted-font-size: 12px;
  --dex-okd-tabs-xs-muted-height: 28px;
  --dex-okd-tabs-xs-muted-label-padding: 8px;
  --dex-okd-tabs-xs-muted-spacing: 8px;
  --dex-okd-tabs-xs-segmented-font-size: 12px;
  --dex-okd-tabs-xs-segmented-height: 28px;
  --dex-okd-tabs-xs-segmented-label-padding: 8px;
  --dex-okd-tabs-xs-segmented-spacing: 2px;
  --dex-okd-tabs-xs-segmented-container-padding: 2px;
  --dex-okd-tabs-sm-underline-font-size: 12px;
  --dex-okd-tabs-sm-underline-height: 36px;
  --dex-okd-tabs-sm-underline-label-padding: 0px;
  --dex-okd-tabs-sm-underline-spacing: 24px;
  --dex-okd-tabs-sm-common-icon-size: 14px;
  --dex-okd-tabs-sm-button-font-size: 12px;
  --dex-okd-tabs-sm-button-height: 36px;
  --dex-okd-tabs-sm-button-label-padding: 12px;
  --dex-okd-tabs-sm-button-spacing: 8px;
  --dex-okd-tabs-sm-muted-font-size: 12px;
  --dex-okd-tabs-sm-muted-height: 36px;
  --dex-okd-tabs-sm-muted-label-padding: 12px;
  --dex-okd-tabs-sm-muted-spacing: 8px;
  --dex-okd-tabs-sm-segmented-font-size: 12px;
  --dex-okd-tabs-sm-segmented-height: 36px;
  --dex-okd-tabs-sm-segmented-label-padding: 12px;
  --dex-okd-tabs-sm-segmented-spacing: 2px;
  --dex-okd-tabs-sm-segmented-container-padding: 4px;
  --dex-okd-tabs-md-underline-font-size: 14px;
  --dex-okd-tabs-md-underline-height: 40px;
  --dex-okd-tabs-md-underline-label-padding: 0px;
  --dex-okd-tabs-md-underline-spacing: 24px;
  --dex-okd-tabs-md-common-icon-size: 16px;
  --dex-okd-tabs-md-button-font-size: 14px;
  --dex-okd-tabs-md-button-height: 40px;
  --dex-okd-tabs-md-button-label-padding: 12px;
  --dex-okd-tabs-md-button-spacing: 8px;
  --dex-okd-tabs-md-muted-font-size: 14px;
  --dex-okd-tabs-md-muted-height: 40px;
  --dex-okd-tabs-md-muted-label-padding: 12px;
  --dex-okd-tabs-md-muted-spacing: 8px;
  --dex-okd-tabs-md-segmented-font-size: 14px;
  --dex-okd-tabs-md-segmented-height: 40px;
  --dex-okd-tabs-md-segmented-label-padding: 12px;
  --dex-okd-tabs-md-segmented-spacing: 2px;
  --dex-okd-tabs-md-segmented-container-padding: 4px;
  --dex-okd-tabs-lg-underline-font-size: 14px;
  --dex-okd-tabs-lg-underline-height: 44px;
  --dex-okd-tabs-lg-underline-label-padding: 0px;
  --dex-okd-tabs-lg-underline-spacing: 24px;
  --dex-okd-tabs-lg-common-icon-size: 16px;
  --dex-okd-tabs-lg-button-font-size: 14px;
  --dex-okd-tabs-lg-button-height: 44px;
  --dex-okd-tabs-lg-button-label-padding: 12px;
  --dex-okd-tabs-lg-button-spacing: 8px;
  --dex-okd-tabs-lg-muted-font-size: 14px;
  --dex-okd-tabs-lg-muted-height: 44px;
  --dex-okd-tabs-lg-muted-label-padding: 12px;
  --dex-okd-tabs-lg-muted-spacing: 8px;
  --dex-okd-tabs-lg-segmented-font-size: 14px;
  --dex-okd-tabs-lg-segmented-height: 44px;
  --dex-okd-tabs-lg-segmented-label-padding: 12px;
  --dex-okd-tabs-lg-segmented-spacing: 2px;
  --dex-okd-tabs-lg-segmented-container-padding: 4px;
  --dex-okd-tabs-xl-common-icon-size: 18px;
  --dex-okd-tabs-xl-underline-font-size: 16px;
  --dex-okd-tabs-xl-underline-height: 48px;
  --dex-okd-tabs-xl-underline-label-padding: 0px;
  --dex-okd-tabs-xl-underline-spacing: 24px;
  --dex-okd-tabs-xl-button-font-size: 16px;
  --dex-okd-tabs-xl-button-height: 48px;
  --dex-okd-tabs-xl-button-label-padding: 16px;
  --dex-okd-tabs-xl-button-spacing: 8px;
  --dex-okd-tabs-xl-muted-font-size: 16px;
  --dex-okd-tabs-xl-muted-height: 48px;
  --dex-okd-tabs-xl-muted-label-padding: 16px;
  --dex-okd-tabs-xl-muted-spacing: 8px;
  --dex-okd-tabs-xl-segmented-font-size: 16px;
  --dex-okd-tabs-xl-segmented-height: 48px;
  --dex-okd-tabs-xl-segmented-label-padding: 16px;
  --dex-okd-tabs-xl-segmented-spacing: 2px;
  --dex-okd-tabs-xl-segmented-container-padding: 4px;
  --dex-okd-tabs-xxl-common-icon-size: 20px;
  --dex-okd-tabs-xxl-underline-font-size: 18px;
  --dex-okd-tabs-xxl-underline-height: 48px;
  --dex-okd-tabs-xxl-underline-label-padding: 0px;
  --dex-okd-tabs-xxl-underline-spacing: 24px;
  --dex-okd-tabs-xxl-button-font-size: 18px;
  --dex-okd-tabs-xxl-button-height: 48px;
  --dex-okd-tabs-xxl-button-label-padding: 16px;
  --dex-okd-tabs-xxl-button-spacing: 8px;
  --dex-okd-tabs-xxl-muted-font-size: 18px;
  --dex-okd-tabs-xxl-muted-height: 48px;
  --dex-okd-tabs-xxl-muted-label-padding: 16px;
  --dex-okd-tabs-xxl-muted-spacing: 8px;
  --dex-okd-tabs-xxl-segmented-font-size: 18px;
  --dex-okd-tabs-xxl-segmented-height: 48px;
  --dex-okd-tabs-xxl-segmented-label-padding: 16px;
  --dex-okd-tabs-xxl-segmented-spacing: 2px;
  --dex-okd-tabs-xxl-segmented-container-padding: 4px;
  --dex-okd-tabs-xxxl-common-icon-size: 20px;
  --dex-okd-tabs-xxxl-underline-font-size: 22px;
  --dex-okd-tabs-xxxl-underline-height: 56px;
  --dex-okd-tabs-xxxl-underline-label-padding: 0px;
  --dex-okd-tabs-xxxl-underline-spacing: 24px;
  --dex-okd-tabs-xxxl-button-font-size: 22px;
  --dex-okd-tabs-xxxl-button-height: 56px;
  --dex-okd-tabs-xxxl-button-label-padding: 16px;
  --dex-okd-tabs-xxxl-button-spacing: 8px;
  --dex-okd-tabs-xxxl-muted-font-size: 22px;
  --dex-okd-tabs-xxxl-muted-height: 56px;
  --dex-okd-tabs-xxxl-muted-label-padding: 16px;
  --dex-okd-tabs-xxxl-muted-spacing: 8px;
  --dex-okd-tabs-xxxl-segmented-font-size: 22px;
  --dex-okd-tabs-xxxl-segmented-height: 56px;
  --dex-okd-tabs-xxxl-segmented-label-padding: 16px;
  --dex-okd-tabs-xxxl-segmented-spacing: 2px;
  --dex-okd-tabs-xxxl-segmented-container-padding: 4px;
  --dex-okd-tabs-common-pane-nav-icon-bg-color-1: var(--dex-okd-color-background-base-primary);
  --dex-okd-tabs-common-pane-nav-icon-bg-color-2: var(--dex-okd-color-transparent-white);
  --dex-okd-tabs-button-pane-common-border-radius: 4px;
  --dex-okd-tabs-muted-pane-common-border-radius: 4px;
  --dex-okd-tabs-segmented-pane-common-border-radius: 8px;
  --dex-okd-tabs-xxxl-button-font-weight: 400;
  --dex-okd-tabs-lg-button-font-weight: 400;
  --dex-okd-tabs-lg-muted-font-weight: 400;
  --dex-okd-tabs-md-button-font-weight: 400;
  --dex-okd-tabs-md-muted-font-weight: 400;
  --dex-okd-tabs-xl-muted-font-weight: 400;
  --dex-okd-tabs-xl-button-font-weight: 400;
  --dex-okd-tabs-xxxl-muted-font-weight: 400;
  --dex-okd-tabs-xxl-muted-font-weight: 400;
  --dex-okd-tabs-xxl-button-font-weight: 400;
  --dex-okd-tabs-sm-button-font-weight: 400;
  --dex-okd-tabs-sm-muted-font-weight: 400;
  --dex-okd-tabs-xs-button-font-weight: 400;
  --dex-okd-tabs-xs-muted-font-weight: 400;
  --dex-okd-tabs-xs-segmented-font-weight: 400;
  --dex-okd-tabs-sm-segmented-font-weight: 500;
  --dex-okd-tabs-md-segmented-font-weight: 500;
  --dex-okd-tabs-lg-segmented-font-weight: 500;
  --dex-okd-tabs-xl-segmented-font-weight: 500;
  --dex-okd-tabs-xxl-segmented-font-weight: 500;
  --dex-okd-tabs-xxxl-segmented-font-weight: 500;
  --dex-okd-tabs-pane-fill-highlight-default-text-color: var(--dex-okd-color-content-contrast);
  --dex-okd-tabs-pane-fill-highlight-default-border-color: var(--dex-okd-color-transparent-white);
  --dex-okd-tabs-pane-fill-highlight-default-background-color: var(--dex-okd-color-background-surface-primary);
  --dex-okd-tabs-pane-fill-highlight-active-text-color: var(--dex-okd-color-content-inverse);
  --dex-okd-tabs-pane-fill-highlight-active-border-color: var(--dex-okd-color-transparent-black);
  --dex-okd-tabs-pane-fill-highlight-active-background-color: var(--dex-okd-color-container-inverse);
  --dex-okd-tabs-pane-fill-highlight-hover-text-color: var(--dex-okd-color-content-primary);
  --dex-okd-tabs-pane-fill-highlight-hover-border-color: var(--dex-okd-color-transparent-white);
  --dex-okd-tabs-pane-fill-highlight-hover-background-color: var(--dex-okd-color-background-surface-primary);
  --dex-okd-tabs-pane-fill-primary-default-text-color: var(--dex-okd-color-content-contrast);
  --dex-okd-tabs-pane-fill-primary-default-border-color: var(--dex-okd-color-transparent-white);
  --dex-okd-tabs-pane-fill-primary-default-background-color: var(--dex-okd-color-transparent-white);
  --dex-okd-tabs-pane-fill-primary-active-text-color: var(--dex-okd-color-content-primary);
  --dex-okd-tabs-pane-fill-primary-active-border-color: var(--dex-okd-color-transparent-white);
  --dex-okd-tabs-pane-fill-primary-active-background-color: #f3f3f3;
  --dex-okd-tabs-pane-fill-primary-hover-text-color: var(--dex-okd-color-content-primary);
  --dex-okd-tabs-pane-fill-primary-hover-border-color: var(--dex-okd-color-transparent-white);
  --dex-okd-tabs-pane-fill-primary-hover-background-color: transparent;
  --dex-okd-tabs-pane-fill-secondary-default-text-color: var(--dex-okd-color-content-contrast);
  --dex-okd-tabs-pane-fill-secondary-default-border-color: var(--dex-okd-color-transparent-white);
  --dex-okd-tabs-pane-fill-secondary-default-background-color: var(--dex-okd-color-background-surface-primary);
  --dex-okd-tabs-pane-fill-secondary-active-text-color: var(--dex-okd-color-content-primary);
  --dex-okd-tabs-pane-fill-secondary-active-border-color: var(--dex-okd-color-transparent-white);
  --dex-okd-tabs-pane-fill-secondary-active-background-color: #f3f3f3;
  --dex-okd-tabs-pane-fill-secondary-hover-text-color: var(--dex-okd-color-content-primary);
  --dex-okd-tabs-pane-fill-secondary-hover-border-color: var(--dex-okd-color-transparent-white);
  --dex-okd-tabs-pane-fill-secondary-hover-background-color: var(--dex-okd-color-background-surface-primary);
  --dex-okd-tabs-pane-outline-highlight-default-text-color: var(--dex-okd-color-content-contrast);
  --dex-okd-tabs-pane-outline-highlight-default-border-color: var(--dex-okd-color-border-primary);
  --dex-okd-tabs-pane-outline-highlight-default-background-color: var(--dex-okd-color-transparent-white);
  --dex-okd-tabs-pane-outline-highlight-active-text-color: var(--dex-okd-color-content-primary);
  --dex-okd-tabs-pane-outline-highlight-active-border-color: var(--dex-okd-color-border-selected);
  --dex-okd-tabs-pane-outline-highlight-active-background-color: var(--dex-okd-color-transparent-white);
  --dex-okd-tabs-pane-outline-highlight-hover-text-color: var(--dex-okd-color-content-primary);
  --dex-okd-tabs-pane-outline-highlight-hover-border-color: var(--dex-okd-color-border-primary);
  --dex-okd-tabs-pane-outline-highlight-hover-background-color: var(--dex-okd-color-background-surface-primary);
  --dex-okd-tabs-pane-outline-primary-default-text-color: var(--dex-okd-color-content-contrast);
  --dex-okd-tabs-pane-outline-primary-default-border-color: var(--dex-okd-color-transparent-white);
  --dex-okd-tabs-pane-outline-primary-default-background-color: var(--dex-okd-color-transparent-white);
  --dex-okd-tabs-pane-outline-primary-active-text-color: var(--dex-okd-color-content-primary);
  --dex-okd-tabs-pane-outline-primary-active-border-color: var(--dex-okd-color-border-selected);
  --dex-okd-tabs-pane-outline-primary-active-background-color: var(--dex-okd-color-transparent-white);
  --dex-okd-tabs-pane-outline-primary-hover-text-color: var(--dex-okd-color-content-primary);
  --dex-okd-tabs-pane-outline-primary-hover-border-color: var(--dex-okd-color-transparent-white);
  --dex-okd-tabs-pane-outline-primary-hover-background-color: var(--dex-okd-color-background-surface-primary);
  --dex-okd-tabs-pane-outline-secondary-default-text-color: var(--dex-okd-color-content-contrast);
  --dex-okd-tabs-pane-outline-secondary-default-border-color: var(--dex-okd-color-transparent-white);
  --dex-okd-tabs-pane-outline-secondary-default-background-color: var(--dex-okd-color-transparent-white);
  --dex-okd-tabs-pane-outline-secondary-active-text-color: var(--dex-okd-color-content-primary);
  --dex-okd-tabs-pane-outline-secondary-active-border-color: var(--dex-okd-color-border-secondary);
  --dex-okd-tabs-pane-outline-secondary-active-background-color: var(--dex-okd-color-transparent-white);
  --dex-okd-tabs-pane-outline-secondary-hover-text-color: var(--dex-okd-color-content-primary);
  --dex-okd-tabs-pane-outline-secondary-hover-border-color: var(--dex-okd-color-transparent-white);
  --dex-okd-tabs-pane-outline-secondary-hover-background-color: var(--dex-okd-color-background-surface-primary);
  --dex-okd-tabs-pane-text-highlight-default-text-color: var(--dex-okd-color-content-contrast);
  --dex-okd-tabs-pane-text-highlight-default-border-color: var(--dex-okd-color-transparent-white);
  --dex-okd-tabs-pane-text-highlight-default-background-color: var(--dex-okd-color-transparent-white);
  --dex-okd-tabs-pane-text-highlight-active-text-color: var(--dex-okd-color-content-primary);
  --dex-okd-tabs-pane-text-highlight-active-border-color: var(--dex-okd-color-transparent-white);
  --dex-okd-tabs-pane-text-highlight-active-background-color: var(--dex-okd-color-transparent-white);
  --dex-okd-tabs-pane-text-highlight-hover-text-color: var(--dex-okd-color-content-primary);
  --dex-okd-tabs-pane-text-highlight-hover-border-color: var(--dex-okd-color-transparent-white);
  --dex-okd-tabs-pane-text-highlight-hover-background-color: transparent;
  --dex-okd-tabs-pane-text-primary-default-text-color: var(--dex-okd-color-content-contrast);
  --dex-okd-tabs-pane-text-primary-default-border-color: var(--dex-okd-color-transparent-white);
  --dex-okd-tabs-pane-text-primary-default-background-color: var(--dex-okd-color-transparent-white);
  --dex-okd-tabs-pane-text-primary-active-text-color: var(--dex-okd-color-content-primary);
  --dex-okd-tabs-pane-text-primary-active-border-color: var(--dex-okd-color-transparent-white);
  --dex-okd-tabs-pane-text-primary-active-background-color: var(--dex-okd-color-transparent-white);
  --dex-okd-tabs-pane-text-primary-hover-text-color: var(--dex-okd-color-content-primary);
  --dex-okd-tabs-pane-text-primary-hover-border-color: var(--dex-okd-color-transparent-white);
  --dex-okd-tabs-pane-text-primary-hover-background-color: var(--dex-okd-color-background-surface-primary);
  --dex-okd-tabs-pane-text-secondary-default-text-color: var(--dex-okd-color-content-contrast);
  --dex-okd-tabs-pane-text-secondary-default-border-color: var(--dex-okd-color-transparent-white);
  --dex-okd-tabs-pane-text-secondary-default-background-color: var(--dex-okd-color-transparent-white);
  --dex-okd-tabs-pane-text-secondary-active-text-color: var(--dex-okd-color-content-primary);
  --dex-okd-tabs-pane-text-secondary-active-border-color: var(--dex-okd-color-transparent-white);
  --dex-okd-tabs-pane-text-secondary-active-background-color: var(--dex-okd-color-transparent-white);
  --dex-okd-tabs-pane-text-secondary-hover-text-color: var(--dex-okd-color-content-primary);
  --dex-okd-tabs-pane-text-secondary-hover-border-color: var(--dex-okd-color-transparent-white);
  --dex-okd-tabs-pane-text-secondary-hover-background-color: var(--dex-okd-color-background-surface-primary);
  --dex-okd-tabs-pane-xs-height: 24px;
  --dex-okd-tabs-pane-xs-font-size: 12px;
  --dex-okd-tabs-pane-xs-font-weight: 400;
  --dex-okd-tabs-pane-xs-active-font-weight: 500;
  --dex-okd-tabs-pane-xs-hover-font-weight: 400;
  --dex-okd-tabs-pane-xs-padding-vertical: 8px;
  --dex-okd-tabs-pane-xs-margin-right: 8px;
  --dex-okd-tabs-pane-xs-border-width: 1px;
  --dex-okd-tabs-pane-xs-border-radius: 4px;
  --dex-okd-tabs-pane-sm-height: 28px;
  --dex-okd-tabs-pane-sm-font-size: 12px;
  --dex-okd-tabs-pane-sm-font-weight: 400;
  --dex-okd-tabs-pane-sm-active-font-weight: 500;
  --dex-okd-tabs-pane-sm-hover-font-weight: 400;
  --dex-okd-tabs-pane-sm-padding-vertical: 8px;
  --dex-okd-tabs-pane-sm-margin-right: 8px;
  --dex-okd-tabs-pane-sm-border-width: 1px;
  --dex-okd-tabs-pane-sm-border-radius: 4px;
  --dex-okd-tabs-pane-md-height: 32px;
  --dex-okd-tabs-pane-md-font-size: 14px;
  --dex-okd-tabs-pane-md-font-weight: 400;
  --dex-okd-tabs-pane-md-active-font-weight: 500;
  --dex-okd-tabs-pane-md-hover-font-weight: 400;
  --dex-okd-tabs-pane-md-padding-vertical: 8px;
  --dex-okd-tabs-pane-md-margin-right: 8px;
  --dex-okd-tabs-pane-md-border-width: 1px;
  --dex-okd-tabs-pane-md-border-radius: 6px;
  --dex-okd-tabs-pane-lg-height: 36px;
  --dex-okd-tabs-pane-lg-font-size: 14px;
  --dex-okd-tabs-pane-lg-font-weight: 400;
  --dex-okd-tabs-pane-lg-active-font-weight: 500;
  --dex-okd-tabs-pane-lg-hover-font-weight: 400;
  --dex-okd-tabs-pane-lg-padding-vertical: 12px;
  --dex-okd-tabs-pane-lg-margin-right: 8px;
  --dex-okd-tabs-pane-lg-border-width: 1px;
  --dex-okd-tabs-pane-lg-border-radius: 6px;
  --dex-okd-tabs-pane-xl-height: 40px;
  --dex-okd-tabs-pane-xl-font-size: 14px;
  --dex-okd-tabs-pane-xl-font-weight: 400;
  --dex-okd-tabs-pane-xl-active-font-weight: 500;
  --dex-okd-tabs-pane-xl-hover-font-weight: 400;
  --dex-okd-tabs-pane-xl-padding-vertical: 16px;
  --dex-okd-tabs-pane-xl-margin-right: 8px;
  --dex-okd-tabs-pane-xl-border-width: 1px;
  --dex-okd-tabs-pane-xl-border-radius: 8px;
  --dex-okd-tabs-pane-xxl-height: 44px;
  --dex-okd-tabs-pane-xxl-font-size: 16px;
  --dex-okd-tabs-pane-xxl-font-weight: 400;
  --dex-okd-tabs-pane-xxl-active-font-weight: 500;
  --dex-okd-tabs-pane-xxl-hover-font-weight: 400;
  --dex-okd-tabs-pane-xxl-padding-vertical: 16px;
  --dex-okd-tabs-pane-xxl-margin-right: 8px;
  --dex-okd-tabs-pane-xxl-border-width: 1px;
  --dex-okd-tabs-pane-xxl-border-radius: 8px;
  --dex-okd-tabs-pane-xxxl-height: 50px;
  --dex-okd-tabs-pane-xxxl-font-size: 18px;
  --dex-okd-tabs-pane-xxxl-font-weight: 400;
  --dex-okd-tabs-pane-xxxl-active-font-weight: 500;
  --dex-okd-tabs-pane-xxxl-hover-font-weight: 400;
  --dex-okd-tabs-pane-xxxl-padding-vertical: 16px;
  --dex-okd-tabs-pane-xxxl-margin-right: 8px;
  --dex-okd-tabs-pane-xxxl-border-width: 1px;
  --dex-okd-tabs-pane-xxxl-border-radius: 8px;
  --dex-okd-tabs-xs-button-border-radius: 8px;
  --dex-okd-tabs-xs-muted-border-radius: 8px;
  --dex-okd-tabs-xs-segmented-border-radius: 6px;
  --dex-okd-tabs-sm-button-border-radius: 8px;
  --dex-okd-tabs-sm-muted-border-radius: 8px;
  --dex-okd-tabs-sm-segmented-border-radius: 4px;
  --dex-okd-tabs-md-button-border-radius: 8px;
  --dex-okd-tabs-md-muted-border-radius: 8px;
  --dex-okd-tabs-md-segmented-border-radius: 4px;
  --dex-okd-tabs-lg-button-border-radius: 8px;
  --dex-okd-tabs-lg-muted-border-radius: 8px;
  --dex-okd-tabs-lg-segmented-border-radius: 4px;
  --dex-okd-tabs-xl-button-border-radius: 8px;
  --dex-okd-tabs-xl-muted-border-radius: 8px;
  --dex-okd-tabs-xl-segmented-border-radius: 4px;
  --dex-okd-tabs-xxl-button-border-radius: 8px;
  --dex-okd-tabs-xxl-muted-border-radius: 8px;
  --dex-okd-tabs-xxl-segmented-border-radius: 4px;
  --dex-okd-tabs-xxxl-button-border-radius: 8px;
  --dex-okd-tabs-xxxl-muted-border-radius: 8px;
  --dex-okd-tabs-xxxl-segmented-border-radius: 4px;
  --dex-okd-tabs-xs-button-container-border-radius: 0px;
  --dex-okd-tabs-xs-muted-container-border-radius: 0px;
  --dex-okd-tabs-xs-segmented-container-border-radius: 8px;
  --dex-okd-tabs-sm-button-container-border-radius: 0px;
  --dex-okd-tabs-sm-muted-container-border-radius: 0px;
  --dex-okd-tabs-sm-segmented-container-border-radius: 8px;
  --dex-okd-tabs-md-button-container-border-radius: 0px;
  --dex-okd-tabs-md-muted-container-border-radius: 0px;
  --dex-okd-tabs-md-segmented-container-border-radius: 8px;
  --dex-okd-tabs-lg-button-container-border-radius: 0px;
  --dex-okd-tabs-lg-muted-container-border-radius: 0px;
  --dex-okd-tabs-lg-segmented-container-border-radius: 8px;
  --dex-okd-tabs-xl-button-container-border-radius: 0px;
  --dex-okd-tabs-xl-muted-container-border-radius: 0px;
  --dex-okd-tabs-xl-segmented-container-border-radius: 8px;
  --dex-okd-tabs-xxl-button-container-border-radius: 0px;
  --dex-okd-tabs-xxl-muted-container-border-radius: 0px;
  --dex-okd-tabs-xxl-segmented-container-border-radius: 8px;
  --dex-okd-tabs-xxxl-button-container-border-radius: 0px;
  --dex-okd-tabs-xxxl-muted-container-border-radius: 0px;
  --dex-okd-tabs-xxxl-segmented-container-border-radius: 8px;
  --dex-okd-tabs-xs-underline-font-weight: 500;
  --dex-okd-tabs-sm-underline-font-weight: 500;
  --dex-okd-tabs-md-underline-font-weight: 500;
  --dex-okd-tabs-lg-underline-font-weight: 500;
  --dex-okd-tabs-xl-underline-font-weight: 500;
  --dex-okd-tabs-xxl-underline-font-weight: 700;
  --dex-okd-tabs-xxxl-underline-font-weight: 700;
  --dex-okd-tabs-xxs-button-container-border-radius: 0px;
  --dex-okd-tabs-xxs-muted-container-border-radius: 0px;
  --dex-okd-tabs-xxs-segmented-container-border-radius: 8px;
  --dex-okd-tabs-xxs-button-border-radius: 8px;
  --dex-okd-tabs-xxs-muted-border-radius: 8px;
  --dex-okd-tabs-xxs-segmented-border-radius: 6px;
  --dex-okd-tabs-pane-xxs-height: 24px;
  --dex-okd-tabs-pane-xxs-font-size: 12px;
  --dex-okd-tabs-pane-xxs-font-weight: 400;
  --dex-okd-tabs-pane-xxs-active-font-weight: 500;
  --dex-okd-tabs-pane-xxs-hover-font-weight: 500;
  --dex-okd-tabs-pane-xxs-padding-vertical: 8px;
  --dex-okd-tabs-pane-xxs-margin-right: 8px;
  --dex-okd-tabs-pane-xxs-border-width: 1px;
  --dex-okd-tabs-pane-xxs-border-radius: 4px;
  --dex-okd-tabs-xxs-underline-font-size: 12px;
  --dex-okd-tabs-xxs-underline-font-weight: 500;
  --dex-okd-tabs-xxs-underline-label-padding: 0px;
  --dex-okd-tabs-xxs-underline-spacing: 16px;
  --dex-okd-tabs-xxs-common-icon-size: 12px;
  --dex-okd-tabs-xxs-button-font-size: 12px;
  --dex-okd-tabs-xxs-button-font-weight: 400;
  --dex-okd-tabs-xxs-button-height: 24px;
  --dex-okd-tabs-xxs-button-label-padding: 8px;
  --dex-okd-tabs-xxs-button-spacing: 8px;
  --dex-okd-tabs-xxs-muted-font-size: 12px;
  --dex-okd-tabs-xxs-muted-font-weight: 400;
  --dex-okd-tabs-xxs-muted-height: 24px;
  --dex-okd-tabs-xxs-muted-label-padding: 8px;
  --dex-okd-tabs-xxs-muted-spacing: 8px;
  --dex-okd-tabs-xxs-segmented-font-size: 12px;
  --dex-okd-tabs-xxs-segmented-font-weight: 400;
  --dex-okd-tabs-xxs-segmented-height: 24px;
  --dex-okd-tabs-xxs-segmented-label-padding: 8px;
  --dex-okd-tabs-xxs-segmented-spacing: 2px;
  --dex-okd-tabs-xxs-segmented-container-padding: 2px;
  --dex-okd-tabs-xxs-font-size: 12px;
  --dex-okd-tabs-xxs-icon-size: 12px;
  --dex-okd-tabs-xxs-height: 24px;
  --dex-okd-tabs-xxs-label-padding: 10px;
  --dex-okd-tabs-xxs-gutter-padding: 10px;
  --dex-okd-tabs-xxs-margin: 2px;
  --dex-okd-tabs-xxs-icon-width: 10px;
  --dex-okd-tabs-xxs-underline-height: 24px;
  --dex-okd-tabs-pane-fill-reversed-default-text-color: hsla(0, 0%, 100%, .5);
  --dex-okd-tabs-pane-fill-reversed-default-border-color: var(--dex-okd-color-transparent-white);
  --dex-okd-tabs-pane-fill-reversed-default-background-color: hsla(0, 0%, 100%, .15);
  --dex-okd-tabs-pane-fill-reversed-active-text-color: var(--dex-okd-color-content-primary);
  --dex-okd-tabs-pane-fill-reversed-active-border-color: var(--dex-okd-color-transparent-white);
  --dex-okd-tabs-pane-fill-reversed-active-background-color: var(--dex-okd-color-background-base-primary);
  --dex-okd-tabs-pane-fill-reversed-hover-text-color: var(--dex-okd-color-content-inverse);
  --dex-okd-tabs-pane-fill-reversed-hover-border-color: var(--dex-okd-color-transparent-white);
  --dex-okd-tabs-pane-fill-reversed-hover-background-color: hsla(0, 0%, 100%, .15);
  --dex-okd-tabs-pane-outline-reversed-default-text-color: hsla(0, 0%, 100%, .5);
  --dex-okd-tabs-pane-outline-reversed-default-border-color: hsla(0, 0%, 98%, .15);
  --dex-okd-tabs-pane-outline-reversed-default-background-color: var(--dex-okd-color-transparent-white);
  --dex-okd-tabs-pane-outline-reversed-active-text-color: var(--dex-okd-color-content-inverse);
  --dex-okd-tabs-pane-outline-reversed-active-border-color: var(--dex-okd-color-border-contrast);
  --dex-okd-tabs-pane-outline-reversed-active-background-color: var(--dex-okd-color-transparent-white);
  --dex-okd-tabs-pane-outline-reversed-hover-text-color: var(--dex-okd-color-content-inverse);
  --dex-okd-tabs-pane-outline-reversed-hover-border-color: hsla(0, 0%, 98%, .15);
  --dex-okd-tabs-pane-outline-reversed-hover-background-color: hsla(0, 0%, 100%, .15);
  --dex-okd-tabs-pane-text-reversed-default-text-color: hsla(0, 0%, 100%, .5);
  --dex-okd-tabs-pane-text-reversed-default-border-color: var(--dex-okd-color-transparent-white);
  --dex-okd-tabs-pane-text-reversed-default-background-color: var(--dex-okd-color-transparent-white);
  --dex-okd-tabs-pane-text-reversed-active-text-color: var(--dex-okd-color-content-inverse);
  --dex-okd-tabs-pane-text-reversed-active-border-color: var(--dex-okd-color-transparent-white);
  --dex-okd-tabs-pane-text-reversed-active-background-color: var(--dex-okd-color-transparent-white);
  --dex-okd-tabs-pane-text-reversed-hover-text-color: var(--dex-okd-color-content-inverse);
  --dex-okd-tabs-pane-text-reversed-hover-border-color: var(--dex-okd-color-transparent-white);
  --dex-okd-tabs-pane-text-reversed-hover-background-color: transparent;
  --dex-okd-tabs-xxs-underline-active-font-weight: 500;
  --dex-okd-tabs-xxs-button-active-font-weight: 500;
  --dex-okd-tabs-xxs-muted-active-font-weight: 500;
  --dex-okd-tabs-xxs-segmented-active-font-weight: 400;
  --dex-okd-tabs-xs-underline-active-font-weight: 500;
  --dex-okd-tabs-xs-button-active-font-weight: 500;
  --dex-okd-tabs-xs-muted-active-font-weight: 500;
  --dex-okd-tabs-xs-segmented-active-font-weight: 400;
  --dex-okd-tabs-sm-underline-active-font-weight: 500;
  --dex-okd-tabs-sm-button-active-font-weight: 500;
  --dex-okd-tabs-sm-muted-active-font-weight: 500;
  --dex-okd-tabs-sm-segmented-active-font-weight: 500;
  --dex-okd-tabs-md-underline-active-font-weight: 500;
  --dex-okd-tabs-md-button-active-font-weight: 500;
  --dex-okd-tabs-md-muted-active-font-weight: 500;
  --dex-okd-tabs-md-segmented-active-font-weight: 500;
  --dex-okd-tabs-lg-underline-active-font-weight: 500;
  --dex-okd-tabs-lg-button-active-font-weight: 500;
  --dex-okd-tabs-lg-muted-active-font-weight: 500;
  --dex-okd-tabs-lg-segmented-active-font-weight: 500;
  --dex-okd-tabs-xl-underline-active-font-weight: 500;
  --dex-okd-tabs-xl-button-active-font-weight: 500;
  --dex-okd-tabs-xl-muted-active-font-weight: 500;
  --dex-okd-tabs-xl-segmented-active-font-weight: 500;
  --dex-okd-tabs-xxl-underline-active-font-weight: 700;
  --dex-okd-tabs-xxl-button-active-font-weight: 500;
  --dex-okd-tabs-xxl-muted-active-font-weight: 500;
  --dex-okd-tabs-xxl-segmented-active-font-weight: 500;
  --dex-okd-tabs-xxxl-underline-active-font-weight: 700;
  --dex-okd-tabs-xxxl-button-active-font-weight: 500;
  --dex-okd-tabs-xxxl-muted-active-font-weight: 500;
  --dex-okd-tabs-xxxl-segmented-active-font-weight: 500;
  --dex-okd-tabs-xxs-underline-border-width: 2px;
  --dex-okd-tabs-xs-underline-border-width: 2px;
  --dex-okd-tabs-sm-underline-border-width: 2px;
  --dex-okd-tabs-md-underline-border-width: 2px;
  --dex-okd-tabs-lg-underline-border-width: 2px;
  --dex-okd-tabs-xl-underline-border-width: 2px;
  --dex-okd-tabs-xxl-underline-border-width: 2px;
  --dex-okd-tabs-xxxl-underline-border-width: 2px
}

.theme-light .dex-dialog-var,
.theme-light.dex-dialog-var {
  --dex-okd-dialog-window-background: var(--dex-okd-color-modal-primary);
  --dex-okd-dialog-window-mask-color: var(--dex-okd-color-background-scrim);
  --dex-okd-dialog-window-box-shadow: var(--dex-okd-shadow-xl);
  --dex-okd-dialog-window-default-text-color: var(--dex-okd-color-content-primary);
  --dex-okd-dialog-window-border-radius: 8px;
  --dex-okd-dialog-window-close-btn-color: var(--dex-okd-color-content-contrast);
  --dex-okd-dialog-window-close-size: 32px;
  --dex-okd-dialog-window-split-line-border-color: var(--dex-okd-color-border-primary);
  --dex-okd-dialog-tip-window-min-width: 344px;
  --dex-okd-dialog-tip-window-2btn-min-width: 448px;
  --dex-okd-dialog-title-color: var(--dex-okd-color-content-primary);
  --dex-okd-dialog-title-font-size: 16px;
  --dex-okd-dialog-title-line-height: 20px;
  --dex-okd-dialog-title-box-sm-padding-vertical: 14px;
  --dex-okd-dialog-title-box-md-padding-vertical: 12px;
  --dex-okd-dialog-sub-title-color: var(--dex-okd-color-content-contrast);
  --dex-okd-dialog-sub-title-font-size: 14px;
  --dex-okd-dialog-sub-title-line-height: 16px;
  --dex-okd-dialog-tip-title-color: #000;
  --dex-okd-dialog-tip-title-font-size: 18px;
  --dex-okd-dialog-tip-title-line-height: 24px;
  --dex-okd-dialog-tip-detail-color: #3d3d3d;
  --dex-okd-dialog-tip-detail-font-size: 14px;
  --dex-okd-dialog-tip-detail-line-height: 20px;
  --dex-okd-dialog-tip-success-icon-bg: var(--dex-okd-color-semantic-positive);
  --dex-okd-dialog-tip-info-icon-bg: var(--dex-okd-color-semantic-neutral);
  --dex-okd-dialog-tip-prompt-icon-bg: rgba(241, 101, 20, .2);
  --dex-okd-dialog-tip-warn-icon-bg: var(--dex-okd-color-semantic-notice);
  --dex-okd-dialog-tip-alert-icon-bg: rgba(241, 80, 123, .2);
  --dex-okd-dialog-tip-error-icon-bg: var(--dex-okd-color-semantic-negative);
  --dex-okd-dialog-tip-success-icon-color: var(--dex-okd-color-semantic-positive);
  --dex-okd-dialog-tip-info-icon-color: var(--dex-okd-color-semantic-neutral);
  --dex-okd-dialog-tip-prompt-icon-color: #f16514;
  --dex-okd-dialog-tip-warn-icon-color: var(--dex-okd-color-semantic-notice);
  --dex-okd-dialog-tip-alert-icon-color: #f1507b;
  --dex-okd-dialog-tip-error-icon-color: var(--dex-okd-color-semantic-negative);
  --dex-okd-dialog-tip-icon-bg-size: 48px;
  --dex-okd-dialog-tip-icon-font-size: 48px;
  --dex-okd-dialog-action-close-btn-color: #0569ff;
  --dex-okd-dialog-footer-box-sm-padding-vertical: 20px;
  --dex-okd-dialog-footer-box-md-padding-vertical: 12px;
  --dex-okd-dialog-tip-footer-box-sm-padding-vertical: 16px;
  --dex-okd-dialog-tip-footer-box-md-padding-vertical: 24px;
  --dex-okd-dialog-container-sm-padding-horizontal: 16px;
  --dex-okd-dialog-container-md-padding-horizontal: 24px;
  --dex-okd-dialog-container-md-padding-vertical: 24px;
  --dex-okd-dialog-container-sm-padding-vertical: 16px;
  --dex-okd-dialog-window-close-icon-size: 24px;
  --dex-okd-dialog-window-back-icon-size: 24px;
  --dex-okd-dialog-tip-container-md-padding-top: 28px;
  --dex-okd-dialog-tip-container-md-padding-bottom: 24px;
  --dex-okd-dialog-tip-container-sm-padding-top: 20px;
  --dex-okd-dialog-tip-container-sm-padding-bottom: 24px;
  --dex-okd-dialog-window-action-padding: 16px;
  --dex-okd-dialog-footer-action-cancel-type: secondary;
  --dex-okd-dialog-footer-action-confirm-type: highlight;
  --dex-okd-dialog-footer-action-cancel-size: sm;
  --dex-okd-dialog-footer-action-confirm-size: sm;
  --dex-okd-dialog-window-sm-border-radius: 12px;
  --dex-okd-dialog-title-font-weight: 700;
  --dex-okd-dialog-footer-btn-full-sm-margin-top: 8px;
  --dex-okd-dialog-footer-btn-md-margin-left: 12px;
  --dex-okd-dialog-footer-btn-sm-margin-left: 12px;
  --dex-okd-dialog-confirm-footer-sm-button-border-color: var(--dex-okd-color-border-primary);
  --dex-okd-dialog-confirm-footer-padding-top: 0;
  --dex-okd-dialog-confirm-footer-padding-bottom: 24px;
  --dex-okd-dialog-confirm-title-padding-top: 24px;
  --dex-okd-dialog-confirm-no-title-padding-top: 24px;
  --dex-okd-dialog-confirm-title-padding-bottom: 0px;
  --dex-okd-dialog-confirm-max-width: 520px;
  --dex-okd-dialog-confirm-min-width: 280px;
  --dex-okd-dialog-confirm-container-color: var(--dex-okd-color-content-secondary);
  --dex-okd-dialog-confirm-container-line-height: 20px;
  --dex-okd-dialog-confirm-container-font-size: 14px;
  --dex-okd-dialog-confirm-container-sm-padding-bottom: 24px;
  --dex-okd-dialog-confirm-icon-font-size: 22px;
  --dex-okd-dialog-confirm-icon-margin-right: 10px;
  --dex-okd-dialog-confirm-icon-line-height: 22px;
  --dex-okd-dialog-title-icon-close-color: var(--dex-okd-color-content-contrast);
  --dex-okd-dialog-title-icon-back-color: var(--dex-okd-color-content-primary);
  --dex-okd-dialog-title-icon-close-hover-color: var(--dex-okd-color-content-primary);
  --dex-okd-dialog-title-icon-hover-background-color: hsla(0, 0%, 95%, 0);
  --dex-okd-dialog-title-icon-hover-border-radius: 4px;
  --dex-okd-dialog-title-icon-close-margin-left: 32px;
  --dex-okd-dialog-title-icon-back-margin-right: 8px;
  --dex-okd-dialog-window-back-btn-color: var(--dex-okd-color-container-inverse);
  --dex-okd-dialog-window-back-btn-margin-right: 12px;
  --dex-okd-dialog-window-close-btn-margin-left: 12px;
  --dex-okd-dialog-confirm-container-sm-padding-top: 8px;
  --dex-okd-dialog-confirm-container-sm-padding-horizontal: 24px;
  --dex-okd-dialog-confirm-title-padding-horizontal: 24px;
  --dex-okd-dialog-footer-box-sm-padding-top: 12px;
  --dex-okd-dialog-footer-box-sm-padding-bottom: 20px;
  --dex-okd-dialog-confirmation-header-padding-top: 24px;
  --dex-okd-dialog-confirmation-footer-padding-bottom: 24px;
  --dex-okd-dialog-confirmation-padding-left: 24px;
  --dex-okd-dialog-confirmation-padding-right: 24px;
  --dex-okd-dialog-confirmation-container-padding-top: 32px;
  --dex-okd-dialog-confirmation-container-padding-bottom: 32px;
  --dex-okd-dialog-confirm-footer-sm-button-color: var(--dex-okd-color-content-primary);
  --dex-okd-dialog-window-min-width: 392px;
  --dex-okd-dialog-confirm-container-padding-top: 32px;
  --dex-okd-dialog-confirm-container-padding-bottom: 32px;
  --dex-okd-dialog-confirm-window-background: var(--dex-okd-color-modal-tertiary);
  --dex-okd-dialog-confirmation-window-background: var(--dex-okd-color-modal-primary);
  --dex-okd-dialog-window-border-color: var(--dex-okd-color-border-primary)
}

.theme-dark .dex-tabs-var,
.theme-dark.dex-tabs-var {
  --dex-okd-tabs-pane-bg-color: transparent;
  --dex-okd-tabs-pane-label-color: #e3e3e3;
  --dex-okd-tabs-pane-label-active-color: #fafafa;
  --dex-okd-tabs-pane-icon-color: #e3e3e3;
  --dex-okd-tabs-pane-icon-active-color: #fafafa;
  --dex-okd-tabs-pane-icon-bg-color: #404040;
  --dex-okd-tabs-pane-slot-bg-color: transparent;
  --dex-okd-tabs-pane-active-color: #4283ff;
  --dex-okd-tabs-pane-background-color: #404040;
  --dex-okd-tabs-pane-nav-shadow-color: #909090;
  --dex-okd-green-color: #d2f7de;
  --dex-okd-red-color: #fff8f9;
  --dex-okd-tabs-underline-pane-list-border-color: var(--dex-okd-tabs-pane-nav-shadow-color);
  --dex-okd-tabs-underline-pane-list-bg-color: var(--dex-okd-tabs-pane-nav-shadow-color);
  --dex-okd-tabs-underline-pane-blue-label-active-color: var(--dex-okd-color-content-primary);
  --dex-okd-tabs-underline-pane-blue-border-active-color: var(--dex-okd-color-border-selected);
  --dex-okd-tabs-underline-pane-green-border-active-color: var(--dex-okd-color-border-pnl-profit-default);
  --dex-okd-tabs-underline-pane-green-label-active-color: var(--dex-okd-color-content-pnl-profit-default);
  --dex-okd-tabs-underline-pane-red-border-active-color: var(--dex-okd-color-border-pnl-loss-default);
  --dex-okd-tabs-underline-pane-red-label-active-color: var(--dex-okd-color-content-pnl-loss-default);
  --dex-okd-tabs-underline-pane-grey-border-active-color: var(--dex-okd-color-border-selected);
  --dex-okd-tabs-underline-pane-grey-label-active-color: var(--dex-okd-color-content-primary);
  --dex-okd-tabs-segmented-pane-bg-color: transparent;
  --dex-okd-tabs-segmented-pane-green-bg-active-color: var(--dex-okd-color-surface-pnl-profit-emphasis);
  --dex-okd-tabs-segmented-pane-green-label-active-color: var(--dex-okd-color-content-pnl-profit-oncolor-emphasis);
  --dex-okd-tabs-segmented-pane-red-bg-active-color: var(--dex-okd-color-surface-pnl-loss-emphasis);
  --dex-okd-tabs-segmented-pane-red-label-active-color: var(--dex-okd-color-content-pnl-loss-oncolor-emphasis);
  --dex-okd-tabs-segmented-pane-blue-bg-active-color: var(--dex-okd-color-background-surface-pressed);
  --dex-okd-tabs-segmented-pane-blue-label-active-color: #fff;
  --dex-okd-tabs-segmented-pane-grey-bg-active-color: #383838;
  --dex-okd-tabs-segmented-pane-grey-label-active-color: var(--dex-okd-color-content-primary);
  --segmented-pane-label-active-color: var(--dex-okd-tabs-pane-icon-active-color);
  --dex-okd-tabs-segmented-pane-bg-shadow-color: 0px 2px 4px -1px #0000000f, 0px 4px 6px -1px #0000001a;
  --dex-okd-tabs-segmented-pane-list-bg-color: #2e2e2e;
  --dex-okd-tabs-muted-pane-border-color: #b0b0b0;
  --dex-okd-tabs-muted-pane-blue-border-active-color: var(--dex-okd-color-border-secondary);
  --dex-okd-tabs-muted-pane-blue-label-active-color: var(--dex-okd-color-content-secondary);
  --dex-okd-tabs-muted-pane-green-border-active-color: var(--dex-okd-color-border-pnl-profit-default);
  --dex-okd-tabs-muted-pane-green-label-active-color: var(--dex-okd-color-content-pnl-profit-default);
  --dex-okd-tabs-muted-pane-red-border-active-color: var(--dex-okd-color-border-pnl-loss-graph);
  --dex-okd-tabs-muted-pane-red-label-active-color: var(--dex-okd-color-content-pnl-loss-default);
  --dex-okd-tabs-muted-pane-grey-border-active-color: var(--dex-okd-color-border-secondary);
  --dex-okd-tabs-muted-pane-grey-label-active-color: var(--dex-okd-color-content-secondary);
  --dex-okd-tabs-button-pane-bg-color: transparent;
  --dex-okd-tabs-button-pane-border-color: #b0b0b0;
  --dex-okd-tabs-button-pane-blue-bg-active-color: var(--dex-okd-color-background-surface-primary);
  --dex-okd-tabs-button-pane-blue-label-active-color: var(--dex-okd-color-content-primary);
  --dex-okd-tabs-button-pane-green-bg-active-color: var(--dex-okd-color-surface-pnl-profit-emphasis);
  --dex-okd-tabs-button-pane-green-label-active-color: var(--dex-okd-color-content-pnl-profit-oncolor-emphasis);
  --dex-okd-tabs-button-pane-red-bg-active-color: var(--dex-okd-color-surface-pnl-loss-emphasis);
  --dex-okd-tabs-button-pane-red-label-active-color: var(--dex-okd-color-content-pnl-loss-oncolor-emphasis);
  --dex-okd-tabs-button-pane-grey-bg-active-color: #1d1d1d;
  --dex-okd-tabs-button-pane-grey-label-active-color: var(--dex-okd-color-content-primary);
  --dex-okd-tabs-lg-font-size: var(--dex-okd-font-size-md);
  --dex-okd-tabs-md-font-size: var(--dex-okd-font-size-md);
  --dex-okd-tabs-sm-font-size: var(--dex-okd-font-size-xs);
  --dex-okd-tabs-xs-font-size: var(--dex-okd-font-size-xs);
  --dex-okd-tabs-lg-icon-size: 16px;
  --dex-okd-tabs-md-icon-size: 16px;
  --dex-okd-tabs-sm-icon-size: 14px;
  --dex-okd-tabs-xs-icon-size: 14px;
  --dex-okd-tabs-lg-height: 44px;
  --dex-okd-tabs-md-height: 40px;
  --dex-okd-tabs-sm-height: 36px;
  --dex-okd-tabs-xs-height: 28px;
  --dex-okd-tabs-lg-label-padding: 16px;
  --dex-okd-tabs-md-label-padding: 16px;
  --dex-okd-tabs-sm-label-padding: 10px;
  --dex-okd-tabs-xs-label-padding: 10px;
  --dex-okd-tabs-lg-gutter-padding: 4px;
  --dex-okd-tabs-md-gutter-padding: 4px;
  --dex-okd-tabs-sm-gutter-padding: 3px;
  --dex-okd-tabs-xs-gutter-padding: 3px;
  --dex-okd-tabs-lg-margin: 16px;
  --dex-okd-tabs-md-margin: 12px;
  --dex-okd-tabs-sm-margin: 8px;
  --dex-okd-tabs-xs-margin: 8px;
  --dex-okd-tabs-lg-icon-width: 10px;
  --dex-okd-tabs-md-icon-width: 10px;
  --dex-okd-tabs-sm-icon-width: 8px;
  --dex-okd-tabs-xs-icon-width: 8px;
  --dex-okd-tabs-underline-pane-common-border-color: var(--dex-okd-color-border-primary);
  --dex-okd-tabs-underline-pane-common-bg-color: var(--dex-okd-color-border-primary);
  --dex-okd-tabs-button-pane-common-border-color: var(--dex-okd-color-border-primary);
  --dex-okd-tabs-muted-pane-common-border-color: var(--dex-okd-color-transparent-white);
  --dex-okd-tabs-segmented-pane-common-list-bg-color: #1d1d1d;
  --dex-okd-tabs-common-pane-icon-color: var(--dex-okd-color-content-contrast);
  --dex-okd-tabs-common-pane-icon-active-color: var(--dex-okd-color-content-secondary);
  --dex-okd-tabs-common-pane-icon-bg-color: var(--dex-okd-color-content-inverse);
  --dex-okd-tabs-common-pane-label-color: var(--dex-okd-color-content-contrast);
  --dex-okd-tabs-common-pane-nav-shadow-color: var(--dex-okd-color-content-contrast);
  --dex-okd-tabs-segmented-pane-common-shadow: 0px 0px 0px 0px #0000001a;
  --dex-okd-tabs-button-pane-common-bg-color: var(--dex-okd-color-transparent-white);
  --dex-okd-tabs-underline-pane-common-label-color: var(--dex-okd-color-content-contrast);
  --dex-okd-tabs-button-pane-common-label-color: var(--dex-okd-color-content-contrast);
  --dex-okd-tabs-muted-pane-common-label-color: var(--dex-okd-color-content-contrast);
  --dex-okd-tabs-segmented-pane-common-bg-color: var(--dex-okd-color-transparent-white);
  --dex-okd-tabs-segmented-pane-common-label-color: var(--dex-okd-color-content-contrast);
  --dex-okd-tabs-xs-underline-font-size: 12px;
  --dex-okd-tabs-xs-underline-height: 28px;
  --dex-okd-tabs-xs-underline-label-padding: 0px;
  --dex-okd-tabs-xs-underline-spacing: 24px;
  --dex-okd-tabs-xs-common-icon-size: 14px;
  --dex-okd-tabs-xs-button-font-size: 12px;
  --dex-okd-tabs-xs-button-height: 28px;
  --dex-okd-tabs-xs-button-label-padding: 8px;
  --dex-okd-tabs-xs-button-spacing: 8px;
  --dex-okd-tabs-xs-muted-font-size: 12px;
  --dex-okd-tabs-xs-muted-height: 28px;
  --dex-okd-tabs-xs-muted-label-padding: 8px;
  --dex-okd-tabs-xs-muted-spacing: 8px;
  --dex-okd-tabs-xs-segmented-font-size: 12px;
  --dex-okd-tabs-xs-segmented-height: 28px;
  --dex-okd-tabs-xs-segmented-label-padding: 8px;
  --dex-okd-tabs-xs-segmented-spacing: 2px;
  --dex-okd-tabs-xs-segmented-container-padding: 2px;
  --dex-okd-tabs-sm-underline-height: 36px;
  --dex-okd-tabs-sm-underline-font-size: 12px;
  --dex-okd-tabs-sm-underline-label-padding: 0px;
  --dex-okd-tabs-sm-underline-spacing: 24px;
  --dex-okd-tabs-sm-common-icon-size: 14px;
  --dex-okd-tabs-sm-button-font-size: 12px;
  --dex-okd-tabs-sm-button-height: 36px;
  --dex-okd-tabs-sm-button-label-padding: 12px;
  --dex-okd-tabs-sm-button-spacing: 8px;
  --dex-okd-tabs-sm-muted-font-size: 12px;
  --dex-okd-tabs-sm-muted-height: 36px;
  --dex-okd-tabs-sm-muted-label-padding: 12px;
  --dex-okd-tabs-sm-muted-spacing: 8px;
  --dex-okd-tabs-sm-segmented-font-size: 12px;
  --dex-okd-tabs-sm-segmented-height: 36px;
  --dex-okd-tabs-sm-segmented-label-padding: 12px;
  --dex-okd-tabs-sm-segmented-spacing: 2px;
  --dex-okd-tabs-sm-segmented-container-padding: 4px;
  --dex-okd-tabs-md-underline-font-size: 14px;
  --dex-okd-tabs-md-underline-height: 40px;
  --dex-okd-tabs-md-underline-label-padding: 0px;
  --dex-okd-tabs-md-underline-spacing: 24px;
  --dex-okd-tabs-md-common-icon-size: 16px;
  --dex-okd-tabs-md-button-font-size: 14px;
  --dex-okd-tabs-md-button-height: 40px;
  --dex-okd-tabs-md-button-label-padding: 12px;
  --dex-okd-tabs-md-button-spacing: 8px;
  --dex-okd-tabs-md-muted-font-size: 14px;
  --dex-okd-tabs-md-muted-height: 40px;
  --dex-okd-tabs-md-muted-label-padding: 12px;
  --dex-okd-tabs-md-muted-spacing: 12px;
  --dex-okd-tabs-md-segmented-font-size: 14px;
  --dex-okd-tabs-md-segmented-height: 40px;
  --dex-okd-tabs-md-segmented-label-padding: 12px;
  --dex-okd-tabs-md-segmented-spacing: 2px;
  --dex-okd-tabs-md-segmented-container-padding: 4px;
  --dex-okd-tabs-lg-underline-font-size: 14px;
  --dex-okd-tabs-lg-underline-height: 44px;
  --dex-okd-tabs-lg-underline-label-padding: 0px;
  --dex-okd-tabs-lg-underline-spacing: 24px;
  --dex-okd-tabs-lg-common-icon-size: 16px;
  --dex-okd-tabs-lg-button-font-size: 14px;
  --dex-okd-tabs-lg-button-height: 44px;
  --dex-okd-tabs-lg-button-label-padding: 12px;
  --dex-okd-tabs-lg-button-spacing: 8px;
  --dex-okd-tabs-lg-muted-font-size: 14px;
  --dex-okd-tabs-lg-muted-height: 44px;
  --dex-okd-tabs-lg-muted-label-padding: 12px;
  --dex-okd-tabs-lg-muted-spacing: 8px;
  --dex-okd-tabs-lg-segmented-font-size: 14px;
  --dex-okd-tabs-lg-segmented-height: 44px;
  --dex-okd-tabs-lg-segmented-label-padding: 12px;
  --dex-okd-tabs-lg-segmented-spacing: 2px;
  --dex-okd-tabs-lg-segmented-container-padding: 4px;
  --dex-okd-tabs-xl-common-icon-size: 18px;
  --dex-okd-tabs-xl-underline-font-size: 16px;
  --dex-okd-tabs-xl-underline-height: 48px;
  --dex-okd-tabs-xl-underline-label-padding: 0px;
  --dex-okd-tabs-xl-underline-spacing: 24px;
  --dex-okd-tabs-xl-button-font-size: 16px;
  --dex-okd-tabs-xl-button-height: 48px;
  --dex-okd-tabs-xl-button-label-padding: 16px;
  --dex-okd-tabs-xl-button-spacing: 8px;
  --dex-okd-tabs-xl-muted-font-size: 16px;
  --dex-okd-tabs-xl-muted-height: 48px;
  --dex-okd-tabs-xl-muted-label-padding: 16px;
  --dex-okd-tabs-xl-muted-spacing: 8px;
  --dex-okd-tabs-xl-segmented-font-size: 16px;
  --dex-okd-tabs-xl-segmented-height: 48px;
  --dex-okd-tabs-xl-segmented-label-padding: 16px;
  --dex-okd-tabs-xl-segmented-spacing: 2px;
  --dex-okd-tabs-xl-segmented-container-padding: 4px;
  --dex-okd-tabs-xxl-common-icon-size: 20px;
  --dex-okd-tabs-xxl-underline-font-size: 18px;
  --dex-okd-tabs-xxl-underline-height: 48px;
  --dex-okd-tabs-xxl-underline-label-padding: 0px;
  --dex-okd-tabs-xxl-underline-spacing: 24px;
  --dex-okd-tabs-xxl-button-font-size: 18px;
  --dex-okd-tabs-xxl-button-height: 48px;
  --dex-okd-tabs-xxl-button-label-padding: 16px;
  --dex-okd-tabs-xxl-button-spacing: 8px;
  --dex-okd-tabs-xxl-muted-font-size: 18px;
  --dex-okd-tabs-xxl-muted-height: 48px;
  --dex-okd-tabs-xxl-muted-label-padding: 16px;
  --dex-okd-tabs-xxl-muted-spacing: 8px;
  --dex-okd-tabs-xxl-segmented-font-size: 18px;
  --dex-okd-tabs-xxl-segmented-height: 48px;
  --dex-okd-tabs-xxl-segmented-label-padding: 16px;
  --dex-okd-tabs-xxl-segmented-spacing: 2px;
  --dex-okd-tabs-xxl-segmented-container-padding: 4px;
  --dex-okd-tabs-xxxl-common-icon-size: 20px;
  --dex-okd-tabs-xxxl-underline-font-size: 22px;
  --dex-okd-tabs-xxxl-underline-height: 56px;
  --dex-okd-tabs-xxxl-underline-label-padding: 0px;
  --dex-okd-tabs-xxxl-underline-spacing: 24px;
  --dex-okd-tabs-xxxl-button-font-size: 22px;
  --dex-okd-tabs-xxxl-button-height: 56px;
  --dex-okd-tabs-xxxl-button-label-padding: 16px;
  --dex-okd-tabs-xxxl-button-spacing: 8px;
  --dex-okd-tabs-xxxl-muted-font-size: 22px;
  --dex-okd-tabs-xxxl-muted-height: 56px;
  --dex-okd-tabs-xxxl-muted-label-padding: 16px;
  --dex-okd-tabs-xxxl-muted-spacing: 8px;
  --dex-okd-tabs-xxxl-segmented-font-size: 22px;
  --dex-okd-tabs-xxxl-segmented-height: 56px;
  --dex-okd-tabs-xxxl-segmented-label-padding: 16px;
  --dex-okd-tabs-xxxl-segmented-spacing: 2px;
  --dex-okd-tabs-xxxl-segmented-container-padding: 4px;
  --dex-okd-tabs-common-pane-nav-icon-bg-color-1: var(--dex-okd-color-background-base-primary);
  --dex-okd-tabs-common-pane-nav-icon-bg-color-2: var(--dex-okd-color-transparent-white);
  --dex-okd-tabs-button-pane-common-border-radius: 4px;
  --dex-okd-tabs-muted-pane-common-border-radius: 4px;
  --dex-okd-tabs-segmented-pane-common-border-radius: 8px;
  --dex-okd-tabs-xxxl-button-font-weight: 400;
  --dex-okd-tabs-xxl-button-font-weight: 400;
  --dex-okd-tabs-xl-button-font-weight: 400;
  --dex-okd-tabs-lg-button-font-weight: 400;
  --dex-okd-tabs-md-button-font-weight: 400;
  --dex-okd-tabs-xs-button-font-weight: 400;
  --dex-okd-tabs-xs-muted-font-weight: 400;
  --dex-okd-tabs-xs-segmented-font-weight: 500;
  --dex-okd-tabs-sm-segmented-font-weight: 500;
  --dex-okd-tabs-sm-muted-font-weight: 400;
  --dex-okd-tabs-sm-button-font-weight: 400;
  --dex-okd-tabs-md-muted-font-weight: 400;
  --dex-okd-tabs-md-segmented-font-weight: 500;
  --dex-okd-tabs-lg-muted-font-weight: 400;
  --dex-okd-tabs-lg-segmented-font-weight: 500;
  --dex-okd-tabs-xl-muted-font-weight: 400;
  --dex-okd-tabs-xl-segmented-font-weight: 500;
  --dex-okd-tabs-xxl-segmented-font-weight: 500;
  --dex-okd-tabs-xxl-muted-font-weight: 400;
  --dex-okd-tabs-xxxl-segmented-font-weight: 500;
  --dex-okd-tabs-xxxl-muted-font-weight: 400;
  --dex-okd-tabs-pane-fill-primary-default-text-color: var(--dex-okd-color-content-contrast);
  --dex-okd-tabs-pane-fill-primary-default-border-color: var(--dex-okd-color-transparent-white);
  --dex-okd-tabs-pane-fill-primary-default-background-color: var(--dex-okd-color-transparent-white);
  --dex-okd-tabs-pane-fill-primary-active-text-color: var(--dex-okd-color-content-primary);
  --dex-okd-tabs-pane-fill-primary-active-border-color: var(--dex-okd-color-transparent-white);
  --dex-okd-tabs-pane-fill-primary-active-background-color: #1d1d1d;
  --dex-okd-tabs-pane-fill-primary-hover-text-color: var(--dex-okd-color-content-primary);
  --dex-okd-tabs-pane-fill-primary-hover-border-color: var(--dex-okd-color-transparent-white);
  --dex-okd-tabs-pane-fill-primary-hover-background-color: transparent;
  --dex-okd-tabs-pane-fill-highlight-default-text-color: var(--dex-okd-color-content-contrast);
  --dex-okd-tabs-pane-fill-highlight-default-border-color: var(--dex-okd-color-transparent-white);
  --dex-okd-tabs-pane-fill-highlight-default-background-color: var(--dex-okd-color-background-surface-primary);
  --dex-okd-tabs-pane-fill-highlight-active-text-color: var(--dex-okd-color-content-inverse);
  --dex-okd-tabs-pane-fill-highlight-active-border-color: var(--dex-okd-color-transparent-black);
  --dex-okd-tabs-pane-fill-highlight-active-background-color: var(--dex-okd-color-container-inverse);
  --dex-okd-tabs-pane-fill-highlight-hover-text-color: var(--dex-okd-color-content-primary);
  --dex-okd-tabs-pane-fill-highlight-hover-border-color: var(--dex-okd-color-transparent-white);
  --dex-okd-tabs-pane-fill-highlight-hover-background-color: var(--dex-okd-color-background-surface-primary);
  --dex-okd-tabs-pane-fill-secondary-default-text-color: var(--dex-okd-color-content-contrast);
  --dex-okd-tabs-pane-fill-secondary-default-border-color: var(--dex-okd-color-transparent-white);
  --dex-okd-tabs-pane-fill-secondary-default-background-color: var(--dex-okd-color-background-surface-primary);
  --dex-okd-tabs-pane-fill-secondary-active-text-color: var(--dex-okd-color-content-primary);
  --dex-okd-tabs-pane-fill-secondary-active-border-color: var(--dex-okd-color-transparent-white);
  --dex-okd-tabs-pane-fill-secondary-hover-background-color: var(--dex-okd-color-background-surface-primary);
  --dex-okd-tabs-pane-fill-secondary-hover-border-color: var(--dex-okd-color-transparent-white);
  --dex-okd-tabs-pane-fill-secondary-hover-text-color: var(--dex-okd-color-content-primary);
  --dex-okd-tabs-pane-fill-secondary-active-background-color: #1d1d1d;
  --dex-okd-tabs-pane-outline-primary-hover-background-color: var(--dex-okd-color-background-surface-primary);
  --dex-okd-tabs-pane-outline-primary-hover-border-color: var(--dex-okd-color-transparent-white);
  --dex-okd-tabs-pane-outline-primary-hover-text-color: var(--dex-okd-color-content-primary);
  --dex-okd-tabs-pane-outline-primary-active-background-color: var(--dex-okd-color-transparent-white);
  --dex-okd-tabs-pane-outline-primary-active-border-color: var(--dex-okd-color-border-selected);
  --dex-okd-tabs-pane-outline-primary-active-text-color: var(--dex-okd-color-content-primary);
  --dex-okd-tabs-pane-outline-highlight-hover-background-color: var(--dex-okd-color-background-surface-primary);
  --dex-okd-tabs-pane-outline-highlight-hover-border-color: var(--dex-okd-color-border-primary);
  --dex-okd-tabs-pane-outline-highlight-hover-text-color: var(--dex-okd-color-content-primary);
  --dex-okd-tabs-pane-outline-highlight-active-background-color: var(--dex-okd-color-transparent-white);
  --dex-okd-tabs-pane-outline-highlight-active-border-color: var(--dex-okd-color-border-selected);
  --dex-okd-tabs-pane-outline-highlight-active-text-color: var(--dex-okd-color-content-primary);
  --dex-okd-tabs-pane-outline-highlight-default-text-color: var(--dex-okd-color-content-contrast);
  --dex-okd-tabs-pane-outline-highlight-default-background-color: var(--dex-okd-color-transparent-white);
  --dex-okd-tabs-pane-outline-highlight-default-border-color: var(--dex-okd-color-border-primary);
  --dex-okd-tabs-pane-text-highlight-hover-background-color: transparent;
  --dex-okd-tabs-pane-text-highlight-hover-border-color: var(--dex-okd-color-transparent-white);
  --dex-okd-tabs-pane-text-highlight-hover-text-color: var(--dex-okd-color-content-primary);
  --dex-okd-tabs-pane-text-highlight-active-background-color: var(--dex-okd-color-transparent-white);
  --dex-okd-tabs-pane-text-highlight-active-border-color: var(--dex-okd-color-transparent-white);
  --dex-okd-tabs-pane-text-highlight-active-text-color: var(--dex-okd-color-content-primary);
  --dex-okd-tabs-pane-text-highlight-default-background-color: var(--dex-okd-color-transparent-white);
  --dex-okd-tabs-pane-text-highlight-default-border-color: var(--dex-okd-color-transparent-white);
  --dex-okd-tabs-pane-text-highlight-default-text-color: var(--dex-okd-color-content-contrast);
  --dex-okd-tabs-xs-button-border-radius: 8px;
  --dex-okd-tabs-xs-muted-border-radius: 8px;
  --dex-okd-tabs-xs-segmented-border-radius: 6px;
  --dex-okd-tabs-sm-button-border-radius: 8px;
  --dex-okd-tabs-sm-muted-border-radius: 8px;
  --dex-okd-tabs-sm-segmented-border-radius: 4px;
  --dex-okd-tabs-md-button-border-radius: 8px;
  --dex-okd-tabs-md-muted-border-radius: 8px;
  --dex-okd-tabs-md-segmented-border-radius: 4px;
  --dex-okd-tabs-lg-button-border-radius: 8px;
  --dex-okd-tabs-lg-muted-border-radius: 8px;
  --dex-okd-tabs-lg-segmented-border-radius: 4px;
  --dex-okd-tabs-xl-button-border-radius: 8px;
  --dex-okd-tabs-xl-muted-border-radius: 8px;
  --dex-okd-tabs-xl-segmented-border-radius: 4px;
  --dex-okd-tabs-xxl-button-border-radius: 8px;
  --dex-okd-tabs-xxl-muted-border-radius: 8px;
  --dex-okd-tabs-xxl-segmented-border-radius: 4px;
  --dex-okd-tabs-xxxl-button-border-radius: 8px;
  --dex-okd-tabs-xxxl-muted-border-radius: 8px;
  --dex-okd-tabs-xxxl-segmented-border-radius: 4px;
  --dex-okd-tabs-xs-button-container-border-radius: 0px;
  --dex-okd-tabs-xs-muted-container-border-radius: 0px;
  --dex-okd-tabs-xs-segmented-container-border-radius: 8px;
  --dex-okd-tabs-sm-button-container-border-radius: 0px;
  --dex-okd-tabs-sm-muted-container-border-radius: 0px;
  --dex-okd-tabs-sm-segmented-container-border-radius: 8px;
  --dex-okd-tabs-md-button-container-border-radius: 0px;
  --dex-okd-tabs-md-muted-container-border-radius: 0px;
  --dex-okd-tabs-md-segmented-container-border-radius: 8px;
  --dex-okd-tabs-lg-button-container-border-radius: 0px;
  --dex-okd-tabs-lg-muted-container-border-radius: 0px;
  --dex-okd-tabs-lg-segmented-container-border-radius: 8px;
  --dex-okd-tabs-xl-button-container-border-radius: 0px;
  --dex-okd-tabs-xl-muted-container-border-radius: 0px;
  --dex-okd-tabs-xl-segmented-container-border-radius: 8px;
  --dex-okd-tabs-xxl-button-container-border-radius: 0px;
  --dex-okd-tabs-xxl-muted-container-border-radius: 0px;
  --dex-okd-tabs-xxl-segmented-container-border-radius: 8px;
  --dex-okd-tabs-xxxl-button-container-border-radius: 0px;
  --dex-okd-tabs-xxxl-muted-container-border-radius: 0px;
  --dex-okd-tabs-xxxl-segmented-container-border-radius: 8px;
  --dex-okd-tabs-pane-xs-border-radius: 4px;
  --dex-okd-tabs-pane-sm-border-radius: 4px;
  --dex-okd-tabs-pane-md-border-radius: 6px;
  --dex-okd-tabs-pane-lg-border-radius: 6px;
  --dex-okd-tabs-pane-xl-border-radius: 8px;
  --dex-okd-tabs-pane-xxl-border-radius: 8px;
  --dex-okd-tabs-pane-xxxl-border-radius: 8px;
  --dex-okd-tabs-pane-xs-font-weight: 400;
  --dex-okd-tabs-pane-xs-active-font-weight: 500;
  --dex-okd-tabs-pane-xs-hover-font-weight: 400;
  --dex-okd-tabs-pane-md-font-weight: 400;
  --dex-okd-tabs-pane-md-active-font-weight: 500;
  --dex-okd-tabs-pane-md-hover-font-weight: 400;
  --dex-okd-tabs-pane-sm-font-weight: 400;
  --dex-okd-tabs-pane-sm-active-font-weight: 500;
  --dex-okd-tabs-pane-sm-hover-font-weight: 400;
  --dex-okd-tabs-pane-lg-font-weight: 400;
  --dex-okd-tabs-pane-lg-active-font-weight: 500;
  --dex-okd-tabs-pane-lg-hover-font-weight: 400;
  --dex-okd-tabs-pane-xl-font-weight: 400;
  --dex-okd-tabs-pane-xl-active-font-weight: 500;
  --dex-okd-tabs-pane-xl-hover-font-weight: 400;
  --dex-okd-tabs-pane-xxl-font-weight: 400;
  --dex-okd-tabs-pane-xxl-active-font-weight: 500;
  --dex-okd-tabs-pane-xxl-hover-font-weight: 400;
  --dex-okd-tabs-pane-xxxl-font-weight: 400;
  --dex-okd-tabs-pane-xxxl-active-font-weight: 500;
  --dex-okd-tabs-pane-xxxl-hover-font-weight: 400;
  --dex-okd-tabs-pane-xs-height: 24px;
  --dex-okd-tabs-pane-xs-font-size: 12px;
  --dex-okd-tabs-pane-xs-padding-vertical: 8px;
  --dex-okd-tabs-pane-xs-margin-right: 8px;
  --dex-okd-tabs-pane-xs-border-width: 1px;
  --dex-okd-tabs-pane-sm-height: 28px;
  --dex-okd-tabs-pane-sm-font-size: 12px;
  --dex-okd-tabs-pane-sm-padding-vertical: 8px;
  --dex-okd-tabs-pane-sm-margin-right: 8px;
  --dex-okd-tabs-pane-sm-border-width: 1px;
  --dex-okd-tabs-pane-md-height: 32px;
  --dex-okd-tabs-pane-md-font-size: 14px;
  --dex-okd-tabs-pane-md-padding-vertical: 8px;
  --dex-okd-tabs-pane-md-margin-right: 8px;
  --dex-okd-tabs-pane-md-border-width: 1px;
  --dex-okd-tabs-pane-lg-height: 36px;
  --dex-okd-tabs-pane-lg-font-size: 14px;
  --dex-okd-tabs-pane-lg-padding-vertical: 12px;
  --dex-okd-tabs-pane-lg-margin-right: 8px;
  --dex-okd-tabs-pane-lg-border-width: 1px;
  --dex-okd-tabs-pane-xl-height: 40px;
  --dex-okd-tabs-pane-xl-font-size: 14px;
  --dex-okd-tabs-pane-xl-padding-vertical: 16px;
  --dex-okd-tabs-pane-xl-margin-right: 8px;
  --dex-okd-tabs-pane-xl-border-width: 1px;
  --dex-okd-tabs-pane-xxl-height: 44px;
  --dex-okd-tabs-pane-xxl-font-size: 16px;
  --dex-okd-tabs-pane-xxl-padding-vertical: 16px;
  --dex-okd-tabs-pane-xxl-margin-right: 8px;
  --dex-okd-tabs-pane-xxl-border-width: 1px;
  --dex-okd-tabs-pane-xxxl-height: 50px;
  --dex-okd-tabs-pane-xxxl-font-size: 18px;
  --dex-okd-tabs-pane-xxxl-padding-vertical: 16px;
  --dex-okd-tabs-pane-xxxl-margin-right: 8px;
  --dex-okd-tabs-pane-xxxl-border-width: 1px;
  --dex-okd-tabs-xs-underline-font-weight: 500;
  --dex-okd-tabs-sm-underline-font-weight: 500;
  --dex-okd-tabs-md-underline-font-weight: 500;
  --dex-okd-tabs-lg-underline-font-weight: 500;
  --dex-okd-tabs-xl-underline-font-weight: 500;
  --dex-okd-tabs-xxl-underline-font-weight: 700;
  --dex-okd-tabs-xxxl-underline-font-weight: 700;
  --dex-okd-tabs-xxs-button-container-border-radius: 0px;
  --dex-okd-tabs-xxs-muted-container-border-radius: 0px;
  --dex-okd-tabs-xxs-segmented-container-border-radius: 8px;
  --dex-okd-tabs-xxs-button-border-radius: 8px;
  --dex-okd-tabs-xxs-muted-border-radius: 8px;
  --dex-okd-tabs-xxs-segmented-border-radius: 6px;
  --dex-okd-tabs-pane-xxs-height: 24px;
  --dex-okd-tabs-pane-xxs-font-size: 12px;
  --dex-okd-tabs-pane-xxs-font-weight: 400;
  --dex-okd-tabs-pane-xxs-active-font-weight: 500;
  --dex-okd-tabs-pane-xxs-hover-font-weight: 500;
  --dex-okd-tabs-pane-xxs-padding-vertical: 8px;
  --dex-okd-tabs-pane-xxs-margin-right: 8px;
  --dex-okd-tabs-pane-xxs-border-width: 1px;
  --dex-okd-tabs-pane-xxs-border-radius: 4px;
  --dex-okd-tabs-xxs-underline-font-size: 12px;
  --dex-okd-tabs-xxs-underline-font-weight: 500;
  --dex-okd-tabs-xxs-underline-label-padding: 0px;
  --dex-okd-tabs-xxs-underline-spacing: 16px;
  --dex-okd-tabs-xxs-common-icon-size: 12px;
  --dex-okd-tabs-xxs-button-font-size: 12px;
  --dex-okd-tabs-xxs-button-font-weight: 400;
  --dex-okd-tabs-xxs-button-height: 24px;
  --dex-okd-tabs-xxs-button-label-padding: 8px;
  --dex-okd-tabs-xxs-button-spacing: 8px;
  --dex-okd-tabs-xxs-muted-font-size: 12px;
  --dex-okd-tabs-xxs-muted-font-weight: 400;
  --dex-okd-tabs-xxs-muted-height: 24px;
  --dex-okd-tabs-xxs-muted-label-padding: 8px;
  --dex-okd-tabs-xxs-muted-spacing: 8px;
  --dex-okd-tabs-xxs-segmented-font-size: 12px;
  --dex-okd-tabs-xxs-segmented-font-weight: 400;
  --dex-okd-tabs-xxs-segmented-height: 24px;
  --dex-okd-tabs-xxs-segmented-label-padding: 8px;
  --dex-okd-tabs-xxs-segmented-spacing: 2px;
  --dex-okd-tabs-xxs-segmented-container-padding: 2px;
  --dex-okd-tabs-xxs-font-size: 12px;
  --dex-okd-tabs-xxs-icon-size: 12px;
  --dex-okd-tabs-xxs-height: 24px;
  --dex-okd-tabs-xxs-label-padding: 10px;
  --dex-okd-tabs-xxs-gutter-padding: 10px;
  --dex-okd-tabs-xxs-margin: 2px;
  --dex-okd-tabs-xxs-icon-width: 10px;
  --dex-okd-tabs-xxs-underline-height: 24px;
  --dex-okd-tabs-pane-fill-reversed-default-text-color: rgba(0, 0, 0, .5);
  --dex-okd-tabs-pane-fill-reversed-default-border-color: var(--dex-okd-color-transparent-white);
  --dex-okd-tabs-pane-fill-reversed-default-background-color: rgba(0, 0, 0, .06);
  --dex-okd-tabs-pane-fill-reversed-active-text-color: var(--dex-okd-color-content-primary);
  --dex-okd-tabs-pane-fill-reversed-active-border-color: var(--dex-okd-color-transparent-white);
  --dex-okd-tabs-pane-fill-reversed-active-background-color: var(--dex-okd-color-background-base-primary);
  --dex-okd-tabs-pane-fill-reversed-hover-text-color: var(--dex-okd-color-content-inverse);
  --dex-okd-tabs-pane-fill-reversed-hover-border-color: var(--dex-okd-color-transparent-white);
  --dex-okd-tabs-pane-fill-reversed-hover-background-color: rgba(0, 0, 0, .06);
  --dex-okd-tabs-pane-outline-reversed-default-text-color: rgba(0, 0, 0, .5);
  --dex-okd-tabs-pane-outline-reversed-default-border-color: rgba(0, 0, 0, .15);
  --dex-okd-tabs-pane-outline-reversed-default-background-color: var(--dex-okd-color-transparent-white);
  --dex-okd-tabs-pane-outline-reversed-active-text-color: var(--dex-okd-color-content-inverse);
  --dex-okd-tabs-pane-outline-reversed-active-border-color: var(--dex-okd-color-border-contrast);
  --dex-okd-tabs-pane-outline-reversed-active-background-color: var(--dex-okd-color-transparent-white);
  --dex-okd-tabs-pane-outline-reversed-hover-text-color: var(--dex-okd-color-content-inverse);
  --dex-okd-tabs-pane-outline-reversed-hover-border-color: rgba(0, 0, 0, .15);
  --dex-okd-tabs-pane-outline-reversed-hover-background-color: var(--dex-okd-color-transparent-black);
  --dex-okd-tabs-pane-text-reversed-default-text-color: rgba(0, 0, 0, .5);
  --dex-okd-tabs-pane-text-reversed-default-border-color: var(--dex-okd-color-transparent-white);
  --dex-okd-tabs-pane-text-reversed-default-background-color: var(--dex-okd-color-transparent-white);
  --dex-okd-tabs-pane-text-reversed-active-text-color: var(--dex-okd-color-content-inverse);
  --dex-okd-tabs-pane-text-reversed-active-border-color: var(--dex-okd-color-transparent-white);
  --dex-okd-tabs-pane-text-reversed-active-background-color: var(--dex-okd-color-transparent-white);
  --dex-okd-tabs-pane-text-reversed-hover-text-color: var(--dex-okd-color-content-inverse);
  --dex-okd-tabs-pane-text-reversed-hover-border-color: var(--dex-okd-color-transparent-white);
  --dex-okd-tabs-pane-text-reversed-hover-background-color: transparent;
  --dex-okd-tabs-xxs-underline-active-font-weight: 500;
  --dex-okd-tabs-xxs-button-active-font-weight: 500;
  --dex-okd-tabs-xxs-muted-active-font-weight: 500;
  --dex-okd-tabs-xxs-segmented-active-font-weight: 400;
  --dex-okd-tabs-xs-underline-active-font-weight: 500;
  --dex-okd-tabs-xs-button-active-font-weight: 500;
  --dex-okd-tabs-xs-muted-active-font-weight: 500;
  --dex-okd-tabs-xs-segmented-active-font-weight: 400;
  --dex-okd-tabs-sm-underline-active-font-weight: 500;
  --dex-okd-tabs-sm-button-active-font-weight: 500;
  --dex-okd-tabs-sm-muted-active-font-weight: 500;
  --dex-okd-tabs-sm-segmented-active-font-weight: 500;
  --dex-okd-tabs-md-underline-active-font-weight: 500;
  --dex-okd-tabs-md-button-active-font-weight: 500;
  --dex-okd-tabs-md-muted-active-font-weight: 500;
  --dex-okd-tabs-md-segmented-active-font-weight: 500;
  --dex-okd-tabs-lg-underline-active-font-weight: 500;
  --dex-okd-tabs-lg-button-active-font-weight: 500;
  --dex-okd-tabs-lg-muted-active-font-weight: 500;
  --dex-okd-tabs-lg-segmented-active-font-weight: 500;
  --dex-okd-tabs-xl-underline-active-font-weight: 500;
  --dex-okd-tabs-xl-button-active-font-weight: 500;
  --dex-okd-tabs-xl-muted-active-font-weight: 500;
  --dex-okd-tabs-xl-segmented-active-font-weight: 500;
  --dex-okd-tabs-xxl-underline-active-font-weight: 700;
  --dex-okd-tabs-xxl-button-active-font-weight: 500;
  --dex-okd-tabs-xxl-muted-active-font-weight: 500;
  --dex-okd-tabs-xxl-segmented-active-font-weight: 500;
  --dex-okd-tabs-xxxl-underline-active-font-weight: 700;
  --dex-okd-tabs-xxxl-button-active-font-weight: 500;
  --dex-okd-tabs-xxxl-muted-active-font-weight: 500;
  --dex-okd-tabs-xxxl-segmented-active-font-weight: 500;
  --dex-okd-tabs-pane-outline-primary-default-text-color: var(--dex-okd-color-content-contrast);
  --dex-okd-tabs-pane-outline-primary-default-border-color: var(--dex-okd-color-transparent-white);
  --dex-okd-tabs-pane-outline-primary-default-background-color: var(--dex-okd-color-transparent-white);
  --dex-okd-tabs-pane-text-primary-default-text-color: var(--dex-okd-color-content-contrast);
  --dex-okd-tabs-pane-text-primary-default-border-color: var(--dex-okd-color-transparent-white);
  --dex-okd-tabs-pane-text-primary-default-background-color: var(--dex-okd-color-transparent-white);
  --dex-okd-tabs-pane-text-primary-active-text-color: var(--dex-okd-color-content-primary);
  --dex-okd-tabs-pane-text-primary-active-border-color: var(--dex-okd-color-transparent-white);
  --dex-okd-tabs-pane-text-primary-active-background-color: var(--dex-okd-color-transparent-white);
  --dex-okd-tabs-pane-text-primary-hover-text-color: var(--dex-okd-color-content-primary);
  --dex-okd-tabs-pane-text-primary-hover-border-color: var(--dex-okd-color-transparent-white);
  --dex-okd-tabs-pane-text-primary-hover-background-color: var(--dex-okd-color-background-surface-primary);
  --dex-okd-tabs-pane-text-secondary-default-text-color: var(--dex-okd-color-content-contrast);
  --dex-okd-tabs-pane-text-secondary-default-border-color: var(--dex-okd-color-transparent-white);
  --dex-okd-tabs-pane-text-secondary-default-background-color: var(--dex-okd-color-transparent-white);
  --dex-okd-tabs-pane-text-secondary-active-text-color: var(--dex-okd-color-content-primary);
  --dex-okd-tabs-pane-text-secondary-active-border-color: var(--dex-okd-color-transparent-white);
  --dex-okd-tabs-pane-text-secondary-active-background-color: var(--dex-okd-color-transparent-white);
  --dex-okd-tabs-pane-text-secondary-hover-text-color: var(--dex-okd-color-content-primary);
  --dex-okd-tabs-pane-text-secondary-hover-border-color: var(--dex-okd-color-transparent-white);
  --dex-okd-tabs-pane-text-secondary-hover-background-color: var(--dex-okd-color-background-surface-primary);
  --dex-okd-tabs-pane-outline-secondary-default-text-color: var(--dex-okd-color-content-contrast);
  --dex-okd-tabs-pane-outline-secondary-default-border-color: var(--dex-okd-color-transparent-white);
  --dex-okd-tabs-pane-outline-secondary-default-background-color: var(--dex-okd-color-transparent-white);
  --dex-okd-tabs-pane-outline-secondary-active-text-color: var(--dex-okd-color-content-primary);
  --dex-okd-tabs-pane-outline-secondary-active-border-color: var(--dex-okd-color-border-secondary);
  --dex-okd-tabs-pane-outline-secondary-active-background-color: var(--dex-okd-color-transparent-white);
  --dex-okd-tabs-pane-outline-secondary-hover-text-color: var(--dex-okd-color-content-primary);
  --dex-okd-tabs-pane-outline-secondary-hover-border-color: var(--dex-okd-color-transparent-white);
  --dex-okd-tabs-pane-outline-secondary-hover-background-color: var(--dex-okd-color-background-surface-primary);
  --dex-okd-tabs-xxs-underline-border-width: 2px;
  --dex-okd-tabs-xs-underline-border-width: 2px;
  --dex-okd-tabs-sm-underline-border-width: 2px;
  --dex-okd-tabs-md-underline-border-width: 2px;
  --dex-okd-tabs-lg-underline-border-width: 2px;
  --dex-okd-tabs-xl-underline-border-width: 2px;
  --dex-okd-tabs-xxl-underline-border-width: 2px;
  --dex-okd-tabs-xxxl-underline-border-width: 2px
}

.theme-dark .dex-dialog-var,
.theme-dark.dex-dialog-var {
  --dex-okd-dialog-window-background: var(--dex-okd-color-modal-primary);
  --dex-okd-dialog-window-close-btn-color: var(--dex-okd-color-content-contrast);
  --dex-okd-dialog-window-split-line-border-color: var(--dex-okd-color-border-primary);
  --dex-okd-dialog-title-color: var(--dex-okd-color-content-primary);
  --dex-okd-dialog-sub-title-color: var(--dex-okd-color-content-contrast);
  --dex-okd-dialog-window-mask-color: var(--dex-okd-color-background-scrim);
  --dex-okd-dialog-window-default-text-color: var(--dex-okd-color-content-primary);
  --dex-okd-dialog-window-box-shadow: 0px 0px 0px 0px #2e2e2e, 0px 13px 20px -15px #000;
  --dex-okd-dialog-tip-title-color: #fafafa;
  --dex-okd-dialog-tip-detail-color: #e3e3e3;
  --dex-okd-dialog-tip-success-icon-bg: var(--dex-okd-color-semantic-positive);
  --dex-okd-dialog-tip-info-icon-bg: var(--dex-okd-color-semantic-neutral);
  --dex-okd-dialog-tip-prompt-icon-bg: #532206;
  --dex-okd-dialog-tip-warn-icon-bg: var(--dex-okd-color-semantic-notice);
  --dex-okd-dialog-tip-alert-icon-bg: #300e17;
  --dex-okd-dialog-tip-error-icon-bg: var(--dex-okd-color-semantic-negative);
  --dex-okd-dialog-tip-success-icon-color: var(--dex-okd-color-semantic-positive);
  --dex-okd-dialog-tip-info-icon-color: var(--dex-okd-color-semantic-neutral);
  --dex-okd-dialog-tip-prompt-icon-color: #f87428;
  --dex-okd-dialog-tip-warn-icon-color: var(--dex-okd-color-semantic-notice);
  --dex-okd-dialog-tip-alert-icon-color: #f04872;
  --dex-okd-dialog-tip-error-icon-color: var(--dex-okd-color-semantic-negative);
  --dex-okd-dialog-tip-icon-bg-size: 48px;
  --dex-okd-dialog-tip-icon-font-size: 48px;
  --dex-okd-dialog-tip-title-font-size: 18px;
  --dex-okd-dialog-tip-title-line-height: 24px;
  --dex-okd-dialog-tip-detail-font-size: 14px;
  --dex-okd-dialog-tip-detail-line-height: 20px;
  --dex-okd-dialog-action-close-btn-color: #1e6bff;
  --dex-okd-dialog-window-border-radius: 8px;
  --dex-okd-dialog-title-font-size: 16px;
  --dex-okd-dialog-title-line-height: 20px;
  --dex-okd-dialog-sub-title-font-size: var(--dex-okd-font-size-md);
  --dex-okd-dialog-sub-title-line-height: 16px;
  --dex-okd-dialog-window-close-size: 32px;
  --dex-okd-dialog-container-sm-padding-horizontal: 16px;
  --dex-okd-dialog-title-box-sm-padding-vertical: 14px;
  --dex-okd-dialog-container-sm-padding-vertical: 16px;
  --dex-okd-dialog-footer-box-sm-padding-vertical: 12px;
  --dex-okd-dialog-container-md-padding-horizontal: 24px;
  --dex-okd-dialog-title-box-md-padding-vertical: 12px;
  --dex-okd-dialog-container-md-padding-vertical: 24px;
  --dex-okd-dialog-footer-box-md-padding-vertical: 12px;
  --dex-okd-dialog-tip-window-min-width: 344px;
  --dex-okd-dialog-tip-window-2btn-min-width: 448px;
  --dex-okd-dialog-tip-footer-box-sm-padding-vertical: 16px;
  --dex-okd-dialog-tip-footer-box-md-padding-vertical: 24px;
  --dex-okd-dialog-window-close-icon-size: 24px;
  --dex-okd-dialog-window-back-icon-size: 24px;
  --dex-okd-dialog-tip-container-md-padding-top: 28px;
  --dex-okd-dialog-tip-container-md-padding-bottom: 24px;
  --dex-okd-dialog-tip-container-sm-padding-top: 20px;
  --dex-okd-dialog-tip-container-sm-padding-bottom: 24px;
  --dex-okd-dialog-window-action-padding: 16px;
  --dex-okd-dialog-footer-action-cancel-type: primary;
  --dex-okd-dialog-footer-action-cancel-size: sm;
  --dex-okd-dialog-footer-action-confirm-type: highlight;
  --dex-okd-dialog-footer-action-confirm-size: sm;
  --dex-okd-dialog-window-sm-border-radius: 12px;
  --dex-okd-dialog-title-font-weight: 700;
  --dex-okd-dialog-footer-btn-full-sm-margin-top: 8px;
  --dex-okd-dialog-footer-btn-md-margin-left: 12px;
  --dex-okd-dialog-footer-btn-sm-margin-left: 12px;
  --dex-okd-dialog-confirm-footer-sm-button-border-color: var(--dex-okd-color-border-secondary);
  --dex-okd-dialog-confirm-footer-padding-top: 0;
  --dex-okd-dialog-confirm-footer-padding-bottom: 24px;
  --dex-okd-dialog-confirm-title-padding-top: 24px;
  --dex-okd-dialog-confirm-no-title-padding-top: 24px;
  --dex-okd-dialog-confirm-title-padding-bottom: 0;
  --dex-okd-dialog-confirm-max-width: 520px;
  --dex-okd-dialog-confirm-min-width: 280px;
  --dex-okd-dialog-confirm-container-color: var(--dex-okd-color-content-secondary);
  --dex-okd-dialog-confirm-container-line-height: 20px;
  --dex-okd-dialog-confirm-container-font-size: 14px;
  --dex-okd-dialog-confirm-container-sm-padding-bottom: 24px;
  --dex-okd-dialog-confirm-icon-font-size: 22px;
  --dex-okd-dialog-confirm-icon-margin-right: 10px;
  --dex-okd-dialog-confirm-icon-line-height: 22px;
  --dex-okd-dialog-title-icon-close-color: var(--dex-okd-color-content-contrast);
  --dex-okd-dialog-title-icon-back-color: var(--dex-okd-color-content-primary);
  --dex-okd-dialog-title-icon-close-hover-color: var(--dex-okd-color-content-primary);
  --dex-okd-dialog-title-icon-hover-background-color: rgba(29, 29, 29, 0);
  --dex-okd-dialog-title-icon-hover-border-radius: 4px;
  --dex-okd-dialog-title-icon-close-margin-left: 32px;
  --dex-okd-dialog-title-icon-back-margin-right: 8px;
  --dex-okd-dialog-confirm-container-sm-padding-top: 8px;
  --dex-okd-dialog-confirm-container-sm-padding-horizontal: 24px;
  --dex-okd-dialog-confirm-title-padding-horizontal: 24px;
  --dex-okd-dialog-footer-box-sm-padding-top: 12px;
  --dex-okd-dialog-footer-box-sm-padding-bottom: 20px;
  --dex-okd-dialog-confirmation-header-padding-top: 24px;
  --dex-okd-dialog-confirmation-footer-padding-bottom: 24px;
  --dex-okd-dialog-confirmation-padding-left: 24px;
  --dex-okd-dialog-confirmation-padding-right: 24px;
  --dex-okd-dialog-confirmation-container-padding-top: 32px;
  --dex-okd-dialog-confirmation-container-padding-bottom: 32px;
  --dex-okd-dialog-confirm-footer-sm-button-color: var(--dex-okd-color-content-primary);
  --dex-okd-dialog-window-min-width: 392px;
  --dex-okd-dialog-window-back-btn-color: var(--dex-okd-color-container-inverse);
  --dex-okd-dialog-confirm-container-padding-top: 32px;
  --dex-okd-dialog-confirm-container-padding-bottom: 32px;
  --dex-okd-dialog-confirm-window-background: var(--dex-okd-color-modal-tertiary);
  --dex-okd-dialog-confirmation-window-background: var(--dex-okd-color-modal-primary);
  --dex-okd-dialog-window-border-color: var(--dex-okd-color-border-primary)
}

.flex-row {
  flex-direction: row
}

.flex-row-reverse {
  flex-direction: row-reverse
}

.flex-col {
  flex-direction: column
}

.flex-col-reverse {
  flex-direction: column-reverse
}

.flex-wrap {
  flex-wrap: wrap
}

.flex-wrap-reverse {
  flex-wrap: wrap-reverse
}

.flex-nowrap {
  flex-wrap: nowrap
}

.grow {
  flex-grow: 1
}

.grow-0 {
  flex-grow: 0
}

.shrink {
  flex-shrink: 1
}

.shrink-0 {
  flex-shrink: 0
}

.justify-start {
  justify-content: flex-start
}

.justify-end {
  justify-content: flex-end
}

.justify-center {
  justify-content: center
}

.justify-between {
  justify-content: space-between
}

.justify-around {
  justify-content: space-around
}

.justify-evenly {
  justify-content: space-evenly
}

.items-start {
  align-items: flex-start
}

.items-end {
  align-items: flex-end
}

.items-center {
  align-items: center
}

.items-baseline {
  align-items: baseline
}

.items-stretch {
  align-items: stretch
}

@media (max-width:767px) {
  .sm\:flex {
    display: flex
  }

  .sm\:flex-row {
    flex-direction: row
  }

  .sm\:flex-row-reverse {
    flex-direction: row-reverse
  }

  .sm\:flex-col {
    flex-direction: column
  }

  .sm\:flex-col-reverse {
    flex-direction: column-reverse
  }

  .sm\:flex-wrap {
    flex-wrap: wrap
  }

  .sm\:flex-wrap-reverse {
    flex-wrap: wrap-reverse
  }

  .sm\:flex-nowrap {
    flex-wrap: nowrap
  }

  .sm\:grow {
    flex-grow: 1
  }

  .sm\:grow-0 {
    flex-grow: 0
  }

  .sm\:shrink {
    flex-shrink: 1
  }

  .sm\:shrink-0 {
    flex-shrink: 0
  }

  .sm\:justify-start {
    justify-content: flex-start
  }

  .sm\:justify-end {
    justify-content: flex-end
  }

  .sm\:justify-center {
    justify-content: center
  }

  .sm\:justify-between {
    justify-content: space-between
  }

  .sm\:justify-around {
    justify-content: space-around
  }

  .sm\:justify-evenly {
    justify-content: space-evenly
  }

  .sm\:items-start {
    align-items: flex-start
  }

  .sm\:items-end {
    align-items: flex-end
  }

  .sm\:items-center {
    align-items: center
  }

  .sm\:items-baseline {
    align-items: baseline
  }

  .sm\:items-stretch {
    align-items: stretch
  }
}

@media (min-width:768px) {
  .md\:flex {
    display: flex
  }

  .md\:flex-row {
    flex-direction: row
  }

  .md\:flex-row-reverse {
    flex-direction: row-reverse
  }

  .md\:flex-col {
    flex-direction: column
  }

  .md\:flex-col-reverse {
    flex-direction: column-reverse
  }

  .md\:flex-wrap {
    flex-wrap: wrap
  }

  .md\:flex-wrap-reverse {
    flex-wrap: wrap-reverse
  }

  .md\:flex-nowrap {
    flex-wrap: nowrap
  }

  .md\:grow {
    flex-grow: 1
  }

  .md\:grow-0 {
    flex-grow: 0
  }

  .md\:shrink {
    flex-shrink: 1
  }

  .md\:shrink-0 {
    flex-shrink: 0
  }

  .md\:justify-start {
    justify-content: flex-start
  }

  .md\:justify-end {
    justify-content: flex-end
  }

  .md\:justify-center {
    justify-content: center
  }

  .md\:justify-between {
    justify-content: space-between
  }

  .md\:justify-around {
    justify-content: space-around
  }

  .md\:justify-evenly {
    justify-content: space-evenly
  }

  .md\:items-start {
    align-items: flex-start
  }

  .md\:items-end {
    align-items: flex-end
  }

  .md\:items-center {
    align-items: center
  }

  .md\:items-baseline {
    align-items: baseline
  }

  .md\:items-stretch {
    align-items: stretch
  }
}

@media (min-width:1024px) {
  .lg\:flex {
    display: flex
  }

  .lg\:flex-row {
    flex-direction: row
  }

  .lg\:flex-row-reverse {
    flex-direction: row-reverse
  }

  .lg\:flex-col {
    flex-direction: column
  }

  .lg\:flex-col-reverse {
    flex-direction: column-reverse
  }

  .lg\:flex-wrap {
    flex-wrap: wrap
  }

  .lg\:flex-wrap-reverse {
    flex-wrap: wrap-reverse
  }

  .lg\:flex-nowrap {
    flex-wrap: nowrap
  }

  .lg\:grow {
    flex-grow: 1
  }

  .lg\:grow-0 {
    flex-grow: 0
  }

  .lg\:shrink {
    flex-shrink: 1
  }

  .lg\:shrink-0 {
    flex-shrink: 0
  }

  .lg\:justify-start {
    justify-content: flex-start
  }

  .lg\:justify-end {
    justify-content: flex-end
  }

  .lg\:justify-center {
    justify-content: center
  }

  .lg\:justify-between {
    justify-content: space-between
  }

  .lg\:justify-around {
    justify-content: space-around
  }

  .lg\:justify-evenly {
    justify-content: space-evenly
  }

  .lg\:items-start {
    align-items: flex-start
  }

  .lg\:items-end {
    align-items: flex-end
  }

  .lg\:items-center {
    align-items: center
  }

  .lg\:items-baseline {
    align-items: baseline
  }

  .lg\:items-stretch {
    align-items: stretch
  }
}

@media (min-width:1270px) {
  .xl\:flex {
    display: flex
  }

  .xl\:flex-row {
    flex-direction: row
  }

  .xl\:flex-row-reverse {
    flex-direction: row-reverse
  }

  .xl\:flex-col {
    flex-direction: column
  }

  .xl\:flex-col-reverse {
    flex-direction: column-reverse
  }

  .xl\:flex-wrap {
    flex-wrap: wrap
  }

  .xl\:flex-wrap-reverse {
    flex-wrap: wrap-reverse
  }

  .xl\:flex-nowrap {
    flex-wrap: nowrap
  }

  .xl\:grow {
    flex-grow: 1
  }

  .xl\:grow-0 {
    flex-grow: 0
  }

  .xl\:shrink {
    flex-shrink: 1
  }

  .xl\:shrink-0 {
    flex-shrink: 0
  }

  .xl\:justify-start {
    justify-content: flex-start
  }

  .xl\:justify-end {
    justify-content: flex-end
  }

  .xl\:justify-center {
    justify-content: center
  }

  .xl\:justify-between {
    justify-content: space-between
  }

  .xl\:justify-around {
    justify-content: space-around
  }

  .xl\:justify-evenly {
    justify-content: space-evenly
  }

  .xl\:items-start {
    align-items: flex-start
  }

  .xl\:items-end {
    align-items: flex-end
  }

  .xl\:items-center {
    align-items: center
  }

  .xl\:items-baseline {
    align-items: baseline
  }

  .xl\:items-stretch {
    align-items: stretch
  }
}

.text-left {
  text-align: left
}

.text-center {
  text-align: center
}

.text-right {
  text-align: right
}

.truncate {
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap
}

.truncate-2 {
  -webkit-line-clamp: 2
}

.truncate-2,
.truncate-3 {
  -webkit-box-orient: vertical;
  display: -webkit-box;
  overflow: hidden;
  text-overflow: ellipsis
}

.truncate-3 {
  -webkit-line-clamp: 3
}

.truncate-4 {
  -webkit-box-orient: vertical;
  -webkit-line-clamp: 4;
  display: -webkit-box;
  overflow: hidden
}

.text-ellipsis,
.truncate-4 {
  text-overflow: ellipsis
}

.text-clip {
  text-overflow: clip
}

.align-baseline {
  vertical-align: initial
}

.align-top {
  vertical-align: top
}

.align-middle {
  vertical-align: middle
}

.align-bottom {
  vertical-align: bottom
}

.align-text-top {
  vertical-align: text-top
}

.align-text-bottom {
  vertical-align: text-bottom
}

.align-sub {
  vertical-align: sub
}

.align-super {
  vertical-align: super
}

.whitespace-normal {
  white-space: normal
}

.whitespace-nowrap {
  white-space: nowrap
}

.whitespace-pre {
  white-space: pre
}

.whitespace-pre-line {
  white-space: pre-line
}

.whitespace-pre-wrap {
  white-space: pre-wrap
}

.break-normal {
  overflow-wrap: normal;
  word-break: normal
}

.break-words {
  overflow-wrap: break-word
}

.break-all {
  word-break: break-all
}

@media (max-width:767px) {
  .sm\:text-left {
    text-align: left
  }

  .sm\:text-center {
    text-align: center
  }

  .sm\:text-right {
    text-align: right
  }

  .sm\:truncate {
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap
  }

  .sm\:truncate-2 {
    -webkit-line-clamp: 2
  }

  .sm\:truncate-2,
  .sm\:truncate-3 {
    -webkit-box-orient: vertical;
    display: -webkit-box;
    overflow: hidden;
    text-overflow: ellipsis
  }

  .sm\:truncate-3 {
    -webkit-line-clamp: 3
  }

  .sm\:truncate-4 {
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 4;
    display: -webkit-box;
    overflow: hidden
  }

  .sm\:text-ellipsis,
  .sm\:truncate-4 {
    text-overflow: ellipsis
  }

  .sm\:text-clip {
    text-overflow: clip
  }

  .sm\:align-baseline {
    vertical-align: initial
  }

  .sm\:align-top {
    vertical-align: top
  }

  .sm\:align-middle {
    vertical-align: middle
  }

  .sm\:align-bottom {
    vertical-align: bottom
  }

  .sm\:align-text-top {
    vertical-align: text-top
  }

  .sm\:align-text-bottom {
    vertical-align: text-bottom
  }

  .sm\:align-sub {
    vertical-align: sub
  }

  .sm\:align-super {
    vertical-align: super
  }

  .sm\:whitespace-normal {
    white-space: normal
  }

  .sm\:whitespace-nowrap {
    white-space: nowrap
  }

  .sm\:whitespace-pre {
    white-space: pre
  }

  .sm\:whitespace-pre-line {
    white-space: pre-line
  }

  .sm\:whitespace-pre-wrap {
    white-space: pre-wrap
  }

  .sm\:break-normal {
    overflow-wrap: normal;
    word-break: normal
  }

  .sm\:break-words {
    overflow-wrap: break-word
  }

  .sm\:break-all {
    word-break: break-all
  }
}

@media (min-width:768px) {
  .md\:text-left {
    text-align: left
  }

  .md\:text-center {
    text-align: center
  }

  .md\:text-right {
    text-align: right
  }

  .md\:truncate {
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap
  }

  .md\:truncate-2 {
    -webkit-line-clamp: 2
  }

  .md\:truncate-2,
  .md\:truncate-3 {
    -webkit-box-orient: vertical;
    display: -webkit-box;
    overflow: hidden;
    text-overflow: ellipsis
  }

  .md\:truncate-3 {
    -webkit-line-clamp: 3
  }

  .md\:truncate-4 {
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 4;
    display: -webkit-box;
    overflow: hidden
  }

  .md\:text-ellipsis,
  .md\:truncate-4 {
    text-overflow: ellipsis
  }

  .md\:text-clip {
    text-overflow: clip
  }

  .md\:align-baseline {
    vertical-align: initial
  }

  .md\:align-top {
    vertical-align: top
  }

  .md\:align-middle {
    vertical-align: middle
  }

  .md\:align-bottom {
    vertical-align: bottom
  }

  .md\:align-text-top {
    vertical-align: text-top
  }

  .md\:align-text-bottom {
    vertical-align: text-bottom
  }

  .md\:align-sub {
    vertical-align: sub
  }

  .md\:align-super {
    vertical-align: super
  }

  .md\:whitespace-normal {
    white-space: normal
  }

  .md\:whitespace-nowrap {
    white-space: nowrap
  }

  .md\:whitespace-pre {
    white-space: pre
  }

  .md\:whitespace-pre-line {
    white-space: pre-line
  }

  .md\:whitespace-pre-wrap {
    white-space: pre-wrap
  }

  .md\:break-normal {
    overflow-wrap: normal;
    word-break: normal
  }

  .md\:break-words {
    overflow-wrap: break-word
  }

  .md\:break-all {
    word-break: break-all
  }
}

@media (min-width:1024px) {
  .lg\:text-left {
    text-align: left
  }

  .lg\:text-center {
    text-align: center
  }

  .lg\:text-right {
    text-align: right
  }

  .lg\:truncate {
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap
  }

  .lg\:truncate-2 {
    -webkit-line-clamp: 2
  }

  .lg\:truncate-2,
  .lg\:truncate-3 {
    -webkit-box-orient: vertical;
    display: -webkit-box;
    overflow: hidden;
    text-overflow: ellipsis
  }

  .lg\:truncate-3 {
    -webkit-line-clamp: 3
  }

  .lg\:truncate-4 {
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 4;
    display: -webkit-box;
    overflow: hidden
  }

  .lg\:text-ellipsis,
  .lg\:truncate-4 {
    text-overflow: ellipsis
  }

  .lg\:text-clip {
    text-overflow: clip
  }

  .lg\:align-baseline {
    vertical-align: initial
  }

  .lg\:align-top {
    vertical-align: top
  }

  .lg\:align-middle {
    vertical-align: middle
  }

  .lg\:align-bottom {
    vertical-align: bottom
  }

  .lg\:align-text-top {
    vertical-align: text-top
  }

  .lg\:align-text-bottom {
    vertical-align: text-bottom
  }

  .lg\:align-sub {
    vertical-align: sub
  }

  .lg\:align-super {
    vertical-align: super
  }

  .lg\:whitespace-normal {
    white-space: normal
  }

  .lg\:whitespace-nowrap {
    white-space: nowrap
  }

  .lg\:whitespace-pre {
    white-space: pre
  }

  .lg\:whitespace-pre-line {
    white-space: pre-line
  }

  .lg\:whitespace-pre-wrap {
    white-space: pre-wrap
  }

  .lg\:break-normal {
    overflow-wrap: normal;
    word-break: normal
  }

  .lg\:break-words {
    overflow-wrap: break-word
  }

  .lg\:break-all {
    word-break: break-all
  }
}

@media (min-width:1270px) {
  .xl\:text-left {
    text-align: left
  }

  .xl\:text-center {
    text-align: center
  }

  .xl\:text-right {
    text-align: right
  }

  .xl\:truncate {
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap
  }

  .xl\:truncate-2 {
    -webkit-line-clamp: 2
  }

  .xl\:truncate-2,
  .xl\:truncate-3 {
    -webkit-box-orient: vertical;
    display: -webkit-box;
    overflow: hidden;
    text-overflow: ellipsis
  }

  .xl\:truncate-3 {
    -webkit-line-clamp: 3
  }

  .xl\:truncate-4 {
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 4;
    display: -webkit-box;
    overflow: hidden
  }

  .xl\:text-ellipsis,
  .xl\:truncate-4 {
    text-overflow: ellipsis
  }

  .xl\:text-clip {
    text-overflow: clip
  }

  .xl\:align-baseline {
    vertical-align: initial
  }

  .xl\:align-top {
    vertical-align: top
  }

  .xl\:align-middle {
    vertical-align: middle
  }

  .xl\:align-bottom {
    vertical-align: bottom
  }

  .xl\:align-text-top {
    vertical-align: text-top
  }

  .xl\:align-text-bottom {
    vertical-align: text-bottom
  }

  .xl\:align-sub {
    vertical-align: sub
  }

  .xl\:align-super {
    vertical-align: super
  }

  .xl\:whitespace-normal {
    white-space: normal
  }

  .xl\:whitespace-nowrap {
    white-space: nowrap
  }

  .xl\:whitespace-pre {
    white-space: pre
  }

  .xl\:whitespace-pre-line {
    white-space: pre-line
  }

  .xl\:whitespace-pre-wrap {
    white-space: pre-wrap
  }

  .xl\:break-normal {
    overflow-wrap: normal;
    word-break: normal
  }

  .xl\:break-words {
    overflow-wrap: break-word
  }

  .xl\:break-all {
    word-break: break-all
  }
}

.bg-bottom {
  background-position: bottom
}

.bg-center {
  background-position: 50%
}

.bg-left {
  background-position: 0
}

.bg-left-bottom {
  background-position: 0 100%
}

.bg-left-top {
  background-position: 0 0
}

.bg-right {
  background-position: 100%
}

.bg-right-bottom {
  background-position: 100% 100%
}

.bg-right-top {
  background-position: 100% 0
}

.bg-top {
  background-position: top
}

.bg-auto {
  background-size: auto
}

.bg-cover {
  background-size: cover
}

.bg-contain {
  background-size: contain
}

@media (max-width:767px) {
  .sm\:bg-bottom {
    background-position: bottom
  }

  .sm\:bg-center {
    background-position: 50%
  }

  .sm\:bg-left {
    background-position: 0
  }

  .sm\:bg-left-bottom {
    background-position: 0 100%
  }

  .sm\:bg-left-top {
    background-position: 0 0
  }

  .sm\:bg-right {
    background-position: 100%
  }

  .sm\:bg-right-bottom {
    background-position: 100% 100%
  }

  .sm\:bg-right-top {
    background-position: 100% 0
  }

  .sm\:bg-top {
    background-position: top
  }

  .sm\:bg-auto {
    background-size: auto
  }

  .sm\:bg-cover {
    background-size: cover
  }

  .sm\:bg-contain {
    background-size: contain
  }
}

@media (min-width:768px) {
  .md\:bg-bottom {
    background-position: bottom
  }

  .md\:bg-center {
    background-position: 50%
  }

  .md\:bg-left {
    background-position: 0
  }

  .md\:bg-left-bottom {
    background-position: 0 100%
  }

  .md\:bg-left-top {
    background-position: 0 0
  }

  .md\:bg-right {
    background-position: 100%
  }

  .md\:bg-right-bottom {
    background-position: 100% 100%
  }

  .md\:bg-right-top {
    background-position: 100% 0
  }

  .md\:bg-top {
    background-position: top
  }

  .md\:bg-auto {
    background-size: auto
  }

  .md\:bg-cover {
    background-size: cover
  }

  .md\:bg-contain {
    background-size: contain
  }
}

@media (min-width:1024px) {
  .lg\:bg-bottom {
    background-position: bottom
  }

  .lg\:bg-center {
    background-position: 50%
  }

  .lg\:bg-left {
    background-position: 0
  }

  .lg\:bg-left-bottom {
    background-position: 0 100%
  }

  .lg\:bg-left-top {
    background-position: 0 0
  }

  .lg\:bg-right {
    background-position: 100%
  }

  .lg\:bg-right-bottom {
    background-position: 100% 100%
  }

  .lg\:bg-right-top {
    background-position: 100% 0
  }

  .lg\:bg-top {
    background-position: top
  }

  .lg\:bg-auto {
    background-size: auto
  }

  .lg\:bg-cover {
    background-size: cover
  }

  .lg\:bg-contain {
    background-size: contain
  }
}

@media (min-width:1270px) {
  .xl\:bg-bottom {
    background-position: bottom
  }

  .xl\:bg-center {
    background-position: 50%
  }

  .xl\:bg-left {
    background-position: 0
  }

  .xl\:bg-left-bottom {
    background-position: 0 100%
  }

  .xl\:bg-left-top {
    background-position: 0 0
  }

  .xl\:bg-right {
    background-position: 100%
  }

  .xl\:bg-right-bottom {
    background-position: 100% 100%
  }

  .xl\:bg-right-top {
    background-position: 100% 0
  }

  .xl\:bg-top {
    background-position: top
  }

  .xl\:bg-auto {
    background-size: auto
  }

  .xl\:bg-cover {
    background-size: cover
  }

  .xl\:bg-contain {
    background-size: contain
  }
}

.overflow-auto {
  overflow: auto
}

.overflow-y-auto {
  overflow-y: auto
}

.overflow-x-auto {
  overflow-x: auto
}

.overflow-hidden {
  overflow: hidden
}

.overflow-x-hidden {
  overflow-x: hidden
}

.overflow-y-hidden {
  overflow-y: hidden
}

.overflow-visible {
  overflow: visible
}

.overflow-x-visible {
  overflow-x: visible
}

.overflow-y-visible {
  overflow-y: visible
}

.overflow-scroll {
  overflow: scroll
}

.overflow-x-scroll {
  overflow-x: scroll
}

.overflow-y-scroll {
  overflow-y: scroll
}

@media (max-width:767px) {
  .sm\:overflow-auto {
    overflow: auto
  }

  .sm\:overflow-y-auto {
    overflow-y: auto
  }

  .sm\:overflow-x-auto {
    overflow-x: auto
  }

  .sm\:overflow-hidden {
    overflow: hidden
  }

  .sm\:overflow-x-hidden {
    overflow-x: hidden
  }

  .sm\:overflow-y-hidden {
    overflow-y: hidden
  }

  .sm\:overflow-visible {
    overflow: visible
  }

  .sm\:overflow-x-visible {
    overflow-x: visible
  }

  .sm\:overflow-y-visible {
    overflow-y: visible
  }

  .sm\:overflow-scroll {
    overflow: scroll
  }

  .sm\:overflow-x-scroll {
    overflow-x: scroll
  }

  .sm\:overflow-y-scroll {
    overflow-y: scroll
  }
}

@media (min-width:768px) {
  .md\:overflow-auto {
    overflow: auto
  }

  .md\:overflow-y-auto {
    overflow-y: auto
  }

  .md\:overflow-x-auto {
    overflow-x: auto
  }

  .md\:overflow-hidden {
    overflow: hidden
  }

  .md\:overflow-x-hidden {
    overflow-x: hidden
  }

  .md\:overflow-y-hidden {
    overflow-y: hidden
  }

  .md\:overflow-visible {
    overflow: visible
  }

  .md\:overflow-x-visible {
    overflow-x: visible
  }

  .md\:overflow-y-visible {
    overflow-y: visible
  }

  .md\:overflow-scroll {
    overflow: scroll
  }

  .md\:overflow-x-scroll {
    overflow-x: scroll
  }

  .md\:overflow-y-scroll {
    overflow-y: scroll
  }
}

@media (min-width:1024px) {
  .lg\:overflow-auto {
    overflow: auto
  }

  .lg\:overflow-y-auto {
    overflow-y: auto
  }

  .lg\:overflow-x-auto {
    overflow-x: auto
  }

  .lg\:overflow-hidden {
    overflow: hidden
  }

  .lg\:overflow-x-hidden {
    overflow-x: hidden
  }

  .lg\:overflow-y-hidden {
    overflow-y: hidden
  }

  .lg\:overflow-visible {
    overflow: visible
  }

  .lg\:overflow-x-visible {
    overflow-x: visible
  }

  .lg\:overflow-y-visible {
    overflow-y: visible
  }

  .lg\:overflow-scroll {
    overflow: scroll
  }

  .lg\:overflow-x-scroll {
    overflow-x: scroll
  }

  .lg\:overflow-y-scroll {
    overflow-y: scroll
  }
}

@media (min-width:1270px) {
  .xl\:overflow-auto {
    overflow: auto
  }

  .xl\:overflow-y-auto {
    overflow-y: auto
  }

  .xl\:overflow-x-auto {
    overflow-x: auto
  }

  .xl\:overflow-hidden {
    overflow: hidden
  }

  .xl\:overflow-x-hidden {
    overflow-x: hidden
  }

  .xl\:overflow-y-hidden {
    overflow-y: hidden
  }

  .xl\:overflow-visible {
    overflow: visible
  }

  .xl\:overflow-x-visible {
    overflow-x: visible
  }

  .xl\:overflow-y-visible {
    overflow-y: visible
  }

  .xl\:overflow-scroll {
    overflow: scroll
  }

  .xl\:overflow-x-scroll {
    overflow-x: scroll
  }

  .xl\:overflow-y-scroll {
    overflow-y: scroll
  }
}

.static {
  position: sticky
}

.fixed {
  position: fixed
}

.absolute {
  position: absolute
}

.relative {
  position: relative
}

@media (max-width:767px) {
  .sm\:static {
    position: sticky
  }

  .sm\:fixed {
    position: fixed
  }

  .sm\:absolute {
    position: absolute
  }

  .sm\:relative {
    position: relative
  }
}

@media (min-width:768px) {
  .md\:static {
    position: sticky
  }

  .md\:fixed {
    position: fixed
  }

  .md\:absolute {
    position: absolute
  }

  .md\:relative {
    position: relative
  }
}

@media (min-width:1024px) {
  .lg\:static {
    position: sticky
  }

  .lg\:fixed {
    position: fixed
  }

  .lg\:absolute {
    position: absolute
  }

  .lg\:relative {
    position: relative
  }
}

@media (min-width:1270px) {
  .xl\:static {
    position: sticky
  }

  .xl\:fixed {
    position: fixed
  }

  .xl\:absolute {
    position: absolute
  }

  .xl\:relative {
    position: relative
  }
}

.block {
  display: block
}

.inline-block {
  display: inline-block
}

.inline {
  display: inline
}

.flex {
  display: flex
}

.inline-flex {
  display: inline-flex
}

.hidden {
  display: none
}

@media (max-width:767px) {
  .sm\:block {
    display: block
  }

  .sm\:inline-block {
    display: inline-block
  }

  .sm\:inline {
    display: inline
  }

  .sm\:flex {
    display: flex
  }

  .sm\:inline-flex {
    display: inline-flex
  }

  .sm\:hidden {
    display: none
  }
}

@media (min-width:768px) {
  .md\:block {
    display: block
  }

  .md\:inline-block {
    display: inline-block
  }

  .md\:inline {
    display: inline
  }

  .md\:flex {
    display: flex
  }

  .md\:inline-flex {
    display: inline-flex
  }

  .md\:hidden {
    display: none
  }
}

@media (min-width:1024px) {
  .lg\:block {
    display: block
  }

  .lg\:inline-block {
    display: inline-block
  }

  .lg\:inline {
    display: inline
  }

  .lg\:flex {
    display: flex
  }

  .lg\:inline-flex {
    display: inline-flex
  }

  .lg\:hidden {
    display: none
  }
}

@media (min-width:1270px) {
  .xl\:block {
    display: block
  }

  .xl\:inline-block {
    display: inline-block
  }

  .xl\:inline {
    display: inline
  }

  .xl\:flex {
    display: flex
  }

  .xl\:inline-flex {
    display: inline-flex
  }

  .xl\:hidden {
    display: none
  }
}

.cursor-auto {
  cursor: auto
}

.cursor-default {
  cursor: default
}

.cursor-pointer {
  cursor: pointer
}

.cursor-not-allowed {
  cursor: not-allowed
}

@media (max-width:767px) {
  .sm\:cursor-auto {
    cursor: auto
  }

  .sm\:cursor-default {
    cursor: default
  }

  .sm\:cursor-pointer {
    cursor: pointer
  }

  .sm\:cursor-not-allowed {
    cursor: not-allowed
  }
}

@media (min-width:768px) {
  .md\:cursor-auto {
    cursor: auto
  }

  .md\:cursor-default {
    cursor: default
  }

  .md\:cursor-pointer {
    cursor: pointer
  }

  .md\:cursor-not-allowed {
    cursor: not-allowed
  }
}

@media (min-width:1024px) {
  .lg\:cursor-auto {
    cursor: auto
  }

  .lg\:cursor-default {
    cursor: default
  }

  .lg\:cursor-pointer {
    cursor: pointer
  }

  .lg\:cursor-not-allowed {
    cursor: not-allowed
  }
}

@media (min-width:1270px) {
  .xl\:cursor-auto {
    cursor: auto
  }

  .xl\:cursor-default {
    cursor: default
  }

  .xl\:cursor-pointer {
    cursor: pointer
  }

  .xl\:cursor-not-allowed {
    cursor: not-allowed
  }
}

.theme-light .dex-checkbox-var,
.theme-light.dex-checkbox-var {
  --dex-okd-checkbox-default-text-color: var(--dex-okd-color-content-secondary);
  --dex-okd-checkbox-default-background: var(--dex-okd-color-background-surface-contrast);
  --dex-okd-checkbox-default-border-color: var(--dex-okd-color-border-secondary);
  --dex-okd-checkbox-default-hover-border-color: var(--dex-okd-color-border-selected);
  --dex-okd-checkbox-default-shadow: 0px 0px 0px 0px #0000000d;
  --dex-okd-checkbox-default-hover-shadow: 0px 0px 0px 0px #0000000d;
  --dex-okd-checkbox-selected-text-color: var(--dex-okd-color-content-secondary);
  --dex-okd-checkbox-selected-background: var(--dex-okd-color-content-primary);
  --dex-okd-checkbox-selected-border-color: var(--dex-okd-color-content-primary);
  --dex-okd-checkbox-selected-hover-border-color: var(--dex-okd-color-content-primary);
  --dex-okd-checkbox-selected-inner-color: var(--dex-okd-color-content-inverse);
  --dex-okd-checkbox-selected-shadow: 0px 0px 0px 0px #0000000d;
  --dex-okd-checkbox-selected-hover-shadow: 0px 0px 0px 0px #0000000d;
  --dex-okd-checkbox-error-text-color: var(--dex-okd-color-semantic-negative);
  --dex-okd-checkbox-error-border-color: var(--dex-okd-color-semantic-negative);
  --dex-okd-checkbox-error-hover-border-color: var(--dex-okd-color-semantic-negative);
  --dex-okd-checkbox-error-background: var(--dex-okd-color-semantic-negative);
  --dex-okd-checkbox-error-inner-color: var(--dex-okd-color-content-inverse);
  --dex-okd-checkbox-error-shadow: 0px 0px 0px 0px #0000000d;
  --dex-okd-checkbox-error-hover-shadow: 0px 0px 0px 0px #e35e5e73;
  --dex-okd-checkbox-disabled-text-color: var(--dex-okd-color-content-disabled);
  --dex-okd-checkbox-disabled-background: var(--dex-okd-color-background-surface-disable);
  --dex-okd-checkbox-disabled-border-color: var(--dex-okd-color-border-secondary);
  --dex-okd-checkbox-disabled-hover-border-color: var(--dex-okd-color-border-secondary);
  --dex-okd-checkbox-disabled-inner-color: var(--dex-okd-color-content-disabled);
  --dex-okd-checkbox-common-border-radius: var(--dex-okd-border-radius-sm);
  --dex-okd-checkbox-common-label-font-size: var(--dex-okd-font-size-xs);
  --dex-okd-checkbox-sm-font-size: var(--dex-okd-font-size-xs);
  --dex-okd-checkbox-sm-line-height: var(--dex-okd-line-height-xs);
  --dex-okd-checkbox-sm-height: 12px;
  --dex-okd-checkbox-sm-width: 12px;
  --dex-okd-checkbox-sm-margin: 4px;
  --dex-okd-checkbox-sm-padding: 4px;
  --dex-okd-checkbox-md-font-size: var(--dex-okd-font-size-md);
  --dex-okd-checkbox-md-line-height: var(--dex-okd-line-height-md);
  --dex-okd-checkbox-md-height: 16px;
  --dex-okd-checkbox-md-width: 16px;
  --dex-okd-checkbox-md-margin: 8px;
  --dex-okd-checkbox-md-padding: 0;
  --dex-okd-checkbox-sm-border-radius: 2px;
  --dex-okd-checkbox-md-border-radius: 4px;
  --dex-okd-checkbox-reversed-default-text-color: #fff;
  --dex-okd-checkbox-reversed-default-background: #000;
  --dex-okd-checkbox-reversed-default-border-color: #fff;
  --dex-okd-checkbox-reversed-default-hover-border-color: #fff;
  --dex-okd-checkbox-reversed-default-shadow: 0 0 0 0 transparent;
  --dex-okd-checkbox-reversed-default-hover-shadow: 0px 0px 0px 4px #ffffff33;
  --dex-okd-checkbox-reversed-selected-text-color: #fff;
  --dex-okd-checkbox-reversed-selected-background: #fff;
  --dex-okd-checkbox-reversed-selected-border-color: transparent;
  --dex-okd-checkbox-reversed-selected-hover-border-color: transparent;
  --dex-okd-checkbox-reversed-selected-inner-color: #000;
  --dex-okd-checkbox-reversed-selected-shadow: 0 0 0 0 transparent;
  --dex-okd-checkbox-reversed-selected-hover-shadow: 0 0 0 0 transparent;
  --dex-okd-checkbox-reversed-error-text-color: #eb4b6d;
  --dex-okd-checkbox-reversed-error-border-color: #eb4b6d;
  --dex-okd-checkbox-reversed-error-hover-border-color: #eb4b6d;
  --dex-okd-checkbox-reversed-error-background: #eb4b6d;
  --dex-okd-checkbox-reversed-error-inner-color: #000;
  --dex-okd-checkbox-reversed-error-shadow: 0 0 0 0 transparent;
  --dex-okd-checkbox-reversed-error-hover-shadow: 0px 0px 0px 4px #f1507b33;
  --dex-okd-checkbox-reversed-disabled-text-color: #545454;
  --dex-okd-checkbox-reversed-disabled-background: #000;
  --dex-okd-checkbox-reversed-disabled-border-color: #545454;
  --dex-okd-checkbox-reversed-disabled-hover-border-color: #bdbdbd;
  --dex-okd-checkbox-reversed-disabled-inner-color: #545454;
  --dex-okd-checkbox-circle-inner-color: var(--dex-okd-color-content-inverse);
  --dex-okd-checkbox-circle-default-border-color: var(--dex-okd-color-border-secondary);
  --dex-okd-checkbox-circle-default-background-color: var(--dex-okd-color-common-transparent);
  --dex-okd-checkbox-circle-default-disabled-background-color: var(--dex-okd-color-background-surface-disable);
  --dex-okd-checkbox-circle-default-disabled-border-color: var(--dex-okd-color-border-secondary);
  --dex-okd-checkbox-circle-checked-border-color: var(--dex-okd-color-border-selected);
  --dex-okd-checkbox-circle-checked-background-color: var(--dex-okd-color-content-primary);
  --dex-okd-checkbox-circle-checked-disabled-border-color: var(--dex-okd-color-common-transparent);
  --dex-okd-checkbox-circle-checked-disabled-background-color: var(--dex-okd-color-content-disabled)
}

.theme-dark .dex-checkbox-var,
.theme-dark.dex-checkbox-var {
  --dex-okd-checkbox-default-text-color: var(--dex-okd-color-content-secondary);
  --dex-okd-checkbox-default-background: var(--dex-okd-color-background-surface-contrast);
  --dex-okd-checkbox-default-border-color: var(--dex-okd-color-border-secondary);
  --dex-okd-checkbox-default-hover-border-color: var(--dex-okd-color-border-selected);
  --dex-okd-checkbox-default-shadow: 0px 0px 0px 0px #0000000d;
  --dex-okd-checkbox-default-hover-shadow: 0px 0px 0px 0px #0000000d;
  --dex-okd-checkbox-selected-text-color: var(--dex-okd-color-content-secondary);
  --dex-okd-checkbox-selected-background: var(--dex-okd-color-content-primary);
  --dex-okd-checkbox-selected-border-color: var(--dex-okd-color-content-primary);
  --dex-okd-checkbox-selected-hover-border-color: var(--dex-okd-color-content-primary);
  --dex-okd-checkbox-selected-inner-color: var(--dex-okd-color-content-inverse);
  --dex-okd-checkbox-selected-shadow: 0px 0px 0px 0px #0000000d;
  --dex-okd-checkbox-selected-hover-shadow: 0px 0px 0px 0px #0000000d;
  --dex-okd-checkbox-hover-border-color: #1453cc;
  --dex-okd-checkbox-error-text-color: var(--dex-okd-color-semantic-negative);
  --dex-okd-checkbox-error-border-color: var(--dex-okd-color-semantic-negative);
  --dex-okd-checkbox-error-hover-border-color: var(--dex-okd-color-semantic-negative);
  --dex-okd-checkbox-error-background: var(--dex-okd-color-semantic-negative);
  --dex-okd-checkbox-error-inner-color: var(--dex-okd-color-content-inverse);
  --dex-okd-checkbox-error-shadow: 0px 0px 0px 0px #0000000d;
  --dex-okd-checkbox-error-hover-shadow: 0px 0px 0px 0px #e35e5e73;
  --dex-okd-checkbox-disabled-text-color: var(--dex-okd-color-content-disabled);
  --dex-okd-checkbox-disabled-background: var(--dex-okd-color-background-surface-disable);
  --dex-okd-checkbox-disabled-border-color: var(--dex-okd-color-border-secondary);
  --dex-okd-checkbox-disabled-hover-border-color: var(--dex-okd-color-border-secondary);
  --dex-okd-checkbox-disabled-inner-color: var(--dex-okd-color-content-disabled);
  --dex-okd-checkbox-common-border-radius: 4px;
  --dex-okd-checkbox-common-label-font-size: var(--dex-okd-font-size-xs);
  --dex-okd-checkbox-sm-font-size: var(--dex-okd-font-size-xs);
  --dex-okd-checkbox-sm-line-height: var(--dex-okd-line-height-xs);
  --dex-okd-checkbox-sm-height: 12px;
  --dex-okd-checkbox-sm-width: 12px;
  --dex-okd-checkbox-sm-margin: 4px;
  --dex-okd-checkbox-sm-padding: 4px;
  --dex-okd-checkbox-md-font-size: var(--dex-okd-font-size-md);
  --dex-okd-checkbox-md-line-height: var(--dex-okd-line-height-md);
  --dex-okd-checkbox-md-height: 16px;
  --dex-okd-checkbox-md-width: 16px;
  --dex-okd-checkbox-md-margin: 8px;
  --dex-okd-checkbox-md-padding: 0;
  --dex-okd-checkbox-md-border-radius: 4px;
  --dex-okd-checkbox-sm-border-radius: 2px;
  --dex-okd-checkbox-reversed-default-text-color: #000;
  --dex-okd-checkbox-reversed-default-background: #fff;
  --dex-okd-checkbox-reversed-default-border-color: #909090;
  --dex-okd-checkbox-reversed-default-hover-border-color: #000;
  --dex-okd-checkbox-reversed-default-shadow: 0 0 0 0 transparent;
  --dex-okd-checkbox-reversed-default-hover-shadow: 0px 0px 0px 0px #0000001a;
  --dex-okd-checkbox-reversed-selected-text-color: #000;
  --dex-okd-checkbox-reversed-selected-background: #fff;
  --dex-okd-checkbox-reversed-selected-border-color: #000;
  --dex-okd-checkbox-reversed-selected-hover-border-color: #000;
  --dex-okd-checkbox-reversed-selected-inner-color: #000;
  --dex-okd-checkbox-reversed-selected-shadow: 0px 0px 0px 0px transparent;
  --dex-okd-checkbox-reversed-selected-hover-shadow: 0px 0px 0px 0px #0000001a;
  --dex-okd-checkbox-reversed-error-text-color: #f04872;
  --dex-okd-checkbox-reversed-error-border-color: #f04872;
  --dex-okd-checkbox-reversed-error-hover-border-color: #f04872;
  --dex-okd-checkbox-reversed-error-background: #f04872;
  --dex-okd-checkbox-reversed-error-inner-color: #fff;
  --dex-okd-checkbox-reversed-error-shadow: 0 0 0 0 transparent;
  --dex-okd-checkbox-reversed-error-hover-shadow: 0px 0px 0px 0px #f048721a;
  --dex-okd-checkbox-reversed-disabled-text-color: #ccc;
  --dex-okd-checkbox-reversed-disabled-background: #e3e3e3;
  --dex-okd-checkbox-reversed-disabled-border-color: #ccc;
  --dex-okd-checkbox-reversed-disabled-hover-border-color: #ccc;
  --dex-okd-checkbox-reversed-disabled-inner-color: #fff;
  --dex-okd-checkbox-circle-inner-color: var(--dex-okd-color-content-inverse);
  --dex-okd-checkbox-circle-default-border-color: var(--dex-okd-color-border-secondary);
  --dex-okd-checkbox-circle-default-background-color: var(--dex-okd-color-common-transparent);
  --dex-okd-checkbox-circle-default-disabled-background-color: var(--dex-okd-color-background-surface-disable);
  --dex-okd-checkbox-circle-default-disabled-border-color: var(--dex-okd-color-border-secondary);
  --dex-okd-checkbox-circle-checked-border-color: var(--dex-okd-color-border-selected);
  --dex-okd-checkbox-circle-checked-background-color: var(--dex-okd-color-content-primary);
  --dex-okd-checkbox-circle-checked-disabled-border-color: var(--dex-okd-color-common-transparent);
  --dex-okd-checkbox-circle-checked-disabled-background-color: var(--dex-okd-color-content-disabled)
}

.theme-light .dex-tooltip-var,
.theme-light.dex-tooltip-var {
  --dex-okd-tooltip-default-font-color: var(--dex-okd-color-content-inverse);
  --dex-okd-tooltip-neutral-background: var(--dex-okd-color-modal-contrast);
  --dex-okd-tooltip-negative-background: var(--dex-okd-color-semantic-negative);
  --dex-okd-tooltip-positive-background: var(--dex-okd-color-semantic-positive);
  --dex-okd-tooltip-informative-background: var(--dex-okd-color-semantic-informative)
}

.theme-dark .dex-tooltip-var,
.theme-dark.dex-tooltip-var {
  --dex-okd-tooltip-default-font-color: var(--dex-okd-color-content-primary);
  --dex-okd-tooltip-neutral-background: var(--dex-okd-color-modal-contrast);
  --dex-okd-tooltip-negative-background: var(--dex-okd-color-semantic-negative);
  --dex-okd-tooltip-positive-background: var(--dex-okd-color-semantic-positive);
  --dex-okd-tooltip-informative-background: var(--dex-okd-color-semantic-informative)
}

.theme-light .dex-skeleton-var,
.theme-light.dex-skeleton-var {
  --dex-okd-skeleton-avatar-sm-width: 24px;
  --dex-okd-skeleton-avatar-md-width: 64px;
  --dex-okd-skeleton-avatar-lg-width: 128px;
  --dex-okd-skeleton-avatar-square-border-radius: 4px;
  --dex-okd-skeleton-input-border-radius: 4px;
  --dex-okd-skeleton-input-sm-height: 24px;
  --dex-okd-skeleton-input-md-height: 40px;
  --dex-okd-skeleton-background-color: var(--dex-okd-color-surface-structural-layer-2);
  --dex-okd-skeleton-active-background-color: hsla(0, 0%, 91%, .2);
  --dex-okd-skeleton-reversed-background-color: var(--dex-okd-color-content-interactive-default);
  --dex-okd-skeleton-reversed-active-background-color: var(--dex-okd-color-surface-structural-inverse)
}

.theme-dark .dex-skeleton-var,
.theme-dark.dex-skeleton-var {
  --dex-okd-skeleton-active-background-color: hsla(0, 0%, 7%, .2);
  --dex-okd-skeleton-avatar-sm-width: 24px;
  --dex-okd-skeleton-avatar-md-width: 64px;
  --dex-okd-skeleton-avatar-lg-width: 128px;
  --dex-okd-skeleton-avatar-square-border-radius: 4px;
  --dex-okd-skeleton-input-border-radius: 4px;
  --dex-okd-skeleton-input-sm-height: 24px;
  --dex-okd-skeleton-input-md-height: 40px;
  --dex-okd-skeleton-background-color: var(--dex-okd-color-global-alpha-inverse-5);
  --dex-okd-skeleton-reversed-background-color: var(--dex-okd-color-content-interactive-default);
  --dex-okd-skeleton-reversed-active-background-color: var(--dex-okd-color-surface-structural-inverse)
}

.T7vNAe__dex {
  display: contents
}

.theme-light .dex-dragdrop-var,
.theme-light.dex-dragdrop-var {
  --dex-okd-dragdrop-sortable-item-default-background: var(--dex-okd-color-background-base-primary);
  --dex-okd-dragdrop-sortable-item-default-border-color: var(--dex-okd-color-border-primary);
  --dex-okd-dragdrop-sortable-item-active-border-color: #0569ff;
  --dex-okd-dragdrop-sortable-item-active-shadow: 0 10px 15px -3px #0000001a, 0 4px 6px -2px #0000000d;
  --dex-okd-dragdrop-sortable-overlay-background-color: #f5f9ff;
  --dex-okd-dragdrop-sortable-overlay-border-color: #277dff;
  --dex-okd-dragdrop-sortable-item-handler-default-color: var(--dex-okd-color-content-disabled)
}

.theme-dark .dex-dragdrop-var,
.theme-dark.dex-dragdrop-var {
  --dex-okd-dragdrop-sortable-item-default-background: var(--dex-okd-color-background-base-primary);
  --dex-okd-dragdrop-sortable-item-default-border-color: var(--dex-okd-color-border-primary);
  --dex-okd-dragdrop-sortable-item-active-border-color: #e3e3e3;
  --dex-okd-dragdrop-sortable-item-active-shadow: 0 10px 15px -3px #0000001a, 0 4px 6px -2px #0000000d;
  --dex-okd-dragdrop-sortable-overlay-background-color: rgba(0, 0, 0, .06);
  --dex-okd-dragdrop-sortable-overlay-border-color: #6c6c6c;
  --dex-okd-dragdrop-sortable-item-handler-default-color: var(--dex-okd-color-content-disabled)
}

.theme-light .dex-typography-var,
.theme-light.dex-typography-var {
  --dex-okd-typography-header-muted-color: #929292;
  --dex-okd-typography-header-medium-color: #000;
  --dex-okd-typography-header-amplified-color: #000;
  --dex-okd-typography-h1-font-size: 30px;
  --dex-okd-typography-h1-line-height: 32px;
  --dex-okd-typography-h2-font-size: 30px;
  --dex-okd-typography-h2-line-height: 32px;
  --dex-okd-typography-h3-font-size: 18px;
  --dex-okd-typography-h3-line-height: 24px;
  --dex-okd-typography-h4-font-size: 18px;
  --dex-okd-typography-h4-line-height: 24px;
  --dex-okd-typography-h5-font-size: 18px;
  --dex-okd-typography-h5-line-height: 24px;
  --dex-okd-typography-h6-font-size: 18px;
  --dex-okd-typography-h6-line-height: 24px;
  --dex-okd-typography-header-medium-font-weight: 500;
  --dex-okd-typography-header-amplified-font-weight: 500;
  --dex-okd-typography-text-muted-color: #929292;
  --dex-okd-typography-text-medium-color: #3d3d3d;
  --dex-okd-typography-text-amplified-color: #000;
  --dex-okd-typography-text-base-font-size: var(--dex-okd-font-size-base);
  --dex-okd-typography-text-base-line-height: var(--dex-okd-line-height-base);
  --dex-okd-typography-text-md-font-size: var(--dex-okd-font-size-md);
  --dex-okd-typography-text-md-line-height: var(--dex-okd-line-height-md);
  --dex-okd-typography-text-xs-font-size: var(--dex-okd-font-size-xs);
  --dex-okd-typography-text-xs-line-height: var(--dex-okd-line-height-xs);
  --dex-okd-typography-text-medium-font-weight: 400;
  --dex-okd-typography-text-amplified-font-weight: 500
}

.theme-dark .dex-typography-var,
.theme-dark.dex-typography-var {
  --dex-okd-typography-header-muted-color: #f0f0f0;
  --dex-okd-typography-header-medium-color: #fff;
  --dex-okd-typography-header-amplified-color: #fff;
  --dex-okd-typography-header-medium-font-weight: 500;
  --dex-okd-typography-header-amplified-font-weight: 500;
  --dex-okd-typography-h1-font-size: 30px;
  --dex-okd-typography-h1-line-height: 32px;
  --dex-okd-typography-h2-font-size: 30px;
  --dex-okd-typography-h2-line-height: 32px;
  --dex-okd-typography-h3-font-size: 18px;
  --dex-okd-typography-h3-line-height: 24px;
  --dex-okd-typography-h4-font-size: 18px;
  --dex-okd-typography-h4-line-height: 24px;
  --dex-okd-typography-h5-font-size: 18px;
  --dex-okd-typography-h5-line-height: 24px;
  --dex-okd-typography-h6-font-size: 18px;
  --dex-okd-typography-h6-line-height: 24px;
  --dex-okd-typography-text-base-font-size: var(--dex-okd-font-size-base);
  --dex-okd-typography-text-base-line-height: var(--dex-okd-line-height-base);
  --dex-okd-typography-text-md-font-size: var(--dex-okd-font-size-md);
  --dex-okd-typography-text-md-line-height: var(--dex-okd-line-height-md);
  --dex-okd-typography-text-xs-font-size: var(--dex-okd-font-size-xs);
  --dex-okd-typography-text-xs-line-height: var(--dex-okd-line-height-xs);
  --dex-okd-typography-text-muted-color: #909090;
  --dex-okd-typography-text-medium-color: #e3e3e3;
  --dex-okd-typography-text-amplified-color: #fff;
  --dex-okd-typography-text-medium-font-weight: 500;
  --dex-okd-typography-text-amplified-font-weight: 500
}

.theme-dark .dex-result-var,
.theme-dark.dex-result-var,
.theme-light .dex-result-var,
.theme-light.dex-result-var {
  --dex-okd-result-background-color: var(--dex-okd-color-background-base-primary);
  --dex-okd-result-sm-width: 136px;
  --dex-okd-result-lg-width: 216px;
  --dex-okd-result-sm-height: 136px;
  --dex-okd-result-lg-height: 216px;
  --dex-okd-result-title-color: var(--dex-okd-color-content-primary);
  --dex-okd-result-title-sm-font-size: 24px;
  --dex-okd-result-title-sm-font-weight: 700;
  --dex-okd-result-title-sm-line-height: 28px;
  --dex-okd-result-desc-color: var(--dex-okd-color-content-secondary);
  --dex-okd-result-desc-sm-font-size: 14px;
  --dex-okd-result-desc-sm-line-height: 22px;
  --dex-okd-result-desc-sm-margin-top: 16px;
  --dex-okd-result-extra-sm-margin-top: 24px
}

.mE3SEB__dex {
  align-items: center;
  display: flex;
  height: 100%;
  justify-content: center;
  width: 100%
}

.MFbHYN__dex {
  flex-direction: column;
  font-size: 14px;
  min-height: 200px
}

.MFbHYN__dex .Uz3YIg__dex {
  line-height: 16px;
  margin-bottom: 24px;
  text-align: center
}

.IyS75D__dex {
  flex-direction: row;
  font-size: 12px
}

.IyS75D__dex .Uz3YIg__dex {
  margin-right: 10px
}

.theme-light .dex-switch-var,
.theme-light.dex-switch-var {
  --dex-okd-switch-label-font-color: var(--dex-okd-color-content-secondary);
  --dex-okd-switch-on-default-track-color: #000;
  --dex-okd-switch-on-disabled-track-color: #f3f3f3;
  --dex-okd-switch-on-loading-track-color: #e6e6e6;
  --dex-okd-switch-on-default-handler-color: #fff;
  --dex-okd-switch-on-disabled-handler-color: #fff;
  --dex-okd-switch-on-loading-handler-color: #fff;
  --dex-okd-switch-on-default-handler-shadow: var(--dex-okd-shadow-xs);
  --dex-okd-switch-on-disabled-handler-shadow: var(--dex-okd-shadow-xs);
  --dex-okd-switch-on-loading-handler-shadow: var(--dex-okd-shadow-xs);
  --dex-okd-switch-on-loading-mark-color: var(--dex-okd-color-border-secondary);
  --dex-okd-switch-on-focus-shadow: 0px 0px 0px 3px #bdcfff73;
  --dex-okd-switch-off-default-track-color: #e6e6e6;
  --dex-okd-switch-off-disabled-track-color: #f3f3f3;
  --dex-okd-switch-off-loading-track-color: #e6e6e6;
  --dex-okd-switch-off-default-handler-color: #fff;
  --dex-okd-switch-off-disabled-handler-color: #fff;
  --dex-okd-switch-off-loading-handler-color: #fff;
  --dex-okd-switch-off-default-handler-shadow: var(--dex-okd-shadow-xs);
  --dex-okd-switch-off-disabled-handler-shadow: var(--dex-okd-shadow-xs);
  --dex-okd-switch-off-loading-handler-shadow: var(--dex-okd-shadow-xs);
  --dex-okd-switch-off-loading-mark-color: var(--dex-okd-color-border-secondary);
  --dex-okd-switch-off-focus-shadow: 0px 0px 0px 3px #bdcfff73;
  --dex-okd-switch-duration-seconds: 0.36s;
  --dex-okd-switch-md-label-size: var(--dex-okd-font-size-base);
  --dex-okd-switch-sm-label-size: var(--dex-okd-font-size-md);
  --dex-okd-switch-md-width: 40px;
  --dex-okd-switch-md-height: 24px;
  --dex-okd-switch-md-handler-size: 20px;
  --dex-okd-switch-sm-width: 28px;
  --dex-okd-switch-sm-height: 16px;
  --dex-okd-switch-sm-handler-size: 12px;
  --dex-okd-switch-theme-icon-color: var(--dex-okd-color-content-primary)
}

.theme-light .dex-popover-var,
.theme-light.dex-popover-var {
  --dex-okd-popover-background: #fff;
  --dex-okd-popover-link-color: var(--dex-okd-color-content-secondary);
  --dex-okd-popover-action-color: var(--dex-okd-color-content-secondary);
  --dex-okd-popover-title-color: var(--dex-okd-color-content-primary);
  --dex-okd-popover-title-line-height: 20px;
  --dex-okd-popover-title-background: #f6f6f6;
  --dex-okd-popover-desc-color: var(--dex-okd-color-content-secondary);
  --dex-okd-popover-md-font-size: 14px;
  --dex-okd-popover-md-title-font-size: 16px;
  --dex-okd-popover-md-line-height: 20px;
  --dex-okd-popover-sm-font-size: 12px;
  --dex-okd-popover-sm-title-font-size: 14px;
  --dex-okd-popover-sm-line-height: 16px;
  --dex-okd-popover-common-padding: 12px;
  --dex-okd-popover-common-layer-width: 280px;
  --dex-okd-popover-common-layer-shadow: rgba(0, 0, 0, .05) 0px 4px 6px -2px, rgba(0, 0, 0, .1) 0px 10px 15px -3px;
  --dex-okd-popover-desc-background: var(--dex-okd-color-modal-primary);
  --dex-okd-popover-layer-background: var(--dex-okd-color-modal-primary);
  --dex-okd-popover-layer-border-color: var(--dex-okd-color-transparent-white)
}

.GP2nUE__dex {
  align-items: center;
  display: flex;
  height: 100%;
  justify-content: center;
  width: 100%
}

.theme-dark .dex-switch-var,
.theme-dark.dex-switch-var {
  --dex-okd-switch-label-font-color: var(--dex-okd-color-content-secondary);
  --dex-okd-switch-on-default-track-color: #fff;
  --dex-okd-switch-on-disabled-track-color: #383838;
  --dex-okd-switch-on-loading-track-color: #fff;
  --dex-okd-switch-on-default-handler-color: #000;
  --dex-okd-switch-on-disabled-handler-color: #0e0e0e;
  --dex-okd-switch-on-loading-handler-color: #383838;
  --dex-okd-switch-on-default-handler-shadow: var(--dex-okd-shadow-xs);
  --dex-okd-switch-on-disabled-handler-shadow: var(--dex-okd-shadow-xs);
  --dex-okd-switch-on-loading-handler-shadow: var(--dex-okd-shadow-xs);
  --dex-okd-switch-on-loading-mark-color: #b3b3b3;
  --dex-okd-switch-on-focus-shadow: 0px 0px 0px 3px #2676ff40;
  --dex-okd-switch-off-default-track-color: #4d4d4d;
  --dex-okd-switch-off-disabled-track-color: #383838;
  --dex-okd-switch-off-loading-track-color: #4d4d4d;
  --dex-okd-switch-off-default-handler-color: #121212;
  --dex-okd-switch-off-disabled-handler-color: #0e0e0e;
  --dex-okd-switch-off-loading-handler-color: #121212;
  --dex-okd-switch-off-default-handler-shadow: var(--dex-okd-shadow-xs);
  --dex-okd-switch-off-disabled-handler-shadow: var(--dex-okd-shadow-xs);
  --dex-okd-switch-off-loading-handler-shadow: var(--dex-okd-shadow-xs);
  --dex-okd-switch-off-loading-mark-color: var(--dex-okd-color-border-secondary);
  --dex-okd-switch-off-focus-shadow: 0px 0px 0px 3px #2676ff40;
  --dex-okd-switch-duration-seconds: 0.36s;
  --dex-okd-switch-md-label-size: var(--dex-okd-font-size-base);
  --dex-okd-switch-sm-label-size: var(--dex-okd-font-size-md);
  --dex-okd-switch-sm-size: var(--dex-okd-font-size-md);
  --dex-okd-switch-md-size: var(--dex-okd-font-size-md);
  --dex-okd-switch-md-width: 40px;
  --dex-okd-switch-md-height: 24px;
  --dex-okd-switch-md-handler-size: 20px;
  --dex-okd-switch-sm-width: 28px;
  --dex-okd-switch-sm-height: 16px;
  --dex-okd-switch-sm-handler-size: 12px;
  --dex-okd-switch-theme-icon-color: var(--dex-okd-color-content-primary)
}

.theme-dark .dex-popover-var,
.theme-dark.dex-popover-var {
  --dex-okd-popover-background: #909090;
  --dex-okd-popover-link-color: var(--dex-okd-color-content-secondary);
  --dex-okd-popover-action-color: var(--dex-okd-color-content-secondary);
  --dex-okd-popover-title-color: var(--dex-okd-color-content-primary);
  --dex-okd-popover-title-line-height: 20px;
  --dex-okd-popover-title-background: #121212;
  --dex-okd-popover-desc-color: var(--dex-okd-color-content-secondary);
  --dex-okd-popover-md-font-size: 14px;
  --dex-okd-popover-md-title-font-size: 16px;
  --dex-okd-popover-md-line-height: 20px;
  --dex-okd-popover-sm-font-size: 12px;
  --dex-okd-popover-sm-title-font-size: 14px;
  --dex-okd-popover-sm-line-height: 16px;
  --dex-okd-popover-common-padding: 12px;
  --dex-okd-popover-common-layer-width: 280px;
  --dex-okd-popover-common-layer-shadow: rgba(0, 0, 0, .05) 0px 4px 6px -2px, rgba(0, 0, 0, .1) 0px 10px 15px -3px;
  --dex-okd-popover-desc-background: var(--dex-okd-color-modal-primary);
  --dex-okd-popover-layer-background: var(--dex-okd-color-modal-primary);
  --dex-okd-popover-layer-border-color: var(--dex-okd-color-border-primary)
}

.theme-light .dex-coachmark-var,
.theme-light.dex-coachmark-var {
  --dex-okd-coachmark-tour-footer-color: var(--dex-okd-color-content-contrast);
  --dex-okd-coachmark-tour-footer-font-size: 14px;
  --dex-okd-coachmark-tour-footer-margin-left: 8px;
  --dex-okd-coachmark-mask-color: rgba(0, 0, 0, .65);
  --dex-okd-coachmark-standalone-footer-margin-left: 8px;
  --dex-okd-coachmark-popover-arrow-background-color: var(--dex-okd-color-modal-secondary);
  --dex-okd-coachmark-popover-arrow-border-color: var(--dex-okd-color-border-primary);
  --dex-okd-coachmark-popover-footer-margin-top: 16px;
  --dex-okd-coachmark-popover-desc-font-size: 14px;
  --dex-okd-coachmark-popover-desc-line-height: 20px;
  --dex-okd-coachmark-popover-desc-color: var(--dex-okd-color-content-primary);
  --dex-okd-coachmark-popover-desc-margin-top: 8px;
  --dex-okd-coachmark-popover-close-margin-left: 12px;
  --dex-okd-coachmark-popover-close-font-size: 20px;
  --dex-okd-coachmark-popover-close-color: var(--dex-okd-color-content-tertiary);
  --dex-okd-coachmark-popover-title-font-size: 16px;
  --dex-okd-coachmark-popover-title-line-height: 20px;
  --dex-okd-coachmark-popover-title-color: var(--dex-okd-color-content-primary);
  --dex-okd-coachmark-popover-title-font-weight: 700;
  --dex-okd-coachmark-popover-width: 250px;
  --dex-okd-coachmark-popover-max-width: 375px;
  --dex-okd-coachmark-popover-padding: 16px;
  --dex-okd-coachmark-popover-background-color: var(--dex-okd-color-modal-secondary);
  --dex-okd-coachmark-popover-border-color: var(--dex-okd-color-border-primary);
  --dex-okd-coachmark-popover-border-radius: 8px;
  --dex-okd-coachmark-popover-border-shadow: 8px 8px 16px #00000014
}

.theme-dark .dex-coachmark-var,
.theme-dark.dex-coachmark-var {
  --dex-okd-coachmark-tour-footer-color: var(--dex-okd-color-content-contrast);
  --dex-okd-coachmark-tour-footer-font-size: 14px;
  --dex-okd-coachmark-tour-footer-margin-left: 8px;
  --dex-okd-coachmark-mask-color: rgba(0, 0, 0, .65);
  --dex-okd-coachmark-standalone-footer-margin-left: 8px;
  --dex-okd-coachmark-popover-arrow-background-color: var(--dex-okd-color-modal-secondary);
  --dex-okd-coachmark-popover-arrow-border-color: var(--dex-okd-color-border-secondary);
  --dex-okd-coachmark-popover-footer-margin-top: 16px;
  --dex-okd-coachmark-popover-desc-font-size: 14px;
  --dex-okd-coachmark-popover-desc-line-height: 20px;
  --dex-okd-coachmark-popover-desc-color: var(--dex-okd-color-content-primary);
  --dex-okd-coachmark-popover-desc-margin-top: 8px;
  --dex-okd-coachmark-popover-close-margin-left: 12px;
  --dex-okd-coachmark-popover-close-font-size: 20px;
  --dex-okd-coachmark-popover-close-color: var(--dex-okd-color-content-tertiary);
  --dex-okd-coachmark-popover-title-font-size: 16px;
  --dex-okd-coachmark-popover-title-line-height: 20px;
  --dex-okd-coachmark-popover-title-color: var(--dex-okd-color-content-primary);
  --dex-okd-coachmark-popover-title-font-weight: 700;
  --dex-okd-coachmark-popover-width: 250px;
  --dex-okd-coachmark-popover-max-width: 375px;
  --dex-okd-coachmark-popover-padding: 16px;
  --dex-okd-coachmark-popover-background-color: var(--dex-okd-color-modal-secondary);
  --dex-okd-coachmark-popover-border-color: var(--dex-okd-color-border-secondary);
  --dex-okd-coachmark-popover-border-radius: 8px;
  --dex-okd-coachmark-popover-border-shadow: 8px 8px 16px #00000014
}

.TTT31h__dex {
  align-items: center;
  display: flex;
  height: 100%;
  justify-content: center;
  width: 100%
}

.tuh4MF__dex {
  flex-direction: column;
  font-size: 14px;
  min-height: 200px
}

.tuh4MF__dex .Busa3q__dex {
  line-height: 16px;
  margin-bottom: 24px;
  text-align: center
}

.XxSAON__dex {
  flex-direction: row;
  font-size: 12px
}

.XxSAON__dex .Busa3q__dex {
  margin-right: 10px
}

.dex-okx-defi-surplus-coin {
  --ok-icon-font-family: "dex-ok-dc2c9dc6be"
}

.dex-okx-defi-surplus-coin:before {
  content: "\e2d1";
  font-family: dex-ok-dc2c9dc6be
}

.dex-okx-defi-bell-off_outline {
  --ok-icon-font-family: "dex-ok-dc2c9dc6be"
}

.dex-okx-defi-bell-off_outline:before {
  content: "\e2d0";
  font-family: dex-ok-dc2c9dc6be
}

.dex-okx-defi-upload {
  --ok-icon-font-family: "dex-ok-dc2c9dc6be"
}

.dex-okx-defi-upload:before {
  content: "\e2cf";
  font-family: dex-ok-dc2c9dc6be
}

.dex-okx-defi-smartmoney {
  --ok-icon-font-family: "dex-ok-dc2c9dc6be"
}

.dex-okx-defi-smartmoney:before {
  content: "\e2ce";
  font-family: dex-ok-dc2c9dc6be
}

.dex-okx-defi-surplus-outline {
  --ok-icon-font-family: "dex-ok-dc2c9dc6be"
}

.dex-okx-defi-surplus-outline:before {
  content: "\e2cc";
  font-family: dex-ok-dc2c9dc6be
}

.dex-okx-defi-surplus-solid {
  --ok-icon-font-family: "dex-ok-dc2c9dc6be"
}

.dex-okx-defi-surplus-solid:before {
  content: "\e2cd";
  font-family: dex-ok-dc2c9dc6be
}

.dex-okx-defi-demo-trading {
  --ok-icon-font-family: "dex-ok-dc2c9dc6be"
}

.dex-okx-defi-demo-trading:before {
  content: "\e2cb";
  font-family: dex-ok-dc2c9dc6be
}

.dex-okx-defi-chevron-left_alignleft {
  --ok-icon-font-family: "dex-ok-dc2c9dc6be"
}

.dex-okx-defi-chevron-left_alignleft:before {
  content: "\e2ca";
  font-family: dex-ok-dc2c9dc6be
}

.dex-okx-defi-mail-filled {
  --ok-icon-font-family: "dex-ok-dc2c9dc6be"
}

.dex-okx-defi-mail-filled:before {
  content: "\e2c9";
  font-family: dex-ok-dc2c9dc6be
}

.dex-okx-defi-forward {
  --ok-icon-font-family: "dex-ok-dc2c9dc6be"
}

.dex-okx-defi-forward:before {
  content: "\e2c8";
  font-family: dex-ok-dc2c9dc6be
}

.dex-okx-defi-volume-off_filled {
  --ok-icon-font-family: "dex-ok-dc2c9dc6be"
}

.dex-okx-defi-volume-off_filled:before {
  content: "\e2c7";
  font-family: dex-ok-dc2c9dc6be
}

.dex-okx-defi-volume-max_filled {
  --ok-icon-font-family: "dex-ok-dc2c9dc6be"
}

.dex-okx-defi-volume-max_filled:before {
  content: "\e2c6";
  font-family: dex-ok-dc2c9dc6be
}

.dex-okx-defi-okx-filled {
  --ok-icon-font-family: "dex-ok-dc2c9dc6be"
}

.dex-okx-defi-okx-filled:before {
  content: "\e2c5";
  font-family: dex-ok-dc2c9dc6be
}

.dex-okx-defi-nft-outline {
  --ok-icon-font-family: "dex-ok-dc2c9dc6be"
}

.dex-okx-defi-nft-outline:before {
  content: "\e2c4";
  font-family: dex-ok-dc2c9dc6be
}

.dex-okx-defi-blockchain-explorer {
  --ok-icon-font-family: "dex-ok-dc2c9dc6be"
}

.dex-okx-defi-blockchain-explorer:before {
  content: "\e2c3";
  font-family: dex-ok-dc2c9dc6be
}

.dex-okx-defi-globe {
  --ok-icon-font-family: "dex-ok-dc2c9dc6be"
}

.dex-okx-defi-globe:before {
  content: "\e2c2";
  font-family: dex-ok-dc2c9dc6be
}

.dex-okx-defi-dex-fishing {
  --ok-icon-font-family: "dex-ok-dc2c9dc6be"
}

.dex-okx-defi-dex-fishing:before {
  content: "\e2c1";
  font-family: dex-ok-dc2c9dc6be
}

.dex-okx-defi-video-filled {
  --ok-icon-font-family: "dex-ok-dc2c9dc6be"
}

.dex-okx-defi-video-filled:before {
  content: "\e2c0";
  font-family: dex-ok-dc2c9dc6be
}

.dex-okx-defi-web3-dapp-rankings {
  --ok-icon-font-family: "dex-ok-dc2c9dc6be"
}

.dex-okx-defi-web3-dapp-rankings:before {
  content: "\e2bf";
  font-family: dex-ok-dc2c9dc6be
}

.dex-okx-defi-web3-get_token {
  --ok-icon-font-family: "dex-ok-dc2c9dc6be"
}

.dex-okx-defi-web3-get_token:before {
  content: "\e2be";
  font-family: dex-ok-dc2c9dc6be
}

.dex-okx-defi-selected-outlined {
  --ok-icon-font-family: "dex-ok-dc2c9dc6be"
}

.dex-okx-defi-selected-outlined:before {
  content: "\e2bd";
  font-family: dex-ok-dc2c9dc6be
}

.dex-okx-defi-caret-up-24 {
  --ok-icon-font-family: "dex-ok-dc2c9dc6be"
}

.dex-okx-defi-caret-up-24:before {
  content: "\e2bb";
  font-family: dex-ok-dc2c9dc6be
}

.dex-okx-defi-caret-down-24 {
  --ok-icon-font-family: "dex-ok-dc2c9dc6be"
}

.dex-okx-defi-caret-down-24:before {
  content: "\e2bc";
  font-family: dex-ok-dc2c9dc6be
}

.dex-okx-defi-network-fee-fast-filled {
  --ok-icon-font-family: "dex-ok-dc2c9dc6be"
}

.dex-okx-defi-network-fee-fast-filled:before {
  content: "\e2ba";
  font-family: dex-ok-dc2c9dc6be
}

.dex-okx-defi-tutorial {
  --ok-icon-font-family: "dex-ok-dc2c9dc6be"
}

.dex-okx-defi-tutorial:before {
  content: "\e2b9";
  font-family: dex-ok-dc2c9dc6be
}

.dex-okx-defi-enlarge-window-outline {
  --ok-icon-font-family: "dex-ok-dc2c9dc6be"
}

.dex-okx-defi-enlarge-window-outline:before {
  content: "\e2b8";
  font-family: dex-ok-dc2c9dc6be
}

.dex-okx-defi-eye-show_filled {
  --ok-icon-font-family: "dex-ok-dc2c9dc6be"
}

.dex-okx-defi-eye-show_filled:before {
  content: "\e2b7";
  font-family: dex-ok-dc2c9dc6be
}

.dex-okx-defi-web3-24h-turnover {
  --ok-icon-font-family: "dex-ok-dc2c9dc6be"
}

.dex-okx-defi-web3-24h-turnover:before {
  content: "\e2b6";
  font-family: dex-ok-dc2c9dc6be
}

.dex-okx-defi-builder-outline {
  --ok-icon-font-family: "dex-ok-dc2c9dc6be"
}

.dex-okx-defi-builder-outline:before {
  content: "\e2b5";
  font-family: dex-ok-dc2c9dc6be
}

.dex-okx-defi-web3-orderbook {
  --ok-icon-font-family: "dex-ok-dc2c9dc6be"
}

.dex-okx-defi-web3-orderbook:before {
  content: "\e2b3";
  font-family: dex-ok-dc2c9dc6be
}

.dex-okx-defi-perpetual {
  --ok-icon-font-family: "dex-ok-dc2c9dc6be"
}

.dex-okx-defi-perpetual:before {
  content: "\e2b4";
  font-family: dex-ok-dc2c9dc6be
}

.dex-okx-defi-WeChat {
  --ok-icon-font-family: "dex-ok-dc2c9dc6be"
}

.dex-okx-defi-WeChat:before {
  content: "\e2b2";
  font-family: dex-ok-dc2c9dc6be
}

.dex-okx-defi-mail {
  --ok-icon-font-family: "dex-ok-dc2c9dc6be"
}

.dex-okx-defi-mail:before {
  content: "\e2b1";
  font-family: dex-ok-dc2c9dc6be
}

.dex-okx-defi-recurring-buy {
  --ok-icon-font-family: "dex-ok-dc2c9dc6be"
}

.dex-okx-defi-recurring-buy:before {
  content: "\e2b0";
  font-family: dex-ok-dc2c9dc6be
}

.dex-okx-defi-tips {
  --ok-icon-font-family: "dex-ok-dc2c9dc6be"
}

.dex-okx-defi-tips:before {
  content: "\e2af";
  font-family: dex-ok-dc2c9dc6be
}

.dex-okx-defi-trading-tutorial {
  --ok-icon-font-family: "dex-ok-dc2c9dc6be"
}

.dex-okx-defi-trading-tutorial:before {
  content: "\e2ae";
  font-family: dex-ok-dc2c9dc6be
}

.dex-okx-defi-web3-inscription {
  --ok-icon-font-family: "dex-ok-dc2c9dc6be"
}

.dex-okx-defi-web3-inscription:before {
  content: "\e2ad";
  font-family: dex-ok-dc2c9dc6be
}

.dex-okx-defi-mint {
  --ok-icon-font-family: "dex-ok-dc2c9dc6be"
}

.dex-okx-defi-mint:before {
  content: "\e2ac";
  font-family: dex-ok-dc2c9dc6be
}

.dex-okx-defi-line-chart {
  --ok-icon-font-family: "dex-ok-dc2c9dc6be"
}

.dex-okx-defi-line-chart:before {
  content: "\e2ab";
  font-family: dex-ok-dc2c9dc6be
}

.dex-okx-defi-history-filled {
  --ok-icon-font-family: "dex-ok-dc2c9dc6be"
}

.dex-okx-defi-history-filled:before {
  content: "\e2aa";
  font-family: dex-ok-dc2c9dc6be
}

.dex-okx-defi-unselected {
  --ok-icon-font-family: "dex-ok-dc2c9dc6be"
}

.dex-okx-defi-unselected:before {
  content: "\e2a9";
  font-family: dex-ok-dc2c9dc6be
}

.dex-okx-defi-list-filter {
  --ok-icon-font-family: "dex-ok-dc2c9dc6be"
}

.dex-okx-defi-list-filter:before {
  content: "\e2a8";
  font-family: dex-ok-dc2c9dc6be
}

.dex-okx-defi-fee-rule {
  --ok-icon-font-family: "dex-ok-dc2c9dc6be"
}

.dex-okx-defi-fee-rule:before {
  content: "\e2a7";
  font-family: dex-ok-dc2c9dc6be
}

.dex-okx-defi-plus-circle {
  --ok-icon-font-family: "dex-ok-dc2c9dc6be"
}

.dex-okx-defi-plus-circle:before {
  content: "\e2a5";
  font-family: dex-ok-dc2c9dc6be
}

.dex-okx-defi-plus-circle_filled {
  --ok-icon-font-family: "dex-ok-dc2c9dc6be"
}

.dex-okx-defi-plus-circle_filled:before {
  content: "\e2a6";
  font-family: dex-ok-dc2c9dc6be
}

.dex-okx-defi-box {
  --ok-icon-font-family: "dex-ok-dc2c9dc6be"
}

.dex-okx-defi-box:before {
  content: "\e2a4";
  font-family: dex-ok-dc2c9dc6be
}

.dex-okx-defi-insights {
  --ok-icon-font-family: "dex-ok-dc2c9dc6be"
}

.dex-okx-defi-insights:before {
  content: "\e2a3";
  font-family: dex-ok-dc2c9dc6be
}

.dex-okx-defi-add-to_shopping_cart {
  --ok-icon-font-family: "dex-ok-dc2c9dc6be"
}

.dex-okx-defi-add-to_shopping_cart:before {
  content: "\e2a2";
  font-family: dex-ok-dc2c9dc6be
}

.dex-okx-defi-options-outline {
  --ok-icon-font-family: "dex-ok-dc2c9dc6be"
}

.dex-okx-defi-options-outline:before {
  content: "\e2a1";
  font-family: dex-ok-dc2c9dc6be
}

.dex-okx-defi-Instagram-outline {
  --ok-icon-font-family: "dex-ok-dc2c9dc6be"
}

.dex-okx-defi-Instagram-outline:before {
  content: "\e2a0";
  font-family: dex-ok-dc2c9dc6be
}

.dex-okx-defi-brush {
  --ok-icon-font-family: "dex-ok-dc2c9dc6be"
}

.dex-okx-defi-brush:before {
  content: "\e29f";
  font-family: dex-ok-dc2c9dc6be
}

.dex-okx-defi-network-fee-standard {
  --ok-icon-font-family: "dex-ok-dc2c9dc6be"
}

.dex-okx-defi-network-fee-standard:before {
  content: "\e29e";
  font-family: dex-ok-dc2c9dc6be
}

.dex-okx-defi-network-fee-slow {
  --ok-icon-font-family: "dex-ok-dc2c9dc6be"
}

.dex-okx-defi-network-fee-slow:before {
  content: "\e29d";
  font-family: dex-ok-dc2c9dc6be
}

.dex-okx-defi-edit {
  --ok-icon-font-family: "dex-ok-dc2c9dc6be"
}

.dex-okx-defi-edit:before {
  content: "\e29c";
  font-family: dex-ok-dc2c9dc6be
}

.dex-okx-defi-web3-market {
  --ok-icon-font-family: "dex-ok-dc2c9dc6be"
}

.dex-okx-defi-web3-market:before {
  content: "\e29b";
  font-family: dex-ok-dc2c9dc6be
}

.dex-okx-defi-more {
  --ok-icon-font-family: "dex-ok-dc2c9dc6be"
}

.dex-okx-defi-more:before {
  content: "\e29a";
  font-family: dex-ok-dc2c9dc6be
}

.dex-okx-defi-Facebook {
  --ok-icon-font-family: "dex-ok-dc2c9dc6be"
}

.dex-okx-defi-Facebook:before {
  content: "\e299";
  font-family: dex-ok-dc2c9dc6be
}

.dex-okx-defi-calendar {
  --ok-icon-font-family: "dex-ok-dc2c9dc6be"
}

.dex-okx-defi-calendar:before {
  content: "\e298";
  font-family: dex-ok-dc2c9dc6be
}

.dex-okx-defi-subscribe {
  --ok-icon-font-family: "dex-ok-dc2c9dc6be"
}

.dex-okx-defi-subscribe:before {
  content: "\e296";
  font-family: dex-ok-dc2c9dc6be
}

.dex-okx-defi-subscribed {
  --ok-icon-font-family: "dex-ok-dc2c9dc6be"
}

.dex-okx-defi-subscribed:before {
  content: "\e297";
  font-family: dex-ok-dc2c9dc6be
}

.dex-okx-defi-web3-sniper {
  --ok-icon-font-family: "dex-ok-dc2c9dc6be"
}

.dex-okx-defi-web3-sniper:before {
  content: "\e295";
  font-family: dex-ok-dc2c9dc6be
}

.dex-okx-defi-swap-for-gas {
  --ok-icon-font-family: "dex-ok-dc2c9dc6be"
}

.dex-okx-defi-swap-for-gas:before {
  content: "\e294";
  font-family: dex-ok-dc2c9dc6be
}

.dex-okx-defi-token-outline {
  --ok-icon-font-family: "dex-ok-dc2c9dc6be"
}

.dex-okx-defi-token-outline:before {
  content: "\e292";
  font-family: dex-ok-dc2c9dc6be
}

.dex-okx-defi-token-filled {
  --ok-icon-font-family: "dex-ok-dc2c9dc6be"
}

.dex-okx-defi-token-filled:before {
  content: "\e293";
  font-family: dex-ok-dc2c9dc6be
}

.dex-okx-defi-copiers-filled {
  --ok-icon-font-family: "dex-ok-dc2c9dc6be"
}

.dex-okx-defi-copiers-filled:before {
  content: "\e291";
  font-family: dex-ok-dc2c9dc6be
}

.dex-okx-defi-checkmark {
  --ok-icon-font-family: "dex-ok-dc2c9dc6be"
}

.dex-okx-defi-checkmark:before {
  content: "\e290";
  font-family: dex-ok-dc2c9dc6be
}

.dex-okx-defi-chevron-right_alignright {
  --ok-icon-font-family: "dex-ok-dc2c9dc6be"
}

.dex-okx-defi-chevron-right_alignright:before {
  content: "\e28f";
  font-family: dex-ok-dc2c9dc6be
}

.dex-okx-defi-setting {
  --ok-icon-font-family: "dex-ok-dc2c9dc6be"
}

.dex-okx-defi-setting:before {
  content: "\e28d";
  font-family: dex-ok-dc2c9dc6be
}

.dex-okx-defi-setting-filled {
  --ok-icon-font-family: "dex-ok-dc2c9dc6be"
}

.dex-okx-defi-setting-filled:before {
  content: "\e28e";
  font-family: dex-ok-dc2c9dc6be
}

.dex-okx-defi-network-fee-fast {
  --ok-icon-font-family: "dex-ok-dc2c9dc6be"
}

.dex-okx-defi-network-fee-fast:before {
  content: "\e28c";
  font-family: dex-ok-dc2c9dc6be
}

.dex-okx-defi-hamburger-edit {
  --ok-icon-font-family: "dex-ok-dc2c9dc6be"
}

.dex-okx-defi-hamburger-edit:before {
  content: "\e28b";
  font-family: dex-ok-dc2c9dc6be
}

.dex-okx-defi-web3-loop {
  --ok-icon-font-family: "dex-ok-dc2c9dc6be"
}

.dex-okx-defi-web3-loop:before {
  content: "\e28a";
  font-family: dex-ok-dc2c9dc6be
}

.dex-okx-defi-party-outline {
  --ok-icon-font-family: "dex-ok-dc2c9dc6be"
}

.dex-okx-defi-party-outline:before {
  content: "\e288";
  font-family: dex-ok-dc2c9dc6be
}

.dex-okx-defi-party-filled {
  --ok-icon-font-family: "dex-ok-dc2c9dc6be"
}

.dex-okx-defi-party-filled:before {
  content: "\e289";
  font-family: dex-ok-dc2c9dc6be
}

.dex-okx-defi-exchange-tab {
  --ok-icon-font-family: "dex-ok-dc2c9dc6be"
}

.dex-okx-defi-exchange-tab:before {
  content: "\e287";
  font-family: dex-ok-dc2c9dc6be
}

.dex-okx-defi-fire-flame_filled {
  --ok-icon-font-family: "dex-ok-dc2c9dc6be"
}

.dex-okx-defi-fire-flame_filled:before {
  content: "\e285";
  font-family: dex-ok-dc2c9dc6be
}

.dex-okx-defi-fire-flame {
  --ok-icon-font-family: "dex-ok-dc2c9dc6be"
}

.dex-okx-defi-fire-flame:before {
  content: "\e286";
  font-family: dex-ok-dc2c9dc6be
}

.dex-okx-defi-refresh {
  --ok-icon-font-family: "dex-ok-dc2c9dc6be"
}

.dex-okx-defi-refresh:before {
  content: "\e284";
  font-family: dex-ok-dc2c9dc6be
}

.dex-okx-defi-user {
  --ok-icon-font-family: "dex-ok-dc2c9dc6be"
}

.dex-okx-defi-user:before {
  content: "\e283";
  font-family: dex-ok-dc2c9dc6be
}

.dex-okx-defi-caret-up {
  --ok-icon-font-family: "dex-ok-dc2c9dc6be"
}

.dex-okx-defi-caret-up:before {
  content: "\e281";
  font-family: dex-ok-dc2c9dc6be
}

.dex-okx-defi-caret-down {
  --ok-icon-font-family: "dex-ok-dc2c9dc6be"
}

.dex-okx-defi-caret-down:before {
  content: "\e282";
  font-family: dex-ok-dc2c9dc6be
}

.dex-okx-defi-minus {
  --ok-icon-font-family: "dex-ok-dc2c9dc6be"
}

.dex-okx-defi-minus:before {
  content: "\e280";
  font-family: dex-ok-dc2c9dc6be
}

.dex-okx-defi-pointer-down {
  --ok-icon-font-family: "dex-ok-dc2c9dc6be"
}

.dex-okx-defi-pointer-down:before {
  content: "\e27e";
  font-family: dex-ok-dc2c9dc6be
}

.dex-okx-defi-pointer-left {
  --ok-icon-font-family: "dex-ok-dc2c9dc6be"
}

.dex-okx-defi-pointer-left:before {
  content: "\e27f";
  font-family: dex-ok-dc2c9dc6be
}

.dex-okx-defi-okds-pointer_up {
  --ok-icon-font-family: "dex-ok-dc2c9dc6be"
}

.dex-okx-defi-okds-pointer_up:before {
  content: "\e27d";
  font-family: dex-ok-dc2c9dc6be
}

.dex-okx-defi-back-to_top {
  --ok-icon-font-family: "dex-ok-dc2c9dc6be"
}

.dex-okx-defi-back-to_top:before {
  content: "\e27c";
  font-family: dex-ok-dc2c9dc6be
}

.dex-okx-defi-clear-filled {
  --ok-icon-font-family: "dex-ok-dc2c9dc6be"
}

.dex-okx-defi-clear-filled:before {
  content: "\e27b";
  font-family: dex-ok-dc2c9dc6be
}

.dex-okx-defi-clear {
  --ok-icon-font-family: "dex-ok-dc2c9dc6be"
}

.dex-okx-defi-clear:before {
  content: "\e27a";
  font-family: dex-ok-dc2c9dc6be
}

.dex-okx-defi-question-mark {
  --ok-icon-font-family: "dex-ok-dc2c9dc6be"
}

.dex-okx-defi-question-mark:before {
  content: "\e279";
  font-family: dex-ok-dc2c9dc6be
}

.dex-okx-defi-chevron-left {
  --ok-icon-font-family: "dex-ok-dc2c9dc6be"
}

.dex-okx-defi-chevron-left:before {
  content: "\e278";
  font-family: dex-ok-dc2c9dc6be
}

.dex-okx-defi-locked {
  --ok-icon-font-family: "dex-ok-dc2c9dc6be"
}

.dex-okx-defi-locked:before {
  content: "\e277";
  font-family: dex-ok-dc2c9dc6be
}

.dex-okx-defi-plus {
  --ok-icon-font-family: "dex-ok-dc2c9dc6be"
}

.dex-okx-defi-plus:before {
  content: "\e276";
  font-family: dex-ok-dc2c9dc6be
}

.dex-okx-defi-spot {
  --ok-icon-font-family: "dex-ok-dc2c9dc6be"
}

.dex-okx-defi-spot:before {
  content: "\e274";
  font-family: dex-ok-dc2c9dc6be
}

.dex-okx-defi-spot-DCA {
  --ok-icon-font-family: "dex-ok-dc2c9dc6be"
}

.dex-okx-defi-spot-DCA:before {
  content: "\e275";
  font-family: dex-ok-dc2c9dc6be
}

.dex-okx-defi-warning-filled {
  --ok-icon-font-family: "dex-ok-dc2c9dc6be"
}

.dex-okx-defi-warning-filled:before {
  content: "\e273";
  font-family: dex-ok-dc2c9dc6be
}

.dex-okx-defi-warning {
  --ok-icon-font-family: "dex-ok-dc2c9dc6be"
}

.dex-okx-defi-warning:before {
  content: "\e272";
  font-family: dex-ok-dc2c9dc6be
}

.dex-okx-defi-sort-down {
  --ok-icon-font-family: "dex-ok-dc2c9dc6be"
}

.dex-okx-defi-sort-down:before {
  content: "\e271";
  font-family: dex-ok-dc2c9dc6be
}

.dex-okx-defi-filter {
  --ok-icon-font-family: "dex-ok-dc2c9dc6be"
}

.dex-okx-defi-filter:before {
  content: "\e270";
  font-family: dex-ok-dc2c9dc6be
}

.dex-okx-defi-selected {
  --ok-icon-font-family: "dex-ok-dc2c9dc6be"
}

.dex-okx-defi-selected:before {
  content: "\e26f";
  font-family: dex-ok-dc2c9dc6be
}

.dex-okx-defi-location-outline {
  --ok-icon-font-family: "dex-ok-dc2c9dc6be"
}

.dex-okx-defi-location-outline:before {
  content: "\e26e";
  font-family: dex-ok-dc2c9dc6be
}

.dex-okx-defi-explore-outline {
  --ok-icon-font-family: "dex-ok-dc2c9dc6be"
}

.dex-okx-defi-explore-outline:before {
  content: "\e26d";
  font-family: dex-ok-dc2c9dc6be
}

.dex-okx-defi-quick-filled {
  --ok-icon-font-family: "dex-ok-dc2c9dc6be"
}

.dex-okx-defi-quick-filled:before {
  content: "\e26c";
  font-family: dex-ok-dc2c9dc6be
}

.dex-okx-defi-star {
  --ok-icon-font-family: "dex-ok-dc2c9dc6be"
}

.dex-okx-defi-star:before {
  content: "\e26b";
  font-family: dex-ok-dc2c9dc6be
}

.dex-okx-defi-star-filled {
  --ok-icon-font-family: "dex-ok-dc2c9dc6be"
}

.dex-okx-defi-star-filled:before {
  content: "\e26a";
  font-family: dex-ok-dc2c9dc6be
}

.dex-okx-defi-airdrop-zone {
  --ok-icon-font-family: "dex-ok-dc2c9dc6be"
}

.dex-okx-defi-airdrop-zone:before {
  content: "\e269";
  font-family: dex-ok-dc2c9dc6be
}

.dex-okx-defi-airdrop-zone-filled {
  --ok-icon-font-family: "dex-ok-dc2c9dc6be"
}

.dex-okx-defi-airdrop-zone-filled:before {
  content: "\e268";
  font-family: dex-ok-dc2c9dc6be
}

.dex-okx-defi-bell {
  --ok-icon-font-family: "dex-ok-dc2c9dc6be"
}

.dex-okx-defi-bell:before {
  content: "\e267";
  font-family: dex-ok-dc2c9dc6be
}

.dex-okx-defi-globe-filled {
  --ok-icon-font-family: "dex-ok-dc2c9dc6be"
}

.dex-okx-defi-globe-filled:before {
  content: "\e266";
  font-family: dex-ok-dc2c9dc6be
}

.dex-okx-defi-clock {
  --ok-icon-font-family: "dex-ok-dc2c9dc6be"
}

.dex-okx-defi-clock:before {
  content: "\e265";
  font-family: dex-ok-dc2c9dc6be
}

.dex-okx-defi-search {
  --ok-icon-font-family: "dex-ok-dc2c9dc6be"
}

.dex-okx-defi-search:before {
  content: "\e264";
  font-family: dex-ok-dc2c9dc6be
}

.dex-okx-defi-unlink {
  --ok-icon-font-family: "dex-ok-dc2c9dc6be"
}

.dex-okx-defi-unlink:before {
  content: "\e263";
  font-family: dex-ok-dc2c9dc6be
}

.dex-okx-defi-Medium {
  --ok-icon-font-family: "dex-ok-dc2c9dc6be"
}

.dex-okx-defi-Medium:before {
  content: "\e262";
  font-family: dex-ok-dc2c9dc6be
}

.dex-okx-defi-Telegram {
  --ok-icon-font-family: "dex-ok-dc2c9dc6be"
}

.dex-okx-defi-Telegram:before {
  content: "\e261";
  font-family: dex-ok-dc2c9dc6be
}

.dex-okx-defi-X {
  --ok-icon-font-family: "dex-ok-dc2c9dc6be"
}

.dex-okx-defi-X:before {
  content: "\e260";
  font-family: dex-ok-dc2c9dc6be
}

.dex-okx-defi-Discord {
  --ok-icon-font-family: "dex-ok-dc2c9dc6be"
}

.dex-okx-defi-Discord:before {
  content: "\e25f";
  font-family: dex-ok-dc2c9dc6be
}

.dex-okx-defi-transfer {
  --ok-icon-font-family: "dex-ok-dc2c9dc6be"
}

.dex-okx-defi-transfer:before {
  content: "\e25e";
  font-family: dex-ok-dc2c9dc6be
}

.dex-okx-defi-pointer-right {
  --ok-icon-font-family: "dex-ok-dc2c9dc6be"
}

.dex-okx-defi-pointer-right:before {
  content: "\e25d";
  font-family: dex-ok-dc2c9dc6be
}

.dex-okx-defi-chevron-right {
  --ok-icon-font-family: "dex-ok-dc2c9dc6be"
}

.dex-okx-defi-chevron-right:before {
  content: "\e25c";
  font-family: dex-ok-dc2c9dc6be
}

.dex-okx-defi-close {
  --ok-icon-font-family: "dex-ok-dc2c9dc6be"
}

.dex-okx-defi-close:before {
  content: "\e25b";
  font-family: dex-ok-dc2c9dc6be
}

.dex-okx-defi-chevron-up {
  --ok-icon-font-family: "dex-ok-dc2c9dc6be"
}

.dex-okx-defi-chevron-up:before {
  content: "\e25a";
  font-family: dex-ok-dc2c9dc6be
}

.dex-okx-defi-chevron-down {
  --ok-icon-font-family: "dex-ok-dc2c9dc6be"
}

.dex-okx-defi-chevron-down:before {
  content: "\e259";
  font-family: dex-ok-dc2c9dc6be
}

.dex-okx-defi-information-filled {
  --ok-icon-font-family: "dex-ok-dc2c9dc6be"
}

.dex-okx-defi-information-filled:before {
  content: "\e258";
  font-family: dex-ok-dc2c9dc6be
}

.dex-okx-defi-information {
  --ok-icon-font-family: "dex-ok-dc2c9dc6be"
}

.dex-okx-defi-information:before {
  content: "\e257";
  font-family: dex-ok-dc2c9dc6be
}

.dex-okx-defi-bookmark {
  --ok-icon-font-family: "dex-ok-dc2c9dc6be"
}

.dex-okx-defi-bookmark:before {
  content: "\e256";
  font-family: dex-ok-dc2c9dc6be
}

.dex-okx-defi-like-filled {
  --ok-icon-font-family: "dex-ok-dc2c9dc6be"
}

.dex-okx-defi-like-filled:before {
  content: "\e255";
  font-family: dex-ok-dc2c9dc6be
}

.dex-okx-defi-like {
  --ok-icon-font-family: "dex-ok-dc2c9dc6be"
}

.dex-okx-defi-like:before {
  content: "\e254";
  font-family: dex-ok-dc2c9dc6be
}

.dex-okx-defi-web3-linked-accounts {
  --ok-icon-font-family: "dex-ok-dc2c9dc6be"
}

.dex-okx-defi-web3-linked-accounts:before {
  content: "\e253";
  font-family: dex-ok-dc2c9dc6be
}

.dex-okx-defi-dex-sa-tracker {
  --ok-icon-font-family: "dex-ok-dc2c9dc6be"
}

.dex-okx-defi-dex-sa-tracker:before {
  content: "\e252";
  font-family: dex-ok-dc2c9dc6be
}

.dex-okx-defi-sort {
  --ok-icon-font-family: "dex-ok-dc2c9dc6be"
}

.dex-okx-defi-sort:before {
  content: "\e251";
  font-family: dex-ok-dc2c9dc6be
}

.dex-okx-defi-minus-circle {
  --ok-icon-font-family: "dex-ok-dc2c9dc6be"
}

.dex-okx-defi-minus-circle:before {
  content: "\e250";
  font-family: dex-ok-dc2c9dc6be
}

.dex-okx-defi-picture {
  --ok-icon-font-family: "dex-ok-dc2c9dc6be"
}

.dex-okx-defi-picture:before {
  content: "\e24f";
  font-family: dex-ok-dc2c9dc6be
}

.dex-okx-defi-web3-shield {
  --ok-icon-font-family: "dex-ok-dc2c9dc6be"
}

.dex-okx-defi-web3-shield:before {
  content: "\e24e";
  font-family: dex-ok-dc2c9dc6be
}

.dex-okx-defi-network-disconnected {
  --ok-icon-font-family: "dex-ok-dc2c9dc6be"
}

.dex-okx-defi-network-disconnected:before {
  content: "\e24b";
  font-family: dex-ok-dc2c9dc6be
}

.dex-okx-defi-network-stable {
  --ok-icon-font-family: "dex-ok-dc2c9dc6be"
}

.dex-okx-defi-network-stable:before {
  content: "\e24c";
  font-family: dex-ok-dc2c9dc6be
}

.dex-okx-defi-network-unstable {
  --ok-icon-font-family: "dex-ok-dc2c9dc6be"
}

.dex-okx-defi-network-unstable:before {
  content: "\e24d";
  font-family: dex-ok-dc2c9dc6be
}

.dex-okx-defi-web3-leaderboard-filled {
  --ok-icon-font-family: "dex-ok-dc2c9dc6be"
}

.dex-okx-defi-web3-leaderboard-filled:before {
  content: "\e24a";
  font-family: dex-ok-dc2c9dc6be
}

.dex-okx-defi-tokens-filled {
  --ok-icon-font-family: "dex-ok-dc2c9dc6be"
}

.dex-okx-defi-tokens-filled:before {
  content: "\e249";
  font-family: dex-ok-dc2c9dc6be
}

.dex-okx-defi-loading {
  --ok-icon-font-family: "dex-ok-dc2c9dc6be"
}

.dex-okx-defi-loading:before {
  content: "\e248";
  font-family: dex-ok-dc2c9dc6be
}

.dex-okx-defi-illimited {
  --ok-icon-font-family: "dex-ok-dc2c9dc6be"
}

.dex-okx-defi-illimited:before {
  content: "\e247";
  font-family: dex-ok-dc2c9dc6be
}

.dex-okx-defi-facebook {
  --ok-icon-font-family: "dex-ok-dc2c9dc6be"
}

.dex-okx-defi-facebook:before {
  content: "\e246";
  font-family: dex-ok-dc2c9dc6be
}

.dex-okx-defi-telegram {
  --ok-icon-font-family: "dex-ok-dc2c9dc6be"
}

.dex-okx-defi-telegram:before {
  content: "\e245";
  font-family: dex-ok-dc2c9dc6be
}

.dex-okx-defi-dexscreener {
  --ok-icon-font-family: "dex-ok-dc2c9dc6be"
}

.dex-okx-defi-dexscreener:before {
  content: "\e244";
  font-family: dex-ok-dc2c9dc6be
}

.dex-okx-defi-officialwebsite {
  --ok-icon-font-family: "dex-ok-dc2c9dc6be"
}

.dex-okx-defi-officialwebsite:before {
  content: "\e243";
  font-family: dex-ok-dc2c9dc6be
}

.dex-okx-defi-security-off_outline {
  --ok-icon-font-family: "dex-ok-dc2c9dc6be"
}

.dex-okx-defi-security-off_outline:before {
  content: "\e240";
  font-family: dex-ok-dc2c9dc6be
}

.dex-okx-defi-security {
  --ok-icon-font-family: "dex-ok-dc2c9dc6be"
}

.dex-okx-defi-security:before {
  content: "\e242";
  font-family: dex-ok-dc2c9dc6be
}

.dex-okx-defi-copy-trading {
  --ok-icon-font-family: "dex-ok-dc2c9dc6be"
}

.dex-okx-defi-copy-trading:before {
  content: "\e23f";
  font-family: dex-ok-dc2c9dc6be
}

.dex-okx-defi-line-draw {
  --ok-icon-font-family: "dex-ok-dc2c9dc6be"
}

.dex-okx-defi-line-draw:before {
  content: "\e23d";
  font-family: dex-ok-dc2c9dc6be
}

.dex-okx-defi-web3-leaderboard {
  --ok-icon-font-family: "dex-ok-dc2c9dc6be"
}

.dex-okx-defi-web3-leaderboard:before {
  content: "\e23b";
  font-family: dex-ok-dc2c9dc6be
}

.dex-okx-defi-ai-filled {
  --ok-icon-font-family: "dex-ok-dc2c9dc6be"
}

.dex-okx-defi-ai-filled:before {
  content: "\e238";
  font-family: dex-ok-dc2c9dc6be
}

.dex-okx-defi-coin-api {
  --ok-icon-font-family: "dex-ok-dc2c9dc6be"
}

.dex-okx-defi-coin-api:before {
  content: "\e237";
  font-family: dex-ok-dc2c9dc6be
}

.dex-okx-defi-social-update {
  --ok-icon-font-family: "dex-ok-dc2c9dc6be"
}

.dex-okx-defi-social-update:before {
  content: "\e236";
  font-family: dex-ok-dc2c9dc6be
}

.dex-okx-defi-cto {
  --ok-icon-font-family: "dex-ok-dc2c9dc6be"
}

.dex-okx-defi-cto:before {
  content: "\e235";
  font-family: dex-ok-dc2c9dc6be
}

.dex-okx-defi-quick-trade {
  --ok-icon-font-family: "dex-ok-dc2c9dc6be"
}

.dex-okx-defi-quick-trade:before {
  content: "\e234";
  font-family: dex-ok-dc2c9dc6be
}

.dex-okx-defi-loudspeaker-filled {
  --ok-icon-font-family: "dex-ok-dc2c9dc6be"
}

.dex-okx-defi-loudspeaker-filled:before {
  content: "\e233";
  font-family: dex-ok-dc2c9dc6be
}

.dex-okx-defi-dex-drag {
  --ok-icon-font-family: "dex-ok-dc2c9dc6be"
}

.dex-okx-defi-dex-drag:before {
  content: "\e232";
  font-family: dex-ok-dc2c9dc6be
}

.dex-okx-defi-dex-keyboard {
  --ok-icon-font-family: "dex-ok-dc2c9dc6be"
}

.dex-okx-defi-dex-keyboard:before {
  content: "\e231";
  font-family: dex-ok-dc2c9dc6be
}

.dex-okx-defi-broadcast {
  --ok-icon-font-family: "dex-ok-dc2c9dc6be"
}

.dex-okx-defi-broadcast:before {
  content: "\e230";
  font-family: dex-ok-dc2c9dc6be
}

.dex-okx-defi-classic-mode {
  --ok-icon-font-family: "dex-ok-dc2c9dc6be"
}

.dex-okx-defi-classic-mode:before {
  content: "\e22f";
  font-family: dex-ok-dc2c9dc6be
}

.dex-okx-defi-dex-meme-mode-filled {
  --ok-icon-font-family: "dex-ok-dc2c9dc6be"
}

.dex-okx-defi-dex-meme-mode-filled:before {
  content: "\e1c1";
  font-family: dex-ok-dc2c9dc6be
}

.dex-okx-defi-web3-rewards {
  --ok-icon-font-family: "dex-ok-dc2c9dc6be"
}

.dex-okx-defi-web3-rewards:before {
  content: "\e22e";
  font-family: dex-ok-dc2c9dc6be
}

.dex-okx-defi-large-caps-moon {
  --ok-icon-font-family: "dex-ok-dc2c9dc6be"
}

.dex-okx-defi-large-caps-moon:before {
  content: "\e22a";
  font-family: dex-ok-dc2c9dc6be
}

.dex-okx-defi-polyline {
  --ok-icon-font-family: "dex-ok-dc2c9dc6be"
}

.dex-okx-defi-polyline:before {
  content: "\e22b";
  font-family: dex-ok-dc2c9dc6be
}

.dex-okx-defi-price-tag-filled {
  --ok-icon-font-family: "dex-ok-dc2c9dc6be"
}

.dex-okx-defi-price-tag-filled:before {
  content: "\e22c";
  font-family: dex-ok-dc2c9dc6be
}

.dex-okx-defi-seagull {
  --ok-icon-font-family: "dex-ok-dc2c9dc6be"
}

.dex-okx-defi-seagull:before {
  content: "\e22d";
  font-family: dex-ok-dc2c9dc6be
}

.dex-okx-defi-dex-fee-filled {
  --ok-icon-font-family: "dex-ok-dc2c9dc6be"
}

.dex-okx-defi-dex-fee-filled:before {
  content: "\e229";
  font-family: dex-ok-dc2c9dc6be
}

.dex-okx-defi-dex-diamond-outline {
  --ok-icon-font-family: "dex-ok-dc2c9dc6be"
}

.dex-okx-defi-dex-diamond-outline:before {
  content: "\e228";
  font-family: dex-ok-dc2c9dc6be
}

.dex-okx-defi-dex-topholder {
  --ok-icon-font-family: "dex-ok-dc2c9dc6be"
}

.dex-okx-defi-dex-topholder:before {
  content: "\e227";
  font-family: dex-ok-dc2c9dc6be
}

.dex-okx-defi-dex-blockdev {
  --ok-icon-font-family: "dex-ok-dc2c9dc6be"
}

.dex-okx-defi-dex-blockdev:before {
  content: "\e226";
  font-family: dex-ok-dc2c9dc6be
}

.dex-okx-defi-dex-dev {
  --ok-icon-font-family: "dex-ok-dc2c9dc6be"
}

.dex-okx-defi-dex-dev:before {
  content: "\e225";
  font-family: dex-ok-dc2c9dc6be
}

.dex-okx-defi-trade-panel {
  --ok-icon-font-family: "dex-ok-dc2c9dc6be"
}

.dex-okx-defi-trade-panel:before {
  content: "\e223";
  font-family: dex-ok-dc2c9dc6be
}

.dex-okx-defi-trade-table {
  --ok-icon-font-family: "dex-ok-dc2c9dc6be"
}

.dex-okx-defi-trade-table:before {
  content: "\e224";
  font-family: dex-ok-dc2c9dc6be
}

.dex-okx-defi-dex-aped {
  --ok-icon-font-family: "dex-ok-dc2c9dc6be"
}

.dex-okx-defi-dex-aped:before {
  content: "\e222";
  font-family: dex-ok-dc2c9dc6be
}

.dex-okx-defi-trade-simple {
  --ok-icon-font-family: "dex-ok-dc2c9dc6be"
}

.dex-okx-defi-trade-simple:before {
  content: "\e221";
  font-family: dex-ok-dc2c9dc6be
}

.dex-okx-defi-dex-polyline {
  --ok-icon-font-family: "dex-ok-dc2c9dc6be"
}

.dex-okx-defi-dex-polyline:before {
  content: "\e220";
  font-family: dex-ok-dc2c9dc6be
}

.dex-okx-defi-web3-shield-filled {
  --ok-icon-font-family: "dex-ok-dc2c9dc6be"
}

.dex-okx-defi-web3-shield-filled:before {
  content: "\e21f";
  font-family: dex-ok-dc2c9dc6be
}

.dex-okx-defi-tokens-outline {
  --ok-icon-font-family: "dex-ok-dc2c9dc6be"
}

.dex-okx-defi-tokens-outline:before {
  content: "\e21e";
  font-family: dex-ok-dc2c9dc6be
}

.dex-okx-defi-onchain-earn {
  --ok-icon-font-family: "dex-ok-dc2c9dc6be"
}

.dex-okx-defi-onchain-earn:before {
  content: "\e21d";
  font-family: dex-ok-dc2c9dc6be
}

.dex-okx-defi-confirm-currency-outline {
  --ok-icon-font-family: "dex-ok-dc2c9dc6be"
}

.dex-okx-defi-confirm-currency-outline:before {
  content: "\e21c";
  font-family: dex-ok-dc2c9dc6be
}

.dex-okx-defi-dex-bubblemap {
  --ok-icon-font-family: "dex-ok-dc2c9dc6be"
}

.dex-okx-defi-dex-bubblemap:before {
  content: "\e21b";
  font-family: dex-ok-dc2c9dc6be
}

.dex-okx-defi-dex-bundler {
  --ok-icon-font-family: "dex-ok-dc2c9dc6be"
}

.dex-okx-defi-dex-bundler:before {
  content: "\e21a";
  font-family: dex-ok-dc2c9dc6be
}

.dex-okx-defi-web3-edit {
  --ok-icon-font-family: "dex-ok-dc2c9dc6be"
}

.dex-okx-defi-web3-edit:before {
  content: "\e219";
  font-family: dex-ok-dc2c9dc6be
}

.dex-okx-defi-translation {
  --ok-icon-font-family: "dex-ok-dc2c9dc6be"
}

.dex-okx-defi-translation:before {
  content: "\e218";
  font-family: dex-ok-dc2c9dc6be
}

.dex-okx-defi-user-outline {
  --ok-icon-font-family: "dex-ok-dc2c9dc6be"
}

.dex-okx-defi-user-outline:before {
  content: "\e217";
  font-family: dex-ok-dc2c9dc6be
}

.dex-okx-defi-user-filled {
  --ok-icon-font-family: "dex-ok-dc2c9dc6be"
}

.dex-okx-defi-user-filled:before {
  content: "\e216";
  font-family: dex-ok-dc2c9dc6be
}

.dex-okx-defi-volume-off-filled {
  --ok-icon-font-family: "dex-ok-dc2c9dc6be"
}

.dex-okx-defi-volume-off-filled:before {
  content: "\e215";
  font-family: dex-ok-dc2c9dc6be
}

.dex-okx-defi-recall-message {
  --ok-icon-font-family: "dex-ok-dc2c9dc6be"
}

.dex-okx-defi-recall-message:before {
  content: "\e214";
  font-family: dex-ok-dc2c9dc6be
}

.dex-okx-defi-translation-off {
  --ok-icon-font-family: "dex-ok-dc2c9dc6be"
}

.dex-okx-defi-translation-off:before {
  content: "\e213";
  font-family: dex-ok-dc2c9dc6be
}

.dex-okx-defi-fire-flame-filled {
  --ok-icon-font-family: "dex-ok-dc2c9dc6be"
}

.dex-okx-defi-fire-flame-filled:before {
  content: "\e212";
  font-family: dex-ok-dc2c9dc6be
}

.dex-okx-defi-feather-filled {
  --ok-icon-font-family: "dex-ok-dc2c9dc6be"
}

.dex-okx-defi-feather-filled:before {
  content: "\e211";
  font-family: dex-ok-dc2c9dc6be
}

.dex-okx-defi-feather-outline {
  --ok-icon-font-family: "dex-ok-dc2c9dc6be"
}

.dex-okx-defi-feather-outline:before {
  content: "\e210";
  font-family: dex-ok-dc2c9dc6be
}

.dex-okx-defi-message-filled {
  --ok-icon-font-family: "dex-ok-dc2c9dc6be"
}

.dex-okx-defi-message-filled:before {
  content: "\e20f";
  font-family: dex-ok-dc2c9dc6be
}

.dex-okx-defi-dex-remove-liquidity {
  --ok-icon-font-family: "dex-ok-dc2c9dc6be"
}

.dex-okx-defi-dex-remove-liquidity:before {
  content: "\e20d";
  font-family: dex-ok-dc2c9dc6be
}

.dex-okx-defi-dex-add-liquidity {
  --ok-icon-font-family: "dex-ok-dc2c9dc6be"
}

.dex-okx-defi-dex-add-liquidity:before {
  content: "\e20e";
  font-family: dex-ok-dc2c9dc6be
}

.dex-okx-defi-single-candle {
  --ok-icon-font-family: "dex-ok-dc2c9dc6be"
}

.dex-okx-defi-single-candle:before {
  content: "\e20c";
  font-family: dex-ok-dc2c9dc6be
}

.dex-okx-defi-eye-show {
  --ok-icon-font-family: "dex-ok-dc2c9dc6be"
}

.dex-okx-defi-eye-show:before {
  content: "\e20b";
  font-family: dex-ok-dc2c9dc6be
}

.dex-okx-defi-eye-hide {
  --ok-icon-font-family: "dex-ok-dc2c9dc6be"
}

.dex-okx-defi-eye-hide:before {
  content: "\e20a";
  font-family: dex-ok-dc2c9dc6be
}

.dex-okx-defi-volume-max-filled {
  --ok-icon-font-family: "dex-ok-dc2c9dc6be"
}

.dex-okx-defi-volume-max-filled:before {
  content: "\e209";
  font-family: dex-ok-dc2c9dc6be
}

.dex-okx-defi-play {
  --ok-icon-font-family: "dex-ok-dc2c9dc6be"
}

.dex-okx-defi-play:before {
  content: "\e208";
  font-family: dex-ok-dc2c9dc6be
}

.dex-okx-defi-authentication-filled {
  --ok-icon-font-family: "dex-ok-dc2c9dc6be"
}

.dex-okx-defi-authentication-filled:before {
  content: "\e207";
  font-family: dex-ok-dc2c9dc6be
}

.dex-okx-defi-switch-view-frame-filled {
  --ok-icon-font-family: "dex-ok-dc2c9dc6be"
}

.dex-okx-defi-switch-view-frame-filled:before {
  content: "\e206";
  font-family: dex-ok-dc2c9dc6be
}

.dex-okx-defi-camera {
  --ok-icon-font-family: "dex-ok-dc2c9dc6be"
}

.dex-okx-defi-camera:before {
  content: "\e205";
  font-family: dex-ok-dc2c9dc6be
}

.dex-okx-defi-dex-ready-to-claim {
  --ok-icon-font-family: "dex-ok-dc2c9dc6be"
}

.dex-okx-defi-dex-ready-to-claim:before {
  content: "\e204";
  font-family: dex-ok-dc2c9dc6be
}

.dex-okx-defi-web3-report {
  --ok-icon-font-family: "dex-ok-dc2c9dc6be"
}

.dex-okx-defi-web3-report:before {
  content: "\e203";
  font-family: dex-ok-dc2c9dc6be
}

.dex-okx-defi-open-pop-up-window {
  --ok-icon-font-family: "dex-ok-dc2c9dc6be"
}

.dex-okx-defi-open-pop-up-window:before {
  content: "\e202";
  font-family: dex-ok-dc2c9dc6be
}

.dex-okx-defi-linkedIn {
  --ok-icon-font-family: "dex-ok-dc2c9dc6be"
}

.dex-okx-defi-linkedIn:before {
  content: "\e201";
  font-family: dex-ok-dc2c9dc6be
}

.dex-okx-defi-loudspeaker {
  --ok-icon-font-family: "dex-ok-dc2c9dc6be"
}

.dex-okx-defi-loudspeaker:before {
  content: "\e200";
  font-family: dex-ok-dc2c9dc6be
}

.dex-okx-defi-kol {
  --ok-icon-font-family: "dex-ok-dc2c9dc6be"
}

.dex-okx-defi-kol:before {
  content: "\e1ff";
  font-family: dex-ok-dc2c9dc6be
}

.dex-okx-defi-settings-filled {
  --ok-icon-font-family: "dex-ok-dc2c9dc6be"
}

.dex-okx-defi-settings-filled:before {
  content: "\e1fe";
  font-family: dex-ok-dc2c9dc6be
}

.dex-okx-defi-switch-view-chart-filled {
  --ok-icon-font-family: "dex-ok-dc2c9dc6be"
}

.dex-okx-defi-switch-view-chart-filled:before {
  content: "\e1fd";
  font-family: dex-ok-dc2c9dc6be
}

.dex-okx-defi-web3-share {
  --ok-icon-font-family: "dex-ok-dc2c9dc6be"
}

.dex-okx-defi-web3-share:before {
  content: "\e1c5";
  font-family: dex-ok-dc2c9dc6be
}

.dex-okx-defi-web3-open-link {
  --ok-icon-font-family: "dex-ok-dc2c9dc6be"
}

.dex-okx-defi-web3-open-link:before {
  content: "\e192";
  font-family: dex-ok-dc2c9dc6be
}

.dex-okx-defi-watchlist-outline {
  --ok-icon-font-family: "dex-ok-dc2c9dc6be"
}

.dex-okx-defi-watchlist-outline:before {
  content: "\e1fc";
  font-family: dex-ok-dc2c9dc6be
}

.dex-okx-defi-signal-outline {
  --ok-icon-font-family: "dex-ok-dc2c9dc6be"
}

.dex-okx-defi-signal-outline:before {
  content: "\e1fb";
  font-family: dex-ok-dc2c9dc6be
}

.dex-okx-defi-tracker-outline {
  --ok-icon-font-family: "dex-ok-dc2c9dc6be"
}

.dex-okx-defi-tracker-outline:before {
  content: "\e1fa";
  font-family: dex-ok-dc2c9dc6be
}

.dex-okx-defi-pump-outline {
  --ok-icon-font-family: "dex-ok-dc2c9dc6be"
}

.dex-okx-defi-pump-outline:before {
  content: "\e1f9";
  font-family: dex-ok-dc2c9dc6be
}

.dex-okx-defi-dex-tracker {
  --ok-icon-font-family: "dex-ok-dc2c9dc6be"
}

.dex-okx-defi-dex-tracker:before {
  content: "\e1f8";
  font-family: dex-ok-dc2c9dc6be
}

.dex-okx-defi-dex-10min-migrated {
  --ok-icon-font-family: "dex-ok-dc2c9dc6be"
}

.dex-okx-defi-dex-10min-migrated:before {
  content: "\e1f7";
  font-family: dex-ok-dc2c9dc6be
}

.dex-okx-defi-dex-low-liquidity {
  --ok-icon-font-family: "dex-ok-dc2c9dc6be"
}

.dex-okx-defi-dex-low-liquidity:before {
  content: "\e1a5";
  font-family: dex-ok-dc2c9dc6be
}

.dex-okx-defi-dex-calendar {
  --ok-icon-font-family: "dex-ok-dc2c9dc6be"
}

.dex-okx-defi-dex-calendar:before {
  content: "\e1f6";
  font-family: dex-ok-dc2c9dc6be
}

.dex-okx-defi-web3-get-token {
  --ok-icon-font-family: "dex-ok-dc2c9dc6be"
}

.dex-okx-defi-web3-get-token:before {
  content: "\e1f5";
  font-family: dex-ok-dc2c9dc6be
}

.dex-okx-defi-dex-radar {
  --ok-icon-font-family: "dex-ok-dc2c9dc6be"
}

.dex-okx-defi-dex-radar:before {
  content: "\e1f4";
  font-family: dex-ok-dc2c9dc6be
}

.dex-okx-defi-rugpull-filled {
  --ok-icon-font-family: "dex-ok-dc2c9dc6be"
}

.dex-okx-defi-rugpull-filled:before {
  content: "\e1f3";
  font-family: dex-ok-dc2c9dc6be
}

.dex-okx-defi-white-paper {
  --ok-icon-font-family: "dex-ok-dc2c9dc6be"
}

.dex-okx-defi-white-paper:before {
  content: "\e1f2";
  font-family: dex-ok-dc2c9dc6be
}

.dex-okx-defi-explore {
  --ok-icon-font-family: "dex-ok-dc2c9dc6be"
}

.dex-okx-defi-explore:before {
  content: "\e1f1";
  font-family: dex-ok-dc2c9dc6be
}

.dex-okx-defi-browser {
  --ok-icon-font-family: "dex-ok-dc2c9dc6be"
}

.dex-okx-defi-browser:before {
  content: "\e1f0";
  font-family: dex-ok-dc2c9dc6be
}

.dex-okx-defi-web3-volume-small {
  --ok-icon-font-family: "dex-ok-dc2c9dc6be"
}

.dex-okx-defi-web3-volume-small:before {
  content: "\e1ef";
  font-family: dex-ok-dc2c9dc6be
}

.dex-okx-defi-web3-volume-on {
  --ok-icon-font-family: "dex-ok-dc2c9dc6be"
}

.dex-okx-defi-web3-volume-on:before {
  content: "\e1ee";
  font-family: dex-ok-dc2c9dc6be
}

.dex-okx-defi-web3-volume-off {
  --ok-icon-font-family: "dex-ok-dc2c9dc6be"
}

.dex-okx-defi-web3-volume-off:before {
  content: "\e1ed";
  font-family: dex-ok-dc2c9dc6be
}

.dex-okx-defi-web3-volume-medium {
  --ok-icon-font-family: "dex-ok-dc2c9dc6be"
}

.dex-okx-defi-web3-volume-medium:before {
  content: "\e1ec";
  font-family: dex-ok-dc2c9dc6be
}

.dex-okx-defi-dex-alert-bell {
  --ok-icon-font-family: "dex-ok-dc2c9dc6be"
}

.dex-okx-defi-dex-alert-bell:before {
  content: "\e1eb";
  font-family: dex-ok-dc2c9dc6be
}

.dex-okx-defi-qa-button-collapse {
  --ok-icon-font-family: "dex-ok-dc2c9dc6be"
}

.dex-okx-defi-qa-button-collapse:before {
  content: "\e1ea";
  font-family: dex-ok-dc2c9dc6be
}

.dex-okx-defi-dex-api {
  --ok-icon-font-family: "dex-ok-dc2c9dc6be"
}

.dex-okx-defi-dex-api:before {
  content: "\e1e9";
  font-family: dex-ok-dc2c9dc6be
}

.dex-okx-defi-expand-outline {
  --ok-icon-font-family: "dex-ok-dc2c9dc6be"
}

.dex-okx-defi-expand-outline:before {
  content: "\e1e8";
  font-family: dex-ok-dc2c9dc6be
}

.dex-okx-defi-explorer-1 {
  --ok-icon-font-family: "dex-ok-dc2c9dc6be"
}

.dex-okx-defi-explorer-1:before {
  content: "\e1e7";
  font-family: dex-ok-dc2c9dc6be
}

.dex-okx-defi-dex-address {
  --ok-icon-font-family: "dex-ok-dc2c9dc6be"
}

.dex-okx-defi-dex-address:before {
  content: "\e1e4";
  font-family: dex-ok-dc2c9dc6be
}

.dex-okx-defi-link-1 {
  --ok-icon-font-family: "dex-ok-dc2c9dc6be"
}

.dex-okx-defi-link-1:before {
  content: "\e1e6";
  font-family: dex-ok-dc2c9dc6be
}

.dex-okx-defi-token {
  --ok-icon-font-family: "dex-ok-dc2c9dc6be"
}

.dex-okx-defi-token:before {
  content: "\e1e5";
  font-family: dex-ok-dc2c9dc6be
}

.dex-okx-defi-dex-token-outline {
  --ok-icon-font-family: "dex-ok-dc2c9dc6be"
}

.dex-okx-defi-dex-token-outline:before {
  content: "\e1e3";
  font-family: dex-ok-dc2c9dc6be
}

.dex-okx-defi-social-share-button {
  --ok-icon-font-family: "dex-ok-dc2c9dc6be"
}

.dex-okx-defi-social-share-button:before {
  content: "\e1e2";
  font-family: dex-ok-dc2c9dc6be
}

.dex-okx-defi-repost {
  --ok-icon-font-family: "dex-ok-dc2c9dc6be"
}

.dex-okx-defi-repost:before {
  content: "\e1e1";
  font-family: dex-ok-dc2c9dc6be
}

.dex-okx-defi-dollar-symbol-outline {
  --ok-icon-font-family: "dex-ok-dc2c9dc6be"
}

.dex-okx-defi-dollar-symbol-outline:before {
  content: "\e1e0";
  font-family: dex-ok-dc2c9dc6be
}

.dex-okx-defi-verified-filled {
  --ok-icon-font-family: "dex-ok-dc2c9dc6be"
}

.dex-okx-defi-verified-filled:before {
  content: "\e1df";
  font-family: dex-ok-dc2c9dc6be
}

.dex-okx-defi-crown-filled {
  --ok-icon-font-family: "dex-ok-dc2c9dc6be"
}

.dex-okx-defi-crown-filled:before {
  content: "\e1de";
  font-family: dex-ok-dc2c9dc6be
}

.dex-okx-defi-hot-filled {
  --ok-icon-font-family: "dex-ok-dc2c9dc6be"
}

.dex-okx-defi-hot-filled:before {
  content: "\e1da";
  font-family: dex-ok-dc2c9dc6be
}

.dex-okx-defi-hot-outline {
  --ok-icon-font-family: "dex-ok-dc2c9dc6be"
}

.dex-okx-defi-hot-outline:before {
  content: "\e1db";
  font-family: dex-ok-dc2c9dc6be
}

.dex-okx-defi-lock-filled {
  --ok-icon-font-family: "dex-ok-dc2c9dc6be"
}

.dex-okx-defi-lock-filled:before {
  content: "\e1dc";
  font-family: dex-ok-dc2c9dc6be
}

.dex-okx-defi-lock-outline {
  --ok-icon-font-family: "dex-ok-dc2c9dc6be"
}

.dex-okx-defi-lock-outline:before {
  content: "\e1dd";
  font-family: dex-ok-dc2c9dc6be
}

.dex-okx-defi-dashboard {
  --ok-icon-font-family: "dex-ok-dc2c9dc6be"
}

.dex-okx-defi-dashboard:before {
  content: "\e1d9";
  font-family: dex-ok-dc2c9dc6be
}

.dex-okx-defi-suspected-phishing-filled {
  --ok-icon-font-family: "dex-ok-dc2c9dc6be"
}

.dex-okx-defi-suspected-phishing-filled:before {
  content: "\e1d8";
  font-family: dex-ok-dc2c9dc6be
}

.dex-okx-defi-diamond-filled {
  --ok-icon-font-family: "dex-ok-dc2c9dc6be"
}

.dex-okx-defi-diamond-filled:before {
  content: "\e1d3";
  font-family: dex-ok-dc2c9dc6be
}

.dex-okx-defi-exchanges-filled {
  --ok-icon-font-family: "dex-ok-dc2c9dc6be"
}

.dex-okx-defi-exchanges-filled:before {
  content: "\e1d4";
  font-family: dex-ok-dc2c9dc6be
}

.dex-okx-defi-suspected-filled {
  --ok-icon-font-family: "dex-ok-dc2c9dc6be"
}

.dex-okx-defi-suspected-filled:before {
  content: "\e1d5";
  font-family: dex-ok-dc2c9dc6be
}

.dex-okx-defi-sandwich-filled {
  --ok-icon-font-family: "dex-ok-dc2c9dc6be"
}

.dex-okx-defi-sandwich-filled:before {
  content: "\e1d6";
  font-family: dex-ok-dc2c9dc6be
}

.dex-okx-defi-paper-filled {
  --ok-icon-font-family: "dex-ok-dc2c9dc6be"
}

.dex-okx-defi-paper-filled:before {
  content: "\e1d7";
  font-family: dex-ok-dc2c9dc6be
}

.dex-okx-defi-api-keys {
  --ok-icon-font-family: "dex-ok-dc2c9dc6be"
}

.dex-okx-defi-api-keys:before {
  content: "\e1c6";
  font-family: dex-ok-dc2c9dc6be
}

.dex-okx-defi-document {
  --ok-icon-font-family: "dex-ok-dc2c9dc6be"
}

.dex-okx-defi-document:before {
  content: "\e1c7";
  font-family: dex-ok-dc2c9dc6be
}

.dex-okx-defi-history {
  --ok-icon-font-family: "dex-ok-dc2c9dc6be"
}

.dex-okx-defi-history:before {
  content: "\e1c8";
  font-family: dex-ok-dc2c9dc6be
}

.dex-okx-defi-home {
  --ok-icon-font-family: "dex-ok-dc2c9dc6be"
}

.dex-okx-defi-home:before {
  content: "\e1c9";
  font-family: dex-ok-dc2c9dc6be
}

.dex-okx-defi-index-price-api {
  --ok-icon-font-family: "dex-ok-dc2c9dc6be"
}

.dex-okx-defi-index-price-api:before {
  content: "\e1ca";
  font-family: dex-ok-dc2c9dc6be
}

.dex-okx-defi-limit-order-api {
  --ok-icon-font-family: "dex-ok-dc2c9dc6be"
}

.dex-okx-defi-limit-order-api:before {
  content: "\e1cb";
  font-family: dex-ok-dc2c9dc6be
}

.dex-okx-defi-jumpstart {
  --ok-icon-font-family: "dex-ok-dc2c9dc6be"
}

.dex-okx-defi-jumpstart:before {
  content: "\e1cc";
  font-family: dex-ok-dc2c9dc6be
}

.dex-okx-defi-trans-gateway-api {
  --ok-icon-font-family: "dex-ok-dc2c9dc6be"
}

.dex-okx-defi-trans-gateway-api:before {
  content: "\e1cd";
  font-family: dex-ok-dc2c9dc6be
}

.dex-okx-defi-user-gasless-api {
  --ok-icon-font-family: "dex-ok-dc2c9dc6be"
}

.dex-okx-defi-user-gasless-api:before {
  content: "\e1ce";
  font-family: dex-ok-dc2c9dc6be
}

.dex-okx-defi-toolkit {
  --ok-icon-font-family: "dex-ok-dc2c9dc6be"
}

.dex-okx-defi-toolkit:before {
  content: "\e1cf";
  font-family: dex-ok-dc2c9dc6be
}

.dex-okx-defi-user-protection {
  --ok-icon-font-family: "dex-ok-dc2c9dc6be"
}

.dex-okx-defi-user-protection:before {
  content: "\e1d0";
  font-family: dex-ok-dc2c9dc6be
}

.dex-okx-defi-wallet-signature-SDK {
  --ok-icon-font-family: "dex-ok-dc2c9dc6be"
}

.dex-okx-defi-wallet-signature-SDK:before {
  content: "\e1d1";
  font-family: dex-ok-dc2c9dc6be
}

.dex-okx-defi-web3-message {
  --ok-icon-font-family: "dex-ok-dc2c9dc6be"
}

.dex-okx-defi-web3-message:before {
  content: "\e1d2";
  font-family: dex-ok-dc2c9dc6be
}

.dex-okx-defi-ai-outline {
  --ok-icon-font-family: "dex-ok-dc2c9dc6be"
}

.dex-okx-defi-ai-outline:before {
  content: "\e1c3";
  font-family: dex-ok-dc2c9dc6be
}

.dex-okx-defi-radio-outline {
  --ok-icon-font-family: "dex-ok-dc2c9dc6be"
}

.dex-okx-defi-radio-outline:before {
  content: "\e1c4";
  font-family: dex-ok-dc2c9dc6be
}

.dex-okx-defi-dex-mobile {
  --ok-icon-font-family: "dex-ok-dc2c9dc6be"
}

.dex-okx-defi-dex-mobile:before {
  content: "\e1c2";
  font-family: dex-ok-dc2c9dc6be
}

.dex-okx-defi-dex-all {
  --ok-icon-font-family: "dex-ok-dc2c9dc6be"
}

.dex-okx-defi-dex-all:before {
  content: "\e1bd";
  font-family: dex-ok-dc2c9dc6be
}

.dex-okx-defi-dex-bot {
  --ok-icon-font-family: "dex-ok-dc2c9dc6be"
}

.dex-okx-defi-dex-bot:before {
  content: "\e1be";
  font-family: dex-ok-dc2c9dc6be
}

.dex-okx-defi-dex-gold-dog-expert {
  --ok-icon-font-family: "dex-ok-dc2c9dc6be"
}

.dex-okx-defi-dex-gold-dog-expert:before {
  content: "\e1bf";
  font-family: dex-ok-dc2c9dc6be
}

.dex-okx-defi-dex-pump-smart-money {
  --ok-icon-font-family: "dex-ok-dc2c9dc6be"
}

.dex-okx-defi-dex-pump-smart-money:before {
  content: "\e1c0";
  font-family: dex-ok-dc2c9dc6be
}

.dex-okx-defi-reward-filled {
  --ok-icon-font-family: "dex-ok-dc2c9dc6be"
}

.dex-okx-defi-reward-filled:before {
  content: "\e1bb";
  font-family: dex-ok-dc2c9dc6be
}

.dex-okx-defi-referral {
  --ok-icon-font-family: "dex-ok-dc2c9dc6be"
}

.dex-okx-defi-referral:before {
  content: "\e1bc";
  font-family: dex-ok-dc2c9dc6be
}

.dex-okx-defi-dex-feeds {
  --ok-icon-font-family: "dex-ok-dc2c9dc6be"
}

.dex-okx-defi-dex-feeds:before {
  content: "\e1ba";
  font-family: dex-ok-dc2c9dc6be
}

.dex-okx-defi-wallet-marketplace-linked-accounts {
  --ok-icon-font-family: "dex-ok-dc2c9dc6be"
}

.dex-okx-defi-wallet-marketplace-linked-accounts:before {
  content: "\e1b8";
  font-family: dex-ok-dc2c9dc6be
}

.dex-okx-defi-wallet-marketplace-linked-wallet {
  --ok-icon-font-family: "dex-ok-dc2c9dc6be"
}

.dex-okx-defi-wallet-marketplace-linked-wallet:before {
  content: "\e1b9";
  font-family: dex-ok-dc2c9dc6be
}

.dex-okx-defi-competition-pump {
  --ok-icon-font-family: "dex-ok-dc2c9dc6be"
}

.dex-okx-defi-competition-pump:before {
  content: "\e1b7";
  font-family: dex-ok-dc2c9dc6be
}

.dex-okx-defi-trending-down {
  --ok-icon-font-family: "dex-ok-dc2c9dc6be"
}

.dex-okx-defi-trending-down:before {
  content: "\e1b5";
  font-family: dex-ok-dc2c9dc6be
}

.dex-okx-defi-trending-up {
  --ok-icon-font-family: "dex-ok-dc2c9dc6be"
}

.dex-okx-defi-trending-up:before {
  content: "\e1b6";
  font-family: dex-ok-dc2c9dc6be
}

.dex-okx-defi-collapse {
  --ok-icon-font-family: "dex-ok-dc2c9dc6be"
}

.dex-okx-defi-collapse:before {
  content: "\e1b3";
  font-family: dex-ok-dc2c9dc6be
}

.dex-okx-defi-expand {
  --ok-icon-font-family: "dex-ok-dc2c9dc6be"
}

.dex-okx-defi-expand:before {
  content: "\e1b4";
  font-family: dex-ok-dc2c9dc6be
}

.dex-okx-defi-dex-like {
  --ok-icon-font-family: "dex-ok-dc2c9dc6be"
}

.dex-okx-defi-dex-like:before {
  content: "\e1b2";
  font-family: dex-ok-dc2c9dc6be
}

.dex-okx-defi-dex-like-filled {
  --ok-icon-font-family: "dex-ok-dc2c9dc6be"
}

.dex-okx-defi-dex-like-filled:before {
  content: "\e1b1";
  font-family: dex-ok-dc2c9dc6be
}

.dex-okx-defi-dex-recognized {
  --ok-icon-font-family: "dex-ok-dc2c9dc6be"
}

.dex-okx-defi-dex-recognized:before {
  content: "\e1b0";
  font-family: dex-ok-dc2c9dc6be
}

.dex-okx-defi-year-disconnect {
  --ok-icon-font-family: "dex-ok-dc2c9dc6be"
}

.dex-okx-defi-year-disconnect:before {
  content: "\e1af";
  font-family: dex-ok-dc2c9dc6be
}

.dex-okx-defi-nft-trading {
  --ok-icon-font-family: "dex-ok-dc2c9dc6be"
}

.dex-okx-defi-nft-trading:before {
  content: "\e1ae";
  font-family: dex-ok-dc2c9dc6be
}

.dex-okx-defi-nft-price {
  --ok-icon-font-family: "dex-ok-dc2c9dc6be"
}

.dex-okx-defi-nft-price:before {
  content: "\e1ad";
  font-family: dex-ok-dc2c9dc6be
}

.dex-okx-defi-dex-whale {
  --ok-icon-font-family: "dex-ok-dc2c9dc6be"
}

.dex-okx-defi-dex-whale:before {
  content: "\e1ac";
  font-family: dex-ok-dc2c9dc6be
}

.dex-okx-defi-dex-tx-surge {
  --ok-icon-font-family: "dex-ok-dc2c9dc6be"
}

.dex-okx-defi-dex-tx-surge:before {
  content: "\e1ab";
  font-family: dex-ok-dc2c9dc6be
}

.dex-okx-defi-dex-tx-plunge {
  --ok-icon-font-family: "dex-ok-dc2c9dc6be"
}

.dex-okx-defi-dex-tx-plunge:before {
  content: "\e1aa";
  font-family: dex-ok-dc2c9dc6be
}

.dex-okx-defi-dex-top10-holders {
  --ok-icon-font-family: "dex-ok-dc2c9dc6be"
}

.dex-okx-defi-dex-top10-holders:before {
  content: "\e1a9";
  font-family: dex-ok-dc2c9dc6be
}

.dex-okx-defi-dex-top-holder {
  --ok-icon-font-family: "dex-ok-dc2c9dc6be"
}

.dex-okx-defi-dex-top-holder:before {
  content: "\e1a8";
  font-family: dex-ok-dc2c9dc6be
}

.dex-okx-defi-dex-newest {
  --ok-icon-font-family: "dex-ok-dc2c9dc6be"
}

.dex-okx-defi-dex-newest:before {
  content: "\e1a7";
  font-family: dex-ok-dc2c9dc6be
}

.dex-okx-defi-dex-migrating {
  --ok-icon-font-family: "dex-ok-dc2c9dc6be"
}

.dex-okx-defi-dex-migrating:before {
  content: "\e1a6";
  font-family: dex-ok-dc2c9dc6be
}

.dex-okx-defi-dex-launched {
  --ok-icon-font-family: "dex-ok-dc2c9dc6be"
}

.dex-okx-defi-dex-launched:before {
  content: "\e1a4";
  font-family: dex-ok-dc2c9dc6be
}

.dex-okx-defi-dex-holders-surge {
  --ok-icon-font-family: "dex-ok-dc2c9dc6be"
}

.dex-okx-defi-dex-holders-surge:before {
  content: "\e1a2";
  font-family: dex-ok-dc2c9dc6be
}

.dex-okx-defi-dex-holders-plunge {
  --ok-icon-font-family: "dex-ok-dc2c9dc6be"
}

.dex-okx-defi-dex-holders-plunge:before {
  content: "\e1a1";
  font-family: dex-ok-dc2c9dc6be
}

.dex-okx-defi-dex-high-liquidity {
  --ok-icon-font-family: "dex-ok-dc2c9dc6be"
}

.dex-okx-defi-dex-high-liquidity:before {
  content: "\e1a0";
  font-family: dex-ok-dc2c9dc6be
}

.dex-okx-defi-dex-fresh {
  --ok-icon-font-family: "dex-ok-dc2c9dc6be"
}

.dex-okx-defi-dex-fresh:before {
  content: "\e19f";
  font-family: dex-ok-dc2c9dc6be
}

.dex-okx-defi-dex-finalizing {
  --ok-icon-font-family: "dex-ok-dc2c9dc6be"
}

.dex-okx-defi-dex-finalizing:before {
  content: "\e19e";
  font-family: dex-ok-dc2c9dc6be
}

.dex-okx-defi-dex-DEV {
  --ok-icon-font-family: "dex-ok-dc2c9dc6be"
}

.dex-okx-defi-dex-DEV:before {
  content: "\e19d";
  font-family: dex-ok-dc2c9dc6be
}

.dex-okx-defi-dex-danger {
  --ok-icon-font-family: "dex-ok-dc2c9dc6be"
}

.dex-okx-defi-dex-danger:before {
  content: "\e19c";
  font-family: dex-ok-dc2c9dc6be
}

.dex-okx-defi-dex-snipers {
  --ok-icon-font-family: "dex-ok-dc2c9dc6be"
}

.dex-okx-defi-dex-snipers:before {
  content: "\e157";
  font-family: dex-ok-dc2c9dc6be
}

.dex-okx-defi-dex-suspicious {
  --ok-icon-font-family: "dex-ok-dc2c9dc6be"
}

.dex-okx-defi-dex-suspicious:before {
  content: "\e158";
  font-family: dex-ok-dc2c9dc6be
}

.dex-okx-defi-dex-smart-money {
  --ok-icon-font-family: "dex-ok-dc2c9dc6be"
}

.dex-okx-defi-dex-smart-money:before {
  content: "\e156";
  font-family: dex-ok-dc2c9dc6be
}

.dex-okx-defi-dex-quick-filled {
  --ok-icon-font-family: "dex-ok-dc2c9dc6be"
}

.dex-okx-defi-dex-quick-filled:before {
  content: "\e19b";
  font-family: dex-ok-dc2c9dc6be
}

.dex-okx-defi-dex-full-logo {
  --ok-icon-font-family: "dex-ok-dc2c9dc6be"
}

.dex-okx-defi-dex-full-logo:before {
  content: "\e197";
  font-family: dex-ok-dc2c9dc6be
}

.dex-okx-defi-dex-xlogo {
  --ok-icon-font-family: "dex-ok-dc2c9dc6be"
}

.dex-okx-defi-dex-xlogo:before {
  content: "\e198";
  font-family: dex-ok-dc2c9dc6be
}

.dex-okx-defi-dex-copiers {
  --ok-icon-font-family: "dex-ok-dc2c9dc6be"
}

.dex-okx-defi-dex-copiers:before {
  content: "\e19a";
  font-family: dex-ok-dc2c9dc6be
}

.dex-okx-defi-trading-view-logo {
  --ok-icon-font-family: "dex-ok-dc2c9dc6be"
}

.dex-okx-defi-trading-view-logo:before {
  content: "\e196";
  font-family: dex-ok-dc2c9dc6be
}

.dex-okx-defi-dex-fee {
  --ok-icon-font-family: "dex-ok-dc2c9dc6be"
}

.dex-okx-defi-dex-fee:before {
  content: "\e195";
  font-family: dex-ok-dc2c9dc6be
}

.dex-okx-defi-dex-slippage {
  --ok-icon-font-family: "dex-ok-dc2c9dc6be"
}

.dex-okx-defi-dex-slippage:before {
  content: "\e193";
  font-family: dex-ok-dc2c9dc6be
}

.dex-okx-defi-dex-web3-settings {
  --ok-icon-font-family: "dex-ok-dc2c9dc6be"
}

.dex-okx-defi-dex-web3-settings:before {
  content: "\e194";
  font-family: dex-ok-dc2c9dc6be
}

.dex-okx-defi-web3-crypto {
  --ok-icon-font-family: "dex-ok-dc2c9dc6be"
}

.dex-okx-defi-web3-crypto:before {
  content: "\e191";
  font-family: dex-ok-dc2c9dc6be
}

.dex-okx-defi-volume-max {
  --ok-icon-font-family: "dex-ok-dc2c9dc6be"
}

.dex-okx-defi-volume-max:before {
  content: "\e18f";
  font-family: dex-ok-dc2c9dc6be
}

.dex-okx-defi-volume-off {
  --ok-icon-font-family: "dex-ok-dc2c9dc6be"
}

.dex-okx-defi-volume-off:before {
  content: "\e190";
  font-family: dex-ok-dc2c9dc6be
}

.dex-okx-defi-translate {
  --ok-icon-font-family: "dex-ok-dc2c9dc6be"
}

.dex-okx-defi-translate:before {
  content: "\e18e";
  font-family: dex-ok-dc2c9dc6be
}

.dex-okx-defi-dex-meme-mode {
  --ok-icon-font-family: "dex-ok-dc2c9dc6be"
}

.dex-okx-defi-dex-meme-mode:before {
  content: "\e18d";
  font-family: dex-ok-dc2c9dc6be
}

.dex-okx-defi-dex-bridge {
  --ok-icon-font-family: "dex-ok-dc2c9dc6be"
}

.dex-okx-defi-dex-bridge:before {
  content: "\e18c";
  font-family: dex-ok-dc2c9dc6be
}

.dex-okx-defi-dex-advanced {
  --ok-icon-font-family: "dex-ok-dc2c9dc6be"
}

.dex-okx-defi-dex-advanced:before {
  content: "\e18b";
  font-family: dex-ok-dc2c9dc6be
}

.dex-okx-defi-dex-check {
  --ok-icon-font-family: "dex-ok-dc2c9dc6be"
}

.dex-okx-defi-dex-check:before {
  content: "\e18a";
  font-family: dex-ok-dc2c9dc6be
}

.dex-okx-defi-dex-chevron-up {
  --ok-icon-font-family: "dex-ok-dc2c9dc6be"
}

.dex-okx-defi-dex-chevron-up:before {
  content: "\e188";
  font-family: dex-ok-dc2c9dc6be
}

.dex-okx-defi-dex-chevron-down {
  --ok-icon-font-family: "dex-ok-dc2c9dc6be"
}

.dex-okx-defi-dex-chevron-down:before {
  content: "\e189";
  font-family: dex-ok-dc2c9dc6be
}

.dex-okx-defi-earn-web3-loop {
  --ok-icon-font-family: "dex-ok-dc2c9dc6be"
}

.dex-okx-defi-earn-web3-loop:before {
  content: "\e187";
  font-family: dex-ok-dc2c9dc6be
}

.dex-okx-defi-dex-alert {
  --ok-icon-font-family: "dex-ok-dc2c9dc6be"
}

.dex-okx-defi-dex-alert:before {
  content: "\e185";
  font-family: dex-ok-dc2c9dc6be
}

.dex-okx-defi-dex-add-alert {
  --ok-icon-font-family: "dex-ok-dc2c9dc6be"
}

.dex-okx-defi-dex-add-alert:before {
  content: "\e186";
  font-family: dex-ok-dc2c9dc6be
}

.dex-okx-defi-dex-sort-down {
  --ok-icon-font-family: "dex-ok-dc2c9dc6be"
}

.dex-okx-defi-dex-sort-down:before {
  content: "\e184";
  font-family: dex-ok-dc2c9dc6be
}

.dex-okx-defi-web3-unknown-risks {
  --ok-icon-font-family: "dex-ok-dc2c9dc6be"
}

.dex-okx-defi-web3-unknown-risks:before {
  content: "\e183";
  font-family: dex-ok-dc2c9dc6be
}

.dex-okx-defi-web3-unknown-risks-filled {
  --ok-icon-font-family: "dex-ok-dc2c9dc6be"
}

.dex-okx-defi-web3-unknown-risks-filled:before {
  content: "\e182";
  font-family: dex-ok-dc2c9dc6be
}

.dex-okx-defi-web3-newest {
  --ok-icon-font-family: "dex-ok-dc2c9dc6be"
}

.dex-okx-defi-web3-newest:before {
  content: "\e181";
  font-family: dex-ok-dc2c9dc6be
}

.dex-okx-defi-dex-candle-chart-indicator {
  --ok-icon-font-family: "dex-ok-dc2c9dc6be"
}

.dex-okx-defi-dex-candle-chart-indicator:before {
  content: "\e180";
  font-family: dex-ok-dc2c9dc6be
}

.dex-okx-defi-dex-fire-flame {
  --ok-icon-font-family: "dex-ok-dc2c9dc6be"
}

.dex-okx-defi-dex-fire-flame:before {
  content: "\e17f";
  font-family: dex-ok-dc2c9dc6be
}

.dex-okx-defi_dex_caution {
  --ok-icon-font-family: "dex-ok-dc2c9dc6be"
}

.dex-okx-defi_dex_caution:before {
  content: "\e17c";
  font-family: dex-ok-dc2c9dc6be
}

.dex-okx-defi_dex_risk {
  --ok-icon-font-family: "dex-ok-dc2c9dc6be"
}

.dex-okx-defi_dex_risk:before {
  content: "\e17d";
  font-family: dex-ok-dc2c9dc6be
}

.dex-okx-defi_dex_security {
  --ok-icon-font-family: "dex-ok-dc2c9dc6be"
}

.dex-okx-defi_dex_security:before {
  content: "\e17e";
  font-family: dex-ok-dc2c9dc6be
}

.dex-okx-defi-cv-gv1 {
  --ok-icon-font-family: "dex-ok-dc2c9dc6be"
}

.dex-okx-defi-cv-gv1:before {
  content: "\e17b";
  font-family: dex-ok-dc2c9dc6be
}

.dex-okx-defi-cv-cp {
  --ok-icon-font-family: "dex-ok-dc2c9dc6be"
}

.dex-okx-defi-cv-cp:before {
  content: "\e17a";
  font-family: dex-ok-dc2c9dc6be
}

.dex-okx-defi-cp-referral-file {
  --ok-icon-font-family: "dex-ok-dc2c9dc6be"
}

.dex-okx-defi-cp-referral-file:before {
  content: "\e179";
  font-family: dex-ok-dc2c9dc6be
}

.dex-okx-defi-dex-web3-network {
  --ok-icon-font-family: "dex-ok-dc2c9dc6be"
}

.dex-okx-defi-dex-web3-network:before {
  content: "\e178";
  font-family: dex-ok-dc2c9dc6be
}

.dex-okx-defi_dex_bubblemaps {
  --ok-icon-font-family: "dex-ok-dc2c9dc6be"
}

.dex-okx-defi_dex_bubblemaps:before {
  content: "\e175";
  font-family: dex-ok-dc2c9dc6be
}

.dex-okx-defi-dex-refresh-2 {
  --ok-icon-font-family: "dex-ok-dc2c9dc6be"
}

.dex-okx-defi-dex-refresh-2:before {
  content: "\e174";
  font-family: dex-ok-dc2c9dc6be
}

.dex-okx-defi-cp-paper {
  --ok-icon-font-family: "dex-ok-dc2c9dc6be"
}

.dex-okx-defi-cp-paper:before {
  content: "\e173";
  font-family: dex-ok-dc2c9dc6be
}

.dex-okx-defi_nft_home_arrow {
  --ok-icon-font-family: "dex-ok-dc2c9dc6be"
}

.dex-okx-defi_nft_home_arrow:before {
  content: "\e172";
  font-family: dex-ok-dc2c9dc6be
}

.dex-okx-defi-game-caretup {
  --ok-icon-font-family: "dex-ok-dc2c9dc6be"
}

.dex-okx-defi-game-caretup:before {
  content: "\e16f";
  font-family: dex-ok-dc2c9dc6be
}

.dex-okx-defi-game-caretdown {
  --ok-icon-font-family: "dex-ok-dc2c9dc6be"
}

.dex-okx-defi-game-caretdown:before {
  content: "\e170";
  font-family: dex-ok-dc2c9dc6be
}

.dex-okx-defi-game-tg {
  --ok-icon-font-family: "dex-ok-dc2c9dc6be"
}

.dex-okx-defi-game-tg:before {
  content: "\e171";
  font-family: dex-ok-dc2c9dc6be
}

.dex-okx-defi-smart-portfolio {
  --ok-icon-font-family: "dex-ok-dc2c9dc6be"
}

.dex-okx-defi-smart-portfolio:before {
  content: "\e16e";
  font-family: dex-ok-dc2c9dc6be
}

.dex-okx-defi-wallet-defi {
  --ok-icon-font-family: "dex-ok-dc2c9dc6be"
}

.dex-okx-defi-wallet-defi:before {
  content: "\e169";
  font-family: dex-ok-dc2c9dc6be
}

.dex-okx-defi-wallet-walletapi {
  --ok-icon-font-family: "dex-ok-dc2c9dc6be"
}

.dex-okx-defi-wallet-walletapi:before {
  content: "\e16a";
  font-family: dex-ok-dc2c9dc6be
}

.dex-okx-defi-wallet-marketplace {
  --ok-icon-font-family: "dex-ok-dc2c9dc6be"
}

.dex-okx-defi-wallet-marketplace:before {
  content: "\e16b";
  font-family: dex-ok-dc2c9dc6be
}

.dex-okx-defi-wallet-dex {
  --ok-icon-font-family: "dex-ok-dc2c9dc6be"
}

.dex-okx-defi-wallet-dex:before {
  content: "\e16c";
  font-family: dex-ok-dc2c9dc6be
}

.dex-okx-defi-wallet-apikeys {
  --ok-icon-font-family: "dex-ok-dc2c9dc6be"
}

.dex-okx-defi-wallet-apikeys:before {
  content: "\e16d";
  font-family: dex-ok-dc2c9dc6be
}

.dex-okx-defi--marketplace-game {
  --ok-icon-font-family: "dex-ok-dc2c9dc6be"
}

.dex-okx-defi--marketplace-game:before {
  content: "\e168";
  font-family: dex-ok-dc2c9dc6be
}

.dex-okx-defi-dex-caution {
  --ok-icon-font-family: "dex-ok-dc2c9dc6be"
}

.dex-okx-defi-dex-caution:before {
  content: "\e167";
  font-family: dex-ok-dc2c9dc6be
}

.dex-okx-defi-game-nft {
  --ok-icon-font-family: "dex-ok-dc2c9dc6be"
}

.dex-okx-defi-game-nft:before {
  content: "\e166";
  font-family: dex-ok-dc2c9dc6be
}

.dex-okx-defi-game-inter1 {
  --ok-icon-font-family: "dex-ok-dc2c9dc6be"
}

.dex-okx-defi-game-inter1:before {
  content: "\e165";
  font-family: dex-ok-dc2c9dc6be
}

.dex-okx-defi-shop-close {
  --ok-icon-font-family: "dex-ok-dc2c9dc6be"
}

.dex-okx-defi-shop-close:before {
  content: "\e164";
  font-family: dex-ok-dc2c9dc6be
}

.dex-okx-defi-shop-closebtn {
  --ok-icon-font-family: "dex-ok-dc2c9dc6be"
}

.dex-okx-defi-shop-closebtn:before {
  content: "\e163";
  font-family: dex-ok-dc2c9dc6be
}

.dex-okx-defi-game-other {
  --ok-icon-font-family: "dex-ok-dc2c9dc6be"
}

.dex-okx-defi-game-other:before {
  content: "\e162";
  font-family: dex-ok-dc2c9dc6be
}

.dex-okx-defi-swag-close {
  --ok-icon-font-family: "dex-ok-dc2c9dc6be"
}

.dex-okx-defi-swag-close:before {
  content: "\e161";
  font-family: dex-ok-dc2c9dc6be
}

.dex-okx-defi-dex-copy1 {
  --ok-icon-font-family: "dex-ok-dc2c9dc6be"
}

.dex-okx-defi-dex-copy1:before {
  content: "\e15e";
  font-family: dex-ok-dc2c9dc6be
}

.dex-okx-defi-dex-filter1 {
  --ok-icon-font-family: "dex-ok-dc2c9dc6be"
}

.dex-okx-defi-dex-filter1:before {
  content: "\e15f";
  font-family: dex-ok-dc2c9dc6be
}

.dex-okx-defi-dex-filtered1 {
  --ok-icon-font-family: "dex-ok-dc2c9dc6be"
}

.dex-okx-defi-dex-filtered1:before {
  content: "\e160";
  font-family: dex-ok-dc2c9dc6be
}

.dex-okx-defi-marketplace-close {
  --ok-icon-font-family: "dex-ok-dc2c9dc6be"
}

.dex-okx-defi-marketplace-close:before {
  content: "\e15d";
  font-family: dex-ok-dc2c9dc6be
}

.dex-okx-defi-marketplace-plus {
  --ok-icon-font-family: "dex-ok-dc2c9dc6be"
}

.dex-okx-defi-marketplace-plus:before {
  content: "\e134";
  font-family: dex-ok-dc2c9dc6be
}

.dex-okx-defi-swag-ship {
  --ok-icon-font-family: "dex-ok-dc2c9dc6be"
}

.dex-okx-defi-swag-ship:before {
  content: "\e15c";
  font-family: dex-ok-dc2c9dc6be
}

.dex-okx-defi-nft-mint:before {
  content: "\e15b";
  font-family: dex-ok-dc2c9dc6be
}

.dex-okx-defi-nft-mint {
  --ok-icon-font-family: "dex-ok-dc2c9dc6be"
}

.dex-okx-defi-nft-mint :before {
  content: "\e15a";
  font-family: dex-ok-dc2c9dc6be
}

.dex-okx-defi-swag-cart {
  --ok-icon-font-family: "dex-ok-dc2c9dc6be"
}

.dex-okx-defi-swag-cart:before {
  content: "\e159";
  font-family: dex-ok-dc2c9dc6be
}

.dex-okx-defi-dex-rate {
  --ok-icon-font-family: "dex-ok-dc2c9dc6be"
}

.dex-okx-defi-dex-rate:before {
  content: "\e155";
  font-family: dex-ok-dc2c9dc6be
}

.dex-okx-defi-swagstore-cart {
  --ok-icon-font-family: "dex-ok-dc2c9dc6be"
}

.dex-okx-defi-swagstore-cart:before {
  content: "\e154";
  font-family: dex-ok-dc2c9dc6be
}

.dex-okx-defi-dex-refresh {
  --ok-icon-font-family: "dex-ok-dc2c9dc6be"
}

.dex-okx-defi-dex-refresh:before {
  content: "\e153";
  font-family: dex-ok-dc2c9dc6be
}

.dex-okx-defi-dex-okxlogo {
  --ok-icon-font-family: "dex-ok-dc2c9dc6be"
}

.dex-okx-defi-dex-okxlogo:before {
  content: "\e152";
  font-family: dex-ok-dc2c9dc6be
}

.dex-okx-defi-defi-openlink {
  --ok-icon-font-family: "dex-ok-dc2c9dc6be"
}

.dex-okx-defi-defi-openlink:before {
  content: "\e151";
  font-family: dex-ok-dc2c9dc6be
}

.dex-okx-defi-dex-checkbox-blank {
  --ok-icon-font-family: "dex-ok-dc2c9dc6be"
}

.dex-okx-defi-dex-checkbox-blank:before {
  content: "\e14e";
  font-family: dex-ok-dc2c9dc6be
}

.dex-okx-defi-dex-checkbox {
  --ok-icon-font-family: "dex-ok-dc2c9dc6be"
}

.dex-okx-defi-dex-checkbox:before {
  content: "\e14f";
  font-family: dex-ok-dc2c9dc6be
}

.dex-okx-defi-dex-filtered {
  --ok-icon-font-family: "dex-ok-dc2c9dc6be"
}

.dex-okx-defi-dex-filtered:before {
  content: "\e150";
  font-family: dex-ok-dc2c9dc6be
}

.dex-okx-defi-chart-settings {
  --ok-icon-font-family: "dex-ok-dc2c9dc6be"
}

.dex-okx-defi-chart-settings:before {
  content: "\e14d";
  font-family: dex-ok-dc2c9dc6be
}

.dex-okx-defi-left {
  --ok-icon-font-family: "dex-ok-dc2c9dc6be"
}

.dex-okx-defi-left:before {
  content: "\e14c";
  font-family: dex-ok-dc2c9dc6be
}

.dex-okx-defi-dex-link-2 {
  --ok-icon-font-family: "dex-ok-dc2c9dc6be"
}

.dex-okx-defi-dex-link-2:before {
  content: "\e14b";
  font-family: dex-ok-dc2c9dc6be
}

.dex-okx-defi-dex-twitter {
  --ok-icon-font-family: "dex-ok-dc2c9dc6be"
}

.dex-okx-defi-dex-twitter:before {
  content: "\e14a";
  font-family: dex-ok-dc2c9dc6be
}

.dex-okx-defi-discover-flash {
  --ok-icon-font-family: "dex-ok-dc2c9dc6be"
}

.dex-okx-defi-discover-flash:before {
  content: "\e149";
  font-family: dex-ok-dc2c9dc6be
}

.dex-okx-defi-dex-star-filled {
  --ok-icon-font-family: "dex-ok-dc2c9dc6be"
}

.dex-okx-defi-dex-star-filled:before {
  content: "\e147";
  font-family: dex-ok-dc2c9dc6be
}

.dex-okx-defi-dex-star {
  --ok-icon-font-family: "dex-ok-dc2c9dc6be"
}

.dex-okx-defi-dex-star:before {
  content: "\e148";
  font-family: dex-ok-dc2c9dc6be
}

.dex-okx-defi-github {
  --ok-icon-font-family: "dex-ok-dc2c9dc6be"
}

.dex-okx-defi-github:before {
  content: "\e145";
  font-family: dex-ok-dc2c9dc6be
}

.dex-okx-defi-audit {
  --ok-icon-font-family: "dex-ok-dc2c9dc6be"
}

.dex-okx-defi-audit:before {
  content: "\e146";
  font-family: dex-ok-dc2c9dc6be
}

.dex-okx-defi-airdorp {
  --ok-icon-font-family: "dex-ok-dc2c9dc6be"
}

.dex-okx-defi-airdorp:before {
  content: "\e009";
  font-family: dex-ok-dc2c9dc6be
}

.dex-okx-defi-arrow {
  --ok-icon-font-family: "dex-ok-dc2c9dc6be"
}

.dex-okx-defi-arrow:before {
  content: "\e144";
  font-family: dex-ok-dc2c9dc6be
}

.dex-okx-defi-nft-Instagram {
  --ok-icon-font-family: "dex-ok-dc2c9dc6be"
}

.dex-okx-defi-nft-Instagram:before {
  content: "\e141";
  font-family: dex-ok-dc2c9dc6be
}

.dex-okx-defi-nft-discord {
  --ok-icon-font-family: "dex-ok-dc2c9dc6be"
}

.dex-okx-defi-nft-discord:before {
  content: "\e142";
  font-family: dex-ok-dc2c9dc6be
}

.dex-okx-defi-nft-medium {
  --ok-icon-font-family: "dex-ok-dc2c9dc6be"
}

.dex-okx-defi-nft-medium:before {
  content: "\e143";
  font-family: dex-ok-dc2c9dc6be
}

.dex-okx-defi-nft-open-link {
  --ok-icon-font-family: "dex-ok-dc2c9dc6be"
}

.dex-okx-defi-nft-open-link:before {
  content: "\e140";
  font-family: dex-ok-dc2c9dc6be
}

.dex-okx-defi-marketplace-chevron-left {
  --ok-icon-font-family: "dex-ok-dc2c9dc6be"
}

.dex-okx-defi-marketplace-chevron-left:before {
  content: "\e13c";
  font-family: dex-ok-dc2c9dc6be
}

.dex-okx-defi-marketplace-chevron-down {
  --ok-icon-font-family: "dex-ok-dc2c9dc6be"
}

.dex-okx-defi-marketplace-chevron-down:before {
  content: "\e13d";
  font-family: dex-ok-dc2c9dc6be
}

.dex-okx-defi-marketplace-chevron-right {
  --ok-icon-font-family: "dex-ok-dc2c9dc6be"
}

.dex-okx-defi-marketplace-chevron-right:before {
  content: "\e13e";
  font-family: dex-ok-dc2c9dc6be
}

.dex-okx-defi-marketplace-chevron-up {
  --ok-icon-font-family: "dex-ok-dc2c9dc6be"
}

.dex-okx-defi-marketplace-chevron-up:before {
  content: "\e13f";
  font-family: dex-ok-dc2c9dc6be
}

.dex-okx-defi-marketplace-watch-only {
  --ok-icon-font-family: "dex-ok-dc2c9dc6be"
}

.dex-okx-defi-marketplace-watch-only:before {
  content: "\e13b";
  font-family: dex-ok-dc2c9dc6be
}

.dex-okx-defi-marketplace-service-fee {
  --ok-icon-font-family: "dex-ok-dc2c9dc6be"
}

.dex-okx-defi-marketplace-service-fee:before {
  content: "\e13a";
  font-family: dex-ok-dc2c9dc6be
}

.dex-okx-defi-marketplace-grid-large {
  --ok-icon-font-family: "dex-ok-dc2c9dc6be"
}

.dex-okx-defi-marketplace-grid-large:before {
  content: "\e138";
  font-family: dex-ok-dc2c9dc6be
}

.dex-okx-defi-marketplace-grid-small {
  --ok-icon-font-family: "dex-ok-dc2c9dc6be"
}

.dex-okx-defi-marketplace-grid-small:before {
  content: "\e139";
  font-family: dex-ok-dc2c9dc6be
}

.dex-okx-defi-marketplace-warning {
  --ok-icon-font-family: "dex-ok-dc2c9dc6be"
}

.dex-okx-defi-marketplace-warning:before {
  content: "\e137";
  font-family: dex-ok-dc2c9dc6be
}

.dex-okx-defi-marketplace-fee-rule {
  --ok-icon-font-family: "dex-ok-dc2c9dc6be"
}

.dex-okx-defi-marketplace-fee-rule:before {
  content: "\e136";
  font-family: dex-ok-dc2c9dc6be
}

.dex-okx-defi-marketplace-calendar {
  --ok-icon-font-family: "dex-ok-dc2c9dc6be"
}

.dex-okx-defi-marketplace-calendar:before {
  content: "\e135";
  font-family: dex-ok-dc2c9dc6be
}

.dex-okx-defi-marketplace-minus {
  --ok-icon-font-family: "dex-ok-dc2c9dc6be"
}

.dex-okx-defi-marketplace-minus:before {
  content: "\e133";
  font-family: dex-ok-dc2c9dc6be
}

.dex-okx-defi-marketplace-pointer-up {
  --ok-icon-font-family: "dex-ok-dc2c9dc6be"
}

.dex-okx-defi-marketplace-pointer-up:before {
  content: "\e132";
  font-family: dex-ok-dc2c9dc6be
}

.dex-okx-defi-marketplace-pointer-down {
  --ok-icon-font-family: "dex-ok-dc2c9dc6be"
}

.dex-okx-defi-marketplace-pointer-down:before {
  content: "\e131";
  font-family: dex-ok-dc2c9dc6be
}

.dex-okx-defi-marketplace-pointer-left {
  --ok-icon-font-family: "dex-ok-dc2c9dc6be"
}

.dex-okx-defi-marketplace-pointer-left:before {
  content: "\e130";
  font-family: dex-ok-dc2c9dc6be
}

.dex-okx-defi-marketplace-pointer-right {
  --ok-icon-font-family: "dex-ok-dc2c9dc6be"
}

.dex-okx-defi-marketplace-pointer-right:before {
  content: "\e12f";
  font-family: dex-ok-dc2c9dc6be
}

.dex-okx-defi-marketplace-checkmark {
  --ok-icon-font-family: "dex-ok-dc2c9dc6be"
}

.dex-okx-defi-marketplace-checkmark:before {
  content: "\e12e";
  font-family: dex-ok-dc2c9dc6be
}

.dex-okx-defi-marketplace-selected {
  --ok-icon-font-family: "dex-ok-dc2c9dc6be"
}

.dex-okx-defi-marketplace-selected:before {
  content: "\e12d";
  font-family: dex-ok-dc2c9dc6be
}

.dex-okx-defi-marketplace-unselected {
  --ok-icon-font-family: "dex-ok-dc2c9dc6be"
}

.dex-okx-defi-marketplace-unselected:before {
  content: "\e12c";
  font-family: dex-ok-dc2c9dc6be
}

.dex-okx-defi-marketplace-qr-code {
  --ok-icon-font-family: "dex-ok-dc2c9dc6be"
}

.dex-okx-defi-marketplace-qr-code:before {
  content: "\e12b";
  font-family: dex-ok-dc2c9dc6be
}

.dex-okx-defi-marketplace-official-website {
  --ok-icon-font-family: "dex-ok-dc2c9dc6be"
}

.dex-okx-defi-marketplace-official-website:before {
  content: "\e12a";
  font-family: dex-ok-dc2c9dc6be
}

.dex-okx-defi-marketplace-line-chart {
  --ok-icon-font-family: "dex-ok-dc2c9dc6be"
}

.dex-okx-defi-marketplace-line-chart:before {
  content: "\e129";
  font-family: dex-ok-dc2c9dc6be
}

.dex-okx-defi-marketplace-failed {
  --ok-icon-font-family: "dex-ok-dc2c9dc6be"
}

.dex-okx-defi-marketplace-failed:before {
  content: "\e128";
  font-family: dex-ok-dc2c9dc6be
}

.dex-okx-defi-marketplace-information {
  --ok-icon-font-family: "dex-ok-dc2c9dc6be"
}

.dex-okx-defi-marketplace-information:before {
  content: "\e127";
  font-family: dex-ok-dc2c9dc6be
}

.dex-okx-defi-convert-okx {
  --ok-icon-font-family: "dex-ok-dc2c9dc6be"
}

.dex-okx-defi-convert-okx:before {
  content: "\e126";
  font-family: dex-ok-dc2c9dc6be
}

.dex-okx-defi-uni {
  --ok-icon-font-family: "dex-ok-dc2c9dc6be"
}

.dex-okx-defi-uni:before {
  content: "\e125";
  font-family: dex-ok-dc2c9dc6be
}

.dex-okx-defi-marketplace-gamefi-whitepaper {
  --ok-icon-font-family: "dex-ok-dc2c9dc6be"
}

.dex-okx-defi-marketplace-gamefi-whitepaper:before {
  content: "\e124";
  font-family: dex-ok-dc2c9dc6be
}

.dex-okx-defi-marketplace-gamefi-twitter {
  --ok-icon-font-family: "dex-ok-dc2c9dc6be"
}

.dex-okx-defi-marketplace-gamefi-twitter:before {
  content: "\e123";
  font-family: dex-ok-dc2c9dc6be
}

.dex-okx-defi-marketplace-gamefi-telegram {
  --ok-icon-font-family: "dex-ok-dc2c9dc6be"
}

.dex-okx-defi-marketplace-gamefi-telegram:before {
  content: "\e121";
  font-family: dex-ok-dc2c9dc6be
}

.dex-okx-defi-marketplace-gamefi-medium {
  --ok-icon-font-family: "dex-ok-dc2c9dc6be"
}

.dex-okx-defi-marketplace-gamefi-medium:before {
  content: "\e120";
  font-family: dex-ok-dc2c9dc6be
}

.dex-okx-defi-marketplace-gamefi-ins {
  --ok-icon-font-family: "dex-ok-dc2c9dc6be"
}

.dex-okx-defi-marketplace-gamefi-ins:before {
  content: "\e122";
  font-family: dex-ok-dc2c9dc6be
}

.dex-okx-defi-marketplace-gamefi-discord {
  --ok-icon-font-family: "dex-ok-dc2c9dc6be"
}

.dex-okx-defi-marketplace-gamefi-discord:before {
  content: "\e11f";
  font-family: dex-ok-dc2c9dc6be
}

.dex-okx-defi-dex-bulb {
  --ok-icon-font-family: "dex-ok-dc2c9dc6be"
}

.dex-okx-defi-dex-bulb:before {
  content: "\e11e";
  font-family: dex-ok-dc2c9dc6be
}

.dex-okx-defi-dex-snap-mode {
  --ok-icon-font-family: "dex-ok-dc2c9dc6be"
}

.dex-okx-defi-dex-snap-mode:before {
  content: "\e11d";
  font-family: dex-ok-dc2c9dc6be
}

.dex-okx-defi-dex-history {
  --ok-icon-font-family: "dex-ok-dc2c9dc6be"
}

.dex-okx-defi-dex-history:before {
  content: "\e11c";
  font-family: dex-ok-dc2c9dc6be
}

.dex-okx-defi-dex-swap-for-gas {
  --ok-icon-font-family: "dex-ok-dc2c9dc6be"
}

.dex-okx-defi-dex-swap-for-gas:before {
  content: "\e11b";
  font-family: dex-ok-dc2c9dc6be
}

.dex-okx-defi-dex-orders-1 {
  --ok-icon-font-family: "dex-ok-dc2c9dc6be"
}

.dex-okx-defi-dex-orders-1:before {
  content: "\e119";
  font-family: dex-ok-dc2c9dc6be
}

.dex-okx-defi-dex-solvers {
  --ok-icon-font-family: "dex-ok-dc2c9dc6be"
}

.dex-okx-defi-dex-solvers:before {
  content: "\e11a";
  font-family: dex-ok-dc2c9dc6be
}

.dex-okx-defi-dex-swap {
  --ok-icon-font-family: "dex-ok-dc2c9dc6be"
}

.dex-okx-defi-dex-swap:before {
  content: "\e118";
  font-family: dex-ok-dc2c9dc6be
}

.dex-okx-defi-dex-search {
  --ok-icon-font-family: "dex-ok-dc2c9dc6be"
}

.dex-okx-defi-dex-search:before {
  content: "\e117";
  font-family: dex-ok-dc2c9dc6be
}

.dex-okx-defi-dex-trash {
  --ok-icon-font-family: "dex-ok-dc2c9dc6be"
}

.dex-okx-defi-dex-trash:before {
  content: "\e116";
  font-family: dex-ok-dc2c9dc6be
}

.dex-okx-defi-marketplace-edit {
  --ok-icon-font-family: "dex-ok-dc2c9dc6be"
}

.dex-okx-defi-marketplace-edit:before {
  content: "\e115";
  font-family: dex-ok-dc2c9dc6be
}

.dex-okx-defi-marketplace-cancel {
  --ok-icon-font-family: "dex-ok-dc2c9dc6be"
}

.dex-okx-defi-marketplace-cancel:before {
  content: "\e114";
  font-family: dex-ok-dc2c9dc6be
}

.dex-okx-defi-marketplace-unlist {
  --ok-icon-font-family: "dex-ok-dc2c9dc6be"
}

.dex-okx-defi-marketplace-unlist:before {
  content: "\e113";
  font-family: dex-ok-dc2c9dc6be
}

.dex-okx-defi-marketplace-options {
  --ok-icon-font-family: "dex-ok-dc2c9dc6be"
}

.dex-okx-defi-marketplace-options:before {
  content: "\e111";
  font-family: dex-ok-dc2c9dc6be
}

.dex-okx-defi-marketplace-insights {
  --ok-icon-font-family: "dex-ok-dc2c9dc6be"
}

.dex-okx-defi-marketplace-insights:before {
  content: "\e112";
  font-family: dex-ok-dc2c9dc6be
}

.dex-okx-defi-marketplace-remove-cart {
  --ok-icon-font-family: "dex-ok-dc2c9dc6be"
}

.dex-okx-defi-marketplace-remove-cart:before {
  content: "\e110";
  font-family: dex-ok-dc2c9dc6be
}

.dex-okx-defi-marketplace-add-cart {
  --ok-icon-font-family: "dex-ok-dc2c9dc6be"
}

.dex-okx-defi-marketplace-add-cart:before {
  content: "\e10f";
  font-family: dex-ok-dc2c9dc6be
}

.dex-okx-defi-nft-share2 {
  --ok-icon-font-family: "dex-ok-dc2c9dc6be"
}

.dex-okx-defi-nft-share2:before {
  content: "\e10d";
  font-family: dex-ok-dc2c9dc6be
}

.dex-okx-defi-lock {
  --ok-icon-font-family: "dex-ok-dc2c9dc6be"
}

.dex-okx-defi-lock:before {
  content: "\e10e";
  font-family: dex-ok-dc2c9dc6be
}

.dex-okx-defi-unfollow {
  --ok-icon-font-family: "dex-ok-dc2c9dc6be"
}

.dex-okx-defi-unfollow:before {
  content: "\e10c";
  font-family: dex-ok-dc2c9dc6be
}

.dex-okx-defi-up {
  --ok-icon-font-family: "dex-ok-dc2c9dc6be"
}

.dex-okx-defi-up:before {
  content: "\e106";
  font-family: dex-ok-dc2c9dc6be
}

.dex-okx-defi-down {
  --ok-icon-font-family: "dex-ok-dc2c9dc6be"
}

.dex-okx-defi-down:before {
  content: "\e107";
  font-family: dex-ok-dc2c9dc6be
}

.dex-okx-defi-nft {
  --ok-icon-font-family: "dex-ok-dc2c9dc6be"
}

.dex-okx-defi-nft:before {
  content: "\e108";
  font-family: dex-ok-dc2c9dc6be
}

.dex-okx-defi-trade {
  --ok-icon-font-family: "dex-ok-dc2c9dc6be"
}

.dex-okx-defi-trade:before {
  content: "\e109";
  font-family: dex-ok-dc2c9dc6be
}

.dex-okx-defi-send {
  --ok-icon-font-family: "dex-ok-dc2c9dc6be"
}

.dex-okx-defi-send:before {
  content: "\e10a";
  font-family: dex-ok-dc2c9dc6be
}

.dex-okx-defi-gas {
  --ok-icon-font-family: "dex-ok-dc2c9dc6be"
}

.dex-okx-defi-gas:before {
  content: "\e10b";
  font-family: dex-ok-dc2c9dc6be
}

.dex-okx-defi-nft-arrow {
  --ok-icon-font-family: "dex-ok-dc2c9dc6be"
}

.dex-okx-defi-nft-arrow:before {
  content: "\e105";
  font-family: dex-ok-dc2c9dc6be
}

.dex-okx-defi-signal-bot {
  --ok-icon-font-family: "dex-ok-dc2c9dc6be"
}

.dex-okx-defi-signal-bot:before {
  content: "\e104";
  font-family: dex-ok-dc2c9dc6be
}

.dex-okx-defi--create {
  --ok-icon-font-family: "dex-ok-dc2c9dc6be"
}

.dex-okx-defi--create:before {
  content: "\e000";
  font-family: dex-ok-dc2c9dc6be
}

.dex-okx-defi--android {
  --ok-icon-font-family: "dex-ok-dc2c9dc6be"
}

.dex-okx-defi--android:before {
  content: "\e001";
  font-family: dex-ok-dc2c9dc6be
}

.dex-okx-defi--exchange {
  --ok-icon-font-family: "dex-ok-dc2c9dc6be"
}

.dex-okx-defi--exchange:before {
  content: "\e002";
  font-family: dex-ok-dc2c9dc6be
}

.dex-okx-defi--eye-hide {
  --ok-icon-font-family: "dex-ok-dc2c9dc6be"
}

.dex-okx-defi--eye-hide:before {
  content: "\e003";
  font-family: dex-ok-dc2c9dc6be
}

.dex-okx-defi--eye-show {
  --ok-icon-font-family: "dex-ok-dc2c9dc6be"
}

.dex-okx-defi--eye-show:before {
  content: "\e004";
  font-family: dex-ok-dc2c9dc6be
}

.dex-okx-defi--nft-tips {
  --ok-icon-font-family: "dex-ok-dc2c9dc6be"
}

.dex-okx-defi--nft-tips:before {
  content: "\e005";
  font-family: dex-ok-dc2c9dc6be
}

.dex-okx-defi--nft-trading-tutorial {
  --ok-icon-font-family: "dex-ok-dc2c9dc6be"
}

.dex-okx-defi--nft-trading-tutorial:before {
  content: "\e006";
  font-family: dex-ok-dc2c9dc6be
}

.dex-okx-defi--okc-hathathon {
  --ok-icon-font-family: "dex-ok-dc2c9dc6be"
}

.dex-okx-defi--okc-hathathon:before {
  content: "\e007";
  font-family: dex-ok-dc2c9dc6be
}

.dex-okx-defi--transfer-out {
  --ok-icon-font-family: "dex-ok-dc2c9dc6be"
}

.dex-okx-defi--transfer-out:before {
  content: "\e008";
  font-family: dex-ok-dc2c9dc6be
}

.dex-okx-defi-arrow-chevrons {
  --ok-icon-font-family: "dex-ok-dc2c9dc6be"
}

.dex-okx-defi-arrow-chevrons:before {
  content: "\e00a";
  font-family: dex-ok-dc2c9dc6be
}

.dex-okx-defi-assets {
  --ok-icon-font-family: "dex-ok-dc2c9dc6be"
}

.dex-okx-defi-assets:before {
  content: "\e00b";
  font-family: dex-ok-dc2c9dc6be
}

.dex-okx-defi-build-oracle {
  --ok-icon-font-family: "dex-ok-dc2c9dc6be"
}

.dex-okx-defi-build-oracle:before {
  content: "\e00c";
  font-family: dex-ok-dc2c9dc6be
}

.dex-okx-defi-copy {
  --ok-icon-font-family: "dex-ok-dc2c9dc6be"
}

.dex-okx-defi-copy:before {
  content: "\e00d";
  font-family: dex-ok-dc2c9dc6be
}

.dex-okx-defi-deposit {
  --ok-icon-font-family: "dex-ok-dc2c9dc6be"
}

.dex-okx-defi-deposit:before {
  content: "\e00e";
  font-family: dex-ok-dc2c9dc6be
}

.dex-okx-defi-dex-arrow-down-chevrons {
  --ok-icon-font-family: "dex-ok-dc2c9dc6be"
}

.dex-okx-defi-dex-arrow-down-chevrons:before {
  content: "\e00f";
  font-family: dex-ok-dc2c9dc6be
}

.dex-okx-defi-dex-arrow-down-sincere {
  --ok-icon-font-family: "dex-ok-dc2c9dc6be"
}

.dex-okx-defi-dex-arrow-down-sincere:before {
  content: "\e010";
  font-family: dex-ok-dc2c9dc6be
}

.dex-okx-defi-dex-arrow-down {
  --ok-icon-font-family: "dex-ok-dc2c9dc6be"
}

.dex-okx-defi-dex-arrow-down:before {
  content: "\e011";
  font-family: dex-ok-dc2c9dc6be
}

.dex-okx-defi-dex-arrow-left {
  --ok-icon-font-family: "dex-ok-dc2c9dc6be"
}

.dex-okx-defi-dex-arrow-left:before {
  content: "\e012";
  font-family: dex-ok-dc2c9dc6be
}

.dex-okx-defi-dex-arrow-right-1 {
  --ok-icon-font-family: "dex-ok-dc2c9dc6be"
}

.dex-okx-defi-dex-arrow-right-1:before {
  content: "\e013";
  font-family: dex-ok-dc2c9dc6be
}

.dex-okx-defi-dex-arrow-right-12 {
  --ok-icon-font-family: "dex-ok-dc2c9dc6be"
}

.dex-okx-defi-dex-arrow-right-12:before {
  content: "\e014";
  font-family: dex-ok-dc2c9dc6be
}

.dex-okx-defi-dex-arrow-right-top-01 {
  --ok-icon-font-family: "dex-ok-dc2c9dc6be"
}

.dex-okx-defi-dex-arrow-right-top-01:before {
  content: "\e015";
  font-family: dex-ok-dc2c9dc6be
}

.dex-okx-defi-dex-arrow-right {
  --ok-icon-font-family: "dex-ok-dc2c9dc6be"
}

.dex-okx-defi-dex-arrow-right:before {
  content: "\e016";
  font-family: dex-ok-dc2c9dc6be
}

.dex-okx-defi-dex-arrow-to {
  --ok-icon-font-family: "dex-ok-dc2c9dc6be"
}

.dex-okx-defi-dex-arrow-to:before {
  content: "\e017";
  font-family: dex-ok-dc2c9dc6be
}

.dex-okx-defi-dex-arrow-up-1 {
  --ok-icon-font-family: "dex-ok-dc2c9dc6be"
}

.dex-okx-defi-dex-arrow-up-1:before {
  content: "\e018";
  font-family: dex-ok-dc2c9dc6be
}

.dex-okx-defi-dex-arrow-up {
  --ok-icon-font-family: "dex-ok-dc2c9dc6be"
}

.dex-okx-defi-dex-arrow-up:before {
  content: "\e019";
  font-family: dex-ok-dc2c9dc6be
}

.dex-okx-defi-dex-assets {
  --ok-icon-font-family: "dex-ok-dc2c9dc6be"
}

.dex-okx-defi-dex-assets:before {
  content: "\e01a";
  font-family: dex-ok-dc2c9dc6be
}

.dex-okx-defi-dex-authorization {
  --ok-icon-font-family: "dex-ok-dc2c9dc6be"
}

.dex-okx-defi-dex-authorization:before {
  content: "\e01b";
  font-family: dex-ok-dc2c9dc6be
}

.dex-okx-defi-dex-attention {
  --ok-icon-font-family: "dex-ok-dc2c9dc6be"
}

.dex-okx-defi-dex-attention:before {
  content: "\e01c";
  font-family: dex-ok-dc2c9dc6be
}

.dex-okx-defi-dex-candle-stick {
  --ok-icon-font-family: "dex-ok-dc2c9dc6be"
}

.dex-okx-defi-dex-candle-stick:before {
  content: "\e01e";
  font-family: dex-ok-dc2c9dc6be
}

.dex-okx-defi-dex-clock {
  --ok-icon-font-family: "dex-ok-dc2c9dc6be"
}

.dex-okx-defi-dex-clock:before {
  content: "\e01f";
  font-family: dex-ok-dc2c9dc6be
}

.dex-okx-defi-dex-complete {
  --ok-icon-font-family: "dex-ok-dc2c9dc6be"
}

.dex-okx-defi-dex-complete:before {
  content: "\e020";
  font-family: dex-ok-dc2c9dc6be
}

.dex-okx-defi-dex-copy {
  --ok-icon-font-family: "dex-ok-dc2c9dc6be"
}

.dex-okx-defi-dex-copy:before {
  content: "\e021";
  font-family: dex-ok-dc2c9dc6be
}

.dex-okx-defi-dex-copy2 {
  --ok-icon-font-family: "dex-ok-dc2c9dc6be"
}

.dex-okx-defi-dex-copy2:before {
  content: "\e022";
  font-family: dex-ok-dc2c9dc6be
}

.dex-okx-defi-dex-curve {
  --ok-icon-font-family: "dex-ok-dc2c9dc6be"
}

.dex-okx-defi-dex-curve:before {
  content: "\e023";
  font-family: dex-ok-dc2c9dc6be
}

.dex-okx-defi-dex-double-arrow {
  --ok-icon-font-family: "dex-ok-dc2c9dc6be"
}

.dex-okx-defi-dex-double-arrow:before {
  content: "\e024";
  font-family: dex-ok-dc2c9dc6be
}

.dex-okx-defi-dex-error {
  --ok-icon-font-family: "dex-ok-dc2c9dc6be"
}

.dex-okx-defi-dex-error:before {
  content: "\e025";
  font-family: dex-ok-dc2c9dc6be
}

.dex-okx-defi-dex-exchange {
  --ok-icon-font-family: "dex-ok-dc2c9dc6be"
}

.dex-okx-defi-dex-exchange:before {
  content: "\e026";
  font-family: dex-ok-dc2c9dc6be
}

.dex-okx-defi-dex-fav-check {
  --ok-icon-font-family: "dex-ok-dc2c9dc6be"
}

.dex-okx-defi-dex-fav-check:before {
  content: "\e027";
  font-family: dex-ok-dc2c9dc6be
}

.dex-okx-defi-dex-fav-default {
  --ok-icon-font-family: "dex-ok-dc2c9dc6be"
}

.dex-okx-defi-dex-fav-default:before {
  content: "\e028";
  font-family: dex-ok-dc2c9dc6be
}

.dex-okx-defi-dex-filter {
  --ok-icon-font-family: "dex-ok-dc2c9dc6be"
}

.dex-okx-defi-dex-filter:before {
  content: "\e029";
  font-family: dex-ok-dc2c9dc6be
}

.dex-okx-defi-dex-fireworks-2 {
  --ok-icon-font-family: "dex-ok-dc2c9dc6be"
}

.dex-okx-defi-dex-fireworks-2:before {
  content: "\e02a";
  font-family: dex-ok-dc2c9dc6be
}

.dex-okx-defi-dex-gas-station {
  --ok-icon-font-family: "dex-ok-dc2c9dc6be"
}

.dex-okx-defi-dex-gas-station:before {
  content: "\e02b";
  font-family: dex-ok-dc2c9dc6be
}

.dex-okx-defi-dex-information-circle {
  --ok-icon-font-family: "dex-ok-dc2c9dc6be"
}

.dex-okx-defi-dex-information-circle:before {
  content: "\e02c";
  font-family: dex-ok-dc2c9dc6be
}

.dex-okx-defi-dex-market-close {
  --ok-icon-font-family: "dex-ok-dc2c9dc6be"
}

.dex-okx-defi-dex-market-close:before {
  content: "\e02d";
  font-family: dex-ok-dc2c9dc6be
}

.dex-okx-defi-dex-fireworks {
  --ok-icon-font-family: "dex-ok-dc2c9dc6be"
}

.dex-okx-defi-dex-fireworks:before {
  content: "\e02e";
  font-family: dex-ok-dc2c9dc6be
}

.dex-okx-defi-dex-gas-station-1 {
  --ok-icon-font-family: "dex-ok-dc2c9dc6be"
}

.dex-okx-defi-dex-gas-station-1:before {
  content: "\e02f";
  font-family: dex-ok-dc2c9dc6be
}

.dex-okx-defi-dex-guidebook {
  --ok-icon-font-family: "dex-ok-dc2c9dc6be"
}

.dex-okx-defi-dex-guidebook:before {
  content: "\e030";
  font-family: dex-ok-dc2c9dc6be
}

.dex-okx-defi-dex-info {
  --ok-icon-font-family: "dex-ok-dc2c9dc6be"
}

.dex-okx-defi-dex-info:before {
  content: "\e031";
  font-family: dex-ok-dc2c9dc6be
}

.dex-okx-defi-dex-information {
  --ok-icon-font-family: "dex-ok-dc2c9dc6be"
}

.dex-okx-defi-dex-information:before {
  content: "\e032";
  font-family: dex-ok-dc2c9dc6be
}

.dex-okx-defi-dex-inquiry-frames {
  --ok-icon-font-family: "dex-ok-dc2c9dc6be"
}

.dex-okx-defi-dex-inquiry-frames:before {
  content: "\e033";
  font-family: dex-ok-dc2c9dc6be
}

.dex-okx-defi-dex-limit {
  --ok-icon-font-family: "dex-ok-dc2c9dc6be"
}

.dex-okx-defi-dex-limit:before {
  content: "\e034";
  font-family: dex-ok-dc2c9dc6be
}

.dex-okx-defi-dex-setting {
  --ok-icon-font-family: "dex-ok-dc2c9dc6be"
}

.dex-okx-defi-dex-setting:before {
  content: "\e035";
  font-family: dex-ok-dc2c9dc6be
}

.dex-okx-defi-dex-link-1 {
  --ok-icon-font-family: "dex-ok-dc2c9dc6be"
}

.dex-okx-defi-dex-link-1:before {
  content: "\e036";
  font-family: dex-ok-dc2c9dc6be
}

.dex-okx-defi-dex-link {
  --ok-icon-font-family: "dex-ok-dc2c9dc6be"
}

.dex-okx-defi-dex-link:before {
  content: "\e037";
  font-family: dex-ok-dc2c9dc6be
}

.dex-okx-defi-dex-lock {
  --ok-icon-font-family: "dex-ok-dc2c9dc6be"
}

.dex-okx-defi-dex-lock:before {
  content: "\e038";
  font-family: dex-ok-dc2c9dc6be
}

.dex-okx-defi-dex-unlock {
  --ok-icon-font-family: "dex-ok-dc2c9dc6be"
}

.dex-okx-defi-dex-unlock:before {
  content: "\e039";
  font-family: dex-ok-dc2c9dc6be
}

.dex-okx-defi-dex-low-risk-svg {
  --ok-icon-font-family: "dex-ok-dc2c9dc6be"
}

.dex-okx-defi-dex-low-risk-svg:before {
  content: "\e03a";
  font-family: dex-ok-dc2c9dc6be
}

.dex-okx-defi-discord {
  --ok-icon-font-family: "dex-ok-dc2c9dc6be"
}

.dex-okx-defi-discord:before {
  content: "\e03b";
  font-family: dex-ok-dc2c9dc6be
}

.dex-okx-defi-dex-market-copy {
  --ok-icon-font-family: "dex-ok-dc2c9dc6be"
}

.dex-okx-defi-dex-market-copy:before {
  content: "\e03c";
  font-family: dex-ok-dc2c9dc6be
}

.dex-okx-defi-dex-market-sort-down {
  --ok-icon-font-family: "dex-ok-dc2c9dc6be"
}

.dex-okx-defi-dex-market-sort-down:before {
  content: "\e03d";
  font-family: dex-ok-dc2c9dc6be
}

.dex-okx-defi-googleplay {
  --ok-icon-font-family: "dex-ok-dc2c9dc6be"
}

.dex-okx-defi-googleplay:before {
  content: "\e03e";
  font-family: dex-ok-dc2c9dc6be
}

.dex-okx-defi-dex-market-sort-up {
  --ok-icon-font-family: "dex-ok-dc2c9dc6be"
}

.dex-okx-defi-dex-market-sort-up:before {
  content: "\e03f";
  font-family: dex-ok-dc2c9dc6be
}

.dex-okx-defi-ios {
  --ok-icon-font-family: "dex-ok-dc2c9dc6be"
}

.dex-okx-defi-ios:before {
  content: "\e040";
  font-family: dex-ok-dc2c9dc6be
}

.dex-okx-defi-dex-orders {
  --ok-icon-font-family: "dex-ok-dc2c9dc6be"
}

.dex-okx-defi-dex-orders:before {
  content: "\e041";
  font-family: dex-ok-dc2c9dc6be
}

.dex-okx-defi-dex-pengding {
  --ok-icon-font-family: "dex-ok-dc2c9dc6be"
}

.dex-okx-defi-dex-pengding:before {
  content: "\e042";
  font-family: dex-ok-dc2c9dc6be
}

.dex-okx-defi-marketplace-clock {
  --ok-icon-font-family: "dex-ok-dc2c9dc6be"
}

.dex-okx-defi-marketplace-clock:before {
  content: "\e043";
  font-family: dex-ok-dc2c9dc6be
}

.dex-okx-defi-dex-ranking-favorite {
  --ok-icon-font-family: "dex-ok-dc2c9dc6be"
}

.dex-okx-defi-dex-ranking-favorite:before {
  content: "\e044";
  font-family: dex-ok-dc2c9dc6be
}

.dex-okx-defi-dex-pointer-right {
  --ok-icon-font-family: "dex-ok-dc2c9dc6be"
}

.dex-okx-defi-dex-pointer-right:before {
  content: "\e045";
  font-family: dex-ok-dc2c9dc6be
}

.dex-okx-defi-dex-rate-exchange {
  --ok-icon-font-family: "dex-ok-dc2c9dc6be"
}

.dex-okx-defi-dex-rate-exchange:before {
  content: "\e046";
  font-family: dex-ok-dc2c9dc6be
}

.dex-okx-defi-marketplace-facebook {
  --ok-icon-font-family: "dex-ok-dc2c9dc6be"
}

.dex-okx-defi-marketplace-facebook:before {
  content: "\e047";
  font-family: dex-ok-dc2c9dc6be
}

.dex-okx-defi-dex-risky-svg {
  --ok-icon-font-family: "dex-ok-dc2c9dc6be"
}

.dex-okx-defi-dex-risky-svg:before {
  content: "\e048";
  font-family: dex-ok-dc2c9dc6be
}

.dex-okx-defi-dex-rout {
  --ok-icon-font-family: "dex-ok-dc2c9dc6be"
}

.dex-okx-defi-dex-rout:before {
  content: "\e049";
  font-family: dex-ok-dc2c9dc6be
}

.dex-okx-defi-dex-share {
  --ok-icon-font-family: "dex-ok-dc2c9dc6be"
}

.dex-okx-defi-dex-share:before {
  content: "\e04a";
  font-family: dex-ok-dc2c9dc6be
}

.dex-okx-defi-dex-throw-flowers {
  --ok-icon-font-family: "dex-ok-dc2c9dc6be"
}

.dex-okx-defi-dex-throw-flowers:before {
  content: "\e04b";
  font-family: dex-ok-dc2c9dc6be
}

.dex-okx-defi-marketplace-link {
  --ok-icon-font-family: "dex-ok-dc2c9dc6be"
}

.dex-okx-defi-marketplace-link:before {
  content: "\e04c";
  font-family: dex-ok-dc2c9dc6be
}

.dex-okx-defi-dex-triangle-warning {
  --ok-icon-font-family: "dex-ok-dc2c9dc6be"
}

.dex-okx-defi-dex-triangle-warning:before {
  content: "\e04d";
  font-family: dex-ok-dc2c9dc6be
}

.dex-okx-defi-dex-warning2 {
  --ok-icon-font-family: "dex-ok-dc2c9dc6be"
}

.dex-okx-defi-dex-warning2:before {
  content: "\e04e";
  font-family: dex-ok-dc2c9dc6be
}

.dex-okx-defi-dex-white-paper {
  --ok-icon-font-family: "dex-ok-dc2c9dc6be"
}

.dex-okx-defi-dex-white-paper:before {
  content: "\e04f";
  font-family: dex-ok-dc2c9dc6be
}

.dex-okx-defi-download {
  --ok-icon-font-family: "dex-ok-dc2c9dc6be"
}

.dex-okx-defi-download:before {
  content: "\e050";
  font-family: dex-ok-dc2c9dc6be
}

.dex-okx-defi-marketplace-reviewing {
  --ok-icon-font-family: "dex-ok-dc2c9dc6be"
}

.dex-okx-defi-marketplace-reviewing:before {
  content: "\e051";
  font-family: dex-ok-dc2c9dc6be
}

.dex-okx-defi-fast-withdraw {
  --ok-icon-font-family: "dex-ok-dc2c9dc6be"
}

.dex-okx-defi-fast-withdraw:before {
  content: "\e052";
  font-family: dex-ok-dc2c9dc6be
}

.dex-okx-defi-info {
  --ok-icon-font-family: "dex-ok-dc2c9dc6be"
}

.dex-okx-defi-info:before {
  content: "\e053";
  font-family: dex-ok-dc2c9dc6be
}

.dex-okx-defi-link {
  --ok-icon-font-family: "dex-ok-dc2c9dc6be"
}

.dex-okx-defi-link:before {
  content: "\e054";
  font-family: dex-ok-dc2c9dc6be
}

.dex-okx-defi-marketplace-cart {
  --ok-icon-font-family: "dex-ok-dc2c9dc6be"
}

.dex-okx-defi-marketplace-cart:before {
  content: "\e055";
  font-family: dex-ok-dc2c9dc6be
}

.dex-okx-defi-marketplace-copy {
  --ok-icon-font-family: "dex-ok-dc2c9dc6be"
}

.dex-okx-defi-marketplace-copy:before {
  content: "\e056";
  font-family: dex-ok-dc2c9dc6be
}

.dex-okx-defi-marketplace-discord {
  --ok-icon-font-family: "dex-ok-dc2c9dc6be"
}

.dex-okx-defi-marketplace-discord:before {
  content: "\e057";
  font-family: dex-ok-dc2c9dc6be
}

.dex-okx-defi-marketplace-fav {
  --ok-icon-font-family: "dex-ok-dc2c9dc6be"
}

.dex-okx-defi-marketplace-fav:before {
  content: "\e058";
  font-family: dex-ok-dc2c9dc6be
}

.dex-okx-defi-marketplace-information-filled {
  --ok-icon-font-family: "dex-ok-dc2c9dc6be"
}

.dex-okx-defi-marketplace-information-filled:before {
  content: "\e059";
  font-family: dex-ok-dc2c9dc6be
}

.dex-okx-defi-marketplace-instagram {
  --ok-icon-font-family: "dex-ok-dc2c9dc6be"
}

.dex-okx-defi-marketplace-instagram:before {
  content: "\e05a";
  font-family: dex-ok-dc2c9dc6be
}

.dex-okx-defi-marketplace-list {
  --ok-icon-font-family: "dex-ok-dc2c9dc6be"
}

.dex-okx-defi-marketplace-list:before {
  content: "\e05b";
  font-family: dex-ok-dc2c9dc6be
}

.dex-okx-defi-nft-amount {
  --ok-icon-font-family: "dex-ok-dc2c9dc6be"
}

.dex-okx-defi-nft-amount:before {
  content: "\e05c";
  font-family: dex-ok-dc2c9dc6be
}

.dex-okx-defi-nft-arrow-chevrons {
  --ok-icon-font-family: "dex-ok-dc2c9dc6be"
}

.dex-okx-defi-nft-arrow-chevrons:before {
  content: "\e05d";
  font-family: dex-ok-dc2c9dc6be
}

.dex-okx-defi-nft-arrow-pointer {
  --ok-icon-font-family: "dex-ok-dc2c9dc6be"
}

.dex-okx-defi-nft-arrow-pointer:before {
  content: "\e05e";
  font-family: dex-ok-dc2c9dc6be
}

.dex-okx-defi-nft-bid {
  --ok-icon-font-family: "dex-ok-dc2c9dc6be"
}

.dex-okx-defi-nft-bid:before {
  content: "\e05f";
  font-family: dex-ok-dc2c9dc6be
}

.dex-okx-defi-nft-cart-check {
  --ok-icon-font-family: "dex-ok-dc2c9dc6be"
}

.dex-okx-defi-nft-cart-check:before {
  content: "\e060";
  font-family: dex-ok-dc2c9dc6be
}

.dex-okx-defi-nft-cart-default {
  --ok-icon-font-family: "dex-ok-dc2c9dc6be"
}

.dex-okx-defi-nft-cart-default:before {
  content: "\e061";
  font-family: dex-ok-dc2c9dc6be
}

.dex-okx-defi-nft-cart-wc {
  --ok-icon-font-family: "dex-ok-dc2c9dc6be"
}

.dex-okx-defi-nft-cart-wc:before {
  content: "\e062";
  font-family: dex-ok-dc2c9dc6be
}

.dex-okx-defi-nft-collection {
  --ok-icon-font-family: "dex-ok-dc2c9dc6be"
}

.dex-okx-defi-nft-collection:before {
  content: "\e063";
  font-family: dex-ok-dc2c9dc6be
}

.dex-okx-defi-nft-creat-mint {
  --ok-icon-font-family: "dex-ok-dc2c9dc6be"
}

.dex-okx-defi-nft-creat-mint:before {
  content: "\e064";
  font-family: dex-ok-dc2c9dc6be
}

.dex-okx-defi-marketplace-medium {
  --ok-icon-font-family: "dex-ok-dc2c9dc6be"
}

.dex-okx-defi-marketplace-medium:before {
  content: "\e065";
  font-family: dex-ok-dc2c9dc6be
}

.dex-okx-defi-marketplace-recursive {
  --ok-icon-font-family: "dex-ok-dc2c9dc6be"
}

.dex-okx-defi-marketplace-recursive:before {
  content: "\e066";
  font-family: dex-ok-dc2c9dc6be
}

.dex-okx-defi-marketplace-star {
  --ok-icon-font-family: "dex-ok-dc2c9dc6be"
}

.dex-okx-defi-marketplace-star:before {
  content: "\e067";
  font-family: dex-ok-dc2c9dc6be
}

.dex-okx-defi-marketplace-tele {
  --ok-icon-font-family: "dex-ok-dc2c9dc6be"
}

.dex-okx-defi-marketplace-tele:before {
  content: "\e068";
  font-family: dex-ok-dc2c9dc6be
}

.dex-okx-defi-marketplace-twitter {
  --ok-icon-font-family: "dex-ok-dc2c9dc6be"
}

.dex-okx-defi-marketplace-twitter:before {
  content: "\e069";
  font-family: dex-ok-dc2c9dc6be
}

.dex-okx-defi-marketplace-twitterx {
  --ok-icon-font-family: "dex-ok-dc2c9dc6be"
}

.dex-okx-defi-marketplace-twitterx:before {
  content: "\e06a";
  font-family: dex-ok-dc2c9dc6be
}

.dex-okx-defi-nft-gas-slow {
  --ok-icon-font-family: "dex-ok-dc2c9dc6be"
}

.dex-okx-defi-nft-gas-slow:before {
  content: "\e06b";
  font-family: dex-ok-dc2c9dc6be
}

.dex-okx-defi-nft-gas-fast {
  --ok-icon-font-family: "dex-ok-dc2c9dc6be"
}

.dex-okx-defi-nft-gas-fast:before {
  content: "\e06c";
  font-family: dex-ok-dc2c9dc6be
}

.dex-okx-defi-marketplace-web {
  --ok-icon-font-family: "dex-ok-dc2c9dc6be"
}

.dex-okx-defi-marketplace-web:before {
  content: "\e06d";
  font-family: dex-ok-dc2c9dc6be
}

.dex-okx-defi-nft-going-solid {
  --ok-icon-font-family: "dex-ok-dc2c9dc6be"
}

.dex-okx-defi-nft-going-solid:before {
  content: "\e06e";
  font-family: dex-ok-dc2c9dc6be
}

.dex-okx-defi-nft-gas-standard {
  --ok-icon-font-family: "dex-ok-dc2c9dc6be"
}

.dex-okx-defi-nft-gas-standard:before {
  content: "\e06f";
  font-family: dex-ok-dc2c9dc6be
}

.dex-okx-defi-nft-information-circle {
  --ok-icon-font-family: "dex-ok-dc2c9dc6be"
}

.dex-okx-defi-nft-information-circle:before {
  content: "\e070";
  font-family: dex-ok-dc2c9dc6be
}

.dex-okx-defi-nft-going {
  --ok-icon-font-family: "dex-ok-dc2c9dc6be"
}

.dex-okx-defi-nft-going:before {
  content: "\e071";
  font-family: dex-ok-dc2c9dc6be
}

.dex-okx-defi-nft-list {
  --ok-icon-font-family: "dex-ok-dc2c9dc6be"
}

.dex-okx-defi-nft-list:before {
  content: "\e072";
  font-family: dex-ok-dc2c9dc6be
}

.dex-okx-defi-nft-items {
  --ok-icon-font-family: "dex-ok-dc2c9dc6be"
}

.dex-okx-defi-nft-items:before {
  content: "\e073";
  font-family: dex-ok-dc2c9dc6be
}

.dex-okx-defi-nft-activity {
  --ok-icon-font-family: "dex-ok-dc2c9dc6be"
}

.dex-okx-defi-nft-activity:before {
  content: "\e074";
  font-family: dex-ok-dc2c9dc6be
}

.dex-okx-defi-nft-brush {
  --ok-icon-font-family: "dex-ok-dc2c9dc6be"
}

.dex-okx-defi-nft-brush:before {
  content: "\e075";
  font-family: dex-ok-dc2c9dc6be
}

.dex-okx-defi-nft-coin {
  --ok-icon-font-family: "dex-ok-dc2c9dc6be"
}

.dex-okx-defi-nft-coin:before {
  content: "\e076";
  font-family: dex-ok-dc2c9dc6be
}

.dex-okx-defi-nft-listnft {
  --ok-icon-font-family: "dex-ok-dc2c9dc6be"
}

.dex-okx-defi-nft-listnft:before {
  content: "\e077";
  font-family: dex-ok-dc2c9dc6be
}

.dex-okx-defi-nft-create {
  --ok-icon-font-family: "dex-ok-dc2c9dc6be"
}

.dex-okx-defi-nft-create:before {
  content: "\e078";
  font-family: dex-ok-dc2c9dc6be
}

.dex-okx-defi-nft-destroy {
  --ok-icon-font-family: "dex-ok-dc2c9dc6be"
}

.dex-okx-defi-nft-destroy:before {
  content: "\e079";
  font-family: dex-ok-dc2c9dc6be
}

.dex-okx-defi-nft-nav-profile {
  --ok-icon-font-family: "dex-ok-dc2c9dc6be"
}

.dex-okx-defi-nft-nav-profile:before {
  content: "\e07a";
  font-family: dex-ok-dc2c9dc6be
}

.dex-okx-defi-nft-download {
  --ok-icon-font-family: "dex-ok-dc2c9dc6be"
}

.dex-okx-defi-nft-download:before {
  content: "\e07b";
  font-family: dex-ok-dc2c9dc6be
}

.dex-okx-defi-nft-phone {
  --ok-icon-font-family: "dex-ok-dc2c9dc6be"
}

.dex-okx-defi-nft-phone:before {
  content: "\e07c";
  font-family: dex-ok-dc2c9dc6be
}

.dex-okx-defi-nft-number {
  --ok-icon-font-family: "dex-ok-dc2c9dc6be"
}

.dex-okx-defi-nft-number:before {
  content: "\e07d";
  font-family: dex-ok-dc2c9dc6be
}

.dex-okx-defi-nft-drop {
  --ok-icon-font-family: "dex-ok-dc2c9dc6be"
}

.dex-okx-defi-nft-drop:before {
  content: "\e07e";
  font-family: dex-ok-dc2c9dc6be
}

.dex-okx-defi-nft-edit {
  --ok-icon-font-family: "dex-ok-dc2c9dc6be"
}

.dex-okx-defi-nft-edit:before {
  content: "\e07f";
  font-family: dex-ok-dc2c9dc6be
}

.dex-okx-defi-nft-featured {
  --ok-icon-font-family: "dex-ok-dc2c9dc6be"
}

.dex-okx-defi-nft-featured:before {
  content: "\e080";
  font-family: dex-ok-dc2c9dc6be
}

.dex-okx-defi-nft-filter-chevrons {
  --ok-icon-font-family: "dex-ok-dc2c9dc6be"
}

.dex-okx-defi-nft-filter-chevrons:before {
  content: "\e081";
  font-family: dex-ok-dc2c9dc6be
}

.dex-okx-defi-nft-filter-refresh {
  --ok-icon-font-family: "dex-ok-dc2c9dc6be"
}

.dex-okx-defi-nft-filter-refresh:before {
  content: "\e082";
  font-family: dex-ok-dc2c9dc6be
}

.dex-okx-defi-nft-filter-arrow {
  --ok-icon-font-family: "dex-ok-dc2c9dc6be"
}

.dex-okx-defi-nft-filter-arrow:before {
  content: "\e083";
  font-family: dex-ok-dc2c9dc6be
}

.dex-okx-defi-nft-funding {
  --ok-icon-font-family: "dex-ok-dc2c9dc6be"
}

.dex-okx-defi-nft-funding:before {
  content: "\e084";
  font-family: dex-ok-dc2c9dc6be
}

.dex-okx-defi-nft-gas-custom {
  --ok-icon-font-family: "dex-ok-dc2c9dc6be"
}

.dex-okx-defi-nft-gas-custom:before {
  content: "\e085";
  font-family: dex-ok-dc2c9dc6be
}

.dex-okx-defi-nft-filter {
  --ok-icon-font-family: "dex-ok-dc2c9dc6be"
}

.dex-okx-defi-nft-filter:before {
  content: "\e086";
  font-family: dex-ok-dc2c9dc6be
}

.dex-okx-defi-nft-location {
  --ok-icon-font-family: "dex-ok-dc2c9dc6be"
}

.dex-okx-defi-nft-location:before {
  content: "\e087";
  font-family: dex-ok-dc2c9dc6be
}

.dex-okx-defi-nft-mail {
  --ok-icon-font-family: "dex-ok-dc2c9dc6be"
}

.dex-okx-defi-nft-mail:before {
  content: "\e088";
  font-family: dex-ok-dc2c9dc6be
}

.dex-okx-defi-nft-nav-cart {
  --ok-icon-font-family: "dex-ok-dc2c9dc6be"
}

.dex-okx-defi-nft-nav-cart:before {
  content: "\e089";
  font-family: dex-ok-dc2c9dc6be
}

.dex-okx-defi-nft-more {
  --ok-icon-font-family: "dex-ok-dc2c9dc6be"
}

.dex-okx-defi-nft-more:before {
  content: "\e08a";
  font-family: dex-ok-dc2c9dc6be
}

.dex-okx-defi-nft-nav-favorites {
  --ok-icon-font-family: "dex-ok-dc2c9dc6be"
}

.dex-okx-defi-nft-nav-favorites:before {
  content: "\e08b";
  font-family: dex-ok-dc2c9dc6be
}

.dex-okx-defi-nft-overview {
  --ok-icon-font-family: "dex-ok-dc2c9dc6be"
}

.dex-okx-defi-nft-overview:before {
  content: "\e08c";
  font-family: dex-ok-dc2c9dc6be
}

.dex-okx-defi-nft-plus {
  --ok-icon-font-family: "dex-ok-dc2c9dc6be"
}

.dex-okx-defi-nft-plus:before {
  content: "\e08d";
  font-family: dex-ok-dc2c9dc6be
}

.dex-okx-defi-nft-purchase {
  --ok-icon-font-family: "dex-ok-dc2c9dc6be"
}

.dex-okx-defi-nft-purchase:before {
  content: "\e08e";
  font-family: dex-ok-dc2c9dc6be
}

.dex-okx-defi-nft-ranking {
  --ok-icon-font-family: "dex-ok-dc2c9dc6be"
}

.dex-okx-defi-nft-ranking:before {
  content: "\e08f";
  font-family: dex-ok-dc2c9dc6be
}

.dex-okx-defi-nft-rankings {
  --ok-icon-font-family: "dex-ok-dc2c9dc6be"
}

.dex-okx-defi-nft-rankings:before {
  content: "\e090";
  font-family: dex-ok-dc2c9dc6be
}

.dex-okx-defi-okbc-community3 {
  --ok-icon-font-family: "dex-ok-dc2c9dc6be"
}

.dex-okx-defi-okbc-community3:before {
  content: "\e091";
  font-family: dex-ok-dc2c9dc6be
}

.dex-okx-defi-nft-refresh {
  --ok-icon-font-family: "dex-ok-dc2c9dc6be"
}

.dex-okx-defi-nft-refresh:before {
  content: "\e092";
  font-family: dex-ok-dc2c9dc6be
}

.dex-okx-defi-nft-rewards {
  --ok-icon-font-family: "dex-ok-dc2c9dc6be"
}

.dex-okx-defi-nft-rewards:before {
  content: "\e093";
  font-family: dex-ok-dc2c9dc6be
}

.dex-okx-defi-nft-share {
  --ok-icon-font-family: "dex-ok-dc2c9dc6be"
}

.dex-okx-defi-nft-share:before {
  content: "\e094";
  font-family: dex-ok-dc2c9dc6be
}

.dex-okx-defi-nft-selected {
  --ok-icon-font-family: "dex-ok-dc2c9dc6be"
}

.dex-okx-defi-nft-selected:before {
  content: "\e095";
  font-family: dex-ok-dc2c9dc6be
}

.dex-okx-defi-nft-ticket {
  --ok-icon-font-family: "dex-ok-dc2c9dc6be"
}

.dex-okx-defi-nft-ticket:before {
  content: "\e096";
  font-family: dex-ok-dc2c9dc6be
}

.dex-okx-defi-nft-switch {
  --ok-icon-font-family: "dex-ok-dc2c9dc6be"
}

.dex-okx-defi-nft-switch:before {
  content: "\e097";
  font-family: dex-ok-dc2c9dc6be
}

.dex-okx-defi-okbc-bitcoin {
  --ok-icon-font-family: "dex-ok-dc2c9dc6be"
}

.dex-okx-defi-okbc-bitcoin:before {
  content: "\e098";
  font-family: dex-ok-dc2c9dc6be
}

.dex-okx-defi-nft-trade {
  --ok-icon-font-family: "dex-ok-dc2c9dc6be"
}

.dex-okx-defi-nft-trade:before {
  content: "\e099";
  font-family: dex-ok-dc2c9dc6be
}

.dex-okx-defi-nft-transfer {
  --ok-icon-font-family: "dex-ok-dc2c9dc6be"
}

.dex-okx-defi-nft-transfer:before {
  content: "\e09a";
  font-family: dex-ok-dc2c9dc6be
}

.dex-okx-defi-nft-twitter3 {
  --ok-icon-font-family: "dex-ok-dc2c9dc6be"
}

.dex-okx-defi-nft-twitter3:before {
  content: "\e09b";
  font-family: dex-ok-dc2c9dc6be
}

.dex-okx-defi-okbc-get {
  --ok-icon-font-family: "dex-ok-dc2c9dc6be"
}

.dex-okx-defi-okbc-get:before {
  content: "\e09c";
  font-family: dex-ok-dc2c9dc6be
}

.dex-okx-defi-okbc-marketplace {
  --ok-icon-font-family: "dex-ok-dc2c9dc6be"
}

.dex-okx-defi-okbc-marketplace:before {
  content: "\e09d";
  font-family: dex-ok-dc2c9dc6be
}

.dex-okx-defi-nft-unbrush {
  --ok-icon-font-family: "dex-ok-dc2c9dc6be"
}

.dex-okx-defi-nft-unbrush:before {
  content: "\e09e";
  font-family: dex-ok-dc2c9dc6be
}

.dex-okx-defi-nft-withdraw {
  --ok-icon-font-family: "dex-ok-dc2c9dc6be"
}

.dex-okx-defi-nft-withdraw:before {
  content: "\e09f";
  font-family: dex-ok-dc2c9dc6be
}

.dex-okx-defi-okbc-arrow {
  --ok-icon-font-family: "dex-ok-dc2c9dc6be"
}

.dex-okx-defi-okbc-arrow:before {
  content: "\e0a0";
  font-family: dex-ok-dc2c9dc6be
}

.dex-okx-defi-okbc-build {
  --ok-icon-font-family: "dex-ok-dc2c9dc6be"
}

.dex-okx-defi-okbc-build:before {
  content: "\e0a1";
  font-family: dex-ok-dc2c9dc6be
}

.dex-okx-defi-okbc-community {
  --ok-icon-font-family: "dex-ok-dc2c9dc6be"
}

.dex-okx-defi-okbc-community:before {
  content: "\e0a2";
  font-family: dex-ok-dc2c9dc6be
}

.dex-okx-defi-nft-unfavorite {
  --ok-icon-font-family: "dex-ok-dc2c9dc6be"
}

.dex-okx-defi-nft-unfavorite:before {
  content: "\e0a3";
  font-family: dex-ok-dc2c9dc6be
}

.dex-okx-defi-okbc-community4 {
  --ok-icon-font-family: "dex-ok-dc2c9dc6be"
}

.dex-okx-defi-okbc-community4:before {
  content: "\e0a4";
  font-family: dex-ok-dc2c9dc6be
}

.dex-okx-defi-okbc-community2 {
  --ok-icon-font-family: "dex-ok-dc2c9dc6be"
}

.dex-okx-defi-okbc-community2:before {
  content: "\e0a5";
  font-family: dex-ok-dc2c9dc6be
}

.dex-okx-defi-okc-bridge {
  --ok-icon-font-family: "dex-ok-dc2c9dc6be"
}

.dex-okx-defi-okc-bridge:before {
  content: "\e0a6";
  font-family: dex-ok-dc2c9dc6be
}

.dex-okx-defi-okbc-overview {
  --ok-icon-font-family: "dex-ok-dc2c9dc6be"
}

.dex-okx-defi-okbc-overview:before {
  content: "\e0a7";
  font-family: dex-ok-dc2c9dc6be
}

.dex-okx-defi-okbc-scalability {
  --ok-icon-font-family: "dex-ok-dc2c9dc6be"
}

.dex-okx-defi-okbc-scalability:before {
  content: "\e0a8";
  font-family: dex-ok-dc2c9dc6be
}

.dex-okx-defi-okc-btc {
  --ok-icon-font-family: "dex-ok-dc2c9dc6be"
}

.dex-okx-defi-okc-btc:before {
  content: "\e0a9";
  font-family: dex-ok-dc2c9dc6be
}

.dex-okx-defi-okc-chat {
  --ok-icon-font-family: "dex-ok-dc2c9dc6be"
}

.dex-okx-defi-okc-chat:before {
  content: "\e0aa";
  font-family: dex-ok-dc2c9dc6be
}

.dex-okx-defi-okbc-deploy {
  --ok-icon-font-family: "dex-ok-dc2c9dc6be"
}

.dex-okx-defi-okbc-deploy:before {
  content: "\e0ab";
  font-family: dex-ok-dc2c9dc6be
}

.dex-okx-defi-okc-delete {
  --ok-icon-font-family: "dex-ok-dc2c9dc6be"
}

.dex-okx-defi-okc-delete:before {
  content: "\e0ac";
  font-family: dex-ok-dc2c9dc6be
}

.dex-okx-defi-okbc-dexapi {
  --ok-icon-font-family: "dex-ok-dc2c9dc6be"
}

.dex-okx-defi-okbc-dexapi:before {
  content: "\e0ad";
  font-family: dex-ok-dc2c9dc6be
}

.dex-okx-defi-nft-unselect {
  --ok-icon-font-family: "dex-ok-dc2c9dc6be"
}

.dex-okx-defi-nft-unselect:before {
  content: "\e0ae";
  font-family: dex-ok-dc2c9dc6be
}

.dex-okx-defi-nft-wechat {
  --ok-icon-font-family: "dex-ok-dc2c9dc6be"
}

.dex-okx-defi-nft-wechat:before {
  content: "\e0af";
  font-family: dex-ok-dc2c9dc6be
}

.dex-okx-defi-okbc-community1 {
  --ok-icon-font-family: "dex-ok-dc2c9dc6be"
}

.dex-okx-defi-okbc-community1:before {
  content: "\e0b0";
  font-family: dex-ok-dc2c9dc6be
}

.dex-okx-defi-okbc-email {
  --ok-icon-font-family: "dex-ok-dc2c9dc6be"
}

.dex-okx-defi-okbc-email:before {
  content: "\e0b1";
  font-family: dex-ok-dc2c9dc6be
}

.dex-okx-defi-okc-editor {
  --ok-icon-font-family: "dex-ok-dc2c9dc6be"
}

.dex-okx-defi-okc-editor:before {
  content: "\e0b2";
  font-family: dex-ok-dc2c9dc6be
}

.dex-okx-defi-okbc-operates {
  --ok-icon-font-family: "dex-ok-dc2c9dc6be"
}

.dex-okx-defi-okbc-operates:before {
  content: "\e0b3";
  font-family: dex-ok-dc2c9dc6be
}

.dex-okx-defi-okc-loading-2 {
  --ok-icon-font-family: "dex-ok-dc2c9dc6be"
}

.dex-okx-defi-okc-loading-2:before {
  content: "\e0b4";
  font-family: dex-ok-dc2c9dc6be
}

.dex-okx-defi-okbc-powered {
  --ok-icon-font-family: "dex-ok-dc2c9dc6be"
}

.dex-okx-defi-okbc-powered:before {
  content: "\e0b5";
  font-family: dex-ok-dc2c9dc6be
}

.dex-okx-defi-okbc-resources {
  --ok-icon-font-family: "dex-ok-dc2c9dc6be"
}

.dex-okx-defi-okbc-resources:before {
  content: "\e0b6";
  font-family: dex-ok-dc2c9dc6be
}

.dex-okx-defi-okbc-wallet {
  --ok-icon-font-family: "dex-ok-dc2c9dc6be"
}

.dex-okx-defi-okbc-wallet:before {
  content: "\e0b7";
  font-family: dex-ok-dc2c9dc6be
}

.dex-okx-defi-okc-medium {
  --ok-icon-font-family: "dex-ok-dc2c9dc6be"
}

.dex-okx-defi-okc-medium:before {
  content: "\e0b8";
  font-family: dex-ok-dc2c9dc6be
}

.dex-okx-defi-okbc-wasm {
  --ok-icon-font-family: "dex-ok-dc2c9dc6be"
}

.dex-okx-defi-okbc-wasm:before {
  content: "\e0b9";
  font-family: dex-ok-dc2c9dc6be
}

.dex-okx-defi-okc-block {
  --ok-icon-font-family: "dex-ok-dc2c9dc6be"
}

.dex-okx-defi-okc-block:before {
  content: "\e0ba";
  font-family: dex-ok-dc2c9dc6be
}

.dex-okx-defi-okc-cart {
  --ok-icon-font-family: "dex-ok-dc2c9dc6be"
}

.dex-okx-defi-okc-cart:before {
  content: "\e0bb";
  font-family: dex-ok-dc2c9dc6be
}

.dex-okx-defi-okc-nft-transfer {
  --ok-icon-font-family: "dex-ok-dc2c9dc6be"
}

.dex-okx-defi-okc-nft-transfer:before {
  content: "\e0bc";
  font-family: dex-ok-dc2c9dc6be
}

.dex-okx-defi-okc-data {
  --ok-icon-font-family: "dex-ok-dc2c9dc6be"
}

.dex-okx-defi-okc-data:before {
  content: "\e0bd";
  font-family: dex-ok-dc2c9dc6be
}

.dex-okx-defi-okc-faucet {
  --ok-icon-font-family: "dex-ok-dc2c9dc6be"
}

.dex-okx-defi-okc-faucet:before {
  content: "\e0be";
  font-family: dex-ok-dc2c9dc6be
}

.dex-okx-defi-okc-details {
  --ok-icon-font-family: "dex-ok-dc2c9dc6be"
}

.dex-okx-defi-okc-details:before {
  content: "\e0bf";
  font-family: dex-ok-dc2c9dc6be
}

.dex-okx-defi-okc-discord {
  --ok-icon-font-family: "dex-ok-dc2c9dc6be"
}

.dex-okx-defi-okc-discord:before {
  content: "\e0c0";
  font-family: dex-ok-dc2c9dc6be
}

.dex-okx-defi-okc-history {
  --ok-icon-font-family: "dex-ok-dc2c9dc6be"
}

.dex-okx-defi-okc-history:before {
  content: "\e0c1";
  font-family: dex-ok-dc2c9dc6be
}

.dex-okx-defi-okc-remove {
  --ok-icon-font-family: "dex-ok-dc2c9dc6be"
}

.dex-okx-defi-okc-remove:before {
  content: "\e0c2";
  font-family: dex-ok-dc2c9dc6be
}

.dex-okx-defi-okc-down {
  --ok-icon-font-family: "dex-ok-dc2c9dc6be"
}

.dex-okx-defi-okc-down:before {
  content: "\e0c3";
  font-family: dex-ok-dc2c9dc6be
}

.dex-okx-defi-okc-pause {
  --ok-icon-font-family: "dex-ok-dc2c9dc6be"
}

.dex-okx-defi-okc-pause:before {
  content: "\e0c4";
  font-family: dex-ok-dc2c9dc6be
}

.dex-okx-defi-okc-drawback {
  --ok-icon-font-family: "dex-ok-dc2c9dc6be"
}

.dex-okx-defi-okc-drawback:before {
  content: "\e0c5";
  font-family: dex-ok-dc2c9dc6be
}

.dex-okx-defi-okc-switch {
  --ok-icon-font-family: "dex-ok-dc2c9dc6be"
}

.dex-okx-defi-okc-switch:before {
  content: "\e0c6";
  font-family: dex-ok-dc2c9dc6be
}

.dex-okx-defi-okc-draw {
  --ok-icon-font-family: "dex-ok-dc2c9dc6be"
}

.dex-okx-defi-okc-draw:before {
  content: "\e0c7";
  font-family: dex-ok-dc2c9dc6be
}

.dex-okx-defi-okc-play {
  --ok-icon-font-family: "dex-ok-dc2c9dc6be"
}

.dex-okx-defi-okc-play:before {
  content: "\e0c8";
  font-family: dex-ok-dc2c9dc6be
}

.dex-okx-defi-okc-email {
  --ok-icon-font-family: "dex-ok-dc2c9dc6be"
}

.dex-okx-defi-okc-email:before {
  content: "\e0c9";
  font-family: dex-ok-dc2c9dc6be
}

.dex-okx-defi-okc-download {
  --ok-icon-font-family: "dex-ok-dc2c9dc6be"
}

.dex-okx-defi-okc-download:before {
  content: "\e0ca";
  font-family: dex-ok-dc2c9dc6be
}

.dex-okx-defi-okc-tf-balance {
  --ok-icon-font-family: "dex-ok-dc2c9dc6be"
}

.dex-okx-defi-okc-tf-balance:before {
  content: "\e0cb";
  font-family: dex-ok-dc2c9dc6be
}

.dex-okx-defi-okc-exchange {
  --ok-icon-font-family: "dex-ok-dc2c9dc6be"
}

.dex-okx-defi-okc-exchange:before {
  content: "\e0cc";
  font-family: dex-ok-dc2c9dc6be
}

.dex-okx-defi-okc-trends {
  --ok-icon-font-family: "dex-ok-dc2c9dc6be"
}

.dex-okx-defi-okc-trends:before {
  content: "\e0cd";
  font-family: dex-ok-dc2c9dc6be
}

.dex-okx-defi-okc-twitter {
  --ok-icon-font-family: "dex-ok-dc2c9dc6be"
}

.dex-okx-defi-okc-twitter:before {
  content: "\e0ce";
  font-family: dex-ok-dc2c9dc6be
}

.dex-okx-defi-okc-website {
  --ok-icon-font-family: "dex-ok-dc2c9dc6be"
}

.dex-okx-defi-okc-website:before {
  content: "\e0cf";
  font-family: dex-ok-dc2c9dc6be
}

.dex-okx-defi-okc-yoursite {
  --ok-icon-font-family: "dex-ok-dc2c9dc6be"
}

.dex-okx-defi-okc-yoursite:before {
  content: "\e0d0";
  font-family: dex-ok-dc2c9dc6be
}

.dex-okx-defi-okc-up {
  --ok-icon-font-family: "dex-ok-dc2c9dc6be"
}

.dex-okx-defi-okc-up:before {
  content: "\e0d1";
  font-family: dex-ok-dc2c9dc6be
}

.dex-okx-defi-okc-zap-swap {
  --ok-icon-font-family: "dex-ok-dc2c9dc6be"
}

.dex-okx-defi-okc-zap-swap:before {
  content: "\e0d2";
  font-family: dex-ok-dc2c9dc6be
}

.dex-okx-defi-oktc-autopilot {
  --ok-icon-font-family: "dex-ok-dc2c9dc6be"
}

.dex-okx-defi-oktc-autopilot:before {
  content: "\e0d3";
  font-family: dex-ok-dc2c9dc6be
}

.dex-okx-defi-okc-zap {
  --ok-icon-font-family: "dex-ok-dc2c9dc6be"
}

.dex-okx-defi-okc-zap:before {
  content: "\e0d4";
  font-family: dex-ok-dc2c9dc6be
}

.dex-okx-defi-oktc-dawn {
  --ok-icon-font-family: "dex-ok-dc2c9dc6be"
}

.dex-okx-defi-oktc-dawn:before {
  content: "\e0d5";
  font-family: dex-ok-dc2c9dc6be
}

.dex-okx-defi-oktc-sidenets {
  --ok-icon-font-family: "dex-ok-dc2c9dc6be"
}

.dex-okx-defi-oktc-sidenets:before {
  content: "\e0d6";
  font-family: dex-ok-dc2c9dc6be
}

.dex-okx-defi-oktc-thunderbolt {
  --ok-icon-font-family: "dex-ok-dc2c9dc6be"
}

.dex-okx-defi-oktc-thunderbolt:before {
  content: "\e0d7";
  font-family: dex-ok-dc2c9dc6be
}

.dex-okx-defi-oktc-wasm {
  --ok-icon-font-family: "dex-ok-dc2c9dc6be"
}

.dex-okx-defi-oktc-wasm:before {
  content: "\e0d8";
  font-family: dex-ok-dc2c9dc6be
}

.dex-okx-defi-oktc-trinity {
  --ok-icon-font-family: "dex-ok-dc2c9dc6be"
}

.dex-okx-defi-oktc-trinity:before {
  content: "\e0d9";
  font-family: dex-ok-dc2c9dc6be
}

.dex-okx-defi-oktc-zkevm {
  --ok-icon-font-family: "dex-ok-dc2c9dc6be"
}

.dex-okx-defi-oktc-zkevm:before {
  content: "\e0da";
  font-family: dex-ok-dc2c9dc6be
}

.dex-okx-defi-open-link {
  --ok-icon-font-family: "dex-ok-dc2c9dc6be"
}

.dex-okx-defi-open-link:before {
  content: "\e0db";
  font-family: dex-ok-dc2c9dc6be
}

.dex-okx-defi-okc-judgerules {
  --ok-icon-font-family: "dex-ok-dc2c9dc6be"
}

.dex-okx-defi-okc-judgerules:before {
  content: "\e0dc";
  font-family: dex-ok-dc2c9dc6be
}

.dex-okx-defi-share {
  --ok-icon-font-family: "dex-ok-dc2c9dc6be"
}

.dex-okx-defi-share:before {
  content: "\e0dd";
  font-family: dex-ok-dc2c9dc6be
}

.dex-okx-defi-status-alert {
  --ok-icon-font-family: "dex-ok-dc2c9dc6be"
}

.dex-okx-defi-status-alert:before {
  content: "\e0de";
  font-family: dex-ok-dc2c9dc6be
}

.dex-okx-defi-okc-loading {
  --ok-icon-font-family: "dex-ok-dc2c9dc6be"
}

.dex-okx-defi-okc-loading:before {
  content: "\e0df";
  font-family: dex-ok-dc2c9dc6be
}

.dex-okx-defi-status-waiting {
  --ok-icon-font-family: "dex-ok-dc2c9dc6be"
}

.dex-okx-defi-status-waiting:before {
  content: "\e0e0";
  font-family: dex-ok-dc2c9dc6be
}

.dex-okx-defi-status-filled {
  --ok-icon-font-family: "dex-ok-dc2c9dc6be"
}

.dex-okx-defi-status-filled:before {
  content: "\e0e1";
  font-family: dex-ok-dc2c9dc6be
}

.dex-okx-defi-steps-1 {
  --ok-icon-font-family: "dex-ok-dc2c9dc6be"
}

.dex-okx-defi-steps-1:before {
  content: "\e0e2";
  font-family: dex-ok-dc2c9dc6be
}

.dex-okx-defi-steps-2 {
  --ok-icon-font-family: "dex-ok-dc2c9dc6be"
}

.dex-okx-defi-steps-2:before {
  content: "\e0e3";
  font-family: dex-ok-dc2c9dc6be
}

.dex-okx-defi-steps-3 {
  --ok-icon-font-family: "dex-ok-dc2c9dc6be"
}

.dex-okx-defi-steps-3:before {
  content: "\e0e4";
  font-family: dex-ok-dc2c9dc6be
}

.dex-okx-defi-success-circle {
  --ok-icon-font-family: "dex-ok-dc2c9dc6be"
}

.dex-okx-defi-success-circle:before {
  content: "\e0e5";
  font-family: dex-ok-dc2c9dc6be
}

.dex-okx-defi-transfer-in {
  --ok-icon-font-family: "dex-ok-dc2c9dc6be"
}

.dex-okx-defi-transfer-in:before {
  content: "\e0e6";
  font-family: dex-ok-dc2c9dc6be
}

.dex-okx-defi-withdraw {
  --ok-icon-font-family: "dex-ok-dc2c9dc6be"
}

.dex-okx-defi-withdraw:before {
  content: "\e0e7";
  font-family: dex-ok-dc2c9dc6be
}

.dex-okx-defi-x1-buy-1 {
  --ok-icon-font-family: "dex-ok-dc2c9dc6be"
}

.dex-okx-defi-x1-buy-1:before {
  content: "\e0e8";
  font-family: dex-ok-dc2c9dc6be
}

.dex-okx-defi-x1-liquidity-minus {
  --ok-icon-font-family: "dex-ok-dc2c9dc6be"
}

.dex-okx-defi-x1-liquidity-minus:before {
  content: "\e0e9";
  font-family: dex-ok-dc2c9dc6be
}

.dex-okx-defi-x1-liquidity-plus {
  --ok-icon-font-family: "dex-ok-dc2c9dc6be"
}

.dex-okx-defi-x1-liquidity-plus:before {
  content: "\e0ea";
  font-family: dex-ok-dc2c9dc6be
}

.dex-okx-defi-x1-listforsale {
  --ok-icon-font-family: "dex-ok-dc2c9dc6be"
}

.dex-okx-defi-x1-listforsale:before {
  content: "\e0eb";
  font-family: dex-ok-dc2c9dc6be
}

.dex-okx-defi-x1-subgraph {
  --ok-icon-font-family: "dex-ok-dc2c9dc6be"
}

.dex-okx-defi-x1-subgraph:before {
  content: "\e0ec";
  font-family: dex-ok-dc2c9dc6be
}

.dex-okx-defi-xgon-linkedin-1 {
  --ok-icon-font-family: "dex-ok-dc2c9dc6be"
}

.dex-okx-defi-xgon-linkedin-1:before {
  content: "\e0ed";
  font-family: dex-ok-dc2c9dc6be
}

.dex-okx-defi-yield-android {
  --ok-icon-font-family: "dex-ok-dc2c9dc6be"
}

.dex-okx-defi-yield-android:before {
  content: "\e0ee";
  font-family: dex-ok-dc2c9dc6be
}

.dex-okx-defi-xgon-github-1 {
  --ok-icon-font-family: "dex-ok-dc2c9dc6be"
}

.dex-okx-defi-xgon-github-1:before {
  content: "\e0ef";
  font-family: dex-ok-dc2c9dc6be
}

.dex-okx-defi-yield-apple {
  --ok-icon-font-family: "dex-ok-dc2c9dc6be"
}

.dex-okx-defi-yield-apple:before {
  content: "\e0f0";
  font-family: dex-ok-dc2c9dc6be
}

.dex-okx-defi-okc-instagram {
  --ok-icon-font-family: "dex-ok-dc2c9dc6be"
}

.dex-okx-defi-okc-instagram:before {
  content: "\e0f1";
  font-family: dex-ok-dc2c9dc6be
}

.dex-okx-defi-yield-bonus {
  --ok-icon-font-family: "dex-ok-dc2c9dc6be"
}

.dex-okx-defi-yield-bonus:before {
  content: "\e0f2";
  font-family: dex-ok-dc2c9dc6be
}

.dex-okx-defi-yield-deploy {
  --ok-icon-font-family: "dex-ok-dc2c9dc6be"
}

.dex-okx-defi-yield-deploy:before {
  content: "\e0f3";
  font-family: dex-ok-dc2c9dc6be
}

.dex-okx-defi-yield-delete {
  --ok-icon-font-family: "dex-ok-dc2c9dc6be"
}

.dex-okx-defi-yield-delete:before {
  content: "\e0f4";
  font-family: dex-ok-dc2c9dc6be
}

.dex-okx-defi-yield-pengding {
  --ok-icon-font-family: "dex-ok-dc2c9dc6be"
}

.dex-okx-defi-yield-pengding:before {
  content: "\e0f5";
  font-family: dex-ok-dc2c9dc6be
}

.dex-okx-defi-yield-zoomout {
  --ok-icon-font-family: "dex-ok-dc2c9dc6be"
}

.dex-okx-defi-yield-zoomout:before {
  content: "\e0f6";
  font-family: dex-ok-dc2c9dc6be
}

.dex-okx-defi-okc-like {
  --ok-icon-font-family: "dex-ok-dc2c9dc6be"
}

.dex-okx-defi-okc-like:before {
  content: "\e0f7";
  font-family: dex-ok-dc2c9dc6be
}

.dex-okx-defi-yield-zoomin {
  --ok-icon-font-family: "dex-ok-dc2c9dc6be"
}

.dex-okx-defi-yield-zoomin:before {
  content: "\e0f8";
  font-family: dex-ok-dc2c9dc6be
}

.dex-okx-defi-okc-explorer {
  --ok-icon-font-family: "dex-ok-dc2c9dc6be"
}

.dex-okx-defi-okc-explorer:before {
  content: "\e0f9";
  font-family: dex-ok-dc2c9dc6be
}

.dex-okx-defi-okc-more {
  --ok-icon-font-family: "dex-ok-dc2c9dc6be"
}

.dex-okx-defi-okc-more:before {
  content: "\e0fa";
  font-family: dex-ok-dc2c9dc6be
}

.dex-okx-defi-okc-nft-youtube {
  --ok-icon-font-family: "dex-ok-dc2c9dc6be"
}

.dex-okx-defi-okc-nft-youtube:before {
  content: "\e0fb";
  font-family: dex-ok-dc2c9dc6be
}

.dex-okx-defi-okc-github {
  --ok-icon-font-family: "dex-ok-dc2c9dc6be"
}

.dex-okx-defi-okc-github:before {
  content: "\e0fc";
  font-family: dex-ok-dc2c9dc6be
}

.dex-okx-defi-okc-refresh {
  --ok-icon-font-family: "dex-ok-dc2c9dc6be"
}

.dex-okx-defi-okc-refresh:before {
  content: "\e0fd";
  font-family: dex-ok-dc2c9dc6be
}

.dex-okx-defi-okc-return {
  --ok-icon-font-family: "dex-ok-dc2c9dc6be"
}

.dex-okx-defi-okc-return:before {
  content: "\e0fe";
  font-family: dex-ok-dc2c9dc6be
}

.dex-okx-defi-okc-telegram {
  --ok-icon-font-family: "dex-ok-dc2c9dc6be"
}

.dex-okx-defi-okc-telegram:before {
  content: "\e0ff";
  font-family: dex-ok-dc2c9dc6be
}

.dex-okx-defi-okc-tf-achievements {
  --ok-icon-font-family: "dex-ok-dc2c9dc6be"
}

.dex-okx-defi-okc-tf-achievements:before {
  content: "\e100";
  font-family: dex-ok-dc2c9dc6be
}

.dex-okx-defi-okc-tf-contract {
  --ok-icon-font-family: "dex-ok-dc2c9dc6be"
}

.dex-okx-defi-okc-tf-contract:before {
  content: "\e101";
  font-family: dex-ok-dc2c9dc6be
}

.dex-okx-defi-okc-tf-height {
  --ok-icon-font-family: "dex-ok-dc2c9dc6be"
}

.dex-okx-defi-okc-tf-height:before {
  content: "\e102";
  font-family: dex-ok-dc2c9dc6be
}

.dex-okx-defi-okc-tf-queue {
  --ok-icon-font-family: "dex-ok-dc2c9dc6be"
}

.dex-okx-defi-okc-tf-queue:before {
  content: "\e103";
  font-family: dex-ok-dc2c9dc6be
}

@font-face {
  font-display: block;
  font-family: dex-ok-dc2c9dc6be;
  font-style: normal;
  src: url(../font/cd31e232a821a6bb0280.woff2) format("woff2")
}

[dir=rtl] .dex-okx-defi-assets:before,
[dir=rtl] .dex-okx-defi-dex-filter1:before,
[dir=rtl] .dex-okx-defi-dex-filtered1:before,
[dir=rtl] .dex-okx-defi-dex-fireworks-2:before,
[dir=rtl] .dex-okx-defi-nft-cart-wc:before,
[dir=rtl] .dex-okx-defi-nft-gas-fast:before,
[dir=rtl] .dex-okx-defi-nft-nav-cart:before,
[dir=rtl] .dex-okx-defi-nft-share:before,
[dir=rtl] .dex-okx-defi-nft-transfer:before,
[dir=rtl] .dex-okx-defi-okbc-arrow:before,
[dir=rtl] .dex-okx-defi-okbc-get:before,
[dir=rtl] .dex-okx-defi-okc-cart:before,
[dir=rtl] .dex-okx-defi-okc-data:before,
[dir=rtl] .dex-okx-defi-okc-nft-transfer:before,
[dir=rtl] .dex-okx-defi-okc-return:before,
[dir=rtl] .dex-okx-defi-okc-tf-contract:before {
  transform: scaleX(-1)
}

.ok-social-platform-line-app {
  --ok-icon-font-family: "ok-7560450a8d"
}

.ok-social-platform-line-app:before {
  content: "\e00a";
  font-family: ok-7560450a8d
}

.ok-social-platform-wechat {
  --ok-icon-font-family: "ok-7560450a8d"
}

.ok-social-platform-wechat:before {
  content: "\e00b";
  font-family: ok-7560450a8d
}

.ok-social-platform-instagram {
  --ok-icon-font-family: "ok-7560450a8d"
}

.ok-social-platform-instagram:before {
  content: "\e008";
  font-family: ok-7560450a8d
}

.ok-social-platform-youtube {
  --ok-icon-font-family: "ok-7560450a8d"
}

.ok-social-platform-youtube:before {
  content: "\e009";
  font-family: ok-7560450a8d
}

.ok-social-platform-whatsapp {
  --ok-icon-font-family: "ok-7560450a8d"
}

.ok-social-platform-whatsapp:before {
  content: "\e007";
  font-family: ok-7560450a8d
}

.ok-social-platform-discord {
  --ok-icon-font-family: "ok-7560450a8d"
}

.ok-social-platform-discord:before {
  content: "\e000";
  font-family: ok-7560450a8d
}

.ok-social-platform-github {
  --ok-icon-font-family: "ok-7560450a8d"
}

.ok-social-platform-github:before {
  content: "\e001";
  font-family: ok-7560450a8d
}

.ok-social-platform-medium {
  --ok-icon-font-family: "ok-7560450a8d"
}

.ok-social-platform-medium:before {
  content: "\e002";
  font-family: ok-7560450a8d
}

.ok-social-platform-reddit {
  --ok-icon-font-family: "ok-7560450a8d"
}

.ok-social-platform-reddit:before {
  content: "\e003";
  font-family: ok-7560450a8d
}

.ok-social-platform-telegram {
  --ok-icon-font-family: "ok-7560450a8d"
}

.ok-social-platform-telegram:before {
  content: "\e004";
  font-family: ok-7560450a8d
}

.ok-social-platform-x {
  --ok-icon-font-family: "ok-7560450a8d"
}

.ok-social-platform-x:before {
  content: "\e005";
  font-family: ok-7560450a8d
}

.ok-social-platform-facebook {
  --ok-icon-font-family: "ok-7560450a8d"
}

.ok-social-platform-facebook:before {
  content: "\e006";
  font-family: ok-7560450a8d
}

.iconfont {
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
  font-size: 16px;
  font-style: normal
}

.iconfont:before {
  display: inline-block
}

@font-face {
  font-display: block;
  font-family: ok-7560450a8d;
  font-style: normal;
  src: url(../a35e6cee887a18ecdf94.woff2) format("woff2")
}

.pl-2 {
  padding-left: 2px
}

.ml-2 {
  margin-left: 2px
}

.pr-2 {
  padding-right: 2px
}

.mr-2 {
  margin-right: 2px
}

.pt-2 {
  padding-top: 2px
}

.mt-2 {
  margin-top: 2px
}

.pb-2 {
  padding-bottom: 2px
}

.mb-2 {
  margin-bottom: 2px
}

.pl-4 {
  padding-left: 4px
}

.ml-4 {
  margin-left: 4px
}

.pr-4 {
  padding-right: 4px
}

.mr-4 {
  margin-right: 4px
}

.pt-4 {
  padding-top: 4px
}

.pb-4 {
  padding-bottom: 4px
}

.mb-4 {
  margin-bottom: 4px
}

.pl-6 {
  padding-left: 6px
}

.ml-6 {
  margin-left: 6px
}

.pr-6 {
  padding-right: 6px
}

.mr-6 {
  margin-right: 6px
}

.pt-6 {
  padding-top: 6px
}

.mt-6 {
  margin-top: 6px
}

.pb-6 {
  padding-bottom: 6px
}

.mb-6 {
  margin-bottom: 6px
}

.pl-8 {
  padding-left: 8px
}

.pr-8 {
  padding-right: 8px
}

.pt-8 {
  padding-top: 8px
}

.mt-8 {
  margin-top: 8px
}

.pb-8 {
  padding-bottom: 8px
}

.mb-8 {
  margin-bottom: 8px
}

.pl-10 {
  padding-left: 10px
}

.ml-10 {
  margin-left: 10px
}

.pr-10 {
  padding-right: 10px
}

.mr-10 {
  margin-right: 10px
}

.pt-10 {
  padding-top: 10px
}

.mt-10 {
  margin-top: 10px
}

.pb-10 {
  padding-bottom: 10px
}

.mb-10 {
  margin-bottom: 10px
}

.pl-12 {
  padding-left: 12px
}

.ml-12 {
  margin-left: 12px
}

.pr-12 {
  padding-right: 12px
}

.pt-12 {
  padding-top: 12px
}

.mt-12 {
  margin-top: 12px
}

.pb-12 {
  padding-bottom: 12px
}

.mb-12 {
  margin-bottom: 12px
}

.pl-14 {
  padding-left: 14px
}

.ml-14 {
  margin-left: 14px
}

.pr-14 {
  padding-right: 14px
}

.mr-14 {
  margin-right: 14px
}

.pt-14 {
  padding-top: 14px
}

.mt-14 {
  margin-top: 14px
}

.pb-14 {
  padding-bottom: 14px
}

.mb-14 {
  margin-bottom: 14px
}

.pl-16 {
  padding-left: 16px
}

.ml-16 {
  margin-left: 16px
}

.pr-16 {
  padding-right: 16px
}

.pt-16 {
  padding-top: 16px
}

.pb-16 {
  padding-bottom: 16px
}

.mb-16 {
  margin-bottom: 16px
}

.pl-18 {
  padding-left: 18px
}

.ml-18 {
  margin-left: 18px
}

.pr-18 {
  padding-right: 18px
}

.mr-18 {
  margin-right: 18px
}

.pt-18 {
  padding-top: 18px
}

.mt-18 {
  margin-top: 18px
}

.pb-18 {
  padding-bottom: 18px
}

.mb-18 {
  margin-bottom: 18px
}

.pl-20 {
  padding-left: 20px
}

.ml-20 {
  margin-left: 20px
}

.pr-20 {
  padding-right: 20px
}

.mr-20 {
  margin-right: 20px
}

.pt-20 {
  padding-top: 20px
}

.mt-20 {
  margin-top: 20px
}

.pb-20 {
  padding-bottom: 20px
}

.mb-20 {
  margin-bottom: 20px
}

.pl-24 {
  padding-left: 24px
}

.ml-24 {
  margin-left: 24px
}

.pr-24 {
  padding-right: 24px
}

.mr-24 {
  margin-right: 24px
}

.pt-24 {
  padding-top: 24px
}

.mt-24 {
  margin-top: 24px
}

.pb-24 {
  padding-bottom: 24px
}

.mb-24 {
  margin-bottom: 24px
}

.pl-30 {
  padding-left: 30px
}

.ml-30 {
  margin-left: 30px
}

.pr-30 {
  padding-right: 30px
}

.mr-30 {
  margin-right: 30px
}

.pt-30 {
  padding-top: 30px
}

.mt-30 {
  margin-top: 30px
}

.pb-30 {
  padding-bottom: 30px
}

.mb-30 {
  margin-bottom: 30px
}

.pl-32 {
  padding-left: 32px
}

.ml-32 {
  margin-left: 32px
}

.pr-32 {
  padding-right: 32px
}

.mr-32 {
  margin-right: 32px
}

.pt-32 {
  padding-top: 32px
}

.mt-32 {
  margin-top: 32px
}

.pb-32 {
  padding-bottom: 32px
}

.mb-32 {
  margin-bottom: 32px
}

.pl-50 {
  padding-left: 50px
}

.ml-50 {
  margin-left: 50px
}

.pr-50 {
  padding-right: 50px
}

.mr-50 {
  margin-right: 50px
}

.pt-50 {
  padding-top: 50px
}

.pb-50 {
  padding-bottom: 50px
}

.mb-50 {
  margin-bottom: 50px
}

.color-link {
  color: #004cff
}

.color-008659 {
  color: #008659
}

.color-1d2023 {
  color: #1d2023
}

.color-60687b {
  color: #60687b
}

.color-3d3d3d {
  color: var(--dex-okd-color-content-secondary)
}

.color-959dad {
  color: #959dad
}

.color-0569ff {
  color: var(--dex-okd-color-blue-700)
}

.color-bdbdbd {
  color: #bdbdbd
}

.color-3f475a {
  color: #3f475a
}

.color-white {
  color: #fff
}

.color-black {
  color: var(--dex-okd-color-content-primary)
}

.color-df473d {
  color: #df473d
}

.font-10 {
  font-size: 10px;
  line-height: 12px
}

.font-12 {
  font-size: 12px;
  line-height: 16px
}

.font-13 {
  font-size: 13px
}

.font-14 {
  font-size: 14px;
  line-height: 16px
}

.font-16 {
  font-size: 16px;
  line-height: 20px
}

.font-18 {
  font-size: 18px;
  line-height: 24px
}

.font-20 {
  font-size: 20px;
  line-height: 24px
}

.font-24 {
  font-size: 24px;
  line-height: 32px
}

.font-28 {
  font-size: 28px;
  line-height: 36px
}

.font-32 {
  font-size: 32px;
  line-height: 40px
}

.font-36 {
  font-size: 36px;
  line-height: 132%
}

.font-40 {
  font-size: 40px;
  line-height: 48px
}

.line-20 {
  line-height: 20px
}

.font-bold {
  font-weight: 500
}

.font-400,
.font-normal {
  font-weight: 400
}

.font-600 {
  font-weight: 600
}

.font-700 {
  font-weight: 700
}

.relative {
  position: relative
}

.absolute {
  position: absolute
}

.text-center {
  text-align: center
}

.text-right {
  text-align: right
}

.flex-row {
  flex-direction: row
}

.flex-column {
  flex-direction: column
}

.flex-item {
  flex-basis: 0;
  flex-grow: 1;
  flex-shrink: 1;
  max-width: 100%
}

.flex-0-0-auto {
  flex: 0 0 auto
}

.w-16 {
  width: 16px
}

.w-24 {
  width: 24px
}

.w-100,
.w-full {
  width: 100%
}

.h-24 {
  height: 24px
}

.h-40 {
  height: 40px
}

.h-full {
  height: 100%
}

.align-items-start {
  align-items: flex-start
}

.align-items-center {
  align-items: center
}

.align-items-end {
  align-items: flex-end
}

.justify-content-start {
  justify-content: flex-start
}

.justify-content-center {
  justify-content: center
}

.justify-content-end {
  justify-content: flex-end
}

.justify-content-between {
  justify-content: space-between
}

.bg-ebebeb {
  background-color: #ebebeb
}

.underline {
  text-decoration: underline
}

.underline-dash {
  cursor: pointer;
  -webkit-text-decoration: 1px dashed var(--dex-okd-color-border-primary) underline;
  text-decoration: 1px dashed var(--dex-okd-color-border-primary) underline;
  text-underline-offset: 3px
}

.ellipsis {
  white-space: nowrap
}

.ellipsis,
.ellipsis2 {
  overflow: hidden;
  text-overflow: ellipsis
}

.ellipsis2 {
  -webkit-box-orient: vertical;
  -webkit-line-clamp: 2;
  display: -webkit-box
}

.cursor-pointer {
  cursor: pointer
}

.cursor-not-allowed {
  cursor: not-allowed
}

.border-box {
  box-sizing: border-box
}

.inline-block {
  display: inline-block
}

.block {
  display: block
}

.border-f0f3f7 {
  border: 1px solid #f0f3f7
}

.border-d8dce5 {
  border: 1px solid #d8dce5
}

.border-ebebeb {
  border: 1px solid #ebebeb
}

.word-break-all {
  word-break: break-all
}

.word-break-word {
  word-break: break-word
}

.container {
  padding-left: 8px;
  padding-right: 8px
}

@media (min-width:768px) {
  .container {
    padding-left: 12px;
    padding-right: 12px
  }
}

@media (min-width:1024px) {
  .container {
    padding-left: calc(50% - 480px);
    padding-right: calc(50% - 480px)
  }
}

@media (min-width:1270px) {
  .container {
    padding-left: calc(50% - 624px);
    padding-right: calc(50% - 624px)
  }
}

.icon-transition {
  transition: transform .3s ease
}

.icon-up {
  transform: rotate(180deg)
}

.hidden {
  display: none
}

.clear-img-gap {
  vertical-align: bottom
}

.user-select-none {
  -webkit-user-select: none;
  -moz-user-select: none;
  -ms-user-select: none;
  user-select: none
}

.p-4 {
  padding: 4px
}

.px-16 {
  padding: 0 16px
}

.mt-50 {
  margin-top: 50px
}

.opacity-0 {
  opacity: 0
}

.z-index-hidden {
  z-index: -1
}

.ml-auto {
  margin-left: auto
}

.mr-auto {
  margin-right: auto
}

.mr-5 {
  margin-right: 5px
}

.mr-8 {
  margin-right: 8px
}

.mr-12 {
  margin-right: 12px
}

.mr-16 {
  margin-right: 16px
}

.mt-16 {
  margin-top: 16px
}

.mt-4 {
  margin-top: 4px
}

.ml-8 {
  margin-left: 8px
}

.color-warn {
  color: var(--dex-okd-color-semantic-notice)
}

.color-danger {
  color: var(--dex-okd-color-semantic-negative)
}

.color-down-text {
  color: var(--color-down-text)
}

.color-up-text {
  color: var(--color-up-text)
}

.color-yellow-600 {
  color: var(--dex-okd-color-yellow-600)
}

.color-content-contrast {
  color: var(--dex-okd-color-content-contrast)
}

.color-preference-profit-alternative {
  color: var(--dex-okd-color-link-accent-content-primary)
}

.color-semantic-notice {
  color: var(--dex-okd-color-semantic-notice)
}

.br-4 {
  border-radius: 4px
}

.br-8 {
  border-radius: 8px
}

.font-inherit {
  font-size: inherit;
  font-weight: inherit
}

.keep-ltr {
  direction: ltr
}

.container-inverse {
  background-color: var(--dex-okd-color-container-inverse)
}

.container-contrast {
  background-color: var(--dex-okd-color-container-contrast)
}

.container-tertiary {
  background-color: var(--dex-okd-color-container-tertiary)
}

.container-secondary {
  background-color: var(--dex-okd-color-container-secondary)
}

.container-primary {
  background-color: var(--dex-okd-color-container-primary)
}

.background-scrim {
  background-color: var(--dex-okd-color-background-scrim)
}

.background-surface-disable {
  background-color: var(--dex-okd-color-background-surface-disable)
}

.background-surface-pressed {
  background-color: var(--dex-okd-color-background-surface-pressed)
}

.background-surface-secondary {
  background-color: var(--dex-okd-color-background-surface-secondary)
}

.background-surface-primary {
  background-color: var(--dex-okd-color-background-surface-primary)
}

.background-base-secondary {
  background-color: var(--dex-okd-color-background-base-secondary)
}

.background-base-primary {
  background-color: var(--dex-okd-color-background-base-primary)
}

.content-inverse {
  color: var(--dex-okd-color-content-inverse)
}

.content-disabled {
  color: var(--dex-okd-color-content-disabled)
}

.content-contrast {
  color: var(--dex-okd-color-content-contrast)
}

.content-tertiary {
  color: var(--dex-okd-color-content-tertiary)
}

.content-secondary {
  color: var(--dex-okd-color-content-secondary)
}

.content-primary {
  color: var(--dex-okd-color-content-primary)
}

.border-selected {
  border-color: var(--dex-okd-color-border-selected)
}

.border-contrast {
  border-color: var(--dex-okd-color-border-contrast)
}

.border-secondary {
  border-color: var(--dex-okd-color-border-secondary)
}

.border-primary {
  border-color: var(--dex-okd-color-border-primary)
}

.QPWA77__dex {
  color: var(--dex-okd-color-content-brand);
  font-size: 14px;
  font-weight: 700;
  line-height: 16px
}

.bgLhXv__dex {
  margin-top: 8px
}

.LmWHB4__dex {
  width: 600px
}

.HHVr9d__dex {
  padding: 0
}

.IAHhGR__dex {
  width: 70%
}

.rp_R61__dex {
  color: var(--dex-okd-color-content-primary);
  margin-left: 4px
}

.JE1OOs__dex {
  border-bottom: .5px solid var(--dex-okd-color-border-primary);
  padding: 24px
}

.JE1OOs__dex.ah8P3A__dex {
  padding: 16px
}

.a_K_rE__dex {
  height: 100%;
  width: 100%
}

.mDs0VU__dex {
  display: flex;
  flex-wrap: wrap;
  justify-content: space-between;
  margin-top: 16px
}

.mDs0VU__dex .T8WXfO__dex {
  color: var(--dex-okd-color-content-contrast);
  display: flex;
  flex-direction: column;
  width: 50%
}

.mDs0VU__dex .T8WXfO__dex .ZLX41W__dex {
  font-size: 12px;
  line-height: 16px
}

.mDs0VU__dex .T8WXfO__dex .DidJfz__dex {
  align-items: center;
  display: flex;
  font-size: 14px;
  font-weight: 700;
  line-height: 16px
}

.mDs0VU__dex .T8WXfO__dex .DidJfz__dex .z5AObl__dex {
  color: var(--dex-okd-color-content-primary);
  margin-right: 4px
}

.mDs0VU__dex .T8WXfO__dex .DidJfz__dex .Mk9qId__dex {
  display: inline-block;
  width: 40px
}

.mDs0VU__dex .T8WXfO__dex .DidJfz__dex .ldOQ4s__dex {
  color: var(--dex-okd-color-content-contrast);
  font-size: 12px;
  font-weight: 400
}

.OT8XqR__dex {
  background-color: var(--dex-okd-color-background-base-primary);
  border-top: 1px solid var(--dex-okd-color-background-base-secondary);
  bottom: 0;
  box-sizing: border-box;
  display: flex;
  left: 0;
  padding: 16px;
  position: fixed;
  width: 100%;
  z-index: 99
}

.L6OnvG__dex {
  display: block;
  width: 100%
}

.a0HhGr__dex {
  color: var(--dex-okd-color-content-primary);
  margin-top: 16px;
  width: 100%
}

.OChkvC__dex {
  padding: 24px 24px 0
}

.OChkvC__dex.ah8P3A__dex {
  padding: 16px
}

.OChkvC__dex .w99ke6__dex .M29bMw__dex {
  align-items: center;
  display: flex;
  justify-content: space-between
}

.OChkvC__dex .w99ke6__dex .M29bMw__dex .Tsg2To__dex {
  font-size: 18px;
  font-weight: 700;
  line-height: 24px
}

.OChkvC__dex ._T3s_n__dex {
  padding: 16px 0
}

.OChkvC__dex ._T3s_n__dex .qaloyT__dex {
  display: flex;
  justify-content: space-between
}

.OChkvC__dex ._T3s_n__dex .qaloyT__dex .YPcezX__dex {
  border-radius: 4px;
  padding: 2px 4px
}

.OChkvC__dex ._T3s_n__dex .qaloyT__dex .YPcezX__dex.jz424G__dex {
  background-color: var(--color-up-text);
  background: rgba(37, 167, 80, .1)
}

.OChkvC__dex ._T3s_n__dex .qaloyT__dex .YPcezX__dex.JMjARr__dex {
  background: var(--dex-okd-color-semantic-negative);
  background: rgba(202, 63, 100, .1)
}

.sq9UMH__dex {
  padding: 0 8px 24px
}

.sq9UMH__dex.kHWBJt__dex {
  padding-bottom: 100px
}

.panhTi__dex {
  text-decoration: underline
}

.panhTi__dex:hover {
  color: var(--dex-okd-color-gray-600)
}

.G4vksm__dex {
  color: var(--dex-okd-color-content-primary);
  display: flex;
  flex-direction: column;
  font-size: 12px;
  font-weight: 400;
  line-height: 16px;
  width: 160px
}

.Qht_bh__dex {
  display: flex;
  justify-content: space-between;
  margin-top: 4px
}

.Qht_bh__dex:first-child {
  margin-top: 0
}

.Qht_bh__dex .dBBHMz__dex {
  color: var(--dex-okd-color-content-contrast)
}

.Qht_bh__dex .dBBHMz__dex.HLLUP5__dex {
  color: var(--color-up-text)
}

.Qht_bh__dex .dBBHMz__dex.nbv7Bc__dex {
  color: var(--color-down-text)
}

.l34Bew__dex {
  color: var(--dex-okd-color-content-contrast);
  font-size: 12px;
  font-weight: 400;
  line-height: 16px;
  margin-top: 4px
}

.CYc8v0__dex {
  display: flex;
  flex-direction: column;
  width: 100%
}

.lhxdyC__dex {
  width: 100%
}

.BZP_nq__dex {
  color: var(--dex-okd-color-semantic-informative)
}

.um7b0I__dex {
  cursor: pointer
}

.oGbea1__dex {
  align-items: center;
  display: flex;
  flex-wrap: nowrap
}

.oGbea1__dex .ccud5o__dex {
  height: 16px;
  margin-right: 6px;
  position: relative;
  width: 16px
}

@media (min-width:768px) {
  .oGbea1__dex .ccud5o__dex {
    height: 25px;
    margin-right: 8px;
    width: 25px
  }
}

.oGbea1__dex .ccud5o__dex .GhukU5__dex {
  background-color: #fff;
  border-radius: 50%;
  height: 100%;
  overflow: hidden;
  width: 100%
}

.oGbea1__dex .ccud5o__dex .f91Ynx__dex {
  background-color: pink;
  border-radius: 50%;
  bottom: -2px;
  height: 8px;
  position: absolute;
  right: -2px;
  width: 8px
}

@media (min-width:768px) {
  .oGbea1__dex .ccud5o__dex .f91Ynx__dex {
    height: 14px;
    width: 14px
  }

  .oGbea1__dex .ccud5o__dex {
    margin-right: 8px
  }
}

.oGbea1__dex .KAIXnz__dex {
  color: #fff;
  flex: 1 1;
  font-size: 12px;
  font-style: normal;
  font-weight: 700;
  line-height: 17px;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  width: 100%
}

@media (min-width:768px) {
  .oGbea1__dex .KAIXnz__dex {
    font-size: 20px;
    line-height: 28px
  }
}

.rUBiGg__dex {
  display: flex;
  flex-direction: column;
  gap: 4px
}

@media (min-width:768px) {
  .rUBiGg__dex {
    gap: 8px
  }
}

.rUBiGg__dex .KpJ0tH__dex {
  align-items: flex-start;
  align-items: center;
  display: flex;
  flex-wrap: nowrap;
  position: relative
}

.rUBiGg__dex .KpJ0tH__dex .DU6_j8__dex {
  color: #909090;
  font-size: 9px;
  font-style: normal;
  font-weight: 500;
  line-height: 11px;
  overflow: hidden;
  text-overflow: ellipsis
}

@media (min-width:768px) {
  .rUBiGg__dex .KpJ0tH__dex .DU6_j8__dex {
    font-size: 14px;
    line-height: 16px
  }
}

.rUBiGg__dex .KpJ0tH__dex .hcqm6L__dex {
  color: #fff;
  font-size: 9px;
  font-style: normal;
  font-weight: 500;
  line-height: 11px;
  margin-left: 4px;
  overflow: hidden;
  position: absolute;
  text-overflow: ellipsis
}

@media (min-width:768px) {
  .rUBiGg__dex .KpJ0tH__dex .hcqm6L__dex {
    font-size: 14px;
    line-height: 16px
  }
}

.rUBiGg__dex .KpJ0tH__dex .hcqm6L__dex .eclxUk__dex:not(:last-child) {
  margin-right: 8px
}

.uE2gRr__dex {
  opacity: 1
}

.ArnJz___dex {
  display: none
}

.kXIx7x__dex {
  display: block
}

.X7bgaA__dex .YqFlCk__dex {
  height: 32px;
  width: 32px
}

.X7bgaA__dex .YqFlCk__dex .IljucI__dex {
  align-items: center;
  display: flex;
  height: 100%;
  justify-content: center;
  width: 100%
}

.AlllF7__dex {
  overflow: "hidden";
  width: "100%"
}

.L6ujgL__dex {
  width: "fit-content";
  word-break: break-all
}

.Vh4l6L__dex {
  font-size: 29px;
  font-style: normal;
  font-weight: 700;
  line-height: 32px;
  width: 100%
}

@media (min-width:768px) {
  .Vh4l6L__dex {
    font-size: 48px;
    line-height: 58px
  }
}

.pf3DMw__dex {
  align-items: center;
  display: flex;
  height: 100%;
  justify-content: center;
  width: 100%
}

.OfWIuH__dex {
  font-size: 14px;
  font-style: normal;
  font-weight: 500;
  line-height: 17px;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap
}

@media (min-width:768px) {
  .OfWIuH__dex {
    font-size: 20px;
    line-height: 28px
  }
}

.nJQXIH__dex {
  align-items: center;
  display: flex;
  justify-content: flex-end
}

.nJQXIH__dex .y2mUKB__dex {
  background: rgba(0, 0, 0, .12);
  display: flex;
  padding: 2px 4px;
  position: relative
}

@media (min-width:768px) {
  .nJQXIH__dex .y2mUKB__dex {
    padding: 4px 5px
  }
}

.nJQXIH__dex .y2mUKB__dex .zoCKrP__dex {
  border-radius: 1px;
  height: 8px;
  overflow: hidden;
  width: 8px
}

@media (min-width:768px) {
  .nJQXIH__dex .y2mUKB__dex .zoCKrP__dex {
    border-radius: 2px;
    height: 14px;
    width: 14px
  }
}

.nJQXIH__dex .y2mUKB__dex .v1bqeH__dex {
  color: #fff;
  font-size: 7px;
  font-style: normal;
  font-weight: 700;
  line-height: 10px;
  margin-left: 6px
}

@media (min-width:768px) {
  .nJQXIH__dex .y2mUKB__dex .v1bqeH__dex {
    font-size: 12px;
    line-height: 16px
  }
}

.TZCn02__dex {
  background-color: #000;
  height: 100%;
  position: relative;
  width: 100%
}

.TZCn02__dex .FSngWs__dex {
  position: absolute;
  right: 0;
  top: 0;
  z-index: 1
}

.PTzJBX__dex {
  background-color: hsla(0, 0%, 100%, 0);
  display: flex;
  flex-direction: column;
  height: 100%;
  position: relative;
  width: 100%;
  z-index: 10
}

.PTzJBX__dex .CMC2Kr__dex {
  display: flex;
  flex: 1 1;
  gap: 8x;
  height: 130px;
  padding: 16px 14px 14px
}

@media (min-width:768px) {
  .PTzJBX__dex .CMC2Kr__dex {
    gap: 20px;
    height: 267px;
    padding: 29px 23px 24px
  }
}

.PTzJBX__dex .g7ugWm__dex {
  display: flex;
  flex-direction: column;
  justify-content: space-between;
  width: 162px
}

@media (min-width:768px) {
  .PTzJBX__dex .g7ugWm__dex {
    width: 267px
  }
}

.PTzJBX__dex .ithD_X__dex {
  display: flex;
  flex: 1 1;
  flex-direction: column;
  overflow: hidden
}

@media (min-width:768px) {
  .PTzJBX__dex .ithD_X__dex {
    width: 226px
  }
}

.PTzJBX__dex .w0HqIT__dex {
  color: #bcff2f;
  text-shadow: 0 0 12px rgba(7, 255, 77, .5), 0 0 2px rgba(7, 255, 77, .5)
}

.PTzJBX__dex .BQxDQS__dex {
  color: #fc46ab;
  text-shadow: 0 0 12px rgba(255, 0, 170, .5), 0 0 2px rgba(255, 0, 170, .5)
}

.PTzJBX__dex .ZMQ5hP__dex {
  color: #909090
}

.PTzJBX__dex .fHDAVC__dex {
  height: 118px;
  width: 130px
}

@media (min-width:768px) {
  .PTzJBX__dex .fHDAVC__dex {
    height: 195px;
    width: 215px
  }
}

.PTzJBX__dex .RY0rmf__dex {
  display: flex;
  height: 46px;
  justify-content: space-between;
  padding: 12px 14px;
  width: 100%
}

@media (min-width:768px) {
  .PTzJBX__dex .RY0rmf__dex {
    height: 76px;
    padding: 20px 24px
  }
}

.PTzJBX__dex .RY0rmf__dex .YKC_Q3__dex {
  display: flex;
  flex-direction: column;
  padding-left: 34px
}

@media (min-width:768px) {
  .PTzJBX__dex .RY0rmf__dex .YKC_Q3__dex {
    padding-left: 48px
  }
}

.PTzJBX__dex .RY0rmf__dex .YKC_Q3__dex .BIdJqa__dex {
  color: #fff;
  font-size: 8px;
  font-style: normal;
  font-weight: 400;
  line-height: 10px
}

.PTzJBX__dex .RY0rmf__dex .YKC_Q3__dex .BIdJqa__dex.iUv94m__dex {
  color: var(--dex-okd-color-content-primary);
  font-size: 12px
}

@media (min-width:768px) {
  .PTzJBX__dex .RY0rmf__dex .YKC_Q3__dex .BIdJqa__dex {
    font-size: 12px;
    line-height: 18px
  }
}

.PTzJBX__dex .RY0rmf__dex .YKC_Q3__dex .hutd2S__dex {
  color: #b3b3b3;
  font-size: 8px;
  font-style: normal;
  font-weight: 400;
  line-height: 10px
}

@media (min-width:768px) {
  .PTzJBX__dex .RY0rmf__dex .YKC_Q3__dex .hutd2S__dex {
    font-size: 12px;
    line-height: 16px
  }
}

.PTzJBX__dex .RY0rmf__dex .ZSqD19__dex {
  align-items: center;
  display: flex
}

.PTzJBX__dex .RY0rmf__dex .ZSqD19__dex .D0IyTc__dex {
  background-repeat: no-repeat;
  background-size: cover;
  height: 10px;
  width: 74px
}

@media (min-width:768px) {
  .PTzJBX__dex .RY0rmf__dex .ZSqD19__dex .D0IyTc__dex {
    height: 16px;
    width: 121px
  }
}

.dex-okx-defi-surplus-coin {
  --ok-icon-font-family: "dex-ok-dc2c9dc6be"
}

.dex-okx-defi-surplus-coin:before {
  content: "\e2d1";
  font-family: dex-ok-dc2c9dc6be
}

.dex-okx-defi-bell-off_outline {
  --ok-icon-font-family: "dex-ok-dc2c9dc6be"
}

.dex-okx-defi-bell-off_outline:before {
  content: "\e2d0";
  font-family: dex-ok-dc2c9dc6be
}

.dex-okx-defi-upload {
  --ok-icon-font-family: "dex-ok-dc2c9dc6be"
}

.dex-okx-defi-upload:before {
  content: "\e2cf";
  font-family: dex-ok-dc2c9dc6be
}

.dex-okx-defi-smartmoney {
  --ok-icon-font-family: "dex-ok-dc2c9dc6be"
}

.dex-okx-defi-smartmoney:before {
  content: "\e2ce";
  font-family: dex-ok-dc2c9dc6be
}

.dex-okx-defi-surplus-outline {
  --ok-icon-font-family: "dex-ok-dc2c9dc6be"
}

.dex-okx-defi-surplus-outline:before {
  content: "\e2cc";
  font-family: dex-ok-dc2c9dc6be
}

.dex-okx-defi-surplus-solid {
  --ok-icon-font-family: "dex-ok-dc2c9dc6be"
}

.dex-okx-defi-surplus-solid:before {
  content: "\e2cd";
  font-family: dex-ok-dc2c9dc6be
}

.dex-okx-defi-demo-trading {
  --ok-icon-font-family: "dex-ok-dc2c9dc6be"
}

.dex-okx-defi-demo-trading:before {
  content: "\e2cb";
  font-family: dex-ok-dc2c9dc6be
}

.dex-okx-defi-chevron-left_alignleft {
  --ok-icon-font-family: "dex-ok-dc2c9dc6be"
}

.dex-okx-defi-chevron-left_alignleft:before {
  content: "\e2ca";
  font-family: dex-ok-dc2c9dc6be
}

.dex-okx-defi-mail-filled {
  --ok-icon-font-family: "dex-ok-dc2c9dc6be"
}

.dex-okx-defi-mail-filled:before {
  content: "\e2c9";
  font-family: dex-ok-dc2c9dc6be
}

.dex-okx-defi-forward {
  --ok-icon-font-family: "dex-ok-dc2c9dc6be"
}

.dex-okx-defi-forward:before {
  content: "\e2c8";
  font-family: dex-ok-dc2c9dc6be
}

.dex-okx-defi-volume-off_filled {
  --ok-icon-font-family: "dex-ok-dc2c9dc6be"
}

.dex-okx-defi-volume-off_filled:before {
  content: "\e2c7";
  font-family: dex-ok-dc2c9dc6be
}

.dex-okx-defi-volume-max_filled {
  --ok-icon-font-family: "dex-ok-dc2c9dc6be"
}

.dex-okx-defi-volume-max_filled:before {
  content: "\e2c6";
  font-family: dex-ok-dc2c9dc6be
}

.dex-okx-defi-okx-filled {
  --ok-icon-font-family: "dex-ok-dc2c9dc6be"
}

.dex-okx-defi-okx-filled:before {
  content: "\e2c5";
  font-family: dex-ok-dc2c9dc6be
}

.dex-okx-defi-nft-outline {
  --ok-icon-font-family: "dex-ok-dc2c9dc6be"
}

.dex-okx-defi-nft-outline:before {
  content: "\e2c4";
  font-family: dex-ok-dc2c9dc6be
}

.dex-okx-defi-blockchain-explorer {
  --ok-icon-font-family: "dex-ok-dc2c9dc6be"
}

.dex-okx-defi-blockchain-explorer:before {
  content: "\e2c3";
  font-family: dex-ok-dc2c9dc6be
}

.dex-okx-defi-globe {
  --ok-icon-font-family: "dex-ok-dc2c9dc6be"
}

.dex-okx-defi-globe:before {
  content: "\e2c2";
  font-family: dex-ok-dc2c9dc6be
}

.dex-okx-defi-dex-fishing {
  --ok-icon-font-family: "dex-ok-dc2c9dc6be"
}

.dex-okx-defi-dex-fishing:before {
  content: "\e2c1";
  font-family: dex-ok-dc2c9dc6be
}

.dex-okx-defi-video-filled {
  --ok-icon-font-family: "dex-ok-dc2c9dc6be"
}

.dex-okx-defi-video-filled:before {
  content: "\e2c0";
  font-family: dex-ok-dc2c9dc6be
}

.dex-okx-defi-web3-dapp-rankings {
  --ok-icon-font-family: "dex-ok-dc2c9dc6be"
}

.dex-okx-defi-web3-dapp-rankings:before {
  content: "\e2bf";
  font-family: dex-ok-dc2c9dc6be
}

.dex-okx-defi-web3-get_token {
  --ok-icon-font-family: "dex-ok-dc2c9dc6be"
}

.dex-okx-defi-web3-get_token:before {
  content: "\e2be";
  font-family: dex-ok-dc2c9dc6be
}

.dex-okx-defi-selected-outlined {
  --ok-icon-font-family: "dex-ok-dc2c9dc6be"
}

.dex-okx-defi-selected-outlined:before {
  content: "\e2bd";
  font-family: dex-ok-dc2c9dc6be
}

.dex-okx-defi-caret-up-24 {
  --ok-icon-font-family: "dex-ok-dc2c9dc6be"
}

.dex-okx-defi-caret-up-24:before {
  content: "\e2bb";
  font-family: dex-ok-dc2c9dc6be
}

.dex-okx-defi-caret-down-24 {
  --ok-icon-font-family: "dex-ok-dc2c9dc6be"
}

.dex-okx-defi-caret-down-24:before {
  content: "\e2bc";
  font-family: dex-ok-dc2c9dc6be
}

.dex-okx-defi-network-fee-fast-filled {
  --ok-icon-font-family: "dex-ok-dc2c9dc6be"
}

.dex-okx-defi-network-fee-fast-filled:before {
  content: "\e2ba";
  font-family: dex-ok-dc2c9dc6be
}

.dex-okx-defi-tutorial {
  --ok-icon-font-family: "dex-ok-dc2c9dc6be"
}

.dex-okx-defi-tutorial:before {
  content: "\e2b9";
  font-family: dex-ok-dc2c9dc6be
}

.dex-okx-defi-enlarge-window-outline {
  --ok-icon-font-family: "dex-ok-dc2c9dc6be"
}

.dex-okx-defi-enlarge-window-outline:before {
  content: "\e2b8";
  font-family: dex-ok-dc2c9dc6be
}

.dex-okx-defi-eye-show_filled {
  --ok-icon-font-family: "dex-ok-dc2c9dc6be"
}

.dex-okx-defi-eye-show_filled:before {
  content: "\e2b7";
  font-family: dex-ok-dc2c9dc6be
}

.dex-okx-defi-web3-24h-turnover {
  --ok-icon-font-family: "dex-ok-dc2c9dc6be"
}

.dex-okx-defi-web3-24h-turnover:before {
  content: "\e2b6";
  font-family: dex-ok-dc2c9dc6be
}

.dex-okx-defi-builder-outline {
  --ok-icon-font-family: "dex-ok-dc2c9dc6be"
}

.dex-okx-defi-builder-outline:before {
  content: "\e2b5";
  font-family: dex-ok-dc2c9dc6be
}

.dex-okx-defi-web3-orderbook {
  --ok-icon-font-family: "dex-ok-dc2c9dc6be"
}

.dex-okx-defi-web3-orderbook:before {
  content: "\e2b3";
  font-family: dex-ok-dc2c9dc6be
}

.dex-okx-defi-perpetual {
  --ok-icon-font-family: "dex-ok-dc2c9dc6be"
}

.dex-okx-defi-perpetual:before {
  content: "\e2b4";
  font-family: dex-ok-dc2c9dc6be
}

.dex-okx-defi-WeChat {
  --ok-icon-font-family: "dex-ok-dc2c9dc6be"
}

.dex-okx-defi-WeChat:before {
  content: "\e2b2";
  font-family: dex-ok-dc2c9dc6be
}

.dex-okx-defi-mail {
  --ok-icon-font-family: "dex-ok-dc2c9dc6be"
}

.dex-okx-defi-mail:before {
  content: "\e2b1";
  font-family: dex-ok-dc2c9dc6be
}

.dex-okx-defi-recurring-buy {
  --ok-icon-font-family: "dex-ok-dc2c9dc6be"
}

.dex-okx-defi-recurring-buy:before {
  content: "\e2b0";
  font-family: dex-ok-dc2c9dc6be
}

.dex-okx-defi-tips {
  --ok-icon-font-family: "dex-ok-dc2c9dc6be"
}

.dex-okx-defi-tips:before {
  content: "\e2af";
  font-family: dex-ok-dc2c9dc6be
}

.dex-okx-defi-trading-tutorial {
  --ok-icon-font-family: "dex-ok-dc2c9dc6be"
}

.dex-okx-defi-trading-tutorial:before {
  content: "\e2ae";
  font-family: dex-ok-dc2c9dc6be
}

.dex-okx-defi-web3-inscription {
  --ok-icon-font-family: "dex-ok-dc2c9dc6be"
}

.dex-okx-defi-web3-inscription:before {
  content: "\e2ad";
  font-family: dex-ok-dc2c9dc6be
}

.dex-okx-defi-mint {
  --ok-icon-font-family: "dex-ok-dc2c9dc6be"
}

.dex-okx-defi-mint:before {
  content: "\e2ac";
  font-family: dex-ok-dc2c9dc6be
}

.dex-okx-defi-line-chart {
  --ok-icon-font-family: "dex-ok-dc2c9dc6be"
}

.dex-okx-defi-line-chart:before {
  content: "\e2ab";
  font-family: dex-ok-dc2c9dc6be
}

.dex-okx-defi-history-filled {
  --ok-icon-font-family: "dex-ok-dc2c9dc6be"
}

.dex-okx-defi-history-filled:before {
  content: "\e2aa";
  font-family: dex-ok-dc2c9dc6be
}

.dex-okx-defi-unselected {
  --ok-icon-font-family: "dex-ok-dc2c9dc6be"
}

.dex-okx-defi-unselected:before {
  content: "\e2a9";
  font-family: dex-ok-dc2c9dc6be
}

.dex-okx-defi-list-filter {
  --ok-icon-font-family: "dex-ok-dc2c9dc6be"
}

.dex-okx-defi-list-filter:before {
  content: "\e2a8";
  font-family: dex-ok-dc2c9dc6be
}

.dex-okx-defi-fee-rule {
  --ok-icon-font-family: "dex-ok-dc2c9dc6be"
}

.dex-okx-defi-fee-rule:before {
  content: "\e2a7";
  font-family: dex-ok-dc2c9dc6be
}

.dex-okx-defi-plus-circle {
  --ok-icon-font-family: "dex-ok-dc2c9dc6be"
}

.dex-okx-defi-plus-circle:before {
  content: "\e2a5";
  font-family: dex-ok-dc2c9dc6be
}

.dex-okx-defi-plus-circle_filled {
  --ok-icon-font-family: "dex-ok-dc2c9dc6be"
}

.dex-okx-defi-plus-circle_filled:before {
  content: "\e2a6";
  font-family: dex-ok-dc2c9dc6be
}

.dex-okx-defi-box {
  --ok-icon-font-family: "dex-ok-dc2c9dc6be"
}

.dex-okx-defi-box:before {
  content: "\e2a4";
  font-family: dex-ok-dc2c9dc6be
}

.dex-okx-defi-insights {
  --ok-icon-font-family: "dex-ok-dc2c9dc6be"
}

.dex-okx-defi-insights:before {
  content: "\e2a3";
  font-family: dex-ok-dc2c9dc6be
}

.dex-okx-defi-add-to_shopping_cart {
  --ok-icon-font-family: "dex-ok-dc2c9dc6be"
}

.dex-okx-defi-add-to_shopping_cart:before {
  content: "\e2a2";
  font-family: dex-ok-dc2c9dc6be
}

.dex-okx-defi-options-outline {
  --ok-icon-font-family: "dex-ok-dc2c9dc6be"
}

.dex-okx-defi-options-outline:before {
  content: "\e2a1";
  font-family: dex-ok-dc2c9dc6be
}

.dex-okx-defi-Instagram-outline {
  --ok-icon-font-family: "dex-ok-dc2c9dc6be"
}

.dex-okx-defi-Instagram-outline:before {
  content: "\e2a0";
  font-family: dex-ok-dc2c9dc6be
}

.dex-okx-defi-brush {
  --ok-icon-font-family: "dex-ok-dc2c9dc6be"
}

.dex-okx-defi-brush:before {
  content: "\e29f";
  font-family: dex-ok-dc2c9dc6be
}

.dex-okx-defi-network-fee-standard {
  --ok-icon-font-family: "dex-ok-dc2c9dc6be"
}

.dex-okx-defi-network-fee-standard:before {
  content: "\e29e";
  font-family: dex-ok-dc2c9dc6be
}

.dex-okx-defi-network-fee-slow {
  --ok-icon-font-family: "dex-ok-dc2c9dc6be"
}

.dex-okx-defi-network-fee-slow:before {
  content: "\e29d";
  font-family: dex-ok-dc2c9dc6be
}

.dex-okx-defi-edit {
  --ok-icon-font-family: "dex-ok-dc2c9dc6be"
}

.dex-okx-defi-edit:before {
  content: "\e29c";
  font-family: dex-ok-dc2c9dc6be
}

.dex-okx-defi-web3-market {
  --ok-icon-font-family: "dex-ok-dc2c9dc6be"
}

.dex-okx-defi-web3-market:before {
  content: "\e29b";
  font-family: dex-ok-dc2c9dc6be
}

.dex-okx-defi-more {
  --ok-icon-font-family: "dex-ok-dc2c9dc6be"
}

.dex-okx-defi-more:before {
  content: "\e29a";
  font-family: dex-ok-dc2c9dc6be
}

.dex-okx-defi-Facebook {
  --ok-icon-font-family: "dex-ok-dc2c9dc6be"
}

.dex-okx-defi-Facebook:before {
  content: "\e299";
  font-family: dex-ok-dc2c9dc6be
}

.dex-okx-defi-calendar {
  --ok-icon-font-family: "dex-ok-dc2c9dc6be"
}

.dex-okx-defi-calendar:before {
  content: "\e298";
  font-family: dex-ok-dc2c9dc6be
}

.dex-okx-defi-subscribe {
  --ok-icon-font-family: "dex-ok-dc2c9dc6be"
}

.dex-okx-defi-subscribe:before {
  content: "\e296";
  font-family: dex-ok-dc2c9dc6be
}

.dex-okx-defi-subscribed {
  --ok-icon-font-family: "dex-ok-dc2c9dc6be"
}

.dex-okx-defi-subscribed:before {
  content: "\e297";
  font-family: dex-ok-dc2c9dc6be
}

.dex-okx-defi-web3-sniper {
  --ok-icon-font-family: "dex-ok-dc2c9dc6be"
}

.dex-okx-defi-web3-sniper:before {
  content: "\e295";
  font-family: dex-ok-dc2c9dc6be
}

.dex-okx-defi-swap-for-gas {
  --ok-icon-font-family: "dex-ok-dc2c9dc6be"
}

.dex-okx-defi-swap-for-gas:before {
  content: "\e294";
  font-family: dex-ok-dc2c9dc6be
}

.dex-okx-defi-token-outline {
  --ok-icon-font-family: "dex-ok-dc2c9dc6be"
}

.dex-okx-defi-token-outline:before {
  content: "\e292";
  font-family: dex-ok-dc2c9dc6be
}

.dex-okx-defi-token-filled {
  --ok-icon-font-family: "dex-ok-dc2c9dc6be"
}

.dex-okx-defi-token-filled:before {
  content: "\e293";
  font-family: dex-ok-dc2c9dc6be
}

.dex-okx-defi-copiers-filled {
  --ok-icon-font-family: "dex-ok-dc2c9dc6be"
}

.dex-okx-defi-copiers-filled:before {
  content: "\e291";
  font-family: dex-ok-dc2c9dc6be
}

.dex-okx-defi-checkmark {
  --ok-icon-font-family: "dex-ok-dc2c9dc6be"
}

.dex-okx-defi-checkmark:before {
  content: "\e290";
  font-family: dex-ok-dc2c9dc6be
}

.dex-okx-defi-chevron-right_alignright {
  --ok-icon-font-family: "dex-ok-dc2c9dc6be"
}

.dex-okx-defi-chevron-right_alignright:before {
  content: "\e28f";
  font-family: dex-ok-dc2c9dc6be
}

.dex-okx-defi-setting {
  --ok-icon-font-family: "dex-ok-dc2c9dc6be"
}

.dex-okx-defi-setting:before {
  content: "\e28d";
  font-family: dex-ok-dc2c9dc6be
}

.dex-okx-defi-setting-filled {
  --ok-icon-font-family: "dex-ok-dc2c9dc6be"
}

.dex-okx-defi-setting-filled:before {
  content: "\e28e";
  font-family: dex-ok-dc2c9dc6be
}

.dex-okx-defi-network-fee-fast {
  --ok-icon-font-family: "dex-ok-dc2c9dc6be"
}

.dex-okx-defi-network-fee-fast:before {
  content: "\e28c";
  font-family: dex-ok-dc2c9dc6be
}

.dex-okx-defi-hamburger-edit {
  --ok-icon-font-family: "dex-ok-dc2c9dc6be"
}

.dex-okx-defi-hamburger-edit:before {
  content: "\e28b";
  font-family: dex-ok-dc2c9dc6be
}

.dex-okx-defi-web3-loop {
  --ok-icon-font-family: "dex-ok-dc2c9dc6be"
}

.dex-okx-defi-web3-loop:before {
  content: "\e28a";
  font-family: dex-ok-dc2c9dc6be
}

.dex-okx-defi-party-outline {
  --ok-icon-font-family: "dex-ok-dc2c9dc6be"
}

.dex-okx-defi-party-outline:before {
  content: "\e288";
  font-family: dex-ok-dc2c9dc6be
}

.dex-okx-defi-party-filled {
  --ok-icon-font-family: "dex-ok-dc2c9dc6be"
}

.dex-okx-defi-party-filled:before {
  content: "\e289";
  font-family: dex-ok-dc2c9dc6be
}

.dex-okx-defi-exchange-tab {
  --ok-icon-font-family: "dex-ok-dc2c9dc6be"
}

.dex-okx-defi-exchange-tab:before {
  content: "\e287";
  font-family: dex-ok-dc2c9dc6be
}

.dex-okx-defi-fire-flame_filled {
  --ok-icon-font-family: "dex-ok-dc2c9dc6be"
}

.dex-okx-defi-fire-flame_filled:before {
  content: "\e285";
  font-family: dex-ok-dc2c9dc6be
}

.dex-okx-defi-fire-flame {
  --ok-icon-font-family: "dex-ok-dc2c9dc6be"
}

.dex-okx-defi-fire-flame:before {
  content: "\e286";
  font-family: dex-ok-dc2c9dc6be
}

.dex-okx-defi-refresh {
  --ok-icon-font-family: "dex-ok-dc2c9dc6be"
}

.dex-okx-defi-refresh:before {
  content: "\e284";
  font-family: dex-ok-dc2c9dc6be
}

.dex-okx-defi-user {
  --ok-icon-font-family: "dex-ok-dc2c9dc6be"
}

.dex-okx-defi-user:before {
  content: "\e283";
  font-family: dex-ok-dc2c9dc6be
}

.dex-okx-defi-caret-up {
  --ok-icon-font-family: "dex-ok-dc2c9dc6be"
}

.dex-okx-defi-caret-up:before {
  content: "\e281";
  font-family: dex-ok-dc2c9dc6be
}

.dex-okx-defi-caret-down {
  --ok-icon-font-family: "dex-ok-dc2c9dc6be"
}

.dex-okx-defi-caret-down:before {
  content: "\e282";
  font-family: dex-ok-dc2c9dc6be
}

.dex-okx-defi-minus {
  --ok-icon-font-family: "dex-ok-dc2c9dc6be"
}

.dex-okx-defi-minus:before {
  content: "\e280";
  font-family: dex-ok-dc2c9dc6be
}

.dex-okx-defi-pointer-down {
  --ok-icon-font-family: "dex-ok-dc2c9dc6be"
}

.dex-okx-defi-pointer-down:before {
  content: "\e27e";
  font-family: dex-ok-dc2c9dc6be
}

.dex-okx-defi-pointer-left {
  --ok-icon-font-family: "dex-ok-dc2c9dc6be"
}

.dex-okx-defi-pointer-left:before {
  content: "\e27f";
  font-family: dex-ok-dc2c9dc6be
}

.dex-okx-defi-okds-pointer_up {
  --ok-icon-font-family: "dex-ok-dc2c9dc6be"
}

.dex-okx-defi-okds-pointer_up:before {
  content: "\e27d";
  font-family: dex-ok-dc2c9dc6be
}

.dex-okx-defi-back-to_top {
  --ok-icon-font-family: "dex-ok-dc2c9dc6be"
}

.dex-okx-defi-back-to_top:before {
  content: "\e27c";
  font-family: dex-ok-dc2c9dc6be
}

.dex-okx-defi-clear-filled {
  --ok-icon-font-family: "dex-ok-dc2c9dc6be"
}

.dex-okx-defi-clear-filled:before {
  content: "\e27b";
  font-family: dex-ok-dc2c9dc6be
}

.dex-okx-defi-clear {
  --ok-icon-font-family: "dex-ok-dc2c9dc6be"
}

.dex-okx-defi-clear:before {
  content: "\e27a";
  font-family: dex-ok-dc2c9dc6be
}

.dex-okx-defi-question-mark {
  --ok-icon-font-family: "dex-ok-dc2c9dc6be"
}

.dex-okx-defi-question-mark:before {
  content: "\e279";
  font-family: dex-ok-dc2c9dc6be
}

.dex-okx-defi-chevron-left {
  --ok-icon-font-family: "dex-ok-dc2c9dc6be"
}

.dex-okx-defi-chevron-left:before {
  content: "\e278";
  font-family: dex-ok-dc2c9dc6be
}

.dex-okx-defi-locked {
  --ok-icon-font-family: "dex-ok-dc2c9dc6be"
}

.dex-okx-defi-locked:before {
  content: "\e277";
  font-family: dex-ok-dc2c9dc6be
}

.dex-okx-defi-plus {
  --ok-icon-font-family: "dex-ok-dc2c9dc6be"
}

.dex-okx-defi-plus:before {
  content: "\e276";
  font-family: dex-ok-dc2c9dc6be
}

.dex-okx-defi-spot {
  --ok-icon-font-family: "dex-ok-dc2c9dc6be"
}

.dex-okx-defi-spot:before {
  content: "\e274";
  font-family: dex-ok-dc2c9dc6be
}

.dex-okx-defi-spot-DCA {
  --ok-icon-font-family: "dex-ok-dc2c9dc6be"
}

.dex-okx-defi-spot-DCA:before {
  content: "\e275";
  font-family: dex-ok-dc2c9dc6be
}

.dex-okx-defi-warning-filled {
  --ok-icon-font-family: "dex-ok-dc2c9dc6be"
}

.dex-okx-defi-warning-filled:before {
  content: "\e273";
  font-family: dex-ok-dc2c9dc6be
}

.dex-okx-defi-warning {
  --ok-icon-font-family: "dex-ok-dc2c9dc6be"
}

.dex-okx-defi-warning:before {
  content: "\e272";
  font-family: dex-ok-dc2c9dc6be
}

.dex-okx-defi-sort-down {
  --ok-icon-font-family: "dex-ok-dc2c9dc6be"
}

.dex-okx-defi-sort-down:before {
  content: "\e271";
  font-family: dex-ok-dc2c9dc6be
}

.dex-okx-defi-filter {
  --ok-icon-font-family: "dex-ok-dc2c9dc6be"
}

.dex-okx-defi-filter:before {
  content: "\e270";
  font-family: dex-ok-dc2c9dc6be
}

.dex-okx-defi-selected {
  --ok-icon-font-family: "dex-ok-dc2c9dc6be"
}

.dex-okx-defi-selected:before {
  content: "\e26f";
  font-family: dex-ok-dc2c9dc6be
}

.dex-okx-defi-location-outline {
  --ok-icon-font-family: "dex-ok-dc2c9dc6be"
}

.dex-okx-defi-location-outline:before {
  content: "\e26e";
  font-family: dex-ok-dc2c9dc6be
}

.dex-okx-defi-explore-outline {
  --ok-icon-font-family: "dex-ok-dc2c9dc6be"
}

.dex-okx-defi-explore-outline:before {
  content: "\e26d";
  font-family: dex-ok-dc2c9dc6be
}

.dex-okx-defi-quick-filled {
  --ok-icon-font-family: "dex-ok-dc2c9dc6be"
}

.dex-okx-defi-quick-filled:before {
  content: "\e26c";
  font-family: dex-ok-dc2c9dc6be
}

.dex-okx-defi-star {
  --ok-icon-font-family: "dex-ok-dc2c9dc6be"
}

.dex-okx-defi-star:before {
  content: "\e26b";
  font-family: dex-ok-dc2c9dc6be
}

.dex-okx-defi-star-filled {
  --ok-icon-font-family: "dex-ok-dc2c9dc6be"
}

.dex-okx-defi-star-filled:before {
  content: "\e26a";
  font-family: dex-ok-dc2c9dc6be
}

.dex-okx-defi-airdrop-zone {
  --ok-icon-font-family: "dex-ok-dc2c9dc6be"
}

.dex-okx-defi-airdrop-zone:before {
  content: "\e269";
  font-family: dex-ok-dc2c9dc6be
}

.dex-okx-defi-airdrop-zone-filled {
  --ok-icon-font-family: "dex-ok-dc2c9dc6be"
}

.dex-okx-defi-airdrop-zone-filled:before {
  content: "\e268";
  font-family: dex-ok-dc2c9dc6be
}

.dex-okx-defi-bell {
  --ok-icon-font-family: "dex-ok-dc2c9dc6be"
}

.dex-okx-defi-bell:before {
  content: "\e267";
  font-family: dex-ok-dc2c9dc6be
}

.dex-okx-defi-globe-filled {
  --ok-icon-font-family: "dex-ok-dc2c9dc6be"
}

.dex-okx-defi-globe-filled:before {
  content: "\e266";
  font-family: dex-ok-dc2c9dc6be
}

.dex-okx-defi-clock {
  --ok-icon-font-family: "dex-ok-dc2c9dc6be"
}

.dex-okx-defi-clock:before {
  content: "\e265";
  font-family: dex-ok-dc2c9dc6be
}

.dex-okx-defi-search {
  --ok-icon-font-family: "dex-ok-dc2c9dc6be"
}

.dex-okx-defi-search:before {
  content: "\e264";
  font-family: dex-ok-dc2c9dc6be
}

.dex-okx-defi-unlink {
  --ok-icon-font-family: "dex-ok-dc2c9dc6be"
}

.dex-okx-defi-unlink:before {
  content: "\e263";
  font-family: dex-ok-dc2c9dc6be
}

.dex-okx-defi-Medium {
  --ok-icon-font-family: "dex-ok-dc2c9dc6be"
}

.dex-okx-defi-Medium:before {
  content: "\e262";
  font-family: dex-ok-dc2c9dc6be
}

.dex-okx-defi-Telegram {
  --ok-icon-font-family: "dex-ok-dc2c9dc6be"
}

.dex-okx-defi-Telegram:before {
  content: "\e261";
  font-family: dex-ok-dc2c9dc6be
}

.dex-okx-defi-X {
  --ok-icon-font-family: "dex-ok-dc2c9dc6be"
}

.dex-okx-defi-X:before {
  content: "\e260";
  font-family: dex-ok-dc2c9dc6be
}

.dex-okx-defi-Discord {
  --ok-icon-font-family: "dex-ok-dc2c9dc6be"
}

.dex-okx-defi-Discord:before {
  content: "\e25f";
  font-family: dex-ok-dc2c9dc6be
}

.dex-okx-defi-transfer {
  --ok-icon-font-family: "dex-ok-dc2c9dc6be"
}

.dex-okx-defi-transfer:before {
  content: "\e25e";
  font-family: dex-ok-dc2c9dc6be
}

.dex-okx-defi-pointer-right {
  --ok-icon-font-family: "dex-ok-dc2c9dc6be"
}

.dex-okx-defi-pointer-right:before {
  content: "\e25d";
  font-family: dex-ok-dc2c9dc6be
}

.dex-okx-defi-chevron-right {
  --ok-icon-font-family: "dex-ok-dc2c9dc6be"
}

.dex-okx-defi-chevron-right:before {
  content: "\e25c";
  font-family: dex-ok-dc2c9dc6be
}

.dex-okx-defi-close {
  --ok-icon-font-family: "dex-ok-dc2c9dc6be"
}

.dex-okx-defi-close:before {
  content: "\e25b";
  font-family: dex-ok-dc2c9dc6be
}

.dex-okx-defi-chevron-up {
  --ok-icon-font-family: "dex-ok-dc2c9dc6be"
}

.dex-okx-defi-chevron-up:before {
  content: "\e25a";
  font-family: dex-ok-dc2c9dc6be
}

.dex-okx-defi-chevron-down {
  --ok-icon-font-family: "dex-ok-dc2c9dc6be"
}

.dex-okx-defi-chevron-down:before {
  content: "\e259";
  font-family: dex-ok-dc2c9dc6be
}

.dex-okx-defi-information-filled {
  --ok-icon-font-family: "dex-ok-dc2c9dc6be"
}

.dex-okx-defi-information-filled:before {
  content: "\e258";
  font-family: dex-ok-dc2c9dc6be
}

.dex-okx-defi-information {
  --ok-icon-font-family: "dex-ok-dc2c9dc6be"
}

.dex-okx-defi-information:before {
  content: "\e257";
  font-family: dex-ok-dc2c9dc6be
}

.dex-okx-defi-bookmark {
  --ok-icon-font-family: "dex-ok-dc2c9dc6be"
}

.dex-okx-defi-bookmark:before {
  content: "\e256";
  font-family: dex-ok-dc2c9dc6be
}

.dex-okx-defi-like-filled {
  --ok-icon-font-family: "dex-ok-dc2c9dc6be"
}

.dex-okx-defi-like-filled:before {
  content: "\e255";
  font-family: dex-ok-dc2c9dc6be
}

.dex-okx-defi-like {
  --ok-icon-font-family: "dex-ok-dc2c9dc6be"
}

.dex-okx-defi-like:before {
  content: "\e254";
  font-family: dex-ok-dc2c9dc6be
}

.dex-okx-defi-web3-linked-accounts {
  --ok-icon-font-family: "dex-ok-dc2c9dc6be"
}

.dex-okx-defi-web3-linked-accounts:before {
  content: "\e253";
  font-family: dex-ok-dc2c9dc6be
}

.dex-okx-defi-dex-sa-tracker {
  --ok-icon-font-family: "dex-ok-dc2c9dc6be"
}

.dex-okx-defi-dex-sa-tracker:before {
  content: "\e252";
  font-family: dex-ok-dc2c9dc6be
}

.dex-okx-defi-sort {
  --ok-icon-font-family: "dex-ok-dc2c9dc6be"
}

.dex-okx-defi-sort:before {
  content: "\e251";
  font-family: dex-ok-dc2c9dc6be
}

.dex-okx-defi-minus-circle {
  --ok-icon-font-family: "dex-ok-dc2c9dc6be"
}

.dex-okx-defi-minus-circle:before {
  content: "\e250";
  font-family: dex-ok-dc2c9dc6be
}

.dex-okx-defi-picture {
  --ok-icon-font-family: "dex-ok-dc2c9dc6be"
}

.dex-okx-defi-picture:before {
  content: "\e24f";
  font-family: dex-ok-dc2c9dc6be
}

.dex-okx-defi-web3-shield {
  --ok-icon-font-family: "dex-ok-dc2c9dc6be"
}

.dex-okx-defi-web3-shield:before {
  content: "\e24e";
  font-family: dex-ok-dc2c9dc6be
}

.dex-okx-defi-network-disconnected {
  --ok-icon-font-family: "dex-ok-dc2c9dc6be"
}

.dex-okx-defi-network-disconnected:before {
  content: "\e24b";
  font-family: dex-ok-dc2c9dc6be
}

.dex-okx-defi-network-stable {
  --ok-icon-font-family: "dex-ok-dc2c9dc6be"
}

.dex-okx-defi-network-stable:before {
  content: "\e24c";
  font-family: dex-ok-dc2c9dc6be
}

.dex-okx-defi-network-unstable {
  --ok-icon-font-family: "dex-ok-dc2c9dc6be"
}

.dex-okx-defi-network-unstable:before {
  content: "\e24d";
  font-family: dex-ok-dc2c9dc6be
}

.dex-okx-defi-web3-leaderboard-filled {
  --ok-icon-font-family: "dex-ok-dc2c9dc6be"
}

.dex-okx-defi-web3-leaderboard-filled:before {
  content: "\e24a";
  font-family: dex-ok-dc2c9dc6be
}

.dex-okx-defi-tokens-filled {
  --ok-icon-font-family: "dex-ok-dc2c9dc6be"
}

.dex-okx-defi-tokens-filled:before {
  content: "\e249";
  font-family: dex-ok-dc2c9dc6be
}

.dex-okx-defi-loading {
  --ok-icon-font-family: "dex-ok-dc2c9dc6be"
}

.dex-okx-defi-loading:before {
  content: "\e248";
  font-family: dex-ok-dc2c9dc6be
}

.dex-okx-defi-illimited {
  --ok-icon-font-family: "dex-ok-dc2c9dc6be"
}

.dex-okx-defi-illimited:before {
  content: "\e247";
  font-family: dex-ok-dc2c9dc6be
}

.dex-okx-defi-facebook {
  --ok-icon-font-family: "dex-ok-dc2c9dc6be"
}

.dex-okx-defi-facebook:before {
  content: "\e246";
  font-family: dex-ok-dc2c9dc6be
}

.dex-okx-defi-telegram {
  --ok-icon-font-family: "dex-ok-dc2c9dc6be"
}

.dex-okx-defi-telegram:before {
  content: "\e245";
  font-family: dex-ok-dc2c9dc6be
}

.dex-okx-defi-dexscreener {
  --ok-icon-font-family: "dex-ok-dc2c9dc6be"
}

.dex-okx-defi-dexscreener:before {
  content: "\e244";
  font-family: dex-ok-dc2c9dc6be
}

.dex-okx-defi-officialwebsite {
  --ok-icon-font-family: "dex-ok-dc2c9dc6be"
}

.dex-okx-defi-officialwebsite:before {
  content: "\e243";
  font-family: dex-ok-dc2c9dc6be
}

.dex-okx-defi-security-off_outline {
  --ok-icon-font-family: "dex-ok-dc2c9dc6be"
}

.dex-okx-defi-security-off_outline:before {
  content: "\e240";
  font-family: dex-ok-dc2c9dc6be
}

.dex-okx-defi-security {
  --ok-icon-font-family: "dex-ok-dc2c9dc6be"
}

.dex-okx-defi-security:before {
  content: "\e242";
  font-family: dex-ok-dc2c9dc6be
}

.dex-okx-defi-copy-trading {
  --ok-icon-font-family: "dex-ok-dc2c9dc6be"
}

.dex-okx-defi-copy-trading:before {
  content: "\e23f";
  font-family: dex-ok-dc2c9dc6be
}

.dex-okx-defi-line-draw {
  --ok-icon-font-family: "dex-ok-dc2c9dc6be"
}

.dex-okx-defi-line-draw:before {
  content: "\e23d";
  font-family: dex-ok-dc2c9dc6be
}

.dex-okx-defi-web3-leaderboard {
  --ok-icon-font-family: "dex-ok-dc2c9dc6be"
}

.dex-okx-defi-web3-leaderboard:before {
  content: "\e23b";
  font-family: dex-ok-dc2c9dc6be
}

.dex-okx-defi-ai-filled {
  --ok-icon-font-family: "dex-ok-dc2c9dc6be"
}

.dex-okx-defi-ai-filled:before {
  content: "\e238";
  font-family: dex-ok-dc2c9dc6be
}

.dex-okx-defi-coin-api {
  --ok-icon-font-family: "dex-ok-dc2c9dc6be"
}

.dex-okx-defi-coin-api:before {
  content: "\e237";
  font-family: dex-ok-dc2c9dc6be
}

.dex-okx-defi-social-update {
  --ok-icon-font-family: "dex-ok-dc2c9dc6be"
}

.dex-okx-defi-social-update:before {
  content: "\e236";
  font-family: dex-ok-dc2c9dc6be
}

.dex-okx-defi-cto {
  --ok-icon-font-family: "dex-ok-dc2c9dc6be"
}

.dex-okx-defi-cto:before {
  content: "\e235";
  font-family: dex-ok-dc2c9dc6be
}

.dex-okx-defi-quick-trade {
  --ok-icon-font-family: "dex-ok-dc2c9dc6be"
}

.dex-okx-defi-quick-trade:before {
  content: "\e234";
  font-family: dex-ok-dc2c9dc6be
}

.dex-okx-defi-loudspeaker-filled {
  --ok-icon-font-family: "dex-ok-dc2c9dc6be"
}

.dex-okx-defi-loudspeaker-filled:before {
  content: "\e233";
  font-family: dex-ok-dc2c9dc6be
}

.dex-okx-defi-dex-drag {
  --ok-icon-font-family: "dex-ok-dc2c9dc6be"
}

.dex-okx-defi-dex-drag:before {
  content: "\e232";
  font-family: dex-ok-dc2c9dc6be
}

.dex-okx-defi-dex-keyboard {
  --ok-icon-font-family: "dex-ok-dc2c9dc6be"
}

.dex-okx-defi-dex-keyboard:before {
  content: "\e231";
  font-family: dex-ok-dc2c9dc6be
}

.dex-okx-defi-broadcast {
  --ok-icon-font-family: "dex-ok-dc2c9dc6be"
}

.dex-okx-defi-broadcast:before {
  content: "\e230";
  font-family: dex-ok-dc2c9dc6be
}

.dex-okx-defi-classic-mode {
  --ok-icon-font-family: "dex-ok-dc2c9dc6be"
}

.dex-okx-defi-classic-mode:before {
  content: "\e22f";
  font-family: dex-ok-dc2c9dc6be
}

.dex-okx-defi-dex-meme-mode-filled {
  --ok-icon-font-family: "dex-ok-dc2c9dc6be"
}

.dex-okx-defi-dex-meme-mode-filled:before {
  content: "\e1c1";
  font-family: dex-ok-dc2c9dc6be
}

.dex-okx-defi-web3-rewards {
  --ok-icon-font-family: "dex-ok-dc2c9dc6be"
}

.dex-okx-defi-web3-rewards:before {
  content: "\e22e";
  font-family: dex-ok-dc2c9dc6be
}

.dex-okx-defi-large-caps-moon {
  --ok-icon-font-family: "dex-ok-dc2c9dc6be"
}

.dex-okx-defi-large-caps-moon:before {
  content: "\e22a";
  font-family: dex-ok-dc2c9dc6be
}

.dex-okx-defi-polyline {
  --ok-icon-font-family: "dex-ok-dc2c9dc6be"
}

.dex-okx-defi-polyline:before {
  content: "\e22b";
  font-family: dex-ok-dc2c9dc6be
}

.dex-okx-defi-price-tag-filled {
  --ok-icon-font-family: "dex-ok-dc2c9dc6be"
}

.dex-okx-defi-price-tag-filled:before {
  content: "\e22c";
  font-family: dex-ok-dc2c9dc6be
}

.dex-okx-defi-seagull {
  --ok-icon-font-family: "dex-ok-dc2c9dc6be"
}

.dex-okx-defi-seagull:before {
  content: "\e22d";
  font-family: dex-ok-dc2c9dc6be
}

.dex-okx-defi-dex-fee-filled {
  --ok-icon-font-family: "dex-ok-dc2c9dc6be"
}

.dex-okx-defi-dex-fee-filled:before {
  content: "\e229";
  font-family: dex-ok-dc2c9dc6be
}

.dex-okx-defi-dex-diamond-outline {
  --ok-icon-font-family: "dex-ok-dc2c9dc6be"
}

.dex-okx-defi-dex-diamond-outline:before {
  content: "\e228";
  font-family: dex-ok-dc2c9dc6be
}

.dex-okx-defi-dex-topholder {
  --ok-icon-font-family: "dex-ok-dc2c9dc6be"
}

.dex-okx-defi-dex-topholder:before {
  content: "\e227";
  font-family: dex-ok-dc2c9dc6be
}

.dex-okx-defi-dex-blockdev {
  --ok-icon-font-family: "dex-ok-dc2c9dc6be"
}

.dex-okx-defi-dex-blockdev:before {
  content: "\e226";
  font-family: dex-ok-dc2c9dc6be
}

.dex-okx-defi-dex-dev {
  --ok-icon-font-family: "dex-ok-dc2c9dc6be"
}

.dex-okx-defi-dex-dev:before {
  content: "\e225";
  font-family: dex-ok-dc2c9dc6be
}

.dex-okx-defi-trade-panel {
  --ok-icon-font-family: "dex-ok-dc2c9dc6be"
}

.dex-okx-defi-trade-panel:before {
  content: "\e223";
  font-family: dex-ok-dc2c9dc6be
}

.dex-okx-defi-trade-table {
  --ok-icon-font-family: "dex-ok-dc2c9dc6be"
}

.dex-okx-defi-trade-table:before {
  content: "\e224";
  font-family: dex-ok-dc2c9dc6be
}

.dex-okx-defi-dex-aped {
  --ok-icon-font-family: "dex-ok-dc2c9dc6be"
}

.dex-okx-defi-dex-aped:before {
  content: "\e222";
  font-family: dex-ok-dc2c9dc6be
}

.dex-okx-defi-trade-simple {
  --ok-icon-font-family: "dex-ok-dc2c9dc6be"
}

.dex-okx-defi-trade-simple:before {
  content: "\e221";
  font-family: dex-ok-dc2c9dc6be
}

.dex-okx-defi-dex-polyline {
  --ok-icon-font-family: "dex-ok-dc2c9dc6be"
}

.dex-okx-defi-dex-polyline:before {
  content: "\e220";
  font-family: dex-ok-dc2c9dc6be
}

.dex-okx-defi-web3-shield-filled {
  --ok-icon-font-family: "dex-ok-dc2c9dc6be"
}

.dex-okx-defi-web3-shield-filled:before {
  content: "\e21f";
  font-family: dex-ok-dc2c9dc6be
}

.dex-okx-defi-tokens-outline {
  --ok-icon-font-family: "dex-ok-dc2c9dc6be"
}

.dex-okx-defi-tokens-outline:before {
  content: "\e21e";
  font-family: dex-ok-dc2c9dc6be
}

.dex-okx-defi-onchain-earn {
  --ok-icon-font-family: "dex-ok-dc2c9dc6be"
}

.dex-okx-defi-onchain-earn:before {
  content: "\e21d";
  font-family: dex-ok-dc2c9dc6be
}

.dex-okx-defi-confirm-currency-outline {
  --ok-icon-font-family: "dex-ok-dc2c9dc6be"
}

.dex-okx-defi-confirm-currency-outline:before {
  content: "\e21c";
  font-family: dex-ok-dc2c9dc6be
}

.dex-okx-defi-dex-bubblemap {
  --ok-icon-font-family: "dex-ok-dc2c9dc6be"
}

.dex-okx-defi-dex-bubblemap:before {
  content: "\e21b";
  font-family: dex-ok-dc2c9dc6be
}

.dex-okx-defi-dex-bundler {
  --ok-icon-font-family: "dex-ok-dc2c9dc6be"
}

.dex-okx-defi-dex-bundler:before {
  content: "\e21a";
  font-family: dex-ok-dc2c9dc6be
}

.dex-okx-defi-web3-edit {
  --ok-icon-font-family: "dex-ok-dc2c9dc6be"
}

.dex-okx-defi-web3-edit:before {
  content: "\e219";
  font-family: dex-ok-dc2c9dc6be
}

.dex-okx-defi-translation {
  --ok-icon-font-family: "dex-ok-dc2c9dc6be"
}

.dex-okx-defi-translation:before {
  content: "\e218";
  font-family: dex-ok-dc2c9dc6be
}

.dex-okx-defi-user-outline {
  --ok-icon-font-family: "dex-ok-dc2c9dc6be"
}

.dex-okx-defi-user-outline:before {
  content: "\e217";
  font-family: dex-ok-dc2c9dc6be
}

.dex-okx-defi-user-filled {
  --ok-icon-font-family: "dex-ok-dc2c9dc6be"
}

.dex-okx-defi-user-filled:before {
  content: "\e216";
  font-family: dex-ok-dc2c9dc6be
}

.dex-okx-defi-volume-off-filled {
  --ok-icon-font-family: "dex-ok-dc2c9dc6be"
}

.dex-okx-defi-volume-off-filled:before {
  content: "\e215";
  font-family: dex-ok-dc2c9dc6be
}

.dex-okx-defi-recall-message {
  --ok-icon-font-family: "dex-ok-dc2c9dc6be"
}

.dex-okx-defi-recall-message:before {
  content: "\e214";
  font-family: dex-ok-dc2c9dc6be
}

.dex-okx-defi-translation-off {
  --ok-icon-font-family: "dex-ok-dc2c9dc6be"
}

.dex-okx-defi-translation-off:before {
  content: "\e213";
  font-family: dex-ok-dc2c9dc6be
}

.dex-okx-defi-fire-flame-filled {
  --ok-icon-font-family: "dex-ok-dc2c9dc6be"
}

.dex-okx-defi-fire-flame-filled:before {
  content: "\e212";
  font-family: dex-ok-dc2c9dc6be
}

.dex-okx-defi-feather-filled {
  --ok-icon-font-family: "dex-ok-dc2c9dc6be"
}

.dex-okx-defi-feather-filled:before {
  content: "\e211";
  font-family: dex-ok-dc2c9dc6be
}

.dex-okx-defi-feather-outline {
  --ok-icon-font-family: "dex-ok-dc2c9dc6be"
}

.dex-okx-defi-feather-outline:before {
  content: "\e210";
  font-family: dex-ok-dc2c9dc6be
}

.dex-okx-defi-message-filled {
  --ok-icon-font-family: "dex-ok-dc2c9dc6be"
}

.dex-okx-defi-message-filled:before {
  content: "\e20f";
  font-family: dex-ok-dc2c9dc6be
}

.dex-okx-defi-dex-remove-liquidity {
  --ok-icon-font-family: "dex-ok-dc2c9dc6be"
}

.dex-okx-defi-dex-remove-liquidity:before {
  content: "\e20d";
  font-family: dex-ok-dc2c9dc6be
}

.dex-okx-defi-dex-add-liquidity {
  --ok-icon-font-family: "dex-ok-dc2c9dc6be"
}

.dex-okx-defi-dex-add-liquidity:before {
  content: "\e20e";
  font-family: dex-ok-dc2c9dc6be
}

.dex-okx-defi-single-candle {
  --ok-icon-font-family: "dex-ok-dc2c9dc6be"
}

.dex-okx-defi-single-candle:before {
  content: "\e20c";
  font-family: dex-ok-dc2c9dc6be
}

.dex-okx-defi-eye-show {
  --ok-icon-font-family: "dex-ok-dc2c9dc6be"
}

.dex-okx-defi-eye-show:before {
  content: "\e20b";
  font-family: dex-ok-dc2c9dc6be
}

.dex-okx-defi-eye-hide {
  --ok-icon-font-family: "dex-ok-dc2c9dc6be"
}

.dex-okx-defi-eye-hide:before {
  content: "\e20a";
  font-family: dex-ok-dc2c9dc6be
}

.dex-okx-defi-volume-max-filled {
  --ok-icon-font-family: "dex-ok-dc2c9dc6be"
}

.dex-okx-defi-volume-max-filled:before {
  content: "\e209";
  font-family: dex-ok-dc2c9dc6be
}

.dex-okx-defi-play {
  --ok-icon-font-family: "dex-ok-dc2c9dc6be"
}

.dex-okx-defi-play:before {
  content: "\e208";
  font-family: dex-ok-dc2c9dc6be
}

.dex-okx-defi-authentication-filled {
  --ok-icon-font-family: "dex-ok-dc2c9dc6be"
}

.dex-okx-defi-authentication-filled:before {
  content: "\e207";
  font-family: dex-ok-dc2c9dc6be
}

.dex-okx-defi-switch-view-frame-filled {
  --ok-icon-font-family: "dex-ok-dc2c9dc6be"
}

.dex-okx-defi-switch-view-frame-filled:before {
  content: "\e206";
  font-family: dex-ok-dc2c9dc6be
}

.dex-okx-defi-camera {
  --ok-icon-font-family: "dex-ok-dc2c9dc6be"
}

.dex-okx-defi-camera:before {
  content: "\e205";
  font-family: dex-ok-dc2c9dc6be
}

.dex-okx-defi-dex-ready-to-claim {
  --ok-icon-font-family: "dex-ok-dc2c9dc6be"
}

.dex-okx-defi-dex-ready-to-claim:before {
  content: "\e204";
  font-family: dex-ok-dc2c9dc6be
}

.dex-okx-defi-web3-report {
  --ok-icon-font-family: "dex-ok-dc2c9dc6be"
}

.dex-okx-defi-web3-report:before {
  content: "\e203";
  font-family: dex-ok-dc2c9dc6be
}

.dex-okx-defi-open-pop-up-window {
  --ok-icon-font-family: "dex-ok-dc2c9dc6be"
}

.dex-okx-defi-open-pop-up-window:before {
  content: "\e202";
  font-family: dex-ok-dc2c9dc6be
}

.dex-okx-defi-linkedIn {
  --ok-icon-font-family: "dex-ok-dc2c9dc6be"
}

.dex-okx-defi-linkedIn:before {
  content: "\e201";
  font-family: dex-ok-dc2c9dc6be
}

.dex-okx-defi-loudspeaker {
  --ok-icon-font-family: "dex-ok-dc2c9dc6be"
}

.dex-okx-defi-loudspeaker:before {
  content: "\e200";
  font-family: dex-ok-dc2c9dc6be
}

.dex-okx-defi-kol {
  --ok-icon-font-family: "dex-ok-dc2c9dc6be"
}

.dex-okx-defi-kol:before {
  content: "\e1ff";
  font-family: dex-ok-dc2c9dc6be
}

.dex-okx-defi-settings-filled {
  --ok-icon-font-family: "dex-ok-dc2c9dc6be"
}

.dex-okx-defi-settings-filled:before {
  content: "\e1fe";
  font-family: dex-ok-dc2c9dc6be
}

.dex-okx-defi-switch-view-chart-filled {
  --ok-icon-font-family: "dex-ok-dc2c9dc6be"
}

.dex-okx-defi-switch-view-chart-filled:before {
  content: "\e1fd";
  font-family: dex-ok-dc2c9dc6be
}

.dex-okx-defi-web3-share {
  --ok-icon-font-family: "dex-ok-dc2c9dc6be"
}

.dex-okx-defi-web3-share:before {
  content: "\e1c5";
  font-family: dex-ok-dc2c9dc6be
}

.dex-okx-defi-web3-open-link {
  --ok-icon-font-family: "dex-ok-dc2c9dc6be"
}

.dex-okx-defi-web3-open-link:before {
  content: "\e192";
  font-family: dex-ok-dc2c9dc6be
}

.dex-okx-defi-watchlist-outline {
  --ok-icon-font-family: "dex-ok-dc2c9dc6be"
}

.dex-okx-defi-watchlist-outline:before {
  content: "\e1fc";
  font-family: dex-ok-dc2c9dc6be
}

.dex-okx-defi-signal-outline {
  --ok-icon-font-family: "dex-ok-dc2c9dc6be"
}

.dex-okx-defi-signal-outline:before {
  content: "\e1fb";
  font-family: dex-ok-dc2c9dc6be
}

.dex-okx-defi-tracker-outline {
  --ok-icon-font-family: "dex-ok-dc2c9dc6be"
}

.dex-okx-defi-tracker-outline:before {
  content: "\e1fa";
  font-family: dex-ok-dc2c9dc6be
}

.dex-okx-defi-pump-outline {
  --ok-icon-font-family: "dex-ok-dc2c9dc6be"
}

.dex-okx-defi-pump-outline:before {
  content: "\e1f9";
  font-family: dex-ok-dc2c9dc6be
}

.dex-okx-defi-dex-tracker {
  --ok-icon-font-family: "dex-ok-dc2c9dc6be"
}

.dex-okx-defi-dex-tracker:before {
  content: "\e1f8";
  font-family: dex-ok-dc2c9dc6be
}

.dex-okx-defi-dex-10min-migrated {
  --ok-icon-font-family: "dex-ok-dc2c9dc6be"
}

.dex-okx-defi-dex-10min-migrated:before {
  content: "\e1f7";
  font-family: dex-ok-dc2c9dc6be
}

.dex-okx-defi-dex-low-liquidity {
  --ok-icon-font-family: "dex-ok-dc2c9dc6be"
}

.dex-okx-defi-dex-low-liquidity:before {
  content: "\e1a5";
  font-family: dex-ok-dc2c9dc6be
}

.dex-okx-defi-dex-calendar {
  --ok-icon-font-family: "dex-ok-dc2c9dc6be"
}

.dex-okx-defi-dex-calendar:before {
  content: "\e1f6";
  font-family: dex-ok-dc2c9dc6be
}

.dex-okx-defi-web3-get-token {
  --ok-icon-font-family: "dex-ok-dc2c9dc6be"
}

.dex-okx-defi-web3-get-token:before {
  content: "\e1f5";
  font-family: dex-ok-dc2c9dc6be
}

.dex-okx-defi-dex-radar {
  --ok-icon-font-family: "dex-ok-dc2c9dc6be"
}

.dex-okx-defi-dex-radar:before {
  content: "\e1f4";
  font-family: dex-ok-dc2c9dc6be
}

.dex-okx-defi-rugpull-filled {
  --ok-icon-font-family: "dex-ok-dc2c9dc6be"
}

.dex-okx-defi-rugpull-filled:before {
  content: "\e1f3";
  font-family: dex-ok-dc2c9dc6be
}

.dex-okx-defi-white-paper {
  --ok-icon-font-family: "dex-ok-dc2c9dc6be"
}

.dex-okx-defi-white-paper:before {
  content: "\e1f2";
  font-family: dex-ok-dc2c9dc6be
}

.dex-okx-defi-explore {
  --ok-icon-font-family: "dex-ok-dc2c9dc6be"
}

.dex-okx-defi-explore:before {
  content: "\e1f1";
  font-family: dex-ok-dc2c9dc6be
}

.dex-okx-defi-browser {
  --ok-icon-font-family: "dex-ok-dc2c9dc6be"
}

.dex-okx-defi-browser:before {
  content: "\e1f0";
  font-family: dex-ok-dc2c9dc6be
}

.dex-okx-defi-web3-volume-small {
  --ok-icon-font-family: "dex-ok-dc2c9dc6be"
}

.dex-okx-defi-web3-volume-small:before {
  content: "\e1ef";
  font-family: dex-ok-dc2c9dc6be
}

.dex-okx-defi-web3-volume-on {
  --ok-icon-font-family: "dex-ok-dc2c9dc6be"
}

.dex-okx-defi-web3-volume-on:before {
  content: "\e1ee";
  font-family: dex-ok-dc2c9dc6be
}

.dex-okx-defi-web3-volume-off {
  --ok-icon-font-family: "dex-ok-dc2c9dc6be"
}

.dex-okx-defi-web3-volume-off:before {
  content: "\e1ed";
  font-family: dex-ok-dc2c9dc6be
}

.dex-okx-defi-web3-volume-medium {
  --ok-icon-font-family: "dex-ok-dc2c9dc6be"
}

.dex-okx-defi-web3-volume-medium:before {
  content: "\e1ec";
  font-family: dex-ok-dc2c9dc6be
}

.dex-okx-defi-dex-alert-bell {
  --ok-icon-font-family: "dex-ok-dc2c9dc6be"
}

.dex-okx-defi-dex-alert-bell:before {
  content: "\e1eb";
  font-family: dex-ok-dc2c9dc6be
}

.dex-okx-defi-qa-button-collapse {
  --ok-icon-font-family: "dex-ok-dc2c9dc6be"
}

.dex-okx-defi-qa-button-collapse:before {
  content: "\e1ea";
  font-family: dex-ok-dc2c9dc6be
}

.dex-okx-defi-dex-api {
  --ok-icon-font-family: "dex-ok-dc2c9dc6be"
}

.dex-okx-defi-dex-api:before {
  content: "\e1e9";
  font-family: dex-ok-dc2c9dc6be
}

.dex-okx-defi-expand-outline {
  --ok-icon-font-family: "dex-ok-dc2c9dc6be"
}

.dex-okx-defi-expand-outline:before {
  content: "\e1e8";
  font-family: dex-ok-dc2c9dc6be
}

.dex-okx-defi-explorer-1 {
  --ok-icon-font-family: "dex-ok-dc2c9dc6be"
}

.dex-okx-defi-explorer-1:before {
  content: "\e1e7";
  font-family: dex-ok-dc2c9dc6be
}

.dex-okx-defi-dex-address {
  --ok-icon-font-family: "dex-ok-dc2c9dc6be"
}

.dex-okx-defi-dex-address:before {
  content: "\e1e4";
  font-family: dex-ok-dc2c9dc6be
}

.dex-okx-defi-link-1 {
  --ok-icon-font-family: "dex-ok-dc2c9dc6be"
}

.dex-okx-defi-link-1:before {
  content: "\e1e6";
  font-family: dex-ok-dc2c9dc6be
}

.dex-okx-defi-token {
  --ok-icon-font-family: "dex-ok-dc2c9dc6be"
}

.dex-okx-defi-token:before {
  content: "\e1e5";
  font-family: dex-ok-dc2c9dc6be
}

.dex-okx-defi-dex-token-outline {
  --ok-icon-font-family: "dex-ok-dc2c9dc6be"
}

.dex-okx-defi-dex-token-outline:before {
  content: "\e1e3";
  font-family: dex-ok-dc2c9dc6be
}

.dex-okx-defi-social-share-button {
  --ok-icon-font-family: "dex-ok-dc2c9dc6be"
}

.dex-okx-defi-social-share-button:before {
  content: "\e1e2";
  font-family: dex-ok-dc2c9dc6be
}

.dex-okx-defi-repost {
  --ok-icon-font-family: "dex-ok-dc2c9dc6be"
}

.dex-okx-defi-repost:before {
  content: "\e1e1";
  font-family: dex-ok-dc2c9dc6be
}

.dex-okx-defi-dollar-symbol-outline {
  --ok-icon-font-family: "dex-ok-dc2c9dc6be"
}

.dex-okx-defi-dollar-symbol-outline:before {
  content: "\e1e0";
  font-family: dex-ok-dc2c9dc6be
}

.dex-okx-defi-verified-filled {
  --ok-icon-font-family: "dex-ok-dc2c9dc6be"
}

.dex-okx-defi-verified-filled:before {
  content: "\e1df";
  font-family: dex-ok-dc2c9dc6be
}

.dex-okx-defi-crown-filled {
  --ok-icon-font-family: "dex-ok-dc2c9dc6be"
}

.dex-okx-defi-crown-filled:before {
  content: "\e1de";
  font-family: dex-ok-dc2c9dc6be
}

.dex-okx-defi-hot-filled {
  --ok-icon-font-family: "dex-ok-dc2c9dc6be"
}

.dex-okx-defi-hot-filled:before {
  content: "\e1da";
  font-family: dex-ok-dc2c9dc6be
}

.dex-okx-defi-hot-outline {
  --ok-icon-font-family: "dex-ok-dc2c9dc6be"
}

.dex-okx-defi-hot-outline:before {
  content: "\e1db";
  font-family: dex-ok-dc2c9dc6be
}

.dex-okx-defi-lock-filled {
  --ok-icon-font-family: "dex-ok-dc2c9dc6be"
}

.dex-okx-defi-lock-filled:before {
  content: "\e1dc";
  font-family: dex-ok-dc2c9dc6be
}

.dex-okx-defi-lock-outline {
  --ok-icon-font-family: "dex-ok-dc2c9dc6be"
}

.dex-okx-defi-lock-outline:before {
  content: "\e1dd";
  font-family: dex-ok-dc2c9dc6be
}

.dex-okx-defi-dashboard {
  --ok-icon-font-family: "dex-ok-dc2c9dc6be"
}

.dex-okx-defi-dashboard:before {
  content: "\e1d9";
  font-family: dex-ok-dc2c9dc6be
}

.dex-okx-defi-suspected-phishing-filled {
  --ok-icon-font-family: "dex-ok-dc2c9dc6be"
}

.dex-okx-defi-suspected-phishing-filled:before {
  content: "\e1d8";
  font-family: dex-ok-dc2c9dc6be
}

.dex-okx-defi-diamond-filled {
  --ok-icon-font-family: "dex-ok-dc2c9dc6be"
}

.dex-okx-defi-diamond-filled:before {
  content: "\e1d3";
  font-family: dex-ok-dc2c9dc6be
}

.dex-okx-defi-exchanges-filled {
  --ok-icon-font-family: "dex-ok-dc2c9dc6be"
}

.dex-okx-defi-exchanges-filled:before {
  content: "\e1d4";
  font-family: dex-ok-dc2c9dc6be
}

.dex-okx-defi-suspected-filled {
  --ok-icon-font-family: "dex-ok-dc2c9dc6be"
}

.dex-okx-defi-suspected-filled:before {
  content: "\e1d5";
  font-family: dex-ok-dc2c9dc6be
}

.dex-okx-defi-sandwich-filled {
  --ok-icon-font-family: "dex-ok-dc2c9dc6be"
}

.dex-okx-defi-sandwich-filled:before {
  content: "\e1d6";
  font-family: dex-ok-dc2c9dc6be
}

.dex-okx-defi-paper-filled {
  --ok-icon-font-family: "dex-ok-dc2c9dc6be"
}

.dex-okx-defi-paper-filled:before {
  content: "\e1d7";
  font-family: dex-ok-dc2c9dc6be
}

.dex-okx-defi-api-keys {
  --ok-icon-font-family: "dex-ok-dc2c9dc6be"
}

.dex-okx-defi-api-keys:before {
  content: "\e1c6";
  font-family: dex-ok-dc2c9dc6be
}

.dex-okx-defi-document {
  --ok-icon-font-family: "dex-ok-dc2c9dc6be"
}

.dex-okx-defi-document:before {
  content: "\e1c7";
  font-family: dex-ok-dc2c9dc6be
}

.dex-okx-defi-history {
  --ok-icon-font-family: "dex-ok-dc2c9dc6be"
}

.dex-okx-defi-history:before {
  content: "\e1c8";
  font-family: dex-ok-dc2c9dc6be
}

.dex-okx-defi-home {
  --ok-icon-font-family: "dex-ok-dc2c9dc6be"
}

.dex-okx-defi-home:before {
  content: "\e1c9";
  font-family: dex-ok-dc2c9dc6be
}

.dex-okx-defi-index-price-api {
  --ok-icon-font-family: "dex-ok-dc2c9dc6be"
}

.dex-okx-defi-index-price-api:before {
  content: "\e1ca";
  font-family: dex-ok-dc2c9dc6be
}

.dex-okx-defi-limit-order-api {
  --ok-icon-font-family: "dex-ok-dc2c9dc6be"
}

.dex-okx-defi-limit-order-api:before {
  content: "\e1cb";
  font-family: dex-ok-dc2c9dc6be
}

.dex-okx-defi-jumpstart {
  --ok-icon-font-family: "dex-ok-dc2c9dc6be"
}

.dex-okx-defi-jumpstart:before {
  content: "\e1cc";
  font-family: dex-ok-dc2c9dc6be
}

.dex-okx-defi-trans-gateway-api {
  --ok-icon-font-family: "dex-ok-dc2c9dc6be"
}

.dex-okx-defi-trans-gateway-api:before {
  content: "\e1cd";
  font-family: dex-ok-dc2c9dc6be
}

.dex-okx-defi-user-gasless-api {
  --ok-icon-font-family: "dex-ok-dc2c9dc6be"
}

.dex-okx-defi-user-gasless-api:before {
  content: "\e1ce";
  font-family: dex-ok-dc2c9dc6be
}

.dex-okx-defi-toolkit {
  --ok-icon-font-family: "dex-ok-dc2c9dc6be"
}

.dex-okx-defi-toolkit:before {
  content: "\e1cf";
  font-family: dex-ok-dc2c9dc6be
}

.dex-okx-defi-user-protection {
  --ok-icon-font-family: "dex-ok-dc2c9dc6be"
}

.dex-okx-defi-user-protection:before {
  content: "\e1d0";
  font-family: dex-ok-dc2c9dc6be
}

.dex-okx-defi-wallet-signature-SDK {
  --ok-icon-font-family: "dex-ok-dc2c9dc6be"
}

.dex-okx-defi-wallet-signature-SDK:before {
  content: "\e1d1";
  font-family: dex-ok-dc2c9dc6be
}

.dex-okx-defi-web3-message {
  --ok-icon-font-family: "dex-ok-dc2c9dc6be"
}

.dex-okx-defi-web3-message:before {
  content: "\e1d2";
  font-family: dex-ok-dc2c9dc6be
}

.dex-okx-defi-ai-outline {
  --ok-icon-font-family: "dex-ok-dc2c9dc6be"
}

.dex-okx-defi-ai-outline:before {
  content: "\e1c3";
  font-family: dex-ok-dc2c9dc6be
}

.dex-okx-defi-radio-outline {
  --ok-icon-font-family: "dex-ok-dc2c9dc6be"
}

.dex-okx-defi-radio-outline:before {
  content: "\e1c4";
  font-family: dex-ok-dc2c9dc6be
}

.dex-okx-defi-dex-mobile {
  --ok-icon-font-family: "dex-ok-dc2c9dc6be"
}

.dex-okx-defi-dex-mobile:before {
  content: "\e1c2";
  font-family: dex-ok-dc2c9dc6be
}

.dex-okx-defi-dex-all {
  --ok-icon-font-family: "dex-ok-dc2c9dc6be"
}

.dex-okx-defi-dex-all:before {
  content: "\e1bd";
  font-family: dex-ok-dc2c9dc6be
}

.dex-okx-defi-dex-bot {
  --ok-icon-font-family: "dex-ok-dc2c9dc6be"
}

.dex-okx-defi-dex-bot:before {
  content: "\e1be";
  font-family: dex-ok-dc2c9dc6be
}

.dex-okx-defi-dex-gold-dog-expert {
  --ok-icon-font-family: "dex-ok-dc2c9dc6be"
}

.dex-okx-defi-dex-gold-dog-expert:before {
  content: "\e1bf";
  font-family: dex-ok-dc2c9dc6be
}

.dex-okx-defi-dex-pump-smart-money {
  --ok-icon-font-family: "dex-ok-dc2c9dc6be"
}

.dex-okx-defi-dex-pump-smart-money:before {
  content: "\e1c0";
  font-family: dex-ok-dc2c9dc6be
}

.dex-okx-defi-reward-filled {
  --ok-icon-font-family: "dex-ok-dc2c9dc6be"
}

.dex-okx-defi-reward-filled:before {
  content: "\e1bb";
  font-family: dex-ok-dc2c9dc6be
}

.dex-okx-defi-referral {
  --ok-icon-font-family: "dex-ok-dc2c9dc6be"
}

.dex-okx-defi-referral:before {
  content: "\e1bc";
  font-family: dex-ok-dc2c9dc6be
}

.dex-okx-defi-dex-feeds {
  --ok-icon-font-family: "dex-ok-dc2c9dc6be"
}

.dex-okx-defi-dex-feeds:before {
  content: "\e1ba";
  font-family: dex-ok-dc2c9dc6be
}

.dex-okx-defi-wallet-marketplace-linked-accounts {
  --ok-icon-font-family: "dex-ok-dc2c9dc6be"
}

.dex-okx-defi-wallet-marketplace-linked-accounts:before {
  content: "\e1b8";
  font-family: dex-ok-dc2c9dc6be
}

.dex-okx-defi-wallet-marketplace-linked-wallet {
  --ok-icon-font-family: "dex-ok-dc2c9dc6be"
}

.dex-okx-defi-wallet-marketplace-linked-wallet:before {
  content: "\e1b9";
  font-family: dex-ok-dc2c9dc6be
}

.dex-okx-defi-competition-pump {
  --ok-icon-font-family: "dex-ok-dc2c9dc6be"
}

.dex-okx-defi-competition-pump:before {
  content: "\e1b7";
  font-family: dex-ok-dc2c9dc6be
}

.dex-okx-defi-trending-down {
  --ok-icon-font-family: "dex-ok-dc2c9dc6be"
}

.dex-okx-defi-trending-down:before {
  content: "\e1b5";
  font-family: dex-ok-dc2c9dc6be
}

.dex-okx-defi-trending-up {
  --ok-icon-font-family: "dex-ok-dc2c9dc6be"
}

.dex-okx-defi-trending-up:before {
  content: "\e1b6";
  font-family: dex-ok-dc2c9dc6be
}

.dex-okx-defi-collapse {
  --ok-icon-font-family: "dex-ok-dc2c9dc6be"
}

.dex-okx-defi-collapse:before {
  content: "\e1b3";
  font-family: dex-ok-dc2c9dc6be
}

.dex-okx-defi-expand {
  --ok-icon-font-family: "dex-ok-dc2c9dc6be"
}

.dex-okx-defi-expand:before {
  content: "\e1b4";
  font-family: dex-ok-dc2c9dc6be
}

.dex-okx-defi-dex-like {
  --ok-icon-font-family: "dex-ok-dc2c9dc6be"
}

.dex-okx-defi-dex-like:before {
  content: "\e1b2";
  font-family: dex-ok-dc2c9dc6be
}

.dex-okx-defi-dex-like-filled {
  --ok-icon-font-family: "dex-ok-dc2c9dc6be"
}

.dex-okx-defi-dex-like-filled:before {
  content: "\e1b1";
  font-family: dex-ok-dc2c9dc6be
}

.dex-okx-defi-dex-recognized {
  --ok-icon-font-family: "dex-ok-dc2c9dc6be"
}

.dex-okx-defi-dex-recognized:before {
  content: "\e1b0";
  font-family: dex-ok-dc2c9dc6be
}

.dex-okx-defi-year-disconnect {
  --ok-icon-font-family: "dex-ok-dc2c9dc6be"
}

.dex-okx-defi-year-disconnect:before {
  content: "\e1af";
  font-family: dex-ok-dc2c9dc6be
}

.dex-okx-defi-nft-trading {
  --ok-icon-font-family: "dex-ok-dc2c9dc6be"
}

.dex-okx-defi-nft-trading:before {
  content: "\e1ae";
  font-family: dex-ok-dc2c9dc6be
}

.dex-okx-defi-nft-price {
  --ok-icon-font-family: "dex-ok-dc2c9dc6be"
}

.dex-okx-defi-nft-price:before {
  content: "\e1ad";
  font-family: dex-ok-dc2c9dc6be
}

.dex-okx-defi-dex-whale {
  --ok-icon-font-family: "dex-ok-dc2c9dc6be"
}

.dex-okx-defi-dex-whale:before {
  content: "\e1ac";
  font-family: dex-ok-dc2c9dc6be
}

.dex-okx-defi-dex-tx-surge {
  --ok-icon-font-family: "dex-ok-dc2c9dc6be"
}

.dex-okx-defi-dex-tx-surge:before {
  content: "\e1ab";
  font-family: dex-ok-dc2c9dc6be
}

.dex-okx-defi-dex-tx-plunge {
  --ok-icon-font-family: "dex-ok-dc2c9dc6be"
}

.dex-okx-defi-dex-tx-plunge:before {
  content: "\e1aa";
  font-family: dex-ok-dc2c9dc6be
}

.dex-okx-defi-dex-top10-holders {
  --ok-icon-font-family: "dex-ok-dc2c9dc6be"
}

.dex-okx-defi-dex-top10-holders:before {
  content: "\e1a9";
  font-family: dex-ok-dc2c9dc6be
}

.dex-okx-defi-dex-top-holder {
  --ok-icon-font-family: "dex-ok-dc2c9dc6be"
}

.dex-okx-defi-dex-top-holder:before {
  content: "\e1a8";
  font-family: dex-ok-dc2c9dc6be
}

.dex-okx-defi-dex-newest {
  --ok-icon-font-family: "dex-ok-dc2c9dc6be"
}

.dex-okx-defi-dex-newest:before {
  content: "\e1a7";
  font-family: dex-ok-dc2c9dc6be
}

.dex-okx-defi-dex-migrating {
  --ok-icon-font-family: "dex-ok-dc2c9dc6be"
}

.dex-okx-defi-dex-migrating:before {
  content: "\e1a6";
  font-family: dex-ok-dc2c9dc6be
}

.dex-okx-defi-dex-launched {
  --ok-icon-font-family: "dex-ok-dc2c9dc6be"
}

.dex-okx-defi-dex-launched:before {
  content: "\e1a4";
  font-family: dex-ok-dc2c9dc6be
}

.dex-okx-defi-dex-holders-surge {
  --ok-icon-font-family: "dex-ok-dc2c9dc6be"
}

.dex-okx-defi-dex-holders-surge:before {
  content: "\e1a2";
  font-family: dex-ok-dc2c9dc6be
}

.dex-okx-defi-dex-holders-plunge {
  --ok-icon-font-family: "dex-ok-dc2c9dc6be"
}

.dex-okx-defi-dex-holders-plunge:before {
  content: "\e1a1";
  font-family: dex-ok-dc2c9dc6be
}

.dex-okx-defi-dex-high-liquidity {
  --ok-icon-font-family: "dex-ok-dc2c9dc6be"
}

.dex-okx-defi-dex-high-liquidity:before {
  content: "\e1a0";
  font-family: dex-ok-dc2c9dc6be
}

.dex-okx-defi-dex-fresh {
  --ok-icon-font-family: "dex-ok-dc2c9dc6be"
}

.dex-okx-defi-dex-fresh:before {
  content: "\e19f";
  font-family: dex-ok-dc2c9dc6be
}

.dex-okx-defi-dex-finalizing {
  --ok-icon-font-family: "dex-ok-dc2c9dc6be"
}

.dex-okx-defi-dex-finalizing:before {
  content: "\e19e";
  font-family: dex-ok-dc2c9dc6be
}

.dex-okx-defi-dex-DEV {
  --ok-icon-font-family: "dex-ok-dc2c9dc6be"
}

.dex-okx-defi-dex-DEV:before {
  content: "\e19d";
  font-family: dex-ok-dc2c9dc6be
}

.dex-okx-defi-dex-danger {
  --ok-icon-font-family: "dex-ok-dc2c9dc6be"
}

.dex-okx-defi-dex-danger:before {
  content: "\e19c";
  font-family: dex-ok-dc2c9dc6be
}

.dex-okx-defi-dex-snipers {
  --ok-icon-font-family: "dex-ok-dc2c9dc6be"
}

.dex-okx-defi-dex-snipers:before {
  content: "\e157";
  font-family: dex-ok-dc2c9dc6be
}

.dex-okx-defi-dex-suspicious {
  --ok-icon-font-family: "dex-ok-dc2c9dc6be"
}

.dex-okx-defi-dex-suspicious:before {
  content: "\e158";
  font-family: dex-ok-dc2c9dc6be
}

.dex-okx-defi-dex-smart-money {
  --ok-icon-font-family: "dex-ok-dc2c9dc6be"
}

.dex-okx-defi-dex-smart-money:before {
  content: "\e156";
  font-family: dex-ok-dc2c9dc6be
}

.dex-okx-defi-dex-quick-filled {
  --ok-icon-font-family: "dex-ok-dc2c9dc6be"
}

.dex-okx-defi-dex-quick-filled:before {
  content: "\e19b";
  font-family: dex-ok-dc2c9dc6be
}

.dex-okx-defi-dex-full-logo {
  --ok-icon-font-family: "dex-ok-dc2c9dc6be"
}

.dex-okx-defi-dex-full-logo:before {
  content: "\e197";
  font-family: dex-ok-dc2c9dc6be
}

.dex-okx-defi-dex-xlogo {
  --ok-icon-font-family: "dex-ok-dc2c9dc6be"
}

.dex-okx-defi-dex-xlogo:before {
  content: "\e198";
  font-family: dex-ok-dc2c9dc6be
}

.dex-okx-defi-dex-copiers {
  --ok-icon-font-family: "dex-ok-dc2c9dc6be"
}

.dex-okx-defi-dex-copiers:before {
  content: "\e19a";
  font-family: dex-ok-dc2c9dc6be
}

.dex-okx-defi-trading-view-logo {
  --ok-icon-font-family: "dex-ok-dc2c9dc6be"
}

.dex-okx-defi-trading-view-logo:before {
  content: "\e196";
  font-family: dex-ok-dc2c9dc6be
}

.dex-okx-defi-dex-fee {
  --ok-icon-font-family: "dex-ok-dc2c9dc6be"
}

.dex-okx-defi-dex-fee:before {
  content: "\e195";
  font-family: dex-ok-dc2c9dc6be
}

.dex-okx-defi-dex-slippage {
  --ok-icon-font-family: "dex-ok-dc2c9dc6be"
}

.dex-okx-defi-dex-slippage:before {
  content: "\e193";
  font-family: dex-ok-dc2c9dc6be
}

.dex-okx-defi-dex-web3-settings {
  --ok-icon-font-family: "dex-ok-dc2c9dc6be"
}

.dex-okx-defi-dex-web3-settings:before {
  content: "\e194";
  font-family: dex-ok-dc2c9dc6be
}

.dex-okx-defi-web3-crypto {
  --ok-icon-font-family: "dex-ok-dc2c9dc6be"
}

.dex-okx-defi-web3-crypto:before {
  content: "\e191";
  font-family: dex-ok-dc2c9dc6be
}

.dex-okx-defi-volume-max {
  --ok-icon-font-family: "dex-ok-dc2c9dc6be"
}

.dex-okx-defi-volume-max:before {
  content: "\e18f";
  font-family: dex-ok-dc2c9dc6be
}

.dex-okx-defi-volume-off {
  --ok-icon-font-family: "dex-ok-dc2c9dc6be"
}

.dex-okx-defi-volume-off:before {
  content: "\e190";
  font-family: dex-ok-dc2c9dc6be
}

.dex-okx-defi-translate {
  --ok-icon-font-family: "dex-ok-dc2c9dc6be"
}

.dex-okx-defi-translate:before {
  content: "\e18e";
  font-family: dex-ok-dc2c9dc6be
}

.dex-okx-defi-dex-meme-mode {
  --ok-icon-font-family: "dex-ok-dc2c9dc6be"
}

.dex-okx-defi-dex-meme-mode:before {
  content: "\e18d";
  font-family: dex-ok-dc2c9dc6be
}

.dex-okx-defi-dex-bridge {
  --ok-icon-font-family: "dex-ok-dc2c9dc6be"
}

.dex-okx-defi-dex-bridge:before {
  content: "\e18c";
  font-family: dex-ok-dc2c9dc6be
}

.dex-okx-defi-dex-advanced {
  --ok-icon-font-family: "dex-ok-dc2c9dc6be"
}

.dex-okx-defi-dex-advanced:before {
  content: "\e18b";
  font-family: dex-ok-dc2c9dc6be
}

.dex-okx-defi-dex-check {
  --ok-icon-font-family: "dex-ok-dc2c9dc6be"
}

.dex-okx-defi-dex-check:before {
  content: "\e18a";
  font-family: dex-ok-dc2c9dc6be
}

.dex-okx-defi-dex-chevron-up {
  --ok-icon-font-family: "dex-ok-dc2c9dc6be"
}

.dex-okx-defi-dex-chevron-up:before {
  content: "\e188";
  font-family: dex-ok-dc2c9dc6be
}

.dex-okx-defi-dex-chevron-down {
  --ok-icon-font-family: "dex-ok-dc2c9dc6be"
}

.dex-okx-defi-dex-chevron-down:before {
  content: "\e189";
  font-family: dex-ok-dc2c9dc6be
}

.dex-okx-defi-earn-web3-loop {
  --ok-icon-font-family: "dex-ok-dc2c9dc6be"
}

.dex-okx-defi-earn-web3-loop:before {
  content: "\e187";
  font-family: dex-ok-dc2c9dc6be
}

.dex-okx-defi-dex-alert {
  --ok-icon-font-family: "dex-ok-dc2c9dc6be"
}

.dex-okx-defi-dex-alert:before {
  content: "\e185";
  font-family: dex-ok-dc2c9dc6be
}

.dex-okx-defi-dex-add-alert {
  --ok-icon-font-family: "dex-ok-dc2c9dc6be"
}

.dex-okx-defi-dex-add-alert:before {
  content: "\e186";
  font-family: dex-ok-dc2c9dc6be
}

.dex-okx-defi-dex-sort-down {
  --ok-icon-font-family: "dex-ok-dc2c9dc6be"
}

.dex-okx-defi-dex-sort-down:before {
  content: "\e184";
  font-family: dex-ok-dc2c9dc6be
}

.dex-okx-defi-web3-unknown-risks {
  --ok-icon-font-family: "dex-ok-dc2c9dc6be"
}

.dex-okx-defi-web3-unknown-risks:before {
  content: "\e183";
  font-family: dex-ok-dc2c9dc6be
}

.dex-okx-defi-web3-unknown-risks-filled {
  --ok-icon-font-family: "dex-ok-dc2c9dc6be"
}

.dex-okx-defi-web3-unknown-risks-filled:before {
  content: "\e182";
  font-family: dex-ok-dc2c9dc6be
}

.dex-okx-defi-web3-newest {
  --ok-icon-font-family: "dex-ok-dc2c9dc6be"
}

.dex-okx-defi-web3-newest:before {
  content: "\e181";
  font-family: dex-ok-dc2c9dc6be
}

.dex-okx-defi-dex-candle-chart-indicator {
  --ok-icon-font-family: "dex-ok-dc2c9dc6be"
}

.dex-okx-defi-dex-candle-chart-indicator:before {
  content: "\e180";
  font-family: dex-ok-dc2c9dc6be
}

.dex-okx-defi-dex-fire-flame {
  --ok-icon-font-family: "dex-ok-dc2c9dc6be"
}

.dex-okx-defi-dex-fire-flame:before {
  content: "\e17f";
  font-family: dex-ok-dc2c9dc6be
}

.dex-okx-defi_dex_caution {
  --ok-icon-font-family: "dex-ok-dc2c9dc6be"
}

.dex-okx-defi_dex_caution:before {
  content: "\e17c";
  font-family: dex-ok-dc2c9dc6be
}

.dex-okx-defi_dex_risk {
  --ok-icon-font-family: "dex-ok-dc2c9dc6be"
}

.dex-okx-defi_dex_risk:before {
  content: "\e17d";
  font-family: dex-ok-dc2c9dc6be
}

.dex-okx-defi_dex_security {
  --ok-icon-font-family: "dex-ok-dc2c9dc6be"
}

.dex-okx-defi_dex_security:before {
  content: "\e17e";
  font-family: dex-ok-dc2c9dc6be
}

.dex-okx-defi-cv-gv1 {
  --ok-icon-font-family: "dex-ok-dc2c9dc6be"
}

.dex-okx-defi-cv-gv1:before {
  content: "\e17b";
  font-family: dex-ok-dc2c9dc6be
}

.dex-okx-defi-cv-cp {
  --ok-icon-font-family: "dex-ok-dc2c9dc6be"
}

.dex-okx-defi-cv-cp:before {
  content: "\e17a";
  font-family: dex-ok-dc2c9dc6be
}

.dex-okx-defi-cp-referral-file {
  --ok-icon-font-family: "dex-ok-dc2c9dc6be"
}

.dex-okx-defi-cp-referral-file:before {
  content: "\e179";
  font-family: dex-ok-dc2c9dc6be
}

.dex-okx-defi-dex-web3-network {
  --ok-icon-font-family: "dex-ok-dc2c9dc6be"
}

.dex-okx-defi-dex-web3-network:before {
  content: "\e178";
  font-family: dex-ok-dc2c9dc6be
}

.dex-okx-defi_dex_bubblemaps {
  --ok-icon-font-family: "dex-ok-dc2c9dc6be"
}

.dex-okx-defi_dex_bubblemaps:before {
  content: "\e175";
  font-family: dex-ok-dc2c9dc6be
}

.dex-okx-defi-dex-refresh-2 {
  --ok-icon-font-family: "dex-ok-dc2c9dc6be"
}

.dex-okx-defi-dex-refresh-2:before {
  content: "\e174";
  font-family: dex-ok-dc2c9dc6be
}

.dex-okx-defi-cp-paper {
  --ok-icon-font-family: "dex-ok-dc2c9dc6be"
}

.dex-okx-defi-cp-paper:before {
  content: "\e173";
  font-family: dex-ok-dc2c9dc6be
}

.dex-okx-defi_nft_home_arrow {
  --ok-icon-font-family: "dex-ok-dc2c9dc6be"
}

.dex-okx-defi_nft_home_arrow:before {
  content: "\e172";
  font-family: dex-ok-dc2c9dc6be
}

.dex-okx-defi-game-caretup {
  --ok-icon-font-family: "dex-ok-dc2c9dc6be"
}

.dex-okx-defi-game-caretup:before {
  content: "\e16f";
  font-family: dex-ok-dc2c9dc6be
}

.dex-okx-defi-game-caretdown {
  --ok-icon-font-family: "dex-ok-dc2c9dc6be"
}

.dex-okx-defi-game-caretdown:before {
  content: "\e170";
  font-family: dex-ok-dc2c9dc6be
}

.dex-okx-defi-game-tg {
  --ok-icon-font-family: "dex-ok-dc2c9dc6be"
}

.dex-okx-defi-game-tg:before {
  content: "\e171";
  font-family: dex-ok-dc2c9dc6be
}

.dex-okx-defi-smart-portfolio {
  --ok-icon-font-family: "dex-ok-dc2c9dc6be"
}

.dex-okx-defi-smart-portfolio:before {
  content: "\e16e";
  font-family: dex-ok-dc2c9dc6be
}

.dex-okx-defi-wallet-defi {
  --ok-icon-font-family: "dex-ok-dc2c9dc6be"
}

.dex-okx-defi-wallet-defi:before {
  content: "\e169";
  font-family: dex-ok-dc2c9dc6be
}

.dex-okx-defi-wallet-walletapi {
  --ok-icon-font-family: "dex-ok-dc2c9dc6be"
}

.dex-okx-defi-wallet-walletapi:before {
  content: "\e16a";
  font-family: dex-ok-dc2c9dc6be
}

.dex-okx-defi-wallet-marketplace {
  --ok-icon-font-family: "dex-ok-dc2c9dc6be"
}

.dex-okx-defi-wallet-marketplace:before {
  content: "\e16b";
  font-family: dex-ok-dc2c9dc6be
}

.dex-okx-defi-wallet-dex {
  --ok-icon-font-family: "dex-ok-dc2c9dc6be"
}

.dex-okx-defi-wallet-dex:before {
  content: "\e16c";
  font-family: dex-ok-dc2c9dc6be
}

.dex-okx-defi-wallet-apikeys {
  --ok-icon-font-family: "dex-ok-dc2c9dc6be"
}

.dex-okx-defi-wallet-apikeys:before {
  content: "\e16d";
  font-family: dex-ok-dc2c9dc6be
}

.dex-okx-defi--marketplace-game {
  --ok-icon-font-family: "dex-ok-dc2c9dc6be"
}

.dex-okx-defi--marketplace-game:before {
  content: "\e168";
  font-family: dex-ok-dc2c9dc6be
}

.dex-okx-defi-dex-caution {
  --ok-icon-font-family: "dex-ok-dc2c9dc6be"
}

.dex-okx-defi-dex-caution:before {
  content: "\e167";
  font-family: dex-ok-dc2c9dc6be
}

.dex-okx-defi-game-nft {
  --ok-icon-font-family: "dex-ok-dc2c9dc6be"
}

.dex-okx-defi-game-nft:before {
  content: "\e166";
  font-family: dex-ok-dc2c9dc6be
}

.dex-okx-defi-game-inter1 {
  --ok-icon-font-family: "dex-ok-dc2c9dc6be"
}

.dex-okx-defi-game-inter1:before {
  content: "\e165";
  font-family: dex-ok-dc2c9dc6be
}

.dex-okx-defi-shop-close {
  --ok-icon-font-family: "dex-ok-dc2c9dc6be"
}

.dex-okx-defi-shop-close:before {
  content: "\e164";
  font-family: dex-ok-dc2c9dc6be
}

.dex-okx-defi-shop-closebtn {
  --ok-icon-font-family: "dex-ok-dc2c9dc6be"
}

.dex-okx-defi-shop-closebtn:before {
  content: "\e163";
  font-family: dex-ok-dc2c9dc6be
}

.dex-okx-defi-game-other {
  --ok-icon-font-family: "dex-ok-dc2c9dc6be"
}

.dex-okx-defi-game-other:before {
  content: "\e162";
  font-family: dex-ok-dc2c9dc6be
}

.dex-okx-defi-swag-close {
  --ok-icon-font-family: "dex-ok-dc2c9dc6be"
}

.dex-okx-defi-swag-close:before {
  content: "\e161";
  font-family: dex-ok-dc2c9dc6be
}

.dex-okx-defi-dex-copy1 {
  --ok-icon-font-family: "dex-ok-dc2c9dc6be"
}

.dex-okx-defi-dex-copy1:before {
  content: "\e15e";
  font-family: dex-ok-dc2c9dc6be
}

.dex-okx-defi-dex-filter1 {
  --ok-icon-font-family: "dex-ok-dc2c9dc6be"
}

.dex-okx-defi-dex-filter1:before {
  content: "\e15f";
  font-family: dex-ok-dc2c9dc6be
}

.dex-okx-defi-dex-filtered1 {
  --ok-icon-font-family: "dex-ok-dc2c9dc6be"
}

.dex-okx-defi-dex-filtered1:before {
  content: "\e160";
  font-family: dex-ok-dc2c9dc6be
}

.dex-okx-defi-marketplace-close {
  --ok-icon-font-family: "dex-ok-dc2c9dc6be"
}

.dex-okx-defi-marketplace-close:before {
  content: "\e15d";
  font-family: dex-ok-dc2c9dc6be
}

.dex-okx-defi-marketplace-plus {
  --ok-icon-font-family: "dex-ok-dc2c9dc6be"
}

.dex-okx-defi-marketplace-plus:before {
  content: "\e134";
  font-family: dex-ok-dc2c9dc6be
}

.dex-okx-defi-swag-ship {
  --ok-icon-font-family: "dex-ok-dc2c9dc6be"
}

.dex-okx-defi-swag-ship:before {
  content: "\e15c";
  font-family: dex-ok-dc2c9dc6be
}

.dex-okx-defi-nft-mint:before {
  content: "\e15b";
  font-family: dex-ok-dc2c9dc6be
}

.dex-okx-defi-nft-mint {
  --ok-icon-font-family: "dex-ok-dc2c9dc6be"
}

.dex-okx-defi-nft-mint :before {
  content: "\e15a";
  font-family: dex-ok-dc2c9dc6be
}

.dex-okx-defi-swag-cart {
  --ok-icon-font-family: "dex-ok-dc2c9dc6be"
}

.dex-okx-defi-swag-cart:before {
  content: "\e159";
  font-family: dex-ok-dc2c9dc6be
}

.dex-okx-defi-dex-rate {
  --ok-icon-font-family: "dex-ok-dc2c9dc6be"
}

.dex-okx-defi-dex-rate:before {
  content: "\e155";
  font-family: dex-ok-dc2c9dc6be
}

.dex-okx-defi-swagstore-cart {
  --ok-icon-font-family: "dex-ok-dc2c9dc6be"
}

.dex-okx-defi-swagstore-cart:before {
  content: "\e154";
  font-family: dex-ok-dc2c9dc6be
}

.dex-okx-defi-dex-refresh {
  --ok-icon-font-family: "dex-ok-dc2c9dc6be"
}

.dex-okx-defi-dex-refresh:before {
  content: "\e153";
  font-family: dex-ok-dc2c9dc6be
}

.dex-okx-defi-dex-okxlogo {
  --ok-icon-font-family: "dex-ok-dc2c9dc6be"
}

.dex-okx-defi-dex-okxlogo:before {
  content: "\e152";
  font-family: dex-ok-dc2c9dc6be
}

.dex-okx-defi-defi-openlink {
  --ok-icon-font-family: "dex-ok-dc2c9dc6be"
}

.dex-okx-defi-defi-openlink:before {
  content: "\e151";
  font-family: dex-ok-dc2c9dc6be
}

.dex-okx-defi-dex-checkbox-blank {
  --ok-icon-font-family: "dex-ok-dc2c9dc6be"
}

.dex-okx-defi-dex-checkbox-blank:before {
  content: "\e14e";
  font-family: dex-ok-dc2c9dc6be
}

.dex-okx-defi-dex-checkbox {
  --ok-icon-font-family: "dex-ok-dc2c9dc6be"
}

.dex-okx-defi-dex-checkbox:before {
  content: "\e14f";
  font-family: dex-ok-dc2c9dc6be
}

.dex-okx-defi-dex-filtered {
  --ok-icon-font-family: "dex-ok-dc2c9dc6be"
}

.dex-okx-defi-dex-filtered:before {
  content: "\e150";
  font-family: dex-ok-dc2c9dc6be
}

.dex-okx-defi-chart-settings {
  --ok-icon-font-family: "dex-ok-dc2c9dc6be"
}

.dex-okx-defi-chart-settings:before {
  content: "\e14d";
  font-family: dex-ok-dc2c9dc6be
}

.dex-okx-defi-left {
  --ok-icon-font-family: "dex-ok-dc2c9dc6be"
}

.dex-okx-defi-left:before {
  content: "\e14c";
  font-family: dex-ok-dc2c9dc6be
}

.dex-okx-defi-dex-link-2 {
  --ok-icon-font-family: "dex-ok-dc2c9dc6be"
}

.dex-okx-defi-dex-link-2:before {
  content: "\e14b";
  font-family: dex-ok-dc2c9dc6be
}

.dex-okx-defi-dex-twitter {
  --ok-icon-font-family: "dex-ok-dc2c9dc6be"
}

.dex-okx-defi-dex-twitter:before {
  content: "\e14a";
  font-family: dex-ok-dc2c9dc6be
}

.dex-okx-defi-discover-flash {
  --ok-icon-font-family: "dex-ok-dc2c9dc6be"
}

.dex-okx-defi-discover-flash:before {
  content: "\e149";
  font-family: dex-ok-dc2c9dc6be
}

.dex-okx-defi-dex-star-filled {
  --ok-icon-font-family: "dex-ok-dc2c9dc6be"
}

.dex-okx-defi-dex-star-filled:before {
  content: "\e147";
  font-family: dex-ok-dc2c9dc6be
}

.dex-okx-defi-dex-star {
  --ok-icon-font-family: "dex-ok-dc2c9dc6be"
}

.dex-okx-defi-dex-star:before {
  content: "\e148";
  font-family: dex-ok-dc2c9dc6be
}

.dex-okx-defi-github {
  --ok-icon-font-family: "dex-ok-dc2c9dc6be"
}

.dex-okx-defi-github:before {
  content: "\e145";
  font-family: dex-ok-dc2c9dc6be
}

.dex-okx-defi-audit {
  --ok-icon-font-family: "dex-ok-dc2c9dc6be"
}

.dex-okx-defi-audit:before {
  content: "\e146";
  font-family: dex-ok-dc2c9dc6be
}

.dex-okx-defi-airdorp {
  --ok-icon-font-family: "dex-ok-dc2c9dc6be"
}

.dex-okx-defi-airdorp:before {
  content: "\e009";
  font-family: dex-ok-dc2c9dc6be
}

.dex-okx-defi-arrow {
  --ok-icon-font-family: "dex-ok-dc2c9dc6be"
}

.dex-okx-defi-arrow:before {
  content: "\e144";
  font-family: dex-ok-dc2c9dc6be
}

.dex-okx-defi-nft-Instagram {
  --ok-icon-font-family: "dex-ok-dc2c9dc6be"
}

.dex-okx-defi-nft-Instagram:before {
  content: "\e141";
  font-family: dex-ok-dc2c9dc6be
}

.dex-okx-defi-nft-discord {
  --ok-icon-font-family: "dex-ok-dc2c9dc6be"
}

.dex-okx-defi-nft-discord:before {
  content: "\e142";
  font-family: dex-ok-dc2c9dc6be
}

.dex-okx-defi-nft-medium {
  --ok-icon-font-family: "dex-ok-dc2c9dc6be"
}

.dex-okx-defi-nft-medium:before {
  content: "\e143";
  font-family: dex-ok-dc2c9dc6be
}

.dex-okx-defi-nft-open-link {
  --ok-icon-font-family: "dex-ok-dc2c9dc6be"
}

.dex-okx-defi-nft-open-link:before {
  content: "\e140";
  font-family: dex-ok-dc2c9dc6be
}

.dex-okx-defi-marketplace-chevron-left {
  --ok-icon-font-family: "dex-ok-dc2c9dc6be"
}

.dex-okx-defi-marketplace-chevron-left:before {
  content: "\e13c";
  font-family: dex-ok-dc2c9dc6be
}

.dex-okx-defi-marketplace-chevron-down {
  --ok-icon-font-family: "dex-ok-dc2c9dc6be"
}

.dex-okx-defi-marketplace-chevron-down:before {
  content: "\e13d";
  font-family: dex-ok-dc2c9dc6be
}

.dex-okx-defi-marketplace-chevron-right {
  --ok-icon-font-family: "dex-ok-dc2c9dc6be"
}

.dex-okx-defi-marketplace-chevron-right:before {
  content: "\e13e";
  font-family: dex-ok-dc2c9dc6be
}

.dex-okx-defi-marketplace-chevron-up {
  --ok-icon-font-family: "dex-ok-dc2c9dc6be"
}

.dex-okx-defi-marketplace-chevron-up:before {
  content: "\e13f";
  font-family: dex-ok-dc2c9dc6be
}

.dex-okx-defi-marketplace-watch-only {
  --ok-icon-font-family: "dex-ok-dc2c9dc6be"
}

.dex-okx-defi-marketplace-watch-only:before {
  content: "\e13b";
  font-family: dex-ok-dc2c9dc6be
}

.dex-okx-defi-marketplace-service-fee {
  --ok-icon-font-family: "dex-ok-dc2c9dc6be"
}

.dex-okx-defi-marketplace-service-fee:before {
  content: "\e13a";
  font-family: dex-ok-dc2c9dc6be
}

.dex-okx-defi-marketplace-grid-large {
  --ok-icon-font-family: "dex-ok-dc2c9dc6be"
}

.dex-okx-defi-marketplace-grid-large:before {
  content: "\e138";
  font-family: dex-ok-dc2c9dc6be
}

.dex-okx-defi-marketplace-grid-small {
  --ok-icon-font-family: "dex-ok-dc2c9dc6be"
}

.dex-okx-defi-marketplace-grid-small:before {
  content: "\e139";
  font-family: dex-ok-dc2c9dc6be
}

.dex-okx-defi-marketplace-warning {
  --ok-icon-font-family: "dex-ok-dc2c9dc6be"
}

.dex-okx-defi-marketplace-warning:before {
  content: "\e137";
  font-family: dex-ok-dc2c9dc6be
}

.dex-okx-defi-marketplace-fee-rule {
  --ok-icon-font-family: "dex-ok-dc2c9dc6be"
}

.dex-okx-defi-marketplace-fee-rule:before {
  content: "\e136";
  font-family: dex-ok-dc2c9dc6be
}

.dex-okx-defi-marketplace-calendar {
  --ok-icon-font-family: "dex-ok-dc2c9dc6be"
}

.dex-okx-defi-marketplace-calendar:before {
  content: "\e135";
  font-family: dex-ok-dc2c9dc6be
}

.dex-okx-defi-marketplace-minus {
  --ok-icon-font-family: "dex-ok-dc2c9dc6be"
}

.dex-okx-defi-marketplace-minus:before {
  content: "\e133";
  font-family: dex-ok-dc2c9dc6be
}

.dex-okx-defi-marketplace-pointer-up {
  --ok-icon-font-family: "dex-ok-dc2c9dc6be"
}

.dex-okx-defi-marketplace-pointer-up:before {
  content: "\e132";
  font-family: dex-ok-dc2c9dc6be
}

.dex-okx-defi-marketplace-pointer-down {
  --ok-icon-font-family: "dex-ok-dc2c9dc6be"
}

.dex-okx-defi-marketplace-pointer-down:before {
  content: "\e131";
  font-family: dex-ok-dc2c9dc6be
}

.dex-okx-defi-marketplace-pointer-left {
  --ok-icon-font-family: "dex-ok-dc2c9dc6be"
}

.dex-okx-defi-marketplace-pointer-left:before {
  content: "\e130";
  font-family: dex-ok-dc2c9dc6be
}

.dex-okx-defi-marketplace-pointer-right {
  --ok-icon-font-family: "dex-ok-dc2c9dc6be"
}

.dex-okx-defi-marketplace-pointer-right:before {
  content: "\e12f";
  font-family: dex-ok-dc2c9dc6be
}

.dex-okx-defi-marketplace-checkmark {
  --ok-icon-font-family: "dex-ok-dc2c9dc6be"
}

.dex-okx-defi-marketplace-checkmark:before {
  content: "\e12e";
  font-family: dex-ok-dc2c9dc6be
}

.dex-okx-defi-marketplace-selected {
  --ok-icon-font-family: "dex-ok-dc2c9dc6be"
}

.dex-okx-defi-marketplace-selected:before {
  content: "\e12d";
  font-family: dex-ok-dc2c9dc6be
}

.dex-okx-defi-marketplace-unselected {
  --ok-icon-font-family: "dex-ok-dc2c9dc6be"
}

.dex-okx-defi-marketplace-unselected:before {
  content: "\e12c";
  font-family: dex-ok-dc2c9dc6be
}

.dex-okx-defi-marketplace-qr-code {
  --ok-icon-font-family: "dex-ok-dc2c9dc6be"
}

.dex-okx-defi-marketplace-qr-code:before {
  content: "\e12b";
  font-family: dex-ok-dc2c9dc6be
}

.dex-okx-defi-marketplace-official-website {
  --ok-icon-font-family: "dex-ok-dc2c9dc6be"
}

.dex-okx-defi-marketplace-official-website:before {
  content: "\e12a";
  font-family: dex-ok-dc2c9dc6be
}

.dex-okx-defi-marketplace-line-chart {
  --ok-icon-font-family: "dex-ok-dc2c9dc6be"
}

.dex-okx-defi-marketplace-line-chart:before {
  content: "\e129";
  font-family: dex-ok-dc2c9dc6be
}

.dex-okx-defi-marketplace-failed {
  --ok-icon-font-family: "dex-ok-dc2c9dc6be"
}

.dex-okx-defi-marketplace-failed:before {
  content: "\e128";
  font-family: dex-ok-dc2c9dc6be
}

.dex-okx-defi-marketplace-information {
  --ok-icon-font-family: "dex-ok-dc2c9dc6be"
}

.dex-okx-defi-marketplace-information:before {
  content: "\e127";
  font-family: dex-ok-dc2c9dc6be
}

.dex-okx-defi-convert-okx {
  --ok-icon-font-family: "dex-ok-dc2c9dc6be"
}

.dex-okx-defi-convert-okx:before {
  content: "\e126";
  font-family: dex-ok-dc2c9dc6be
}

.dex-okx-defi-uni {
  --ok-icon-font-family: "dex-ok-dc2c9dc6be"
}

.dex-okx-defi-uni:before {
  content: "\e125";
  font-family: dex-ok-dc2c9dc6be
}

.dex-okx-defi-marketplace-gamefi-whitepaper {
  --ok-icon-font-family: "dex-ok-dc2c9dc6be"
}

.dex-okx-defi-marketplace-gamefi-whitepaper:before {
  content: "\e124";
  font-family: dex-ok-dc2c9dc6be
}

.dex-okx-defi-marketplace-gamefi-twitter {
  --ok-icon-font-family: "dex-ok-dc2c9dc6be"
}

.dex-okx-defi-marketplace-gamefi-twitter:before {
  content: "\e123";
  font-family: dex-ok-dc2c9dc6be
}

.dex-okx-defi-marketplace-gamefi-telegram {
  --ok-icon-font-family: "dex-ok-dc2c9dc6be"
}

.dex-okx-defi-marketplace-gamefi-telegram:before {
  content: "\e121";
  font-family: dex-ok-dc2c9dc6be
}

.dex-okx-defi-marketplace-gamefi-medium {
  --ok-icon-font-family: "dex-ok-dc2c9dc6be"
}

.dex-okx-defi-marketplace-gamefi-medium:before {
  content: "\e120";
  font-family: dex-ok-dc2c9dc6be
}

.dex-okx-defi-marketplace-gamefi-ins {
  --ok-icon-font-family: "dex-ok-dc2c9dc6be"
}

.dex-okx-defi-marketplace-gamefi-ins:before {
  content: "\e122";
  font-family: dex-ok-dc2c9dc6be
}

.dex-okx-defi-marketplace-gamefi-discord {
  --ok-icon-font-family: "dex-ok-dc2c9dc6be"
}

.dex-okx-defi-marketplace-gamefi-discord:before {
  content: "\e11f";
  font-family: dex-ok-dc2c9dc6be
}

.dex-okx-defi-dex-bulb {
  --ok-icon-font-family: "dex-ok-dc2c9dc6be"
}

.dex-okx-defi-dex-bulb:before {
  content: "\e11e";
  font-family: dex-ok-dc2c9dc6be
}

.dex-okx-defi-dex-snap-mode {
  --ok-icon-font-family: "dex-ok-dc2c9dc6be"
}

.dex-okx-defi-dex-snap-mode:before {
  content: "\e11d";
  font-family: dex-ok-dc2c9dc6be
}

.dex-okx-defi-dex-history {
  --ok-icon-font-family: "dex-ok-dc2c9dc6be"
}

.dex-okx-defi-dex-history:before {
  content: "\e11c";
  font-family: dex-ok-dc2c9dc6be
}

.dex-okx-defi-dex-swap-for-gas {
  --ok-icon-font-family: "dex-ok-dc2c9dc6be"
}

.dex-okx-defi-dex-swap-for-gas:before {
  content: "\e11b";
  font-family: dex-ok-dc2c9dc6be
}

.dex-okx-defi-dex-orders-1 {
  --ok-icon-font-family: "dex-ok-dc2c9dc6be"
}

.dex-okx-defi-dex-orders-1:before {
  content: "\e119";
  font-family: dex-ok-dc2c9dc6be
}

.dex-okx-defi-dex-solvers {
  --ok-icon-font-family: "dex-ok-dc2c9dc6be"
}

.dex-okx-defi-dex-solvers:before {
  content: "\e11a";
  font-family: dex-ok-dc2c9dc6be
}

.dex-okx-defi-dex-swap {
  --ok-icon-font-family: "dex-ok-dc2c9dc6be"
}

.dex-okx-defi-dex-swap:before {
  content: "\e118";
  font-family: dex-ok-dc2c9dc6be
}

.dex-okx-defi-dex-search {
  --ok-icon-font-family: "dex-ok-dc2c9dc6be"
}

.dex-okx-defi-dex-search:before {
  content: "\e117";
  font-family: dex-ok-dc2c9dc6be
}

.dex-okx-defi-dex-trash {
  --ok-icon-font-family: "dex-ok-dc2c9dc6be"
}

.dex-okx-defi-dex-trash:before {
  content: "\e116";
  font-family: dex-ok-dc2c9dc6be
}

.dex-okx-defi-marketplace-edit {
  --ok-icon-font-family: "dex-ok-dc2c9dc6be"
}

.dex-okx-defi-marketplace-edit:before {
  content: "\e115";
  font-family: dex-ok-dc2c9dc6be
}

.dex-okx-defi-marketplace-cancel {
  --ok-icon-font-family: "dex-ok-dc2c9dc6be"
}

.dex-okx-defi-marketplace-cancel:before {
  content: "\e114";
  font-family: dex-ok-dc2c9dc6be
}

.dex-okx-defi-marketplace-unlist {
  --ok-icon-font-family: "dex-ok-dc2c9dc6be"
}

.dex-okx-defi-marketplace-unlist:before {
  content: "\e113";
  font-family: dex-ok-dc2c9dc6be
}

.dex-okx-defi-marketplace-options {
  --ok-icon-font-family: "dex-ok-dc2c9dc6be"
}

.dex-okx-defi-marketplace-options:before {
  content: "\e111";
  font-family: dex-ok-dc2c9dc6be
}

.dex-okx-defi-marketplace-insights {
  --ok-icon-font-family: "dex-ok-dc2c9dc6be"
}

.dex-okx-defi-marketplace-insights:before {
  content: "\e112";
  font-family: dex-ok-dc2c9dc6be
}

.dex-okx-defi-marketplace-remove-cart {
  --ok-icon-font-family: "dex-ok-dc2c9dc6be"
}

.dex-okx-defi-marketplace-remove-cart:before {
  content: "\e110";
  font-family: dex-ok-dc2c9dc6be
}

.dex-okx-defi-marketplace-add-cart {
  --ok-icon-font-family: "dex-ok-dc2c9dc6be"
}

.dex-okx-defi-marketplace-add-cart:before {
  content: "\e10f";
  font-family: dex-ok-dc2c9dc6be
}

.dex-okx-defi-nft-share2 {
  --ok-icon-font-family: "dex-ok-dc2c9dc6be"
}

.dex-okx-defi-nft-share2:before {
  content: "\e10d";
  font-family: dex-ok-dc2c9dc6be
}

.dex-okx-defi-lock {
  --ok-icon-font-family: "dex-ok-dc2c9dc6be"
}

.dex-okx-defi-lock:before {
  content: "\e10e";
  font-family: dex-ok-dc2c9dc6be
}

.dex-okx-defi-unfollow {
  --ok-icon-font-family: "dex-ok-dc2c9dc6be"
}

.dex-okx-defi-unfollow:before {
  content: "\e10c";
  font-family: dex-ok-dc2c9dc6be
}

.dex-okx-defi-up {
  --ok-icon-font-family: "dex-ok-dc2c9dc6be"
}

.dex-okx-defi-up:before {
  content: "\e106";
  font-family: dex-ok-dc2c9dc6be
}

.dex-okx-defi-down {
  --ok-icon-font-family: "dex-ok-dc2c9dc6be"
}

.dex-okx-defi-down:before {
  content: "\e107";
  font-family: dex-ok-dc2c9dc6be
}

.dex-okx-defi-nft {
  --ok-icon-font-family: "dex-ok-dc2c9dc6be"
}

.dex-okx-defi-nft:before {
  content: "\e108";
  font-family: dex-ok-dc2c9dc6be
}

.dex-okx-defi-trade {
  --ok-icon-font-family: "dex-ok-dc2c9dc6be"
}

.dex-okx-defi-trade:before {
  content: "\e109";
  font-family: dex-ok-dc2c9dc6be
}

.dex-okx-defi-send {
  --ok-icon-font-family: "dex-ok-dc2c9dc6be"
}

.dex-okx-defi-send:before {
  content: "\e10a";
  font-family: dex-ok-dc2c9dc6be
}

.dex-okx-defi-gas {
  --ok-icon-font-family: "dex-ok-dc2c9dc6be"
}

.dex-okx-defi-gas:before {
  content: "\e10b";
  font-family: dex-ok-dc2c9dc6be
}

.dex-okx-defi-nft-arrow {
  --ok-icon-font-family: "dex-ok-dc2c9dc6be"
}

.dex-okx-defi-nft-arrow:before {
  content: "\e105";
  font-family: dex-ok-dc2c9dc6be
}

.dex-okx-defi-signal-bot {
  --ok-icon-font-family: "dex-ok-dc2c9dc6be"
}

.dex-okx-defi-signal-bot:before {
  content: "\e104";
  font-family: dex-ok-dc2c9dc6be
}

.dex-okx-defi--create {
  --ok-icon-font-family: "dex-ok-dc2c9dc6be"
}

.dex-okx-defi--create:before {
  content: "\e000";
  font-family: dex-ok-dc2c9dc6be
}

.dex-okx-defi--android {
  --ok-icon-font-family: "dex-ok-dc2c9dc6be"
}

.dex-okx-defi--android:before {
  content: "\e001";
  font-family: dex-ok-dc2c9dc6be
}

.dex-okx-defi--exchange {
  --ok-icon-font-family: "dex-ok-dc2c9dc6be"
}

.dex-okx-defi--exchange:before {
  content: "\e002";
  font-family: dex-ok-dc2c9dc6be
}

.dex-okx-defi--eye-hide {
  --ok-icon-font-family: "dex-ok-dc2c9dc6be"
}

.dex-okx-defi--eye-hide:before {
  content: "\e003";
  font-family: dex-ok-dc2c9dc6be
}

.dex-okx-defi--eye-show {
  --ok-icon-font-family: "dex-ok-dc2c9dc6be"
}

.dex-okx-defi--eye-show:before {
  content: "\e004";
  font-family: dex-ok-dc2c9dc6be
}

.dex-okx-defi--nft-tips {
  --ok-icon-font-family: "dex-ok-dc2c9dc6be"
}

.dex-okx-defi--nft-tips:before {
  content: "\e005";
  font-family: dex-ok-dc2c9dc6be
}

.dex-okx-defi--nft-trading-tutorial {
  --ok-icon-font-family: "dex-ok-dc2c9dc6be"
}

.dex-okx-defi--nft-trading-tutorial:before {
  content: "\e006";
  font-family: dex-ok-dc2c9dc6be
}

.dex-okx-defi--okc-hathathon {
  --ok-icon-font-family: "dex-ok-dc2c9dc6be"
}

.dex-okx-defi--okc-hathathon:before {
  content: "\e007";
  font-family: dex-ok-dc2c9dc6be
}

.dex-okx-defi--transfer-out {
  --ok-icon-font-family: "dex-ok-dc2c9dc6be"
}

.dex-okx-defi--transfer-out:before {
  content: "\e008";
  font-family: dex-ok-dc2c9dc6be
}

.dex-okx-defi-arrow-chevrons {
  --ok-icon-font-family: "dex-ok-dc2c9dc6be"
}

.dex-okx-defi-arrow-chevrons:before {
  content: "\e00a";
  font-family: dex-ok-dc2c9dc6be
}

.dex-okx-defi-assets {
  --ok-icon-font-family: "dex-ok-dc2c9dc6be"
}

.dex-okx-defi-assets:before {
  content: "\e00b";
  font-family: dex-ok-dc2c9dc6be
}

.dex-okx-defi-build-oracle {
  --ok-icon-font-family: "dex-ok-dc2c9dc6be"
}

.dex-okx-defi-build-oracle:before {
  content: "\e00c";
  font-family: dex-ok-dc2c9dc6be
}

.dex-okx-defi-copy {
  --ok-icon-font-family: "dex-ok-dc2c9dc6be"
}

.dex-okx-defi-copy:before {
  content: "\e00d";
  font-family: dex-ok-dc2c9dc6be
}

.dex-okx-defi-deposit {
  --ok-icon-font-family: "dex-ok-dc2c9dc6be"
}

.dex-okx-defi-deposit:before {
  content: "\e00e";
  font-family: dex-ok-dc2c9dc6be
}

.dex-okx-defi-dex-arrow-down-chevrons {
  --ok-icon-font-family: "dex-ok-dc2c9dc6be"
}

.dex-okx-defi-dex-arrow-down-chevrons:before {
  content: "\e00f";
  font-family: dex-ok-dc2c9dc6be
}

.dex-okx-defi-dex-arrow-down-sincere {
  --ok-icon-font-family: "dex-ok-dc2c9dc6be"
}

.dex-okx-defi-dex-arrow-down-sincere:before {
  content: "\e010";
  font-family: dex-ok-dc2c9dc6be
}

.dex-okx-defi-dex-arrow-down {
  --ok-icon-font-family: "dex-ok-dc2c9dc6be"
}

.dex-okx-defi-dex-arrow-down:before {
  content: "\e011";
  font-family: dex-ok-dc2c9dc6be
}

.dex-okx-defi-dex-arrow-left {
  --ok-icon-font-family: "dex-ok-dc2c9dc6be"
}

.dex-okx-defi-dex-arrow-left:before {
  content: "\e012";
  font-family: dex-ok-dc2c9dc6be
}

.dex-okx-defi-dex-arrow-right-1 {
  --ok-icon-font-family: "dex-ok-dc2c9dc6be"
}

.dex-okx-defi-dex-arrow-right-1:before {
  content: "\e013";
  font-family: dex-ok-dc2c9dc6be
}

.dex-okx-defi-dex-arrow-right-12 {
  --ok-icon-font-family: "dex-ok-dc2c9dc6be"
}

.dex-okx-defi-dex-arrow-right-12:before {
  content: "\e014";
  font-family: dex-ok-dc2c9dc6be
}

.dex-okx-defi-dex-arrow-right-top-01 {
  --ok-icon-font-family: "dex-ok-dc2c9dc6be"
}

.dex-okx-defi-dex-arrow-right-top-01:before {
  content: "\e015";
  font-family: dex-ok-dc2c9dc6be
}

.dex-okx-defi-dex-arrow-right {
  --ok-icon-font-family: "dex-ok-dc2c9dc6be"
}

.dex-okx-defi-dex-arrow-right:before {
  content: "\e016";
  font-family: dex-ok-dc2c9dc6be
}

.dex-okx-defi-dex-arrow-to {
  --ok-icon-font-family: "dex-ok-dc2c9dc6be"
}

.dex-okx-defi-dex-arrow-to:before {
  content: "\e017";
  font-family: dex-ok-dc2c9dc6be
}

.dex-okx-defi-dex-arrow-up-1 {
  --ok-icon-font-family: "dex-ok-dc2c9dc6be"
}

.dex-okx-defi-dex-arrow-up-1:before {
  content: "\e018";
  font-family: dex-ok-dc2c9dc6be
}

.dex-okx-defi-dex-arrow-up {
  --ok-icon-font-family: "dex-ok-dc2c9dc6be"
}

.dex-okx-defi-dex-arrow-up:before {
  content: "\e019";
  font-family: dex-ok-dc2c9dc6be
}

.dex-okx-defi-dex-assets {
  --ok-icon-font-family: "dex-ok-dc2c9dc6be"
}

.dex-okx-defi-dex-assets:before {
  content: "\e01a";
  font-family: dex-ok-dc2c9dc6be
}

.dex-okx-defi-dex-authorization {
  --ok-icon-font-family: "dex-ok-dc2c9dc6be"
}

.dex-okx-defi-dex-authorization:before {
  content: "\e01b";
  font-family: dex-ok-dc2c9dc6be
}

.dex-okx-defi-dex-attention {
  --ok-icon-font-family: "dex-ok-dc2c9dc6be"
}

.dex-okx-defi-dex-attention:before {
  content: "\e01c";
  font-family: dex-ok-dc2c9dc6be
}

.dex-okx-defi-dex-candle-stick {
  --ok-icon-font-family: "dex-ok-dc2c9dc6be"
}

.dex-okx-defi-dex-candle-stick:before {
  content: "\e01e";
  font-family: dex-ok-dc2c9dc6be
}

.dex-okx-defi-dex-clock {
  --ok-icon-font-family: "dex-ok-dc2c9dc6be"
}

.dex-okx-defi-dex-clock:before {
  content: "\e01f";
  font-family: dex-ok-dc2c9dc6be
}

.dex-okx-defi-dex-complete {
  --ok-icon-font-family: "dex-ok-dc2c9dc6be"
}

.dex-okx-defi-dex-complete:before {
  content: "\e020";
  font-family: dex-ok-dc2c9dc6be
}

.dex-okx-defi-dex-copy {
  --ok-icon-font-family: "dex-ok-dc2c9dc6be"
}

.dex-okx-defi-dex-copy:before {
  content: "\e021";
  font-family: dex-ok-dc2c9dc6be
}

.dex-okx-defi-dex-copy2 {
  --ok-icon-font-family: "dex-ok-dc2c9dc6be"
}

.dex-okx-defi-dex-copy2:before {
  content: "\e022";
  font-family: dex-ok-dc2c9dc6be
}

.dex-okx-defi-dex-curve {
  --ok-icon-font-family: "dex-ok-dc2c9dc6be"
}

.dex-okx-defi-dex-curve:before {
  content: "\e023";
  font-family: dex-ok-dc2c9dc6be
}

.dex-okx-defi-dex-double-arrow {
  --ok-icon-font-family: "dex-ok-dc2c9dc6be"
}

.dex-okx-defi-dex-double-arrow:before {
  content: "\e024";
  font-family: dex-ok-dc2c9dc6be
}

.dex-okx-defi-dex-error {
  --ok-icon-font-family: "dex-ok-dc2c9dc6be"
}

.dex-okx-defi-dex-error:before {
  content: "\e025";
  font-family: dex-ok-dc2c9dc6be
}

.dex-okx-defi-dex-exchange {
  --ok-icon-font-family: "dex-ok-dc2c9dc6be"
}

.dex-okx-defi-dex-exchange:before {
  content: "\e026";
  font-family: dex-ok-dc2c9dc6be
}

.dex-okx-defi-dex-fav-check {
  --ok-icon-font-family: "dex-ok-dc2c9dc6be"
}

.dex-okx-defi-dex-fav-check:before {
  content: "\e027";
  font-family: dex-ok-dc2c9dc6be
}

.dex-okx-defi-dex-fav-default {
  --ok-icon-font-family: "dex-ok-dc2c9dc6be"
}

.dex-okx-defi-dex-fav-default:before {
  content: "\e028";
  font-family: dex-ok-dc2c9dc6be
}

.dex-okx-defi-dex-filter {
  --ok-icon-font-family: "dex-ok-dc2c9dc6be"
}

.dex-okx-defi-dex-filter:before {
  content: "\e029";
  font-family: dex-ok-dc2c9dc6be
}

.dex-okx-defi-dex-fireworks-2 {
  --ok-icon-font-family: "dex-ok-dc2c9dc6be"
}

.dex-okx-defi-dex-fireworks-2:before {
  content: "\e02a";
  font-family: dex-ok-dc2c9dc6be
}

.dex-okx-defi-dex-gas-station {
  --ok-icon-font-family: "dex-ok-dc2c9dc6be"
}

.dex-okx-defi-dex-gas-station:before {
  content: "\e02b";
  font-family: dex-ok-dc2c9dc6be
}

.dex-okx-defi-dex-information-circle {
  --ok-icon-font-family: "dex-ok-dc2c9dc6be"
}

.dex-okx-defi-dex-information-circle:before {
  content: "\e02c";
  font-family: dex-ok-dc2c9dc6be
}

.dex-okx-defi-dex-market-close {
  --ok-icon-font-family: "dex-ok-dc2c9dc6be"
}

.dex-okx-defi-dex-market-close:before {
  content: "\e02d";
  font-family: dex-ok-dc2c9dc6be
}

.dex-okx-defi-dex-fireworks {
  --ok-icon-font-family: "dex-ok-dc2c9dc6be"
}

.dex-okx-defi-dex-fireworks:before {
  content: "\e02e";
  font-family: dex-ok-dc2c9dc6be
}

.dex-okx-defi-dex-gas-station-1 {
  --ok-icon-font-family: "dex-ok-dc2c9dc6be"
}

.dex-okx-defi-dex-gas-station-1:before {
  content: "\e02f";
  font-family: dex-ok-dc2c9dc6be
}

.dex-okx-defi-dex-guidebook {
  --ok-icon-font-family: "dex-ok-dc2c9dc6be"
}

.dex-okx-defi-dex-guidebook:before {
  content: "\e030";
  font-family: dex-ok-dc2c9dc6be
}

.dex-okx-defi-dex-info {
  --ok-icon-font-family: "dex-ok-dc2c9dc6be"
}

.dex-okx-defi-dex-info:before {
  content: "\e031";
  font-family: dex-ok-dc2c9dc6be
}

.dex-okx-defi-dex-information {
  --ok-icon-font-family: "dex-ok-dc2c9dc6be"
}

.dex-okx-defi-dex-information:before {
  content: "\e032";
  font-family: dex-ok-dc2c9dc6be
}

.dex-okx-defi-dex-inquiry-frames {
  --ok-icon-font-family: "dex-ok-dc2c9dc6be"
}

.dex-okx-defi-dex-inquiry-frames:before {
  content: "\e033";
  font-family: dex-ok-dc2c9dc6be
}

.dex-okx-defi-dex-limit {
  --ok-icon-font-family: "dex-ok-dc2c9dc6be"
}

.dex-okx-defi-dex-limit:before {
  content: "\e034";
  font-family: dex-ok-dc2c9dc6be
}

.dex-okx-defi-dex-setting {
  --ok-icon-font-family: "dex-ok-dc2c9dc6be"
}

.dex-okx-defi-dex-setting:before {
  content: "\e035";
  font-family: dex-ok-dc2c9dc6be
}

.dex-okx-defi-dex-link-1 {
  --ok-icon-font-family: "dex-ok-dc2c9dc6be"
}

.dex-okx-defi-dex-link-1:before {
  content: "\e036";
  font-family: dex-ok-dc2c9dc6be
}

.dex-okx-defi-dex-link {
  --ok-icon-font-family: "dex-ok-dc2c9dc6be"
}

.dex-okx-defi-dex-link:before {
  content: "\e037";
  font-family: dex-ok-dc2c9dc6be
}

.dex-okx-defi-dex-lock {
  --ok-icon-font-family: "dex-ok-dc2c9dc6be"
}

.dex-okx-defi-dex-lock:before {
  content: "\e038";
  font-family: dex-ok-dc2c9dc6be
}

.dex-okx-defi-dex-unlock {
  --ok-icon-font-family: "dex-ok-dc2c9dc6be"
}

.dex-okx-defi-dex-unlock:before {
  content: "\e039";
  font-family: dex-ok-dc2c9dc6be
}

.dex-okx-defi-dex-low-risk-svg {
  --ok-icon-font-family: "dex-ok-dc2c9dc6be"
}

.dex-okx-defi-dex-low-risk-svg:before {
  content: "\e03a";
  font-family: dex-ok-dc2c9dc6be
}

.dex-okx-defi-discord {
  --ok-icon-font-family: "dex-ok-dc2c9dc6be"
}

.dex-okx-defi-discord:before {
  content: "\e03b";
  font-family: dex-ok-dc2c9dc6be
}

.dex-okx-defi-dex-market-copy {
  --ok-icon-font-family: "dex-ok-dc2c9dc6be"
}

.dex-okx-defi-dex-market-copy:before {
  content: "\e03c";
  font-family: dex-ok-dc2c9dc6be
}

.dex-okx-defi-dex-market-sort-down {
  --ok-icon-font-family: "dex-ok-dc2c9dc6be"
}

.dex-okx-defi-dex-market-sort-down:before {
  content: "\e03d";
  font-family: dex-ok-dc2c9dc6be
}

.dex-okx-defi-googleplay {
  --ok-icon-font-family: "dex-ok-dc2c9dc6be"
}

.dex-okx-defi-googleplay:before {
  content: "\e03e";
  font-family: dex-ok-dc2c9dc6be
}

.dex-okx-defi-dex-market-sort-up {
  --ok-icon-font-family: "dex-ok-dc2c9dc6be"
}

.dex-okx-defi-dex-market-sort-up:before {
  content: "\e03f";
  font-family: dex-ok-dc2c9dc6be
}

.dex-okx-defi-ios {
  --ok-icon-font-family: "dex-ok-dc2c9dc6be"
}

.dex-okx-defi-ios:before {
  content: "\e040";
  font-family: dex-ok-dc2c9dc6be
}

.dex-okx-defi-dex-orders {
  --ok-icon-font-family: "dex-ok-dc2c9dc6be"
}

.dex-okx-defi-dex-orders:before {
  content: "\e041";
  font-family: dex-ok-dc2c9dc6be
}

.dex-okx-defi-dex-pengding {
  --ok-icon-font-family: "dex-ok-dc2c9dc6be"
}

.dex-okx-defi-dex-pengding:before {
  content: "\e042";
  font-family: dex-ok-dc2c9dc6be
}

.dex-okx-defi-marketplace-clock {
  --ok-icon-font-family: "dex-ok-dc2c9dc6be"
}

.dex-okx-defi-marketplace-clock:before {
  content: "\e043";
  font-family: dex-ok-dc2c9dc6be
}

.dex-okx-defi-dex-ranking-favorite {
  --ok-icon-font-family: "dex-ok-dc2c9dc6be"
}

.dex-okx-defi-dex-ranking-favorite:before {
  content: "\e044";
  font-family: dex-ok-dc2c9dc6be
}

.dex-okx-defi-dex-pointer-right {
  --ok-icon-font-family: "dex-ok-dc2c9dc6be"
}

.dex-okx-defi-dex-pointer-right:before {
  content: "\e045";
  font-family: dex-ok-dc2c9dc6be
}

.dex-okx-defi-dex-rate-exchange {
  --ok-icon-font-family: "dex-ok-dc2c9dc6be"
}

.dex-okx-defi-dex-rate-exchange:before {
  content: "\e046";
  font-family: dex-ok-dc2c9dc6be
}

.dex-okx-defi-marketplace-facebook {
  --ok-icon-font-family: "dex-ok-dc2c9dc6be"
}

.dex-okx-defi-marketplace-facebook:before {
  content: "\e047";
  font-family: dex-ok-dc2c9dc6be
}

.dex-okx-defi-dex-risky-svg {
  --ok-icon-font-family: "dex-ok-dc2c9dc6be"
}

.dex-okx-defi-dex-risky-svg:before {
  content: "\e048";
  font-family: dex-ok-dc2c9dc6be
}

.dex-okx-defi-dex-rout {
  --ok-icon-font-family: "dex-ok-dc2c9dc6be"
}

.dex-okx-defi-dex-rout:before {
  content: "\e049";
  font-family: dex-ok-dc2c9dc6be
}

.dex-okx-defi-dex-share {
  --ok-icon-font-family: "dex-ok-dc2c9dc6be"
}

.dex-okx-defi-dex-share:before {
  content: "\e04a";
  font-family: dex-ok-dc2c9dc6be
}

.dex-okx-defi-dex-throw-flowers {
  --ok-icon-font-family: "dex-ok-dc2c9dc6be"
}

.dex-okx-defi-dex-throw-flowers:before {
  content: "\e04b";
  font-family: dex-ok-dc2c9dc6be
}

.dex-okx-defi-marketplace-link {
  --ok-icon-font-family: "dex-ok-dc2c9dc6be"
}

.dex-okx-defi-marketplace-link:before {
  content: "\e04c";
  font-family: dex-ok-dc2c9dc6be
}

.dex-okx-defi-dex-triangle-warning {
  --ok-icon-font-family: "dex-ok-dc2c9dc6be"
}

.dex-okx-defi-dex-triangle-warning:before {
  content: "\e04d";
  font-family: dex-ok-dc2c9dc6be
}

.dex-okx-defi-dex-warning2 {
  --ok-icon-font-family: "dex-ok-dc2c9dc6be"
}

.dex-okx-defi-dex-warning2:before {
  content: "\e04e";
  font-family: dex-ok-dc2c9dc6be
}

.dex-okx-defi-dex-white-paper {
  --ok-icon-font-family: "dex-ok-dc2c9dc6be"
}

.dex-okx-defi-dex-white-paper:before {
  content: "\e04f";
  font-family: dex-ok-dc2c9dc6be
}

.dex-okx-defi-download {
  --ok-icon-font-family: "dex-ok-dc2c9dc6be"
}

.dex-okx-defi-download:before {
  content: "\e050";
  font-family: dex-ok-dc2c9dc6be
}

.dex-okx-defi-marketplace-reviewing {
  --ok-icon-font-family: "dex-ok-dc2c9dc6be"
}

.dex-okx-defi-marketplace-reviewing:before {
  content: "\e051";
  font-family: dex-ok-dc2c9dc6be
}

.dex-okx-defi-fast-withdraw {
  --ok-icon-font-family: "dex-ok-dc2c9dc6be"
}

.dex-okx-defi-fast-withdraw:before {
  content: "\e052";
  font-family: dex-ok-dc2c9dc6be
}

.dex-okx-defi-info {
  --ok-icon-font-family: "dex-ok-dc2c9dc6be"
}

.dex-okx-defi-info:before {
  content: "\e053";
  font-family: dex-ok-dc2c9dc6be
}

.dex-okx-defi-link {
  --ok-icon-font-family: "dex-ok-dc2c9dc6be"
}

.dex-okx-defi-link:before {
  content: "\e054";
  font-family: dex-ok-dc2c9dc6be
}

.dex-okx-defi-marketplace-cart {
  --ok-icon-font-family: "dex-ok-dc2c9dc6be"
}

.dex-okx-defi-marketplace-cart:before {
  content: "\e055";
  font-family: dex-ok-dc2c9dc6be
}

.dex-okx-defi-marketplace-copy {
  --ok-icon-font-family: "dex-ok-dc2c9dc6be"
}

.dex-okx-defi-marketplace-copy:before {
  content: "\e056";
  font-family: dex-ok-dc2c9dc6be
}

.dex-okx-defi-marketplace-discord {
  --ok-icon-font-family: "dex-ok-dc2c9dc6be"
}

.dex-okx-defi-marketplace-discord:before {
  content: "\e057";
  font-family: dex-ok-dc2c9dc6be
}

.dex-okx-defi-marketplace-fav {
  --ok-icon-font-family: "dex-ok-dc2c9dc6be"
}

.dex-okx-defi-marketplace-fav:before {
  content: "\e058";
  font-family: dex-ok-dc2c9dc6be
}

.dex-okx-defi-marketplace-information-filled {
  --ok-icon-font-family: "dex-ok-dc2c9dc6be"
}

.dex-okx-defi-marketplace-information-filled:before {
  content: "\e059";
  font-family: dex-ok-dc2c9dc6be
}

.dex-okx-defi-marketplace-instagram {
  --ok-icon-font-family: "dex-ok-dc2c9dc6be"
}

.dex-okx-defi-marketplace-instagram:before {
  content: "\e05a";
  font-family: dex-ok-dc2c9dc6be
}

.dex-okx-defi-marketplace-list {
  --ok-icon-font-family: "dex-ok-dc2c9dc6be"
}

.dex-okx-defi-marketplace-list:before {
  content: "\e05b";
  font-family: dex-ok-dc2c9dc6be
}

.dex-okx-defi-nft-amount {
  --ok-icon-font-family: "dex-ok-dc2c9dc6be"
}

.dex-okx-defi-nft-amount:before {
  content: "\e05c";
  font-family: dex-ok-dc2c9dc6be
}

.dex-okx-defi-nft-arrow-chevrons {
  --ok-icon-font-family: "dex-ok-dc2c9dc6be"
}

.dex-okx-defi-nft-arrow-chevrons:before {
  content: "\e05d";
  font-family: dex-ok-dc2c9dc6be
}

.dex-okx-defi-nft-arrow-pointer {
  --ok-icon-font-family: "dex-ok-dc2c9dc6be"
}

.dex-okx-defi-nft-arrow-pointer:before {
  content: "\e05e";
  font-family: dex-ok-dc2c9dc6be
}

.dex-okx-defi-nft-bid {
  --ok-icon-font-family: "dex-ok-dc2c9dc6be"
}

.dex-okx-defi-nft-bid:before {
  content: "\e05f";
  font-family: dex-ok-dc2c9dc6be
}

.dex-okx-defi-nft-cart-check {
  --ok-icon-font-family: "dex-ok-dc2c9dc6be"
}

.dex-okx-defi-nft-cart-check:before {
  content: "\e060";
  font-family: dex-ok-dc2c9dc6be
}

.dex-okx-defi-nft-cart-default {
  --ok-icon-font-family: "dex-ok-dc2c9dc6be"
}

.dex-okx-defi-nft-cart-default:before {
  content: "\e061";
  font-family: dex-ok-dc2c9dc6be
}

.dex-okx-defi-nft-cart-wc {
  --ok-icon-font-family: "dex-ok-dc2c9dc6be"
}

.dex-okx-defi-nft-cart-wc:before {
  content: "\e062";
  font-family: dex-ok-dc2c9dc6be
}

.dex-okx-defi-nft-collection {
  --ok-icon-font-family: "dex-ok-dc2c9dc6be"
}

.dex-okx-defi-nft-collection:before {
  content: "\e063";
  font-family: dex-ok-dc2c9dc6be
}

.dex-okx-defi-nft-creat-mint {
  --ok-icon-font-family: "dex-ok-dc2c9dc6be"
}

.dex-okx-defi-nft-creat-mint:before {
  content: "\e064";
  font-family: dex-ok-dc2c9dc6be
}

.dex-okx-defi-marketplace-medium {
  --ok-icon-font-family: "dex-ok-dc2c9dc6be"
}

.dex-okx-defi-marketplace-medium:before {
  content: "\e065";
  font-family: dex-ok-dc2c9dc6be
}

.dex-okx-defi-marketplace-recursive {
  --ok-icon-font-family: "dex-ok-dc2c9dc6be"
}

.dex-okx-defi-marketplace-recursive:before {
  content: "\e066";
  font-family: dex-ok-dc2c9dc6be
}

.dex-okx-defi-marketplace-star {
  --ok-icon-font-family: "dex-ok-dc2c9dc6be"
}

.dex-okx-defi-marketplace-star:before {
  content: "\e067";
  font-family: dex-ok-dc2c9dc6be
}

.dex-okx-defi-marketplace-tele {
  --ok-icon-font-family: "dex-ok-dc2c9dc6be"
}

.dex-okx-defi-marketplace-tele:before {
  content: "\e068";
  font-family: dex-ok-dc2c9dc6be
}

.dex-okx-defi-marketplace-twitter {
  --ok-icon-font-family: "dex-ok-dc2c9dc6be"
}

.dex-okx-defi-marketplace-twitter:before {
  content: "\e069";
  font-family: dex-ok-dc2c9dc6be
}

.dex-okx-defi-marketplace-twitterx {
  --ok-icon-font-family: "dex-ok-dc2c9dc6be"
}

.dex-okx-defi-marketplace-twitterx:before {
  content: "\e06a";
  font-family: dex-ok-dc2c9dc6be
}

.dex-okx-defi-nft-gas-slow {
  --ok-icon-font-family: "dex-ok-dc2c9dc6be"
}

.dex-okx-defi-nft-gas-slow:before {
  content: "\e06b";
  font-family: dex-ok-dc2c9dc6be
}

.dex-okx-defi-nft-gas-fast {
  --ok-icon-font-family: "dex-ok-dc2c9dc6be"
}

.dex-okx-defi-nft-gas-fast:before {
  content: "\e06c";
  font-family: dex-ok-dc2c9dc6be
}

.dex-okx-defi-marketplace-web {
  --ok-icon-font-family: "dex-ok-dc2c9dc6be"
}

.dex-okx-defi-marketplace-web:before {
  content: "\e06d";
  font-family: dex-ok-dc2c9dc6be
}

.dex-okx-defi-nft-going-solid {
  --ok-icon-font-family: "dex-ok-dc2c9dc6be"
}

.dex-okx-defi-nft-going-solid:before {
  content: "\e06e";
  font-family: dex-ok-dc2c9dc6be
}

.dex-okx-defi-nft-gas-standard {
  --ok-icon-font-family: "dex-ok-dc2c9dc6be"
}

.dex-okx-defi-nft-gas-standard:before {
  content: "\e06f";
  font-family: dex-ok-dc2c9dc6be
}

.dex-okx-defi-nft-information-circle {
  --ok-icon-font-family: "dex-ok-dc2c9dc6be"
}

.dex-okx-defi-nft-information-circle:before {
  content: "\e070";
  font-family: dex-ok-dc2c9dc6be
}

.dex-okx-defi-nft-going {
  --ok-icon-font-family: "dex-ok-dc2c9dc6be"
}

.dex-okx-defi-nft-going:before {
  content: "\e071";
  font-family: dex-ok-dc2c9dc6be
}

.dex-okx-defi-nft-list {
  --ok-icon-font-family: "dex-ok-dc2c9dc6be"
}

.dex-okx-defi-nft-list:before {
  content: "\e072";
  font-family: dex-ok-dc2c9dc6be
}

.dex-okx-defi-nft-items {
  --ok-icon-font-family: "dex-ok-dc2c9dc6be"
}

.dex-okx-defi-nft-items:before {
  content: "\e073";
  font-family: dex-ok-dc2c9dc6be
}

.dex-okx-defi-nft-activity {
  --ok-icon-font-family: "dex-ok-dc2c9dc6be"
}

.dex-okx-defi-nft-activity:before {
  content: "\e074";
  font-family: dex-ok-dc2c9dc6be
}

.dex-okx-defi-nft-brush {
  --ok-icon-font-family: "dex-ok-dc2c9dc6be"
}

.dex-okx-defi-nft-brush:before {
  content: "\e075";
  font-family: dex-ok-dc2c9dc6be
}

.dex-okx-defi-nft-coin {
  --ok-icon-font-family: "dex-ok-dc2c9dc6be"
}

.dex-okx-defi-nft-coin:before {
  content: "\e076";
  font-family: dex-ok-dc2c9dc6be
}

.dex-okx-defi-nft-listnft {
  --ok-icon-font-family: "dex-ok-dc2c9dc6be"
}

.dex-okx-defi-nft-listnft:before {
  content: "\e077";
  font-family: dex-ok-dc2c9dc6be
}

.dex-okx-defi-nft-create {
  --ok-icon-font-family: "dex-ok-dc2c9dc6be"
}

.dex-okx-defi-nft-create:before {
  content: "\e078";
  font-family: dex-ok-dc2c9dc6be
}

.dex-okx-defi-nft-destroy {
  --ok-icon-font-family: "dex-ok-dc2c9dc6be"
}

.dex-okx-defi-nft-destroy:before {
  content: "\e079";
  font-family: dex-ok-dc2c9dc6be
}

.dex-okx-defi-nft-nav-profile {
  --ok-icon-font-family: "dex-ok-dc2c9dc6be"
}

.dex-okx-defi-nft-nav-profile:before {
  content: "\e07a";
  font-family: dex-ok-dc2c9dc6be
}

.dex-okx-defi-nft-download {
  --ok-icon-font-family: "dex-ok-dc2c9dc6be"
}

.dex-okx-defi-nft-download:before {
  content: "\e07b";
  font-family: dex-ok-dc2c9dc6be
}

.dex-okx-defi-nft-phone {
  --ok-icon-font-family: "dex-ok-dc2c9dc6be"
}

.dex-okx-defi-nft-phone:before {
  content: "\e07c";
  font-family: dex-ok-dc2c9dc6be
}

.dex-okx-defi-nft-number {
  --ok-icon-font-family: "dex-ok-dc2c9dc6be"
}

.dex-okx-defi-nft-number:before {
  content: "\e07d";
  font-family: dex-ok-dc2c9dc6be
}

.dex-okx-defi-nft-drop {
  --ok-icon-font-family: "dex-ok-dc2c9dc6be"
}

.dex-okx-defi-nft-drop:before {
  content: "\e07e";
  font-family: dex-ok-dc2c9dc6be
}

.dex-okx-defi-nft-edit {
  --ok-icon-font-family: "dex-ok-dc2c9dc6be"
}

.dex-okx-defi-nft-edit:before {
  content: "\e07f";
  font-family: dex-ok-dc2c9dc6be
}

.dex-okx-defi-nft-featured {
  --ok-icon-font-family: "dex-ok-dc2c9dc6be"
}

.dex-okx-defi-nft-featured:before {
  content: "\e080";
  font-family: dex-ok-dc2c9dc6be
}

.dex-okx-defi-nft-filter-chevrons {
  --ok-icon-font-family: "dex-ok-dc2c9dc6be"
}

.dex-okx-defi-nft-filter-chevrons:before {
  content: "\e081";
  font-family: dex-ok-dc2c9dc6be
}

.dex-okx-defi-nft-filter-refresh {
  --ok-icon-font-family: "dex-ok-dc2c9dc6be"
}

.dex-okx-defi-nft-filter-refresh:before {
  content: "\e082";
  font-family: dex-ok-dc2c9dc6be
}

.dex-okx-defi-nft-filter-arrow {
  --ok-icon-font-family: "dex-ok-dc2c9dc6be"
}

.dex-okx-defi-nft-filter-arrow:before {
  content: "\e083";
  font-family: dex-ok-dc2c9dc6be
}

.dex-okx-defi-nft-funding {
  --ok-icon-font-family: "dex-ok-dc2c9dc6be"
}

.dex-okx-defi-nft-funding:before {
  content: "\e084";
  font-family: dex-ok-dc2c9dc6be
}

.dex-okx-defi-nft-gas-custom {
  --ok-icon-font-family: "dex-ok-dc2c9dc6be"
}

.dex-okx-defi-nft-gas-custom:before {
  content: "\e085";
  font-family: dex-ok-dc2c9dc6be
}

.dex-okx-defi-nft-filter {
  --ok-icon-font-family: "dex-ok-dc2c9dc6be"
}

.dex-okx-defi-nft-filter:before {
  content: "\e086";
  font-family: dex-ok-dc2c9dc6be
}

.dex-okx-defi-nft-location {
  --ok-icon-font-family: "dex-ok-dc2c9dc6be"
}

.dex-okx-defi-nft-location:before {
  content: "\e087";
  font-family: dex-ok-dc2c9dc6be
}

.dex-okx-defi-nft-mail {
  --ok-icon-font-family: "dex-ok-dc2c9dc6be"
}

.dex-okx-defi-nft-mail:before {
  content: "\e088";
  font-family: dex-ok-dc2c9dc6be
}

.dex-okx-defi-nft-nav-cart {
  --ok-icon-font-family: "dex-ok-dc2c9dc6be"
}

.dex-okx-defi-nft-nav-cart:before {
  content: "\e089";
  font-family: dex-ok-dc2c9dc6be
}

.dex-okx-defi-nft-more {
  --ok-icon-font-family: "dex-ok-dc2c9dc6be"
}

.dex-okx-defi-nft-more:before {
  content: "\e08a";
  font-family: dex-ok-dc2c9dc6be
}

.dex-okx-defi-nft-nav-favorites {
  --ok-icon-font-family: "dex-ok-dc2c9dc6be"
}

.dex-okx-defi-nft-nav-favorites:before {
  content: "\e08b";
  font-family: dex-ok-dc2c9dc6be
}

.dex-okx-defi-nft-overview {
  --ok-icon-font-family: "dex-ok-dc2c9dc6be"
}

.dex-okx-defi-nft-overview:before {
  content: "\e08c";
  font-family: dex-ok-dc2c9dc6be
}

.dex-okx-defi-nft-plus {
  --ok-icon-font-family: "dex-ok-dc2c9dc6be"
}

.dex-okx-defi-nft-plus:before {
  content: "\e08d";
  font-family: dex-ok-dc2c9dc6be
}

.dex-okx-defi-nft-purchase {
  --ok-icon-font-family: "dex-ok-dc2c9dc6be"
}

.dex-okx-defi-nft-purchase:before {
  content: "\e08e";
  font-family: dex-ok-dc2c9dc6be
}

.dex-okx-defi-nft-ranking {
  --ok-icon-font-family: "dex-ok-dc2c9dc6be"
}

.dex-okx-defi-nft-ranking:before {
  content: "\e08f";
  font-family: dex-ok-dc2c9dc6be
}

.dex-okx-defi-nft-rankings {
  --ok-icon-font-family: "dex-ok-dc2c9dc6be"
}

.dex-okx-defi-nft-rankings:before {
  content: "\e090";
  font-family: dex-ok-dc2c9dc6be
}

.dex-okx-defi-okbc-community3 {
  --ok-icon-font-family: "dex-ok-dc2c9dc6be"
}

.dex-okx-defi-okbc-community3:before {
  content: "\e091";
  font-family: dex-ok-dc2c9dc6be
}

.dex-okx-defi-nft-refresh {
  --ok-icon-font-family: "dex-ok-dc2c9dc6be"
}

.dex-okx-defi-nft-refresh:before {
  content: "\e092";
  font-family: dex-ok-dc2c9dc6be
}

.dex-okx-defi-nft-rewards {
  --ok-icon-font-family: "dex-ok-dc2c9dc6be"
}

.dex-okx-defi-nft-rewards:before {
  content: "\e093";
  font-family: dex-ok-dc2c9dc6be
}

.dex-okx-defi-nft-share {
  --ok-icon-font-family: "dex-ok-dc2c9dc6be"
}

.dex-okx-defi-nft-share:before {
  content: "\e094";
  font-family: dex-ok-dc2c9dc6be
}

.dex-okx-defi-nft-selected {
  --ok-icon-font-family: "dex-ok-dc2c9dc6be"
}

.dex-okx-defi-nft-selected:before {
  content: "\e095";
  font-family: dex-ok-dc2c9dc6be
}

.dex-okx-defi-nft-ticket {
  --ok-icon-font-family: "dex-ok-dc2c9dc6be"
}

.dex-okx-defi-nft-ticket:before {
  content: "\e096";
  font-family: dex-ok-dc2c9dc6be
}

.dex-okx-defi-nft-switch {
  --ok-icon-font-family: "dex-ok-dc2c9dc6be"
}

.dex-okx-defi-nft-switch:before {
  content: "\e097";
  font-family: dex-ok-dc2c9dc6be
}

.dex-okx-defi-okbc-bitcoin {
  --ok-icon-font-family: "dex-ok-dc2c9dc6be"
}

.dex-okx-defi-okbc-bitcoin:before {
  content: "\e098";
  font-family: dex-ok-dc2c9dc6be
}

.dex-okx-defi-nft-trade {
  --ok-icon-font-family: "dex-ok-dc2c9dc6be"
}

.dex-okx-defi-nft-trade:before {
  content: "\e099";
  font-family: dex-ok-dc2c9dc6be
}

.dex-okx-defi-nft-transfer {
  --ok-icon-font-family: "dex-ok-dc2c9dc6be"
}

.dex-okx-defi-nft-transfer:before {
  content: "\e09a";
  font-family: dex-ok-dc2c9dc6be
}

.dex-okx-defi-nft-twitter3 {
  --ok-icon-font-family: "dex-ok-dc2c9dc6be"
}

.dex-okx-defi-nft-twitter3:before {
  content: "\e09b";
  font-family: dex-ok-dc2c9dc6be
}

.dex-okx-defi-okbc-get {
  --ok-icon-font-family: "dex-ok-dc2c9dc6be"
}

.dex-okx-defi-okbc-get:before {
  content: "\e09c";
  font-family: dex-ok-dc2c9dc6be
}

.dex-okx-defi-okbc-marketplace {
  --ok-icon-font-family: "dex-ok-dc2c9dc6be"
}

.dex-okx-defi-okbc-marketplace:before {
  content: "\e09d";
  font-family: dex-ok-dc2c9dc6be
}

.dex-okx-defi-nft-unbrush {
  --ok-icon-font-family: "dex-ok-dc2c9dc6be"
}

.dex-okx-defi-nft-unbrush:before {
  content: "\e09e";
  font-family: dex-ok-dc2c9dc6be
}

.dex-okx-defi-nft-withdraw {
  --ok-icon-font-family: "dex-ok-dc2c9dc6be"
}

.dex-okx-defi-nft-withdraw:before {
  content: "\e09f";
  font-family: dex-ok-dc2c9dc6be
}

.dex-okx-defi-okbc-arrow {
  --ok-icon-font-family: "dex-ok-dc2c9dc6be"
}

.dex-okx-defi-okbc-arrow:before {
  content: "\e0a0";
  font-family: dex-ok-dc2c9dc6be
}

.dex-okx-defi-okbc-build {
  --ok-icon-font-family: "dex-ok-dc2c9dc6be"
}

.dex-okx-defi-okbc-build:before {
  content: "\e0a1";
  font-family: dex-ok-dc2c9dc6be
}

.dex-okx-defi-okbc-community {
  --ok-icon-font-family: "dex-ok-dc2c9dc6be"
}

.dex-okx-defi-okbc-community:before {
  content: "\e0a2";
  font-family: dex-ok-dc2c9dc6be
}

.dex-okx-defi-nft-unfavorite {
  --ok-icon-font-family: "dex-ok-dc2c9dc6be"
}

.dex-okx-defi-nft-unfavorite:before {
  content: "\e0a3";
  font-family: dex-ok-dc2c9dc6be
}

.dex-okx-defi-okbc-community4 {
  --ok-icon-font-family: "dex-ok-dc2c9dc6be"
}

.dex-okx-defi-okbc-community4:before {
  content: "\e0a4";
  font-family: dex-ok-dc2c9dc6be
}

.dex-okx-defi-okbc-community2 {
  --ok-icon-font-family: "dex-ok-dc2c9dc6be"
}

.dex-okx-defi-okbc-community2:before {
  content: "\e0a5";
  font-family: dex-ok-dc2c9dc6be
}

.dex-okx-defi-okc-bridge {
  --ok-icon-font-family: "dex-ok-dc2c9dc6be"
}

.dex-okx-defi-okc-bridge:before {
  content: "\e0a6";
  font-family: dex-ok-dc2c9dc6be
}

.dex-okx-defi-okbc-overview {
  --ok-icon-font-family: "dex-ok-dc2c9dc6be"
}

.dex-okx-defi-okbc-overview:before {
  content: "\e0a7";
  font-family: dex-ok-dc2c9dc6be
}

.dex-okx-defi-okbc-scalability {
  --ok-icon-font-family: "dex-ok-dc2c9dc6be"
}

.dex-okx-defi-okbc-scalability:before {
  content: "\e0a8";
  font-family: dex-ok-dc2c9dc6be
}

.dex-okx-defi-okc-btc {
  --ok-icon-font-family: "dex-ok-dc2c9dc6be"
}

.dex-okx-defi-okc-btc:before {
  content: "\e0a9";
  font-family: dex-ok-dc2c9dc6be
}

.dex-okx-defi-okc-chat {
  --ok-icon-font-family: "dex-ok-dc2c9dc6be"
}

.dex-okx-defi-okc-chat:before {
  content: "\e0aa";
  font-family: dex-ok-dc2c9dc6be
}

.dex-okx-defi-okbc-deploy {
  --ok-icon-font-family: "dex-ok-dc2c9dc6be"
}

.dex-okx-defi-okbc-deploy:before {
  content: "\e0ab";
  font-family: dex-ok-dc2c9dc6be
}

.dex-okx-defi-okc-delete {
  --ok-icon-font-family: "dex-ok-dc2c9dc6be"
}

.dex-okx-defi-okc-delete:before {
  content: "\e0ac";
  font-family: dex-ok-dc2c9dc6be
}

.dex-okx-defi-okbc-dexapi {
  --ok-icon-font-family: "dex-ok-dc2c9dc6be"
}

.dex-okx-defi-okbc-dexapi:before {
  content: "\e0ad";
  font-family: dex-ok-dc2c9dc6be
}

.dex-okx-defi-nft-unselect {
  --ok-icon-font-family: "dex-ok-dc2c9dc6be"
}

.dex-okx-defi-nft-unselect:before {
  content: "\e0ae";
  font-family: dex-ok-dc2c9dc6be
}

.dex-okx-defi-nft-wechat {
  --ok-icon-font-family: "dex-ok-dc2c9dc6be"
}

.dex-okx-defi-nft-wechat:before {
  content: "\e0af";
  font-family: dex-ok-dc2c9dc6be
}

.dex-okx-defi-okbc-community1 {
  --ok-icon-font-family: "dex-ok-dc2c9dc6be"
}

.dex-okx-defi-okbc-community1:before {
  content: "\e0b0";
  font-family: dex-ok-dc2c9dc6be
}

.dex-okx-defi-okbc-email {
  --ok-icon-font-family: "dex-ok-dc2c9dc6be"
}

.dex-okx-defi-okbc-email:before {
  content: "\e0b1";
  font-family: dex-ok-dc2c9dc6be
}

.dex-okx-defi-okc-editor {
  --ok-icon-font-family: "dex-ok-dc2c9dc6be"
}

.dex-okx-defi-okc-editor:before {
  content: "\e0b2";
  font-family: dex-ok-dc2c9dc6be
}

.dex-okx-defi-okbc-operates {
  --ok-icon-font-family: "dex-ok-dc2c9dc6be"
}

.dex-okx-defi-okbc-operates:before {
  content: "\e0b3";
  font-family: dex-ok-dc2c9dc6be
}

.dex-okx-defi-okc-loading-2 {
  --ok-icon-font-family: "dex-ok-dc2c9dc6be"
}

.dex-okx-defi-okc-loading-2:before {
  content: "\e0b4";
  font-family: dex-ok-dc2c9dc6be
}

.dex-okx-defi-okbc-powered {
  --ok-icon-font-family: "dex-ok-dc2c9dc6be"
}

.dex-okx-defi-okbc-powered:before {
  content: "\e0b5";
  font-family: dex-ok-dc2c9dc6be
}

.dex-okx-defi-okbc-resources {
  --ok-icon-font-family: "dex-ok-dc2c9dc6be"
}

.dex-okx-defi-okbc-resources:before {
  content: "\e0b6";
  font-family: dex-ok-dc2c9dc6be
}

.dex-okx-defi-okbc-wallet {
  --ok-icon-font-family: "dex-ok-dc2c9dc6be"
}

.dex-okx-defi-okbc-wallet:before {
  content: "\e0b7";
  font-family: dex-ok-dc2c9dc6be
}

.dex-okx-defi-okc-medium {
  --ok-icon-font-family: "dex-ok-dc2c9dc6be"
}

.dex-okx-defi-okc-medium:before {
  content: "\e0b8";
  font-family: dex-ok-dc2c9dc6be
}

.dex-okx-defi-okbc-wasm {
  --ok-icon-font-family: "dex-ok-dc2c9dc6be"
}

.dex-okx-defi-okbc-wasm:before {
  content: "\e0b9";
  font-family: dex-ok-dc2c9dc6be
}

.dex-okx-defi-okc-block {
  --ok-icon-font-family: "dex-ok-dc2c9dc6be"
}

.dex-okx-defi-okc-block:before {
  content: "\e0ba";
  font-family: dex-ok-dc2c9dc6be
}

.dex-okx-defi-okc-cart {
  --ok-icon-font-family: "dex-ok-dc2c9dc6be"
}

.dex-okx-defi-okc-cart:before {
  content: "\e0bb";
  font-family: dex-ok-dc2c9dc6be
}

.dex-okx-defi-okc-nft-transfer {
  --ok-icon-font-family: "dex-ok-dc2c9dc6be"
}

.dex-okx-defi-okc-nft-transfer:before {
  content: "\e0bc";
  font-family: dex-ok-dc2c9dc6be
}

.dex-okx-defi-okc-data {
  --ok-icon-font-family: "dex-ok-dc2c9dc6be"
}

.dex-okx-defi-okc-data:before {
  content: "\e0bd";
  font-family: dex-ok-dc2c9dc6be
}

.dex-okx-defi-okc-faucet {
  --ok-icon-font-family: "dex-ok-dc2c9dc6be"
}

.dex-okx-defi-okc-faucet:before {
  content: "\e0be";
  font-family: dex-ok-dc2c9dc6be
}

.dex-okx-defi-okc-details {
  --ok-icon-font-family: "dex-ok-dc2c9dc6be"
}

.dex-okx-defi-okc-details:before {
  content: "\e0bf";
  font-family: dex-ok-dc2c9dc6be
}

.dex-okx-defi-okc-discord {
  --ok-icon-font-family: "dex-ok-dc2c9dc6be"
}

.dex-okx-defi-okc-discord:before {
  content: "\e0c0";
  font-family: dex-ok-dc2c9dc6be
}

.dex-okx-defi-okc-history {
  --ok-icon-font-family: "dex-ok-dc2c9dc6be"
}

.dex-okx-defi-okc-history:before {
  content: "\e0c1";
  font-family: dex-ok-dc2c9dc6be
}

.dex-okx-defi-okc-remove {
  --ok-icon-font-family: "dex-ok-dc2c9dc6be"
}

.dex-okx-defi-okc-remove:before {
  content: "\e0c2";
  font-family: dex-ok-dc2c9dc6be
}

.dex-okx-defi-okc-down {
  --ok-icon-font-family: "dex-ok-dc2c9dc6be"
}

.dex-okx-defi-okc-down:before {
  content: "\e0c3";
  font-family: dex-ok-dc2c9dc6be
}

.dex-okx-defi-okc-pause {
  --ok-icon-font-family: "dex-ok-dc2c9dc6be"
}

.dex-okx-defi-okc-pause:before {
  content: "\e0c4";
  font-family: dex-ok-dc2c9dc6be
}

.dex-okx-defi-okc-drawback {
  --ok-icon-font-family: "dex-ok-dc2c9dc6be"
}

.dex-okx-defi-okc-drawback:before {
  content: "\e0c5";
  font-family: dex-ok-dc2c9dc6be
}

.dex-okx-defi-okc-switch {
  --ok-icon-font-family: "dex-ok-dc2c9dc6be"
}

.dex-okx-defi-okc-switch:before {
  content: "\e0c6";
  font-family: dex-ok-dc2c9dc6be
}

.dex-okx-defi-okc-draw {
  --ok-icon-font-family: "dex-ok-dc2c9dc6be"
}

.dex-okx-defi-okc-draw:before {
  content: "\e0c7";
  font-family: dex-ok-dc2c9dc6be
}

.dex-okx-defi-okc-play {
  --ok-icon-font-family: "dex-ok-dc2c9dc6be"
}

.dex-okx-defi-okc-play:before {
  content: "\e0c8";
  font-family: dex-ok-dc2c9dc6be
}

.dex-okx-defi-okc-email {
  --ok-icon-font-family: "dex-ok-dc2c9dc6be"
}

.dex-okx-defi-okc-email:before {
  content: "\e0c9";
  font-family: dex-ok-dc2c9dc6be
}

.dex-okx-defi-okc-download {
  --ok-icon-font-family: "dex-ok-dc2c9dc6be"
}

.dex-okx-defi-okc-download:before {
  content: "\e0ca";
  font-family: dex-ok-dc2c9dc6be
}

.dex-okx-defi-okc-tf-balance {
  --ok-icon-font-family: "dex-ok-dc2c9dc6be"
}

.dex-okx-defi-okc-tf-balance:before {
  content: "\e0cb";
  font-family: dex-ok-dc2c9dc6be
}

.dex-okx-defi-okc-exchange {
  --ok-icon-font-family: "dex-ok-dc2c9dc6be"
}

.dex-okx-defi-okc-exchange:before {
  content: "\e0cc";
  font-family: dex-ok-dc2c9dc6be
}

.dex-okx-defi-okc-trends {
  --ok-icon-font-family: "dex-ok-dc2c9dc6be"
}

.dex-okx-defi-okc-trends:before {
  content: "\e0cd";
  font-family: dex-ok-dc2c9dc6be
}

.dex-okx-defi-okc-twitter {
  --ok-icon-font-family: "dex-ok-dc2c9dc6be"
}

.dex-okx-defi-okc-twitter:before {
  content: "\e0ce";
  font-family: dex-ok-dc2c9dc6be
}

.dex-okx-defi-okc-website {
  --ok-icon-font-family: "dex-ok-dc2c9dc6be"
}

.dex-okx-defi-okc-website:before {
  content: "\e0cf";
  font-family: dex-ok-dc2c9dc6be
}

.dex-okx-defi-okc-yoursite {
  --ok-icon-font-family: "dex-ok-dc2c9dc6be"
}

.dex-okx-defi-okc-yoursite:before {
  content: "\e0d0";
  font-family: dex-ok-dc2c9dc6be
}

.dex-okx-defi-okc-up {
  --ok-icon-font-family: "dex-ok-dc2c9dc6be"
}

.dex-okx-defi-okc-up:before {
  content: "\e0d1";
  font-family: dex-ok-dc2c9dc6be
}

.dex-okx-defi-okc-zap-swap {
  --ok-icon-font-family: "dex-ok-dc2c9dc6be"
}

.dex-okx-defi-okc-zap-swap:before {
  content: "\e0d2";
  font-family: dex-ok-dc2c9dc6be
}

.dex-okx-defi-oktc-autopilot {
  --ok-icon-font-family: "dex-ok-dc2c9dc6be"
}

.dex-okx-defi-oktc-autopilot:before {
  content: "\e0d3";
  font-family: dex-ok-dc2c9dc6be
}

.dex-okx-defi-okc-zap {
  --ok-icon-font-family: "dex-ok-dc2c9dc6be"
}

.dex-okx-defi-okc-zap:before {
  content: "\e0d4";
  font-family: dex-ok-dc2c9dc6be
}

.dex-okx-defi-oktc-dawn {
  --ok-icon-font-family: "dex-ok-dc2c9dc6be"
}

.dex-okx-defi-oktc-dawn:before {
  content: "\e0d5";
  font-family: dex-ok-dc2c9dc6be
}

.dex-okx-defi-oktc-sidenets {
  --ok-icon-font-family: "dex-ok-dc2c9dc6be"
}

.dex-okx-defi-oktc-sidenets:before {
  content: "\e0d6";
  font-family: dex-ok-dc2c9dc6be
}

.dex-okx-defi-oktc-thunderbolt {
  --ok-icon-font-family: "dex-ok-dc2c9dc6be"
}

.dex-okx-defi-oktc-thunderbolt:before {
  content: "\e0d7";
  font-family: dex-ok-dc2c9dc6be
}

.dex-okx-defi-oktc-wasm {
  --ok-icon-font-family: "dex-ok-dc2c9dc6be"
}

.dex-okx-defi-oktc-wasm:before {
  content: "\e0d8";
  font-family: dex-ok-dc2c9dc6be
}

.dex-okx-defi-oktc-trinity {
  --ok-icon-font-family: "dex-ok-dc2c9dc6be"
}

.dex-okx-defi-oktc-trinity:before {
  content: "\e0d9";
  font-family: dex-ok-dc2c9dc6be
}

.dex-okx-defi-oktc-zkevm {
  --ok-icon-font-family: "dex-ok-dc2c9dc6be"
}

.dex-okx-defi-oktc-zkevm:before {
  content: "\e0da";
  font-family: dex-ok-dc2c9dc6be
}

.dex-okx-defi-open-link {
  --ok-icon-font-family: "dex-ok-dc2c9dc6be"
}

.dex-okx-defi-open-link:before {
  content: "\e0db";
  font-family: dex-ok-dc2c9dc6be
}

.dex-okx-defi-okc-judgerules {
  --ok-icon-font-family: "dex-ok-dc2c9dc6be"
}

.dex-okx-defi-okc-judgerules:before {
  content: "\e0dc";
  font-family: dex-ok-dc2c9dc6be
}

.dex-okx-defi-share {
  --ok-icon-font-family: "dex-ok-dc2c9dc6be"
}

.dex-okx-defi-share:before {
  content: "\e0dd";
  font-family: dex-ok-dc2c9dc6be
}

.dex-okx-defi-status-alert {
  --ok-icon-font-family: "dex-ok-dc2c9dc6be"
}

.dex-okx-defi-status-alert:before {
  content: "\e0de";
  font-family: dex-ok-dc2c9dc6be
}

.dex-okx-defi-okc-loading {
  --ok-icon-font-family: "dex-ok-dc2c9dc6be"
}

.dex-okx-defi-okc-loading:before {
  content: "\e0df";
  font-family: dex-ok-dc2c9dc6be
}

.dex-okx-defi-status-waiting {
  --ok-icon-font-family: "dex-ok-dc2c9dc6be"
}

.dex-okx-defi-status-waiting:before {
  content: "\e0e0";
  font-family: dex-ok-dc2c9dc6be
}

.dex-okx-defi-status-filled {
  --ok-icon-font-family: "dex-ok-dc2c9dc6be"
}

.dex-okx-defi-status-filled:before {
  content: "\e0e1";
  font-family: dex-ok-dc2c9dc6be
}

.dex-okx-defi-steps-1 {
  --ok-icon-font-family: "dex-ok-dc2c9dc6be"
}

.dex-okx-defi-steps-1:before {
  content: "\e0e2";
  font-family: dex-ok-dc2c9dc6be
}

.dex-okx-defi-steps-2 {
  --ok-icon-font-family: "dex-ok-dc2c9dc6be"
}

.dex-okx-defi-steps-2:before {
  content: "\e0e3";
  font-family: dex-ok-dc2c9dc6be
}

.dex-okx-defi-steps-3 {
  --ok-icon-font-family: "dex-ok-dc2c9dc6be"
}

.dex-okx-defi-steps-3:before {
  content: "\e0e4";
  font-family: dex-ok-dc2c9dc6be
}

.dex-okx-defi-success-circle {
  --ok-icon-font-family: "dex-ok-dc2c9dc6be"
}

.dex-okx-defi-success-circle:before {
  content: "\e0e5";
  font-family: dex-ok-dc2c9dc6be
}

.dex-okx-defi-transfer-in {
  --ok-icon-font-family: "dex-ok-dc2c9dc6be"
}

.dex-okx-defi-transfer-in:before {
  content: "\e0e6";
  font-family: dex-ok-dc2c9dc6be
}

.dex-okx-defi-withdraw {
  --ok-icon-font-family: "dex-ok-dc2c9dc6be"
}

.dex-okx-defi-withdraw:before {
  content: "\e0e7";
  font-family: dex-ok-dc2c9dc6be
}

.dex-okx-defi-x1-buy-1 {
  --ok-icon-font-family: "dex-ok-dc2c9dc6be"
}

.dex-okx-defi-x1-buy-1:before {
  content: "\e0e8";
  font-family: dex-ok-dc2c9dc6be
}

.dex-okx-defi-x1-liquidity-minus {
  --ok-icon-font-family: "dex-ok-dc2c9dc6be"
}

.dex-okx-defi-x1-liquidity-minus:before {
  content: "\e0e9";
  font-family: dex-ok-dc2c9dc6be
}

.dex-okx-defi-x1-liquidity-plus {
  --ok-icon-font-family: "dex-ok-dc2c9dc6be"
}

.dex-okx-defi-x1-liquidity-plus:before {
  content: "\e0ea";
  font-family: dex-ok-dc2c9dc6be
}

.dex-okx-defi-x1-listforsale {
  --ok-icon-font-family: "dex-ok-dc2c9dc6be"
}

.dex-okx-defi-x1-listforsale:before {
  content: "\e0eb";
  font-family: dex-ok-dc2c9dc6be
}

.dex-okx-defi-x1-subgraph {
  --ok-icon-font-family: "dex-ok-dc2c9dc6be"
}

.dex-okx-defi-x1-subgraph:before {
  content: "\e0ec";
  font-family: dex-ok-dc2c9dc6be
}

.dex-okx-defi-xgon-linkedin-1 {
  --ok-icon-font-family: "dex-ok-dc2c9dc6be"
}

.dex-okx-defi-xgon-linkedin-1:before {
  content: "\e0ed";
  font-family: dex-ok-dc2c9dc6be
}

.dex-okx-defi-yield-android {
  --ok-icon-font-family: "dex-ok-dc2c9dc6be"
}

.dex-okx-defi-yield-android:before {
  content: "\e0ee";
  font-family: dex-ok-dc2c9dc6be
}

.dex-okx-defi-xgon-github-1 {
  --ok-icon-font-family: "dex-ok-dc2c9dc6be"
}

.dex-okx-defi-xgon-github-1:before {
  content: "\e0ef";
  font-family: dex-ok-dc2c9dc6be
}

.dex-okx-defi-yield-apple {
  --ok-icon-font-family: "dex-ok-dc2c9dc6be"
}

.dex-okx-defi-yield-apple:before {
  content: "\e0f0";
  font-family: dex-ok-dc2c9dc6be
}

.dex-okx-defi-okc-instagram {
  --ok-icon-font-family: "dex-ok-dc2c9dc6be"
}

.dex-okx-defi-okc-instagram:before {
  content: "\e0f1";
  font-family: dex-ok-dc2c9dc6be
}

.dex-okx-defi-yield-bonus {
  --ok-icon-font-family: "dex-ok-dc2c9dc6be"
}

.dex-okx-defi-yield-bonus:before {
  content: "\e0f2";
  font-family: dex-ok-dc2c9dc6be
}

.dex-okx-defi-yield-deploy {
  --ok-icon-font-family: "dex-ok-dc2c9dc6be"
}

.dex-okx-defi-yield-deploy:before {
  content: "\e0f3";
  font-family: dex-ok-dc2c9dc6be
}

.dex-okx-defi-yield-delete {
  --ok-icon-font-family: "dex-ok-dc2c9dc6be"
}

.dex-okx-defi-yield-delete:before {
  content: "\e0f4";
  font-family: dex-ok-dc2c9dc6be
}

.dex-okx-defi-yield-pengding {
  --ok-icon-font-family: "dex-ok-dc2c9dc6be"
}

.dex-okx-defi-yield-pengding:before {
  content: "\e0f5";
  font-family: dex-ok-dc2c9dc6be
}

.dex-okx-defi-yield-zoomout {
  --ok-icon-font-family: "dex-ok-dc2c9dc6be"
}

.dex-okx-defi-yield-zoomout:before {
  content: "\e0f6";
  font-family: dex-ok-dc2c9dc6be
}

.dex-okx-defi-okc-like {
  --ok-icon-font-family: "dex-ok-dc2c9dc6be"
}

.dex-okx-defi-okc-like:before {
  content: "\e0f7";
  font-family: dex-ok-dc2c9dc6be
}

.dex-okx-defi-yield-zoomin {
  --ok-icon-font-family: "dex-ok-dc2c9dc6be"
}

.dex-okx-defi-yield-zoomin:before {
  content: "\e0f8";
  font-family: dex-ok-dc2c9dc6be
}

.dex-okx-defi-okc-explorer {
  --ok-icon-font-family: "dex-ok-dc2c9dc6be"
}

.dex-okx-defi-okc-explorer:before {
  content: "\e0f9";
  font-family: dex-ok-dc2c9dc6be
}

.dex-okx-defi-okc-more {
  --ok-icon-font-family: "dex-ok-dc2c9dc6be"
}

.dex-okx-defi-okc-more:before {
  content: "\e0fa";
  font-family: dex-ok-dc2c9dc6be
}

.dex-okx-defi-okc-nft-youtube {
  --ok-icon-font-family: "dex-ok-dc2c9dc6be"
}

.dex-okx-defi-okc-nft-youtube:before {
  content: "\e0fb";
  font-family: dex-ok-dc2c9dc6be
}

.dex-okx-defi-okc-github {
  --ok-icon-font-family: "dex-ok-dc2c9dc6be"
}

.dex-okx-defi-okc-github:before {
  content: "\e0fc";
  font-family: dex-ok-dc2c9dc6be
}

.dex-okx-defi-okc-refresh {
  --ok-icon-font-family: "dex-ok-dc2c9dc6be"
}

.dex-okx-defi-okc-refresh:before {
  content: "\e0fd";
  font-family: dex-ok-dc2c9dc6be
}

.dex-okx-defi-okc-return {
  --ok-icon-font-family: "dex-ok-dc2c9dc6be"
}

.dex-okx-defi-okc-return:before {
  content: "\e0fe";
  font-family: dex-ok-dc2c9dc6be
}

.dex-okx-defi-okc-telegram {
  --ok-icon-font-family: "dex-ok-dc2c9dc6be"
}

.dex-okx-defi-okc-telegram:before {
  content: "\e0ff";
  font-family: dex-ok-dc2c9dc6be
}

.dex-okx-defi-okc-tf-achievements {
  --ok-icon-font-family: "dex-ok-dc2c9dc6be"
}

.dex-okx-defi-okc-tf-achievements:before {
  content: "\e100";
  font-family: dex-ok-dc2c9dc6be
}

.dex-okx-defi-okc-tf-contract {
  --ok-icon-font-family: "dex-ok-dc2c9dc6be"
}

.dex-okx-defi-okc-tf-contract:before {
  content: "\e101";
  font-family: dex-ok-dc2c9dc6be
}

.dex-okx-defi-okc-tf-height {
  --ok-icon-font-family: "dex-ok-dc2c9dc6be"
}

.dex-okx-defi-okc-tf-height:before {
  content: "\e102";
  font-family: dex-ok-dc2c9dc6be
}

.dex-okx-defi-okc-tf-queue {
  --ok-icon-font-family: "dex-ok-dc2c9dc6be"
}

.dex-okx-defi-okc-tf-queue:before {
  content: "\e103";
  font-family: dex-ok-dc2c9dc6be
}

.iconfont {
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
  font-size: 16px;
  font-style: normal
}

.iconfont:before {
  display: inline-block
}

@font-face {
  font-display: block;
  font-family: dex-ok-dc2c9dc6be;
  font-style: normal;
  src: url(../cd31e232a821a6bb0280.woff2) format("woff2")
}

[dir=rtl] .dex-okx-defi-assets:before,
[dir=rtl] .dex-okx-defi-dex-filter1:before,
[dir=rtl] .dex-okx-defi-dex-filtered1:before,
[dir=rtl] .dex-okx-defi-dex-fireworks-2:before,
[dir=rtl] .dex-okx-defi-nft-cart-wc:before,
[dir=rtl] .dex-okx-defi-nft-gas-fast:before,
[dir=rtl] .dex-okx-defi-nft-nav-cart:before,
[dir=rtl] .dex-okx-defi-nft-share:before,
[dir=rtl] .dex-okx-defi-nft-transfer:before,
[dir=rtl] .dex-okx-defi-okbc-arrow:before,
[dir=rtl] .dex-okx-defi-okbc-get:before,
[dir=rtl] .dex-okx-defi-okc-cart:before,
[dir=rtl] .dex-okx-defi-okc-data:before,
[dir=rtl] .dex-okx-defi-okc-nft-transfer:before,
[dir=rtl] .dex-okx-defi-okc-return:before,
[dir=rtl] .dex-okx-defi-okc-tf-contract:before {
  transform: scaleX(-1)
}

.theme-light .dex-overflowscroll-var,
.theme-light.dex-overflowscroll-var {
  --dex-okd-overflowscroll-icon-color: #929292;
  --dex-okd-overflowscroll-icon-hover-color: #3d3d3d;
  --dex-okd-overflowscroll-icon-bg-start-color: #fff;
  --dex-okd-overflowscroll-icon-bg-end-color: hsla(0, 0%, 100%, 0);
  --dex-okd-overflowscroll-reversed-icon-color: #929292;
  --dex-okd-overflowscroll-reversed-icon-hover-color: #e4e2e2;
  --dex-okd-overflowscroll-reversed-icon-bg-start-color: #000;
  --dex-okd-overflowscroll-reversed-icon-bg-end-color: var(--dex-okd-color-transparent-black)
}

.theme-dark .dex-overflowscroll-var,
.theme-dark.dex-overflowscroll-var {
  --dex-okd-overflowscroll-icon-color: #909090;
  --dex-okd-overflowscroll-icon-hover-color: #3d3d3d;
  --dex-okd-overflowscroll-icon-bg-start-color: var(--dex-okd-color-background-base-primary);
  --dex-okd-overflowscroll-icon-bg-end-color: var(--dex-okd-color-transparent-white);
  --dex-okd-overflowscroll-reversed-icon-color: #929292;
  --dex-okd-overflowscroll-reversed-icon-hover-color: #e4e2e2;
  --dex-okd-overflowscroll-reversed-icon-bg-start-color: #fff;
  --dex-okd-overflowscroll-reversed-icon-bg-end-color: var(--dex-okd-color-transparent-white)
}

.theme-light .dex-upload-var,
.theme-light.dex-upload-var {
  --dex-okd-upload-active-border-color: #0569ff;
  --dex-okd-upload-active-logo-color: #0569ff;
  --dex-okd-upload-active-background-color: rgba(245, 249, 255, .45);
  --dex-okd-upload-active-label-color: #0569ff;
  --dex-okd-upload-error-border-color: var(--dex-okd-color-semantic-negative);
  --dex-okd-upload-error-logo-color: var(--dex-okd-color-semantic-negative);
  --dex-okd-upload-error-background-color: var(--dex-okd-color-transparent-white);
  --dex-okd-upload-error-label-color: var(--dex-okd-color-content-secondary);
  --dex-okd-upload-success-border-color: var(--dex-okd-color-border-primary);
  --dex-okd-upload-success-logo-color: var(--dex-okd-color-semantic-positive);
  --dex-okd-upload-error-retry-text-color: var(--dex-okd-color-content-primary);
  --dex-okd-upload-success-background-color: var(--dex-okd-color-background-surface-primary);
  --dex-okd-upload-pc-label-font-size: var(--dex-okd-font-size-base);
  --dex-okd-upload-pc-label-line-height: var(--dex-okd-line-height-base);
  --dex-okd-upload-pc-desc-font-size: var(--dex-okd-font-size-xs);
  --dex-okd-upload-pc-desc-line-height: var(--dex-okd-line-height-xs);
  --dex-okd-upload-mobile-label-font-size: var(--dex-okd-font-size-md);
  --dex-okd-upload-mobile-label-line-height: var(--dex-okd-line-height-md);
  --dex-okd-upload-mobile-desc-font-size: var(--dex-okd-font-size-md);
  --dex-okd-upload-mobile-desc-line-height: var(--dex-okd-line-height-md);
  --dex-okd-upload-filelist-count-font-size: var(--dex-okd-font-size-base);
  --dex-okd-upload-filelist-count-line-height: var(--dex-okd-line-height-base);
  --dex-okd-upload-file-name-font-size: var(--dex-okd-font-size-md);
  --dex-okd-upload-file-name-line-height: var(--dex-okd-line-height-md);
  --dex-okd-upload-file-desc-font-size: var(--dex-okd-font-size-xs);
  --dex-okd-upload-file-desc-line-height: var(--dex-okd-line-height-xs);
  --dex-okd-upload-text-btn-color: var(--dex-okd-color-content-tertiary);
  --dex-okd-upload-list-font-size: var(--dex-okd-font-size-base);
  --dex-okd-upload-list-line-height: var(--dex-okd-line-height-base);
  --dex-okd-upload-list-color: #000;
  --dex-okd-upload-list-retry-font-size: var(--dex-okd-font-size-md);
  --dex-okd-upload-list-retry-line-height: var(--dex-okd-line-height-md);
  --dex-okd-upload-list-retry-color: #0569ff;
  --dex-okd-upload-list-label-font-size: var(--dex-okd-font-size-md);
  --dex-okd-upload-list-label-line-height: var(--dex-okd-line-height-md);
  --dex-okd-upload-list-desc-font-size: var(--dex-okd-font-size-xs);
  --dex-okd-upload-list-desc-line-height: var(--dex-okd-line-height-xs);
  --dex-okd-upload-list-desc-color: #929292;
  --dex-okd-upload-patch-entry-disabled-background: var(--dex-okd-color-background-surface-primary);
  --dex-okd-upload-patch-item-background: var(--dex-okd-color-background-surface-primary);
  --dex-okd-upload-patch-item-title-color: var(--dex-okd-color-content-secondary);
  --dex-okd-upload-patch-item-desc-color: var(--dex-okd-color-content-disabled);
  --dex-okd-upload-patch-item-error-icon-color: var(--dex-okd-color-semantic-negative);
  --dex-okd-upload-patch-item-error-text-color: var(--dex-okd-color-semantic-negative);
  --dex-okd-upload-patch-item-success-icon-color: var(--dex-okd-color-semantic-positive);
  --dex-okd-upload-patch-item-remove-icon-color: var(--dex-okd-color-content-disabled);
  --dex-okd-upload-patch-item-mobile-remove-icon-color: var(--dex-okd-color-content-disabled);
  --dex-okd-upload-patch-item-retry-text-color: var(--dex-okd-color-content-primary);
  --dex-okd-upload-patch-item-placeholder-icon-color: var(--dex-okd-color-content-disabled);
  --dex-okd-upload-patch-tip-color: var(--dex-okd-color-content-primary);
  --dex-okd-upload-disabled-background: var(--dex-okd-color-background-surface-disable);
  --dex-okd-upload-disabled-border-color: var(--dex-okd-color-border-primary);
  --dex-okd-upload-patch-item-mobile-default-border-color: var(--dex-okd-color-border-primary);
  --dex-okd-upload-patch-item-mobile-active-border-color: var(--dex-okd-color-border-primary);
  --dex-okd-upload-patch-item-mobile-success-border-color: var(--dex-okd-color-border-primary);
  --dex-okd-upload-patch-item-mobile-error-border-color: var(--dex-okd-color-border-primary);
  --dex-okd-upload-default-icon-color: #fff;
  --dex-okd-upload-default-border-color: var(--dex-okd-color-border-secondary);
  --dex-okd-upload-default-logo-color: var(--dex-okd-color-border-secondary);
  --dex-okd-upload-default-background-color: var(--dex-okd-color-transparent-white);
  --dex-okd-upload-default-label-color: var(--dex-okd-color-content-tertiary);
  --dex-okd-upload-default-desc-color: var(--dex-okd-color-content-disabled);
  --dex-okd-upload-disabled-logo-color: var(--dex-okd-upload-default-logo-color);
  --dex-okd-upload-disabled-label-color: var(--dex-okd-upload-default-label-color);
  --dex-okd-upload-disabled-desc-color: var(--dex-okd-upload-default-desc-color)
}

.theme-dark .dex-upload-var,
.theme-dark.dex-upload-var {
  --dex-okd-upload-active-border-color: #1e6bff;
  --dex-okd-upload-active-logo-color: #1e6bff;
  --dex-okd-upload-active-background-color: rgba(5, 23, 56, .45);
  --dex-okd-upload-active-label-color: #1e6bff;
  --dex-okd-upload-error-border-color: var(--dex-okd-color-semantic-negative);
  --dex-okd-upload-error-logo-color: var(--dex-okd-color-semantic-negative);
  --dex-okd-upload-error-background-color: var(--dex-okd-color-transparent-white);
  --dex-okd-upload-error-label-color: var(--dex-okd-color-content-secondary);
  --dex-okd-upload-success-border-color: var(--dex-okd-color-border-primary);
  --dex-okd-upload-success-logo-color: var(--dex-okd-color-semantic-positive);
  --dex-okd-upload-error-retry-text-color: var(--dex-okd-color-content-primary);
  --dex-okd-upload-success-background-color: var(--dex-okd-color-background-surface-primary);
  --dex-okd-upload-pc-label-font-size: var(--dex-okd-font-size-base);
  --dex-okd-upload-pc-label-line-height: var(--dex-okd-line-height-base);
  --dex-okd-upload-pc-desc-font-size: var(--dex-okd-font-size-xs);
  --dex-okd-upload-pc-desc-line-height: var(--dex-okd-line-height-xs);
  --dex-okd-upload-mobile-label-font-size: var(--dex-okd-font-size-md);
  --dex-okd-upload-mobile-label-line-height: var(--dex-okd-line-height-md);
  --dex-okd-upload-mobile-desc-font-size: var(--dex-okd-font-size-md);
  --dex-okd-upload-mobile-desc-line-height: var(--dex-okd-line-height-md);
  --dex-okd-upload-filelist-count-font-size: var(--dex-okd-font-size-base);
  --dex-okd-upload-filelist-count-line-height: var(--dex-okd-line-height-base);
  --dex-okd-upload-file-name-font-size: var(--dex-okd-font-size-md);
  --dex-okd-upload-file-name-line-height: var(--dex-okd-line-height-md);
  --dex-okd-upload-file-desc-font-size: var(--dex-okd-font-size-xs);
  --dex-okd-upload-file-desc-line-height: var(--dex-okd-line-height-xs);
  --dex-okd-upload-text-btn-color: var(--dex-okd-color-content-tertiary);
  --dex-okd-upload-list-font-size: var(--dex-okd-font-size-base);
  --dex-okd-upload-list-line-height: var(--dex-okd-line-height-base);
  --dex-okd-upload-list-color: #fafafa;
  --dex-okd-upload-list-retry-font-size: var(--dex-okd-font-size-md);
  --dex-okd-upload-list-retry-line-height: var(--dex-okd-line-height-md);
  --dex-okd-upload-list-retry-color: #1e6bff;
  --dex-okd-upload-list-label-font-size: var(--dex-okd-font-size-md);
  --dex-okd-upload-list-label-line-height: var(--dex-okd-line-height-md);
  --dex-okd-upload-list-desc-font-size: var(--dex-okd-font-size-xs);
  --dex-okd-upload-list-desc-line-height: var(--dex-okd-line-height-xs);
  --dex-okd-upload-list-desc-color: #909090;
  --dex-okd-upload-patch-item-background: var(--dex-okd-color-background-surface-primary);
  --dex-okd-upload-patch-item-title-color: var(--dex-okd-color-content-secondary);
  --dex-okd-upload-patch-item-desc-color: var(--dex-okd-color-content-disabled);
  --dex-okd-upload-patch-item-error-icon-color: var(--dex-okd-color-semantic-negative);
  --dex-okd-upload-patch-item-error-text-color: var(--dex-okd-color-semantic-negative);
  --dex-okd-upload-patch-item-success-icon-color: var(--dex-okd-color-semantic-positive);
  --dex-okd-upload-patch-item-remove-icon-color: var(--dex-okd-color-content-disabled);
  --dex-okd-upload-patch-item-mobile-remove-icon-color: var(--dex-okd-color-content-disabled);
  --dex-okd-upload-patch-item-retry-text-color: var(--dex-okd-color-content-primary);
  --dex-okd-upload-patch-item-placeholder-icon-color: var(--dex-okd-color-content-disabled);
  --dex-okd-upload-patch-tip-color: var(--dex-okd-color-content-primary);
  --dex-okd-upload-patch-entry-disabled-background: var(--dex-okd-color-background-surface-primary);
  --dex-okd-upload-disabled-background: var(--dex-okd-color-background-surface-disable);
  --dex-okd-upload-disabled-border-color: var(--dex-okd-color-border-primary);
  --dex-okd-upload-patch-item-mobile-default-border-color: var(--dex-okd-color-border-primary);
  --dex-okd-upload-patch-item-mobile-active-border-color: var(--dex-okd-color-border-primary);
  --dex-okd-upload-patch-item-mobile-success-border-color: var(--dex-okd-color-border-primary);
  --dex-okd-upload-patch-item-mobile-error-border-color: var(--dex-okd-color-border-primary);
  --dex-okd-upload-default-icon-color: #fff;
  --dex-okd-upload-default-border-color: var(--dex-okd-color-border-secondary);
  --dex-okd-upload-default-logo-color: var(--dex-okd-color-border-secondary);
  --dex-okd-upload-default-background-color: var(--dex-okd-color-transparent-white);
  --dex-okd-upload-default-label-color: var(--dex-okd-color-content-tertiary);
  --dex-okd-upload-default-desc-color: var(--dex-okd-color-content-disabled);
  --dex-okd-upload-disabled-logo-color: var(--dex-okd-upload-default-logo-color);
  --dex-okd-upload-disabled-label-color: var(--dex-okd-upload-default-label-color);
  --dex-okd-upload-disabled-desc-color: var(--dex-okd-upload-default-desc-color)
}

.C5Vjd5__dex,
.L0Q_RL__dex,
.NmCVuZ__dex,
.cnsu9X__dex {
  display: none
}

@media (max-width:767px) {
  .C5Vjd5__dex {
    display: flex
  }
}

@media (min-width:768px) and (max-width:1023px) {
  .L0Q_RL__dex {
    display: flex
  }
}

@media (min-width:1024px) and (max-width:1269px) {
  .cnsu9X__dex {
    display: flex
  }
}

@media (min-width:1270px) {
  .NmCVuZ__dex {
    display: flex
  }
}

@media (max-width:767px) {
  ._QcExL__dex {
    display: none
  }
}

@media (min-width:768px) and (max-width:1023px) {
  .pKBdPf__dex {
    display: none
  }
}

@media (min-width:1024px) and (max-width:1269px) {
  .I2KMib__dex {
    display: none
  }
}

@media (min-width:1270px) {
  .P4GzPg__dex {
    display: none
  }
}

.glipxB__dex {
  color: #929292
}

.laEtgd__dex {
  color: #3d3d3d
}

.vgG7_c__dex {
  color: #000
}

.MxiO0b__dex,
.WvNYOS__dex {
  height: 100%;
  overflow: auto;
  width: 100%
}

.MxiO0b__dex {
  display: block
}

.HccTMP__dex {
  display: none;
  height: 100%;
  overflow: auto;
  width: 100%
}

.GRBUq7__dex,
.iyd3f8__dex,
.pk2Z8v__dex,
.yAM64P__dex {
  display: none
}

@media (max-width:767px) {
  .GRBUq7__dex {
    display: flex
  }
}

@media (min-width:768px) and (max-width:1023px) {
  .iyd3f8__dex {
    display: flex
  }
}

@media (min-width:1024px) and (max-width:1269px) {
  .pk2Z8v__dex {
    display: flex
  }
}

@media (min-width:1270px) {
  .yAM64P__dex {
    display: flex
  }
}

@media (max-width:767px) {
  .wUIesd__dex {
    display: none
  }
}

@media (min-width:768px) and (max-width:1023px) {
  .pXuWXS__dex {
    display: none
  }
}

@media (min-width:1024px) and (max-width:1269px) {
  .gQzcc___dex {
    display: none
  }
}

@media (min-width:1270px) {
  .csAyd8__dex {
    display: none
  }
}

.HWdqyG__dex {
  color: #929292
}

.fIBixx__dex {
  color: #3d3d3d
}

.fEFV3I__dex {
  color: #000
}

.A8f9mJ__dex {
  height: 100%;
  padding: 24px
}

.A8f9mJ__dex .da__bI__dex {
  align-items: center;
  display: flex;
  flex-direction: row;
  gap: 8px
}

.A8f9mJ__dex .NPwbVl__dex {
  margin-bottom: 8px
}

.A8f9mJ__dex .NPwbVl__dex .y7cehy__dex {
  height: 40px;
  min-width: 40px;
  width: 40px
}

.A8f9mJ__dex .NPwbVl__dex .pnqjkq__dex {
  font-size: 16px;
  font-weight: 700;
  line-height: 20px
}

.A8f9mJ__dex .NPwbVl__dex .enh_8n__dex {
  height: 18px;
  width: 18px
}

.A8f9mJ__dex .WWPNZd__dex {
  color: var(--dex-okd-color-content-primary);
  font-size: 16px;
  line-height: 22px;
  white-space: pre-wrap;
  word-break: break-word
}

.A8f9mJ__dex .r1xoBF__dex {
  color: var(--dex-okd-color-content-contrast);
  font-size: 12px;
  font-weight: 400;
  line-height: 16px
}

.A8f9mJ__dex .hhvVju__dex {
  margin-bottom: 10px;
  margin-top: 12px
}

.A8f9mJ__dex .ZSjs8r__dex {
  height: 32px;
  margin-bottom: 6px;
  margin-right: 6px
}

.A8f9mJ__dex .ZSjs8r__dex .R26ter__dex {
  height: 24px;
  width: 24px
}

.A8f9mJ__dex .ZSjs8r__dex .aAOkNl__dex,
.A8f9mJ__dex .ZSjs8r__dex .ywdcuO__dex {
  font-size: 14px;
  font-weight: 500
}

.A8f9mJ__dex .YPG6fv__dex {
  height: 32px;
  margin-bottom: 6px;
  margin-right: 6px
}

.A8f9mJ__dex .YPG6fv__dex .uR2dXU__dex {
  height: 24px;
  width: 24px
}

.A8f9mJ__dex .YPG6fv__dex ._0ERm7__dex {
  font-size: 14px;
  font-weight: 500
}

.A8f9mJ__dex .YPSWzg__dex {
  margin-top: 24px;
  width: 100%
}

.i5PCuo__dex {
  justify-content: space-between
}

.i5PCuo__dex,
.wCqROq__dex {
  align-items: center;
  display: flex
}

.wCqROq__dex {
  color: var(--dex-okd-color-content-contrast);
  font-size: 12px;
  font-weight: 400;
  gap: 4px;
  line-height: 16px
}

.PBjFBt__dex,
.wCqROq__dex {
  margin-top: 12px
}

.CNN3cB__dex,
.Xp5gKM__dex,
.rLJr5p__dex,
.tmrXVY__dex {
  display: none
}

@media (max-width:767px) {
  .rLJr5p__dex {
    display: flex
  }
}

@media (min-width:768px) and (max-width:1023px) {
  .Xp5gKM__dex {
    display: flex
  }
}

@media (min-width:1024px) and (max-width:1269px) {
  .CNN3cB__dex {
    display: flex
  }
}

@media (min-width:1270px) {
  .tmrXVY__dex {
    display: flex
  }
}

@media (max-width:767px) {
  .h3yQ3y__dex {
    display: none
  }
}

@media (min-width:768px) and (max-width:1023px) {
  .kSHjGA__dex {
    display: none
  }
}

@media (min-width:1024px) and (max-width:1269px) {
  .hiF3ij__dex {
    display: none
  }
}

@media (min-width:1270px) {
  .DatH42__dex {
    display: none
  }
}

.nkycPo__dex {
  color: #929292
}

.Eq4Rii__dex {
  color: #3d3d3d
}

.EE4mhd__dex {
  color: #000
}

.lseZxx__dex {
  margin-top: 12px;
  max-width: 518px
}

.tE7Tfd__dex {
  font-size: 16px;
  line-height: 22px
}

.EYlCqY__dex .LZIqR8__dex {
  font-size: 16px;
  font-weight: 700;
  line-height: 20px
}

.yTMqN3__dex {
  width: 14px
}

.azekBv__dex {
  width: 16px
}

.w2ziN7__dex {
  width: 20px
}

.R2_VE2__dex {
  width: 24px
}

.eEE681__dex {
  width: 40px
}

.D8KgXU__dex {
  padding: 4px
}

.iEnHZ3__dex {
  padding-left: 4px;
  padding-right: 4px
}

.il1_zR__dex {
  padding-bottom: 4px;
  padding-top: 4px
}

.RWaatL__dex {
  margin: 4px
}

.yIvbUm__dex {
  margin-left: 4px;
  margin-right: 4px
}

.tEbFUh__dex {
  margin: 4px auto
}

.lQC4hN__dex {
  margin-bottom: 4px;
  margin-top: 4px
}

.MZ0faP__dex,
.OmfPM5__dex {
  padding: 4px 0
}

.Tuvl2A__dex,
.v7PwkB__dex {
  padding: 0 4px
}

.LitXXD__dex {
  padding-left: 4px
}

.tLfB2o__dex {
  margin-left: 4px
}

.LN_15b__dex {
  padding-right: 4px
}

.RFM7EA__dex {
  margin-right: 4px
}

.q8JYc7__dex {
  padding-top: 4px
}

.gRCKsD__dex {
  margin-top: 4px
}

.Eje5WB__dex {
  padding-bottom: 4px
}

.sRjlc3__dex {
  margin-bottom: 4px
}

.dtiyR8__dex {
  padding: 5px
}

.s4miNP__dex {
  padding-left: 5px;
  padding-right: 5px
}

.EYEi2D__dex {
  padding-bottom: 5px;
  padding-top: 5px
}

.RfOie___dex {
  margin: 5px
}

.CeGt2Y__dex {
  margin-left: 5px;
  margin-right: 5px
}

.yjpCYm__dex {
  margin: 5px auto
}

.U_0CB2__dex {
  margin-bottom: 5px;
  margin-top: 5px
}

.OVqHEC__dex,
.YXpjXu__dex {
  padding: 5px 0
}

.T6NvBg__dex,
.Xpgm22__dex {
  padding: 0 5px
}

.TmDFFI__dex {
  padding-left: 5px
}

.juWpC7__dex {
  margin-left: 5px
}

.jkmX6K__dex {
  padding-right: 5px
}

.a912em__dex {
  margin-right: 5px
}

.c7RCGq__dex {
  padding-top: 5px
}

.yxt8gt__dex {
  margin-top: 5px
}

.xlcLMB__dex {
  padding-bottom: 5px
}

.L645az__dex {
  margin-bottom: 5px
}

.mrboht__dex {
  padding: 8px
}

.XGa662__dex {
  padding-left: 8px;
  padding-right: 8px
}

.lmboIH__dex {
  padding-bottom: 8px;
  padding-top: 8px
}

.CFk2V6__dex {
  margin: 8px
}

.rViJOI__dex {
  margin-left: 8px;
  margin-right: 8px
}

.P6r1pA__dex {
  margin: 8px auto
}

.maHOlS__dex {
  margin-bottom: 8px;
  margin-top: 8px
}

.EwGDug__dex,
.Te4MXp__dex {
  padding: 8px 0
}

.M_VU_I__dex,
.ZeiZpf__dex {
  padding: 0 8px
}

.OO0g0z__dex {
  padding-left: 8px
}

.JUeFTL__dex {
  margin-left: 8px
}

.raAsB8__dex {
  padding-right: 8px
}

.BymNwJ__dex {
  margin-right: 8px
}

.yFfkDH__dex {
  padding-top: 8px
}

.M6hOtA__dex {
  margin-top: 8px
}

.eqph4m__dex {
  padding-bottom: 8px
}

.mOvJql__dex {
  margin-bottom: 8px
}

.XyP8pr__dex {
  padding: 10px
}

.MN7c9e__dex {
  padding-left: 10px;
  padding-right: 10px
}

.YQTQrQ__dex {
  padding-bottom: 10px;
  padding-top: 10px
}

.dAI1sG__dex {
  margin: 10px
}

.N4hUy___dex {
  margin-left: 10px;
  margin-right: 10px
}

.AiRM3I__dex {
  margin: 10px auto
}

.jvgJ3Q__dex {
  margin-bottom: 10px;
  margin-top: 10px
}

.HGIhAT__dex,
.WnE26s__dex {
  padding: 10px 0
}

.OnfNv8__dex,
.t0ZVjW__dex {
  padding: 0 10px
}

.zXPAeo__dex {
  padding-left: 10px
}

.KT2KXT__dex {
  margin-left: 10px
}

.ZAsQAJ__dex {
  padding-right: 10px
}

.HxGQfG__dex {
  margin-right: 10px
}

.PiTGLa__dex {
  padding-top: 10px
}

.mLfO7V__dex {
  margin-top: 10px
}

.nlPxAm__dex {
  padding-bottom: 10px
}

.XHQrrt__dex {
  margin-bottom: 10px
}

.NAATbo__dex {
  padding: 11px
}

.d8NkeH__dex {
  padding-left: 11px;
  padding-right: 11px
}

.lwyUfS__dex {
  padding-bottom: 11px;
  padding-top: 11px
}

.b322QO__dex {
  margin: 11px
}

.x830iG__dex {
  margin-left: 11px;
  margin-right: 11px
}

.Fj4Gkv__dex {
  margin: 11px auto
}

.Quyrye__dex {
  margin-bottom: 11px;
  margin-top: 11px
}

.UGIUAU__dex,
.uqJlhv__dex {
  padding: 11px 0
}

.DXjROo__dex,
.LEFy97__dex {
  padding: 0 11px
}

.i_l8rU__dex {
  padding-left: 11px
}

.j1_Our__dex {
  margin-left: 11px
}

.m6cB7C__dex {
  padding-right: 11px
}

.tNXcim__dex {
  margin-right: 11px
}

.B52MVB__dex {
  padding-top: 11px
}

.c2FO8Y__dex {
  margin-top: 11px
}

.lvr48n__dex {
  padding-bottom: 11px
}

.YyPWGD__dex {
  margin-bottom: 11px
}

.SnPNU0__dex {
  padding: 12px
}

.RXhgve__dex {
  padding-left: 12px;
  padding-right: 12px
}

.dX0TRR__dex {
  padding-bottom: 12px;
  padding-top: 12px
}

.gkNVLr__dex {
  margin: 12px
}

.xOfa6U__dex {
  margin-left: 12px;
  margin-right: 12px
}

.IfLe_V__dex {
  margin: 12px auto
}

.NYraNV__dex {
  margin-bottom: 12px;
  margin-top: 12px
}

.RSpq9E__dex,
.plokkJ__dex {
  padding: 12px 0
}

.CNWwMm__dex,
.QEozCe__dex {
  padding: 0 12px
}

.JMPAtI__dex {
  padding-left: 12px
}

.YQa7bW__dex {
  margin-left: 12px
}

.WFG5Kq__dex {
  padding-right: 12px
}

.ETBwSR__dex {
  margin-right: 12px
}

.mtbq_P__dex {
  padding-top: 12px
}

.n9a5a___dex {
  margin-top: 12px
}

.FX70Ld__dex {
  padding-bottom: 12px
}

.tlpvam__dex {
  margin-bottom: 12px
}

.LRZ5V2__dex {
  padding: 15px
}

.gjyqKN__dex {
  padding-left: 15px;
  padding-right: 15px
}

.yIF10V__dex {
  padding-bottom: 15px;
  padding-top: 15px
}

.xY1z4n__dex {
  margin: 15px
}

.gaaTvv__dex {
  margin-left: 15px;
  margin-right: 15px
}

.j_AGSn__dex {
  margin: 15px auto
}

.yiMJ5S__dex {
  margin-bottom: 15px;
  margin-top: 15px
}

.dXF3el__dex,
.lQNPKE__dex {
  padding: 15px 0
}

.C8LOqv__dex,
.mi92nX__dex {
  padding: 0 15px
}

.vz8Mg3__dex {
  padding-left: 15px
}

.Sj96xf__dex {
  margin-left: 15px
}

.ulEDJ2__dex {
  padding-right: 15px
}

.V3EjJP__dex {
  margin-right: 15px
}

.BTHrw4__dex {
  padding-top: 15px
}

.pjdTlh__dex {
  margin-top: 15px
}

.RCHbDs__dex {
  padding-bottom: 15px
}

.bq5udT__dex {
  margin-bottom: 15px
}

.MvIqrF__dex {
  padding: 16px
}

.XLar4e__dex {
  padding-left: 16px;
  padding-right: 16px
}

.eLrgBO__dex {
  padding-bottom: 16px;
  padding-top: 16px
}

.rBiTp7__dex {
  margin: 16px
}

.KWRbGL__dex {
  margin-left: 16px;
  margin-right: 16px
}

.jAWczh__dex {
  margin: 16px auto
}

.dWUrD0__dex {
  margin-bottom: 16px;
  margin-top: 16px
}

.elPCQj__dex,
.pmP12g__dex {
  padding: 16px 0
}

.E90kyl__dex,
.taXa6Q__dex {
  padding: 0 16px
}

.xTdcS3__dex {
  padding-left: 16px
}

.v0KD48__dex {
  margin-left: 16px
}

.sn06FC__dex {
  padding-right: 16px
}

.T_Sbqr__dex {
  margin-right: 16px
}

.dFSqMs__dex {
  padding-top: 16px
}

.uV5Xho__dex {
  margin-top: 16px
}

.JXUT4N__dex {
  padding-bottom: 16px
}

.qXLqjW__dex {
  margin-bottom: 16px
}

.Jiaw3x__dex {
  padding: 17px
}

.bufxpf__dex {
  padding-left: 17px;
  padding-right: 17px
}

.JK0pE___dex {
  padding-bottom: 17px;
  padding-top: 17px
}

.XXoFLF__dex {
  margin: 17px
}

.f7AzDf__dex {
  margin-left: 17px;
  margin-right: 17px
}

.FmeLuS__dex {
  margin: 17px auto
}

.LCr3ie__dex {
  margin-bottom: 17px;
  margin-top: 17px
}

.L4vBjz__dex,
.ZNJ0o1__dex {
  padding: 17px 0
}

.I_LTlo__dex,
.iO9rCl__dex {
  padding: 0 17px
}

.PRfvCX__dex {
  padding-left: 17px
}

.Q7C3ik__dex {
  margin-left: 17px
}

.w_jzDd__dex {
  padding-right: 17px
}

.ooAHeb__dex {
  margin-right: 17px
}

.sagX8P__dex {
  padding-top: 17px
}

.wpDOrW__dex {
  margin-top: 17px
}

.WafqPg__dex {
  padding-bottom: 17px
}

.I09ola__dex {
  margin-bottom: 17px
}

.cjBCCF__dex {
  padding: 20px
}

.Jk5BVb__dex {
  padding-left: 20px;
  padding-right: 20px
}

.vfEk81__dex {
  padding-bottom: 20px;
  padding-top: 20px
}

.n80Cz6__dex {
  margin: 20px
}

.m0my4f__dex {
  margin-left: 20px;
  margin-right: 20px
}

.JpIIgW__dex {
  margin: 20px auto
}

.E3Qyy7__dex {
  margin-bottom: 20px;
  margin-top: 20px
}

.cqNthz__dex,
.v_LPb2__dex {
  padding: 20px 0
}

.L83Mod__dex,
.lOIO0U__dex {
  padding: 0 20px
}

.SjHgin__dex {
  padding-left: 20px
}

.k7EZzg__dex {
  margin-left: 20px
}

.YAdqWx__dex {
  padding-right: 20px
}

.WQ4TWo__dex {
  margin-right: 20px
}

.yZiobM__dex {
  padding-top: 20px
}

.EUQsXk__dex {
  margin-top: 20px
}

.NIViD3__dex {
  padding-bottom: 20px
}

.INeRZ0__dex {
  margin-bottom: 20px
}

.MCrch1__dex {
  padding: 24px
}

.s2yQoK__dex {
  padding-left: 24px;
  padding-right: 24px
}

.jBgFDR__dex {
  padding-bottom: 24px;
  padding-top: 24px
}

.zig5YL__dex {
  margin: 24px
}

.nUQEsk__dex {
  margin-left: 24px;
  margin-right: 24px
}

.jSsPur__dex {
  margin: 24px auto
}

.lr0Sls__dex {
  margin-bottom: 24px;
  margin-top: 24px
}

.Cds_py__dex,
.b_PpER__dex {
  padding: 24px 0
}

.HIgZoG__dex,
.eo9Dul__dex {
  padding: 0 24px
}

.m4nwdv__dex {
  padding-left: 24px
}

.sYXol6__dex {
  margin-left: 24px
}

.kfNQlS__dex {
  padding-right: 24px
}

.TrfW3Y__dex {
  margin-right: 24px
}

.Z8jX_U__dex {
  padding-top: 24px
}

.ZHKhrT__dex {
  margin-top: 24px
}

.tt_uYz__dex {
  padding-bottom: 24px
}

.yz8ruU__dex {
  margin-bottom: 24px
}

.a3A8PH__dex {
  padding: 25px
}

.dyY4qB__dex {
  padding-left: 25px;
  padding-right: 25px
}

.s8BnJ2__dex {
  padding-bottom: 25px;
  padding-top: 25px
}

.BjtoYP__dex {
  margin: 25px
}

.lcZuA9__dex {
  margin-left: 25px;
  margin-right: 25px
}

.hgsWcW__dex {
  margin: 25px auto
}

.A3hTpB__dex {
  margin-bottom: 25px;
  margin-top: 25px
}

.GkyJr1__dex,
.kJMWap__dex {
  padding: 25px 0
}

.KuRwVD__dex,
.UFiJRm__dex {
  padding: 0 25px
}

.Vwat0J__dex {
  padding-left: 25px
}

.HO4NcB__dex {
  margin-left: 25px
}

.CybIgC__dex {
  padding-right: 25px
}

.ORlHfk__dex {
  margin-right: 25px
}

.VytEjx__dex {
  padding-top: 25px
}

.i34B4j__dex {
  margin-top: 25px
}

.UzExro__dex {
  padding-bottom: 25px
}

.WCZtPr__dex {
  margin-bottom: 25px
}

.ZB2UqP__dex {
  padding: 30px
}

.OFFNWO__dex {
  padding-left: 30px;
  padding-right: 30px
}

.qIfYOF__dex {
  padding-bottom: 30px;
  padding-top: 30px
}

.LADcKT__dex {
  margin: 30px
}

.Nxa62c__dex {
  margin-left: 30px;
  margin-right: 30px
}

.U4tonH__dex {
  margin: 30px auto
}

.ETcecs__dex {
  margin-bottom: 30px;
  margin-top: 30px
}

.J9Sux___dex,
.QcNb1I__dex {
  padding: 30px 0
}

.BHoEom__dex,
.mHFowX__dex {
  padding: 0 30px
}

.znXEjG__dex {
  padding-left: 30px
}

.Rh4CuM__dex {
  margin-left: 30px
}

.N2FloQ__dex {
  padding-right: 30px
}

.MJ89E8__dex {
  margin-right: 30px
}

.nVP3dz__dex {
  padding-top: 30px
}

.Ttwjq1__dex {
  margin-top: 30px
}

.gR6rvu__dex {
  padding-bottom: 30px
}

.jSaaTY__dex {
  margin-bottom: 30px
}

.pOFdwT__dex {
  padding: 32px
}

.PGyTcD__dex {
  padding-left: 32px;
  padding-right: 32px
}

.N6VJb1__dex {
  padding-bottom: 32px;
  padding-top: 32px
}

.IUC60V__dex {
  margin: 32px
}

.xNLrg___dex {
  margin-left: 32px;
  margin-right: 32px
}

.aj1zeU__dex {
  margin: 32px auto
}

.bRyoVi__dex {
  margin-bottom: 32px;
  margin-top: 32px
}

.kH0R8g__dex,
.t9z5cv__dex {
  padding: 32px 0
}

.GfKXYj__dex,
.daJH8i__dex {
  padding: 0 32px
}

.uYKSru__dex {
  padding-left: 32px
}

.zAcEKg__dex {
  margin-left: 32px
}

.rLiywx__dex {
  padding-right: 32px
}

.RnTRdX__dex {
  margin-right: 32px
}

.ZEnda7__dex {
  padding-top: 32px
}

.DBj5ed__dex {
  margin-top: 32px
}

.yAJ6El__dex {
  padding-bottom: 32px
}

.fquvl3__dex {
  margin-bottom: 32px
}

.eboc2P__dex {
  padding: 40px
}

.ijgf2h__dex {
  padding-left: 40px;
  padding-right: 40px
}

.rP2hEc__dex {
  padding-bottom: 40px;
  padding-top: 40px
}

.o2liGC__dex {
  margin: 40px
}

.UKLxVm__dex {
  margin-left: 40px;
  margin-right: 40px
}

.pXxy1i__dex {
  margin: 40px auto
}

.rLuudj__dex {
  margin-bottom: 40px;
  margin-top: 40px
}

.ODK9iT__dex,
.iwUnVw__dex {
  padding: 40px 0
}

.G49TKy__dex,
.nfkHA___dex {
  padding: 0 40px
}

.m6JZRU__dex {
  padding-left: 40px
}

.WaouuV__dex {
  margin-left: 40px
}

.LKp2cX__dex {
  padding-right: 40px
}

.IFSV9z__dex {
  margin-right: 40px
}

.XGZerw__dex {
  padding-top: 40px
}

.ILYsxJ__dex {
  margin-top: 40px
}

.WHJCi1__dex {
  padding-bottom: 40px
}

.Doy0HY__dex {
  margin-bottom: 40px
}

.gykU_r__dex {
  border-radius: 4px
}

.zHGXcO__dex {
  border-radius: 6px
}

.oormYe__dex {
  border-radius: 8px
}

.hPM3vS__dex {
  background: var(--dex-okd-color-background-surface-primary);
  border-radius: 30px
}

.hPM3vS__dex:hover {
  background: var(--dex-okd-color-background-surface-pressed)
}

.SuH62a__dex {
  min-width: auto
}

div .lnHGA6__dex {
  border-radius: 50%;
  height: 16px;
  width: 16px
}

.ntnY0O__dex {
  align-items: center;
  cursor: pointer;
  display: flex;
  gap: 6px;
  padding: 4px 8px 4px 4px
}

.R6w9G7__dex {
  gap: 4px;
  padding: 4px 8px 4px 4px
}

.oHhAWx__dex {
  color: var(--dex-okd-color-content-primary);
  flex-shrink: 0;
  font-size: 12px;
  font-weight: 500;
  line-height: 16px;
  white-space: nowrap
}

.ifWq3u__dex {
  align-items: center;
  display: flex;
  flex-shrink: 0;
  height: 16px;
  position: relative
}

.lGI3hH__dex {
  min-width: 20px
}

.lnHGA6__dex {
  border-radius: 50%;
  height: 16px;
  position: absolute;
  top: 0;
  width: 16px
}

.lnHGA6__dex:first-child {
  z-index: 3
}

.lnHGA6__dex:nth-child(2) {
  z-index: 2
}

.lnHGA6__dex:nth-child(3) {
  z-index: 1
}

.NqYVZi__dex {
  border-radius: 8px;
  color: inherit;
  justify-content: space-between;
  max-width: 148px;
  min-width: 148px;
  text-decoration: none;
  transition: background-color .2s ease
}

.NqYVZi__dex,
.wgImPy__dex {
  align-items: center;
  display: flex
}

.wgImPy__dex {
  flex: 1 1;
  gap: 12px;
  min-width: 0
}

.JCIfuT__dex {
  -webkit-box-orient: vertical;
  -webkit-line-clamp: 1;
  color: var(--dex-okd-color-content-primary);
  display: -webkit-box;
  font-size: 12px;
  font-weight: 400;
  line-height: 16px;
  overflow: hidden;
  text-overflow: ellipsis
}

.HOLffP__dex,
.Xz4JGi__dex {
  border-radius: 50%;
  height: 20px;
  width: 20px
}

.Xz4JGi__dex {
  box-shadow: 0 0 0 2px var(--dex-okd-color-background-surface-primary);
  min-width: 20px
}

.DbabsN__dex {
  flex-shrink: 0;
  font-size: 12px;
  font-weight: 500;
  text-align: right
}

.s77q_2__dex {
  color: var(--dex-okd-color-preference-loss)
}

.kdCMu6__dex {
  color: var(--dex-okd-color-preference-profit)
}

.o5NafM__dex {
  align-items: center;
  display: flex;
  gap: 8px
}

.A4Z8qc__dex,
.O8utU4__dex,
.sXYMa9__dex,
.tIc9xx__dex {
  display: none
}

@media (max-width:767px) {
  .tIc9xx__dex {
    display: flex
  }
}

@media (min-width:768px) and (max-width:1023px) {
  .sXYMa9__dex {
    display: flex
  }
}

@media (min-width:1024px) and (max-width:1269px) {
  .A4Z8qc__dex {
    display: flex
  }
}

@media (min-width:1270px) {
  .O8utU4__dex {
    display: flex
  }
}

@media (max-width:767px) {
  .yFWCfE__dex {
    display: none
  }
}

@media (min-width:768px) and (max-width:1023px) {
  .uE6K4___dex {
    display: none
  }
}

@media (min-width:1024px) and (max-width:1269px) {
  .Q8IS0B__dex {
    display: none
  }
}

@media (min-width:1270px) {
  .NJFe8I__dex {
    display: none
  }
}

.lGNKZr__dex {
  color: #929292
}

.DVd2on__dex {
  color: #3d3d3d
}

.EYT6nL__dex {
  color: #000
}

.BTancr__dex {
  padding: 24px
}

.BTancr__dex .BKB6UN__dex {
  display: flex;
  gap: 28px;
  width: 100%
}

.BTancr__dex .QQKEsg__dex {
  align-items: center;
  display: flex;
  flex-direction: row;
  gap: 8px
}

.BTancr__dex .xiw8Jp__dex {
  margin-bottom: 16px
}

.BTancr__dex .xiw8Jp__dex .FHn_Xu__dex {
  height: 40px;
  min-width: 40px;
  width: 40px
}

.BTancr__dex .xiw8Jp__dex .nyd0V4__dex {
  font-size: 16px;
  font-weight: 700;
  line-height: 20px
}

.BTancr__dex .xiw8Jp__dex .DioXgY__dex {
  height: 18px;
  width: 18px
}

.BTancr__dex .V1LoFU__dex {
  margin-bottom: 32px;
  width: 100%
}

.BTancr__dex .ZPpDuh__dex {
  color: var(--dex-okd-color-content-primary);
  font-size: 16px;
  line-height: 22px;
  white-space: pre-wrap;
  word-break: break-word
}

.BTancr__dex .mhX2Hk__dex {
  color: var(--dex-okd-color-content-contrast);
  font-size: 12px;
  font-weight: 400;
  line-height: 16px
}

.BTancr__dex .po7BRS__dex {
  margin-bottom: 10px;
  margin-top: 12px
}

.BTancr__dex .prrKuy__dex {
  height: 32px;
  margin-bottom: 6px;
  margin-right: 6px
}

.BTancr__dex .prrKuy__dex .FV0N4i__dex {
  height: 24px;
  width: 24px
}

.BTancr__dex .prrKuy__dex .I6vS1b__dex,
.BTancr__dex .prrKuy__dex .iLjyGW__dex {
  font-size: 14px;
  font-weight: 500
}

.BTancr__dex .m5HGst__dex {
  height: 32px;
  margin-bottom: 6px;
  margin-right: 6px
}

.BTancr__dex .m5HGst__dex .LQuJEc__dex {
  height: 24px;
  width: 24px
}

.BTancr__dex .m5HGst__dex .uij8x4__dex {
  font-size: 14px;
  font-weight: 500
}

.BTancr__dex .bulTWV__dex {
  margin-top: 24px;
  width: 100%
}

.Tlm41f__dex {
  border: 1px dashed var(--dex-okd-color-border-primary);
  margin-left: 19.5px;
  position: relative;
  top: -16.5px
}

.Tlm41f__dex .fUwugI__dex {
  background-color: var(--dex-okd-color-background-surface-secondary);
  border: 1px solid var(--dex-okd-color-border-primary);
  border-radius: 50%;
  height: 8px;
  left: -5px;
  position: absolute;
  top: 25px;
  width: 8px
}

.MqTR9Y__dex {
  align-items: center;
  color: var(--dex-okd-color-content-contrast);
  display: flex;
  font-size: 12px;
  font-weight: 400;
  gap: 4px;
  line-height: 16px;
  margin-top: 8px
}

.HH2pMF__dex {
  font-size: 16px;
  font-weight: 500;
  height: 22px
}

.XoYKBx__dex .Lmyo9C__dex {
  font-size: 16px;
  font-weight: 700;
  line-height: 20px
}

.nhbXEV__dex {
  margin-top: 12px
}

.EKqvVR__dex {
  align-items: center;
  display: flex;
  justify-content: space-between
}

.WEDFEC__dex {
  margin-top: 12px
}

.LSkWfg__dex,
.WDWpii__dex,
.fRjFyO__dex,
.rjJgVG__dex {
  display: none
}

@media (max-width:767px) {
  .rjJgVG__dex {
    display: flex
  }
}

@media (min-width:768px) and (max-width:1023px) {
  .fRjFyO__dex {
    display: flex
  }
}

@media (min-width:1024px) and (max-width:1269px) {
  .WDWpii__dex {
    display: flex
  }
}

@media (min-width:1270px) {
  .LSkWfg__dex {
    display: flex
  }
}

@media (max-width:767px) {
  .jJsPTC__dex {
    display: none
  }
}

@media (min-width:768px) and (max-width:1023px) {
  .kxtztZ__dex {
    display: none
  }
}

@media (min-width:1024px) and (max-width:1269px) {
  .NX8Jsz__dex {
    display: none
  }
}

@media (min-width:1270px) {
  .HlBkcS__dex {
    display: none
  }
}

.tr7p1z__dex {
  color: #929292
}

.fzbVf8__dex {
  color: #3d3d3d
}

.K6xFKf__dex {
  color: #000
}

.Tjsk3x__dex {
  align-items: center;
  display: flex;
  height: 100%;
  justify-content: center;
  padding: 0;
  width: 100%
}

.D3WCwf__dex,
.NLGd9h__dex,
.VSc3cE__dex,
.y7o9tH__dex {
  display: none
}

@media (max-width:767px) {
  .D3WCwf__dex {
    display: flex
  }
}

@media (min-width:768px) and (max-width:1023px) {
  .VSc3cE__dex {
    display: flex
  }
}

@media (min-width:1024px) and (max-width:1269px) {
  .y7o9tH__dex {
    display: flex
  }
}

@media (min-width:1270px) {
  .NLGd9h__dex {
    display: flex
  }
}

@media (max-width:767px) {
  .x5KIVM__dex {
    display: none
  }
}

@media (min-width:768px) and (max-width:1023px) {
  .MoiIZb__dex {
    display: none
  }
}

@media (min-width:1024px) and (max-width:1269px) {
  .YOvi8V__dex {
    display: none
  }
}

@media (min-width:1270px) {
  .FdyhDt__dex {
    display: none
  }
}

.acC22P__dex {
  color: #929292
}

.srsqQR__dex {
  color: #3d3d3d
}

.Zf6UUo__dex {
  color: #000
}

.Xco23m__dex {
  border-radius: 8px;
  color: var(--dex-okd-color-content-contrast);
  padding: 4px 0;
  word-break: break-word
}

.Xco23m__dex,
.cPMeFE__dex {
  font-size: 12px;
  font-weight: 400;
  line-height: 14px
}

.cPMeFE__dex {
  cursor: pointer;
  -webkit-text-decoration-line: underline;
  text-decoration-line: underline;
  -webkit-text-decoration-skip-ink: none;
  text-decoration-skip-ink: none;
  -webkit-text-decoration-style: solid;
  text-decoration-style: solid;
  text-decoration-thickness: auto;
  text-underline-offset: auto;
  text-underline-position: from-font
}

.HOFwUp__dex,
.cPMeFE__dex {
  color: var(--dex-okd-color-content-secondary)
}

.HOFwUp__dex {
  font-size: 16px;
  font-weight: 400;
  line-height: 24px;
  word-break: break-word
}

.b0yYH0__dex .c8GBEs__dex {
  width: 100%
}

@media (min-width:768px) {
  .b0yYH0__dex .c8GBEs__dex {
    width: 480px
  }
}

.fshILM__dex {
  margin-top: 8px
}

.QvfE1K__dex {
  margin-bottom: 20px
}

.vWXfhI__dex {
  height: 100%;
  width: 100%
}

.wJYkNj__dex {
  height: 100%;
  position: absolute;
  top: 50%;
  transform: translateY(-50%);
  width: 100%
}

.fFuCRe__dex {
  height: 100%;
  image-rendering: -moz-crisp-edges;
  image-rendering: pixelated;
  left: 0;
  position: relative;
  position: absolute;
  top: 0;
  width: 100%
}

.r2SVVk__dex.QAwMzg__dex {
  height: 100%;
  position: relative;
  width: 100%
}

.tr7qZF__dex {
  background-position: 50%;
  background-repeat: no-repeat;
  background-size: contain;
  -webkit-filter: blur(20px);
  filter: blur(20px)
}

.QTBrin__dex,
.fEfMoV__dex,
.tr7qZF__dex {
  height: 100%;
  width: 100%
}

.QTBrin__dex {
  padding-top: 100%
}

.TYBbCI__dex {
  border: 2px solid var(--dex-okd-color-content-primary);
  border-radius: 50%;
  height: 100px;
  left: 50%;
  position: absolute;
  top: 50%;
  transform: translate(-50%, -50%);
  width: 100px
}

.HooVWR__dex {
  padding: 50%;
  position: relative
}

.NHu9kP__dex {
  height: calc(100% + 1px);
  left: 0;
  opacity: .1;
  position: absolute;
  top: 0;
  width: calc(100% + 1px)
}

.A2jJfx__dex {
  object-fit: contain
}

.B1jalG__dex {
  object-fit: cover
}

.QWwk7z__dex,
._Ojp4S__dex,
.viGsxW__dex,
.xtjUeB__dex {
  display: none
}

@media (max-width:767px) {
  .QWwk7z__dex {
    display: flex
  }
}

@media (min-width:768px) and (max-width:1023px) {
  .xtjUeB__dex {
    display: flex
  }
}

@media (min-width:1024px) and (max-width:1269px) {
  .viGsxW__dex {
    display: flex
  }
}

@media (min-width:1270px) {
  ._Ojp4S__dex {
    display: flex
  }
}

@media (max-width:767px) {
  .TNUpdV__dex {
    display: none
  }
}

@media (min-width:768px) and (max-width:1023px) {
  .lPbo5a__dex {
    display: none
  }
}

@media (min-width:1024px) and (max-width:1269px) {
  .J1R09N__dex {
    display: none
  }
}

@media (min-width:1270px) {
  .H8oIj6__dex {
    display: none
  }
}

.Tx9efZ__dex {
  color: #929292
}

.FUUlSs__dex {
  color: #3d3d3d
}

.OB5aAw__dex {
  color: #000
}

.Oa5489__dex {
  color: var(--dex-okd-color-content-primary);
  font-size: 16px;
  font-weight: 700;
  line-height: 20px;
  margin-bottom: 12px;
  margin-top: 24px
}

.ustTvU__dex {
  line-height: 22px
}

.VgK67c__dex {
  display: flex;
  gap: 8px;
  padding: 8px 24px
}

.VgK67c__dex:hover {
  background: var(--dex-okd-color-background-surface-contrast)
}

.PEZh8c__dex {
  color: var(--dex-okd-color-content-secondary);
  font-size: 14px;
  font-weight: 400;
  line-height: 22px
}

div .Tk0gtE__dex {
  color: var(--dex-okd-color-brand-primary-alternative)
}

.CIqO81__dex,
div .Tk0gtE__dex {
  font-size: 16px;
  font-weight: 700;
  margin-top: 3px
}

.CIqO81__dex {
  color: var(--dex-okd-color-semantic-negative)
}

.KjLw57__dex {
  align-items: center;
  background: var(--dex-okd-color-background-surface-primary);
  border-radius: 999px;
  display: inline-flex;
  gap: 2px;
  height: 20px;
  justify-content: center;
  margin-left: 4px;
  padding: 2px 4px
}

.ELlkfK__dex {
  margin-top: 24px
}

.i75iV4__dex {
  align-items: center;
  display: flex
}

.qZt7EH__dex {
  border: 1px solid var(--dex-okd-color-background-surface-primary);
  border-radius: 50%;
  height: 12px;
  min-height: 12px;
  min-width: 12px;
  width: 12px
}

.YSvqTY__dex,
.qZt7EH__dex {
  margin-left: -4px
}

.YSvqTY__dex:first-child {
  margin-left: 4px
}

.wp0tsP__dex {
  color: var(--dex-okd-color-content-primary);
  display: inline;
  font-size: 10px;
  font-weight: 400;
  line-height: 12px
}

.AmF1cp__dex,
.CQV78j__dex,
.GVdTvm__dex,
.WPCfVv__dex {
  display: none
}

@media (max-width:767px) {
  .CQV78j__dex {
    display: flex
  }
}

@media (min-width:768px) and (max-width:1023px) {
  .GVdTvm__dex {
    display: flex
  }
}

@media (min-width:1024px) and (max-width:1269px) {
  .WPCfVv__dex {
    display: flex
  }
}

@media (min-width:1270px) {
  .AmF1cp__dex {
    display: flex
  }
}

@media (max-width:767px) {
  .csLMWx__dex {
    display: none
  }
}

@media (min-width:768px) and (max-width:1023px) {
  .vjH2bc__dex {
    display: none
  }
}

@media (min-width:1024px) and (max-width:1269px) {
  .RBMJYG__dex {
    display: none
  }
}

@media (min-width:1270px) {
  .Dw9SwA__dex {
    display: none
  }
}

.zyhmEO__dex {
  color: #929292
}

.S2dg5O__dex {
  color: #3d3d3d
}

.OCZ_N6__dex {
  color: #000
}

.EZoTr9__dex {
  box-sizing: border-box;
  height: calc(100vh - 89px);
  padding-top: 12px
}

@media (min-width:768px) {
  .EZoTr9__dex {
    overflow: scroll
  }
}

.qXRLj___dex {
  display: flex;
  justify-content: center;
  padding-top: 40px
}

.Z0LvAm__dex {
  color: var(--dex-okd-color-content-primary);
  font-size: 16px;
  font-weight: 700;
  line-height: 20px;
  margin-top: 24px
}

.Nu8e7q__dex {
  margin-top: 48px
}

.JIorLc__dex {
  padding: 0 12px
}

.HVl67J__dex,
.lcNusv__dex {
  padding: 0 24px
}

.FZZpwx__dex,
.IzYunJ__dex,
.M0WNNK__dex,
.oLT_JW__dex {
  display: none
}

@media (max-width:767px) {
  .FZZpwx__dex {
    display: flex
  }
}

@media (min-width:768px) and (max-width:1023px) {
  .oLT_JW__dex {
    display: flex
  }
}

@media (min-width:1024px) and (max-width:1269px) {
  .M0WNNK__dex {
    display: flex
  }
}

@media (min-width:1270px) {
  .IzYunJ__dex {
    display: flex
  }
}

@media (max-width:767px) {
  .eZDX8C__dex {
    display: none
  }
}

@media (min-width:768px) and (max-width:1023px) {
  .cPSLLC__dex {
    display: none
  }
}

@media (min-width:1024px) and (max-width:1269px) {
  .hSRBH8__dex {
    display: none
  }
}

@media (min-width:1270px) {
  .D2UH1p__dex {
    display: none
  }
}

.PYosZv__dex {
  color: #929292
}

.y7C_Ub__dex {
  color: #3d3d3d
}

.TbdFTN__dex {
  color: #000
}

.ZhPyCQ__dex {
  color: var(--dex-okd-color-content-primary);
  font-size: 16px
}

.Hl1Qfe__dex,
.i7q3U6__dex,
.ras0Uo__dex,
.v654E3__dex {
  display: none
}

@media (max-width:767px) {
  .Hl1Qfe__dex {
    display: flex
  }
}

@media (min-width:768px) and (max-width:1023px) {
  .i7q3U6__dex {
    display: flex
  }
}

@media (min-width:1024px) and (max-width:1269px) {
  .v654E3__dex {
    display: flex
  }
}

@media (min-width:1270px) {
  .ras0Uo__dex {
    display: flex
  }
}

@media (max-width:767px) {
  .cFZsyy__dex {
    display: none
  }
}

@media (min-width:768px) and (max-width:1023px) {
  .ke1QdY__dex {
    display: none
  }
}

@media (min-width:1024px) and (max-width:1269px) {
  .Xwx1oU__dex {
    display: none
  }
}

@media (min-width:1270px) {
  .qbu1sa__dex {
    display: none
  }
}

.T60P3p__dex {
  color: #929292
}

.VhHgRD__dex {
  color: #3d3d3d
}

.av44SC__dex {
  color: #000
}

.Jv_eeQ__dex {
  box-sizing: border-box
}

.iNvHUo__dex {
  justify-content: space-between;
  margin-bottom: 4px
}

.iNvHUo__dex,
.iNvHUo__dex .UJInCL__dex {
  align-items: center;
  display: flex;
  gap: 8px
}

.iNvHUo__dex .UJInCL__dex {
  flex: 1 1
}

.WIXDbh__dex {
  color: var(--dex-okd-color-content-primary);
  font-size: 16px;
  font-weight: 700;
  line-height: 20px
}

.p5mmlQ__dex {
  color: var(--dex-okd-color-brand-primary-alternative);
  font-size: 16px;
  margin-right: 4px
}

.qHY_dN__dex {
  color: var(--dex-okd-color-content-contrast);
  font-size: 12px;
  font-weight: 400;
  line-height: 16px
}

.p2o_GM__dex {
  -webkit-box-orient: vertical;
  color: var(--dex-okd-color-content-secondary);
  display: -webkit-box;
  font-size: 14px;
  font-weight: 400;
  line-height: 20px;
  overflow: hidden
}

.QuYtFA__dex {
  width: 100%
}

.ubS9b4__dex {
  width: 50%
}

.I8tljP__dex {
  align-items: center;
  display: flex;
  gap: 8px;
  margin-top: 8px
}

.XfhoZu__dex {
  display: flex
}

.a9NhqB__dex {
  border: .5px solid var(--dex-okd-color-border-primary);
  border-radius: 50%;
  height: 24px;
  min-height: 24px;
  min-width: 24px;
  width: 24px
}

.SzbHlH__dex {
  color: var(--dex-okd-color-content-contrast);
  font-size: 12px;
  font-weight: 400;
  left: -14px;
  line-height: 16px;
  position: relative
}

.qV1IDJ__dex {
  align-items: flex-start;
  display: flex;
  flex-direction: column;
  gap: 8px;
  justify-content: center
}

.E6Yfnx__dex,
.RaImit__dex,
.Y3oQnR__dex,
.blh8Bv__dex {
  display: none
}

@media (max-width:767px) {
  .E6Yfnx__dex {
    display: flex
  }
}

@media (min-width:768px) and (max-width:1023px) {
  .Y3oQnR__dex {
    display: flex
  }
}

@media (min-width:1024px) and (max-width:1269px) {
  .blh8Bv__dex {
    display: flex
  }
}

@media (min-width:1270px) {
  .RaImit__dex {
    display: flex
  }
}

@media (max-width:767px) {
  .VlRffR__dex {
    display: none
  }
}

@media (min-width:768px) and (max-width:1023px) {
  .l5hdnY__dex {
    display: none
  }
}

@media (min-width:1024px) and (max-width:1269px) {
  .uRDUKo__dex {
    display: none
  }
}

@media (min-width:1270px) {
  .tE5dCP__dex {
    display: none
  }
}

.e0kTMm__dex {
  color: #929292
}

.aSbNAF__dex {
  color: #3d3d3d
}

.nffn_w__dex {
  color: #000
}

.JpzIuC__dex {
  margin-top: 8px;
  width: 100%
}

.lyhAK7__dex {
  height: 4px;
  position: relative;
  width: 100%
}

.RhAU8d__dex {
  background-color: var(--dex-okd-color-background-surface-primary);
  border-radius: 17px;
  height: 100%;
  overflow: hidden;
  width: 100%
}

.tODMIW__dex {
  background: var(--dex-okd-color-brand-primary-alternative);
  border-bottom-left-radius: 17px;
  border-bottom-right-radius: 0;
  border-top-left-radius: 17px;
  border-top-right-radius: 0;
  left: 0
}

.oud4Bo__dex,
.tODMIW__dex {
  height: 4px;
  min-width: 6px;
  position: absolute;
  top: 0;
  width: 246.952px
}

.oud4Bo__dex {
  background: var(--dex-okd-color-semantic-negative);
  border-bottom-left-radius: 0;
  border-bottom-right-radius: 17px;
  border-top-left-radius: 0;
  border-top-right-radius: 17px;
  right: 0
}

.YZnNBy__dex {
  display: flex;
  justify-content: space-between;
  margin-top: 8px
}

.doxeOw__dex {
  color: var(--dex-okd-color-brand-primary-alternative)
}

.doxeOw__dex,
.jyerzG__dex {
  font-size: 12px;
  font-weight: 700;
  line-height: 16px
}

.jyerzG__dex {
  color: var(--dex-okd-color-semantic-negative)
}

.sufLM2__dex {
  border-radius: 17px
}

.VrMlEr__dex,
.pkhstA__dex,
.uNqYOQ__dex,
.xIRDDC__dex {
  display: none
}

@media (max-width:767px) {
  .pkhstA__dex {
    display: flex
  }
}

@media (min-width:768px) and (max-width:1023px) {
  .xIRDDC__dex {
    display: flex
  }
}

@media (min-width:1024px) and (max-width:1269px) {
  .VrMlEr__dex {
    display: flex
  }
}

@media (min-width:1270px) {
  .uNqYOQ__dex {
    display: flex
  }
}

@media (max-width:767px) {
  .P7C5jS__dex {
    display: none
  }
}

@media (min-width:768px) and (max-width:1023px) {
  .HA_f9V__dex {
    display: none
  }
}

@media (min-width:1024px) and (max-width:1269px) {
  .Pcxokp__dex {
    display: none
  }
}

@media (min-width:1270px) {
  .o69xxM__dex {
    display: none
  }
}

.ON00rC__dex {
  color: #929292
}

.Tu8phQ__dex {
  color: #3d3d3d
}

.GyURc0__dex {
  color: #000
}

.Zmpgeu__dex {
  align-items: center;
  display: flex;
  gap: 8px;
  margin-top: 18px
}

.VoT7EW__dex {
  display: flex
}

.FH_SAT__dex {
  border: 1px solid var(--dex-okd-color-content-inverse);
  border-radius: 50%;
  height: 16px;
  min-height: 16px;
  min-width: 16px;
  width: 16px
}

.EnglkD__dex {
  color: var(--dex-okd-color-content-contrast);
  display: inline;
  font-size: 12px;
  font-weight: 400;
  left: -16px;
  line-height: 12px;
  position: relative
}

.JvnTBk__dex,
.QLQ33E__dex,
.jrPqrl__dex,
.xe3qBG__dex {
  display: none
}

@media (max-width:767px) {
  .jrPqrl__dex {
    display: flex
  }
}

@media (min-width:768px) and (max-width:1023px) {
  .QLQ33E__dex {
    display: flex
  }
}

@media (min-width:1024px) and (max-width:1269px) {
  .xe3qBG__dex {
    display: flex
  }
}

@media (min-width:1270px) {
  .JvnTBk__dex {
    display: flex
  }
}

@media (max-width:767px) {
  .LWDbgC__dex {
    display: none
  }
}

@media (min-width:768px) and (max-width:1023px) {
  .NyzAcC__dex {
    display: none
  }
}

@media (min-width:1024px) and (max-width:1269px) {
  .cvDAuW__dex {
    display: none
  }
}

@media (min-width:1270px) {
  .oa67FK__dex {
    display: none
  }
}

.ub1wBf__dex {
  color: #929292
}

.tQbePm__dex {
  color: #3d3d3d
}

.YmvK4X__dex {
  color: #000
}

.FAloNN__dex,
.e7PNaI__dex {
  padding-top: 40px
}

.FAloNN__dex {
  display: flex;
  justify-content: center;
  overflow: hidden
}

.EL7bBY__dex,
.WB4Rds__dex,
.i0oOip__dex,
.lroSG2__dex {
  display: none
}

@media (max-width:767px) {
  .WB4Rds__dex {
    display: flex
  }
}

@media (min-width:768px) and (max-width:1023px) {
  .i0oOip__dex {
    display: flex
  }
}

@media (min-width:1024px) and (max-width:1269px) {
  .EL7bBY__dex {
    display: flex
  }
}

@media (min-width:1270px) {
  .lroSG2__dex {
    display: flex
  }
}

@media (max-width:767px) {
  .Fo3JI6__dex {
    display: none
  }
}

@media (min-width:768px) and (max-width:1023px) {
  .jXGrFm__dex {
    display: none
  }
}

@media (min-width:1024px) and (max-width:1269px) {
  ._VXdZa__dex {
    display: none
  }
}

@media (min-width:1270px) {
  .ztevVT__dex {
    display: none
  }
}

.ZirtdT__dex {
  color: #929292
}

.lD4hD0__dex {
  color: #3d3d3d
}

._V47tm__dex {
  color: #000
}

.jo3imb__dex {
  box-sizing: border-box;
  display: flex;
  flex-direction: column;
  height: auto;
  overflow: hidden;
  padding-bottom: 50px
}

@media (min-width:768px) {
  .jo3imb__dex {
    height: 100%;
    overflow: visible
  }
}

.jo3imb__dex .iKSgub__dex {
  margin-bottom: 12px;
  width: 100%
}

.jo3imb__dex .xj7afZ__dex {
  margin-bottom: 16px
}

.jo3imb__dex .ZLW0pr__dex {
  flex: 1 1;
  padding-bottom: 2px;
  position: relative
}

.lhI7kD__dex {
  flex: 1 1 auto;
  height: auto
}

.QcH2tk__dex {
  bottom: 27px;
  left: 50%;
  transform: translateX(-50%);
  z-index: 1
}

.esVPTE__dex {
  padding: 8px 4px
}

.I998Sj__dex,
.K1JpNK__dex,
.nu6QhS__dex,
.yLVP8D__dex {
  display: none
}

@media (max-width:767px) {
  .yLVP8D__dex {
    display: flex
  }
}

@media (min-width:768px) and (max-width:1023px) {
  .K1JpNK__dex {
    display: flex
  }
}

@media (min-width:1024px) and (max-width:1269px) {
  .I998Sj__dex {
    display: flex
  }
}

@media (min-width:1270px) {
  .nu6QhS__dex {
    display: flex
  }
}

@media (max-width:767px) {
  ._0jQo3p__dex {
    display: none
  }
}

@media (min-width:768px) and (max-width:1023px) {
  .VQt03K__dex {
    display: none
  }
}

@media (min-width:1024px) and (max-width:1269px) {
  .Ndd9Gg__dex {
    display: none
  }
}

@media (min-width:1270px) {
  .iy3Ols__dex {
    display: none
  }
}

.HcX8g8__dex {
  color: #929292
}

.WIufZv__dex {
  color: #3d3d3d
}

.ahVu0a__dex {
  color: #000
}

.D589ZD__dex {
  border-bottom: .5px solid var(--dex-okd-color-border-primary);
  box-sizing: border-box;
  flex: 0 1 auto;
  padding: 0 24px 12px;
  width: 100%
}

.qQAnbE__dex {
  align-items: center;
  display: flex;
  gap: 12px
}

.OXCgaO__dex {
  border-radius: 50%;
  height: 56px;
  min-height: 56px;
  min-width: 56px;
  width: 56px
}

.OIxum6__dex {
  flex-direction: column
}

.OIxum6__dex,
.QxXSmz__dex {
  display: flex;
  gap: 8px
}

.bB_eTC__dex {
  color: var(--dex-okd-color-content-primary);
  font-size: 18px;
  font-weight: 700;
  line-height: 24px
}

div .TYPwXB__dex {
  align-items: center;
  background: var(--dex-okd-color-background-surface-primary);
  border-radius: 4px;
  border-radius: var(--Border-radius-sm, 4px);
  color: var(--dex-okd-color-content-secondary);
  display: flex;
  font-size: 12px;
  font-weight: 400;
  gap: 4px;
  line-height: 16px;
  padding: 2px 4px
}

div .qzYPnf__dex {
  font-size: 13px
}

.CwF6i3__dex {
  align-items: center;
  background: var(--dex-okd-color-background-surface-primary);
  border-radius: 4px;
  border-radius: var(--Border-radius-sm, 4px);
  color: var(--dex-okd-color-content-secondary);
  display: flex;
  font-size: 12px;
  font-weight: 400;
  gap: 2px;
  line-height: 16px;
  padding: 2px 4px
}

.A0gYIQ__dex {
  font-size: 16px
}

.F38MGb__dex {
  display: flex;
  flex-direction: column;
  gap: 4px;
  margin-top: 16px
}

.gAmMo8__dex {
  color: var(--dex-okd-color-content-primary);
  font-size: 14px;
  line-height: 20px
}

div .EZMe0m__dex,
div .ogSdOx__dex {
  color: var(--dex-okd-color-content-contrast);
  font-size: 12px
}

div .ogSdOx__dex {
  align-items: center;
  cursor: pointer;
  display: flex;
  font-weight: 400;
  gap: 4px;
  line-height: 18px
}

.x96w4G__dex {
  height: 10px;
  width: 10px
}

.YdBlHK__dex,
.jCrMig__dex,
.vbPY0Y__dex,
.zhVjV7__dex {
  display: none
}

@media (max-width:767px) {
  .zhVjV7__dex {
    display: flex
  }
}

@media (min-width:768px) and (max-width:1023px) {
  .jCrMig__dex {
    display: flex
  }
}

@media (min-width:1024px) and (max-width:1269px) {
  .YdBlHK__dex {
    display: flex
  }
}

@media (min-width:1270px) {
  .vbPY0Y__dex {
    display: flex
  }
}

@media (max-width:767px) {
  .xwlWrA__dex {
    display: none
  }
}

@media (min-width:768px) and (max-width:1023px) {
  .pmJ1fb__dex {
    display: none
  }
}

@media (min-width:1024px) and (max-width:1269px) {
  .T3ZxVM__dex {
    display: none
  }
}

@media (min-width:1270px) {
  .rWaC0C__dex {
    display: none
  }
}

.LK75dA__dex {
  color: #929292
}

.AuXhxw__dex {
  color: #3d3d3d
}

.Vs56XC__dex {
  color: #000
}

.vJcECC__dex {
  display: flex;
  flex-direction: column;
  padding-top: 22px
}

.bNZ04o__dex,
.sJC4Ne__dex,
.zgHQlh__dex,
.zuGusb__dex {
  display: none
}

@media (max-width:767px) {
  .bNZ04o__dex {
    display: flex
  }
}

@media (min-width:768px) and (max-width:1023px) {
  .sJC4Ne__dex {
    display: flex
  }
}

@media (min-width:1024px) and (max-width:1269px) {
  .zuGusb__dex {
    display: flex
  }
}

@media (min-width:1270px) {
  .zgHQlh__dex {
    display: flex
  }
}

@media (max-width:767px) {
  .ytY_Wh__dex {
    display: none
  }
}

@media (min-width:768px) and (max-width:1023px) {
  .XqHPOj__dex {
    display: none
  }
}

@media (min-width:1024px) and (max-width:1269px) {
  .s1xEgw__dex {
    display: none
  }
}

@media (min-width:1270px) {
  .jPd5GI__dex {
    display: none
  }
}

.QKWUSt__dex {
  color: #929292
}

.lyY7ma__dex {
  color: #3d3d3d
}

.dsGNDe__dex {
  color: #000
}

.DTVQF7__dex {
  display: flex;
  flex-direction: column;
  height: auto;
  overflow: hidden
}

@media (min-width:768px) {
  .DTVQF7__dex {
    height: 100%;
    overflow: visible;
    padding-bottom: 50px
  }
}

.DTVQF7__dex .PtaDXO__dex {
  margin-bottom: 12px;
  width: 100%
}

.DTVQF7__dex .KcKKiE__dex {
  margin-bottom: 16px
}

.DTVQF7__dex .izMOCw__dex {
  flex: 1 1;
  overflow: scroll;
  padding-bottom: 2px;
  position: relative
}

._n_706__dex {
  bottom: 27px;
  left: 50%;
  transform: translateX(-50%);
  z-index: 1
}

.KC39DG__dex {
  padding: 8px 4px
}

.ACqdlO__dex,
.F3J861__dex,
.MnKGiG__dex,
.nzMN8I__dex {
  display: none
}

@media (max-width:767px) {
  .F3J861__dex {
    display: flex
  }
}

@media (min-width:768px) and (max-width:1023px) {
  .ACqdlO__dex {
    display: flex
  }
}

@media (min-width:1024px) and (max-width:1269px) {
  .nzMN8I__dex {
    display: flex
  }
}

@media (min-width:1270px) {
  .MnKGiG__dex {
    display: flex
  }
}

@media (max-width:767px) {
  .Agr7NU__dex {
    display: none
  }
}

@media (min-width:768px) and (max-width:1023px) {
  .VaaK9P__dex {
    display: none
  }
}

@media (min-width:1024px) and (max-width:1269px) {
  .eLTXfk__dex {
    display: none
  }
}

@media (min-width:1270px) {
  .ltSNIH__dex {
    display: none
  }
}

.m3m0H___dex {
  color: #929292
}

.mOn5uo__dex {
  color: #3d3d3d
}

.zYYYwI__dex {
  color: #000
}

.Zay4dO__dex {
  align-items: center;
  background: var(--dex-okd-color-background-scrim);
  border: 1px solid var(--dex-okd-color-border-secondary);
  border-radius: 24px;
  cursor: pointer;
  display: flex;
  padding: 10px 23px;
  position: fixed
}

.Zay4dO__dex .voTSdi__dex {
  color: var(--dex-okd-color-content-primary);
  font-size: 20px;
  margin-right: 4px
}

.Zay4dO__dex .ranf7Y__dex {
  color: var(--dex-okd-color-content-primary);
  font-size: 14px;
  font-weight: 400;
  line-height: 16px
}

.IgBRvb__dex,
.J1pC3y__dex,
.cNlCzx__dex,
.qBVGD5__dex {
  display: none
}

@media (max-width:767px) {
  .IgBRvb__dex {
    display: flex
  }
}

@media (min-width:768px) and (max-width:1023px) {
  .qBVGD5__dex {
    display: flex
  }
}

@media (min-width:1024px) and (max-width:1269px) {
  .J1pC3y__dex {
    display: flex
  }
}

@media (min-width:1270px) {
  .cNlCzx__dex {
    display: flex
  }
}

@media (max-width:767px) {
  .pKbPZi__dex {
    display: none
  }
}

@media (min-width:768px) and (max-width:1023px) {
  .eMTwH8__dex {
    display: none
  }
}

@media (min-width:1024px) and (max-width:1269px) {
  .GZsbYA__dex {
    display: none
  }
}

@media (min-width:1270px) {
  .IKp0m8__dex {
    display: none
  }
}

.Iu6_Nb__dex {
  color: #929292
}

.ZiJ8nu__dex {
  color: #3d3d3d
}

.u10b8___dex {
  color: #000
}

.mGrMlS__dex {
  box-sizing: border-box;
  margin-bottom: 12px;
  margin-top: 16px;
  position: relative;
  width: 100%
}

.EQJsaJ__dex,
.Yu9UEC__dex,
.ZQScAV__dex,
.yHOO8D__dex {
  display: none
}

@media (max-width:767px) {
  .yHOO8D__dex {
    display: flex
  }
}

@media (min-width:768px) and (max-width:1023px) {
  .Yu9UEC__dex {
    display: flex
  }
}

@media (min-width:1024px) and (max-width:1269px) {
  .ZQScAV__dex {
    display: flex
  }
}

@media (min-width:1270px) {
  .EQJsaJ__dex {
    display: flex
  }
}

@media (max-width:767px) {
  .IKnxf1__dex {
    display: none
  }
}

@media (min-width:768px) and (max-width:1023px) {
  .K4h_re__dex {
    display: none
  }
}

@media (min-width:1024px) and (max-width:1269px) {
  .xppZj0__dex {
    display: none
  }
}

@media (min-width:1270px) {
  .Mqvk1S__dex {
    display: none
  }
}

.oWyOBf__dex {
  color: #929292
}

.N09SLY__dex {
  color: #3d3d3d
}

.FSNInR__dex {
  color: #000
}

.EnbK6F__dex {
  display: flex;
  flex-direction: column;
  height: auto;
  overflow: hidden;
  padding-bottom: 16px
}

@media (min-width:768px) {
  .EnbK6F__dex {
    overflow: visible
  }
}

.EnbK6F__dex .NrfOqG__dex {
  margin-bottom: 12px;
  width: 100%
}

.EnbK6F__dex .dYcKuo__dex {
  margin-bottom: 16px
}

.EnbK6F__dex .E8ueP4__dex {
  flex: 1 1;
  overflow: scroll;
  padding-bottom: 2px;
  position: relative
}

.fxlMnK__dex {
  display: flex;
  flex-direction: column
}

.RecEJv__dex,
.Unbfi4__dex,
.iyODRB__dex,
.sfA08G__dex {
  display: none
}

@media (max-width:767px) {
  .iyODRB__dex {
    display: flex
  }
}

@media (min-width:768px) and (max-width:1023px) {
  .sfA08G__dex {
    display: flex
  }
}

@media (min-width:1024px) and (max-width:1269px) {
  .RecEJv__dex {
    display: flex
  }
}

@media (min-width:1270px) {
  .Unbfi4__dex {
    display: flex
  }
}

@media (max-width:767px) {
  .oJbmZy__dex {
    display: none
  }
}

@media (min-width:768px) and (max-width:1023px) {
  .RwCji4__dex {
    display: none
  }
}

@media (min-width:1024px) and (max-width:1269px) {
  .vTyttE__dex {
    display: none
  }
}

@media (min-width:1270px) {
  .RoYiAM__dex {
    display: none
  }
}

.vl7ZJm__dex {
  color: #929292
}

.muT28I__dex {
  color: #3d3d3d
}

.ysI_SO__dex {
  color: #000
}

.DJF0cw__dex {
  color: var(--dex-okd-color-content-primary);
  font-size: 18px;
  font-weight: 700;
  line-height: 24px
}

.hVqzq5__dex,
.iO0HQR__dex,
.kxufne__dex,
.qXwAxE__dex {
  display: none
}

@media (max-width:767px) {
  .hVqzq5__dex {
    display: flex
  }
}

@media (min-width:768px) and (max-width:1023px) {
  .iO0HQR__dex {
    display: flex
  }
}

@media (min-width:1024px) and (max-width:1269px) {
  .kxufne__dex {
    display: flex
  }
}

@media (min-width:1270px) {
  .qXwAxE__dex {
    display: flex
  }
}

@media (max-width:767px) {
  .Dkw8cu__dex {
    display: none
  }
}

@media (min-width:768px) and (max-width:1023px) {
  .RUhnWr__dex {
    display: none
  }
}

@media (min-width:1024px) and (max-width:1269px) {
  .GDy35j__dex {
    display: none
  }
}

@media (min-width:1270px) {
  .Mnq9yU__dex {
    display: none
  }
}

.sXqU2U__dex {
  color: #929292
}

.MzqUPG__dex {
  color: #3d3d3d
}

.hCQfOX__dex {
  color: #000
}

.EILJAZ__dex {
  width: 14px
}

.XXPizp__dex {
  width: 16px
}

.XpEDcJ__dex {
  width: 20px
}

.KQCiVD__dex {
  width: 24px
}

.IUXU_3__dex {
  width: 40px
}

.QagHXb__dex {
  padding: 4px
}

.xx6zk3__dex {
  padding-left: 4px;
  padding-right: 4px
}

.xBhy0k__dex {
  padding-bottom: 4px;
  padding-top: 4px
}

.hj11qW__dex {
  margin: 4px
}

.i2ZaRh__dex {
  margin-left: 4px;
  margin-right: 4px
}

.XI6eQU__dex {
  margin: 4px auto
}

.jfegDv__dex {
  margin-bottom: 4px;
  margin-top: 4px
}

.gsgIcp__dex,
.ymtyBd__dex {
  padding: 4px 0
}

.B0UEzX__dex,
.LxMwMg__dex {
  padding: 0 4px
}

.b1afgb__dex {
  padding-left: 4px
}

.FxEWfK__dex {
  margin-left: 4px
}

.URlMIU__dex {
  padding-right: 4px
}

.SB1n96__dex {
  margin-right: 4px
}

.NUAhex__dex {
  padding-top: 4px
}

.QsOvTN__dex {
  margin-top: 4px
}

.KolLoS__dex {
  padding-bottom: 4px
}

.bA_8XS__dex {
  margin-bottom: 4px
}

.V1HPuM__dex {
  padding: 5px
}

.LODkha__dex {
  padding-left: 5px;
  padding-right: 5px
}

.vpE8oE__dex {
  padding-bottom: 5px;
  padding-top: 5px
}

.C1RCIP__dex {
  margin: 5px
}

.ga418G__dex {
  margin-left: 5px;
  margin-right: 5px
}

.dDcDkk__dex {
  margin: 5px auto
}

.M4k5_P__dex {
  margin-bottom: 5px;
  margin-top: 5px
}

.Djo2Bn__dex,
.waqEY0__dex {
  padding: 5px 0
}

.Q0gniT__dex,
.SDCboX__dex {
  padding: 0 5px
}

.SLpd5K__dex {
  padding-left: 5px
}

.hDgbs7__dex {
  margin-left: 5px
}

.CVW8ZZ__dex {
  padding-right: 5px
}

.ozvQQg__dex {
  margin-right: 5px
}

.jPx8T7__dex {
  padding-top: 5px
}

.KQi0pU__dex {
  margin-top: 5px
}

.Ekqfos__dex {
  padding-bottom: 5px
}

.yvJLG8__dex {
  margin-bottom: 5px
}

._k4ftZ__dex {
  padding: 8px
}

.lsTcjn__dex {
  padding-left: 8px;
  padding-right: 8px
}

.LJajKl__dex {
  padding-bottom: 8px;
  padding-top: 8px
}

.RGU3FB__dex {
  margin: 8px
}

.dgULBe__dex {
  margin-left: 8px;
  margin-right: 8px
}

.LSM8wp__dex {
  margin: 8px auto
}

._XRwLh__dex {
  margin-bottom: 8px;
  margin-top: 8px
}

.J82b2D__dex,
.kUHLHv__dex {
  padding: 8px 0
}

.jDGXfJ__dex,
.oIWSZ4__dex {
  padding: 0 8px
}

.p7g0Uh__dex {
  padding-left: 8px
}

.baucL2__dex {
  margin-left: 8px
}

.yMT1rn__dex {
  padding-right: 8px
}

.Q9gkk2__dex {
  margin-right: 8px
}

.RQPuOC__dex {
  padding-top: 8px
}

.a9m8Wu__dex {
  margin-top: 8px
}

.wLHIOo__dex {
  padding-bottom: 8px
}

.o98mHJ__dex {
  margin-bottom: 8px
}

.vMAIcH__dex {
  padding: 10px
}

.OuzH4S__dex {
  padding-left: 10px;
  padding-right: 10px
}

.bDAzm4__dex {
  padding-bottom: 10px;
  padding-top: 10px
}

.nQwa7___dex {
  margin: 10px
}

.zXXakD__dex {
  margin-left: 10px;
  margin-right: 10px
}

.deEGw5__dex {
  margin: 10px auto
}

.nMQSWT__dex {
  margin-bottom: 10px;
  margin-top: 10px
}

.czX2TC__dex,
.kaGZIM__dex {
  padding: 10px 0
}

.JgZWUD__dex,
.uSJFE8__dex {
  padding: 0 10px
}

.OSHjls__dex {
  padding-left: 10px
}

.T3PVur__dex {
  margin-left: 10px
}

.ounZOE__dex {
  padding-right: 10px
}

.BQGmXm__dex {
  margin-right: 10px
}

.oHxS6K__dex {
  padding-top: 10px
}

.e0vgmB__dex {
  margin-top: 10px
}

.giUIz7__dex {
  padding-bottom: 10px
}

.mHEwCL__dex {
  margin-bottom: 10px
}

.NF2osY__dex {
  padding: 11px
}

.FXYGLK__dex {
  padding-left: 11px;
  padding-right: 11px
}

.SS1tgn__dex {
  padding-bottom: 11px;
  padding-top: 11px
}

.EKiNl0__dex {
  margin: 11px
}

.dl7Bku__dex {
  margin-left: 11px;
  margin-right: 11px
}

.eVyXuU__dex {
  margin: 11px auto
}

.xwlEV7__dex {
  margin-bottom: 11px;
  margin-top: 11px
}

.JUZIaH__dex,
.g1llod__dex {
  padding: 11px 0
}

.aKnzWb__dex,
.ir9Q1K__dex {
  padding: 0 11px
}

.Og4LV2__dex {
  padding-left: 11px
}

.AIvwMi__dex {
  margin-left: 11px
}

.UDpMwK__dex {
  padding-right: 11px
}

.LAfn1Q__dex {
  margin-right: 11px
}

.tlkvev__dex {
  padding-top: 11px
}

.svQZye__dex {
  margin-top: 11px
}

.HgO9o4__dex {
  padding-bottom: 11px
}

.Dj_EJt__dex {
  margin-bottom: 11px
}

.ZuW7WM__dex {
  padding: 12px
}

.lXibXy__dex {
  padding-left: 12px;
  padding-right: 12px
}

.TvrfPE__dex {
  padding-bottom: 12px;
  padding-top: 12px
}

.antJW9__dex {
  margin: 12px
}

.wOAxeM__dex {
  margin-left: 12px;
  margin-right: 12px
}

.O314y0__dex {
  margin: 12px auto
}

.P5EEmq__dex {
  margin-bottom: 12px;
  margin-top: 12px
}

.CvQffm__dex,
.e9NJac__dex {
  padding: 12px 0
}

.fsMzPE__dex,
.noN8lJ__dex {
  padding: 0 12px
}

.KqNJbV__dex {
  padding-left: 12px
}

.rvzILA__dex {
  margin-left: 12px
}

.hH44vT__dex {
  padding-right: 12px
}

.LoKTq4__dex {
  margin-right: 12px
}

.A4axXH__dex {
  padding-top: 12px
}

.dQdzWf__dex {
  margin-top: 12px
}

.h7iDtL__dex {
  padding-bottom: 12px
}

.Y9U2vX__dex {
  margin-bottom: 12px
}

.u06vih__dex {
  padding: 15px
}

.W0tGUL__dex {
  padding-left: 15px;
  padding-right: 15px
}

.o2UieR__dex {
  padding-bottom: 15px;
  padding-top: 15px
}

.kKH3f5__dex {
  margin: 15px
}

.cQfyAf__dex {
  margin-left: 15px;
  margin-right: 15px
}

.GmEEEt__dex {
  margin: 15px auto
}

.huZDxD__dex {
  margin-bottom: 15px;
  margin-top: 15px
}

.aj0L3x__dex,
.lrZKjB__dex {
  padding: 15px 0
}

.EL6ULV__dex,
.exJUwr__dex {
  padding: 0 15px
}

.J0zhIE__dex {
  padding-left: 15px
}

.W6VsoD__dex {
  margin-left: 15px
}

.TTiUq3__dex {
  padding-right: 15px
}

.G8zKFU__dex {
  margin-right: 15px
}

.VZsBev__dex {
  padding-top: 15px
}

.zIIuhV__dex {
  margin-top: 15px
}

.a5KRKM__dex {
  padding-bottom: 15px
}

.xT2A4b__dex {
  margin-bottom: 15px
}

.UyaFnj__dex {
  padding: 16px
}

.iY2Yto__dex {
  padding-left: 16px;
  padding-right: 16px
}

.LBu0VH__dex {
  padding-bottom: 16px;
  padding-top: 16px
}

.d3GNgL__dex {
  margin: 16px
}

.c2QDqA__dex {
  margin-left: 16px;
  margin-right: 16px
}

.BrOS6T__dex {
  margin: 16px auto
}

.Wc4xp1__dex {
  margin-bottom: 16px;
  margin-top: 16px
}

.cq4XdD__dex,
.g7Ok9W__dex {
  padding: 16px 0
}

.NYKsSu__dex,
.VQVnxX__dex {
  padding: 0 16px
}

.TjkJJK__dex {
  padding-left: 16px
}

.MJsvsZ__dex {
  margin-left: 16px
}

.w9S8Fk__dex {
  padding-right: 16px
}

.QGfRgy__dex {
  margin-right: 16px
}

.vSFWjN__dex {
  padding-top: 16px
}

.mA5imQ__dex {
  margin-top: 16px
}

.rC35LJ__dex {
  padding-bottom: 16px
}

.sm6Q7d__dex {
  margin-bottom: 16px
}

.M17WX9__dex {
  padding: 17px
}

.Chi4lH__dex {
  padding-left: 17px;
  padding-right: 17px
}

.E37zMq__dex {
  padding-bottom: 17px;
  padding-top: 17px
}

.XxWVkK__dex {
  margin: 17px
}

.MgrVxc__dex {
  margin-left: 17px;
  margin-right: 17px
}

.C4TU3H__dex {
  margin: 17px auto
}

.xHhmNS__dex {
  margin-bottom: 17px;
  margin-top: 17px
}

.bP3nSB__dex,
.s6_yen__dex {
  padding: 17px 0
}

.QKDbGL__dex,
.iztVuI__dex {
  padding: 0 17px
}

.qEsmMw__dex {
  padding-left: 17px
}

.S1DTXq__dex {
  margin-left: 17px
}

.mnlAtv__dex {
  padding-right: 17px
}

.nnT4xR__dex {
  margin-right: 17px
}

._KDXdP__dex {
  padding-top: 17px
}

.fRmLS3__dex {
  margin-top: 17px
}

.Cg8GGj__dex {
  padding-bottom: 17px
}

.iM4gYt__dex {
  margin-bottom: 17px
}

.trEkKG__dex {
  padding: 20px
}

.qpH1V8__dex {
  padding-left: 20px;
  padding-right: 20px
}

.VhUs5u__dex {
  padding-bottom: 20px;
  padding-top: 20px
}

.nHigP___dex {
  margin: 20px
}

.HxuZmq__dex {
  margin-left: 20px;
  margin-right: 20px
}

.uRMIl4__dex {
  margin: 20px auto
}

.W5cFGg__dex {
  margin-bottom: 20px;
  margin-top: 20px
}

.dMQu7q__dex,
.dx3TJ___dex {
  padding: 20px 0
}

.FlxkTS__dex,
.QSnski__dex {
  padding: 0 20px
}

.WLvyRZ__dex {
  padding-left: 20px
}

.usnUhP__dex {
  margin-left: 20px
}

.hX7Wfj__dex {
  padding-right: 20px
}

.kkIBZ7__dex {
  margin-right: 20px
}

.MWeNdM__dex {
  padding-top: 20px
}

.mQSRIf__dex {
  margin-top: 20px
}

.uLpi1Y__dex {
  padding-bottom: 20px
}

.XaH8wN__dex {
  margin-bottom: 20px
}

.a4ejxR__dex {
  padding: 24px
}

.afe4Yc__dex {
  padding-left: 24px;
  padding-right: 24px
}

.QsSiMw__dex {
  padding-bottom: 24px;
  padding-top: 24px
}

.D5lKlR__dex {
  margin: 24px
}

.NHrn5U__dex {
  margin-left: 24px;
  margin-right: 24px
}

.kKYD6h__dex {
  margin: 24px auto
}

.GoWniW__dex {
  margin-bottom: 24px;
  margin-top: 24px
}

.FFP9MN__dex,
.zuRFOv__dex {
  padding: 24px 0
}

.FupjRN__dex,
.tsXrVJ__dex {
  padding: 0 24px
}

.oz_ySG__dex {
  padding-left: 24px
}

.kyYMCC__dex {
  margin-left: 24px
}

.ySfMJk__dex {
  padding-right: 24px
}

.XCwAZn__dex {
  margin-right: 24px
}

.My3N2G__dex {
  padding-top: 24px
}

.VDRuYY__dex {
  margin-top: 24px
}

.gj3xDt__dex {
  padding-bottom: 24px
}

.Hi9rea__dex {
  margin-bottom: 24px
}

.JTabPw__dex {
  padding: 25px
}

.Z0peh8__dex {
  padding-left: 25px;
  padding-right: 25px
}

.in7sqp__dex {
  padding-bottom: 25px;
  padding-top: 25px
}

.Y3XqDr__dex {
  margin: 25px
}

.eZxP8i__dex {
  margin-left: 25px;
  margin-right: 25px
}

.clb4Ng__dex {
  margin: 25px auto
}

.kBh2Zj__dex {
  margin-bottom: 25px;
  margin-top: 25px
}

.OlLnvt__dex,
.dMwXNH__dex {
  padding: 25px 0
}

.RlCvg___dex,
.g2ah2a__dex {
  padding: 0 25px
}

.zjpW7J__dex {
  padding-left: 25px
}

.klpWx___dex {
  margin-left: 25px
}

.cBsxro__dex {
  padding-right: 25px
}

.Mz56PQ__dex {
  margin-right: 25px
}

.SiCIQl__dex {
  padding-top: 25px
}

.vPpOq6__dex {
  margin-top: 25px
}

.y9n8uV__dex {
  padding-bottom: 25px
}

.LFsbsH__dex {
  margin-bottom: 25px
}

.Qx2me9__dex {
  padding: 30px
}

.yhCn24__dex {
  padding-left: 30px;
  padding-right: 30px
}

.DFZVZS__dex {
  padding-bottom: 30px;
  padding-top: 30px
}

.z1M_CT__dex {
  margin: 30px
}

.bI6_Sn__dex {
  margin-left: 30px;
  margin-right: 30px
}

.NgJfIR__dex {
  margin: 30px auto
}

.a4E2GD__dex {
  margin-bottom: 30px;
  margin-top: 30px
}

.rlJINa__dex,
.v0fQrk__dex {
  padding: 30px 0
}

.SpoUN6__dex,
.X3r7XT__dex {
  padding: 0 30px
}

.CtIkuf__dex {
  padding-left: 30px
}

.HxRaSr__dex {
  margin-left: 30px
}

.ZzdahC__dex {
  padding-right: 30px
}

.oKYLdG__dex {
  margin-right: 30px
}

.j2q3Kc__dex {
  padding-top: 30px
}

.ZN2duu__dex {
  margin-top: 30px
}

.JKDME2__dex {
  padding-bottom: 30px
}

.jFgxpd__dex {
  margin-bottom: 30px
}

.Bp_lVy__dex {
  padding: 32px
}

.Vu5KY1__dex {
  padding-left: 32px;
  padding-right: 32px
}

.LI2K8i__dex {
  padding-bottom: 32px;
  padding-top: 32px
}

.aezpmH__dex {
  margin: 32px
}

.S4mJum__dex {
  margin-left: 32px;
  margin-right: 32px
}

.tY_gHF__dex {
  margin: 32px auto
}

.ciHNvV__dex {
  margin-bottom: 32px;
  margin-top: 32px
}

.JZmWhD__dex,
.ZWOKtg__dex {
  padding: 32px 0
}

.nAl9Gw__dex,
.tKPWaz__dex {
  padding: 0 32px
}

.q6ffLG__dex {
  padding-left: 32px
}

.OpnIP0__dex {
  margin-left: 32px
}

._2eRDTl__dex {
  padding-right: 32px
}

.NBoRlr__dex {
  margin-right: 32px
}

.s41v0G__dex {
  padding-top: 32px
}

.MdGTBf__dex {
  margin-top: 32px
}

.CMJ7_n__dex {
  padding-bottom: 32px
}

.rQKSJD__dex {
  margin-bottom: 32px
}

.vOmJDK__dex {
  padding: 40px
}

.bPaZNg__dex {
  padding-left: 40px;
  padding-right: 40px
}

.yDojYn__dex {
  padding-bottom: 40px;
  padding-top: 40px
}

.focCYp__dex {
  margin: 40px
}

.Zv8hqc__dex {
  margin-left: 40px;
  margin-right: 40px
}

.O7k0b6__dex {
  margin: 40px auto
}

.TuJl0M__dex {
  margin-bottom: 40px;
  margin-top: 40px
}

.SYmF_3__dex,
.w3iSJ3__dex {
  padding: 40px 0
}

.WBlloc__dex,
.nAExmp__dex {
  padding: 0 40px
}

.CGxqJB__dex {
  padding-left: 40px
}

.PTBlhv__dex {
  margin-left: 40px
}

.ujGVn1__dex {
  padding-right: 40px
}

.ER7KXQ__dex {
  margin-right: 40px
}

.aQBLjT__dex {
  padding-top: 40px
}

.V8wjw6__dex {
  margin-top: 40px
}

.PCm4vc__dex {
  padding-bottom: 40px
}

.Az8hDN__dex {
  margin-bottom: 40px
}

.KKLe____dex {
  border-radius: 4px
}

.IuqLfi__dex {
  border-radius: 6px
}

.UBirQF__dex {
  border-radius: 8px
}

.hzttVz__dex {
  align-items: center;
  display: flex;
  flex-direction: column
}

.hzttVz__dex .MC86ry__dex {
  height: 80px;
  margin-bottom: 14px;
  min-width: 80px;
  width: 80px
}

.hzttVz__dex .KjkxMn__dex {
  height: 100%;
  width: 100%
}

.hzttVz__dex .sAZgft__dex {
  -webkit-box-orient: vertical;
  -webkit-line-clamp: 2;
  color: var(--dex-okd-color-content-primary);
  display: -webkit-box;
  font-size: 16px;
  font-weight: 500;
  line-height: 20px;
  overflow: hidden;
  text-align: center;
  text-overflow: ellipsis
}

.c88_r5__dex,
.c9nSjh__dex,
.jEv9_8__dex,
.jjJtr3__dex {
  display: none
}

@media (max-width:767px) {
  .jjJtr3__dex {
    display: flex
  }
}

@media (min-width:768px) and (max-width:1023px) {
  .c88_r5__dex {
    display: flex
  }
}

@media (min-width:1024px) and (max-width:1269px) {
  .c9nSjh__dex {
    display: flex
  }
}

@media (min-width:1270px) {
  .jEv9_8__dex {
    display: flex
  }
}

@media (max-width:767px) {
  .yP2OE2__dex {
    display: none
  }
}

@media (min-width:768px) and (max-width:1023px) {
  .PJDYow__dex {
    display: none
  }
}

@media (min-width:1024px) and (max-width:1269px) {
  .gtaXkt__dex {
    display: none
  }
}

@media (min-width:1270px) {
  .dYGVmP__dex {
    display: none
  }
}

.FVOxwN__dex {
  color: #929292
}

.O1kHYa__dex {
  color: #3d3d3d
}

.HYhRKa__dex {
  color: #000
}

.HoqBMb__dex {
  width: 14px
}

.wMEM4N__dex {
  width: 16px
}

.iIlxnO__dex {
  width: 20px
}

.roCEtn__dex {
  width: 24px
}

.e147KY__dex {
  width: 40px
}

.BthvuM__dex {
  padding: 4px
}

.ZOHsNd__dex {
  padding-left: 4px;
  padding-right: 4px
}

.pVSAxx__dex {
  padding-bottom: 4px;
  padding-top: 4px
}

.CGIyc1__dex {
  margin: 4px
}

.duB0TA__dex {
  margin-left: 4px;
  margin-right: 4px
}

.JYbkfe__dex {
  margin: 4px auto
}

.DIQTMS__dex {
  margin-bottom: 4px;
  margin-top: 4px
}

.JWmDs___dex,
.m3Czix__dex {
  padding: 4px 0
}

.D4CRnw__dex,
.Rvk5er__dex {
  padding: 0 4px
}

.T88yCK__dex {
  padding-left: 4px
}

.dya7_C__dex {
  margin-left: 4px
}

.ABr31v__dex {
  padding-right: 4px
}

.yHbVLU__dex {
  margin-right: 4px
}

.zyeMx9__dex {
  padding-top: 4px
}

.pYXnHR__dex {
  margin-top: 4px
}

.SNS3IO__dex {
  padding-bottom: 4px
}

.yEH20v__dex {
  margin-bottom: 4px
}

.FP7M3X__dex {
  padding: 5px
}

.hFcxQG__dex {
  padding-left: 5px;
  padding-right: 5px
}

.unOS9u__dex {
  padding-bottom: 5px;
  padding-top: 5px
}

._lq_gr__dex {
  margin: 5px
}

.BCbPH7__dex {
  margin-left: 5px;
  margin-right: 5px
}

.gUte0I__dex {
  margin: 5px auto
}

.lzTGGN__dex {
  margin-bottom: 5px;
  margin-top: 5px
}

.UFUCxW__dex,
.uaX5Xc__dex {
  padding: 5px 0
}

.LuH7WF__dex,
.vVzbpH__dex {
  padding: 0 5px
}

.arZxny__dex {
  padding-left: 5px
}

.lIzc8Z__dex {
  margin-left: 5px
}

.vkDBoG__dex {
  padding-right: 5px
}

._uE1p5__dex {
  margin-right: 5px
}

.MwmFry__dex {
  padding-top: 5px
}

.PMqYqP__dex {
  margin-top: 5px
}

.ffj4dT__dex {
  padding-bottom: 5px
}

.CAiwBa__dex {
  margin-bottom: 5px
}

._0dpnq__dex {
  padding: 8px
}

.drowPL__dex {
  padding-left: 8px;
  padding-right: 8px
}

.tffUXq__dex {
  padding-bottom: 8px;
  padding-top: 8px
}

.fPu4Yo__dex {
  margin: 8px
}

.HxXTug__dex {
  margin-left: 8px;
  margin-right: 8px
}

.nloct6__dex {
  margin: 8px auto
}

.Th_E7Z__dex {
  margin-bottom: 8px;
  margin-top: 8px
}

.J0YVra__dex,
.vAzm9D__dex {
  padding: 8px 0
}

.WsHobP__dex,
.atMN7j__dex {
  padding: 0 8px
}

.XAHHed__dex {
  padding-left: 8px
}

.fHNxqY__dex {
  margin-left: 8px
}

.iMIUMU__dex {
  padding-right: 8px
}

.icyI6X__dex {
  margin-right: 8px
}

.a1IybB__dex {
  padding-top: 8px
}

.BPC6pd__dex {
  margin-top: 8px
}

.gstlPk__dex {
  padding-bottom: 8px
}

.FLe1AX__dex {
  margin-bottom: 8px
}

.UZZ3qN__dex {
  padding: 10px
}

.X0h6rP__dex {
  padding-left: 10px;
  padding-right: 10px
}

.ozdehT__dex {
  padding-bottom: 10px;
  padding-top: 10px
}

.hnv_sV__dex {
  margin: 10px
}

.BS9_9V__dex {
  margin-left: 10px;
  margin-right: 10px
}

.OKwwYR__dex {
  margin: 10px auto
}

.G9QCfM__dex {
  margin-bottom: 10px;
  margin-top: 10px
}

.W5qdeZ__dex,
.b0c3Aj__dex {
  padding: 10px 0
}

.k5BSmS__dex,
.wGSmiu__dex {
  padding: 0 10px
}

.Gniduo__dex {
  padding-left: 10px
}

.VMkkaF__dex {
  margin-left: 10px
}

.zm6W1G__dex {
  padding-right: 10px
}

._i9d6i__dex {
  margin-right: 10px
}

.Y2daCi__dex {
  padding-top: 10px
}

.FmlnWu__dex {
  margin-top: 10px
}

.pWRHDp__dex {
  padding-bottom: 10px
}

.Wx45T1__dex {
  margin-bottom: 10px
}

.D8aZKx__dex {
  padding: 11px
}

.EwLX0i__dex {
  padding-left: 11px;
  padding-right: 11px
}

.UrHgNk__dex {
  padding-bottom: 11px;
  padding-top: 11px
}

.kBgKGF__dex {
  margin: 11px
}

.Zz5siI__dex {
  margin-left: 11px;
  margin-right: 11px
}

.UUnV6M__dex {
  margin: 11px auto
}

.XTqZLd__dex {
  margin-bottom: 11px;
  margin-top: 11px
}

.BhzsGc__dex,
.pVuy8f__dex {
  padding: 11px 0
}

.NPTDk7__dex,
.oPZior__dex {
  padding: 0 11px
}

.d723Ef__dex {
  padding-left: 11px
}

.w9Z5jP__dex {
  margin-left: 11px
}

.yn3XDO__dex {
  padding-right: 11px
}

.nZRQMR__dex {
  margin-right: 11px
}

.eOQ5v6__dex {
  padding-top: 11px
}

.wmYud5__dex {
  margin-top: 11px
}

.hvQ2_N__dex {
  padding-bottom: 11px
}

.xA703f__dex {
  margin-bottom: 11px
}

.oKnOvV__dex {
  padding: 12px
}

.CaYfH5__dex {
  padding-left: 12px;
  padding-right: 12px
}

.eyPwiF__dex {
  padding-bottom: 12px;
  padding-top: 12px
}

.GY9nzO__dex {
  margin: 12px
}

.BtudZK__dex {
  margin-left: 12px;
  margin-right: 12px
}

.nhQL1f__dex {
  margin: 12px auto
}

.nyFNPR__dex {
  margin-bottom: 12px;
  margin-top: 12px
}

.RE7CWF__dex,
.xwDGcZ__dex {
  padding: 12px 0
}

.g72_1v__dex,
.p6I2ft__dex {
  padding: 0 12px
}

.uQdZmg__dex {
  padding-left: 12px
}

.QIoMaF__dex {
  margin-left: 12px
}

.kGAoGF__dex {
  padding-right: 12px
}

.nExfp6__dex {
  margin-right: 12px
}

.utrl4q__dex {
  padding-top: 12px
}

.XDVC5M__dex {
  margin-top: 12px
}

.UehDOq__dex {
  padding-bottom: 12px
}

.NKRB4g__dex {
  margin-bottom: 12px
}

.O2QLZG__dex {
  padding: 15px
}

.A2Af7B__dex {
  padding-left: 15px;
  padding-right: 15px
}

.LPVs5n__dex {
  padding-bottom: 15px;
  padding-top: 15px
}

.AwaazD__dex {
  margin: 15px
}

.G3RbKc__dex {
  margin-left: 15px;
  margin-right: 15px
}

.qEuN7p__dex {
  margin: 15px auto
}

.GlnUwy__dex {
  margin-bottom: 15px;
  margin-top: 15px
}

.A7d1sk__dex,
.SuXv0e__dex {
  padding: 15px 0
}

.JvlIes__dex,
.hHiiNF__dex {
  padding: 0 15px
}

.Q_nXx0__dex {
  padding-left: 15px
}

.n4Ddtf__dex {
  margin-left: 15px
}

.mv1CNd__dex {
  padding-right: 15px
}

.amehnf__dex {
  margin-right: 15px
}

.wf78th__dex {
  padding-top: 15px
}

.gsDfJz__dex {
  margin-top: 15px
}

.L5ic8u__dex {
  padding-bottom: 15px
}

.sbjVud__dex {
  margin-bottom: 15px
}

.o7FKoL__dex {
  padding: 16px
}

.LrsNKK__dex {
  padding-left: 16px;
  padding-right: 16px
}

.FHN64o__dex {
  padding-bottom: 16px;
  padding-top: 16px
}

.Igv02w__dex {
  margin: 16px
}

.fDAJIR__dex {
  margin-left: 16px;
  margin-right: 16px
}

.PMveH___dex {
  margin: 16px auto
}

.sHP30G__dex {
  margin-bottom: 16px;
  margin-top: 16px
}

.Ik8m8w__dex,
.bO8gQK__dex {
  padding: 16px 0
}

.Y9HCVl__dex,
.iaoXAA__dex {
  padding: 0 16px
}

.C9NOTs__dex {
  padding-left: 16px
}

.c9CsFY__dex {
  margin-left: 16px
}

.DA3PVx__dex {
  padding-right: 16px
}

.FGS56S__dex {
  margin-right: 16px
}

.dWySv8__dex {
  padding-top: 16px
}

.CvNHfv__dex {
  margin-top: 16px
}

.V1kVjv__dex {
  padding-bottom: 16px
}

.fHBnfZ__dex {
  margin-bottom: 16px
}

.LTojlf__dex {
  padding: 17px
}

.DNEXOB__dex {
  padding-left: 17px;
  padding-right: 17px
}

.aFynu9__dex {
  padding-bottom: 17px;
  padding-top: 17px
}

.SWLUAx__dex {
  margin: 17px
}

.VOhT_l__dex {
  margin-left: 17px;
  margin-right: 17px
}

.nSg7su__dex {
  margin: 17px auto
}

.i9CQt8__dex {
  margin-bottom: 17px;
  margin-top: 17px
}

.JEASLB__dex,
.m6OsvN__dex {
  padding: 17px 0
}

.PS4rs4__dex,
.kUM710__dex {
  padding: 0 17px
}

.R8GZ9P__dex {
  padding-left: 17px
}

.LZxaQw__dex {
  margin-left: 17px
}

.EbSWJx__dex {
  padding-right: 17px
}

.aHaDMp__dex {
  margin-right: 17px
}

.VKhE7Y__dex {
  padding-top: 17px
}

.k96csi__dex {
  margin-top: 17px
}

.VMcImr__dex {
  padding-bottom: 17px
}

.Omx0q7__dex {
  margin-bottom: 17px
}

.Onw00H__dex {
  padding: 20px
}

.VpN20A__dex {
  padding-left: 20px;
  padding-right: 20px
}

.h2Wune__dex {
  padding-bottom: 20px;
  padding-top: 20px
}

.QhgM5a__dex {
  margin: 20px
}

.jXRgKZ__dex {
  margin-left: 20px;
  margin-right: 20px
}

.gqBys8__dex {
  margin: 20px auto
}

.N5LcTp__dex {
  margin-bottom: 20px;
  margin-top: 20px
}

.Ypokwk__dex,
.ZDbiSl__dex {
  padding: 20px 0
}

.CASCn1__dex,
.gpNSTK__dex {
  padding: 0 20px
}

.gAYlvM__dex {
  padding-left: 20px
}

.pr7cJ3__dex {
  margin-left: 20px
}

.MlQcKx__dex {
  padding-right: 20px
}

.q0E5go__dex {
  margin-right: 20px
}

.P7fltM__dex {
  padding-top: 20px
}

.FfJmSu__dex {
  margin-top: 20px
}

.OSLE3H__dex {
  padding-bottom: 20px
}

.JTjkWW__dex {
  margin-bottom: 20px
}

.S5pRhq__dex {
  padding: 24px
}

.Bkf1qp__dex {
  padding-left: 24px;
  padding-right: 24px
}

.p93HSy__dex {
  padding-bottom: 24px;
  padding-top: 24px
}

.DV7mjk__dex {
  margin: 24px
}

.VA49Y5__dex {
  margin-left: 24px;
  margin-right: 24px
}

.g2ajJL__dex {
  margin: 24px auto
}

.eUsnkx__dex {
  margin-bottom: 24px;
  margin-top: 24px
}

.vk9d4M__dex,
.zRGnjv__dex {
  padding: 24px 0
}

.F4tGm9__dex,
.r9ySSV__dex {
  padding: 0 24px
}

.cIKpd9__dex {
  padding-left: 24px
}

.QmDdA7__dex {
  margin-left: 24px
}

.B06sy9__dex {
  padding-right: 24px
}

.nuRV2J__dex {
  margin-right: 24px
}

.Zgksz4__dex {
  padding-top: 24px
}

.k8sQfB__dex {
  margin-top: 24px
}

.wI5JVi__dex {
  padding-bottom: 24px
}

.aFoANX__dex {
  margin-bottom: 24px
}

.T85ySE__dex {
  padding: 25px
}

.MB9QOh__dex {
  padding-left: 25px;
  padding-right: 25px
}

.BB7rEW__dex {
  padding-bottom: 25px;
  padding-top: 25px
}

.U_2Pq0__dex {
  margin: 25px
}

.fI9H2F__dex {
  margin-left: 25px;
  margin-right: 25px
}

.o2Jncj__dex {
  margin: 25px auto
}

.DqtLr1__dex {
  margin-bottom: 25px;
  margin-top: 25px
}

.GglIyQ__dex,
.XxURsd__dex {
  padding: 25px 0
}

.LE6ZTl__dex,
.Yjy9x1__dex {
  padding: 0 25px
}

.OCXrvg__dex {
  padding-left: 25px
}

.zWHeoB__dex {
  margin-left: 25px
}

.z0QQp6__dex {
  padding-right: 25px
}

.P1Kq2j__dex {
  margin-right: 25px
}

.TIP3en__dex {
  padding-top: 25px
}

.lWHjH3__dex {
  margin-top: 25px
}

.JsR1vO__dex {
  padding-bottom: 25px
}

.UyNCCd__dex {
  margin-bottom: 25px
}

.F4ECym__dex {
  padding: 30px
}

.NLYVQv__dex {
  padding-left: 30px;
  padding-right: 30px
}

.bq9O5f__dex {
  padding-bottom: 30px;
  padding-top: 30px
}

.NKUj5___dex {
  margin: 30px
}

.gBkC1S__dex {
  margin-left: 30px;
  margin-right: 30px
}

.SPJgaR__dex {
  margin: 30px auto
}

.GEfdXe__dex {
  margin-bottom: 30px;
  margin-top: 30px
}

.JYcQlR__dex,
.U2EU8F__dex {
  padding: 30px 0
}

.db_z3d__dex,
.nSF78o__dex {
  padding: 0 30px
}

.M03dEJ__dex {
  padding-left: 30px
}

.Ute5ut__dex {
  margin-left: 30px
}

.rJyQYF__dex {
  padding-right: 30px
}

.ljXcHj__dex {
  margin-right: 30px
}

.f7bbpD__dex {
  padding-top: 30px
}

.QfOdhV__dex {
  margin-top: 30px
}

.dDXgUj__dex {
  padding-bottom: 30px
}

.CybHEX__dex {
  margin-bottom: 30px
}

.FLUmwc__dex {
  padding: 32px
}

.O10jSH__dex {
  padding-left: 32px;
  padding-right: 32px
}

.RXOICi__dex {
  padding-bottom: 32px;
  padding-top: 32px
}

.Hsw7FM__dex {
  margin: 32px
}

.GHjU4t__dex {
  margin-left: 32px;
  margin-right: 32px
}

.k1sze7__dex {
  margin: 32px auto
}

.u8jEVm__dex {
  margin-bottom: 32px;
  margin-top: 32px
}

.psI958__dex,
.qJU5AB__dex {
  padding: 32px 0
}

.AUX6Sr__dex,
.lRaIAq__dex {
  padding: 0 32px
}

.GAv8QB__dex {
  padding-left: 32px
}

.HEVGzL__dex {
  margin-left: 32px
}

.dul8ml__dex {
  padding-right: 32px
}

.xXtsyV__dex {
  margin-right: 32px
}

.zD5sOk__dex {
  padding-top: 32px
}

.kk8TpO__dex {
  margin-top: 32px
}

.YuD78B__dex {
  padding-bottom: 32px
}

.elRXuZ__dex {
  margin-bottom: 32px
}

.yIoDWp__dex {
  padding: 40px
}

._09m_rs__dex {
  padding-left: 40px;
  padding-right: 40px
}

.kO96PM__dex {
  padding-bottom: 40px;
  padding-top: 40px
}

._k1Ox6__dex {
  margin: 40px
}

.R_Mt6P__dex {
  margin-left: 40px;
  margin-right: 40px
}

.h5kPgf__dex {
  margin: 40px auto
}

.k3FpuK__dex {
  margin-bottom: 40px;
  margin-top: 40px
}

.alvsWB__dex,
.apYxx___dex {
  padding: 40px 0
}

.kMk6Bw__dex,
.yOdGhJ__dex {
  padding: 0 40px
}

.Rhdf8U__dex {
  padding-left: 40px
}

.PXbRzU__dex {
  margin-left: 40px
}

.EL1Zij__dex {
  padding-right: 40px
}

.K4NKub__dex {
  margin-right: 40px
}

.jw6p33__dex {
  padding-top: 40px
}

.wwYip4__dex {
  margin-top: 40px
}

.S8pnxV__dex {
  padding-bottom: 40px
}

.oPqfFr__dex {
  margin-bottom: 40px
}

.almkM3__dex {
  border-radius: 4px
}

.jUf4Nh__dex {
  border-radius: 6px
}

.mRZS05__dex {
  border-radius: 8px
}

.zLKpxd__dex {
  display: flex;
  flex-direction: column;
  height: 100%
}

.yFDLFy__dex {
  margin-bottom: 16px;
  margin-left: 24px
}

.CZYWsK__dex {
  flex: 1 1;
  height: calc(100% - 214px);
  margin-top: 32px
}

.GB9yOh__dex {
  bottom: 27px;
  left: 50%;
  transform: translateX(-50%);
  z-index: 1
}

.T2Fvfi__dex {
  padding: 16px 4px
}

.PA2fUo__dex {
  padding: 0 16px
}

.CKlTP8__dex {
  flex: 0 0 auto;
  margin-left: 5px
}

.anue_9__dex,
.xfwamR__dex,
.yMf0JO__dex,
.zRaSNN__dex {
  display: none
}

@media (max-width:767px) {
  .xfwamR__dex {
    display: flex
  }
}

@media (min-width:768px) and (max-width:1023px) {
  .anue_9__dex {
    display: flex
  }
}

@media (min-width:1024px) and (max-width:1269px) {
  .yMf0JO__dex {
    display: flex
  }
}

@media (min-width:1270px) {
  .zRaSNN__dex {
    display: flex
  }
}

@media (max-width:767px) {
  .pw6Lkv__dex {
    display: none
  }
}

@media (min-width:768px) and (max-width:1023px) {
  .RoGVg8__dex {
    display: none
  }
}

@media (min-width:1024px) and (max-width:1269px) {
  .Yn8ZoM__dex {
    display: none
  }
}

@media (min-width:1270px) {
  .hZPpEB__dex {
    display: none
  }
}

.fyF01n__dex {
  color: #929292
}

.WNixQu__dex {
  color: #3d3d3d
}

.so3cPm__dex {
  color: #000
}

.oAkB77__dex {
  color: var(--dex-okd-color-content-disabled);
  cursor: pointer;
  font-size: 16px
}

.oAkB77__dex:hover {
  color: var(--dex-okd-color-content-primary)
}

.bRuAo5__dex {
  align-items: stretch;
  display: flex;
  gap: 8px
}

.OyUg9B__dex {
  border-right: 1px solid var(--dex-okd-color-border-primary);
  width: 0
}

.hs0nzO__dex {
  color: var(--dex-okd-color-content-tertiary);
  display: flex;
  font-size: 12px;
  font-weight: 400;
  gap: 8px;
  line-height: 16px
}

.RMlM_b__dex {
  display: flex;
  flex-direction: column;
  height: 100%
}

.z4FIAJ__dex {
  flex: 0 1 auto;
  padding: 0 24px
}

.PJTB0Z__dex {
  align-items: center;
  display: flex;
  justify-content: space-between
}

.Gijtrx__dex {
  flex: 1 1 auto;
  min-height: 0;
  overflow: auto
}

.SCvy40__dex {
  background: var(--dc-okd-color-background-base-secondary);
  padding: 0 24px 8px;
  position: -webkit-sticky;
  position: sticky;
  top: 0;
  transition: transform .3s ease-in-out;
  z-index: 999
}

.SCvy40__dex.ILDkPB__dex {
  transform: translateY(0)
}

.SCvy40__dex.ewrnhL__dex {
  transform: translateY(-100px)
}

.h8jvJ0__dex {
  align-items: center;
  display: flex;
  gap: 8px
}

.oL0ZLH__dex {
  bottom: 27px;
  left: 50%;
  transform: translateX(-50%);
  z-index: 9
}

.tA8wvU__dex {
  height: 100%
}

.PsIHn0__dex {
  display: flex;
  flex-direction: column;
  height: 100%
}

.vgFR8s__dex {
  flex: 0 1 auto;
  padding: 0 24px
}

.xqiFTD__dex {
  align-items: center;
  display: flex;
  justify-content: space-between
}

.beHoUJ__dex {
  flex: 1 1 auto;
  min-height: 0;
  overflow: auto
}

.WEcFqX__dex {
  background-color: var(--dex-okd-color-content-inverse);
  border: 1px solid var(--dex-okd-color-background-surface-pressed);
  border-radius: 100px;
  color: var(--dex-okd-color-content-primary);
  cursor: pointer
}

.WEcFqX__dex.Jd8ib5__dex {
  font-size: 24px;
  padding: 7px
}

.WEcFqX__dex.vuyzdh__dex {
  font-size: 14px;
  padding: 4px
}

.DTCCd___dex,
.XCNk1q__dex,
.lEFwT2__dex,
.oCS52x__dex {
  display: none
}

@media (max-width:767px) {
  .lEFwT2__dex {
    display: flex
  }
}

@media (min-width:768px) and (max-width:1023px) {
  .XCNk1q__dex {
    display: flex
  }
}

@media (min-width:1024px) and (max-width:1269px) {
  .DTCCd___dex {
    display: flex
  }
}

@media (min-width:1270px) {
  .oCS52x__dex {
    display: flex
  }
}

@media (max-width:767px) {
  .ZJusqX__dex {
    display: none
  }
}

@media (min-width:768px) and (max-width:1023px) {
  .cOD4UF__dex {
    display: none
  }
}

@media (min-width:1024px) and (max-width:1269px) {
  .EXQyaQ__dex {
    display: none
  }
}

@media (min-width:1270px) {
  .b9ncb___dex {
    display: none
  }
}

.Q3dUXk__dex {
  color: #929292
}

.qnoa16__dex {
  color: #3d3d3d
}

.NqEpwa__dex {
  color: #000
}

.AJeoJt__dex {
  width: 14px
}

.ahQmiK__dex {
  width: 16px
}

._yQQgz__dex {
  width: 20px
}

.EgC0CP__dex {
  width: 24px
}

.I7DWQq__dex {
  width: 40px
}

._VvWiC__dex {
  padding: 4px
}

.I10MO7__dex {
  padding-left: 4px;
  padding-right: 4px
}

.o6DFTF__dex {
  padding-bottom: 4px;
  padding-top: 4px
}

.tymT4E__dex {
  margin: 4px
}

.hjHzHb__dex {
  margin-left: 4px;
  margin-right: 4px
}

.r561o7__dex {
  margin: 4px auto
}

.TuZbrw__dex {
  margin-bottom: 4px;
  margin-top: 4px
}

.IugVXD__dex,
.tb81GM__dex {
  padding: 4px 0
}

.QJOPCb__dex,
._TSq2O__dex {
  padding: 0 4px
}

.pEuiky__dex {
  padding-left: 4px
}

.dzajyn__dex {
  margin-left: 4px
}

._fLaaT__dex {
  padding-right: 4px
}

._O3SGu__dex {
  margin-right: 4px
}

.MPqCaT__dex {
  padding-top: 4px
}

.HAM15m__dex {
  margin-top: 4px
}

.YWvNLE__dex {
  padding-bottom: 4px
}

.WnnY1G__dex {
  margin-bottom: 4px
}

.Cg4PjI__dex {
  padding: 5px
}

.QPAujy__dex {
  padding-left: 5px;
  padding-right: 5px
}

.NefAht__dex {
  padding-bottom: 5px;
  padding-top: 5px
}

.uXAXtQ__dex {
  margin: 5px
}

.kmBzM___dex {
  margin-left: 5px;
  margin-right: 5px
}

.JHeI0T__dex {
  margin: 5px auto
}

.RUqTI2__dex {
  margin-bottom: 5px;
  margin-top: 5px
}

.lvvT6q__dex,
.rvs2Bg__dex {
  padding: 5px 0
}

.DkuZ4G__dex,
.b_LaLB__dex {
  padding: 0 5px
}

.XjxV4E__dex {
  padding-left: 5px
}

._4ADXqH__dex {
  margin-left: 5px
}

.JuvAco__dex {
  padding-right: 5px
}

.gNa6bw__dex {
  margin-right: 5px
}

.uNl9zg__dex {
  padding-top: 5px
}

.ST4pwq__dex {
  margin-top: 5px
}

.AQKx_2__dex {
  padding-bottom: 5px
}

.PK75Gh__dex {
  margin-bottom: 5px
}

.mVK8xY__dex {
  padding: 8px
}

.qzSyPY__dex {
  padding-left: 8px;
  padding-right: 8px
}

.wOpUuW__dex {
  padding-bottom: 8px;
  padding-top: 8px
}

.d9K0ma__dex {
  margin: 8px
}

.SCDuLD__dex {
  margin-left: 8px;
  margin-right: 8px
}

.SCjKKS__dex {
  margin: 8px auto
}

.NhleXd__dex {
  margin-bottom: 8px;
  margin-top: 8px
}

.IbMMyd__dex,
.TkZzjS__dex {
  padding: 8px 0
}

.g_yEOd__dex,
.gcWNyo__dex {
  padding: 0 8px
}

.h4uBHZ__dex {
  padding-left: 8px
}

.iNICrr__dex {
  margin-left: 8px
}

.imsAQj__dex {
  padding-right: 8px
}

.ADBuGk__dex {
  margin-right: 8px
}

.KtX9D2__dex {
  padding-top: 8px
}

.vsaif2__dex {
  margin-top: 8px
}

.susBfP__dex {
  padding-bottom: 8px
}

.QnOE2o__dex {
  margin-bottom: 8px
}

.txGcw3__dex {
  padding: 10px
}

.NNeCGJ__dex {
  padding-left: 10px;
  padding-right: 10px
}

.lEPWxi__dex {
  padding-bottom: 10px;
  padding-top: 10px
}

.dKLMNW__dex {
  margin: 10px
}

.sLMZyf__dex {
  margin-left: 10px;
  margin-right: 10px
}

.VxBqyE__dex {
  margin: 10px auto
}

.OC1huf__dex {
  margin-bottom: 10px;
  margin-top: 10px
}

.BihdM6__dex,
.kcVBys__dex {
  padding: 10px 0
}

.NBPrL6__dex,
.YKMoas__dex {
  padding: 0 10px
}

.N5jEzk__dex {
  padding-left: 10px
}

.MQ_F2d__dex {
  margin-left: 10px
}

.iukbYo__dex {
  padding-right: 10px
}

.nhuQBp__dex {
  margin-right: 10px
}

.Cl3M9N__dex {
  padding-top: 10px
}

.mnGoex__dex {
  margin-top: 10px
}

.prgi0e__dex {
  padding-bottom: 10px
}

.J2Oltn__dex {
  margin-bottom: 10px
}

.TF8_76__dex {
  padding: 11px
}

.iTqG7x__dex {
  padding-left: 11px;
  padding-right: 11px
}

.USFY4b__dex {
  padding-bottom: 11px;
  padding-top: 11px
}

.OJdBxA__dex {
  margin: 11px
}

.oirj9l__dex {
  margin-left: 11px;
  margin-right: 11px
}

.rRgpVp__dex {
  margin: 11px auto
}

.O2_1yA__dex {
  margin-bottom: 11px;
  margin-top: 11px
}

.GvYAQb__dex,
.HojldO__dex {
  padding: 11px 0
}

.L5QX82__dex,
.TSkkP8__dex {
  padding: 0 11px
}

._rt7qD__dex {
  padding-left: 11px
}

.b6IEYy__dex {
  margin-left: 11px
}

.ZT4A26__dex {
  padding-right: 11px
}

.w3kIMP__dex {
  margin-right: 11px
}

.bMp5BP__dex {
  padding-top: 11px
}

.SluFxg__dex {
  margin-top: 11px
}

.rY1RGf__dex {
  padding-bottom: 11px
}

.RcCWCd__dex {
  margin-bottom: 11px
}

.Y4u9Rf__dex {
  padding: 12px
}

.vpqugc__dex {
  padding-left: 12px;
  padding-right: 12px
}

.w8vrWP__dex {
  padding-bottom: 12px;
  padding-top: 12px
}

.KnGP0R__dex {
  margin: 12px
}

.yE2wEi__dex {
  margin-left: 12px;
  margin-right: 12px
}

.yrQn9S__dex {
  margin: 12px auto
}

.l7p5Su__dex {
  margin-bottom: 12px;
  margin-top: 12px
}

.emwgqh__dex,
.t8_Gp2__dex {
  padding: 12px 0
}

.QMrfvy__dex,
.uHkrAd__dex {
  padding: 0 12px
}

.Jtsjwj__dex {
  padding-left: 12px
}

.EXw3pZ__dex {
  margin-left: 12px
}

.EXXKhQ__dex {
  padding-right: 12px
}

.sV0Vgd__dex {
  margin-right: 12px
}

.eJZYT9__dex {
  padding-top: 12px
}

.jF1eLG__dex {
  margin-top: 12px
}

.AdxFOA__dex {
  padding-bottom: 12px
}

.SPEldH__dex {
  margin-bottom: 12px
}

.lz_Xat__dex {
  padding: 15px
}

.XQrDgn__dex {
  padding-left: 15px;
  padding-right: 15px
}

.JPrxa9__dex {
  padding-bottom: 15px;
  padding-top: 15px
}

.oGDn5K__dex {
  margin: 15px
}

.pEyVr0__dex {
  margin-left: 15px;
  margin-right: 15px
}

.v6Udmb__dex {
  margin: 15px auto
}

.JhfSoR__dex {
  margin-bottom: 15px;
  margin-top: 15px
}

.ZrXK_G__dex,
.mbXGAw__dex {
  padding: 15px 0
}

.eTOXcp__dex,
.u6rKbt__dex {
  padding: 0 15px
}

.vEt7y2__dex {
  padding-left: 15px
}

.VM7G91__dex {
  margin-left: 15px
}

.UBtRBy__dex {
  padding-right: 15px
}

.WsuIzj__dex {
  margin-right: 15px
}

.p7d5Pi__dex {
  padding-top: 15px
}

.tN1Fcz__dex {
  margin-top: 15px
}

.lReXEZ__dex {
  padding-bottom: 15px
}

.DwT8Mn__dex {
  margin-bottom: 15px
}

.KWh8jb__dex {
  padding: 16px
}

.ZOQKw___dex {
  padding-left: 16px;
  padding-right: 16px
}

.s_EOrt__dex {
  padding-bottom: 16px;
  padding-top: 16px
}

.KbxOip__dex {
  margin: 16px
}

.LF7C5k__dex {
  margin-left: 16px;
  margin-right: 16px
}

.TllaTI__dex {
  margin: 16px auto
}

.bOTgBm__dex {
  margin-bottom: 16px;
  margin-top: 16px
}

.Y5dHLk__dex,
.c5KBDj__dex {
  padding: 16px 0
}

.KOZaqa__dex,
.qPPGqi__dex {
  padding: 0 16px
}

.l40YdL__dex {
  padding-left: 16px
}

.AFbZfK__dex {
  margin-left: 16px
}

.KD5wrH__dex {
  padding-right: 16px
}

.yqd1_4__dex {
  margin-right: 16px
}

.K5sKyE__dex {
  padding-top: 16px
}

.y0jksP__dex {
  margin-top: 16px
}

.wd43NP__dex {
  padding-bottom: 16px
}

.oUAzgq__dex {
  margin-bottom: 16px
}

.c1ziTD__dex {
  padding: 17px
}

.OqiBvU__dex {
  padding-left: 17px;
  padding-right: 17px
}

.y23M2G__dex {
  padding-bottom: 17px;
  padding-top: 17px
}

.FryMwA__dex {
  margin: 17px
}

.mo_lmy__dex {
  margin-left: 17px;
  margin-right: 17px
}

.f9wU35__dex {
  margin: 17px auto
}

.AdurVx__dex {
  margin-bottom: 17px;
  margin-top: 17px
}

.xpwSWT__dex,
.yXOVFU__dex {
  padding: 17px 0
}

.BzZjBF__dex,
.Tdnwo5__dex {
  padding: 0 17px
}

.R0gJnd__dex {
  padding-left: 17px
}

.uoF1l1__dex {
  margin-left: 17px
}

.sQ7286__dex {
  padding-right: 17px
}

.KfQ6Ni__dex {
  margin-right: 17px
}

.FukbRk__dex {
  padding-top: 17px
}

.h7rPm1__dex {
  margin-top: 17px
}

.ILEJnt__dex {
  padding-bottom: 17px
}

.OWMp0T__dex {
  margin-bottom: 17px
}

.oSinqD__dex {
  padding: 20px
}

.iElR40__dex {
  padding-left: 20px;
  padding-right: 20px
}

.oXQQTU__dex {
  padding-bottom: 20px;
  padding-top: 20px
}

.lXhDXe__dex {
  margin: 20px
}

.abJads__dex {
  margin-left: 20px;
  margin-right: 20px
}

.aEWTZ7__dex {
  margin: 20px auto
}

.jFwoK1__dex {
  margin-bottom: 20px;
  margin-top: 20px
}

.HaowRD__dex,
.eti7mR__dex {
  padding: 20px 0
}

.D0d5a4__dex,
.jXdBBJ__dex {
  padding: 0 20px
}

.m7VbpE__dex {
  padding-left: 20px
}

.njBDUA__dex {
  margin-left: 20px
}

.Q1gPGw__dex {
  padding-right: 20px
}

.cEpT7l__dex {
  margin-right: 20px
}

.BwBMQQ__dex {
  padding-top: 20px
}

.r4SuFz__dex {
  margin-top: 20px
}

.n3MPGV__dex {
  padding-bottom: 20px
}

.Y695N6__dex {
  margin-bottom: 20px
}

.isD7Lp__dex {
  padding: 24px
}

.FoJMYW__dex {
  padding-left: 24px;
  padding-right: 24px
}

._XsEoZ__dex {
  padding-bottom: 24px;
  padding-top: 24px
}

.Ei4KYj__dex {
  margin: 24px
}

.qw5y2Z__dex {
  margin-left: 24px;
  margin-right: 24px
}

.C_ZMZH__dex {
  margin: 24px auto
}

.nvLAI3__dex {
  margin-bottom: 24px;
  margin-top: 24px
}

.eCkjsG__dex,
.sRuElO__dex {
  padding: 24px 0
}

.infyTV__dex,
.wN1eYC__dex {
  padding: 0 24px
}

.Rh3g28__dex {
  padding-left: 24px
}

.ks9QLP__dex {
  margin-left: 24px
}

.PbnUjO__dex {
  padding-right: 24px
}

.FouIbI__dex {
  margin-right: 24px
}

.wwZb3q__dex {
  padding-top: 24px
}

._0Ttdz__dex {
  margin-top: 24px
}

.Lrvrjw__dex {
  padding-bottom: 24px
}

.yg7HwO__dex {
  margin-bottom: 24px
}

.odKYp0__dex {
  padding: 25px
}

.FAJG3m__dex {
  padding-left: 25px;
  padding-right: 25px
}

.aw5Cys__dex {
  padding-bottom: 25px;
  padding-top: 25px
}

.sgwGSE__dex {
  margin: 25px
}

.tpsUw5__dex {
  margin-left: 25px;
  margin-right: 25px
}

._xdIwg__dex {
  margin: 25px auto
}

.kTORSc__dex {
  margin-bottom: 25px;
  margin-top: 25px
}

.FEo_Dz__dex,
.MbqSGt__dex {
  padding: 25px 0
}

.qoXB8b__dex,
.qpbCqB__dex {
  padding: 0 25px
}

.puR1eC__dex {
  padding-left: 25px
}

.GkZt92__dex {
  margin-left: 25px
}

.d6gBS7__dex {
  padding-right: 25px
}

.VsSWei__dex {
  margin-right: 25px
}

.lHKz_k__dex {
  padding-top: 25px
}

.sG32Xy__dex {
  margin-top: 25px
}

.RMF4ZY__dex {
  padding-bottom: 25px
}

.V09r_0__dex {
  margin-bottom: 25px
}

.uYirDY__dex {
  padding: 30px
}

.Afj4qj__dex {
  padding-left: 30px;
  padding-right: 30px
}

.EuBVJk__dex {
  padding-bottom: 30px;
  padding-top: 30px
}

.ct7P7n__dex {
  margin: 30px
}

.Cce84l__dex {
  margin-left: 30px;
  margin-right: 30px
}

.uE8dFJ__dex {
  margin: 30px auto
}

.c8cGVO__dex {
  margin-bottom: 30px;
  margin-top: 30px
}

.FfPufL__dex,
.b5KdBU__dex {
  padding: 30px 0
}

.Y6NJx1__dex,
.bs7r88__dex {
  padding: 0 30px
}

.IQZ7Ri__dex {
  padding-left: 30px
}

._5Gs6_Y__dex {
  margin-left: 30px
}

.b6Trvg__dex {
  padding-right: 30px
}

.rl0xLm__dex {
  margin-right: 30px
}

.XyzOAl__dex {
  padding-top: 30px
}

.jUrxjO__dex {
  margin-top: 30px
}

.jSpPh3__dex {
  padding-bottom: 30px
}

.HeuW5W__dex {
  margin-bottom: 30px
}

.JIUgXl__dex {
  padding: 32px
}

.qXw4VR__dex {
  padding-left: 32px;
  padding-right: 32px
}

.tPm21N__dex {
  padding-bottom: 32px;
  padding-top: 32px
}

.XApEwl__dex {
  margin: 32px
}

.JQf8dX__dex {
  margin-left: 32px;
  margin-right: 32px
}

.mUP_TB__dex {
  margin: 32px auto
}

.y9F1ey__dex {
  margin-bottom: 32px;
  margin-top: 32px
}

.cfdRav__dex,
.ewjwoE__dex {
  padding: 32px 0
}

.jEGTI9__dex,
.yQ5pNL__dex {
  padding: 0 32px
}

.rcn8cB__dex {
  padding-left: 32px
}

.Q5pL0c__dex {
  margin-left: 32px
}

.X7QtvB__dex {
  padding-right: 32px
}

.jkxUwv__dex {
  margin-right: 32px
}

.RaRx_F__dex {
  padding-top: 32px
}

.WQ2Al5__dex {
  margin-top: 32px
}

.OqnlYw__dex {
  padding-bottom: 32px
}

.qnVCtI__dex {
  margin-bottom: 32px
}

.idGT4B__dex {
  padding: 40px
}

.xXxw4b__dex {
  padding-left: 40px;
  padding-right: 40px
}

.gy7uvT__dex {
  padding-bottom: 40px;
  padding-top: 40px
}

.t_UBYP__dex {
  margin: 40px
}

.kD5UKD__dex {
  margin-left: 40px;
  margin-right: 40px
}

.dJAPts__dex {
  margin: 40px auto
}

.xkJ15S__dex {
  margin-bottom: 40px;
  margin-top: 40px
}

.AAwYMG__dex,
.KQwnCH__dex {
  padding: 40px 0
}

.F8jCwi__dex,
.vfzYgz__dex {
  padding: 0 40px
}

.cV5C8o__dex {
  padding-left: 40px
}

.Tz3oxx__dex {
  margin-left: 40px
}

.cYawsS__dex {
  padding-right: 40px
}

.CgfvYi__dex {
  margin-right: 40px
}

.eJIj6S__dex {
  padding-top: 40px
}

.skrw1A__dex {
  margin-top: 40px
}

.x0AOZ6__dex {
  padding-bottom: 40px
}

._zkvm4__dex {
  margin-bottom: 40px
}

.MPbFht__dex {
  border-radius: 4px
}

.KglwIi__dex {
  border-radius: 6px
}

.p1OBDP__dex {
  border-radius: 8px
}

.S8Og_K__dex {
  position: relative
}

.viL5Yx__dex {
  height: auto;
  line-height: normal
}

.DzdbhD__dex {
  -webkit-filter: blur(40px);
  filter: blur(40px);
  height: 80%;
  left: 0;
  opacity: .2;
  padding: 40px;
  position: absolute;
  top: 10px
}

@media (min-width:1024px) {
  .DzdbhD__dex {
    height: 70%
  }
}

@media (min-width:1270px) {
  .DzdbhD__dex {
    height: 80%
  }
}

.v5cVkk__dex {
  flex-shrink: 0;
  padding-left: 0;
  padding-right: 0
}

.wCx575__dex {
  margin-top: 16px;
  position: relative
}

@media (min-width:768px) {
  .wCx575__dex {
    height: 100%;
    margin-top: 21px
  }
}

@media (min-width:1024px) {
  .wCx575__dex {
    margin-top: 36px
  }
}

@media (min-width:1270px) {
  .wCx575__dex {
    margin-top: 37px
  }
}

.udeHAn__dex {
  background-color: #000;
  height: 343px;
  position: relative;
  width: 100px
}

@media (min-width:768px) {
  .udeHAn__dex {
    height: 273px;
    overflow: hidden
  }
}

@media (min-width:1024px) {
  .udeHAn__dex {
    height: 304px
  }
}

@media (min-width:1270px) {
  .udeHAn__dex {
    height: 393px
  }
}

.lWWR_l__dex {
  border: 1px solid #6e6e6e;
  border-radius: 16px;
  display: block;
  height: 343px;
  isolation: isolate;
  overflow: hidden;
  position: relative
}

@media (min-width:768px) {
  .lWWR_l__dex {
    border: none;
    border-radius: 0;
    height: 273px
  }
}

@media (min-width:1024px) {
  .lWWR_l__dex {
    height: 304px
  }
}

@media (min-width:1270px) {
  .lWWR_l__dex {
    height: 393px
  }
}

.lWWR_l__dex .rp0nj6__dex {
  height: 300px;
  overflow: hidden;
  width: 204px
}

@media (min-width:768px) {
  .lWWR_l__dex .rp0nj6__dex {
    border: 1px solid #424242;
    border-radius: 16px;
    height: 224px
  }
}

@media (min-width:1024px) {
  .lWWR_l__dex .rp0nj6__dex {
    height: 216px
  }
}

@media (min-width:1270px) {
  .lWWR_l__dex .rp0nj6__dex {
    height: 287px
  }
}

.lWWR_l__dex .lsVaGq__dex {
  height: 100%;
  object-fit: cover;
  transition: transform .3s ease
}

.lWWR_l__dex .roEsxD__dex {
  background: linear-gradient(180deg, transparent, #000 36.8%);
  bottom: 0;
  padding: 23px 15px;
  position: absolute
}

.lWWR_l__dex .OOASOK__dex {
  -webkit-box-orient: vertical;
  -webkit-line-clamp: 2;
  color: #fff;
  display: -webkit-box;
  font-size: 18px;
  font-weight: 700;
  line-height: normal;
  overflow: hidden;
  text-overflow: ellipsis
}

.lWWR_l__dex .Mkd8lO__dex {
  margin-top: 6px
}

.lWWR_l__dex .JVF4p7__dex {
  color: #929292;
  font-size: 12px;
  font-weight: 500;
  height: 16px;
  line-height: 16px
}

.lWWR_l__dex .gf77Bc__dex {
  color: #fff;
  font-size: 12px;
  font-weight: 700;
  height: 16px;
  line-height: 16px;
  margin-left: 4px
}

.lWWR_l__dex .B7CQSi__dex {
  align-items: center;
  color: #929292;
  display: flex;
  font-size: 12px;
  font-weight: 500;
  height: 16px;
  line-height: 16px;
  margin-top: 6px
}

.lWWR_l__dex .qOiTEa__dex {
  animation: fkA3ni__dex 2.5s infinite;
  background-color: #bcff2f;
  border-radius: 6px;
  display: inline-block;
  height: 6px;
  margin-right: 4px;
  width: 6px
}

.lWWR_l__dex .roEsxD__dex .jtoNoU__dex {
  height: 16px;
  margin-left: 3px;
  position: relative;
  top: 2px;
  width: 16px
}

@keyframes fkA3ni__dex {

  0%,
  to {
    opacity: 1
  }

  50% {
    opacity: .2
  }
}

@media (min-width:768px) {
  .lWWR_l__dex .roEsxD__dex {
    height: 124px;
    padding: 41px 12px 0
  }
}

@media (min-width:1024px) {
  .lWWR_l__dex .roEsxD__dex {
    height: 151px;
    padding: 49px 12px 0
  }

  .lWWR_l__dex .OOASOK__dex {
    font-size: 20px
  }
}

@media (min-width:1270px) {
  .lWWR_l__dex .roEsxD__dex {
    height: 178px;
    padding: 52px 14px 0
  }

  .lWWR_l__dex .OOASOK__dex {
    font-size: 20px
  }

  .lWWR_l__dex .B7CQSi__dex,
  .lWWR_l__dex .JVF4p7__dex,
  .lWWR_l__dex .gf77Bc__dex {
    font-size: 14px
  }
}

@media (min-width:768px) {
  .wCx575__dex {
    margin-top: 38px
  }

  .udeHAn__dex:hover .rp0nj6__dex {
    border: 1px solid #bcff2f
  }

  .udeHAn__dex:hover .lsVaGq__dex {
    transform: scale(1.1)
  }
}

div .wQt5Yt__dex {
  position: static
}

.D8QOv1__dex,
.PUbjL0__dex {
  align-items: center;
  border-radius: 50%;
  cursor: pointer;
  display: flex;
  justify-content: center;
  position: absolute;
  top: 50%;
  z-index: 1
}

.PUbjL0__dex {
  left: 0;
  transform: translate(-50%, -50%)
}

.D8QOv1__dex {
  right: 0;
  transform: translate(50%, -50%)
}

@font-face {
  font-family: swiper-icons;
  font-style: normal;
  font-weight: 400;
  src: url("data:application/font-woff;charset=utf-8;base64, d09GRgABAAAAAAZgABAAAAAADAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAABGRlRNAAAGRAAAABoAAAAci6qHkUdERUYAAAWgAAAAIwAAACQAYABXR1BPUwAABhQAAAAuAAAANuAY7+xHU1VCAAAFxAAAAFAAAABm2fPczU9TLzIAAAHcAAAASgAAAGBP9V5RY21hcAAAAkQAAACIAAABYt6F0cBjdnQgAAACzAAAAAQAAAAEABEBRGdhc3AAAAWYAAAACAAAAAj//wADZ2x5ZgAAAywAAADMAAAD2MHtryVoZWFkAAABbAAAADAAAAA2E2+eoWhoZWEAAAGcAAAAHwAAACQC9gDzaG10eAAAAigAAAAZAAAArgJkABFsb2NhAAAC0AAAAFoAAABaFQAUGG1heHAAAAG8AAAAHwAAACAAcABAbmFtZQAAA/gAAAE5AAACXvFdBwlwb3N0AAAFNAAAAGIAAACE5s74hXjaY2BkYGAAYpf5Hu/j+W2+MnAzMYDAzaX6QjD6/4//Bxj5GA8AuRwMYGkAPywL13jaY2BkYGA88P8Agx4j+/8fQDYfA1AEBWgDAIB2BOoAeNpjYGRgYNBh4GdgYgABEMnIABJzYNADCQAACWgAsQB42mNgYfzCOIGBlYGB0YcxjYGBwR1Kf2WQZGhhYGBiYGVmgAFGBiQQkOaawtDAoMBQxXjg/wEGPcYDDA4wNUA2CCgwsAAAO4EL6gAAeNpj2M0gyAACqxgGNWBkZ2D4/wMA+xkDdgAAAHjaY2BgYGaAYBkGRgYQiAHyGMF8FgYHIM3DwMHABGQrMOgyWDLEM1T9/w8UBfEMgLzE////P/5//f/V/xv+r4eaAAeMbAxwIUYmIMHEgKYAYjUcsDAwsLKxc3BycfPw8jEQA/gZBASFhEVExcQlJKWkZWTl5BUUlZRVVNXUNTQZBgMAAMR+E+gAEQFEAAAAKgAqACoANAA+AEgAUgBcAGYAcAB6AIQAjgCYAKIArAC2AMAAygDUAN4A6ADyAPwBBgEQARoBJAEuATgBQgFMAVYBYAFqAXQBfgGIAZIBnAGmAbIBzgHsAAB42u2NMQ6CUAyGW568x9AneYYgm4MJbhKFaExIOAVX8ApewSt4Bic4AfeAid3VOBixDxfPYEza5O+Xfi04YADggiUIULCuEJK8VhO4bSvpdnktHI5QCYtdi2sl8ZnXaHlqUrNKzdKcT8cjlq+rwZSvIVczNiezsfnP/uznmfPFBNODM2K7MTQ45YEAZqGP81AmGGcF3iPqOop0r1SPTaTbVkfUe4HXj97wYE+yNwWYxwWu4v1ugWHgo3S1XdZEVqWM7ET0cfnLGxWfkgR42o2PvWrDMBSFj/IHLaF0zKjRgdiVMwScNRAoWUoH78Y2icB/yIY09An6AH2Bdu/UB+yxopYshQiEvnvu0dURgDt8QeC8PDw7Fpji3fEA4z/PEJ6YOB5hKh4dj3EvXhxPqH/SKUY3rJ7srZ4FZnh1PMAtPhwP6fl2PMJMPDgeQ4rY8YT6Gzao0eAEA409DuggmTnFnOcSCiEiLMgxCiTI6Cq5DZUd3Qmp10vO0LaLTd2cjN4fOumlc7lUYbSQcZFkutRG7g6JKZKy0RmdLY680CDnEJ+UMkpFFe1RN7nxdVpXrC4aTtnaurOnYercZg2YVmLN/d/gczfEimrE/fs/bOuq29Zmn8tloORaXgZgGa78yO9/cnXm2BpaGvq25Dv9S4E9+5SIc9PqupJKhYFSSl47+Qcr1mYNAAAAeNptw0cKwkAAAMDZJA8Q7OUJvkLsPfZ6zFVERPy8qHh2YER+3i/BP83vIBLLySsoKimrqKqpa2hp6+jq6RsYGhmbmJqZSy0sraxtbO3sHRydnEMU4uR6yx7JJXveP7WrDycAAAAAAAH//wACeNpjYGRgYOABYhkgZgJCZgZNBkYGLQZtIJsFLMYAAAw3ALgAeNolizEKgDAQBCchRbC2sFER0YD6qVQiBCv/H9ezGI6Z5XBAw8CBK/m5iQQVauVbXLnOrMZv2oLdKFa8Pjuru2hJzGabmOSLzNMzvutpB3N42mNgZGBg4GKQYzBhYMxJLMlj4GBgAYow/P/PAJJhLM6sSoWKfWCAAwDAjgbRAAB42mNgYGBkAIIbCZo5IPrmUn0hGA0AO8EFTQAA")
}

:root {
  --swiper-theme-color: #007aff
}

.swiper {
  list-style: none;
  margin-left: auto;
  margin-right: auto;
  overflow: hidden;
  padding: 0;
  position: relative;
  z-index: 1
}

.swiper-vertical>.swiper-wrapper {
  flex-direction: column
}

.swiper-wrapper {
  box-sizing: initial;
  display: flex;
  height: 100%;
  position: relative;
  transition-property: transform;
  width: 100%;
  z-index: 1
}

.swiper-android .swiper-slide,
.swiper-wrapper {
  transform: translateZ(0)
}

.swiper-pointer-events {
  touch-action: pan-y
}

.swiper-pointer-events.swiper-vertical {
  touch-action: pan-x
}

.swiper-slide {
  flex-shrink: 0;
  height: 100%;
  position: relative;
  transition-property: transform;
  width: 100%
}

.swiper-slide-invisible-blank {
  visibility: hidden
}

.swiper-autoheight,
.swiper-autoheight .swiper-slide {
  height: auto
}

.swiper-autoheight .swiper-wrapper {
  align-items: flex-start;
  transition-property: transform, height
}

.swiper-backface-hidden .swiper-slide {
  -webkit-backface-visibility: hidden;
  backface-visibility: hidden;
  transform: translateZ(0)
}

.swiper-3d,
.swiper-3d.swiper-css-mode .swiper-wrapper {
  perspective: 1200px
}

.swiper-3d .swiper-cube-shadow,
.swiper-3d .swiper-slide,
.swiper-3d .swiper-slide-shadow,
.swiper-3d .swiper-slide-shadow-bottom,
.swiper-3d .swiper-slide-shadow-left,
.swiper-3d .swiper-slide-shadow-right,
.swiper-3d .swiper-slide-shadow-top,
.swiper-3d .swiper-wrapper {
  transform-style: preserve-3d
}

.swiper-3d .swiper-slide-shadow,
.swiper-3d .swiper-slide-shadow-bottom,
.swiper-3d .swiper-slide-shadow-left,
.swiper-3d .swiper-slide-shadow-right,
.swiper-3d .swiper-slide-shadow-top {
  height: 100%;
  left: 0;
  pointer-events: none;
  position: absolute;
  top: 0;
  width: 100%;
  z-index: 10
}

.swiper-3d .swiper-slide-shadow {
  background: rgba(0, 0, 0, .15)
}

.swiper-3d .swiper-slide-shadow-left {
  background-image: linear-gradient(270deg, rgba(0, 0, 0, .5), transparent)
}

.swiper-3d .swiper-slide-shadow-right {
  background-image: linear-gradient(90deg, rgba(0, 0, 0, .5), transparent)
}

.swiper-3d .swiper-slide-shadow-top {
  background-image: linear-gradient(0deg, rgba(0, 0, 0, .5), transparent)
}

.swiper-3d .swiper-slide-shadow-bottom {
  background-image: linear-gradient(180deg, rgba(0, 0, 0, .5), transparent)
}

.swiper-css-mode>.swiper-wrapper {
  -ms-overflow-style: none;
  overflow: auto;
  scrollbar-width: none
}

.swiper-css-mode>.swiper-wrapper::-webkit-scrollbar {
  display: none
}

.swiper-css-mode>.swiper-wrapper>.swiper-slide {
  scroll-snap-align: start start
}

.swiper-horizontal.swiper-css-mode>.swiper-wrapper {
  -webkit-scroll-snap-type: x mandatory;
  -ms-scroll-snap-type: x mandatory;
  scroll-snap-type: x mandatory
}

.swiper-vertical.swiper-css-mode>.swiper-wrapper {
  -webkit-scroll-snap-type: y mandatory;
  -ms-scroll-snap-type: y mandatory;
  scroll-snap-type: y mandatory
}

.swiper-centered>.swiper-wrapper:before {
  content: "";
  flex-shrink: 0;
  order: 9999
}

.swiper-centered.swiper-horizontal>.swiper-wrapper>.swiper-slide:first-child {
  -webkit-margin-start: var(--swiper-centered-offset-before);
  -moz-margin-start: var(--swiper-centered-offset-before);
  margin-inline-start: var(--swiper-centered-offset-before)
}

.swiper-centered.swiper-horizontal>.swiper-wrapper:before {
  height: 100%;
  min-height: 1px;
  width: var(--swiper-centered-offset-after)
}

.swiper-centered.swiper-vertical>.swiper-wrapper>.swiper-slide:first-child {
  -webkit-margin-before: var(--swiper-centered-offset-before);
  margin-block-start: var(--swiper-centered-offset-before)
}

.swiper-centered.swiper-vertical>.swiper-wrapper:before {
  height: var(--swiper-centered-offset-after);
  min-width: 1px;
  width: 100%
}

.swiper-centered>.swiper-wrapper>.swiper-slide {
  scroll-snap-align: center center;
  scroll-snap-stop: always
}

.EGavt7__dex,
.FUpjKd__dex,
.IQy4CA__dex,
.yypHQe__dex {
  display: none
}

@media (max-width:767px) {
  .FUpjKd__dex {
    display: flex
  }
}

@media (min-width:768px) and (max-width:1023px) {
  .EGavt7__dex {
    display: flex
  }
}

@media (min-width:1024px) and (max-width:1269px) {
  .IQy4CA__dex {
    display: flex
  }
}

@media (min-width:1270px) {
  .yypHQe__dex {
    display: flex
  }
}

@media (max-width:767px) {
  .qrQwbB__dex {
    display: none
  }
}

@media (min-width:768px) and (max-width:1023px) {
  .dwDaiK__dex {
    display: none
  }
}

@media (min-width:1024px) and (max-width:1269px) {
  .hKiYae__dex {
    display: none
  }
}

@media (min-width:1270px) {
  .mtSay8__dex {
    display: none
  }
}

.eKtJqU__dex {
  color: #929292
}

.PFZtCt__dex {
  color: #3d3d3d
}

.oZLtmx__dex {
  color: #000
}

.mDalc4__dex {
  background: var(--dex-okd-color-background-base-primary);
  bottom: 0;
  left: 0;
  position: fixed;
  right: 0;
  top: 0;
  z-index: 11000
}

.mDalc4__dex .wbqvvk__dex {
  color: var(--dex-okd-color-content-primary);
  font-size: 16px;
  font-weight: 400;
  left: 50%;
  line-height: 20px;
  position: absolute;
  text-align: center;
  top: 52px;
  transform: translateX(-50%)
}

.mDalc4__dex div .Agr0wC__dex {
  background-color: var(--dex-okd-color-content-primary);
  border-radius: 50%;
  color: var(--dex-okd-color-content-inverse);
  font-size: 24px;
  padding: 8px;
  position: absolute;
  right: 12vw;
  top: 8vh;
  z-index: 10
}

.mDalc4__dex .zBNoXj__dex {
  align-items: center;
  background: var(--dex-okd-color-background-base-primary);
  display: flex;
  height: 100%;
  justify-content: center;
  width: 100%
}

.mDalc4__dex .zBNoXj__dex .G5qOZ___dex {
  width: 90vw
}

.mDalc4__dex .zBNoXj__dex .G5qOZ___dex .swiper-container {
  height: 100%
}

@media (min-width:1024px) {
  .mDalc4__dex .zBNoXj__dex .G5qOZ___dex {
    margin-left: 700px;
    margin-right: 700px
  }
}

.mDalc4__dex .zBNoXj__dex .G5qOZ___dex .q7ARUC__dex {
  align-items: center;
  display: flex;
  height: 100%;
  justify-content: center;
  width: 100%
}

.mDalc4__dex .zBNoXj__dex .G5qOZ___dex .VBUW3y__dex,
.mDalc4__dex .zBNoXj__dex .G5qOZ___dex .gXpTmL__dex {
  height: 70vh;
  object-fit: contain;
  width: 70vw
}

.mDalc4__dex .zBNoXj__dex .lyE370__dex {
  align-items: center;
  display: flex;
  height: 100%;
  justify-content: center;
  overflow: hidden;
  width: 100%
}

.mDalc4__dex .zBNoXj__dex .RnDbiv__dex {
  background: var(--dex-okd-color-background-surface-secondary);
  border-radius: 16px;
  padding: 16px;
  width: 0
}

@media (min-width:768px) {
  .mDalc4__dex .zBNoXj__dex .RnDbiv__dex {
    width: 272px
  }
}

@media (min-width:1024px) {
  .mDalc4__dex .zBNoXj__dex .RnDbiv__dex {
    width: 354px
  }
}

.VgV4ne__dex {
  margin-right: 6px;
  position: relative
}

.ZklJji__dex {
  border-radius: 50%;
  height: 20px;
  vertical-align: middle;
  width: 20px
}

.FpXQ29__dex {
  border-radius: 50%;
  height: 12px;
  position: absolute;
  right: -3px;
  width: 12px
}

.gyLraJ__dex {
  margin-left: 6px
}

.opRSZK__dex {
  padding: 16px
}

.xFyUFB__dex {
  display: flex;
  flex-wrap: wrap;
  gap: 16px;
  margin-bottom: 16px
}

.BTtPbR__dex {
  margin-top: 20px
}

.j9stt2__dex {
  align-items: center;
  display: flex;
  gap: 8px
}

.ZPWTql__dex {
  width: 200px
}

.yQGn83__dex {
  -webkit-font-feature-settings: "liga" off, "clig" off;
  font-feature-settings: "liga" off, "clig" off;
  color: #0569ff;
  color: var(--Day-Blue-700, #0569ff);
  font-size: 14px;
  font-weight: 500;
  line-height: 16px
}

.gIuvqM__dex {
  border-radius: 50%;
  display: inline-block;
  height: 24px;
  overflow: hidden;
  width: 24px
}

._1cYj___dex {
  align-items: center;
  display: flex;
  width: 100%
}

.T9f8IA__dex {
  display: flex;
  flex-direction: column;
  justify-content: center
}

.FFGrjK__dex {
  color: var(--dex-okd-color-content-contrast);
  font-size: 12px;
  margin-top: 2px
}

.XjGuTe__dex {
  margin-right: 12px;
  position: relative
}

.GfGxE7__dex {
  border-radius: 50%;
  bottom: 6px;
  height: 12px;
  position: absolute;
  right: -4px;
  width: 12px
}

.I4s19T__dex {
  color: var(--dex-okd-color-content-contrast);
  font-size: 12px;
  font-style: normal;
  font-weight: 400;
  line-height: 16px
}

.wpivt3__dex {
  height: 100%;
  margin: 0 auto;
  max-width: 1024px;
  padding: 0 24px;
  transition: transform .5s ease-in-out
}

@media (max-width:767px) {
  .wpivt3__dex {
    padding: 0
  }
}

.MyQisH__dex {
  height: calc(100vh - 64px);
  overflow-y: hidden
}

@media (min-width:1024px) {
  .MyQisH__dex {
    height: 100%
  }
}

.inGKpm__dex {
  transform: translateY(-98px)
}

.FABRUG__dex {
  height: 100%;
  padding-left: 8px;
  padding-right: 8px
}

@media (min-width:768px) {
  .FABRUG__dex {
    padding-left: 12px;
    padding-right: 12px
  }
}

@media (min-width:1024px) {
  .FABRUG__dex {
    padding-left: calc(50% - 480px);
    padding-right: calc(50% - 480px)
  }
}

@media (min-width:1270px) {
  .FABRUG__dex {
    padding-left: calc(50% - 624px);
    padding-right: calc(50% - 624px)
  }
}

@media (min-width:768px) {
  .FABRUG__dex {
    box-sizing: border-box;
    padding-left: 12px;
    padding-right: 12px;
    width: 100%
  }
}

@media (max-width:767px) {
  .FABRUG__dex {
    box-sizing: border-box;
    padding-left: 8px;
    padding-right: 8px;
    width: 100%
  }
}

.FABRUG__dex.JhWWqg__dex {
  height: auto
}

.FABRUG__dex.JhWWqg__dex .YvWljM__dex {
  padding-bottom: 0
}

@media (min-width:768px) {
  .FABRUG__dex {
    padding-left: 0;
    padding-right: 0
  }
}

.FABRUG__dex .YvWljM__dex .AdPgP9__dex {
  height: 48px
}

.YvWljM__dex {
  box-sizing: border-box;
  display: flex;
  flex-direction: column;
  height: 100%;
  overflow: hidden;
  padding-bottom: 16px
}

@media (min-width:768px) {
  .YvWljM__dex {
    padding-bottom: 24px
  }
}

.MyCLWh__dex .LaxCro__dex {
  margin: 4px 0 10px
}

.hQXaoJ__dex {
  -webkit-line-clamp: 2;
  -webkit-box-orient: vertical;
  display: -webkit-box;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: normal
}

.Gi52dj__dex {
  -webkit-line-clamp: 5
}

.JMBJTA__dex.JIek8Z__dex {
  width: 480px
}

.wpivt3__dex .YvWljM__dex .UIcGPE__dex {
  border-radius: 4px;
  padding: 6px 12px
}

.so7Enh__dex {
  align-items: center;
  display: flex;
  flex-shrink: 0;
  height: 48px;
  justify-content: space-between
}

@media (max-width:767px) {
  .so7Enh__dex {
    padding: 0 8px
  }
}

.E3QMRY__dex:before {
  display: inline-block
}

.NTMB0l__dex {
  align-items: center;
  color: var(--dex-okd-color-text-primary);
  cursor: pointer;
  display: flex;
  flex-shrink: 0;
  font-size: 12px;
  gap: 4px;
  height: 28px;
  margin-left: 24px
}

.Tfs9Gm__dex {
  color: var(--dex-okd-color-content-contrast)
}

.rA2zsn__dex {
  font-size: 20px
}

.ATNnFk__dex {
  color: var(--color-up-text)
}

.hpgeP9__dex {
  color: var(--color-down-text)
}

.wmvtc6__dex {
  color: var(--dex-okd-color-content-primary);
  font-size: 14px;
  font-weight: 500;
  line-height: 16px;
  margin-bottom: 6px
}

.xRjVaN__dex {
  color: var(--dex-okd-color-content-contrast);
  display: flex;
  font-size: 12px;
  font-weight: 400;
  justify-content: space-between;
  line-height: 16px;
  margin-top: 4px
}

.iFAfVP__dex {
  display: flex;
  flex-direction: column
}

.iFAfVP__dex .jI9M3i__dex {
  color: #909090;
  color: var(--dex-okd-color-content-contrast, #909090);
  display: grid;
  grid-auto-flow: column;
  grid-template-columns: 50% 50%
}

.iFAfVP__dex .jI9M3i__dex p {
  font-size: 12px;
  margin: 4px 0 12px
}

.iFAfVP__dex .jI9M3i__dex .JFNy_g__dex {
  align-items: flex-end;
  display: flex;
  flex-direction: column;
  text-align: right
}

.XCYd_G__dex {
  display: flex;
  flex-direction: column
}

.XCYd_G__dex .UYG0_N__dex {
  background: var(--dex-okd-color-background-surface-pressed);
  border-radius: 10px;
  display: grid;
  grid-auto-flow: column;
  grid-template-columns: repeat(auto-fill, 1fr);
  width: 100%
}

.XCYd_G__dex .UYG0_N__dex .CqJOi1__dex,
.XCYd_G__dex .UYG0_N__dex .ExjFil__dex,
.XCYd_G__dex .UYG0_N__dex .lZ7LcB__dex {
  border-radius: 10px;
  height: 6px
}

.XCYd_G__dex .UYG0_N__dex .lZ7LcB__dex {
  background-color: var(--global-color-surface-pnl-profit-graph)
}

.XCYd_G__dex .UYG0_N__dex .lZ7LcB__dex.Q07BmS__dex {
  border-radius: 10px 0 0 10px
}

.XCYd_G__dex .UYG0_N__dex .lZ7LcB__dex.gX2WCK__dex {
  border-radius: 10px
}

.XCYd_G__dex .UYG0_N__dex .GAvSLp__dex {
  background-color: var(--global-color-surface-pnl-loss-graph)
}

.XCYd_G__dex .UYG0_N__dex .GAvSLp__dex.Q07BmS__dex {
  border-radius: 0 10px 10px 0
}

.XCYd_G__dex .UYG0_N__dex .GAvSLp__dex.gX2WCK__dex {
  border-radius: 10px
}

.XCYd_G__dex .UYG0_N__dex .ExjFil__dex.Q07BmS__dex {
  background-color: var(--dex-okd-color-common-background-2)
}

.yQomFb__dex {
  border-radius: 2px;
  flex-shrink: 0;
  font-size: 12px;
  font-weight: 500;
  height: 16px;
  line-height: 16px;
  text-align: center;
  width: 16px
}

.yQomFb__dex.CvHkVQ__dex {
  background-color: rgba(var(--color-up-text-rgb), 10%);
  color: var(--color-up-text)
}

.yQomFb__dex.x32WdF__dex {
  background-color: rgba(var(--color-down-text-rgb), 10%);
  color: var(--color-down-text)
}

.O08x0u__dex {
  align-items: center;
  display: flex;
  gap: 6px
}

.KoVnoJ__dex {
  flex: 1 1;
  overflow: hidden
}

._bGpvF__dex {
  display: flex;
  gap: 12px
}

.BedTu9__dex {
  font-size: 12px;
  line-height: 16px;
  width: 84px
}

.BedTu9__dex,
.OJW5z4__dex {
  display: flex;
  flex-direction: column
}

.OJW5z4__dex {
  flex: 1 1;
  gap: 6px
}

.Kn6aOE__dex {
  display: flex;
  font-size: 12px;
  justify-content: space-between;
  line-height: 16px
}

.Kn6aOE__dex .hLdJh___dex,
.Kn6aOE__dex .ijVGvQ__dex {
  gap: 4px
}

.kZenMT__dex {
  width: 100%
}

.Isq9iX__dex {
  align-items: center;
  border-bottom: 1px solid transparent;
  box-sizing: border-box;
  display: flex;
  font-size: 12px;
  gap: 4px;
  height: 28px;
  justify-content: space-between;
  padding: 0 4px 0 6px
}

.Isq9iX__dex:hover {
  border-color: var(--dex-okd-color-border-secondary)
}

.Isq9iX__dex.gilk0J__dex,
.Isq9iX__dex.gilk0J__dex:hover {
  border-color: var(--dex-okd-color-border-selected)
}

.Isq9iX__dex.gilk0J__dex .AERRDz__dex {
  color: var(--dex-okd-color-content-primary)
}

.Isq9iX__dex.gilk0J__dex .ydlJQC__dex {
  color: var(--dex-okd-color-content-secondary)
}

.Isq9iX__dex .H7zT0g__dex:focus-visible {
  outline-offset: -2px
}

.H7zT0g__dex {
  align-items: center;
  box-sizing: border-box;
  display: flex;
  font-size: 12px;
  font-weight: 400;
  gap: 4px;
  height: 100%;
  line-height: 16px
}

.H7zT0g__dex .j6VZrL__dex {
  height: 100%;
  object-fit: cover;
  width: 100%
}

.CzYMRZ__dex {
  border-radius: 50%;
  height: 16px;
  overflow: hidden;
  width: 16px
}

.HKYdY5__dex {
  width: 32px
}

.ydlJQC__dex {
  font-weight: 500
}

.AERRDz__dex,
.ydlJQC__dex {
  color: var(--dex-okd-color-content-disabled)
}

.AERRDz__dex {
  font-weight: 700;
  max-width: 128px
}

.LR215o__dex {
  overflow: hidden;
  transition: width .2s ease-in-out;
  width: 0
}

.Isq9iX__dex:hover .LR215o__dex {
  width: 16px
}

.AR8C5o__dex {
  color: var(--dex-okd-color-content-contrast)
}

.lI7_Ki__dex {
  pointer-events: none
}

.yPETYk__dex {
  min-width: 0
}

.yPETYk__dex .dpOGd9__dex.dpOGd9__dex {
  left: -14px
}

.yPETYk__dex .WGqOsm__dex.WGqOsm__dex {
  right: -14px
}

.Oa5RNp__dex {
  border-radius: 4px 4px 0 0;
  cursor: pointer
}

.l3qqW5__dex {
  background: var(--dex-okd-color-background-surface-pressed);
  z-index: 9
}

.gb5cKW__dex {
  height: 24px;
  width: 100%
}

.hS_YtL__dex {
  align-items: center;
  border-radius: var(--dex-okd-border-radius-md);
  box-sizing: border-box;
  display: flex;
  padding: 0 16px
}

.HqNccR__dex,
.hS_YtL__dex {
  height: 28px;
  width: 100vw
}

.gAH7gK__dex {
  display: flex;
  justify-content: flex-end;
  margin-bottom: 12px
}

.gAH7gK__dex,
.v5M9iH__dex {
  color: var(--dex-okd-color-content-primary)
}

.v5M9iH__dex {
  font-size: 20px;
  font-weight: 700;
  line-height: 28px;
  margin-bottom: 10px;
  margin-top: 24px
}

.BgXwcL__dex {
  color: var(--dex-okd-color-content-disabled);
  font-size: 14px;
  line-height: 22px
}

.o2RUbN__dex {
  align-items: center;
  display: flex;
  justify-content: space-between;
  margin-top: 12px
}

.EfdKpi__dex {
  display: flex;
  gap: 4px
}

.EfdKpi__dex .Dfu3DJ__dex {
  align-items: center;
  display: flex;
  height: 20px;
  width: 20px
}

.EfdKpi__dex .DVgjRw__dex {
  background: var(--dex-okd-color-background-surface-primary);
  height: 2px;
  width: 20px
}

.EfdKpi__dex .Jbaexs__dex {
  background: var(--dex-okd-color-brand-primary-alternative)
}

.JSvR_Q__dex {
  border: .5px solid rgba(var(--dex-okd-color-border-primary-rgb), .6);
  border-radius: 8px;
  height: 315px;
  overflow: hidden;
  position: relative;
  width: 560px
}

.gOnGZz__dex,
.iHKHZX__dex {
  height: 315px;
  left: 0;
  position: absolute;
  top: 0;
  width: 560px
}

.gOnGZz__dex {
  z-index: 2
}

.iHKHZX__dex {
  z-index: 1
}

.n8pD9z__dex,
.vx7CPG__dex {
  height: 315px;
  width: 560px
}

.yq8fpI__dex {
  padding: 20px
}

.UCYcVu__dex {
  display: flex;
  gap: 12px
}

.NTQGlE__dex {
  background-color: var(--dex-okd-color-background-base-primary);
  height: 100vh
}

.as39vr__dex {
  padding-top: 300px;
  width: 100%
}

.zGSohP__dex {
  border: none
}

@media (min-width:1024px) {
  .AtNd7g__dex {
    width: 420px
  }
}

.A57uEu__dex {
  padding: 14px
}

.zJZTN9__dex {
  margin: 24px auto 20px;
  text-align: center
}

.RyZZQq__dex {
  color: var(--dex-okd-color-content-primary);
  font-size: 24px;
  font-weight: 700;
  line-height: 28px;
  margin: 24px 0 16px;
  text-align: center
}

.cfEsw___dex {
  color: var(--dex-okd-color-content-secondary);
  font-size: 14px;
  font-weight: 400;
  line-height: 22px;
  margin: 0 auto;
  text-align: center;
  width: -webkit-fit-content;
  width: -moz-fit-content;
  width: fit-content;
  word-break: break-word
}

.U94x0d__dex {
  margin: 40px 0 12px
}

.LG78l8__dex .yOIhjF__dex {
  padding: 0
}

.MJruul__dex {
  background: var(--dex-okd-color-background-surface-primary);
  border-radius: 6px;
  color: var(--dex-okd-color-content-secondary)
}

.rt9Oaj__dex.HnNLsH__dex {
  align-items: center;
  color: var(--dex-okd-color-content-contrast);
  cursor: pointer;
  display: flex;
  gap: 4px;
  padding: 4px 6px;
  position: relative
}

.rt9Oaj__dex.HnNLsH__dex.bEF_pk__dex,
.rt9Oaj__dex.HnNLsH__dex:hover {
  background: var(--dex-okd-color-background-surface-primary);
  border-radius: 6px;
  color: var(--dex-okd-color-content-secondary)
}

.YD4d5q__dex {
  align-items: center;
  display: flex;
  flex-wrap: nowrap;
  font-size: 12px;
  font-weight: 500;
  line-height: 16px
}

.gtAZTu__dex {
  border-radius: 8px
}

.AIw0FC__dex {
  border-radius: 6px;
  width: 100%
}

.E6bYkJ__dex {
  align-items: center;
  border-radius: 8px;
  color: var(--dex-okd-color-content-contrast);
  cursor: pointer;
  display: flex;
  font-size: 14px;
  height: 28px;
  line-height: 16px;
  padding: 0 8px
}

.AednVK__dex {
  background: var(--dex-okd-color-background-surface-pressed);
  border-radius: 8px;
  color: var(--dex-okd-color-content-primary);
  font-weight: 500
}

.RtA6Qq__dex {
  border-radius: 8px;
  display: flex;
  justify-content: center;
  line-height: 28px;
  padding: 4px
}

.CEqSC1__dex {
  border-radius: 50%;
  height: 20px;
  vertical-align: middle;
  width: 20px
}

.BSZCHt__dex,
.ggBxo0__dex {
  color: var(--dex-okd-color-content-primary)
}

.ggBxo0__dex {
  font-size: 16px;
  font-weight: 700;
  line-height: 20px;
  padding: 14px 16px
}

.VUG9md__dex {
  align-items: center;
  display: flex;
  width: 100%
}

.Qh5kCJ__dex {
  margin-right: 12px
}

.KPfp1O__dex,
.Qh5kCJ__dex {
  color: var(--dex-okd-color-content-primary);
  vertical-align: middle
}

.Oxf9sI__dex {
  border-radius: 50%;
  margin-right: 12px;
  vertical-align: middle
}

._nuHZK__dex {
  color: var(--dex-okd-color-content-primary);
  flex: 1 1;
  font-size: 14px;
  line-height: 16px;
  text-align: left
}

.R6dr3m__dex {
  padding-top: 32px
}

.gYvTsY__dex {
  align-items: center;
  background: var(--dex-okd-color-background-base-secondary);
  border-radius: 8px;
  display: flex;
  gap: 8px;
  height: 32px;
  margin-left: auto;
  padding: 0 8px;
  width: -webkit-fit-content;
  width: -moz-fit-content;
  width: fit-content
}

.q8UzUn__dex.tyYDY2__dex {
  min-height: 28px
}

.q8UzUn__dex.tyYDY2__dex .zP1iuj__dex {
  align-items: center;
  background: var(--dex-okd-color-background-surface-primary);
  border-radius: 8px;
  display: flex;
  justify-content: center;
  padding: 6px
}

.q8UzUn__dex.tyYDY2__dex .patPAF__dex {
  align-items: center;
  box-sizing: border-box;
  display: flex;
  font-size: 16px;
  height: 16px;
  justify-content: center;
  overflow: hidden;
  width: 16px
}

.q8UzUn__dex.tyYDY2__dex .patPAF__dex img {
  height: 16px;
  max-width: 16px;
  width: 16px
}

.q8UzUn__dex.tyYDY2__dex .NTqj3r__dex {
  font-size: 16px;
  height: 16px
}

.FZ7BHm__dex {
  border-radius: 6px;
  width: 100%
}

.ltMNMI__dex {
  border-radius: 8px;
  display: flex;
  height: 32px;
  justify-content: center;
  line-height: 32px
}

.rLF_bf__dex {
  align-items: center;
  border-radius: 6px;
  color: var(--dex-okd-color-content-contrast);
  cursor: pointer;
  display: flex;
  font-size: 12px;
  font-weight: 400;
  margin-left: 6px;
  margin-right: 8px;
  padding: 0 16px
}

.VFkmbE__dex {
  color: var(--dex-okd-color-content-primary);
  margin-right: 8px
}

.XdIMIk__dex {
  background: linear-gradient(90deg, transparent, #000);
  background: linear-gradient(90deg, transparent 0, var(--dex-module-bg-color, #000) 100%);
  width: 48px
}

.j3S4ny__dex {
  background: linear-gradient(90deg, transparent, #121212)
}

.YsGyqf__dex {
  background: linear-gradient(90deg, hsla(0, 0%, 100%, 0), #fff);
  width: 48px
}

.Z8GzQF__dex {
  background-color: var(--dex-okd-color-background-surface-primary);
  color: var(--dex-okd-color-content-primary);
  font-weight: 500;
  height: 32px;
  margin-bottom: 4px;
  margin-top: 4px
}

.NFH7Y3__dex {
  align-items: center;
  display: flex;
  font-size: 12px
}

.JbqXyl__dex {
  border-radius: 50%;
  height: 20px;
  margin-right: 8px;
  vertical-align: middle;
  width: 20px
}

.SoWXlO__dex {
  padding-left: 12px;
  padding-right: 16px
}

.SoWXlO__dex,
.zmPBJa__dex {
  color: var(--dex-okd-color-content-primary)
}

.zmPBJa__dex {
  font-size: 16px;
  font-weight: 700;
  line-height: 20px;
  padding: 14px 16px
}

.A8ajMr__dex {
  align-items: center;
  display: flex;
  padding: 4px 0;
  width: 100%
}

.B9ANQ9__dex {
  color: var(--dex-okd-color-content-primary)
}

.A6TaM0__dex,
.B9ANQ9__dex {
  margin-right: 8px;
  vertical-align: middle
}

.A6TaM0__dex {
  border-radius: 50%
}

.ODrcbp__dex {
  color: var(--dex-okd-color-content-primary);
  flex: 1 1;
  font-size: 16px;
  line-height: 24px;
  text-align: left
}

.IPRdcE__dex {
  padding-top: 32px
}

.JZ4Bfl__dex {
  border-radius: 8px;
  min-width: 80px;
  padding: 5px 8px
}

.JZ4Bfl__dex,
.ZHLR8C__dex,
.e2E2Wk__dex {
  width: -webkit-fit-content;
  width: -moz-fit-content;
  width: fit-content
}

.e2E2Wk__dex {
  align-items: center;
  background-color: var(--dex-okd-color-container-primary);
  border-radius: 8px;
  color: var(--dex-okd-color-content-primary);
  cursor: pointer;
  display: flex;
  font-size: 12px;
  font-weight: 700;
  padding: 5px 8px;
  white-space: nowrap
}

.e2E2Wk__dex .hxdhGI__dex {
  font-size: 12px;
  transition: transform .2s ease-in-out
}

.e2E2Wk__dex .blGHdK__dex {
  transform: rotate(180deg)
}

.XFzg1o__dex,
.f6RD7x__dex {
  border-radius: 50%;
  height: 18px;
  margin-right: 6px;
  vertical-align: middle;
  width: 18px
}

.OFmFTk__dex {
  color: var(--dex-okd-color-content-primary);
  display: inline-block;
  line-height: 16px;
  margin-right: 6px;
  vertical-align: middle;
  white-space: nowrap
}

.OFmFTk__dex::-moz-selection {
  background-color: initial
}

.OFmFTk__dex::selection {
  background-color: initial
}

.KMvxPp__dex {
  color: var(--dex-okd-color-content-primary);
  font-size: 16px;
  font-weight: 700;
  line-height: 20px;
  padding: 14px 16px
}

.LHSq0O__dex {
  align-items: center;
  display: flex;
  padding: 4px 0;
  width: 100%
}

.iJC3TR__dex {
  color: var(--dex-okd-color-content-primary)
}

.WN_AJw__dex,
.iJC3TR__dex {
  margin-right: 8px;
  vertical-align: middle
}

.WN_AJw__dex {
  border-radius: 50%
}

.fxrS7F__dex {
  color: var(--dex-okd-color-content-primary);
  flex: 1 1;
  font-size: 16px;
  line-height: 24px;
  text-align: left
}

.dVvReH__dex {
  padding-top: 40px
}

.NeG7GA__dex {
  border-radius: 999px;
  width: 52px
}

.NeG7GA__dex.dcPKf9__dex {
  width: 16px
}

.TGQtqv__dex {
  height: 100%
}

.TGQtqv__dex,
.hKGwao__dex {
  align-items: center;
  background-color: transparent;
  display: flex;
  width: -webkit-fit-content;
  width: -moz-fit-content;
  width: fit-content
}

.hKGwao__dex {
  border-radius: 999px;
  color: var(--dex-okd-color-content-primary);
  cursor: pointer;
  white-space: nowrap
}

.hKGwao__dex.UWv7SO__dex {
  padding: 6px 8px
}

@media (min-width:768px) {
  .hKGwao__dex.UWv7SO__dex {
    padding: 8px 10px
  }
}

.hKGwao__dex .loa8Sf__dex {
  font-size: 12px;
  transition: transform .2s ease-in-out
}

.hKGwao__dex .btQbX0__dex {
  transform: rotate(180deg)
}

.hKGwao__dex .p4_rGE__dex {
  font-size: 12px;
  padding: 0 4px
}

.mrqqfi__dex {
  border: 1px solid var(--dex-okd-color-border-primary);
  border-radius: 50%;
  box-sizing: border-box;
  height: 16px;
  vertical-align: middle;
  width: 16px
}

.Osxes8__dex,
.js5JW___dex {
  box-sizing: border-box;
  color: var(--dex-okd-color-content-primary);
  vertical-align: middle
}

.Osxes8__dex {
  display: inline-block;
  font-size: 14px;
  font-weight: 700;
  line-height: 16px;
  white-space: nowrap
}

.Osxes8__dex::-moz-selection {
  background-color: initial
}

.Osxes8__dex::selection {
  background-color: initial
}

.iq1PYT__dex {
  color: var(--dex-okd-color-content-primary);
  font-size: 16px;
  font-weight: 700;
  line-height: 20px;
  padding: 14px 16px
}

.LBpjmk__dex {
  align-items: center;
  display: flex;
  padding: 2px 0;
  width: 100%
}

.dyYEQq__dex {
  color: var(--dex-okd-color-content-primary);
  margin-right: 8px;
  vertical-align: middle
}

.HsrdLU__dex {
  border-radius: 50%;
  flex-shrink: 0;
  margin-right: 12px;
  vertical-align: middle
}

.vCwc1u__dex {
  color: var(--dex-okd-color-content-primary);
  flex: 1 1;
  font-size: 12px;
  line-height: 16px;
  text-align: left
}

.dFja7a__dex {
  padding-top: 40px
}

.osX34J__dex {
  background: var(--dex-okd-color-background-base-primary);
  box-sizing: border-box;
  height: 40px;
  padding-left: 8px;
  padding-right: 8px
}

@media (min-width:768px) {
  .osX34J__dex {
    padding-left: 12px;
    padding-right: 12px
  }
}

@media (min-width:1024px) {
  .osX34J__dex {
    padding-left: calc(50% - 480px);
    padding-right: calc(50% - 480px)
  }
}

@media (min-width:1270px) {
  .osX34J__dex {
    padding-left: calc(50% - 624px);
    padding-right: calc(50% - 624px)
  }
}

@media (min-width:1860px) {
  .osX34J__dex {
    padding-left: calc(50% - 864px);
    padding-right: calc(50% - 864px)
  }
}

@media (min-width:2037px) {
  .osX34J__dex {
    padding-left: calc(50% - 864px);
    padding-right: calc(50% - 864px)
  }
}

@media (min-width:768px) {
  .osX34J__dex {
    box-sizing: border-box;
    padding-left: 12px;
    padding-right: 12px;
    width: 100%
  }
}

@media (max-width:767px) {
  .osX34J__dex {
    box-sizing: border-box;
    padding-left: 8px;
    padding-right: 8px;
    width: 100%
  }
}

@media (min-width:768px) {
  .osX34J__dex {
    height: 52px
  }
}

.osX34J__dex .hl05Sg__dex {
  height: 52px
}

@media (min-width:768px) {
  .osX34J__dex .hl05Sg__dex {
    height: 52px
  }
}

.osX34J__dex .flT7ab__dex {
  align-items: center;
  display: flex;
  height: 32px
}

@media (min-width:768px) {
  .osX34J__dex .flT7ab__dex {
    height: 40px
  }
}

.hl05Sg__dex {
  align-items: center;
  box-sizing: border-box;
  display: flex
}

@media (min-width:768px) {
  .hl05Sg__dex {
    box-sizing: border-box;
    padding-left: 12px;
    padding-right: 12px;
    width: 100%
  }
}

@media (max-width:767px) {
  .hl05Sg__dex {
    box-sizing: border-box;
    padding-left: 8px;
    padding-right: 8px;
    width: 100%
  }
}

.flT7ab__dex {
  width: 100%
}

.EoeXZP__dex {
  border: .5px solid var(--dex-okd-color-border-primary);
  border-radius: 8px
}

.gDXpJb__dex {
  height: 16px
}

.moMkbH__dex {
  color: var(--dex-okd-color-content-primary)
}

.lcLD7b__dex {
  border-radius: 50%;
  display: flex;
  margin-right: 2px
}

.LUz4uW__dex {
  flex-shrink: 0
}

.cT4uJA__dex {
  color: var(--dex-okd-color-content-primary);
  cursor: pointer;
  font-size: 16px
}

.UiTdCP__dex {
  color: var(--dex-okd-color-content-disabled);
  cursor: not-allowed
}

._8mGmSG__dex {
  font-size: 14px;
  line-height: 16px
}

.LKGUHt__dex {
  color: var(--dex-okd-color-content-contrast)
}

.vz3BZA__dex {
  color: var(--dex-okd-color-content-primary);
  display: flex;
  flex-direction: column;
  gap: 12px
}

.K5PVSv__dex,
.sS7PuC__dex {
  color: var(--dex-okd-color-content-primary);
  cursor: pointer
}

.e09OON__dex {
  color: var(--dex-okd-color-content-disabled);
  cursor: not-allowed
}

._1sOpng__dex {
  align-items: center;
  display: flex
}

.HFHlSA__dex {
  margin-top: 8px
}

.Fst0op__dex {
  color: var(--dex-okd-color-content-primary);
  font-size: 14px;
  line-height: 16px
}

.idftIM__dex {
  width: 200px
}

.MoAWJK__dex {
  align-items: center;
  border: 1px solid transparent;
  border-radius: 8px;
  color: var(--dex-okd-color-content-primary);
  display: flex;
  font-size: 12px;
  font-weight: 400;
  gap: 8px;
  height: 32px;
  justify-content: space-between;
  line-height: 16px;
  padding: 0 8px;
  width: 200px
}

.MoAWJK__dex,
.sxjTYL__dex {
  background: var(--dex-okd-color-background-surface-primary)
}

.sxjTYL__dex {
  border: 1px solid var(--dex-okd-color-content-primary)
}

.jDuFr9__dex {
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap
}

.SlDwgB__dex {
  align-items: center;
  display: flex;
  gap: 8px;
  justify-content: space-between;
  padding: 8px 0
}

.SHBfTy__dex {
  color: var(--dex-okd-color-content-primary);
  font-size: 14px;
  line-height: 16px
}

.z6iTLX__dex {
  width: 200px
}

.znCrF0__dex {
  align-items: center;
  border: 1px solid transparent;
  border-radius: 8px;
  color: var(--dex-okd-color-content-primary);
  display: flex;
  font-size: 12px;
  font-weight: 400;
  gap: 8px;
  height: 32px;
  justify-content: space-between;
  line-height: 16px;
  padding: 0 8px;
  width: 200px
}

.hVxKmI__dex,
.znCrF0__dex {
  background: var(--dex-okd-color-background-surface-primary)
}

.hVxKmI__dex {
  border: 1px solid var(--dex-okd-color-content-primary)
}

.DT_7QI__dex {
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap
}

.vf76Rt__dex {
  align-items: center;
  display: flex;
  gap: 8px;
  justify-content: space-between;
  padding: 4px 0
}

.bDS6IR__dex {
  margin-right: 8px
}

.N9wutL__dex {
  color: var(--dex-okd-color-content-tertiary);
  cursor: not-allowed
}

.L8MSr3__dex {
  background: var(--dex-okd-color-border-primary);
  height: 16px;
  margin: 0 6px;
  width: .5px
}

.qaAKDD__dex {
  overflow: hidden
}

.IUiq30__dex {
  margin-top: 24px
}

.dpR2Nf__dex {
  align-items: center;
  display: flex;
  justify-content: space-between
}

.TGzV1U__dex {
  color: var(--dex-okd-color-content-primary);
  font-size: 16px;
  font-weight: 500;
  line-height: 20px
}

.w_Ikf1__dex {
  width: 60px
}

.sRQcA8__dex {
  color: var(--dex-okd-color-content-contrast)
}

.theme-light .dex-slider-var,
.theme-light.dex-slider-var {
  --dex-okd-slider-common-active-color: var(--dex-okd-color-content-primary);
  --dex-okd-slider-common-text-color: var(--dex-okd-color-content-disabled);
  --dex-okd-slider-common-track-color: var(--dex-okd-color-border-primary);
  --dex-okd-slider-label-color: #000;
  --dex-okd-slider-label-font-size: var(--dex-okd-font-size-md);
  --dex-okd-slider-label-line-height: var(--dex-okd-line-height-md);
  --dex-okd-slider-node-border-color: var(--dex-okd-color-content-disabled);
  --dex-okd-slider-node-bg-color: var(--dex-okd-color-background-base-primary);
  --dex-okd-slider-handler-shadow-color: var(--dex-okd-color-border-selected);
  --dex-okd-slider-handler-border-color: var(--dex-okd-color-border-selected);
  --dex-okd-slider-desc-color: #929292;
  --dex-okd-slider-desc-font-size: var(--dex-okd-font-size-md);
  --dex-okd-slider-desc-line-height: var(--dex-okd-line-height-md);
  --dex-okd-slider-md-handler-size: 18px;
  --dex-okd-slider-md-handler-hover-size: 24px;
  --dex-okd-slider-md-node-size: 12px;
  --dex-okd-slider-md-track-height: 4px;
  --dex-okd-slider-sm-handler-size: 9px;
  --dex-okd-slider-sm-handler-hover-size: 12px;
  --dex-okd-slider-sm-node-size: 8px;
  --dex-okd-slider-sm-track-height: 2px;
  --dex-okd-slider-node-text-color: var(--dex-okd-color-content-disabled);
  --dex-okd-slider-common-disabled-active-color: var(--dex-okd-color-content-disabled);
  --dex-okd-slider-common-text-active-color: var(--dex-okd-color-content-primary);
  --dex-okd-slider-handler-border-disabled-color: var(--dex-okd-color-content-disabled);
  --dex-okd-slider-common-text-disabled-active-color: var(--dex-okd-color-content-disabled);
  --dex-okd-slider-handler-bg-color: #fff;
  --dex-okd-slider-desc-margin-top: 6px;
  --dex-okd-slider-common-top: 14px;
  --dex-okd-slider-sm-node-text-top: 8px
}

.theme-dark .dex-slider-var,
.theme-dark.dex-slider-var {
  --dex-okd-slider-common-active-color: var(--dex-okd-color-content-primary);
  --dex-okd-slider-common-track-color: var(--dex-okd-color-border-primary);
  --dex-okd-slider-common-text-color: var(--dex-okd-color-content-disabled);
  --dex-okd-slider-handler-shadow-color: var(--dex-okd-color-border-selected);
  --dex-okd-slider-handler-border-color: var(--dex-okd-color-border-selected);
  --dex-okd-slider-node-bg-color: var(--dex-okd-color-background-base-primary);
  --dex-okd-slider-node-border-color: var(--dex-okd-color-content-disabled);
  --dex-okd-slider-label-color: #e3e3e3;
  --dex-okd-slider-label-font-size: var(--dex-okd-font-size-md);
  --dex-okd-slider-label-line-height: var(--dex-okd-line-height-md);
  --dex-okd-slider-desc-color: #e3e3e3;
  --dex-okd-slider-desc-font-size: var(--dex-okd-font-size-md);
  --dex-okd-slider-desc-line-height: var(--dex-okd-line-height-md);
  --dex-okd-slider-md-handler-size: 18px;
  --dex-okd-slider-md-handler-hover-size: 24px;
  --dex-okd-slider-md-node-size: 12px;
  --dex-okd-slider-md-track-height: 4px;
  --dex-okd-slider-sm-handler-size: 9px;
  --dex-okd-slider-sm-handler-hover-size: 12px;
  --dex-okd-slider-sm-node-size: 8px;
  --dex-okd-slider-sm-track-height: 2px;
  --dex-okd-slider-node-text-color: var(--dex-okd-color-content-disabled);
  --dex-okd-slider-common-disabled-active-color: var(--dex-okd-color-content-disabled);
  --dex-okd-slider-common-text-active-color: var(--dex-okd-color-content-primary);
  --dex-okd-slider-handler-border-disabled-color: var(--dex-okd-color-content-disabled);
  --dex-okd-slider-common-text-disabled-active-color: var(--dex-okd-color-content-disabled);
  --dex-okd-slider-handler-bg-color: var(--dex-okd-color-content-inverse);
  --dex-okd-slider-desc-margin-top: 6px;
  --dex-okd-slider-common-top: 14px;
  --dex-okd-slider-sm-node-text-top: 8px
}

.rOV04Q__dex {
  align-items: center;
  display: flex;
  gap: 16px;
  justify-content: space-between;
  margin-bottom: 24px;
  padding: 10px 0
}

.JabyXt__dex {
  color: var(--dex-okd-color-content-primary);
  font-size: 16px;
  font-weight: 500;
  line-height: 20px;
  margin-bottom: 2px
}

.ZgqbXj__dex {
  color: var(--dex-okd-color-content-contrast);
  font-size: 12px;
  line-height: 16px
}

.EyoROP__dex {
  display: flex;
  flex-direction: column;
  gap: 24px
}

.gwwl8V__dex {
  border: 1px solid var(--dex-okd-color-border-primary);
  border-radius: 9px;
  padding: 12px
}

.TH0kVO__dex {
  flex-shrink: 0
}

.fdYPni__dex {
  align-items: center;
  border-radius: 6px;
  display: flex;
  gap: 4px;
  justify-content: center;
  padding: 4px
}

.fdYPni__dex:hover {
  background: var(--dex-okd-color-background-surface-primary)
}

.ptB8Jp__dex {
  font-size: 12px
}

.PwSNTD__dex {
  gap: 12px
}

.PwSNTD__dex,
.mB70vW__dex {
  align-items: center;
  display: flex
}

.mB70vW__dex {
  color: var(--dex-okd-color-content-tertiary);
  cursor: default;
  font-size: 12px;
  font-style: normal;
  font-weight: 500;
  gap: 4px;
  line-height: 16px
}

.SN8BmF__dex {
  border: 1px solid var(--dex-okd-color-border-primary);
  border-radius: 50%;
  flex-shrink: 0;
  height: 14px;
  object-fit: cover;
  overflow: hidden;
  width: 14px
}

.WNaorM__dex {
  align-items: center;
  border-radius: 6px;
  display: flex;
  font-size: 12px;
  gap: 4px;
  justify-content: center;
  padding: 4px
}

.WNaorM__dex:hover,
.xeDh00__dex {
  background: var(--dex-okd-color-background-surface-primary)
}

.xeDh00__dex {
  border-radius: 6px;
  color: var(--dex-okd-color-content-secondary)
}

.KWIrRH__dex.c10haR__dex {
  align-items: center;
  color: var(--dex-okd-color-content-contrast);
  cursor: pointer;
  display: flex;
  gap: 4px;
  padding: 4px 6px;
  position: relative
}

.KWIrRH__dex.c10haR__dex.k7Vo0K__dex,
.KWIrRH__dex.c10haR__dex:hover {
  background: var(--dex-okd-color-background-surface-primary);
  border-radius: 6px;
  color: var(--dex-okd-color-content-secondary)
}

.f5AlzX__dex {
  align-items: center;
  display: flex;
  flex-wrap: nowrap;
  font-size: 12px;
  font-weight: 500;
  line-height: 16px
}

.tZziOw__dex .mcDv9r__dex {
  border: .5px solid var(--dex-okd-color-border-static-default);
  border-radius: 12px;
  overflow: hidden
}

.tZziOw__dex .NrFDzO__dex {
  padding: 0
}

.Zbnh3f__dex {
  height: 16px;
  margin-left: 2px;
  width: 4px
}

.Zbnh3f__dex .utCTAP__dex {
  background: var(--dex-okd-color-semantic-negative);
  border-radius: 8px;
  height: 4px;
  width: 4px
}

.R58nAf__dex {
  gap: 8px
}

.R58nAf__dex,
.lXgoyB__dex {
  align-items: center;
  display: flex
}

.lXgoyB__dex {
  border-radius: 6px;
  color: var(--dex-okd-color-surface-success-default);
  cursor: default;
  font-size: 12px;
  font-weight: 500;
  gap: 4px;
  line-height: 16px;
  padding: 4px 6px;
  -webkit-user-select: none;
  -moz-user-select: none;
  -ms-user-select: none;
  user-select: none
}

.lXgoyB__dex.Y0QrkI__dex {
  color: var(--dex-okd-color-surface-danger-default)
}

.lXgoyB__dex.Y0QrkI__dex:hover {
  background-color: var(--dex-okd-color-background-surface-primary)
}

.lXgoyB__dex.MxSJ0Q__dex {
  color: var(--dex-okd-color-content-warning-default)
}

.gw5GcZ__dex {
  background: rgba(var(--dex-okd-color-border-primary-rgb), .6);
  flex-shrink: 0;
  height: 16px;
  width: 1px
}

.InBqMV__dex {
  align-items: center;
  background: var(--dex-okd-color-surface-structural-base);
  border-top: 1px solid var(--dex-okd-color-border-interactive-oncolor);
  box-sizing: border-box;
  display: flex;
  gap: 16px;
  height: 36px;
  padding: 0 72px 0 24px;
  width: 100%
}

.ztrcfl__dex {
  flex: 1 1;
  min-width: 0
}

.q76JPB__dex {
  gap: 6px
}

.q76JPB__dex,
.xshpZS__dex {
  align-items: center;
  display: flex
}

.xshpZS__dex {
  flex-shrink: 0;
  gap: 8px
}

.u3bXDO__dex {
  height: 16px;
  margin: 0 8px;
  width: 1px
}

.gDmaN6__dex {
  align-items: center;
  display: flex;
  gap: 8px;
  height: 24px;
  justify-content: space-between;
  overflow: hidden;
  padding-right: 14px;
  position: relative;
  width: 100%
}

.gDmaN6__dex .iUgv5o__dex.iUgv5o__dex {
  background-image: linear-gradient(270deg, var(--dex-okd-color-background-surface-disable) 72.22%, hsla(0, 0%, 100%, 0) 100%);
  background-image: linear-gradient(270deg, var(--dex-okd-color-background-surface-disable) 72.22%, var(--dex-okd-color-transparent-white, hsla(0, 0%, 100%, 0)) 100%);
  cursor: auto;
  pointer-events: none;
  right: -28px
}

.gDmaN6__dex .gzlgdw__dex.gzlgdw__dex {
  background-image: linear-gradient(-270deg, var(--dex-okd-color-background-surface-disable) 72.22%, hsla(0, 0%, 100%, 0) 100%);
  background-image: linear-gradient(-270deg, var(--dex-okd-color-background-surface-disable) 72.22%, var(--dex-okd-color-transparent-white, hsla(0, 0%, 100%, 0)) 100%);
  cursor: auto;
  left: -28px;
  pointer-events: none
}

.ajE6dg__dex:after {
  background-color: var(--dex-okd-color-border-primary);
  content: "";
  height: 14px;
  position: absolute;
  right: 4px;
  top: 50%;
  transform: translateY(-50%);
  width: 1px
}

.KYK1oX__dex {
  flex-shrink: 0;
  width: -webkit-fit-content;
  width: -moz-fit-content;
  width: fit-content
}

.mMENLy__dex {
  height: 24px;
  overflow: hidden;
  width: 100%
}

.J3gDr2__dex {
  display: block;
  text-align: right
}

.chO5yc__dex.chO5yc__dex {
  display: inline-block
}

.fSUZeZ__dex.fSUZeZ__dex {
  gap: 0;
  justify-content: flex-start;
  margin: 0 16px 4px;
  overflow: hidden;
  padding: 20px 0 7px
}

.g1SEcB__dex.g1SEcB__dex {
  width: calc(100% - 24px)
}

.maWVjh__dex.maWVjh__dex {
  height: 24px;
  width: 24px
}

.CUouIV__dex {
  cursor: pointer;
  height: 100vh;
  left: 0;
  position: fixed;
  top: 0;
  width: 100vw;
  z-index: 999
}

.kq_iX9__dex {
  position: fixed;
  transform-origin: center center;
  transition: transform .2s ease, opacity .2s ease;
  z-index: 1000
}

.kq_iX9__dex.iTwhiE__dex {
  opacity: .9;
  transform: scale(1.01);
  transition: none
}

.kq_iX9__dex.rnTVYY__dex {
  -webkit-user-select: none;
  -moz-user-select: none;
  -ms-user-select: none;
  user-select: none
}

.OB1MTF__dex {
  display: flex;
  flex-direction: column;
  height: 100%;
  overflow: hidden
}

.OB1MTF__dex.iTwhiE__dex {
  opacity: .9;
  z-index: 1001
}

.Jc6AhM__dex,
.OB1MTF__dex.SU_XjX__dex {
  -webkit-user-select: none;
  -moz-user-select: none;
  -ms-user-select: none;
  user-select: none
}

.Jc6AhM__dex {
  align-items: center;
  border-bottom: 1px solid rgba(var(--dex-okd-color-border-primary-rgb), 60%);
  cursor: move;
  display: flex;
  justify-content: space-between;
  margin: 4px 16px;
  position: relative
}

.Jc6AhM__dex .UpnzM___dex {
  align-items: flex-start;
  color: var(--dex-okd-color-content-disabled);
  display: flex;
  justify-content: center;
  left: 0;
  margin: 0 auto;
  position: absolute;
  right: 0;
  top: 0;
  width: 32px
}

.W6mx23__dex {
  align-items: center;
  color: var(--dex-okd-color-content-primary);
  display: flex;
  font-size: 14px;
  font-weight: 500;
  white-space: pre
}

.W6mx23__dex .T338CH__dex {
  color: var(--dex-okd-color-content-contrast);
  font-size: 16px;
  padding: 4px
}

.CPaic3__dex {
  gap: 8px
}

.CPaic3__dex,
.Tu4gHU__dex {
  align-items: center;
  display: flex
}

.Tu4gHU__dex {
  background: transparent;
  border: none;
  border-radius: 6px;
  color: var(--dex-okd-color-text-300);
  cursor: pointer;
  height: 40px;
  justify-content: center;
  margin-right: -16px;
  transition: all .2s ease;
  width: 40px
}

.Tu4gHU__dex .T338CH__dex {
  color: var(--dex-okd-color-content-contrast)
}

.Tu4gHU__dex:hover .T338CH__dex {
  color: var(--dex-okd-color-content-primary)
}

.twyo7l__dex {
  border-radius: 0 0 8px 8px;
  box-sizing: border-box;
  flex: 1 1;
  overflow: auto
}

.twyo7l__dex.uM8ZVR__dex {
  pointer-events: none;
  -webkit-user-select: none;
  -moz-user-select: none;
  -ms-user-select: none;
  user-select: none
}

.NbnlmB__dex .OB1MTF__dex {
  box-shadow: 0 25px 50px -12px rgba(var(--dex-okd-color-border-primary-rgb), 25%);
  opacity: .8;
  transform: rotate(2deg) scale(1.02)
}

.kgTef___dex {
  align-items: center;
  color: var(--dex-okd-color-text-200);
  display: flex;
  font-size: 18px;
  font-weight: 500;
  height: 100%;
  justify-content: center
}

.b6veDT__dex {
  height: 100%;
  width: 100%
}

.b6veDT__dex.uM8ZVR__dex {
  pointer-events: none;
  -webkit-user-select: none;
  -moz-user-select: none;
  -ms-user-select: none;
  user-select: none
}

.zXUpHK__dex {
  -webkit-backdrop-filter: blur(20px);
  backdrop-filter: blur(20px);
  border: 1px solid var(--dex-okd-color-border-primary);
  border-radius: 8px;
  box-shadow: var(--dex-okd-shadow-lg);
  position: relative
}

.zXUpHK__dex.I01HyF__dex {
  background-color: var(--dex-okd-color-background-surface-secondary)
}

.zXUpHK__dex.o0iMww__dex {
  background-color: var(--dex-okd-color-background-base-primary)
}

.zXUpHK__dex.Iew4Hf__dex {
  -webkit-user-select: none;
  -moz-user-select: none;
  -ms-user-select: none;
  user-select: none
}

.y06A0l__dex {
  background-color: initial;
  position: absolute;
  transition: background-color .2s ease
}

.y06A0l__dex.Iew4Hf__dex,
.y06A0l__dex:hover {
  background-color: var(--dex-okd-color-primary)
}

.KtpPXG__dex {
  cursor: ew-resize;
  height: 100%;
  right: -3px;
  top: 0;
  width: 6px
}

._Wm0Rr__dex {
  bottom: -3px;
  cursor: ns-resize;
  height: 6px;
  left: 0;
  width: 100%
}

.zLsi3P__dex {
  bottom: -3px;
  cursor: se-resize;
  height: 12px;
  right: -3px;
  width: 12px
}

.Rz8v_8__dex {
  cursor: ew-resize;
  height: 100%;
  left: -3px;
  top: 0;
  width: 6px
}

.hH3NRp__dex {
  cursor: ns-resize;
  height: 6px;
  left: 0;
  top: -6px;
  width: 100%;
  z-index: 10
}

.eSqjuy__dex {
  cursor: nw-resize;
  left: -3px
}

.Ga246C__dex,
.eSqjuy__dex {
  height: 12px;
  top: -6px;
  width: 12px;
  z-index: 10
}

.Ga246C__dex {
  cursor: ne-resize;
  right: -3px
}

.nWnghw__dex {
  bottom: -3px;
  cursor: sw-resize;
  height: 12px;
  left: -3px;
  width: 12px
}

.XA_7BV__dex {
  grid-gap: 16px 12px;
  align-content: start;
  display: grid;
  gap: 16px 12px;
  grid-template-columns: repeat(auto-fit, minmax(360px, 1fr));
  width: 100%
}

.q6XoVJ__dex {
  background-color: var(--dex-okd-color-bg-container);
  border-radius: 8px;
  display: flex;
  flex-direction: column;
  min-height: 160px;
  padding: 8px 6px
}

.NFUxOY__dex {
  align-items: flex-start;
  display: flex;
  gap: 8px;
  margin-bottom: 16px
}

.hRwaQw__dex {
  gap: 8px
}

.hRwaQw__dex,
.uv5gBj__dex {
  display: flex;
  flex: 1 1;
  flex-direction: column
}

.uv5gBj__dex {
  gap: 16px
}

.lOKsJS__dex {
  background-color: var(--dex-okd-color-bg-container);
  border-radius: 8px;
  padding: 8px 0
}

.S43A0M__dex,
.lOKsJS__dex {
  display: flex;
  flex-direction: column
}

.S43A0M__dex {
  gap: 8px;
  padding: 8px 16px
}

.Yk_c7B__dex {
  align-items: center;
  display: flex;
  gap: 8px;
  width: 100%
}

.Yk_c7B__dex>:nth-child(2) {
  flex: 1 1;
  max-width: 216px
}

.dVYWnK__dex {
  display: flex;
  flex-direction: column;
  gap: 8px;
  width: 100%
}

.OL6dJB__dex {
  align-items: flex-start;
  display: flex;
  flex-direction: row;
  gap: 8px;
  padding: 8px 16px
}

.YPaRJA__dex {
  display: flex;
  flex: 1 1;
  flex-direction: column;
  gap: 8px;
  width: 100%
}

.PuRMX0__dex {
  display: flex;
  flex-direction: row;
  width: 100%
}

.PuRMX0__dex>:first-child,
.TUBt62__dex {
  flex: 1 1
}

.AkGVti__dex {
  align-items: center;
  display: flex;
  justify-content: center;
  width: 100%
}

.gBQ99l__dex {
  box-sizing: border-box;
  padding: 40px 16px
}

.wVl0gs__dex {
  -ms-overflow-style: none;
  height: 100%;
  overflow-y: auto
}

.wVl0gs__dex::-webkit-scrollbar {
  display: none
}

.YPTVmd__dex {
  box-sizing: border-box;
  display: flex;
  flex: 1 1;
  flex-direction: column;
  height: 100%;
  overflow: hidden;
  padding-bottom: 4px;
  position: relative;
  width: 100%
}

.YPTVmd__dex:after {
  background: linear-gradient(0deg, var(--dex-module-bg-color) 17.19%, rgba(var(--dex-okd-color-background-base-primary-rgb), 0) 100%);
  bottom: 0;
  content: "";
  height: 24px;
  pointer-events: none;
  position: absolute;
  width: 100%
}

.K_mcgK__dex {
  color: unset
}

.K_mcgK__dex,
.K_mcgK__dex:hover {
  text-decoration: underline
}

.iQYc2y__dex,
.qGrp2e__dex {
  text-decoration: line-through
}

.iQYc2y__dex {
  color: var(--dex-okd-color-content-disabled);
  padding-left: 4px
}

.aZZmk6__dex,
.iVjinz__dex {
  flex-shrink: 0
}

.iVjinz__dex {
  align-items: center;
  color: var(--dex-okd-color-content-contrast);
  display: flex
}

.XqUsYx__dex {
  cursor: pointer
}

.d1wkEL__dex {
  border: 1px solid var(--dex-okd-color-border-primary);
  border-radius: 16px;
  margin-top: 16px;
  padding: 16px 20px
}

.A_vmTp__dex {
  display: flex
}

.JXfXli__dex .dex-notification-content {
  padding-left: 10px
}

.JXfXli__dex .dex-notification-action,
.JXfXli__dex .dex-notification-title {
  color: var(--dex-okd-color-content-primary);
  font-weight: 700
}

.JXfXli__dex .dex-notification-desc {
  color: var(--dex-okd-color-content-primary);
  font-weight: 400
}

.Xm6VIO__dex {
  color: var(--dex-okd-color-content-contrast);
  font-size: 16px
}

.Or4Gzq__dex,
.Pdql2g__dex {
  margin-left: 4px
}

.Or4Gzq__dex {
  font-size: 12px;
  line-height: 16px
}

.gOf7PL__dex {
  color: var(--dex-okd-color-link-accent-content-primary)
}

.DvDCsr__dex {
  color: var(--dex-okd-color-semantic-notice)
}

.UWQNpU__dex {
  color: var(--dex-okd-color-semantic-negative)
}

.Wg2273__dex {
  color: var(--dex-okd-color-content-secondary);
  line-height: 16px;
  padding-top: 16px
}

.Wg2273__dex,
.wOwaaC__dex {
  font-size: 12px;
  font-weight: 400
}

.wOwaaC__dex {
  line-height: 18px
}

.CU9xL6__dex {
  color: var(--dex-okd-color-content-secondary);
  font-size: 12px;
  font-weight: 400;
  line-height: 16px;
  padding-top: 16px
}

.Ok80Ju__dex {
  cursor: pointer;
  -webkit-text-decoration: 1px dashed var(--dex-okd-color-gray-300) underline;
  text-decoration: 1px dashed var(--dex-okd-color-gray-300) underline;
  text-underline-offset: 3px
}

.uYGAeH__dex {
  font-size: 12px;
  font-weight: 400;
  line-height: 18px
}

.Inq4K1__dex .cPTQNl__dex.yutCc2__dex {
  border-radius: 4px
}

@media (max-width:767px) {
  .Inq4K1__dex .cPTQNl__dex.yutCc2__dex {
    border-radius: 8px
  }
}

.Inq4K1__dex .cPTQNl__dex.yutCc2__dex.va9xSX__dex {
  border: 1px solid var(--dex-okd-color-semantic-negative)
}

.Inq4K1__dex .cPTQNl__dex.yutCc2__dex.a9t_PO__dex {
  border: 1px solid var(--dex-okd-color-semantic-notice)
}

.Inq4K1__dex .bIHKOl__dex {
  color: var(--dex-okd-color-content-primary);
  font-size: 12px;
  font-weight: 400;
  line-height: 16px
}

@media (max-width:767px) {
  .Inq4K1__dex .bIHKOl__dex {
    font-size: 16px;
    font-weight: 400;
    line-height: 20px
  }
}

.Inq4K1__dex .D25J83__dex {
  font-size: 12px;
  font-weight: 400;
  line-height: 16px;
  margin-top: 4px
}

@media (max-width:767px) {
  .Inq4K1__dex .D25J83__dex {
    margin-top: 8px
  }
}

.Inq4K1__dex .gYyFtL__dex {
  color: var(--dex-okd-color-semantic-negative)
}

.Inq4K1__dex .iwKX4c__dex {
  color: var(--dex-okd-color-semantic-notice)
}

.SUgMwe__dex {
  border-bottom: 1px dashed var(--dex-okd-color-content-tertiary);
  color: var(--dex-okd-color-content-tertiary);
  font-size: 14px;
  font-weight: 400;
  line-height: 16px;
  margin-right: 4px
}

@media (min-width:768px) {
  .SUgMwe__dex {
    border-bottom: none
  }
}

.Zvx2jT__dex {
  background: var(--dex-okd-color-background-surface-primary);
  border-radius: 8px;
  box-sizing: border-box;
  cursor: pointer;
  overflow: hidden;
  padding: 10px 8px;
  text-overflow: ellipsis;
  width: calc(33.33333% - 5.33333px)
}

@media (min-width:768px) {
  .Zvx2jT__dex {
    border-radius: 4px;
    padding: 8px
  }
}

.Zvx2jT__dex:hover {
  background: var(--dex-okd-color-container-primary)
}

.Zvx2jT__dex.W_w8IB__dex {
  background: var(--dex-okd-color-container-tertiary);
  border: .5px solid var(--dex-okd-color-border-primary);
  padding: 9.5px 8px
}

@media (min-width:768px) {
  .Zvx2jT__dex.W_w8IB__dex {
    padding: 7.5px 8px
  }
}

.Zvx2jT__dex .BEKyA9__dex {
  color: var(--dex-okd-color-content-primary);
  font-size: 14px;
  font-weight: 400;
  line-height: 16px;
  overflow: hidden;
  text-align: center;
  text-overflow: ellipsis;
  white-space: nowrap
}

.Zvx2jT__dex .pqHSwM__dex {
  margin-bottom: 8px
}

.Zvx2jT__dex .RtcI61__dex {
  color: var(--dex-okd-color-content-primary);
  font-size: 14px;
  font-weight: 500
}

.Zvx2jT__dex .MxIQO1__dex,
.Zvx2jT__dex .RtcI61__dex {
  line-height: 16px;
  overflow: hidden;
  text-align: center;
  text-overflow: ellipsis
}

.Zvx2jT__dex .MxIQO1__dex {
  color: var(--dex-okd-color-content-contrast);
  font-size: 12px;
  font-weight: 400;
  margin-top: 2px;
  white-space: nowrap
}

.IyRBfZ__dex {
  padding: 16px 8px
}

.POCS9a__dex {
  display: flex;
  gap: 8px;
  margin-bottom: 8px
}

.dWtxyg__dex {
  background-color: var(--dex-okd-color-background-base-secondary);
  border-radius: 8px;
  min-width: 320px;
  padding: 16px
}

@media (max-width:767px) {
  .dWtxyg__dex {
    min-width: 300px
  }
}

.tW3_mA__dex {
  align-items: center;
  display: flex
}

.dzac5q__dex {
  margin-top: 12px
}

.WzzjqH__dex {
  background-color: var(--dex-okd-color-background-base-secondary);
  border-radius: 8px;
  min-width: 300px;
  padding: 16px
}

@media (min-width:768px) {
  .WzzjqH__dex {
    min-width: 320px
  }
}

.NGwBSY__dex {
  align-items: center;
  display: flex
}

.BepOeH__dex {
  color: var(--dex-okd-color-content-primary);
  font-size: 14px;
  font-weight: 500;
  line-height: 16px
}

.uI5YKX__dex {
  border-bottom: none;
  cursor: default
}

.C8cXsl__dex {
  background-color: var(--dex-okd-color-background-base-secondary);
  border-radius: 8px;
  min-width: 320px;
  padding: 16px
}

@media (max-width:767px) {
  .C8cXsl__dex {
    min-width: 300px
  }
}

.gTqwNB__dex {
  align-items: center;
  display: flex;
  width: 100%
}

.OLQfkv__dex {
  margin-left: auto
}

.OLQfkv__dex,
.UKeXUj__dex,
.m1_du4__dex {
  font-weight: 500
}

.m1_du4__dex {
  font-size: 14px;
  line-height: 16px
}

.p8azk3__dex {
  width: 224px
}

.KE0Egr__dex {
  margin-top: 12px
}

.vSlERD__dex .R0oTQh__dex.sl9mat__dex {
  border-radius: 4px
}

@media (max-width:767px) {
  .vSlERD__dex .R0oTQh__dex.sl9mat__dex {
    border-radius: 8px
  }
}

.vSlERD__dex .R0oTQh__dex.sl9mat__dex.QmEEqa__dex {
  border: 1px solid var(--dex-okd-color-semantic-negative)
}

.vSlERD__dex .R0oTQh__dex.sl9mat__dex._4gYhN0__dex {
  border: 1px solid var(--dex-okd-color-semantic-notice)
}

.vSlERD__dex .xfKude__dex {
  text-align: right
}

.vSlERD__dex .XnHKWe__dex {
  color: var(--dex-okd-color-content-contrast);
  font-size: 12px;
  font-weight: 400;
  line-height: 16px
}

@media (max-width:767px) {
  .vSlERD__dex .XnHKWe__dex {
    font-size: 16px;
    font-weight: 400;
    line-height: 20px
  }
}

.vSlERD__dex .LqfG88__dex {
  color: var(--dex-okd-color-content-primary);
  font-size: 12px;
  font-weight: 400;
  line-height: 16px;
  margin-left: 4px
}

@media (max-width:767px) {
  .vSlERD__dex .LqfG88__dex {
    font-size: 16px;
    font-weight: 400;
    line-height: 20px
  }
}

.vSlERD__dex .RcR3Fu__dex {
  font-size: 12px;
  font-weight: 400;
  line-height: 16px;
  margin-top: 4px
}

@media (max-width:767px) {
  .vSlERD__dex .RcR3Fu__dex {
    margin-top: 8px
  }
}

.vSlERD__dex .qkuX1___dex {
  color: var(--dex-okd-color-semantic-negative)
}

.vSlERD__dex .oRTxq1__dex {
  color: var(--dex-okd-color-semantic-notice)
}

.vSlERD__dex .lHYDYS__dex {
  color: var(--dex-okd-color-content-contrast)
}

.m_I7z5__dex {
  background-color: var(--dex-okd-color-background-base-secondary);
  border-radius: 8px;
  min-width: 320px;
  padding: 16px
}

@media (max-width:767px) {
  .m_I7z5__dex {
    min-width: 300px
  }
}

.PA5rSv__dex {
  align-items: center;
  display: flex;
  width: 100%
}

.QB52kt__dex {
  margin-left: auto
}

.QB52kt__dex,
.vex_KN__dex {
  font-weight: 500
}

.FFEQDV__dex {
  min-width: 225px
}

@media (max-width:767px) {
  .FFEQDV__dex {
    min-width: unset
  }
}

.rrvfQi__dex {
  margin-top: 12px
}

@media (max-width:767px) {
  .rrvfQi__dex {
    margin-top: 16px
  }
}

.FiDGTZ__dex {
  margin-top: 8px
}

.oY1fvB__dex .tZZaG7__dex.lPmEPe__dex {
  border-radius: 4px
}

@media (max-width:767px) {
  .oY1fvB__dex .tZZaG7__dex.lPmEPe__dex {
    border-radius: 8px
  }
}

.oY1fvB__dex .tZZaG7__dex.lPmEPe__dex.c33tuO__dex {
  border: 1px solid var(--dex-okd-color-semantic-negative)
}

.oY1fvB__dex .tZZaG7__dex.lPmEPe__dex.Vc_3OP__dex {
  border: 1px solid var(--dex-okd-color-semantic-notice)
}

.oY1fvB__dex .yc_2SO__dex {
  color: var(--dex-okd-color-content-primary);
  font-size: 12px;
  font-weight: 400;
  line-height: 16px
}

@media (max-width:767px) {
  .oY1fvB__dex .yc_2SO__dex {
    font-size: 16px;
    font-weight: 400;
    line-height: 20px
  }
}

.oY1fvB__dex .uOvvTL__dex {
  font-size: 12px;
  font-weight: 400;
  line-height: 16px;
  margin-top: 4px
}

@media (max-width:767px) {
  .oY1fvB__dex .uOvvTL__dex {
    margin-top: 8px
  }
}

.oY1fvB__dex .xEEd6U__dex {
  color: var(--dex-okd-color-semantic-negative)
}

.oY1fvB__dex .KRn9Y0__dex {
  color: var(--dex-okd-color-semantic-notice)
}

.Sc_V2___dex {
  background: var(--dex-okd-color-background-surface-primary);
  border-radius: 8px;
  box-sizing: border-box;
  cursor: pointer;
  overflow: hidden;
  padding: 10px 8px;
  text-overflow: ellipsis;
  width: calc(33.33333% - 5.33333px)
}

@media (min-width:768px) {
  .Sc_V2___dex {
    border-radius: 4px;
    padding: 8px
  }
}

.Sc_V2___dex:hover {
  background: var(--dex-okd-color-container-primary)
}

.Sc_V2___dex.CkQvMg__dex {
  background: var(--dex-okd-color-container-tertiary);
  border: .5px solid var(--dex-okd-color-border-primary);
  padding: 9.5px 8px
}

@media (min-width:768px) {
  .Sc_V2___dex.CkQvMg__dex {
    padding: 7.5px 8px
  }
}

.Sc_V2___dex .ikcqCV__dex {
  color: var(--dex-okd-color-content-primary);
  font-size: 14px;
  font-weight: 400;
  line-height: 16px;
  overflow: hidden;
  text-align: center;
  text-overflow: ellipsis
}

.sAVZ6a__dex {
  display: flex;
  gap: 8px;
  margin-bottom: 8px
}

.EkSJSF__dex {
  font-size: 12px;
  font-weight: 400;
  line-height: 16px;
  margin-top: 4px
}

@media (max-width:767px) {
  .EkSJSF__dex {
    margin-top: 8px
  }
}

.dSF3rB__dex {
  color: var(--dex-okd-color-semantic-negative)
}

.hCtyM___dex {
  color: var(--dex-okd-color-semantic-notice)
}

.j_PsQL__dex {
  font-weight: 700;
  margin-top: 24px
}

.IP68F0__dex {
  margin-right: 16px
}

.X7_WPc__dex {
  border-bottom: 1px dashed var(--dex-okd-color-content-tertiary);
  color: var(--dex-okd-color-content-tertiary);
  font-size: 14px;
  font-weight: 400;
  line-height: 16px;
  margin-right: 4px;
  max-width: 120px;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap
}

@media (min-width:768px) {
  .X7_WPc__dex {
    border-bottom: none
  }
}

.u9BJci__dex {
  background-color: var(--dex-okd-color-background-base-primary);
  border-radius: 0 0 8px 8px;
  gap: 12px;
  padding: 16px 24px
}

.jjqd9T__dex.LPJVxM__dex.mGyXgB__dex {
  background: rgba(var(--dex-okd-color-semantic-positive-rgb), .1);
  color: var(--dex-okd-color-semantic-positive)
}

.jjqd9T__dex.LPJVxM__dex.eYmnjQ__dex {
  background: rgba(var(--dex-okd-color-semantic-negative-rgb), .1);
  color: var(--dex-okd-color-semantic-negative)
}

.gmFd0H__dex {
  font-size: 12px;
  font-weight: 400;
  line-height: 16px
}

.oF8Ed2__dex {
  font-weight: 700
}

._v4nq1__dex {
  font-size: 20px
}

.ZZt_b9__dex {
  font-size: 14px;
  line-height: 16px
}

.XxSgs1__dex {
  margin-left: 8px
}

.RmsFwH__dex {
  color: var(--dex-okd-color-content-disabled)
}

.c5Ep68__dex.c5Ep68__dex {
  width: 94px
}

.HXUe3Q__dex.jkr6mp__dex.FNKEWM__dex.HXUe3Q__dex.jkr6mp__dex.FNKEWM__dex {
  border: none;
  padding: 0
}

.eEYa0X__dex {
  background: var(--dex-okd-color-background-base-secondary);
  border-radius: 8px;
  display: flex;
  flex-direction: column;
  justify-content: space-between;
  padding: 16px
}

.TTAMrt__dex {
  width: 100%
}

.PfrUCw__dex {
  margin-top: 12px
}

.ozAJcL__dex {
  color: var(--dex-okd-color-semantic-notice);
  font-size: 12px;
  font-weight: 400;
  line-height: 16px;
  padding-top: 4px
}

.jlZ5ZS__dex {
  color: var(--dex-okd-color-semantic-negative)
}

.c8HLNn__dex.pr5Auq__dex.lPh5vM__dex.dYxeAN__dex {
  background: var(--dex-okd-color-background-surface-primary);
  color: var(--dex-okd-color-content-primary);
  font-size: 12px;
  font-weight: 500;
  line-height: 16px
}

.c8HLNn__dex.pr5Auq__dex.lPh5vM__dex.dYxeAN__dex:hover {
  background: var(--dex-okd-color-container-primary)
}

.c8HLNn__dex.pr5Auq__dex.lPh5vM__dex.dYxeAN__dex.m866ok__dex {
  background: var(--dex-okd-color-container-tertiary);
  border: .5px solid var(--dex-okd-color-border-primary)
}

.sfAKvi__dex {
  margin-top: 16px
}

.lIvafn__dex {
  width: 225px
}

.UfVH8R__dex {
  align-items: center;
  display: flex;
  margin-right: 16px
}

.X3nZl2__dex {
  font-weight: 500
}

.LuKl9i__dex {
  border-bottom: 1px dashed var(--dex-okd-color-content-tertiary);
  color: var(--dex-okd-color-content-tertiary);
  font-size: 14px;
  font-weight: 400;
  line-height: 16px;
  margin-right: 4px;
  max-width: 120px;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap
}

@media (min-width:768px) {
  .LuKl9i__dex {
    border: unset
  }
}

.AOclVZ__dex {
  background-color: var(--dex-okd-color-background-base-primary);
  display: flex;
  flex-direction: column;
  height: 100%
}

.GLBlXl__dex {
  flex: 1 1;
  margin-bottom: 0;
  overflow-x: hidden;
  overflow-y: auto;
  padding: 0 24px
}

.Zs8H8o__dex,
.iXJA3A__dex {
  margin-bottom: 16px
}

.HEnqSs__dex,
.iXJA3A__dex,
.zE7GMo__dex {
  margin-top: 16px
}

.Ifb8tt__dex {
  height: auto !important;
  margin-top: 24px
}

.jn7mYO__dex {
  border-radius: 50%;
  box-sizing: border-box;
  display: inline-block;
  overflow: hidden
}

.srK4SZ__dex {
  height: 100%;
  object-fit: cover;
  width: 100%
}

.g1IS_f__dex {
  border-radius: 0 0 8px 8px
}

.P8B2tS__dex {
  margin-left: 8px
}

.CcIr39__dex .w4GIKi__dex {
  color: var(--dex-okd-color-brand-primary-alternative);
  font-size: 12px
}

.CcIr39__dex .lNe8f0__dex {
  color: var(--dex-okd-color-semantic-negative);
  font-size: 12px
}

.CcIr39__dex .VHkx9D__dex {
  color: var(--dex-okd-color-brand-primary-alternative);
  font-size: 12px;
  font-weight: 400;
  margin-left: 2px;
  margin-right: 6px
}

.CcIr39__dex .VHkx9D__dex.lNe8f0__dex {
  color: var(--dex-okd-color-semantic-negative)
}

.CcIr39__dex .VHkx9D__dex.w4GIKi__dex {
  color: var(--dex-okd-color-brand-primary-alternative)
}

.Xo5jsY__dex {
  align-items: center;
  display: flex;
  flex-shrink: 0
}

.KXAzdF__dex,
.d2G5A6__dex {
  color: var(--dex-okd-color-brand-primary-alternative);
  font-size: 12px
}

.KXAzdF__dex {
  margin-left: 2px;
  margin-right: 6px
}

.DDAd_d__dex {
  text-align: right;
  width: 44px !important
}

.DDAd_d__dex.UyQeaG__dex {
  width: 32px !important
}

.yQjkTi__dex {
  border-radius: 50%;
  margin-left: 6px;
  width: 16px
}

.Xo5jsY__dex .kD9_2U__dex {
  border-bottom-left-radius: 8px;
  border-top-left-radius: 8px;
  height: 32px
}

.Xo5jsY__dex .kD9_2U__dex.xi4slj__dex {
  border: unset !important
}

.C_qbg9__dex {
  height: 32px !important
}

.jJTBOk__dex {
  font-weight: 500
}

.RADkXN__dex {
  height: 24px !important
}

.W7fZV8__dex {
  border-left: 1px solid var(--dex-okd-color-border-primary);
  height: 16px;
  margin: 0 4px;
  width: 1px
}

.eQ7MWp__dex {
  align-items: center;
  display: flex
}

.eQ7MWp__dex .c0Sez1__dex {
  display: inline-block;
  flex-basis: 38px;
  flex-grow: 0;
  flex-shrink: 1;
  line-height: 1;
  max-width: 80px;
  overflow: hidden;
  text-overflow: ellipsis;
  vertical-align: middle;
  white-space: nowrap
}

.Pxwd5h__dex {
  color: var(--dex-okd-color-content-disabled)
}

.iJNQz5__dex {
  color: var(--dex-okd-color-brand-primary-alternative);
  display: flex
}

.GA1WOj__dex {
  color: var(--dex-okd-color-content-contrast)
}

.ZpkYn3__dex {
  background-color: var(--dex-okd-color-content-contrast);
  height: 8px;
  margin: 0 8px;
  width: 1px
}

.Gyth4___dex {
  margin-right: 8px
}

.RNn55O__dex {
  left: auto;
  right: 0
}

.Q0V_Pd__dex {
  font-size: 12px;
  margin-left: 2px
}

.DpeU5T__dex,
.PaosZH__dex {
  align-items: center;
  display: flex
}

.PaosZH__dex {
  flex-shrink: 0
}

.Wccieg__dex {
  align-items: center;
  display: flex;
  flex-shrink: 1;
  max-width: 100px;
  min-width: 0
}

.Bdt9E9__dex {
  line-height: 1.4;
  white-space: normal;
  word-break: break-word
}

.Bdt9E9__dex,
.p1jR6S__dex {
  font-size: 12px;
  font-weight: 500;
  margin-left: 4px
}

.p1jR6S__dex {
  flex-shrink: 0;
  white-space: nowrap
}

.U3tU6v__dex {
  background: var(--dex-module-bg-color);
  border-radius: 4px;
  display: flex;
  flex: 1 1;
  flex-direction: column;
  height: 100%;
  max-width: 480px;
  min-width: 296px;
  overflow: hidden
}

.KemHba__dex {
  flex: 1 1;
  overflow: hidden
}

.MNVe3E__dex {
  background-color: var(--dex-okd-color-border-contrast);
  background: var(--dex-okd-color-border-primary);
  flex-shrink: 0;
  position: relative;
  transition: background-color .15s ease;
  -webkit-user-select: none;
  -moz-user-select: none;
  -ms-user-select: none;
  user-select: none
}

.MNVe3E__dex:hover {
  background-color: var(--dex-okd-color-content-disabled)
}

.MNVe3E__dex:hover:after {
  color: var(--dex-okd-color-content-tertiary)
}

.MNVe3E__dex.AfpiIn__dex {
  background-color: var(--dex-okd-color-content-disabled);
  transition: none;
  z-index: 1000
}

.MNVe3E__dex.AfpiIn__dex:after {
  color: var(--dex-okd-color-content-tertiary)
}

.O4BsOU__dex {
  background: transparent;
  border: none;
  content: "";
  margin: 0;
  padding: 0;
  pointer-events: auto;
  position: absolute;
  -webkit-user-select: none;
  -moz-user-select: none;
  -ms-user-select: none;
  user-select: none;
  z-index: 10
}

.bsEYQK__dex {
  height: 100%;
  width: 4px
}

.bsEYQK__dex .O4BsOU__dex {
  cursor: ew-resize;
  height: 100%;
  left: -6px;
  top: 0;
  width: 16px
}

.bsEYQK__dex:after {
  align-items: center;
  color: var(--dex-okd-color-content-contrast);
  content: "\00B7\00B7\00B7";
  cursor: ew-resize;
  display: flex;
  font-size: 20px;
  height: 20px;
  justify-content: center;
  left: 50%;
  position: absolute;
  top: 50%;
  transform: translate(-50%, -3.25px);
  transform: rotate(90deg) translate(-8px, .75px);
  width: 4px
}

.ktuVPa__dex {
  height: 4px;
  width: 100%
}

.ktuVPa__dex .O4BsOU__dex {
  cursor: ns-resize;
  height: 16px;
  left: 0;
  top: -6px;
  width: 100%
}

.ktuVPa__dex:after {
  align-items: center;
  color: var(--dex-okd-color-content-contrast);
  content: "\00B7\00B7\00B7";
  cursor: ns-resize;
  display: flex;
  font-size: 20px;
  height: 4px;
  justify-content: center;
  left: 50%;
  position: absolute;
  top: 50%;
  transform: translate(-50%, -3.25px);
  width: 20px
}

.lHqOPo__dex {
  bottom: 0;
  left: 0;
  pointer-events: auto;
  position: fixed;
  right: 0;
  top: 0;
  z-index: 9999
}

.lHqOPo__dex.cwvp3d__dex {
  cursor: ew-resize
}

.lHqOPo__dex.qdy8LG__dex {
  cursor: ns-resize
}

.qOCwfK__dex {
  display: flex;
  flex-direction: column;
  height: 100%;
  overflow: hidden;
  position: relative
}

.Z6wL4G__dex {
  flex-shrink: 0
}

.Z6wL4G__dex,
.sOB89Q__dex {
  min-height: 48px;
  overflow: hidden
}

.sOB89Q__dex {
  flex: 1 1
}

.H4xefq__dex {
  display: flex;
  position: relative
}

.sCxLnS__dex {
  flex-direction: row
}

.s8PE7u__dex {
  flex-direction: row-reverse
}

.OYre8H__dex,
.Priri___dex {
  -webkit-backdrop-filter: blur(2.5px);
  backdrop-filter: blur(2.5px);
  background: var(--dex-okd-color-global-alpha-inverse-5);
  border: 1px dashed var(--dex-okd-color-brand-primary-alternative);
  border-radius: 8px;
  box-shadow: 0 4px 4px 0 rgba(var(--dex-okd-color-background-base-primary-rgb), .25);
  content: "";
  height: 50%;
  left: 0;
  position: absolute;
  width: 100%;
  z-index: 100
}

.Priri___dex {
  top: 0
}

.c2SD5l__dex {
  -webkit-backdrop-filter: blur(2.5px);
  backdrop-filter: blur(2.5px);
  background: var(--dex-okd-color-global-alpha-inverse-5);
  border: 1px dashed var(--dex-okd-color-brand-primary-alternative);
  border-radius: 8px;
  bottom: 0;
  box-shadow: 0 4px 4px 0 rgba(var(--dex-okd-color-background-base-primary-rgb), .25);
  content: "";
  height: 50%;
  left: 0;
  position: absolute;
  width: 100%;
  z-index: 100
}

.EalrWk__dex,
.aXh10k__dex {
  background-color: initial;
  height: 20px;
  left: 0;
  pointer-events: none;
  position: absolute;
  width: 100%;
  z-index: 100
}

.EalrWk__dex {
  top: 0
}

.wRkgEZ__dex {
  background-color: initial;
  bottom: 0;
  height: 20px;
  left: 0;
  pointer-events: none;
  position: absolute;
  width: 100%;
  z-index: 100
}

.v6fmMR__dex {
  background: var(--dex-module-bg-color);
  box-sizing: border-box;
  height: 100%;
  padding: 16px 16px 0
}

.ix_wCO__dex {
  align-items: center;
  background: var(--dex-okd-color-border-contrast);
  box-sizing: border-box;
  display: flex;
  flex-shrink: 0;
  gap: 4px;
  overflow: hidden;
  position: relative
}

.ZMtyaU__dex {
  border-right: 4px solid var(--dex-okd-color-border-contrast)
}

.WBnD6o__dex {
  border-left: 4px solid var(--dex-okd-color-border-contrast)
}

.auL8ht__dex {
  display: flex;
  flex-shrink: 0;
  position: relative
}

.dLpkol__dex {
  background: transparent;
  border-radius: 4px;
  height: 100%;
  pointer-events: none;
  position: absolute;
  width: 20px;
  z-index: 1000
}

.V5sSUQ__dex {
  -webkit-backdrop-filter: blur(2.5px);
  backdrop-filter: blur(2.5px);
  background: var(--dex-okd-color-global-alpha-inverse-5);
  border: 1px dashed var(--dex-okd-color-brand-primary-alternative);
  box-shadow: 0 4px 4px 0 rgba(var(--dex-okd-color-background-base-primary-rgb), .25)
}

.Qy8rPB__dex {
  left: 0
}

.u25rvG__dex {
  right: 0
}

.IhnrZB__dex {
  background-color: var(--dex-okd-color-border-contrast);
  display: flex;
  flex-direction: column;
  height: 100vh;
  height: calc(100vh - var(--global-header-height, 0px));
  position: relative
}

.IhnrZB__dex.RArVOz__dex {
  height: calc(100vh - 28px);
  height: calc(100vh - var(--global-header-height, 0px) - 28px)
}

._bwAmq__dex {
  border-top: 4px solid var(--dex-okd-color-border-contrast);
  box-sizing: border-box;
  display: flex;
  height: calc(100% - 36px)
}

.EXl7cw__dex {
  -ms-overflow-style: none;
  background-color: var(--dex-okd-color-background-base-primary);
  flex: 1 1;
  min-width: 20px;
  overflow-x: hidden;
  overflow-y: auto
}

.EXl7cw__dex::-webkit-scrollbar {
  display: none
}

.FnHKB0__dex {
  height: 100%;
  min-width: 768px
}

.theme-dark {
  --dex-module-bg-color: var(--dex-okd-color-background-surface-disable);
  --dex-module-bg-color-rgb: var(--dex-okd-color-background-surface-disable-rgb);
  --dex-card-bg-color: var(--dex-okd-color-container-lv2)
}

.theme-light {
  --dex-module-bg-color: var(--dex-okd-color-background-base-primary);
  --dex-module-bg-color-rgb: var(--dex-okd-color-background-base-primary-rgb);
  --dex-card-bg-color: var(--dex-okd-color-card-secondary);
  --dex-okd-color-background-base-primary-rgb: 255, 255, 255;
  --dex-okd-color-background-base-secondary-rgb: 250, 250, 250;
  --dex-okd-color-background-surface-primary-rgb: 243, 243, 243;
  --dex-okd-color-background-surface-secondary-rgb: 246, 246, 246;
  --dex-okd-color-background-surface-pressed-rgb: 217, 217, 217;
  --dex-okd-color-background-surface-disable-rgb: 250, 250, 250;
  --dex-okd-color-container-primary-rgb: 255, 255, 255;
  --dex-okd-color-container-secondary-rgb: 250, 250, 250;
  --dex-okd-color-container-tertiary-rgb: 255, 255, 255;
  --dex-okd-color-container-contrast-rgb: 65, 65, 65;
  --dex-okd-color-container-inverse-rgb: 14, 14, 14;
  --dex-okd-color-content-primary-rgb: 0, 0, 0;
  --dex-okd-color-content-secondary-rgb: 56, 56, 56;
  --dex-okd-color-content-tertiary-rgb: 91, 91, 91;
  --dex-okd-color-content-contrast-rgb: 144, 144, 144;
  --dex-okd-color-content-disabled-rgb: 179, 179, 179;
  --dex-okd-color-content-inverse-rgb: 255, 255, 255;
  --dex-okd-color-border-primary-rgb: 230, 230, 230;
  --dex-okd-color-border-secondary-rgb: 179, 179, 179;
  --dex-okd-color-border-contrast-rgb: 250, 250, 250;
  --dex-okd-color-border-selected-rgb: 0, 0, 0;
  --dex-okd-color-semantic-neutral-rgb: 0, 0, 0;
  --dex-okd-color-semantic-notice-rgb: 255, 177, 23;
  --dex-okd-color-semantic-positive-rgb: 49, 189, 101;
  --dex-okd-color-semantic-negative-rgb: 235, 75, 109;
  --dex-okd-color-semantic-informative-rgb: 138, 145, 255;
  --dex-okd-color-semantic-highlight-rgb: 188, 255, 47;
  --dex-okd-color-dvp-profit-rgb: 0, 188, 75;
  --dex-okd-color-dvp-loss-rgb: 245, 56, 79;
  --dex-okd-color-categorical-01-rgb: 138, 145, 255;
  --dex-okd-color-categorical-02-rgb: 255, 177, 23;
  --dex-okd-color-categorical-03-rgb: 188, 255, 47;
  --dex-okd-color-categorical-04-rgb: 18, 227, 102;
  --dex-okd-color-categorical-05-rgb: 255, 120, 136;
  --dex-okd-color-alert-info-rgb: 247, 247, 247;
  --dex-okd-color-alert-success-rgb: 234, 248, 240;
  --dex-okd-color-alert-warning-rgb: 254, 249, 246;
  --dex-okd-color-alert-error-rgb: 253, 237, 240;
  --dex-okd-color-common-background-2-rgb: 243, 243, 243;
  --dex-okd-color-data-visualization-category-01-rgb: 138, 145, 255;
  --dex-okd-color-data-visualization-category-02-rgb: 255, 177, 23;
  --dex-okd-color-data-visualization-category-03-rgb: 188, 255, 47;
  --dex-okd-color-data-visualization-category-04-rgb: 18, 227, 102;
  --dex-okd-color-data-visualization-category-05-rgb: 255, 120, 136;
  --dex-okd-color-preference-loss-rgb: 245, 56, 79;
  --dex-okd-color-preference-profit-rgb: 0, 188, 75;
  --dex-okd-color-border-focus-rgb: 0, 0, 0;
  --dex-okd-color-background-base-primary_alternative-rgb: 255, 255, 255;
  --dex-okd-color-link-content-rgb: 76, 47, 255;
  --dex-okd-color-link-accent-content-primary-rgb: 43, 109, 23;
  --dex-okd-color-background-surface-contrast-rgb: 255, 255, 255;
  --dex-okd-color-background-surface-brand-rgb: 0, 0, 0;
  --dex-okd-color-border-tertiary-rgb: 243, 243, 243;
  --dex-okd-color-content-brand-rgb: 0, 0, 0;
  --dex-okd-color-modal-primary-rgb: 255, 255, 255;
  --dex-okd-color-modal-secondary-rgb: 255, 255, 255;
  --dex-okd-color-modal-tertiary-rgb: 255, 255, 255;
  --dex-okd-color-modal-contrast-rgb: 77, 77, 77;
  --dex-okd-color-card-primary-rgb: 246, 246, 246;
  --dex-okd-color-card-secondary-rgb: 246, 246, 246;
  --dex-okd-color-brand-primary-rgb: 43, 109, 23;
  --dex-okd-color-brand-primary-alternative-rgb: 43, 109, 23;
  --dex-okd-color-brand-secondary-rgb: 142, 197, 29;
  --dex-okd-color-brand-tertiary-rgb: 188, 255, 47;
  --dex-okd-color-brand-content-rgb: 230, 255, 176;
  --dex-okd-color-brand-content-contrast-rgb: 230, 255, 176;
  --dex-okd-color-global-fixed-always-dark-rgb: 0, 0, 0;
  --dex-okd-color-global-fixed-always-light-rgb: 255, 255, 255;
  --dex-okd-color-surface-structural-subbase-rgb: 246, 246, 246;
  --dex-okd-color-surface-info-default-rgb: 74, 74, 74;
  --dex-okd-color-surface-info-subtle-rgb: 246, 246, 246;
  --dex-okd-color-surface-warning-default-rgb: 254, 160, 29;
  --dex-okd-color-surface-warning-subtle-rgb: 255, 237, 203;
  --dex-okd-color-surface-success-default-rgb: 60, 143, 36;
  --dex-okd-color-surface-success-subtle-rgb: 233, 244, 209;
  --dex-okd-color-surface-danger-default-rgb: 211, 58, 76;
  --dex-okd-color-surface-danger-subtle-rgb: 254, 224, 227;
  --dex-okd-color-surface-interactive-selected-default-rgb: 0, 0, 0;
  --dex-okd-color-surface-structural-base-rgb: 255, 255, 255;
  --dex-okd-color-surface-structural-layer-1-rgb: 246, 246, 246;
  --dex-okd-color-surface-structural-layer-2-rgb: 233, 233, 233;
  --dex-okd-color-surface-structural-layer-3-rgb: 220, 220, 220;
  --dex-okd-color-surface-structural-highlight-rgb: var(--global-color-highlight-rgb);
  --dex-okd-color-surface-structural-inverse-rgb: 0, 0, 0;
  --dex-okd-color-surface-structural-elevated-default-rgb: 255, 255, 255;
  --dex-okd-color-surface-structural-elevated-contrast-rgb: 255, 255, 255;
  --dex-okd-color-border-interactive-hovered-rgb: 51, 51, 51;
  --dex-okd-color-border-interactive-pressed-rgb: 0, 0, 0;
  --dex-okd-color-border-interactive-focused-rgb: 0, 0, 0;
  --dex-okd-color-border-interactive-selected-rgb: 0, 0, 0;
  --dex-okd-color-border-interactive-error-rgb: 186, 33, 51;
  --dex-okd-color-border-interactive-emphasis-rgb: 74, 74, 74;
  --dex-okd-color-border-interactive-oncolor-rgb: 233, 233, 233;
  --dex-okd-color-border-static-emphasis-rgb: 74, 74, 74;
  --dex-okd-color-border-static-experience-rgb: var(--global-color-experience-default-rgb);
  --dex-okd-color-border-static-highlight-rgb: var(--global-color-highlight-rgb);
  --dex-okd-color-border-info-default-rgb: 33, 33, 33;
  --dex-okd-color-border-info-subtle-rgb: 117, 117, 117;
  --dex-okd-color-border-warning-default-rgb: 186, 93, 0;
  --dex-okd-color-border-warning-subtle-rgb: 255, 237, 203;
  --dex-okd-color-border-success-default-rgb: 43, 109, 23;
  --dex-okd-color-border-success-subtle-rgb: 233, 244, 209;
  --dex-okd-color-border-danger-default-rgb: 186, 33, 51;
  --dex-okd-color-border-danger-subtle-rgb: 254, 224, 227;
  --dex-okd-color-content-static-default-rgb: 0, 0, 0;
  --dex-okd-color-content-interactive-default-rgb: 74, 74, 74;
  --dex-okd-color-content-interactive-subtle-rgb: 117, 117, 117;
  --dex-okd-color-content-interactive-hovered-rgb: 33, 33, 33;
  --dex-okd-color-content-static-subtle-rgb: 94, 94, 94;
  --dex-okd-color-content-interactive-pressed-rgb: 0, 0, 0;
  --dex-okd-color-content-static-inverse-rgb: 255, 255, 255;
  --dex-okd-color-content-static-highlight-rgb: var(--global-color-highlight-rgb);
  --dex-okd-color-content-interactive-active-rgb: 0, 0, 0;
  --dex-okd-color-content-interactive-selected-rgb: 0, 0, 0;
  --dex-okd-color-content-interactive-error-rgb: 186, 33, 51;
  --dex-okd-color-content-info-default-rgb: 33, 33, 33;
  --dex-okd-color-content-info-subtle-rgb: 117, 117, 117;
  --dex-okd-color-content-warning-default-rgb: 186, 93, 0;
  --dex-okd-color-content-warning-subtle-rgb: 255, 237, 203;
  --dex-okd-color-content-success-default-rgb: 43, 109, 23;
  --dex-okd-color-content-success-subtle-rgb: 233, 244, 209;
  --dex-okd-color-content-danger-default-rgb: 186, 33, 51;
  --dex-okd-color-content-danger-subtle-rgb: 254, 224, 227;
  --dex-okd-color-content-illustration-default-rgb: 0, 0, 0;
  --dex-okd-color-content-dataviz-categorical-1-rgb: var(--global-color-feature-default-rgb);
  --dex-okd-color-content-dataviz-categorical-2-rgb: 11, 91, 203;
  --dex-okd-color-content-dataviz-categorical-3-rgb: 226, 132, 0;
  --dex-okd-color-content-dataviz-categorical-4-rgb: 219, 176, 29;
  --dex-okd-color-content-dataviz-categorical-5-rgb: 149, 67, 255;
  --dex-okd-color-content-dataviz-categorical-6-rgb: 94, 94, 94;
  --dex-okd-color-content-dataviz-categorical-7-rgb: 133, 133, 133;
  --dex-okd-color-content-dataviz-categorical-8-rgb: 175, 175, 175;
  --dex-okd-color-content-illustration-inverse-rgb: 255, 255, 255;
  --dex-okd-color-content-illustration-experience-rgb: var(--global-color-experience-default-rgb);
  --dex-okd-color-content-illustration-highlight-rgb: var(--global-color-highlight-rgb);
  --dex-okd-color-global-alpha-pnl-profit-rgb: var(--global-color-profit-alpha-rgb);
  --dex-okd-color-global-alpha-pnl-loss-rgb: var(--global-color-loss-alpha-rgb);
  --dex-okd-color-surface-pnl-profit-default-rgb: var(--global-color-profit-surface-default-rgb);
  --dex-okd-color-surface-pnl-profit-hovered-rgb: var(--global-color-profit-surface-hovered-rgb);
  --dex-okd-color-surface-pnl-profit-pressed-rgb: var(--global-color-profit-surface-pressed-rgb);
  --dex-okd-color-surface-pnl-profit-tint-rgb: var(--global-color-profit-tint-rgb);
  --dex-okd-color-surface-pnl-loss-default-rgb: var(--global-color-loss-surface-default-rgb);
  --dex-okd-color-surface-pnl-loss-hovered-rgb: var(--global-color-loss-surface-hovered-rgb);
  --dex-okd-color-surface-pnl-loss-pressed-rgb: var(--global-color-loss-surface-pressed-rgb);
  --dex-okd-color-surface-pnl-loss-tint-rgb: var(--global-color-loss-tint-rgb);
  --dex-okd-color-surface-pnl-neutral-default-rgb: var(--global-color-neutral-surface-default-rgb);
  --dex-okd-color-surface-pnl-neutral-hovered-rgb: var(--global-color-neutral-surface-hovered-rgb);
  --dex-okd-color-surface-pnl-neutral-pressed-rgb: var(--global-color-neutral-surface-pressed-rgb);
  --dex-okd-color-surface-interactive-feature-default-rgb: var(--global-color-feature-default-rgb);
  --dex-okd-color-surface-interactive-experience-default-rgb: var(--global-color-experience-default-rgb);
  --dex-okd-color-surface-interactive-experience-hovered-rgb: var(--global-color-experience-hovered-rgb);
  --dex-okd-color-surface-interactive-experience-pressed-rgb: var(--global-color-experience-pressed-rgb);
  --dex-okd-color-surface-interactive-feature-hovered-rgb: var(--global-color-feature-hovered-rgb);
  --dex-okd-color-surface-interactive-feature-pressed-rgb: var(--global-color-feature-pressed-rgb);
  --dex-okd-color-surface-pnl-loss-graph-rgb: var(--global-color-loss-graph-rgb);
  --dex-okd-color-surface-structural-feature-rgb: var(--global-color-feature-default-rgb);
  --dex-okd-color-surface-structural-experience-rgb: var(--global-color-experience-default-rgb);
  --dex-okd-color-border-interactive-feature-default-rgb: var(--global-color-feature-default-rgb);
  --dex-okd-color-border-interactive-feature-hovered-rgb: var(--global-color-feature-hovered-rgb);
  --dex-okd-color-border-interactive-feature-pressed-rgb: var(--global-color-feature-pressed-rgb);
  --dex-okd-color-border-static-feature-rgb: var(--global-color-feature-default-rgb);
  --dex-okd-color-content-static-subtler-rgb: 133, 133, 133;
  --dex-okd-color-content-static-feature-rgb: var(--global-color-feature-default-rgb);
  --dex-okd-color-content-static-experience-rgb: var(--global-color-experience-default-rgb);
  --dex-okd-color-content-pnl-profit-default-rgb: var(--global-color-profit-default-rgb);
  --dex-okd-color-content-illustration-feature-rgb: var(--global-color-feature-default-rgb);
  --dex-okd-color-content-pnl-profit-oncolor-rgb: var(--global-color-profit-oncolor-rgb);
  --dex-okd-color-content-pnl-loss-default-rgb: var(--global-color-loss-default-rgb);
  --dex-okd-color-content-pnl-loss-oncolor-rgb: var(--global-color-loss-oncolor-rgb);
  --dex-okd-color-content-pnl-neutral-default-rgb: var(--global-color-neutral-default-rgb);
  --dex-okd-color-content-pnl-neutral-oncolor-rgb: var(--global-color-neutral-oncolor-rgb);
  --dex-okd-color-surface-pnl-profit-graph-rgb: var(--global-color-profit-graph-rgb);
  --dex-okd-color-surface-pnl-neutral-graph-rgb: var(--global-color-neutral-graph-rgb);
  --dex-okd-color-border-interactive-experience-default-rgb: var(--global-color-experience-default-rgb);
  --dex-okd-color-border-interactive-experience-hovered-rgb: var(--global-color-experience-hovered-rgb);
  --dex-okd-color-border-interactive-experience-pressed-rgb: var(--global-color-experience-pressed-rgb);
  --dex-okd-color-content-interactive-feature-default-rgb: var(--global-color-feature-default-rgb);
  --dex-okd-color-content-interactive-feature-hovered-rgb: var(--global-color-feature-hovered-rgb);
  --dex-okd-color-content-interactive-feature-pressed-rgb: var(--global-color-feature-pressed-rgb);
  --dex-okd-color-content-interactive-experience-default-rgb: var(--global-color-experience-default-rgb);
  --dex-okd-color-content-interactive-experience-alternative-rgb: var(--global-color-experience-alternative-rgb);
  --dex-okd-color-content-interactive-experience-accent-rgb: var(--global-color-experience-accent-rgb);
  --dex-okd-color-content-interactive-experience-hovered-rgb: var(--global-color-experience-hovered-rgb);
  --dex-okd-color-content-interactive-experience-pressed-rgb: var(--global-color-experience-pressed-rgb);
  --dex-okd-color-content-interactive-experience-inverse-rgb: var(--global-color-experience-inverse-rgb);
  --dex-okd-color-content-interactive-feature-inverse-default-rgb: var(--global-color-feature-primary-inverse-default-rgb);
  --dex-okd-color-content-interactive-feature-inverse-hovered-rgb: var(--global-color-feature-primary-inverse-hovered-rgb);
  --dex-okd-color-content-interactive-feature-inverse-pressed-rgb: var(--global-color-feature-primary-inverse-pressed-rgb);
  --dex-okd-color-surface-interactive-feature-inverse-default-rgb: var(--global-color-feature-primary-inverse-default-rgb);
  --dex-okd-color-surface-interactive-feature-inverse-hovered-rgb: var(--global-color-feature-primary-inverse-hovered-rgb);
  --dex-okd-color-surface-interactive-feature-inverse-pressed-rgb: var(--global-color-feature-primary-inverse-pressed-rgb);
  --dex-okd-color-border-pnl-loss-default-rgb: var(--global-color-loss-default-rgb);
  --dex-okd-color-border-pnl-loss-graph-rgb: var(--global-color-loss-graph-rgb);
  --dex-okd-color-border-pnl-profit-default-rgb: var(--global-color-profit-default-rgb);
  --dex-okd-color-border-pnl-profit-graph-rgb: var(--global-color-profit-graph-rgb);
  --dex-okd-color-border-pnl-neutral-graph-rgb: var(--global-color-neutral-graph-rgb);
  --dex-okd-color-content-static-notification-rgb: 224, 90, 106;
  --dex-okd-color-surface-structural-elevated-layer-1-rgb: 246, 246, 246;
  --dex-okd-color-surface-interactive-destructive-default-rgb: 224, 90, 106;
  --dex-okd-color-surface-interactive-destructive-hovered-rgb: 211, 58, 76;
  --dex-okd-color-surface-interactive-destructive-pressed-rgb: 186, 33, 51;
  --dex-okd-color-surface-structural-web-only-base-rgb: 246, 246, 246;
  --dex-okd-color-surface-structural-web-only-layer-1-rgb: 255, 255, 255;
  --dex-okd-color-surface-interactive-destructive-subtle-default-rgb: 254, 224, 227;
  --dex-okd-color-surface-interactive-destructive-subtle-hovered-rgb: 255, 190, 197;
  --dex-okd-color-surface-interactive-destructive-subtle-pressed-rgb: 255, 143, 156;
  --dex-okd-color-surface-pnl-profit-default-new-rgb: var(--global-color-profit-surface-default-new-rgb);
  --dex-okd-color-surface-pnl-profit-emphasis-rgb: var(--global-color-profit-surface-emphasis-rgb);
  --dex-okd-color-surface-pnl-loss-default-new-rgb: var(--global-color-loss-surface-default-new-rgb);
  --dex-okd-color-surface-pnl-loss-emphasis-rgb: var(--global-color-loss-surface-emphasis-rgb);
  --dex-okd-color-content-pnl-profit-oncolor-default-rgb: var(--global-color-profit-default-rgb);
  --dex-okd-color-content-pnl-profit-oncolor-emphasis-rgb: var(--global-color-profit-oncolor-rgb);
  --dex-okd-color-content-pnl-loss-oncolor-default-rgb: var(--global-color-loss-default-rgb);
  --dex-okd-color-content-pnl-loss-oncolor-emphasis-rgb: var(--global-color-loss-oncolor-rgb);
  --dex-okd-color-surface-pnl-profit-gradient-max-rgb: var(--global-color-profit-gradient-max-rgb);
  --dex-okd-color-surface-pnl-profit-gradient-min-rgb: var(--global-color-profit-gradient-min-rgb)
}

.theme-dark {
  --dex-okd-color-background-base-primary-rgb: 0, 0, 0;
  --dex-okd-color-background-base-secondary-rgb: 18, 18, 18;
  --dex-okd-color-background-surface-primary-rgb: 29, 29, 29;
  --dex-okd-color-background-surface-secondary-rgb: 18, 18, 18;
  --dex-okd-color-background-surface-pressed-rgb: 56, 56, 56;
  --dex-okd-color-background-surface-disable-rgb: 14, 14, 14;
  --dex-okd-color-container-primary-rgb: 39, 39, 39;
  --dex-okd-color-container-secondary-rgb: 39, 39, 39;
  --dex-okd-color-container-tertiary-rgb: 56, 56, 56;
  --dex-okd-color-container-contrast-rgb: 65, 65, 65;
  --dex-okd-color-container-inverse-rgb: 250, 250, 250;
  --dex-okd-color-content-primary-rgb: 255, 255, 255;
  --dex-okd-color-content-secondary-rgb: 230, 230, 230;
  --dex-okd-color-content-tertiary-rgb: 179, 179, 179;
  --dex-okd-color-content-contrast-rgb: 144, 144, 144;
  --dex-okd-color-content-disabled-rgb: 91, 91, 91;
  --dex-okd-color-content-inverse-rgb: 0, 0, 0;
  --dex-okd-color-border-primary-rgb: 56, 56, 56;
  --dex-okd-color-border-secondary-rgb: 77, 77, 77;
  --dex-okd-color-border-contrast-rgb: 0, 0, 0;
  --dex-okd-color-border-selected-rgb: 255, 255, 255;
  --dex-okd-color-semantic-neutral-rgb: 255, 255, 255;
  --dex-okd-color-semantic-notice-rgb: 255, 177, 23;
  --dex-okd-color-semantic-positive-rgb: 37, 167, 80;
  --dex-okd-color-semantic-negative-rgb: 202, 63, 100;
  --dex-okd-color-semantic-informative-rgb: 138, 145, 255;
  --dex-okd-color-semantic-highlight-rgb: 188, 255, 47;
  --dex-okd-color-dvp-profit-rgb: 37, 167, 80;
  --dex-okd-color-dvp-loss-rgb: 202, 63, 100;
  --dex-okd-color-categorical-01-rgb: 95, 98, 255;
  --dex-okd-color-categorical-02-rgb: 255, 177, 23;
  --dex-okd-color-categorical-03-rgb: 188, 255, 47;
  --dex-okd-color-categorical-04-rgb: 0, 188, 75;
  --dex-okd-color-categorical-05-rgb: 245, 56, 79;
  --dex-okd-color-container-lv2-rgb: 26, 26, 26;
  --dex-okd-color-alert-info-rgb: 46, 46, 46;
  --dex-okd-color-alert-success-rgb: 0, 43, 31;
  --dex-okd-color-alert-warning-rgb: 54, 22, 4;
  --dex-okd-color-alert-error-rgb: 39, 11, 18;
  --dex-okd-color-common-background-2-rgb: 56, 56, 56;
  --dex-okd-color-data-visualization-category-01-rgb: 95, 98, 255;
  --dex-okd-color-data-visualization-category-02-rgb: 255, 177, 23;
  --dex-okd-color-data-visualization-category-03-rgb: 188, 255, 47;
  --dex-okd-color-data-visualization-category-04-rgb: 0, 188, 75;
  --dex-okd-color-data-visualization-category-05-rgb: 245, 56, 79;
  --dex-okd-color-preference-loss-rgb: 202, 63, 100;
  --dex-okd-color-preference-profit-rgb: 37, 167, 80;
  --dex-okd-color-border-focus-rgb: 255, 255, 255;
  --dex-okd-color-background-base-primary_alternative-rgb: 0, 0, 0;
  --dex-okd-color-link-content-rgb: 138, 145, 255;
  --dex-okd-color-link-accent-content-primary-rgb: 188, 255, 47;
  --dex-okd-color-background-surface-contrast-rgb: 39, 39, 39;
  --dex-okd-color-background-surface-brand-rgb: 188, 255, 47;
  --dex-okd-color-border-tertiary-rgb: 14, 14, 14;
  --dex-okd-color-content-brand-rgb: 188, 255, 47;
  --dex-okd-color-modal-primary-rgb: 14, 14, 14;
  --dex-okd-color-modal-secondary-rgb: 39, 39, 39;
  --dex-okd-color-modal-tertiary-rgb: 56, 56, 56;
  --dex-okd-color-modal-contrast-rgb: 77, 77, 77;
  --dex-okd-color-card-primary-rgb: 14, 14, 14;
  --dex-okd-color-card-secondary-rgb: 18, 18, 18;
  --dex-okd-color-brand-primary-rgb: 18, 18, 18;
  --dex-okd-color-brand-primary-alternative-rgb: 188, 255, 47;
  --dex-okd-color-brand-secondary-rgb: 39, 39, 39;
  --dex-okd-color-brand-tertiary-rgb: 56, 56, 56;
  --dex-okd-color-brand-content-rgb: 230, 255, 176;
  --dex-okd-color-brand-content-contrast-rgb: 0, 0, 0;
  --dex-okd-color-global-fixed-always-dark-rgb: 0, 0, 0;
  --dex-okd-color-global-fixed-always-light-rgb: 255, 255, 255;
  --dex-okd-color-surface-structural-subbase-rgb: 18, 18, 18;
  --dex-okd-color-surface-info-default-rgb: 184, 184, 184;
  --dex-okd-color-surface-info-subtle-rgb: 18, 18, 18;
  --dex-okd-color-surface-warning-default-rgb: 245, 169, 21;
  --dex-okd-color-surface-warning-subtle-rgb: 77, 50, 0;
  --dex-okd-color-surface-success-default-rgb: 60, 143, 36;
  --dex-okd-color-surface-success-subtle-rgb: 25, 36, 0;
  --dex-okd-color-surface-danger-default-rgb: 255, 93, 115;
  --dex-okd-color-surface-danger-subtle-rgb: 66, 10, 16;
  --dex-okd-color-surface-interactive-selected-default-rgb: 255, 255, 255;
  --dex-okd-color-surface-structural-base-rgb: 0, 0, 0;
  --dex-okd-color-surface-structural-layer-1-rgb: 18, 18, 18;
  --dex-okd-color-surface-structural-layer-2-rgb: 44, 44, 44;
  --dex-okd-color-surface-structural-layer-3-rgb: 63, 63, 63;
  --dex-okd-color-surface-structural-highlight-rgb: var(--global-color-highlight-rgb);
  --dex-okd-color-surface-structural-inverse-rgb: 255, 255, 255;
  --dex-okd-color-surface-structural-elevated-default-rgb: 23, 23, 23;
  --dex-okd-color-surface-structural-elevated-contrast-rgb: 52, 52, 52;
  --dex-okd-color-border-interactive-hovered-rgb: 207, 207, 207;
  --dex-okd-color-border-interactive-pressed-rgb: 255, 255, 255;
  --dex-okd-color-border-interactive-focused-rgb: 255, 255, 255;
  --dex-okd-color-border-interactive-selected-rgb: 255, 255, 255;
  --dex-okd-color-border-interactive-error-rgb: 245, 122, 138;
  --dex-okd-color-border-interactive-emphasis-rgb: 184, 184, 184;
  --dex-okd-color-border-interactive-oncolor-rgb: 44, 44, 44;
  --dex-okd-color-border-static-emphasis-rgb: 184, 184, 184;
  --dex-okd-color-border-static-experience-rgb: var(--global-color-experience-default-rgb);
  --dex-okd-color-border-static-highlight-rgb: var(--global-color-highlight-rgb);
  --dex-okd-color-border-info-default-rgb: 235, 235, 235;
  --dex-okd-color-border-info-subtle-rgb: 125, 125, 125;
  --dex-okd-color-border-warning-default-rgb: 255, 196, 82;
  --dex-okd-color-border-warning-subtle-rgb: 77, 50, 0;
  --dex-okd-color-border-success-default-rgb: 73, 169, 45;
  --dex-okd-color-border-success-subtle-rgb: 25, 36, 0;
  --dex-okd-color-border-danger-default-rgb: 245, 122, 138;
  --dex-okd-color-border-danger-subtle-rgb: 66, 10, 16;
  --dex-okd-color-content-static-default-rgb: 255, 255, 255;
  --dex-okd-color-content-interactive-default-rgb: 184, 184, 184;
  --dex-okd-color-content-interactive-subtle-rgb: 125, 125, 125;
  --dex-okd-color-content-interactive-hovered-rgb: 235, 235, 235;
  --dex-okd-color-content-static-subtle-rgb: 150, 150, 150;
  --dex-okd-color-content-interactive-pressed-rgb: 255, 255, 255;
  --dex-okd-color-content-static-inverse-rgb: 0, 0, 0;
  --dex-okd-color-content-static-highlight-rgb: var(--global-color-highlight-rgb);
  --dex-okd-color-content-interactive-active-rgb: 255, 255, 255;
  --dex-okd-color-content-interactive-selected-rgb: 255, 255, 255;
  --dex-okd-color-content-interactive-error-rgb: 245, 122, 138;
  --dex-okd-color-content-info-default-rgb: 235, 235, 235;
  --dex-okd-color-content-info-subtle-rgb: 125, 125, 125;
  --dex-okd-color-content-warning-default-rgb: 255, 196, 82;
  --dex-okd-color-content-warning-subtle-rgb: 77, 50, 0;
  --dex-okd-color-content-success-default-rgb: 73, 169, 45;
  --dex-okd-color-content-success-subtle-rgb: 25, 36, 0;
  --dex-okd-color-content-danger-default-rgb: 245, 122, 138;
  --dex-okd-color-content-danger-subtle-rgb: 66, 10, 16;
  --dex-okd-color-content-illustration-default-rgb: 255, 255, 255;
  --dex-okd-color-content-dataviz-categorical-1-rgb: var(--global-color-feature-default-rgb);
  --dex-okd-color-content-dataviz-categorical-2-rgb: 39, 122, 231;
  --dex-okd-color-content-dataviz-categorical-3-rgb: 255, 183, 41;
  --dex-okd-color-content-dataviz-categorical-4-rgb: 237, 199, 70;
  --dex-okd-color-content-dataviz-categorical-5-rgb: 172, 108, 255;
  --dex-okd-color-content-dataviz-categorical-6-rgb: 150, 150, 150;
  --dex-okd-color-content-dataviz-categorical-7-rgb: 99, 99, 99;
  --dex-okd-color-content-dataviz-categorical-8-rgb: 69, 69, 69;
  --dex-okd-color-content-illustration-inverse-rgb: 0, 0, 0;
  --dex-okd-color-content-illustration-experience-rgb: var(--global-color-experience-default-rgb);
  --dex-okd-color-content-illustration-highlight-rgb: var(--global-color-highlight-rgb);
  --dex-okd-color-global-alpha-pnl-profit-rgb: var(--global-color-profit-alpha-rgb);
  --dex-okd-color-global-alpha-pnl-loss-rgb: var(--global-color-loss-alpha-rgb);
  --dex-okd-color-surface-pnl-profit-default-rgb: var(--global-color-profit-surface-default-rgb);
  --dex-okd-color-surface-pnl-profit-hovered-rgb: var(--global-color-profit-surface-hovered-rgb);
  --dex-okd-color-surface-pnl-profit-pressed-rgb: var(--global-color-profit-surface-pressed-rgb);
  --dex-okd-color-surface-pnl-profit-tint-rgb: var(--global-color-profit-tint-rgb);
  --dex-okd-color-surface-pnl-loss-default-rgb: var(--global-color-loss-surface-default-rgb);
  --dex-okd-color-surface-pnl-loss-hovered-rgb: var(--global-color-loss-surface-hovered-rgb);
  --dex-okd-color-surface-pnl-loss-pressed-rgb: var(--global-color-loss-surface-pressed-rgb);
  --dex-okd-color-surface-pnl-loss-tint-rgb: var(--global-color-loss-tint-rgb);
  --dex-okd-color-surface-pnl-neutral-default-rgb: var(--global-color-neutral-surface-default-rgb);
  --dex-okd-color-surface-pnl-neutral-hovered-rgb: var(--global-color-neutral-surface-hovered-rgb);
  --dex-okd-color-surface-pnl-neutral-pressed-rgb: var(--global-color-neutral-surface-pressed-rgb);
  --dex-okd-color-surface-interactive-feature-default-rgb: var(--global-color-feature-default-rgb);
  --dex-okd-color-surface-interactive-experience-default-rgb: var(--global-color-experience-default-rgb);
  --dex-okd-color-surface-interactive-experience-hovered-rgb: var(--global-color-experience-hovered-rgb);
  --dex-okd-color-surface-interactive-experience-pressed-rgb: var(--global-color-experience-pressed-rgb);
  --dex-okd-color-surface-interactive-feature-hovered-rgb: var(--global-color-feature-hovered-rgb);
  --dex-okd-color-surface-interactive-feature-pressed-rgb: var(--global-color-feature-pressed-rgb);
  --dex-okd-color-surface-pnl-loss-graph-rgb: var(--global-color-loss-graph-rgb);
  --dex-okd-color-surface-structural-feature-rgb: var(--global-color-feature-default-rgb);
  --dex-okd-color-surface-structural-experience-rgb: var(--global-color-experience-default-rgb);
  --dex-okd-color-border-interactive-feature-default-rgb: var(--global-color-feature-default-rgb);
  --dex-okd-color-border-interactive-feature-hovered-rgb: var(--global-color-feature-hovered-rgb);
  --dex-okd-color-border-interactive-feature-pressed-rgb: var(--global-color-feature-pressed-rgb);
  --dex-okd-color-border-static-feature-rgb: var(--global-color-feature-default-rgb);
  --dex-okd-color-content-static-subtler-rgb: 99, 99, 99;
  --dex-okd-color-content-static-feature-rgb: var(--global-color-feature-default-rgb);
  --dex-okd-color-content-static-experience-rgb: var(--global-color-experience-default-rgb);
  --dex-okd-color-content-pnl-profit-default-rgb: var(--global-color-profit-default-rgb);
  --dex-okd-color-content-illustration-feature-rgb: var(--global-color-feature-default-rgb);
  --dex-okd-color-content-pnl-profit-oncolor-rgb: var(--global-color-profit-oncolor-rgb);
  --dex-okd-color-content-pnl-loss-default-rgb: var(--global-color-loss-default-rgb);
  --dex-okd-color-content-pnl-loss-oncolor-rgb: var(--global-color-loss-oncolor-rgb);
  --dex-okd-color-content-pnl-neutral-default-rgb: var(--global-color-neutral-default-rgb);
  --dex-okd-color-content-pnl-neutral-oncolor-rgb: var(--global-color-neutral-oncolor-rgb);
  --dex-okd-color-surface-pnl-profit-graph-rgb: var(--global-color-profit-graph-rgb);
  --dex-okd-color-surface-pnl-neutral-graph-rgb: var(--global-color-neutral-graph-rgb);
  --dex-okd-color-border-interactive-experience-default-rgb: var(--global-color-experience-default-rgb);
  --dex-okd-color-border-interactive-experience-hovered-rgb: var(--global-color-experience-hovered-rgb);
  --dex-okd-color-border-interactive-experience-pressed-rgb: var(--global-color-experience-pressed-rgb);
  --dex-okd-color-content-interactive-feature-default-rgb: var(--global-color-feature-default-rgb);
  --dex-okd-color-content-interactive-feature-hovered-rgb: var(--global-color-feature-hovered-rgb);
  --dex-okd-color-content-interactive-feature-pressed-rgb: var(--global-color-feature-pressed-rgb);
  --dex-okd-color-content-interactive-experience-default-rgb: var(--global-color-experience-default-rgb);
  --dex-okd-color-content-interactive-experience-alternative-rgb: var(--global-color-experience-alternative-rgb);
  --dex-okd-color-content-interactive-experience-accent-rgb: var(--global-color-experience-accent-rgb);
  --dex-okd-color-content-interactive-experience-hovered-rgb: var(--global-color-experience-hovered-rgb);
  --dex-okd-color-content-interactive-experience-pressed-rgb: var(--global-color-experience-pressed-rgb);
  --dex-okd-color-content-interactive-experience-inverse-rgb: var(--global-color-experience-inverse-rgb);
  --dex-okd-color-content-interactive-feature-inverse-default-rgb: var(--global-color-feature-primary-inverse-default-rgb);
  --dex-okd-color-content-interactive-feature-inverse-hovered-rgb: var(--global-color-feature-primary-inverse-hovered-rgb);
  --dex-okd-color-content-interactive-feature-inverse-pressed-rgb: var(--global-color-feature-primary-inverse-pressed-rgb);
  --dex-okd-color-surface-interactive-feature-inverse-default-rgb: var(--global-color-feature-primary-inverse-default-rgb);
  --dex-okd-color-surface-interactive-feature-inverse-hovered-rgb: var(--global-color-feature-primary-inverse-hovered-rgb);
  --dex-okd-color-surface-interactive-feature-inverse-pressed-rgb: var(--global-color-feature-primary-inverse-pressed-rgb);
  --dex-okd-color-border-pnl-loss-default-rgb: var(--global-color-loss-default-rgb);
  --dex-okd-color-border-pnl-loss-graph-rgb: var(--global-color-loss-graph-rgb);
  --dex-okd-color-border-pnl-profit-default-rgb: var(--global-color-profit-default-rgb);
  --dex-okd-color-border-pnl-profit-graph-rgb: var(--global-color-profit-graph-rgb);
  --dex-okd-color-border-pnl-neutral-graph-rgb: var(--global-color-neutral-graph-rgb);
  --dex-okd-color-content-static-notification-rgb: 245, 56, 79;
  --dex-okd-color-surface-structural-elevated-layer-1-rgb: 44, 44, 44;
  --dex-okd-color-surface-interactive-destructive-default-rgb: 245, 56, 79;
  --dex-okd-color-surface-interactive-destructive-hovered-rgb: 255, 93, 115;
  --dex-okd-color-surface-interactive-destructive-pressed-rgb: 245, 122, 138;
  --dex-okd-color-surface-structural-web-only-base-rgb: 0, 0, 0;
  --dex-okd-color-surface-structural-web-only-layer-1-rgb: 18, 18, 18;
  --dex-okd-color-surface-interactive-destructive-subtle-default-rgb: 66, 10, 16;
  --dex-okd-color-surface-interactive-destructive-subtle-hovered-rgb: 132, 9, 22;
  --dex-okd-color-surface-interactive-destructive-subtle-pressed-rgb: 200, 20, 42;
  --dex-okd-color-surface-pnl-profit-default-new-rgb: var(--global-color-profit-surface-default-new-rgb);
  --dex-okd-color-surface-pnl-profit-emphasis-rgb: var(--global-color-profit-surface-emphasis-rgb);
  --dex-okd-color-surface-pnl-loss-default-new-rgb: var(--global-color-loss-surface-default-new-rgb);
  --dex-okd-color-surface-pnl-loss-emphasis-rgb: var(--global-color-loss-surface-emphasis-rgb);
  --dex-okd-color-content-pnl-profit-oncolor-default-rgb: var(--global-color-profit-default-rgb);
  --dex-okd-color-content-pnl-profit-oncolor-emphasis-rgb: var(--global-color-profit-oncolor-rgb);
  --dex-okd-color-content-pnl-loss-oncolor-default-rgb: var(--global-color-loss-default-rgb);
  --dex-okd-color-content-pnl-loss-oncolor-emphasis-rgb: var(--global-color-loss-oncolor-rgb);
  --dex-okd-color-surface-pnl-profit-gradient-max-rgb: var(--global-color-profit-gradient-max-rgb);
  --dex-okd-color-surface-pnl-profit-gradient-min-rgb: var(--global-color-profit-gradient-min-rgb)
}

body {
  -ms-overflow-style: none;
  background: var(--dex-okd-color-background-base-primary);
  color: var(--dex-okd-color-content-primary);
  overflow-x: hidden
}

body::-webkit-scrollbar {
  display: none
}

body .home-container {
  min-height: 100vh;
  min-height: calc(100vh - var(--global-header-height, 0px))
}

*,
body,
html {
  touch-action: manipulation
}

.dex-form-item-no-style-hidden {
  display: none
}

.dex-form-item {
  flex: auto;
  max-width: 100%;
  min-height: auto
}

.dex-form-item.dex-form-item-hidden {
  display: none !important
}

.dex-form-item .dex-form-item-label {
  color: var(--dex-okd-input-label-color);
  position: relative
}

.dex-form-item .dex-form-item-label-text {
  font-weight: 500
}

.dex-form-item .dex-form-item-label.dex-form-item-label-required:before {
  color: #da252f;
  color: var(--dex-okd-form-item-label-required-color, #da252f);
  content: "*";
  margin-right: 4px;
  margin-right: var(--dex-okd-form-item-label-required-margin-horizontal, 4px)
}

.dex-form-item .dex-form-item-label-action {
  color: var(--dex-okd-input-action-color);
  position: absolute;
  right: 0;
  top: 50%;
  transform: translateY(-50%)
}

.dex-form-item .dex-form-item-control-input-content {
  flex: auto;
  max-width: 100%
}

.dex-form-item .dex-form-item-control-explain {
  margin-top: 4px;
  margin-top: var(--dex-okd-input-md-tip-margin, 4px);
  position: relative
}

.dex-form-item .dex-form-item-control-explain-error {
  color: var(--dex-okd-input-error-tips-color)
}

.dex-form-item .dex-form-item-control-explain-tip {
  color: var(--dex-okd-input-tips-text-color)
}

.dex-form-item .dex-form-item-control-extra {
  color: var(--dex-okd-input-tips-text-color);
  margin-top: 4px;
  margin-top: var(--dex-okd-input-md-tip-margin, 4px)
}

.dex-form * {
  box-sizing: border-box
}

.dex-form .dex-form-item {
  display: flex;
  vertical-align: top
}

.dex-form .dex-form-item.dex-form-item-no-margin,
.dex-form .dex-form-item:not(.dex-form-item-has-error-preserve-margin).dex-form-item-has-error,
.dex-form .dex-form-item:not(.dex-form-item-has-error-preserve-margin).dex-form-item-has-tip {
  margin-bottom: 0 !important
}

.dex-form .dex-form-item.dex-form-item-xs,
.dex-form .dex-form-item.dex-form-line.dex-form-item-has-name {
  margin-bottom: calc(var(--dex-okd-input-xs-tip-line-height) + var(--dex-okd-input-xs-tip-margin, 4px) + 5px)
}

.dex-form .dex-form-item.dex-form-item-xs .dex-form-item-label,
.dex-form .dex-form-item.dex-form-line.dex-form-item-has-name .dex-form-item-label {
  font-size: var(--dex-okd-input-xs-label-font-size)
}

.dex-form .dex-form-item.dex-form-item-xs.dex-form-item-has-error .dex-form-item-control-explain,
.dex-form .dex-form-item.dex-form-item-xs.dex-form-item-has-tip .dex-form-item-control-explain,
.dex-form .dex-form-item.dex-form-line.dex-form-item-has-name.dex-form-item-has-error .dex-form-item-control-explain,
.dex-form .dex-form-item.dex-form-line.dex-form-item-has-name.dex-form-item-has-tip .dex-form-item-control-explain {
  line-height: 1.6;
  min-height: calc(var(--dex-okd-input-xs-tip-line-height) + 9px);
  min-height: calc(var(--dex-okd-input-xs-tip-line-height) + var(--dex-okd-input-xs-tip-margin, 4px) + 5px)
}

.dex-form .dex-form-item.dex-form-item-xs .dex-form-item-control-extra,
.dex-form .dex-form-item.dex-form-line.dex-form-item-has-name .dex-form-item-control-extra {
  font-size: var(--dex-okd-input-xs-tip-font-size)
}

.dex-form .dex-form-item.dex-form-item-xs .dex-form-item-control-explain-error,
.dex-form .dex-form-item.dex-form-line.dex-form-item-has-name .dex-form-item-control-explain-error {
  font-size: var(--dex-okd-input-xs-error-font-size)
}

.dex-form .dex-form-item.dex-form-item-xs .dex-form-item-control-explain-tip,
.dex-form .dex-form-item.dex-form-line.dex-form-item-has-name .dex-form-item-control-explain-tip {
  font-size: var(--dex-okd-input-xs-tip-font-size)
}

.dex-form .dex-form-item.dex-form-item-sm,
.dex-form .dex-form-item.dex-form-line.dex-form-item-has-name {
  margin-bottom: calc(var(--dex-okd-input-sm-tip-line-height) + var(--dex-okd-input-sm-tip-margin, 4px) + 5px)
}

.dex-form .dex-form-item.dex-form-item-sm .dex-form-item-label,
.dex-form .dex-form-item.dex-form-line.dex-form-item-has-name .dex-form-item-label {
  font-size: var(--dex-okd-input-sm-label-font-size)
}

.dex-form .dex-form-item.dex-form-item-sm.dex-form-item-has-error .dex-form-item-control-explain,
.dex-form .dex-form-item.dex-form-item-sm.dex-form-item-has-tip .dex-form-item-control-explain,
.dex-form .dex-form-item.dex-form-line.dex-form-item-has-name.dex-form-item-has-error .dex-form-item-control-explain,
.dex-form .dex-form-item.dex-form-line.dex-form-item-has-name.dex-form-item-has-tip .dex-form-item-control-explain {
  line-height: 1.6;
  min-height: calc(var(--dex-okd-input-sm-tip-line-height) + 9px);
  min-height: calc(var(--dex-okd-input-sm-tip-line-height) + var(--dex-okd-input-sm-tip-margin, 4px) + 5px)
}

.dex-form .dex-form-item.dex-form-item-sm .dex-form-item-control-extra,
.dex-form .dex-form-item.dex-form-line.dex-form-item-has-name .dex-form-item-control-extra {
  font-size: var(--dex-okd-input-sm-tip-font-size)
}

.dex-form .dex-form-item.dex-form-item-sm .dex-form-item-control-explain-error,
.dex-form .dex-form-item.dex-form-line.dex-form-item-has-name .dex-form-item-control-explain-error {
  font-size: var(--dex-okd-input-sm-error-font-size)
}

.dex-form .dex-form-item.dex-form-item-sm .dex-form-item-control-explain-tip,
.dex-form .dex-form-item.dex-form-line.dex-form-item-has-name .dex-form-item-control-explain-tip {
  font-size: var(--dex-okd-input-sm-tip-font-size)
}

.dex-form .dex-form-item.dex-form-item-md,
.dex-form .dex-form-item.dex-form-line.dex-form-item-has-name {
  margin-bottom: calc(var(--dex-okd-input-md-tip-line-height) + var(--dex-okd-input-md-tip-margin, 4px) + 5px)
}

.dex-form .dex-form-item.dex-form-item-md .dex-form-item-label,
.dex-form .dex-form-item.dex-form-line.dex-form-item-has-name .dex-form-item-label {
  font-size: var(--dex-okd-input-md-label-font-size)
}

.dex-form .dex-form-item.dex-form-item-md.dex-form-item-has-error .dex-form-item-control-explain,
.dex-form .dex-form-item.dex-form-item-md.dex-form-item-has-tip .dex-form-item-control-explain,
.dex-form .dex-form-item.dex-form-line.dex-form-item-has-name.dex-form-item-has-error .dex-form-item-control-explain,
.dex-form .dex-form-item.dex-form-line.dex-form-item-has-name.dex-form-item-has-tip .dex-form-item-control-explain {
  line-height: 1.6;
  min-height: calc(var(--dex-okd-input-md-tip-line-height) + 9px);
  min-height: calc(var(--dex-okd-input-md-tip-line-height) + var(--dex-okd-input-md-tip-margin, 4px) + 5px)
}

.dex-form .dex-form-item.dex-form-item-md .dex-form-item-control-extra,
.dex-form .dex-form-item.dex-form-line.dex-form-item-has-name .dex-form-item-control-extra {
  font-size: var(--dex-okd-input-md-tip-font-size)
}

.dex-form .dex-form-item.dex-form-item-md .dex-form-item-control-explain-error,
.dex-form .dex-form-item.dex-form-line.dex-form-item-has-name .dex-form-item-control-explain-error {
  font-size: var(--dex-okd-input-md-error-font-size)
}

.dex-form .dex-form-item.dex-form-item-md .dex-form-item-control-explain-tip,
.dex-form .dex-form-item.dex-form-line.dex-form-item-has-name .dex-form-item-control-explain-tip {
  font-size: var(--dex-okd-input-md-tip-font-size)
}

.dex-form .dex-form-item.dex-form-item-lg,
.dex-form .dex-form-item.dex-form-line.dex-form-item-has-name {
  margin-bottom: calc(var(--dex-okd-input-lg-tip-line-height) + var(--dex-okd-input-lg-tip-margin, 6px) + 5px)
}

.dex-form .dex-form-item.dex-form-item-lg .dex-form-item-label,
.dex-form .dex-form-item.dex-form-line.dex-form-item-has-name .dex-form-item-label {
  font-size: var(--dex-okd-input-lg-label-font-size)
}

.dex-form .dex-form-item.dex-form-item-lg.dex-form-item-has-error .dex-form-item-control-explain,
.dex-form .dex-form-item.dex-form-item-lg.dex-form-item-has-tip .dex-form-item-control-explain,
.dex-form .dex-form-item.dex-form-line.dex-form-item-has-name.dex-form-item-has-error .dex-form-item-control-explain,
.dex-form .dex-form-item.dex-form-line.dex-form-item-has-name.dex-form-item-has-tip .dex-form-item-control-explain {
  line-height: 1.6;
  min-height: calc(var(--dex-okd-input-lg-tip-line-height) + 11px);
  min-height: calc(var(--dex-okd-input-lg-tip-line-height) + var(--dex-okd-input-lg-tip-margin, 6px) + 5px)
}

.dex-form .dex-form-item.dex-form-item-lg .dex-form-item-control-extra,
.dex-form .dex-form-item.dex-form-line.dex-form-item-has-name .dex-form-item-control-extra {
  font-size: var(--dex-okd-input-lg-tip-font-size)
}

.dex-form .dex-form-item.dex-form-item-lg .dex-form-item-control-explain-error,
.dex-form .dex-form-item.dex-form-line.dex-form-item-has-name .dex-form-item-control-explain-error {
  font-size: var(--dex-okd-input-lg-error-font-size)
}

.dex-form .dex-form-item.dex-form-item-lg .dex-form-item-control-explain-tip,
.dex-form .dex-form-item.dex-form-line.dex-form-item-has-name .dex-form-item-control-explain-tip {
  font-size: var(--dex-okd-input-lg-tip-font-size)
}

.dex-form .dex-form-item.dex-form-item-xl,
.dex-form .dex-form-item.dex-form-line.dex-form-item-has-name {
  margin-bottom: calc(var(--dex-okd-input-xl-tip-line-height) + var(--dex-okd-input-xl-tip-margin, 6px) + 5px)
}

.dex-form .dex-form-item.dex-form-item-xl .dex-form-item-label,
.dex-form .dex-form-item.dex-form-line.dex-form-item-has-name .dex-form-item-label {
  font-size: var(--dex-okd-input-xl-label-font-size)
}

.dex-form .dex-form-item.dex-form-item-xl.dex-form-item-has-error .dex-form-item-control-explain,
.dex-form .dex-form-item.dex-form-item-xl.dex-form-item-has-tip .dex-form-item-control-explain,
.dex-form .dex-form-item.dex-form-line.dex-form-item-has-name.dex-form-item-has-error .dex-form-item-control-explain,
.dex-form .dex-form-item.dex-form-line.dex-form-item-has-name.dex-form-item-has-tip .dex-form-item-control-explain {
  line-height: 1.6;
  min-height: calc(var(--dex-okd-input-xl-tip-line-height) + 11px);
  min-height: calc(var(--dex-okd-input-xl-tip-line-height) + var(--dex-okd-input-xl-tip-margin, 6px) + 5px)
}

.dex-form .dex-form-item.dex-form-item-xl .dex-form-item-control-extra,
.dex-form .dex-form-item.dex-form-line.dex-form-item-has-name .dex-form-item-control-extra {
  font-size: var(--dex-okd-input-xl-tip-font-size)
}

.dex-form .dex-form-item.dex-form-item-xl .dex-form-item-control-explain-error,
.dex-form .dex-form-item.dex-form-line.dex-form-item-has-name .dex-form-item-control-explain-error {
  font-size: var(--dex-okd-input-xl-error-font-size)
}

.dex-form .dex-form-item.dex-form-item-xl .dex-form-item-control-explain-tip,
.dex-form .dex-form-item.dex-form-line.dex-form-item-has-name .dex-form-item-control-explain-tip {
  font-size: var(--dex-okd-input-xl-tip-font-size)
}

.dex-form .dex-form-item.dex-form-line {
  margin-bottom: 0
}

.dex-form.dex-form-vertical .dex-form-item {
  flex-direction: column
}

.dex-form.dex-form-vertical .dex-form-item.dex-form-item-xs .dex-form-item-label {
  line-height: var(--dex-okd-input-xs-label-line-height);
  margin-bottom: 4px;
  margin-bottom: var(--dex-okd-input-xs-label-margin, 4px)
}

.dex-form.dex-form-vertical .dex-form-item.dex-form-item-sm .dex-form-item-label {
  line-height: var(--dex-okd-input-sm-label-line-height);
  margin-bottom: 4px;
  margin-bottom: var(--dex-okd-input-sm-label-margin, 4px)
}

.dex-form.dex-form-vertical .dex-form-item.dex-form-item-md .dex-form-item-label {
  line-height: var(--dex-okd-input-md-label-line-height);
  margin-bottom: 4px;
  margin-bottom: var(--dex-okd-input-md-label-margin, 4px)
}

.dex-form.dex-form-vertical .dex-form-item.dex-form-item-lg .dex-form-item-label {
  line-height: var(--dex-okd-input-lg-label-line-height);
  margin-bottom: 6px;
  margin-bottom: var(--dex-okd-input-lg-label-margin, 6px)
}

.dex-form.dex-form-vertical .dex-form-item.dex-form-item-xl .dex-form-item-label {
  line-height: var(--dex-okd-input-xl-label-line-height);
  margin-bottom: 6px;
  margin-bottom: var(--dex-okd-input-xl-label-margin, 6px)
}

.dex-form.dex-form-horizontal .dex-form-item-no-label .dex-form-item-control {
  margin-left: 16.66666667%;
  margin-left: var(--dex-okd-form-item-label-width-horizontal, 16.66666667%)
}

.dex-form.dex-form-horizontal .dex-form-item .dex-form-item-label {
  flex: 0 0 16.66666667%;
  flex: 0 0 var(--dex-okd-form-item-label-width-horizontal, 16.66666667%);
  overflow: hidden;
  white-space: nowrap;
  width: 16.66666667%;
  width: var(--dex-okd-form-item-label-width-horizontal, 16.66666667%)
}

.dex-form.dex-form-horizontal .dex-form-item .dex-form-item-label:after {
  content: ":";
  margin: 0 8px 0 2px
}

.dex-form.dex-form-horizontal .dex-form-item .dex-form-item-label.dex-form-item-label-no-colon:after {
  content: ""
}

.dex-form.dex-form-horizontal .dex-form-item .dex-form-item-label.dex-form-item-label-align-left {
  text-align: left
}

.dex-form.dex-form-horizontal .dex-form-item .dex-form-item-label.dex-form-item-label-align-right {
  text-align: right
}

.dex-form.dex-form-horizontal .dex-form-item .dex-form-item-label-action {
  display: none
}

.dex-form.dex-form-horizontal .dex-form-item .dex-form-item-control {
  flex: 1 1
}

.dex-form.dex-form-horizontal .dex-form-item.dex-form-item-xs .dex-form-item-label {
  line-height: var(--dex-okd-input-xs-height)
}

.dex-form.dex-form-horizontal .dex-form-item.dex-form-item-xs .dex-form-item-control-input {
  align-items: center;
  display: flex;
  min-height: var(--dex-okd-input-xs-height)
}

.dex-form.dex-form-horizontal .dex-form-item.dex-form-item-xs .dex-form-item-control-input-content {
  width: 100%
}

.dex-form.dex-form-horizontal .dex-form-item.dex-form-item-sm .dex-form-item-label {
  line-height: var(--dex-okd-input-sm-height)
}

.dex-form.dex-form-horizontal .dex-form-item.dex-form-item-sm .dex-form-item-control-input {
  align-items: center;
  display: flex;
  min-height: var(--dex-okd-input-sm-height)
}

.dex-form.dex-form-horizontal .dex-form-item.dex-form-item-sm .dex-form-item-control-input-content {
  width: 100%
}

.dex-form.dex-form-horizontal .dex-form-item.dex-form-item-md .dex-form-item-label {
  line-height: var(--dex-okd-input-md-height)
}

.dex-form.dex-form-horizontal .dex-form-item.dex-form-item-md .dex-form-item-control-input {
  align-items: center;
  display: flex;
  min-height: var(--dex-okd-input-md-height)
}

.dex-form.dex-form-horizontal .dex-form-item.dex-form-item-md .dex-form-item-control-input-content {
  width: 100%
}

.dex-form.dex-form-horizontal .dex-form-item.dex-form-item-lg .dex-form-item-label {
  line-height: var(--dex-okd-input-lg-height)
}

.dex-form.dex-form-horizontal .dex-form-item.dex-form-item-lg .dex-form-item-control-input {
  align-items: center;
  display: flex;
  min-height: var(--dex-okd-input-lg-height)
}

.dex-form.dex-form-horizontal .dex-form-item.dex-form-item-lg .dex-form-item-control-input-content {
  width: 100%
}

.dex-form.dex-form-horizontal .dex-form-item.dex-form-item-xl .dex-form-item-label {
  line-height: var(--dex-okd-input-xl-height)
}

.dex-form.dex-form-horizontal .dex-form-item.dex-form-item-xl .dex-form-item-control-input {
  align-items: center;
  display: flex;
  min-height: var(--dex-okd-input-xl-height)
}

.dex-form.dex-form-horizontal .dex-form-item.dex-form-item-xl .dex-form-item-control-input-content {
  width: 100%
}

.dex-form.dex-form-horizontal .dex-form-line .dex-form-item-no-label .dex-form-item-control {
  margin-left: 0
}

.dex-form.dex-form-inline {
  display: flex;
  flex-wrap: wrap
}

.dex-form.dex-form-inline .dex-form-item {
  display: flex;
  flex: none;
  margin-right: 16px;
  margin-right: var(--dex-okd-form-item-margin-inline, 16px)
}

.dex-form.dex-form-inline .dex-form-item .dex-form-item-label {
  width: auto
}

.dex-form.dex-form-inline .dex-form-item .dex-form-item-label:after {
  content: ":";
  margin: 0 8px 0 2px
}

.dex-form.dex-form-inline .dex-form-item .dex-form-item-label .dex-form-item-label-action,
.dex-form.dex-form-inline .dex-form-item .dex-form-item-label-action {
  display: none
}

.dex-form.dex-form-inline .dex-form-item.dex-form-item-xs .dex-form-item-label {
  line-height: var(--dex-okd-input-xs-height)
}

.dex-form.dex-form-inline .dex-form-item.dex-form-item-xs .dex-form-item-control-input {
  align-items: center;
  display: flex;
  min-height: var(--dex-okd-input-xs-height)
}

.dex-form.dex-form-inline .dex-form-item.dex-form-item-sm .dex-form-item-label {
  line-height: var(--dex-okd-input-sm-height)
}

.dex-form.dex-form-inline .dex-form-item.dex-form-item-sm .dex-form-item-control-input {
  align-items: center;
  display: flex;
  min-height: var(--dex-okd-input-sm-height)
}

.dex-form.dex-form-inline .dex-form-item.dex-form-item-md .dex-form-item-label {
  line-height: var(--dex-okd-input-md-height)
}

.dex-form.dex-form-inline .dex-form-item.dex-form-item-md .dex-form-item-control-input {
  align-items: center;
  display: flex;
  min-height: var(--dex-okd-input-md-height)
}

.dex-form.dex-form-inline .dex-form-item.dex-form-item-lg .dex-form-item-label {
  line-height: var(--dex-okd-input-lg-height)
}

.dex-form.dex-form-inline .dex-form-item.dex-form-item-lg .dex-form-item-control-input {
  align-items: center;
  display: flex;
  min-height: var(--dex-okd-input-lg-height)
}

.dex-form.dex-form-inline .dex-form-item.dex-form-item-xl .dex-form-item-label {
  line-height: var(--dex-okd-input-xl-height)
}

.dex-form.dex-form-inline .dex-form-item.dex-form-item-xl .dex-form-item-control-input {
  align-items: center;
  display: flex;
  min-height: var(--dex-okd-input-xl-height)
}

.dex-icon.icon {
  font-family: var(--ok-icon-font-family) !important
}

.dex-plain-button {
  color: inherit;
  cursor: pointer;
  font: inherit;
  text-align: unset
}

.dex-plain-button:focus-visible {
  border-radius: 4px;
  outline: 2px solid var(--dex-okd-color-border-focus);
  outline-color: var(--dex-okd-color-border-focus);
  outline-offset: 2px;
  outline-style: solid;
  outline-width: 2px
}

.dex-plain-button[disabled] {
  cursor: not-allowed
}

.dex-plain-button-as-div {
  display: block;
  line-height: inherit;
  width: 100%
}

.dex-a11y-text {
  clip: rect(0, 0, 0, 0);
  border-width: 0;
  height: 1px;
  margin: -1px;
  overflow: hidden;
  padding: 0;
  position: absolute;
  white-space: nowrap;
  width: 1px
}

@keyframes loadingLine {
  to {
    left: 100%
  }
}

.dex-loader-line {
  background: var(--dex-okd-loader-line-inactive-color);
  height: var(--dex-okd-loader-line-size);
  overflow: hidden;
  position: relative;
  width: 100%
}

.dex-loader-line,
.dex-loader-line .dex-loader-mark {
  border-radius: calc(var(--dex-okd-loader-line-size)/2)
}

.dex-loader-line .dex-loader-mark {
  background: var(--dex-okd-loader-line-active-color);
  height: 100%
}

.dex-loader-line.dex-loader-loading .dex-loader-mark {
  animation: loadingLine 2s linear infinite;
  left: -25%;
  position: absolute;
  top: 0
}

@keyframes okui-loader-rotation {
  0% {
    transform: rotate(0deg)
  }

  to {
    transform: rotate(1turn)
  }
}

.dex-loader-box {
  position: relative
}

.dex-loader-mask {
  align-items: center;
  background: var(--dex-okd-loader-mask-bg-color);
  display: flex;
  flex-direction: column;
  height: 100%;
  justify-content: center;
  left: 0;
  position: absolute;
  top: 0;
  width: 100%
}

.dex-loader-mask-text {
  color: var(--dex-okd-loader-mask-text-color);
  font-size: var(--dex-okd-loader-mask-text-font-size);
  font-weight: var(--dex-okd-loader-mask-text-font-weight);
  line-height: var(--dex-okd-loader-mask-text-line-height);
  margin-top: var(--dex-okd-loader-mask-text-margin-top)
}

.dex-loader-spin {
  animation: okui-loader-rotation 1s linear infinite;
  background-color: initial;
  border-style: solid;
  box-sizing: border-box;
  display: inline-flex
}

.dex-loader-spin-xl {
  border-radius: var(--dex-okd-loader-circle-xl-size);
  border-width: var(--dex-okd-loader-circle-xl-track-width);
  height: var(--dex-okd-loader-circle-xl-size);
  width: var(--dex-okd-loader-circle-xl-size)
}

.dex-loader-spin-lg {
  border-radius: var(--dex-okd-loader-circle-lg-size);
  border-width: var(--dex-okd-loader-circle-lg-track-width);
  height: var(--dex-okd-loader-circle-lg-size);
  width: var(--dex-okd-loader-circle-lg-size)
}

.dex-loader-spin-md {
  border-radius: var(--dex-okd-loader-circle-md-size);
  border-width: var(--dex-okd-loader-circle-md-track-width);
  height: var(--dex-okd-loader-circle-md-size);
  width: var(--dex-okd-loader-circle-md-size)
}

.dex-loader-spin-sm {
  border-radius: var(--dex-okd-loader-circle-sm-size);
  border-width: var(--dex-okd-loader-circle-sm-track-width);
  height: var(--dex-okd-loader-circle-sm-size);
  width: var(--dex-okd-loader-circle-sm-size)
}

.dex-loader-spin-primary {
  border-color: var(--dex-okd-loader-primary-inactive-color);
  border-top-color: var(--dex-okd-loader-primary-active-color)
}

.dex-loader-spin-neutral {
  border-color: var(--dex-okd-loader-neutral-inactive-color);
  border-top-color: var(--dex-okd-loader-neutral-active-color)
}

.dex-loader-inner-circle {
  border: none;
  border-radius: 0;
  overflow: hidden;
  transform: rotate(180deg)
}

.dex-loader-inner-fill-primary {
  background: var(--dex-okd-loader-primary-active-color)
}

.dex-loader-inner-fill-neutral {
  background: var(--dex-okd-loader-neutral-active-color)
}

.dex-loader-inner-track-primary {
  background: var(--dex-okd-loader-primary-inactive-color)
}

.dex-loader-inner-track-neutral {
  background: var(--dex-okd-loader-neutral-inactive-color)
}

.dex-loader-inner-track-right {
  height: 100%;
  overflow: hidden;
  position: absolute;
  right: 0
}

.dex-loader-inner-track-right-content {
  content: "";
  height: 100%;
  position: absolute;
  transform: rotate(0deg);
  transform-origin: left center;
  width: 100%
}

.dex-loader-inner-track-left {
  height: 100%;
  overflow: hidden;
  position: absolute
}

.dex-loader-inner-track-left-content {
  content: "";
  height: 100%;
  position: absolute;
  transform: rotate(0deg);
  transform-origin: right center;
  width: 100%
}

.dex-loader-inner-xl {
  border-radius: var(--dex-okd-loader-circle-xl-size);
  height: var(--dex-okd-loader-circle-xl-size);
  width: var(--dex-okd-loader-circle-xl-size)
}

.dex-loader-inner-xl-cover {
  background-color: var(--dex-okd-loader-circle-cover-background);
  border-radius: 100%;
  height: calc(var(--dex-okd-loader-circle-xl-size) - var(--dex-okd-loader-circle-xl-track-width)*2);
  left: 50%;
  position: absolute;
  top: 50%;
  transform: translate(-50%, -50%);
  width: calc(var(--dex-okd-loader-circle-xl-size) - var(--dex-okd-loader-circle-xl-track-width)*2)
}

.dex-loader-inner-track-xl {
  width: calc(var(--dex-okd-loader-circle-xl-size)/2)
}

.dex-loader-inner-track-xl-inner-track-left-content {
  border-radius: calc(var(--dex-okd-loader-circle-xl-size)/2) 0 0 calc(var(--dex-okd-loader-circle-xl-size)/2);
  width: 100%
}

.dex-loader-inner-track-xl-inner-track-right-content {
  border-radius: 0 calc(var(--dex-okd-loader-circle-xl-size)/2) calc(var(--dex-okd-loader-circle-xl-size)/2) 0;
  width: 100%
}

.dex-loader-inner-lg {
  border-radius: var(--dex-okd-loader-circle-lg-size);
  height: var(--dex-okd-loader-circle-lg-size);
  width: var(--dex-okd-loader-circle-lg-size)
}

.dex-loader-inner-lg-cover {
  background-color: var(--dex-okd-loader-circle-cover-background);
  border-radius: 100%;
  height: calc(var(--dex-okd-loader-circle-lg-size) - var(--dex-okd-loader-circle-lg-track-width)*2);
  left: 50%;
  position: absolute;
  top: 50%;
  transform: translate(-50%, -50%);
  width: calc(var(--dex-okd-loader-circle-lg-size) - var(--dex-okd-loader-circle-lg-track-width)*2)
}

.dex-loader-inner-track-lg {
  width: calc(var(--dex-okd-loader-circle-lg-size)/2)
}

.dex-loader-inner-track-lg-inner-track-left-content {
  border-radius: calc(var(--dex-okd-loader-circle-lg-size)/2) 0 0 calc(var(--dex-okd-loader-circle-lg-size)/2);
  width: 100%
}

.dex-loader-inner-track-lg-inner-track-right-content {
  border-radius: 0 calc(var(--dex-okd-loader-circle-lg-size)/2) calc(var(--dex-okd-loader-circle-lg-size)/2) 0;
  width: 100%
}

.dex-loader-inner-md {
  border-radius: var(--dex-okd-loader-circle-md-size);
  height: var(--dex-okd-loader-circle-md-size);
  width: var(--dex-okd-loader-circle-md-size)
}

.dex-loader-inner-md-cover {
  background-color: var(--dex-okd-loader-circle-cover-background);
  border-radius: 100%;
  height: calc(var(--dex-okd-loader-circle-md-size) - var(--dex-okd-loader-circle-md-track-width)*2);
  left: 50%;
  position: absolute;
  top: 50%;
  transform: translate(-50%, -50%);
  width: calc(var(--dex-okd-loader-circle-md-size) - var(--dex-okd-loader-circle-md-track-width)*2)
}

.dex-loader-inner-track-md {
  width: calc(var(--dex-okd-loader-circle-md-size)/2)
}

.dex-loader-inner-track-md-inner-track-left-content {
  border-radius: calc(var(--dex-okd-loader-circle-md-size)/2) 0 0 calc(var(--dex-okd-loader-circle-md-size)/2);
  width: 100%
}

.dex-loader-inner-track-md-inner-track-right-content {
  border-radius: 0 calc(var(--dex-okd-loader-circle-md-size)/2) calc(var(--dex-okd-loader-circle-md-size)/2) 0;
  width: 100%
}

.dex-loader-inner-sm {
  border-radius: var(--dex-okd-loader-circle-sm-size);
  height: var(--dex-okd-loader-circle-sm-size);
  width: var(--dex-okd-loader-circle-sm-size)
}

.dex-loader-inner-sm-cover {
  background-color: var(--dex-okd-loader-circle-cover-background);
  border-radius: 100%;
  height: calc(var(--dex-okd-loader-circle-sm-size) - var(--dex-okd-loader-circle-sm-track-width)*2);
  left: 50%;
  position: absolute;
  top: 50%;
  transform: translate(-50%, -50%);
  width: calc(var(--dex-okd-loader-circle-sm-size) - var(--dex-okd-loader-circle-sm-track-width)*2)
}

.dex-loader-inner-track-sm {
  width: calc(var(--dex-okd-loader-circle-sm-size)/2)
}

.dex-loader-inner-track-sm-inner-track-left-content {
  border-radius: calc(var(--dex-okd-loader-circle-sm-size)/2) 0 0 calc(var(--dex-okd-loader-circle-sm-size)/2);
  width: 100%
}

.dex-loader-inner-track-sm-inner-track-right-content {
  border-radius: 0 calc(var(--dex-okd-loader-circle-sm-size)/2) calc(var(--dex-okd-loader-circle-sm-size)/2) 0;
  width: 100%
}

.dex-a11y-button:focus-visible {
  border-radius: 4px;
  outline: 2px solid var(--dex-okd-color-border-focus);
  outline-color: var(--dex-okd-color-border-focus);
  outline-offset: 2px;
  outline-style: solid;
  outline-width: 2px
}

.dex-mask {
  background: rgba(0, 0, 0, .65);
  background: var(--dex-okd-dialog-window-mask-color, rgba(0, 0, 0, .65));
  bottom: 0;
  left: 0;
  position: fixed;
  right: 0;
  top: 0
}

.dex-picture {
  display: inline-block
}

.dex-picture-font {
  font-size: 0;
  line-height: 1
}

.dex-picture-cover {
  object-fit: cover
}

.dex-picture-contain {
  object-fit: contain
}

.dex-empty {
  align-items: center;
  display: flex;
  flex-direction: column;
  width: 100%
}

.dex-empty-img {
  height: var(--dex-okd-empty-img-height);
  margin-bottom: var(--dex-okd-empty-img-margin-bottom);
  width: var(--dex-okd-empty-img-width)
}

.dex-empty-title {
  color: var(--dex-okd-empty-title-color);
  font-size: var(--dex-okd-empty-title-font-size);
  font-weight: 400;
  font-weight: var(--dex-okd-empty-title-font-weight, 400);
  line-height: var(--dex-okd-empty-title-light-height);
  margin-bottom: var(--dex-okd-empty-title-margin-bottom);
  text-align: center
}

.dex-empty-title:last-child {
  margin-bottom: 0
}

.dex-empty-only-title {
  margin-bottom: var(--dex-okd-empty-desc-margin-bottom)
}

.dex-empty-only-title:last-child {
  margin-bottom: 0
}

.dex-empty-description {
  color: var(--dex-okd-empty-desc-color);
  font-size: var(--dex-okd-empty-desc-font-size);
  font-weight: 400;
  font-weight: var(--dex-okd-empty-desc-font-weight, 400);
  line-height: var(--dex-okd-empty-desc-light-height);
  margin-bottom: var(--dex-okd-empty-desc-margin-bottom);
  text-align: center
}

.dex-empty-description:last-child {
  margin-bottom: 0
}

.dex-empty-sm .dex-empty-title {
  font-size: 14px;
  font-size: var(--dex-okd-empty-sm-title-font-size, 14px);
  line-height: 16px;
  line-height: var(--dex-okd-empty-sm-title-line-height, 16px);
  margin-bottom: 4px;
  margin-bottom: var(--dex-okd-empty-sm-title-margin-bottom, 4px)
}

.dex-empty-sm .dex-empty-description {
  font-size: 12px;
  font-size: var(--dex-okd-empty-sm-desc-font-size, 12px);
  line-height: 18px;
  line-height: var(--dex-okd-empty-sm-desc-line-height, 18px)
}

.dex-empty-sm .dex-empty-description,
.dex-empty-sm .dex-empty-only-title {
  margin-bottom: 4px;
  margin-bottom: var(--dex-okd-empty-sm-desc-margin-bottom, 4px)
}

.dex-datepicker-reference {
  position: relative
}

.dex-datepicker-reference-native {
  background: transparent;
  color: transparent;
  height: 100%;
  left: 0;
  outline: none;
  padding-right: 8px;
  position: absolute;
  top: 0;
  width: calc(100% - 42px);
  z-index: 100
}

.dex-datepicker-input-custom-icon {
  color: var(--dex-okd-color-gray-400);
  color: var(--dex-okd-datepicker-input-icon-color, var(--dex-okd-color-gray-400));
  cursor: pointer
}

.dex-datepicker-input-icon-disabled {
  cursor: not-allowed
}

.dex-datepicker .dex-datepicker-input-xs-icon-size {
  font-size: 16px;
  font-size: var(--dex-okd-datepicker-xs-icon-font-size, 16px)
}

.dex-datepicker .dex-datepicker-input-sm-icon-size {
  font-size: 16px;
  font-size: var(--dex-okd-datepicker-sm-icon-font-size, 16px)
}

.dex-datepicker .dex-datepicker-input-md-icon-size {
  font-size: 16px;
  font-size: var(--dex-okd-datepicker-md-icon-font-size, 16px)
}

.dex-datepicker .dex-datepicker-input-lg-icon-size {
  font-size: 18px;
  font-size: var(--dex-okd-datepicker-lg-icon-font-size, 18px)
}

.dex-datepicker .dex-datepicker-input-xl-icon-size {
  font-size: 20px;
  font-size: var(--dex-okd-datepicker-xl-icon-font-size, 20px)
}

.dex-datepicker-header {
  color: var(--dex-okd-datepicker-title-default-color);
  color: var(--dex-okd-datepicker-panel-header-default-text-color, var(--dex-okd-datepicker-title-default-color));
  display: flex;
  font-size: 16px;
  font-weight: 500;
  height: 36px;
  justify-content: space-between;
  line-height: 36px;
  padding: 0 16px
}

.dex-datepicker-header-block {
  align-items: center;
  display: flex;
  font-size: 14px
}

.dex-datepicker-header .text-box {
  border-radius: 4px;
  cursor: pointer;
  padding: 8px
}

.dex-datepicker-header .text-box:hover {
  background-color: var(--dex-okd-color-gray-100);
  background-color: var(--dex-okd-datepicker-panel-header-hover-text-bg-color, var(--dex-okd-color-gray-100))
}

.dex-datepicker-header .header-icon {
  margin-left: 4px;
  transition: transform .2s;
  vertical-align: middle
}

.dex-datepicker-header .arrow-up {
  transform: rotate(180deg)
}

.dex-datepicker-header .display-year {
  align-items: center;
  display: flex;
  margin-left: 8px
}

.dex-datepicker-header .nav-box .nav-icon {
  color: var(--dex-okd-datepicker-icon-default-color);
  color: var(--dex-okd-datepicker-panel-header-default-icon-color, var(--dex-okd-datepicker-icon-default-color));
  font-size: 20px
}

.dex-datepicker-header .nav-box .nav-item {
  align-items: center;
  border-radius: 50%;
  cursor: pointer;
  display: flex;
  height: 32px;
  justify-content: center;
  width: 32px
}

.dex-datepicker-header .nav-box .nav-item:hover {
  background-color: var(--dex-okd-color-gray-100);
  background-color: var(--dex-okd-datepicker-panel-header-hover-icon-bg-color, var(--dex-okd-color-gray-100))
}

.dex-datepicker-header .nav-box .nav-item:last-child {
  margin-left: 4px
}

.dex-datepicker-panel-day {
  color: var(--dex-okd-datepicker-day-default-text-color)
}

.dex-datepicker-panel-day:not(.dex-datepicker-panel-day-disabled):not(.dex-datepicker-panel-day-active):hover .item-inner {
  background-color: var(--dex-okd-datepicker-day-hover-background)
}

.dex-datepicker-panel-day-active:not(.dex-datepicker-panel-day-disable) .item-inner {
  background-color: var(--dex-okd-datepicker-day-selected-background);
  color: var(--dex-okd-datepicker-day-selected-text-color);
  font-weight: 500
}

.dex-datepicker-panel-day-disabled:not(.dex-datepicker-panel-day-notSelectable) {
  background-color: var(--dex-okd-datepicker-day-disable-background);
  color: var(--dex-okd-datepicker-day-disable-text-color);
  cursor: not-allowed
}

.dex-datepicker-panel-day-disabled:not(.dex-datepicker-panel-day-notSelectable) .dex-datepicker-panel-today {
  border-color: var(--dex-okd-datepicker-today-border-disable-color)
}

.dex-datepicker-panel-day-notSelectable {
  cursor: not-allowed
}

.dex-datepicker-panel-month {
  color: var(--dex-okd-datepicker-month-default-text-color)
}

.dex-datepicker-panel-month:not(.dex-datepicker-panel-month-disabled):not(.dex-datepicker-panel-month-active):hover .item-inner {
  background-color: var(--dex-okd-datepicker-month-hover-background)
}

.dex-datepicker-panel-month-active:not(.dex-datepicker-panel-month-disable) .item-inner {
  background-color: var(--dex-okd-datepicker-month-selected-background);
  color: var(--dex-okd-datepicker-month-selected-text-color);
  font-weight: 500
}

.dex-datepicker-panel-month-disabled:not(.dex-datepicker-panel-month-notSelectable) {
  background-color: var(--dex-okd-datepicker-month-disable-background);
  color: var(--dex-okd-datepicker-month-disable-text-color);
  cursor: not-allowed
}

.dex-datepicker-panel-month-disabled:not(.dex-datepicker-panel-month-notSelectable) .dex-datepicker-panel-today {
  border-color: var(--dex-okd-datepicker-today-border-disable-color)
}

.dex-datepicker-panel-month-notSelectable {
  cursor: not-allowed
}

.dex-datepicker-panel-year {
  color: var(--dex-okd-datepicker-year-default-text-color)
}

.dex-datepicker-panel-year:not(.dex-datepicker-panel-year-disabled):not(.dex-datepicker-panel-year-active):hover .item-inner {
  background-color: var(--dex-okd-datepicker-year-hover-background)
}

.dex-datepicker-panel-cover:before {
  background-color: var(--dex-okd-datepicker-day-range-background)
}

.dex-datepicker-panel-year-active:not(.dex-datepicker-panel-year-disable) .item-inner {
  background-color: var(--dex-okd-datepicker-year-selected-background);
  color: var(--dex-okd-datepicker-year-selected-text-color);
  font-weight: 500
}

.dex-datepicker-panel-year-disabled:not(.dex-datepicker-panel-year-notSelectable) {
  background-color: var(--dex-okd-datepicker-year-disable-background);
  color: var(--dex-okd-datepicker-year-disable-text-color);
  cursor: not-allowed
}

.dex-datepicker-panel-year-disabled:not(.dex-datepicker-panel-year-notSelectable) .dex-datepicker-panel-today {
  border-color: var(--dex-okd-datepicker-today-border-disable-color)
}

.dex-datepicker-panel-year-notSelectable {
  cursor: not-allowed
}

.dex-datepicker-panel {
  display: flex;
  flex-direction: column;
  font-size: 14px;
  height: 100%;
  padding: 0 16px 16px;
  width: 100%
}

.dex-datepicker-panel-header {
  border-bottom: 1px solid var(--dex-okd-color-line-muted);
  display: flex;
  height: 36px;
  margin-bottom: 8px
}

.dex-datepicker-panel-footer {
  border-top: 1px solid var(--dex-okd-color-line-muted);
  display: flex;
  justify-content: flex-end;
  padding: 12px 22px
}

.dex-datepicker-panel-footer .confirm-button {
  margin-left: 12px
}

.dex-datepicker-panel-week {
  align-items: center;
  color: var(--dex-okd-datepicker-week-default-text-color);
  display: flex;
  flex: 1 1;
  font-size: 12px;
  justify-content: center;
  text-align: center
}

.dex-datepicker-panel-main {
  cursor: pointer;
  display: flex;
  flex: 1 1;
  flex-direction: column
}

.dex-datepicker-panel-row {
  align-items: center;
  display: flex;
  justify-content: space-between;
  margin-bottom: 4px;
  width: 100%
}

.dex-datepicker-panel-row:last-child {
  margin-bottom: 0
}

.dex-datepicker-panel-row-week:hover .dex-datepicker-panel-day:not(.dex-datepicker-panel-day-disabled):before {
  background-color: var(--dex-okd-datepicker-day-range-background)
}

.dex-datepicker-panel-item {
  flex: 1 1;
  flex-direction: column
}

.dex-datepicker-panel-item,
.dex-datepicker-panel-item .item-inner {
  align-items: center;
  display: flex;
  justify-content: center;
  position: relative
}

.dex-datepicker-panel-item .item-inner {
  border-radius: 50%;
  height: 32px;
  width: 32px;
  z-index: 2
}

.dex-datepicker-panel-item:before {
  content: "";
  height: 100%;
  left: 0;
  position: absolute;
  right: 0;
  top: 50%;
  transform: translateY(-50%);
  z-index: 1
}

.dex-datepicker-panel-item.range-start:before {
  border-radius: 50% 0 0 50%
}

.dex-datepicker-panel-item.range-end:before {
  border-radius: 0 50% 50% 0
}

.dex-datepicker-panel-hidden {
  visibility: hidden
}

.dex-datepicker-panel-today .item-inner {
  background-color: var(--dex-okd-color-gray-050);
  background-color: var(--dex-okd-datepicker-today-bg-color, var(--dex-okd-color-gray-050));
  color: var(--dex-okd-datepicker-today-border-color);
  color: var(--dex-okd-datepicker-today-text-color, var(--dex-okd-datepicker-today-border-color));
  font-weight: 500
}

.dex-datepicker-panel-second {
  color: var(--dex-okd-datepicker-day-second-color);
  font-weight: 400
}

.dex-datepicker-panel-second .dex-datepicker-panel-today {
  border-color: var(--dex-okd-datepicker-today-border-disable-color)
}

.dex-datepicker-panel.no-padding {
  padding: 0
}

.dex-datepicker-panel .picker-scroll-view {
  direction: ltr;
  height: 260px;
  height: var(--dex-okd-datepicker-scroll-container-height, 260px);
  padding: 0;
  padding: var(--dex-okd-datepicker-scroll-container-padding-vertical, 0) var(--dex-okd-datepicker-scroll-container-padding-horizontal, 0)
}

.dex-datepicker-panel .picker-scroll-view .scroll-view-mask {
  background-color: initial;
  background-color: var(--dex-okd-datepicker-scroll-item-active-background, transparent);
  border-bottom: 1px solid #ebebeb;
  border-bottom: 1px solid var(--dex-okd-datepicker-scroll-item-active-border-color, #ebebeb);
  border-radius: 0;
  border-radius: var(--dex-okd-datepicker-scroll-item-active-radius, 0);
  border-top: 1px solid #ebebeb;
  border-top: 1px solid var(--dex-okd-datepicker-scroll-item-active-border-color, #ebebeb);
  height: 36px;
  height: var(--dex-okd-datepicker-scroll-item-default-height, 36px);
  margin: 0;
  margin: 0 var(--dex-okd-datepicker-scroll-container-padding-horizontal, 0)
}

.dex-datepicker-panel .picker-scroll-view .scroll-view-item {
  color: #929292;
  color: var(--dex-okd-datepicker-scroll-item-default-font-color, #929292);
  font-size: 14px;
  font-size: var(--dex-okd-datepicker-scroll-item-default-font-size, 14px);
  font-weight: 400;
  font-weight: var(--dex-okd-datepicker-scroll-item-default-font-weight, 400);
  height: 36px;
  height: var(--dex-okd-datepicker-scroll-item-default-height, 36px);
  line-height: 36px;
  line-height: var(--dex-okd-datepicker-scroll-item-default-height, 36px)
}

.dex-datepicker-panel .picker-scroll-view .scroll-view-item-active {
  color: #000;
  color: var(--dex-okd-datepicker-scroll-item-active-font-color, #000);
  font-size: 16px;
  font-size: var(--dex-okd-datepicker-scroll-item-active-font-size, 16px);
  font-weight: 500;
  font-weight: var(--dex-okd-datepicker-scroll-item-active-font-weight, 500)
}

@media (max-width:767px) {
  .dex-datepicker-panel-footer .confirm-button {
    flex: 1 1
  }

  .dex-datepicker-panel-footer .cancel-button {
    min-width: 100px
  }
}

.dex-datepicker-footer {
  align-items: center;
  border-top: 1px solid var(--dex-okd-datepicker-footer-border-color);
  display: flex;
  font-size: 14px;
  justify-content: space-between;
  padding: 20px
}

.dex-datepicker-footer-clear {
  color: var(--dex-okd-datepicker-footer-button-color);
  cursor: pointer;
  font-weight: 500;
  height: 100%
}

.dex-datepicker-footer-confirm {
  color: var(--dex-okd-datepicker-footer-button-color);
  justify-content: space-between;
  padding: 13px 16px
}

.dex-datepicker-footer-confirm .pc-confirm-button {
  margin-left: 12px
}

.dex-datepicker-footer-confirm-desc {
  font-size: 16px
}

.dex-datepicker-footer-confirm-desc .footer-confirm-desc-selected {
  padding-right: 4px
}

.dex-datepicker-footer-confirm-desc .footer-confirm-desc-to {
  padding: 0 4px
}

.dex-datepicker-footer-confirm-mobile {
  padding: 12px 16px
}

.dex-datepicker-footer-confirm-mobile .confirm-button {
  margin-left: 12px
}

@media (max-width:767px) {
  .dex-datepicker-footer-confirm-mobile .confirm-button {
    flex: 1 1
  }

  .dex-datepicker-footer-confirm-mobile .cancel-button {
    min-width: 100px
  }
}

.dex-datepicker-popup {
  display: flex
}

.dex-datepicker-dialog {
  background-color: var(--dex-okd-datepicker-default-background) !important
}

.dex-datepicker-inner {
  min-width: 284px;
  padding-top: 16px
}

.dex-datepicker-board {
  background: var(--dex-okd-datepicker-default-background);
  display: flex;
  flex-direction: column
}

.dex-datepicker-picker-group {
  display: flex;
  flex-direction: column;
  width: -webkit-min-content;
  width: -moz-min-content;
  width: min-content
}

.dex-datepicker-picker-group .picker-group-box {
  display: flex;
  position: relative
}

.dex-datepicker-picker-group .picker-group-split-line {
  background-color: var(--dex-okd-color-line-muted);
  height: 100%;
  left: 50%;
  position: absolute;
  top: 0;
  width: 1px
}

.dex-datepicker-picker-group .picker-group-shortcut {
  box-sizing: border-box;
  max-width: 568px;
  padding: 0 16px 26px
}

.dex-datepicker-range-mobile-reference {
  padding: 0 16px
}

.dex-datepicker-shortcut-mobile {
  padding: 0 16px;
  padding: var(--dex-okd-datepicker-shortcut-button-container-padding-horizontal, 0) var(--dex-okd-datepicker-shortcut-button-container-padding-vertical, 16px)
}

.dex-datepicker-range-reference {
  cursor: pointer
}

.dex-datepicker-range-reference .custom-clear-icon {
  color: var(--dex-okd-color-gray-400);
  color: var(--dex-okd-datepicker-input-icon-color, var(--dex-okd-color-gray-400));
  cursor: pointer
}

.dex-datepicker-range-reference-input {
  display: flex
}

.dex-datepicker-range-reference-container {
  align-items: center;
  display: flex;
  flex: 1 1;
  height: 100%;
  position: relative
}

.dex-datepicker-range-reference-container .disabled {
  color: var(--dex-okd-input-disabled-text-color);
  cursor: not-allowed
}

.dex-datepicker-range-reference-place {
  opacity: 0;
  position: absolute;
  z-index: -999999
}

.dex-datepicker-range-reference-item {
  align-items: center;
  display: flex;
  height: 100%;
  width: 100%
}

.dex-datepicker-range-reference-item-input {
  border: none;
  caret-color: var(--dex-okd-datepicker-input-caret-color);
  color: var(--dex-okd-datepicker-default-font-color);
  cursor: pointer;
  height: 100%;
  outline: none;
  width: 100%
}

.dex-datepicker-range-reference-item-input::-webkit-input-placeholder {
  color: var(--dex-okd-datepicker-input-placeholder-color)
}

.dex-datepicker-range-reference-item-input:-moz-placeholder {
  color: var(--dex-okd-datepicker-input-placeholder-color);
  opacity: 1
}

.dex-datepicker-range-reference-item-input::-ms-input-placeholder {
  color: var(--dex-okd-datepicker-input-placeholder-color)
}

.dex-datepicker-range-reference-connection.icon-pointer {
  color: var(--dex-okd-datepicker-day-second-color);
  font-size: 20px;
  margin-right: 8px
}

.dex-datepicker-range-reference-focus {
  border-bottom: 2px solid var(--dex-okd-datepicker-input-border-color);
  margin-bottom: -2px
}

.dex-datepicker-range-reference-input-group {
  justify-content: center;
  margin-top: 20px
}

.dex-datepicker-range-reference-input-group .dex-datepicker-range-reference-item-input {
  border-radius: 4px;
  font-size: 14px;
  font-weight: 500;
  height: 36px;
  text-align: center;
  width: 100% !important
}

.dex-datepicker-range-reference-input-group .dex-datepicker-range-reference-connection {
  margin: 0 10px
}

.dex-datepicker-range-reference-input-group .dex-datepicker-range-reference-item {
  border: 1px solid var(--dex-okd-color-gray-200);
  border-radius: 4px
}

.dex-datepicker-range-reference-input-group .dex-datepicker-range-reference-focus {
  border: 1px solid var(--dex-okd-datepicker-input-mobile-border-color, var(--dex-okd-color-fq-blue-lv1));
  margin: 0
}

.dex-datepicker-range-reference-xs {
  font-size: var(--dex-okd-datepicker-xs-range-input-font-size)
}

.dex-datepicker-range-reference-sm {
  font-size: var(--dex-okd-datepicker-sm-range-input-font-size)
}

.dex-datepicker-range-reference-md {
  font-size: var(--dex-okd-datepicker-md-range-input-font-size)
}

.dex-datepicker-range-reference-lg {
  font-size: 16px;
  font-size: var(--dex-okd-datepicker-lg-range-input-font-size, 16px)
}

.dex-datepicker-range-reference-xl {
  font-size: 16px;
  font-size: var(--dex-okd-datepicker-xl-range-input-font-size, 16px)
}

.dex-datepicker-range-board {
  background: #fff;
  background: var(--dex-okd-datepicker-range-board-background-color, #fff)
}

.dex-datepicker-shortcut {
  display: flex;
  flex-direction: row;
  flex-wrap: wrap;
  margin-bottom: -6px;
  margin-top: 12px;
  margin-top: var(--dex-okd-datepicker-shortcut-margin-top, 12px);
  width: 100%
}

.dex-datepicker-shortcut-button {
  align-items: center;
  background-color: var(--dex-okd-color-background-2);
  background-color: var(--dex-okd-datepicker-shortcut-button-bg-color, var(--dex-okd-color-background-2));
  border-radius: 4px;
  color: var(--dex-okd-datepicker-shortcut-text-default-color);
  cursor: pointer;
  display: flex;
  font-size: 12px;
  font-size: var(--dex-okd-datepicker-shortcut-button-font-size, 12px);
  font-weight: 500;
  justify-content: center;
  margin-bottom: 8px;
  margin-right: 8px;
  padding: 8px;
  padding: var(--dex-okd-datepicker-shortcut-button-padding-horizontal, 8px) var(--dex-okd-datepicker-shortcut-button-padding-vertical, 8px)
}

.dex-datepicker-shortcut-active {
  background-color: var(--dex-okd-datepicker-shortcut-active-background);
  color: var(--dex-okd-datepicker-shortcut-text-active-color)
}

.dex-datepicker-dateinput-title {
  color: var(--dex-okd-datepicker-dateinput-title-color);
  font-size: 14px;
  font-weight: 500;
  margin-bottom: 8px
}

.dex-datepicker-dateinput-body {
  align-items: center;
  direction: ltr;
  display: flex;
  justify-content: start
}

.dex-datepicker-dateinput-connector {
  color: var(--dex-okd-datepicker-dateinput-connector-color);
  padding: 0 4px
}

.dex-datepicker-dateinput-input-small {
  width: 48px
}

.dex-datepicker-dateinput-input-large {
  width: 72px
}

.dex-datepicker-dateinput-placeholder {
  color: var(--dex-okd-datepicker-dateinput-placeholder-color);
  font-size: 14px;
  margin-top: 8px
}

.dex-popup {
  display: inline-flex;
  position: relative;
  width: -webkit-fit-content;
  width: -moz-fit-content;
  width: fit-content
}

.dex-popup-layer {
  display: none;
  opacity: 0;
  outline: none;
  position: absolute;
  transition: opacity .3s
}

.dex-popup-layer-visible {
  display: block;
  opacity: 1
}

.dex-popup-layer-arrow-inner {
  border: 1px solid transparent;
  border-radius: 2px;
  box-sizing: border-box;
  display: block;
  height: 100%;
  transform: rotate(45deg);
  transform-origin: center;
  width: 100%
}

.dex-popup-layer.dex-popup-overflow[data-popper-reference-hidden] {
  pointer-events: none;
  visibility: hidden
}

.dex-popup-white-board .dex-popup-layer-arrow-inner,
.dex-popup-white-board-content {
  background-color: var(--dex-okd-popup-white-board-background);
  border: 1px solid rgba(0, 0, 0, .05)
}

.dex-popup-white-board-content {
  border-radius: 4px;
  box-shadow: var(--dex-okd-popup-white-board-shadow)
}

.dex-popup-placement-lg-top {
  padding-bottom: 9px
}

.dex-popup-placement-lg-bottom {
  padding-top: 9px
}

.dex-popup-placement-lg-left {
  padding-right: 9px
}

.dex-popup-placement-lg-right {
  padding-left: 9px
}

.dex-popup-arrow-lg .dex-popup-layer-arrow {
  height: 14px;
  width: 14px
}

.dex-popup-arrow-lg[data-popper-placement*=top] {
  padding: 0 0 9px
}

.dex-popup-arrow-lg[data-popper-placement*=bottom] {
  padding: 9px 0 0
}

.dex-popup-arrow-lg[data-popper-placement*=left] {
  padding: 0 9px 0 0
}

.dex-popup-arrow-lg[data-popper-placement*=right] {
  padding: 0 0 0 9px
}

.dex-popup-arrow-lg[data-popper-placement*=top] .dex-popup-layer-arrow {
  margin-top: -17px;
  top: 100%
}

.dex-popup-arrow-lg[data-popper-placement*=top] .dex-popup-layer-arrow-inner {
  border-left-color: transparent !important;
  border-top-color: transparent !important
}

.dex-popup-arrow-lg[data-popper-placement*=right] .dex-popup-layer-arrow {
  margin-right: -17px;
  right: 100%
}

.dex-popup-arrow-lg[data-popper-placement*=right] .dex-popup-layer-arrow-inner {
  border-right-color: transparent !important;
  border-top-color: transparent !important
}

.dex-popup-arrow-lg[data-popper-placement*=bottom] .dex-popup-layer-arrow {
  bottom: 100%;
  margin-bottom: -17px
}

.dex-popup-arrow-lg[data-popper-placement*=bottom] .dex-popup-layer-arrow-inner {
  border-bottom-color: transparent !important;
  border-right-color: transparent !important
}

.dex-popup-arrow-lg[data-popper-placement*=left] .dex-popup-layer-arrow {
  left: 100%;
  margin-left: -17px
}

.dex-popup-arrow-lg[data-popper-placement*=left] .dex-popup-layer-arrow-inner {
  border-bottom-color: transparent !important;
  border-left-color: transparent !important
}

.dex-popup-placement-md-top {
  padding-bottom: 7px
}

.dex-popup-placement-md-bottom {
  padding-top: 7px
}

.dex-popup-placement-md-left {
  padding-right: 7px
}

.dex-popup-placement-md-right {
  padding-left: 7px
}

.dex-popup-arrow-md .dex-popup-layer-arrow {
  height: 10px;
  width: 10px
}

.dex-popup-arrow-md[data-popper-placement*=top] {
  padding: 0 0 7px
}

.dex-popup-arrow-md[data-popper-placement*=bottom] {
  padding: 7px 0 0
}

.dex-popup-arrow-md[data-popper-placement*=left] {
  padding: 0 7px 0 0
}

.dex-popup-arrow-md[data-popper-placement*=right] {
  padding: 0 0 0 7px
}

.dex-popup-arrow-md[data-popper-placement*=top] .dex-popup-layer-arrow {
  margin-top: -13px;
  top: 100%
}

.dex-popup-arrow-md[data-popper-placement*=top] .dex-popup-layer-arrow-inner {
  border-left-color: transparent !important;
  border-top-color: transparent !important
}

.dex-popup-arrow-md[data-popper-placement*=right] .dex-popup-layer-arrow {
  margin-right: -13px;
  right: 100%
}

.dex-popup-arrow-md[data-popper-placement*=right] .dex-popup-layer-arrow-inner {
  border-right-color: transparent !important;
  border-top-color: transparent !important
}

.dex-popup-arrow-md[data-popper-placement*=bottom] .dex-popup-layer-arrow {
  bottom: 100%;
  margin-bottom: -13px
}

.dex-popup-arrow-md[data-popper-placement*=bottom] .dex-popup-layer-arrow-inner {
  border-bottom-color: transparent !important;
  border-right-color: transparent !important
}

.dex-popup-arrow-md[data-popper-placement*=left] .dex-popup-layer-arrow {
  left: 100%;
  margin-left: -13px
}

.dex-popup-arrow-md[data-popper-placement*=left] .dex-popup-layer-arrow-inner {
  border-bottom-color: transparent !important;
  border-left-color: transparent !important
}

.dex-checkbox-wrapper-indeterminate .dex-checkbox-inner {
  background-color: var(--dex-okd-checkbox-selected-background);
  border-color: var(--dex-okd-checkbox-selected-border-color)
}

.dex-checkbox-wrapper-indeterminate .dex-checkbox-inner:after {
  background-color: var(--dex-okd-checkbox-selected-inner-color);
  box-sizing: border-box;
  content: " ";
  height: 2px;
  left: 50%;
  position: absolute;
  top: 50%;
  transform: translate(-50%, -50%);
  transition: transform .2s cubic-bezier(.12, .4, .29, 1.46) .1s;
  width: 10px
}

.dex-checkbox-wrapper.dex-checkbox-circular .dex-checkbox-inner,
.dex-checkbox-wrapper.dex-checkbox-circular .dex-checkbox-input {
  border-radius: 50px
}

.dex-checkbox-inner {
  background-color: var(--dex-okd-checkbox-default-background);
  border: 1px solid var(--dex-okd-checkbox-default-border-color);
  border-radius: var(--dex-okd-checkbox-common-border-radius);
  box-shadow: var(--dex-okd-checkbox-default-shadow);
  box-sizing: border-box;
  cursor: pointer;
  direction: ltr;
  display: block;
  height: 12px;
  left: 0;
  position: relative;
  top: 0;
  width: 12px
}

.dex-checkbox-input {
  cursor: pointer;
  height: 100%;
  left: 0;
  margin: 0;
  opacity: 0;
  position: absolute;
  width: 100%;
  z-index: 1
}

.dex-checkbox-input:focus-visible {
  border-radius: var(--dex-okd-checkbox-common-border-radius);
  opacity: 1;
  outline: 2px solid var(--dex-okd-color-border-focus);
  outline-color: var(--dex-okd-color-border-focus);
  outline-offset: 2px;
  outline-style: solid;
  outline-width: 2px
}

.dex-checkbox-children {
  cursor: pointer;
  display: inline-block;
  font-size: var(--dex-okd-checkbox-common-label-font-size);
  margin-left: 4px;
  vertical-align: top;
  white-space: normal;
  word-break: break-word
}

.dex-checkbox-wrapper {
  cursor: pointer;
  display: inline-block;
  font-size: 0;
  margin-right: 8px;
  -webkit-user-select: none;
  -moz-user-select: none;
  -ms-user-select: none;
  user-select: none;
  white-space: nowrap
}

.dex-checkbox-wrapper .dex-checkbox-children {
  color: var(--dex-okd-checkbox-default-text-color)
}

.dex-checkbox-wrapper .dex-checkbox {
  cursor: pointer;
  display: inline-block;
  margin-top: 2px;
  position: relative;
  vertical-align: top
}

.dex-checkbox-wrapper.hover-status .dex-checkbox-inner {
  border-color: var(--dex-okd-checkbox-default-hover-border-color);
  box-shadow: var(--dex-okd-checkbox-default-hover-shadow)
}

.dex-checkbox-wrapper-checked .dex-checkbox-children {
  color: var(--dex-okd-checkbox-selected-text-color)
}

.dex-checkbox-wrapper-checked .dex-checkbox-inner {
  background-color: var(--dex-okd-checkbox-selected-background);
  border-color: var(--dex-okd-checkbox-selected-border-color);
  box-shadow: var(--dex-okd-checkbox-selected-shadow)
}

.dex-checkbox-wrapper-checked .dex-checkbox-inner:after {
  background-color: initial;
  border: 2px solid var(--dex-okd-checkbox-selected-inner-color);
  border-left: 0;
  border-top: 0;
  box-sizing: border-box;
  content: " ";
  height: 8px;
  left: 50%;
  position: absolute;
  top: calc(50% - 1px);
  transform: translate(-50%, -50%) rotate(45deg);
  transition: transform .2s cubic-bezier(.12, .4, .29, 1.46) .1s;
  width: 5px
}

.dex-checkbox-wrapper-checked.hover-status .dex-checkbox-inner {
  border-color: var(--dex-okd-checkbox-selected-hover-border-color);
  box-shadow: var(--dex-okd-checkbox-selected-hover-shadow)
}

.dex-checkbox-wrapper-error .dex-checkbox-children {
  color: var(--dex-okd-checkbox-error-text-color)
}

.dex-checkbox-wrapper-error .dex-checkbox-inner {
  border-color: var(--dex-okd-checkbox-error-border-color);
  box-shadow: var(--dex-okd-checkbox-error-shadow)
}

.dex-checkbox-wrapper-error.hover-status .dex-checkbox-inner {
  border-color: var(--dex-okd-checkbox-error-hover-border-color);
  box-shadow: var(--dex-okd-checkbox-error-hover-shadow)
}

.dex-checkbox-wrapper-error.dex-checkbox-wrapper-checked .dex-checkbox-inner {
  background-color: var(--dex-okd-checkbox-error-background);
  border-color: var(--dex-okd-checkbox-error-border-color)
}

.dex-checkbox-wrapper-error.dex-checkbox-wrapper-checked .dex-checkbox-inner:after {
  border-color: var(--dex-okd-checkbox-error-inner-color)
}

.dex-checkbox-wrapper-disabled {
  cursor: not-allowed
}

.dex-checkbox-wrapper-disabled .dex-checkbox-children {
  color: var(--dex-okd-checkbox-disabled-text-color);
  cursor: not-allowed
}

.dex-checkbox-wrapper-disabled .dex-checkbox,
.dex-checkbox-wrapper-disabled .dex-checkbox .dex-checkbox-input {
  cursor: default
}

.dex-checkbox-wrapper-disabled .dex-checkbox .dex-checkbox-inner {
  background-color: var(--dex-okd-checkbox-disabled-background);
  border-color: var(--dex-okd-checkbox-disabled-border-color);
  cursor: default
}

.dex-checkbox-wrapper-disabled.hover-status .dex-checkbox-inner {
  border-color: var(--dex-okd-checkbox-disabled-hover-border-color);
  box-shadow: unset
}

.dex-checkbox-wrapper-disabled.dex-checkbox-wrapper-checked .dex-checkbox-inner {
  background-color: var(--dex-okd-checkbox-disabled-background);
  border-color: var(--dex-okd-checkbox-disabled-border-color)
}

.dex-checkbox-wrapper-disabled.dex-checkbox-wrapper-checked .dex-checkbox-inner:after {
  border-color: var(--dex-okd-checkbox-disabled-inner-color)
}

.dex-checkbox-wrapper-disabled.dex-checkbox-wrapper-indeterminate .dex-checkbox-inner {
  background-color: var(--dex-okd-checkbox-disabled-background);
  border-color: var(--dex-okd-checkbox-disabled-border-color)
}

.dex-checkbox-wrapper-disabled.dex-checkbox-wrapper-indeterminate .dex-checkbox-inner:after {
  background-color: var(--dex-okd-checkbox-disabled-inner-color)
}

.dex-checkbox-sm .dex-checkbox-inner {
  border-radius: 2px;
  border-radius: var(--dex-okd-checkbox-sm-border-radius, 2px);
  height: var(--dex-okd-checkbox-sm-height);
  width: var(--dex-okd-checkbox-sm-width)
}

.dex-checkbox-sm .dex-checkbox-children {
  font-size: var(--dex-okd-checkbox-sm-font-size);
  margin-left: var(--dex-okd-checkbox-sm-margin)
}

.dex-checkbox-sm.dex-checkbox-wrapper {
  line-height: var(--dex-okd-checkbox-sm-line-height);
  padding-bottom: var(--dex-okd-checkbox-sm-padding);
  padding-top: var(--dex-okd-checkbox-sm-padding)
}

.dex-checkbox-md .dex-checkbox-inner {
  border-radius: 4px;
  border-radius: var(--dex-okd-checkbox-md-border-radius, 4px);
  height: var(--dex-okd-checkbox-md-height);
  width: var(--dex-okd-checkbox-md-width)
}

.dex-checkbox-md .dex-checkbox-children {
  font-size: var(--dex-okd-checkbox-md-font-size);
  margin-left: var(--dex-okd-checkbox-md-margin)
}

.dex-checkbox-md.dex-checkbox-wrapper {
  line-height: var(--dex-okd-checkbox-md-line-height);
  padding-bottom: var(--dex-okd-checkbox-md-padding);
  padding-top: var(--dex-okd-checkbox-md-padding)
}

@media (min-width:768px) {

  .dex-checkbox-wrapper-disabled.dex-checkbox-wrapper-checked:hover .dex-checkbox-inner,
  .dex-checkbox-wrapper-disabled:hover .dex-checkbox-inner {
    border-color: var(--dex-okd-checkbox-disabled-hover-border-color);
    box-shadow: unset
  }

  .dex-checkbox-wrapper:not(.dex-checkbox-wrapper-disabled):hover .dex-checkbox-inner {
    border-color: var(--dex-okd-checkbox-default-hover-border-color);
    box-shadow: var(--dex-okd-checkbox-default-hover-shadow)
  }

  .dex-checkbox-wrapper-checked:not(.dex-checkbox-wrapper-disabled):hover .dex-checkbox-inner {
    border-color: var(--dex-okd-checkbox-selected-hover-border-color);
    box-shadow: var(--dex-okd-checkbox-selected-hover-shadow)
  }

  .dex-checkbox-wrapper-error:not(.dex-checkbox-wrapper-disabled):hover .dex-checkbox-inner {
    border-color: var(--dex-okd-checkbox-error-hover-border-color);
    box-shadow: var(--dex-okd-checkbox-error-hover-shadow)
  }
}

.dex-checkbox-reversed.dex-checkbox-wrapper-indeterminate .dex-checkbox-inner {
  background-color: var(--dex-okd-checkbox-reversed-selected-background);
  border-color: var(--dex-okd-checkbox-reversed-selected-border-color)
}

.dex-checkbox-reversed.dex-checkbox-wrapper-indeterminate .dex-checkbox-inner:after {
  background-color: var(--dex-okd-checkbox-reversed-selected-inner-color)
}

.dex-checkbox-reversed .dex-checkbox-inner {
  background-color: var(--dex-okd-checkbox-reversed-default-background);
  border-color: var(--dex-okd-checkbox-reversed-default-border-color);
  box-shadow: var(--dex-okd-checkbox-reversed-default-shadow)
}

.dex-checkbox-reversed.dex-checkbox-wrapper .dex-checkbox-children {
  color: var(--dex-okd-checkbox-reversed-default-text-color)
}

.dex-checkbox-reversed.dex-checkbox-wrapper.hover-status .dex-checkbox-inner,
.dex-checkbox-reversed.dex-checkbox-wrapper:hover .dex-checkbox-inner {
  border-color: var(--dex-okd-checkbox-reversed-default-hover-border-color);
  box-shadow: var(--dex-okd-checkbox-reversed-default-hover-shadow)
}

.dex-checkbox-reversed.dex-checkbox-wrapper-checked .dex-checkbox-children {
  color: var(--dex-okd-checkbox-reversed-selected-text-color)
}

.dex-checkbox-reversed.dex-checkbox-wrapper-checked .dex-checkbox-inner {
  background-color: var(--dex-okd-checkbox-reversed-selected-background);
  border-color: var(--dex-okd-checkbox-reversed-selected-border-color);
  box-shadow: var(--dex-okd-checkbox-reversed-selected-shadow)
}

.dex-checkbox-reversed.dex-checkbox-wrapper-checked .dex-checkbox-inner:after {
  border-color: var(--dex-okd-checkbox-reversed-selected-inner-color)
}

.dex-checkbox-reversed.dex-checkbox-wrapper-checked.hover-status .dex-checkbox-inner,
.dex-checkbox-reversed.dex-checkbox-wrapper-checked:hover .dex-checkbox-inner {
  border-color: var(--dex-okd-checkbox-reversed-selected-hover-border-color);
  box-shadow: var(--dex-okd-checkbox-reversed-selected-hover-shadow)
}

.dex-checkbox-reversed.dex-checkbox-wrapper-error .dex-checkbox-children {
  color: var(--dex-okd-checkbox-reversed-error-text-color)
}

.dex-checkbox-reversed.dex-checkbox-wrapper-error .dex-checkbox-inner {
  border-color: var(--dex-okd-checkbox-reversed-error-border-color);
  box-shadow: var(--dex-okd-checkbox-reversed-error-shadow)
}

.dex-checkbox-reversed.dex-checkbox-wrapper-error.hover-status .dex-checkbox-inner,
.dex-checkbox-reversed.dex-checkbox-wrapper-error:hover .dex-checkbox-inner {
  border-color: var(--dex-okd-checkbox-reversed-error-hover-border-color);
  box-shadow: var(--dex-okd-checkbox-reversed-error-hover-shadow)
}

.dex-checkbox-reversed.dex-checkbox-wrapper-error.dex-checkbox-wrapper-checked .dex-checkbox-inner {
  background-color: var(--dex-okd-checkbox-reversed-error-background);
  border-color: var(--dex-okd-checkbox-reversed-error-border-color)
}

.dex-checkbox-reversed.dex-checkbox-wrapper-error.dex-checkbox-wrapper-checked .dex-checkbox-inner:after {
  border-color: var(--dex-okd-checkbox-reversed-error-inner-color)
}

.dex-checkbox-reversed.dex-checkbox-wrapper-disabled .dex-checkbox-children {
  color: var(--dex-okd-checkbox-reversed-disabled-text-color)
}

.dex-checkbox-reversed.dex-checkbox-wrapper-disabled .dex-checkbox .dex-checkbox-inner {
  background-color: var(--dex-okd-checkbox-reversed-disabled-background);
  border-color: var(--dex-okd-checkbox-reversed-disabled-border-color)
}

.dex-checkbox-reversed.dex-checkbox-wrapper-disabled.hover-status .dex-checkbox-inner,
.dex-checkbox-reversed.dex-checkbox-wrapper-disabled:hover .dex-checkbox-inner {
  border-color: var(--dex-okd-checkbox-reversed-disabled-hover-border-color)
}

.dex-checkbox-reversed.dex-checkbox-wrapper-disabled.dex-checkbox-wrapper-checked .dex-checkbox-inner {
  background-color: var(--dex-okd-checkbox-reversed-disabled-background);
  border-color: var(--dex-okd-checkbox-reversed-disabled-border-color)
}

.dex-checkbox-reversed.dex-checkbox-wrapper-disabled.dex-checkbox-wrapper-checked .dex-checkbox-inner:after {
  border-color: var(--dex-okd-checkbox-reversed-disabled-inner-color)
}

.dex-checkbox-circle {
  align-items: center;
  background-color: initial;
  background-color: var(--dex-okd-checkbox-circle-default-background-color, transparent);
  border: 1px solid #dbdbdb;
  border: 1px solid var(--dex-okd-checkbox-circle-default-border-color, #dbdbdb);
  border-radius: 100%;
  cursor: pointer;
  display: inline-block;
  height: 18px;
  justify-content: center;
  overflow: hidden;
  position: relative;
  width: 18px
}

.dex-checkbox-circle:after {
  background-color: initial;
  border: 2px solid #fff;
  border: 2px solid var(--dex-okd-checkbox-circle-inner-color, #fff);
  border-left: 0;
  border-top: 0;
  box-sizing: border-box;
  content: " ";
  display: none;
  height: 8px;
  left: 50%;
  position: absolute;
  top: calc(50% - 1px);
  transform: translate(-50%, -50%) rotate(45deg);
  transition: transform .2s cubic-bezier(.12, .4, .29, 1.46) .1s;
  width: 5px
}

.dex-checkbox-circle-checked {
  background-color: #000;
  background-color: var(--dex-okd-checkbox-circle-checked-background-color, #000);
  border-color: #000;
  border-color: var(--dex-okd-checkbox-circle-checked-border-color, #000)
}

.dex-checkbox-circle-checked .dex-checkbox-circle-icon {
  visibility: visible
}

.dex-checkbox-circle-checked:after {
  display: block
}

.dex-checkbox-circle-disabled {
  background-color: #f9f9f9;
  background-color: var(--dex-okd-checkbox-circle-default-disabled-background-color, #f9f9f9);
  border-color: #ebebeb;
  border-color: var(--dex-okd-checkbox-circle-default-disabled-border-color, #ebebeb);
  cursor: not-allowed
}

.dex-checkbox-circle-disabled.dex-checkbox-circle-checked {
  background-color: #bdbdbd;
  background-color: var(--dex-okd-checkbox-circle-checked-disabled-background-color, #bdbdbd);
  border-color: #bdbdbd;
  border-color: var(--dex-okd-checkbox-circle-checked-disabled-border-color, #bdbdbd)
}

.dex-btn .btn-content {
  align-items: center;
  display: flex
}

.dex-btn .dex-btn-ellipsis {
  display: block;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  width: 100%
}

.dex-btn.loading .btn-content {
  opacity: 0
}

.dex-btn.loading .btn-content-position {
  display: none
}

.dex-btn.loading .dex-btn-loader {
  line-height: 0;
  position: absolute
}

.dex-btn.loading .btn-loader-position-absolute {
  position: relative
}

.dex-btn-loader-container {
  height: 100%;
  position: relative
}

.dex-btn .btn-icon+.btn-content {
  margin-left: 4px
}

.dex-btn.btn-xxs .btn-icon {
  font-size: var(--dex-okd-button-xxs-icon-size)
}

.dex-btn.btn-xxs .btn-icon-leading {
  margin-right: var(--dex-okd-button-xxs-icon-margin)
}

.dex-btn.btn-xxs .btn-icon-tailing {
  margin-left: var(--dex-okd-button-xxs-icon-margin)
}

.dex-btn.btn-xxs .dex-btn-loader-size {
  border-radius: var(--dex-okd-button-xxs-loader-size);
  height: var(--dex-okd-button-xxs-loader-size);
  width: var(--dex-okd-button-xxs-loader-size)
}

.dex-btn.btn-xs .btn-icon {
  font-size: var(--dex-okd-button-xs-icon-size)
}

.dex-btn.btn-xs .btn-icon-leading {
  margin-right: var(--dex-okd-button-xs-icon-margin)
}

.dex-btn.btn-xs .btn-icon-tailing {
  margin-left: var(--dex-okd-button-xs-icon-margin)
}

.dex-btn.btn-xs .dex-btn-loader-size {
  border-radius: var(--dex-okd-button-xs-loader-size);
  height: var(--dex-okd-button-xs-loader-size);
  width: var(--dex-okd-button-xs-loader-size)
}

.dex-btn.btn-s .btn-icon {
  font-size: var(--dex-okd-button-s-icon-size)
}

.dex-btn.btn-s .btn-icon-leading {
  margin-right: var(--dex-okd-button-s-icon-margin)
}

.dex-btn.btn-s .btn-icon-tailing {
  margin-left: var(--dex-okd-button-s-icon-margin)
}

.dex-btn.btn-s .dex-btn-loader-size {
  border-radius: var(--dex-okd-button-s-loader-size);
  height: var(--dex-okd-button-s-loader-size);
  width: var(--dex-okd-button-s-loader-size)
}

.dex-btn.btn-sm .btn-icon {
  font-size: var(--dex-okd-button-sm-icon-size)
}

.dex-btn.btn-sm .btn-icon-leading {
  margin-right: var(--dex-okd-button-sm-icon-margin)
}

.dex-btn.btn-sm .btn-icon-tailing {
  margin-left: var(--dex-okd-button-sm-icon-margin)
}

.dex-btn.btn-sm .dex-btn-loader-size {
  border-radius: var(--dex-okd-button-sm-loader-size);
  height: var(--dex-okd-button-sm-loader-size);
  width: var(--dex-okd-button-sm-loader-size)
}

.dex-btn.btn-md .btn-icon {
  font-size: var(--dex-okd-button-md-icon-size)
}

.dex-btn.btn-md .btn-icon-leading {
  margin-right: var(--dex-okd-button-md-icon-margin)
}

.dex-btn.btn-md .btn-icon-tailing {
  margin-left: var(--dex-okd-button-md-icon-margin)
}

.dex-btn.btn-md .dex-btn-loader-size {
  border-radius: var(--dex-okd-button-md-loader-size);
  height: var(--dex-okd-button-md-loader-size);
  width: var(--dex-okd-button-md-loader-size)
}

.dex-btn.btn-lg .btn-icon {
  font-size: var(--dex-okd-button-lg-icon-size)
}

.dex-btn.btn-lg .btn-icon-leading {
  margin-right: var(--dex-okd-button-lg-icon-margin)
}

.dex-btn.btn-lg .btn-icon-tailing {
  margin-left: var(--dex-okd-button-lg-icon-margin)
}

.dex-btn.btn-lg .dex-btn-loader-size {
  border-radius: var(--dex-okd-button-lg-loader-size);
  height: var(--dex-okd-button-lg-loader-size);
  width: var(--dex-okd-button-lg-loader-size)
}

.dex-btn.btn-xl .btn-icon {
  font-size: var(--dex-okd-button-xl-icon-size)
}

.dex-btn.btn-xl .btn-icon-leading {
  margin-right: var(--dex-okd-button-xl-icon-margin)
}

.dex-btn.btn-xl .btn-icon-tailing {
  margin-left: var(--dex-okd-button-xl-icon-margin)
}

.dex-btn.btn-xl .dex-btn-loader-size {
  border-radius: var(--dex-okd-button-xl-loader-size);
  height: var(--dex-okd-button-xl-loader-size);
  width: var(--dex-okd-button-xl-loader-size)
}

.dex-btn .dex-btn-outline-primary-loader {
  border-color: var(--dex-okd-button-outline-primary-loader-track-color);
  border-top-color: var(--dex-okd-button-outline-primary-loader-mark-color)
}

.dex-btn {
  -webkit-tap-highlight-color: transparent;
  align-items: center;
  -webkit-appearance: none;
  box-sizing: border-box;
  cursor: pointer;
  display: inline-flex;
  font-family: inherit;
  font-weight: 500;
  justify-content: center;
  outline: none;
  position: relative;
  text-decoration: none;
  touch-action: manipulation;
  -webkit-user-select: none;
  -moz-user-select: none;
  -ms-user-select: none;
  user-select: none
}

.dex-btn:focus-visible {
  outline: 2px solid var(--dex-okd-color-border-focus);
  outline-color: var(--dex-okd-color-border-focus);
  outline-offset: 2px;
  outline-style: solid;
  outline-width: 2px
}

.dex-btn.btn-outline-primary {
  background: var(--dex-okd-button-outline-primary-default-background);
  border-color: var(--dex-okd-button-outline-primary-default-border-color);
  border-style: solid;
  border-width: var(--dex-okd-button-outline-primary-border-size);
  box-shadow: var(--dex-okd-button-outline-primary-default-shadow);
  color: var(--dex-okd-button-outline-primary-default-font-color)
}

.dex-btn.btn-outline-primary.hover,
.dex-btn.btn-outline-primary:not(:disabled):not(.btn-disabled):not(.mobile):hover {
  background: var(--dex-okd-button-outline-primary-hover-background);
  border-color: var(--dex-okd-button-outline-primary-hover-border-color);
  box-shadow: var(--dex-okd-button-outline-primary-hover-shadow);
  color: var(--dex-okd-button-outline-primary-hover-font-color)
}

.dex-btn.btn-outline-primary.hover .btn-icon,
.dex-btn.btn-outline-primary:not(:disabled):not(.btn-disabled):not(.mobile):hover .btn-icon {
  color: var(--dex-okd-button-outline-primary-hover-icon-color)
}

.dex-btn.btn-outline-primary.active,
.dex-btn.btn-outline-primary:not(:disabled):active {
  background: var(--dex-okd-button-outline-primary-active-background);
  border-color: var(--dex-okd-button-outline-primary-active-border-color);
  box-shadow: var(--dex-okd-button-outline-primary-active-shadow);
  color: var(--dex-okd-button-outline-primary-active-font-color)
}

.dex-btn.btn-outline-primary.active .btn-icon,
.dex-btn.btn-outline-primary:not(:disabled):active .btn-icon {
  color: var(--dex-okd-button-outline-primary-active-icon-color)
}

.dex-btn.btn-outline-primary:not(.loading).btn-disabled,
.dex-btn.btn-outline-primary:not(.loading):disabled {
  background: var(--dex-okd-button-outline-primary-disabled-background);
  border-color: var(--dex-okd-button-outline-primary-disabled-border-color);
  box-shadow: var(--dex-okd-button-outline-primary-disabled-shadow);
  color: var(--dex-okd-button-outline-primary-disabled-font-color)
}

.dex-btn.btn-outline-primary:not(.loading).btn-disabled .btn-icon,
.dex-btn.btn-outline-primary:not(.loading):disabled .btn-icon {
  color: var(--dex-okd-button-outline-primary-disabled-icon-color)
}

.dex-btn.btn-outline-primary.loading {
  cursor: pointer
}

.dex-btn.btn-outline-primary .btn-icon {
  color: var(--dex-okd-button-outline-primary-default-icon-color)
}

.dex-btn.btn-outline-primary .dex-btn-loader-text {
  color: var(--dex-okd-button-outline-primary-default-font-color)
}

.dex-btn.btn-outline-primary.btn-xxs {
  padding: calc(var(--dex-okd-button-xxs-padding-vertical) + 1px - var(--dex-okd-button-outline-primary-border-size)) var(--dex-okd-button-xxs-padding-horizontal)
}

.dex-btn.btn-outline-primary.btn-xxs.dex-btn-strict-circle {
  border-radius: 100px;
  height: calc(var(--dex-okd-button-xxs-padding-vertical)*2 + 2px - var(--dex-okd-button-outline-primary-border-size)*2 + var(--dex-okd-button-xxs-line-height) + var(--dex-okd-button-outline-primary-border-size)*2);
  min-width: 0;
  overflow: hidden;
  padding: 0;
  width: calc(var(--dex-okd-button-xxs-padding-vertical)*2 + 2px - var(--dex-okd-button-outline-primary-border-size)*2 + var(--dex-okd-button-xxs-line-height) + var(--dex-okd-button-outline-primary-border-size)*2)
}

.dex-btn.btn-outline-primary.btn-xxs.dex-btn-strict-circle .btn-content {
  display: block;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  width: 100%
}

.dex-btn.btn-outline-primary.btn-xs {
  padding: calc(var(--dex-okd-button-xs-padding-vertical) + 1px - var(--dex-okd-button-outline-primary-border-size)) var(--dex-okd-button-xs-padding-horizontal)
}

.dex-btn.btn-outline-primary.btn-xs.dex-btn-strict-circle {
  border-radius: 100px;
  height: calc(var(--dex-okd-button-xs-padding-vertical)*2 + 2px - var(--dex-okd-button-outline-primary-border-size)*2 + var(--dex-okd-button-xs-line-height) + var(--dex-okd-button-outline-primary-border-size)*2);
  min-width: 0;
  overflow: hidden;
  padding: 0;
  width: calc(var(--dex-okd-button-xs-padding-vertical)*2 + 2px - var(--dex-okd-button-outline-primary-border-size)*2 + var(--dex-okd-button-xs-line-height) + var(--dex-okd-button-outline-primary-border-size)*2)
}

.dex-btn.btn-outline-primary.btn-xs.dex-btn-strict-circle .btn-content {
  display: block;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  width: 100%
}

.dex-btn.btn-outline-primary.btn-s {
  padding: calc(var(--dex-okd-button-s-padding-vertical) + 1px - var(--dex-okd-button-outline-primary-border-size)) var(--dex-okd-button-s-padding-horizontal)
}

.dex-btn.btn-outline-primary.btn-s.dex-btn-strict-circle {
  border-radius: 100px;
  height: calc(var(--dex-okd-button-s-padding-vertical)*2 + 2px - var(--dex-okd-button-outline-primary-border-size)*2 + var(--dex-okd-button-s-line-height) + var(--dex-okd-button-outline-primary-border-size)*2);
  min-width: 0;
  overflow: hidden;
  padding: 0;
  width: calc(var(--dex-okd-button-s-padding-vertical)*2 + 2px - var(--dex-okd-button-outline-primary-border-size)*2 + var(--dex-okd-button-s-line-height) + var(--dex-okd-button-outline-primary-border-size)*2)
}

.dex-btn.btn-outline-primary.btn-s.dex-btn-strict-circle .btn-content {
  display: block;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  width: 100%
}

.dex-btn.btn-outline-primary.btn-sm {
  padding: calc(var(--dex-okd-button-sm-padding-vertical) + 1px - var(--dex-okd-button-outline-primary-border-size)) var(--dex-okd-button-sm-padding-horizontal)
}

.dex-btn.btn-outline-primary.btn-sm.dex-btn-strict-circle {
  border-radius: 100px;
  height: calc(var(--dex-okd-button-sm-padding-vertical)*2 + 2px - var(--dex-okd-button-outline-primary-border-size)*2 + var(--dex-okd-button-sm-line-height) + var(--dex-okd-button-outline-primary-border-size)*2);
  min-width: 0;
  overflow: hidden;
  padding: 0;
  width: calc(var(--dex-okd-button-sm-padding-vertical)*2 + 2px - var(--dex-okd-button-outline-primary-border-size)*2 + var(--dex-okd-button-sm-line-height) + var(--dex-okd-button-outline-primary-border-size)*2)
}

.dex-btn.btn-outline-primary.btn-sm.dex-btn-strict-circle .btn-content {
  display: block;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  width: 100%
}

.dex-btn.btn-outline-primary.btn-md {
  padding: calc(var(--dex-okd-button-md-padding-vertical) + 1px - var(--dex-okd-button-outline-primary-border-size)) var(--dex-okd-button-md-padding-horizontal)
}

.dex-btn.btn-outline-primary.btn-md.dex-btn-strict-circle {
  border-radius: 100px;
  height: calc(var(--dex-okd-button-md-padding-vertical)*2 + 2px - var(--dex-okd-button-outline-primary-border-size)*2 + var(--dex-okd-button-md-line-height) + var(--dex-okd-button-outline-primary-border-size)*2);
  min-width: 0;
  overflow: hidden;
  padding: 0;
  width: calc(var(--dex-okd-button-md-padding-vertical)*2 + 2px - var(--dex-okd-button-outline-primary-border-size)*2 + var(--dex-okd-button-md-line-height) + var(--dex-okd-button-outline-primary-border-size)*2)
}

.dex-btn.btn-outline-primary.btn-md.dex-btn-strict-circle .btn-content {
  display: block;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  width: 100%
}

.dex-btn.btn-outline-primary.btn-lg {
  padding: calc(var(--dex-okd-button-lg-padding-vertical) + 1px - var(--dex-okd-button-outline-primary-border-size)) var(--dex-okd-button-lg-padding-horizontal)
}

.dex-btn.btn-outline-primary.btn-lg.dex-btn-strict-circle {
  border-radius: 100px;
  height: calc(var(--dex-okd-button-lg-padding-vertical)*2 + 2px - var(--dex-okd-button-outline-primary-border-size)*2 + var(--dex-okd-button-lg-line-height) + var(--dex-okd-button-outline-primary-border-size)*2);
  min-width: 0;
  overflow: hidden;
  padding: 0;
  width: calc(var(--dex-okd-button-lg-padding-vertical)*2 + 2px - var(--dex-okd-button-outline-primary-border-size)*2 + var(--dex-okd-button-lg-line-height) + var(--dex-okd-button-outline-primary-border-size)*2)
}

.dex-btn.btn-outline-primary.btn-lg.dex-btn-strict-circle .btn-content {
  display: block;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  width: 100%
}

.dex-btn.btn-outline-primary.btn-xl {
  padding: calc(var(--dex-okd-button-xl-padding-vertical) + 1px - var(--dex-okd-button-outline-primary-border-size)) var(--dex-okd-button-xl-padding-horizontal)
}

.dex-btn.btn-outline-primary.btn-xl.dex-btn-strict-circle {
  border-radius: 100px;
  height: calc(var(--dex-okd-button-xl-padding-vertical)*2 + 2px - var(--dex-okd-button-outline-primary-border-size)*2 + var(--dex-okd-button-xl-line-height) + var(--dex-okd-button-outline-primary-border-size)*2);
  min-width: 0;
  overflow: hidden;
  padding: 0;
  width: calc(var(--dex-okd-button-xl-padding-vertical)*2 + 2px - var(--dex-okd-button-outline-primary-border-size)*2 + var(--dex-okd-button-xl-line-height) + var(--dex-okd-button-outline-primary-border-size)*2)
}

.dex-btn.btn-outline-primary.btn-xl.dex-btn-strict-circle .btn-content {
  display: block;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  width: 100%
}

.dex-btn.btn-xxs {
  border-radius: var(--dex-okd-button-xxs-border-radius);
  font-weight: 500;
  font-weight: var(--dex-okd-button-xxs-font-weight, 500);
  min-width: var(--dex-okd-button-xxs-min-width)
}

.dex-btn.btn-xxs,
.dex-btn.btn-xxs .dex-btn-loader-text {
  font-size: var(--dex-okd-button-xxs-font-size);
  line-height: var(--dex-okd-button-xxs-line-height)
}

.dex-btn.btn-xxs .dex-btn-loader-text {
  margin-left: var(--dex-okd-button-xxs-loader-text-margin-left)
}

.dex-btn.btn-xxs.btn-rect {
  border-radius: 4px;
  border-radius: var(--dex-okd-button-rect-xxs-border-radius, 4px)
}

.dex-btn.btn-xs {
  border-radius: var(--dex-okd-button-xs-border-radius);
  font-weight: 500;
  font-weight: var(--dex-okd-button-xs-font-weight, 500);
  min-width: var(--dex-okd-button-xs-min-width)
}

.dex-btn.btn-xs,
.dex-btn.btn-xs .dex-btn-loader-text {
  font-size: var(--dex-okd-button-xs-font-size);
  line-height: var(--dex-okd-button-xs-line-height)
}

.dex-btn.btn-xs .dex-btn-loader-text {
  margin-left: var(--dex-okd-button-xs-loader-text-margin-left)
}

.dex-btn.btn-xs.btn-rect {
  border-radius: 4px;
  border-radius: var(--dex-okd-button-rect-xs-border-radius, 4px)
}

.dex-btn.btn-s {
  border-radius: var(--dex-okd-button-s-border-radius);
  font-weight: 500;
  font-weight: var(--dex-okd-button-s-font-weight, 500);
  min-width: var(--dex-okd-button-s-min-width)
}

.dex-btn.btn-s,
.dex-btn.btn-s .dex-btn-loader-text {
  font-size: var(--dex-okd-button-s-font-size);
  line-height: var(--dex-okd-button-s-line-height)
}

.dex-btn.btn-s .dex-btn-loader-text {
  margin-left: var(--dex-okd-button-s-loader-text-margin-left)
}

.dex-btn.btn-s.btn-rect {
  border-radius: 4px;
  border-radius: var(--dex-okd-button-rect-s-border-radius, 4px)
}

.dex-btn.btn-sm {
  border-radius: var(--dex-okd-button-sm-border-radius);
  font-weight: 500;
  font-weight: var(--dex-okd-button-sm-font-weight, 500);
  min-width: var(--dex-okd-button-sm-min-width)
}

.dex-btn.btn-sm,
.dex-btn.btn-sm .dex-btn-loader-text {
  font-size: var(--dex-okd-button-sm-font-size);
  line-height: var(--dex-okd-button-sm-line-height)
}

.dex-btn.btn-sm .dex-btn-loader-text {
  margin-left: var(--dex-okd-button-sm-loader-text-margin-left)
}

.dex-btn.btn-sm.btn-rect {
  border-radius: 4px;
  border-radius: var(--dex-okd-button-rect-sm-border-radius, 4px)
}

.dex-btn.btn-md {
  border-radius: var(--dex-okd-button-md-border-radius);
  font-weight: 500;
  font-weight: var(--dex-okd-button-md-font-weight, 500);
  min-width: var(--dex-okd-button-md-min-width)
}

.dex-btn.btn-md,
.dex-btn.btn-md .dex-btn-loader-text {
  font-size: var(--dex-okd-button-md-font-size);
  line-height: var(--dex-okd-button-md-line-height)
}

.dex-btn.btn-md .dex-btn-loader-text {
  margin-left: var(--dex-okd-button-md-loader-text-margin-left)
}

.dex-btn.btn-md.btn-rect {
  border-radius: 4px;
  border-radius: var(--dex-okd-button-rect-md-border-radius, 4px)
}

.dex-btn.btn-lg {
  border-radius: var(--dex-okd-button-lg-border-radius);
  font-weight: 500;
  font-weight: var(--dex-okd-button-lg-font-weight, 500);
  min-width: var(--dex-okd-button-lg-min-width)
}

.dex-btn.btn-lg,
.dex-btn.btn-lg .dex-btn-loader-text {
  font-size: var(--dex-okd-button-lg-font-size);
  line-height: var(--dex-okd-button-lg-line-height)
}

.dex-btn.btn-lg .dex-btn-loader-text {
  margin-left: var(--dex-okd-button-lg-loader-text-margin-left)
}

.dex-btn.btn-lg.btn-rect {
  border-radius: 8px;
  border-radius: var(--dex-okd-button-rect-lg-border-radius, 8px)
}

.dex-btn.btn-xl {
  border-radius: var(--dex-okd-button-xl-border-radius);
  font-weight: 500;
  font-weight: var(--dex-okd-button-xl-font-weight, 500);
  min-width: var(--dex-okd-button-xl-min-width)
}

.dex-btn.btn-xl,
.dex-btn.btn-xl .dex-btn-loader-text {
  font-size: var(--dex-okd-button-xl-font-size);
  line-height: var(--dex-okd-button-xl-line-height)
}

.dex-btn.btn-xl .dex-btn-loader-text {
  margin-left: var(--dex-okd-button-xl-loader-text-margin-left)
}

.dex-btn.btn-xl.btn-rect {
  border-radius: 8px;
  border-radius: var(--dex-okd-button-rect-xl-border-radius, 8px)
}

.dex-btn.btn-disabled,
.dex-btn:disabled {
  cursor: not-allowed
}

.dex-btn.block {
  display: flex;
  width: 100%
}

.dex-btn.btn-circle {
  border-radius: 100px !important
}

.dex-datepicker-body {
  display: flex
}

.dex-picker-view {
  box-sizing: border-box;
  display: flex;
  height: 100%;
  justify-content: center;
  position: relative;
  width: 100%
}

.dex-picker-view-button {
  box-sizing: border-box;
  height: 56px;
  padding-right: 23px;
  padding-top: 12px;
  text-align: right
}

.dex-picker-view-wheel-column {
  flex: 1 1;
  height: 100%;
  overflow-y: scroll;
  scrollbar-width: none
}

.dex-picker-view-wheel-column::-webkit-scrollbar {
  display: none
}

.dex-picker-view-wheel-column .column-item-container {
  height: 100%
}

.dex-picker-view-wheel-column-item {
  color: #929292;
  color: var(--dex-okd-pickerview-item-default-font-color, #929292);
  cursor: pointer;
  font-size: 14px;
  font-size: var(--dex-okd-pickerview-item-default-font-size, 14px);
  font-weight: 400;
  font-weight: var(--dex-okd-pickerview-item-default-font-weight, 400);
  height: 36px;
  height: var(--dex-okd-pickerview-item-default-height, 36px);
  line-height: 36px;
  line-height: var(--dex-okd-pickerview-item-default-height, 36px);
  text-align: center;
  -webkit-user-select: none;
  -moz-user-select: none;
  -ms-user-select: none;
  user-select: none;
  width: 100%
}

.dex-picker-view-wheel-column-item-active {
  color: #000;
  color: var(--dex-okd-pickerview-item-active-font-color, #000);
  font-weight: 500;
  font-weight: var(--dex-okd-pickerview-item-active-font-weight, 500)
}

@media (max-width:767px) {
  .dex-picker-view-wheel-column-item {
    font-size: 16px;
    font-size: var(--dex-okd-pickerview-sm-item-default-font-size, 16px)
  }
}

.dex-picker-view-wheel-column-empty {
  height: calc(50% - 18px);
  height: calc(50% - var(--dex-okd-pickerview-item-default-height, 36px)/2)
}

.dex-picker-view-mask {
  display: flex;
  flex-direction: column;
  height: 100%;
  justify-content: center;
  left: 0;
  pointer-events: none;
  position: absolute;
  top: 0;
  width: 100%;
  z-index: 1000
}

.dex-picker-view-mask-middle {
  border-bottom: 1px solid #ebebeb;
  border-bottom: 1px solid var(--dex-okd-pickerview-item-active-border-color, #ebebeb);
  border-top: 1px solid #ebebeb;
  border-top: 1px solid var(--dex-okd-pickerview-item-active-border-color, #ebebeb);
  box-sizing: border-box;
  flex: none;
  height: 36px;
  height: var(--dex-okd-pickerview-item-default-height, 36px)
}

.dex-coach-popover .dex-popup-layer-content {
  padding: 0
}

.dex-coach-popover .dex-popup-layer-arrow-inner {
  background-color: #fff;
  background-color: var(--dex-okd-coachmark-popover-arrow-background-color, #fff);
  border-color: #ebebeb;
  border-color: var(--dex-okd-coachmark-popover-arrow-border-color, #ebebeb)
}

.dex-coach-con {
  background-color: #fff;
  background-color: var(--dex-okd-coachmark-popover-background-color, #fff);
  border: thin solid #ebebeb;
  border: thin solid var(--dex-okd-coachmark-popover-border-color, #ebebeb);
  border-radius: 8px;
  border-radius: var(--dex-okd-coachmark-popover-border-radius, 8px);
  box-shadow: 8px 8px 16px #00000014;
  box-shadow: var(--dex-okd-coachmark-popover-border-shadow, 8px 8px 16px #00000014);
  box-sizing: border-box;
  overflow: hidden;
  padding: 16px;
  padding: var(--dex-okd-coachmark-popover-padding, 16px);
  width: 250px;
  width: var(--dex-okd-coachmark-popover-width, 250px)
}

.dex-coach-con .dex-coach-title {
  align-items: center;
  color: #000;
  color: var(--dex-okd-coachmark-popover-title-color, #000);
  display: flex;
  font-size: 16px;
  font-size: var(--dex-okd-coachmark-popover-title-font-size, 16px);
  font-weight: 700;
  font-weight: var(--dex-okd-coachmark-popover-title-font-weight, 700);
  justify-content: space-between;
  line-height: 20px;
  line-height: var(--dex-okd-coachmark-popover-title-line-height, 20px)
}

.dex-coach-con .dex-coach-title .dex-coach-title-close {
  align-self: flex-start;
  color: #929292;
  color: var(--dex-okd-coachmark-popover-close-color, #929292);
  cursor: pointer;
  display: inline-block;
  font-size: 20px;
  font-size: var(--dex-okd-coachmark-popover-close-font-size, 20px);
  margin-left: 12px;
  margin-left: var(--dex-okd-coachmark-popover-close-margin-left, 12px);
  position: relative;
  vertical-align: middle;
  z-index: 1
}

.dex-coach-con .dex-coach-title+.dex-coach-desc {
  margin-top: 8px;
  margin-top: var(--dex-okd-coachmark-popover-desc-margin-top, 8px)
}

.dex-coach-con .dex-coach-desc {
  color: #000;
  color: var(--dex-okd-coachmark-popover-desc-color, #000);
  font-size: 14px;
  font-size: var(--dex-okd-coachmark-popover-desc-font-size, 14px);
  line-height: 20px;
  line-height: var(--dex-okd-coachmark-popover-desc-line-height, 20px)
}

.dex-coach-con .dex-coach-desc+.dex-coach-footer {
  margin-top: 16px;
  margin-top: var(--dex-okd-coachmark-popover-footer-margin-top, 16px)
}

.dex-coach-con .dex-coach-tour-footer {
  align-items: center;
  color: #929292;
  color: var(--dex-okd-coachmark-tour-footer-color, #929292);
  display: flex;
  font-size: 14px;
  font-size: var(--dex-okd-coachmark-tour-footer-font-size, 14px);
  justify-content: space-between;
  line-height: 16px
}

.dex-coach-con .dex-coach-tour-footer .dex-coach-tour-footer-right {
  align-items: center;
  display: flex
}

.dex-coach-con .dex-coach-tour-footer .dex-coach-tour-footer-confirm {
  margin-left: 8px;
  margin-left: var(--dex-okd-okd-coachmark-tour-footer-margin-left, 8px)
}

.dex-coach-con .dex-coach-tour-footer .dex-coach-tour-footer-button.dex-coach-tour-footer-cancel,
.dex-coach-con .dex-coach-tour-footer .dex-coach-tour-footer-button.dex-coach-tour-footer-confirm {
  min-width: unset
}

.dex-coach-con .dex-coach-standalone-footer {
  display: flex;
  justify-content: flex-end
}

.dex-coach-con .dex-coach-standalone-footer .dex-coach-standalone-footer-button+.dex-coach-standalone-footer-button {
  margin-left: 8px;
  margin-left: var(--dex-okd-okd-coachmark-standalone-footer-margin-left, 8px)
}

@media (min-width:768px) {
  .dex-coach-con {
    max-width: 375px;
    max-width: var(--dex-okd-coachmark-popover-max-width, 375px)
  }
}

.dex-coach-mask {
  color: rgba(0, 0, 0, .65);
  color: var(--dex-okd-coachmark-mask-color, rgba(0, 0, 0, .65));
  inset: 0;
  pointer-events: none;
  position: fixed
}

.dex-negativebutton-xxs {
  font-size: 12px;
  font-size: var(--dex-okd-negativebutton-xxs-font-size, 12px);
  font-weight: 400;
  font-weight: var(--dex-okd-negativebutton-xxs-font-weight, 400);
  line-height: 16px;
  line-height: var(--dex-okd-negativebutton-xxs-line-height, 16px);
  min-width: 63px;
  min-width: var(--dex-okd-negativebutton-xxs-min-width, 63px);
  padding: 4px 12px;
  padding: var(--dex-okd-negativebutton-xxs-padding-vertical, 4px) var(--dex-okd-negativebutton-xxs-padding-horizontal, 12px)
}

.dex-negativebutton-xxs .dex-negativebutton-loader-circle {
  height: 14px;
  height: var(--dex-okd-negativebutton-xxs-loader-width, 14px);
  width: 14px;
  width: var(--dex-okd-negativebutton-xxs-loader-width, 14px)
}

.dex-negativebutton-xxs .dex-negativebutton-icon {
  font-size: 14px;
  font-size: var(--dex-okd-negativebutton-xxs-icon-size, 14px);
  font-weight: 400;
  font-weight: var(--dex-okd-negativebutton-xxs-font-weight, 400)
}

.dex-negativebutton-xxs .dex-negativebutton-icon-leading {
  margin-right: 6px;
  margin-right: var(--dex-okd-negativebutton-xxs-icon-margin-right, 6px)
}

.dex-negativebutton-xxs .dex-negativebutton-icon-tailing {
  margin-left: 6px;
  margin-left: var(--dex-okd-negativebutton-xxs-icon-margin-right, 6px)
}

.dex-negativebutton-loading-text .dex-negativebutton-loader {
  margin-right: var(--dex-okd-negativebutton-xxs-loader-margin-right, 6px)
}

.dex-negativebutton-xs {
  font-size: 12px;
  font-size: var(--dex-okd-negativebutton-xs-font-size, 12px);
  font-weight: 400;
  font-weight: var(--dex-okd-negativebutton-xs-font-weight, 400);
  line-height: 16px;
  line-height: var(--dex-okd-negativebutton-xs-line-height, 16px);
  min-width: 63px;
  min-width: var(--dex-okd-negativebutton-xs-min-width, 63px);
  padding: 6px 12px;
  padding: var(--dex-okd-negativebutton-xs-padding-vertical, 6px) var(--dex-okd-negativebutton-xs-padding-horizontal, 12px)
}

.dex-negativebutton-xs .dex-negativebutton-loader-circle {
  height: 14px;
  height: var(--dex-okd-negativebutton-xs-loader-width, 14px);
  width: 14px;
  width: var(--dex-okd-negativebutton-xs-loader-width, 14px)
}

.dex-negativebutton-xs .dex-negativebutton-icon {
  font-size: 14px;
  font-size: var(--dex-okd-negativebutton-xs-icon-size, 14px);
  font-weight: 400;
  font-weight: var(--dex-okd-negativebutton-xs-font-weight, 400)
}

.dex-negativebutton-xs .dex-negativebutton-icon-leading {
  margin-right: 6px;
  margin-right: var(--dex-okd-negativebutton-xs-icon-margin-right, 6px)
}

.dex-negativebutton-xs .dex-negativebutton-icon-tailing {
  margin-left: 6px;
  margin-left: var(--dex-okd-negativebutton-xs-icon-margin-right, 6px)
}

.dex-negativebutton-loading-text .dex-negativebutton-loader {
  margin-right: var(--dex-okd-negativebutton-xs-loader-margin-right, 6px)
}

.dex-negativebutton-s {
  font-size: 14px;
  font-size: var(--dex-okd-negativebutton-s-font-size, 14px);
  font-weight: 400;
  font-weight: var(--dex-okd-negativebutton-s-font-weight, 400);
  line-height: 16px;
  line-height: var(--dex-okd-negativebutton-s-line-height, 16px);
  min-width: 72px;
  min-width: var(--dex-okd-negativebutton-s-min-width, 72px);
  padding: 8px 12px;
  padding: var(--dex-okd-negativebutton-s-padding-vertical, 8px) var(--dex-okd-negativebutton-s-padding-horizontal, 12px)
}

.dex-negativebutton-s .dex-negativebutton-loader-circle {
  height: 14px;
  height: var(--dex-okd-negativebutton-s-loader-width, 14px);
  width: 14px;
  width: var(--dex-okd-negativebutton-s-loader-width, 14px)
}

.dex-negativebutton-s .dex-negativebutton-icon {
  font-size: 14px;
  font-size: var(--dex-okd-negativebutton-s-icon-size, 14px);
  font-weight: 400;
  font-weight: var(--dex-okd-negativebutton-s-font-weight, 400)
}

.dex-negativebutton-s .dex-negativebutton-icon-leading {
  margin-right: 6px;
  margin-right: var(--dex-okd-negativebutton-s-icon-margin-right, 6px)
}

.dex-negativebutton-s .dex-negativebutton-icon-tailing {
  margin-left: 6px;
  margin-left: var(--dex-okd-negativebutton-s-icon-margin-right, 6px)
}

.dex-negativebutton-loading-text .dex-negativebutton-loader {
  margin-right: var(--dex-okd-negativebutton-s-loader-margin-right, 6px)
}

.dex-negativebutton-sm {
  font-size: 14px;
  font-size: var(--dex-okd-negativebutton-sm-font-size, 14px);
  font-weight: 400;
  font-weight: var(--dex-okd-negativebutton-sm-font-weight, 400);
  line-height: 16px;
  line-height: var(--dex-okd-negativebutton-sm-line-height, 16px);
  min-width: 81px;
  min-width: var(--dex-okd-negativebutton-sm-min-width, 81px);
  padding: 10px 16px;
  padding: var(--dex-okd-negativebutton-sm-padding-vertical, 10px) var(--dex-okd-negativebutton-sm-padding-horizontal, 16px)
}

.dex-negativebutton-sm .dex-negativebutton-loader-circle {
  height: 16px;
  height: var(--dex-okd-negativebutton-sm-loader-width, 16px);
  width: 16px;
  width: var(--dex-okd-negativebutton-sm-loader-width, 16px)
}

.dex-negativebutton-sm .dex-negativebutton-icon {
  font-size: 16px;
  font-size: var(--dex-okd-negativebutton-sm-icon-size, 16px);
  font-weight: 400;
  font-weight: var(--dex-okd-negativebutton-sm-font-weight, 400)
}

.dex-negativebutton-sm .dex-negativebutton-icon-leading {
  margin-right: 6px;
  margin-right: var(--dex-okd-negativebutton-sm-icon-margin-right, 6px)
}

.dex-negativebutton-sm .dex-negativebutton-icon-tailing {
  margin-left: 6px;
  margin-left: var(--dex-okd-negativebutton-sm-icon-margin-right, 6px)
}

.dex-negativebutton-loading-text .dex-negativebutton-loader {
  margin-right: var(--dex-okd-negativebutton-sm-loader-margin-right, 6px)
}

.dex-negativebutton-md {
  font-size: 14px;
  font-size: var(--dex-okd-negativebutton-md-font-size, 14px);
  font-weight: 400;
  font-weight: var(--dex-okd-negativebutton-md-font-weight, 400);
  line-height: 16px;
  line-height: var(--dex-okd-negativebutton-md-line-height, 16px);
  min-width: 90px;
  min-width: var(--dex-okd-negativebutton-md-min-width, 90px);
  padding: 12px 16px;
  padding: var(--dex-okd-negativebutton-md-padding-vertical, 12px) var(--dex-okd-negativebutton-md-padding-horizontal, 16px)
}

.dex-negativebutton-md .dex-negativebutton-loader-circle {
  height: 16px;
  height: var(--dex-okd-negativebutton-md-loader-width, 16px);
  width: 16px;
  width: var(--dex-okd-negativebutton-md-loader-width, 16px)
}

.dex-negativebutton-md .dex-negativebutton-icon {
  font-size: 16px;
  font-size: var(--dex-okd-negativebutton-md-icon-size, 16px);
  font-weight: 400;
  font-weight: var(--dex-okd-negativebutton-md-font-weight, 400)
}

.dex-negativebutton-md .dex-negativebutton-icon-leading {
  margin-right: 6px;
  margin-right: var(--dex-okd-negativebutton-md-icon-margin-right, 6px)
}

.dex-negativebutton-md .dex-negativebutton-icon-tailing {
  margin-left: 6px;
  margin-left: var(--dex-okd-negativebutton-md-icon-margin-right, 6px)
}

.dex-negativebutton-loading-text .dex-negativebutton-loader {
  margin-right: 6px;
  margin-right: var(--dex-okd-negativebutton-md-loader-margin-right, 6px)
}

.dex-negativebutton-lg {
  font-size: 16px;
  font-size: var(--dex-okd-negativebutton-lg-font-size, 16px);
  font-weight: 500;
  font-weight: var(--dex-okd-negativebutton-lg-font-weight, 500);
  line-height: 20px;
  line-height: var(--dex-okd-negativebutton-lg-line-height, 20px);
  min-width: 108px;
  min-width: var(--dex-okd-negativebutton-lg-min-width, 108px);
  padding: 14px 24px;
  padding: var(--dex-okd-negativebutton-lg-padding-vertical, 14px) var(--dex-okd-negativebutton-lg-padding-horizontal, 24px)
}

.dex-negativebutton-lg .dex-negativebutton-loader-circle {
  height: 20px;
  height: var(--dex-okd-negativebutton-lg-loader-width, 20px);
  width: 20px;
  width: var(--dex-okd-negativebutton-lg-loader-width, 20px)
}

.dex-negativebutton-lg .dex-negativebutton-icon {
  font-size: 20px;
  font-size: var(--dex-okd-negativebutton-lg-icon-size, 20px);
  font-weight: 500;
  font-weight: var(--dex-okd-negativebutton-lg-font-weight, 500)
}

.dex-negativebutton-lg .dex-negativebutton-icon-leading {
  margin-right: 8px;
  margin-right: var(--dex-okd-negativebutton-lg-icon-margin-right, 8px)
}

.dex-negativebutton-lg .dex-negativebutton-icon-tailing {
  margin-left: 8px;
  margin-left: var(--dex-okd-negativebutton-lg-icon-margin-right, 8px)
}

.dex-negativebutton-loading-text .dex-negativebutton-loader {
  margin-right: var(--dex-okd-negativebutton-lg-loader-margin-right, 8px)
}

.dex-negativebutton-xl {
  font-size: 18px;
  font-size: var(--dex-okd-negativebutton-xl-font-size, 18px);
  font-weight: 500;
  font-weight: var(--dex-okd-negativebutton-xl-font-weight, 500);
  line-height: 24px;
  line-height: var(--dex-okd-negativebutton-xl-line-height, 24px);
  min-width: 126px;
  min-width: var(--dex-okd-negativebutton-xl-min-width, 126px);
  padding: 16px 44px;
  padding: var(--dex-okd-negativebutton-xl-padding-vertical, 16px) var(--dex-okd-negativebutton-xl-padding-horizontal, 44px)
}

.dex-negativebutton-xl .dex-negativebutton-loader-circle {
  height: 20px;
  height: var(--dex-okd-negativebutton-xl-loader-width, 20px);
  width: 20px;
  width: var(--dex-okd-negativebutton-xl-loader-width, 20px)
}

.dex-negativebutton-xl .dex-negativebutton-icon {
  font-size: 20px;
  font-size: var(--dex-okd-negativebutton-xl-icon-size, 20px);
  font-weight: 500;
  font-weight: var(--dex-okd-negativebutton-xl-font-weight, 500)
}

.dex-negativebutton-xl .dex-negativebutton-icon-leading {
  margin-right: 8px;
  margin-right: var(--dex-okd-negativebutton-xl-icon-margin-right, 8px)
}

.dex-negativebutton-xl .dex-negativebutton-icon-tailing {
  margin-left: 8px;
  margin-left: var(--dex-okd-negativebutton-xl-icon-margin-right, 8px)
}

.dex-negativebutton-loading-text .dex-negativebutton-loader {
  margin-right: 8px;
  margin-right: var(--dex-okd-negativebutton-xl-loader-margin-right, 8px)
}

.dex-negativebutton {
  align-items: center;
  background-color: var(--dex-okd-color-surface-pnl-loss-default);
  background-color: var(--dex-okd-negativebutton-default-background, var(--dex-okd-color-surface-pnl-loss-default));
  border-radius: 50px;
  border-radius: var(--dex-okd-negativebutton-border-radius, 50px);
  box-sizing: border-box;
  color: var(--dex-okd-color-content-pnl-loss-oncolor);
  color: var(--dex-okd-negativebutton-default-color, var(--dex-okd-color-content-pnl-loss-oncolor));
  cursor: pointer;
  display: inline-flex;
  justify-content: center;
  outline: none;
  position: relative;
  text-decoration: none;
  touch-action: manipulation;
  -webkit-user-select: none;
  -moz-user-select: none;
  -ms-user-select: none;
  user-select: none
}

.dex-negativebutton:focus-visible {
  border-radius: 50px;
  border-radius: var(--dex-okd-negativebutton-border-radius, 50px);
  outline: 2px solid var(--dex-okd-color-border-focus);
  outline-color: var(--dex-okd-color-border-focus);
  outline-offset: 2px;
  outline-style: solid;
  outline-width: 2px
}

.dex-negativebutton.hover,
.dex-negativebutton:not(.dex-negativebutton-disabled):not(.dex-negativebutton-loading):hover {
  background-color: var(--dex-okd-color-surface-pnl-loss-hovered);
  background-color: var(--dex-okd-negativebutton-hover-background, var(--dex-okd-color-surface-pnl-loss-hovered))
}

.dex-negativebutton.active,
.dex-negativebutton:not(.dex-negativebutton-disabled):not(.dex-negativebutton-loading):active {
  background-color: var(--dex-okd-color-surface-pnl-loss-pressed);
  background-color: var(--dex-okd-negativebutton-active-background, var(--dex-okd-color-surface-pnl-loss-pressed))
}

.dex-negativebutton-disabled,
.dex-negativebutton.disabled {
  background-color: var(--dex-okd-color-surface-interactive-disabled);
  background-color: var(--dex-okd-negativebutton-disabled-background, var(--dex-okd-color-surface-interactive-disabled));
  color: var(--dex-okd-color-content-interactive-disabled);
  color: var(--dex-okd-negativebutton-disabled-color, var(--dex-okd-color-content-interactive-disabled));
  cursor: not-allowed
}

.dex-negativebutton-loading,
.dex-negativebutton.loading {
  background-color: var(--dex-okd-color-surface-pnl-loss-pressed);
  background-color: var(--dex-okd-negativebutton-loading-background, var(--dex-okd-color-surface-pnl-loss-pressed));
  color: transparent
}

.dex-negativebutton-loading .dex-negativebutton-loader,
.dex-negativebutton.loading .dex-negativebutton-loader {
  display: flex;
  position: absolute
}

.dex-negativebutton-loading-text {
  background-color: var(--dex-okd-color-surface-pnl-loss-pressed);
  background-color: var(--dex-okd-negativebutton-loading-background, var(--dex-okd-color-surface-pnl-loss-pressed));
  display: flex
}

.dex-negativebutton-block,
.dex-negativebutton.block {
  display: flex;
  width: 100%
}

.dex-negativebutton-ellipsis {
  display: block;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  width: 100%
}

.dex-negativebutton-loader-circle {
  border-color: var(--dex-okd-negativebutton-loader-track-color, var(--dex-okd-color-border-interactive-oncolor));
  border-top-color: var(--dex-okd-negativebutton-loader-mark-color, var(--dex-okd-color-content-static-inverse));
  border-width: 2px;
  border-width: var(--dex-okd-negativebutton-loader-border-width, 2px)
}

.dex-notification-default {
  height: 100vh;
  position: fixed;
  width: 100vw
}

.dex-notification-default,
.dex-notification-wrap {
  box-sizing: border-box;
  display: flex;
  flex-direction: column;
  left: 0;
  line-height: 1;
  margin: 0;
  padding: 0;
  pointer-events: none;
  top: 0
}

.dex-notification-wrap {
  height: 100%;
  position: absolute;
  width: 100%
}

.dex-notification * {
  box-sizing: border-box
}

.dex-notification-container.container-remove {
  animation-duration: .55s;
  animation-name: NotificationOutTop
}

.dex-notification-box {
  animation-duration: .3s;
  background: var(--dex-okd-notification-box-background);
  border: thin solid var(--dex-okd-notification-box-border-color);
  border-radius: var(--dex-okd-notification-box-border-radius);
  box-shadow: var(--dex-okd-notification-box-shadow);
  display: inline-flex;
  line-height: 1;
  margin: calc(var(--dex-okd-notification-box-each-margin)/2) 0;
  max-width: var(--dex-okd-notification-box-max-width);
  min-width: var(--dex-okd-notification-box-min-width);
  overflow: hidden;
  padding: var(--dex-okd-notification-box-padding);
  pointer-events: all;
  position: relative
}

.dex-notification-box.auto-width {
  min-width: var(--dex-okd-notification-box-auto-width-min-width)
}

.dex-notification-box .dex-notification-icon-circle-container {
  display: inline-block;
  height: 20px;
  margin-right: var(--dex-okd-notification-box-icon-text-margin);
  position: relative;
  vertical-align: top;
  width: 20px
}

.dex-notification-box .dex-notification-icon-new {
  font-size: 20px;
  height: 100%;
  width: 100%
}

.dex-notification-box .dex-notification-content {
  display: inline-flex;
  flex: 1 1;
  flex-direction: column;
  flex-wrap: wrap;
  word-break: break-word
}

.dex-notification-box .dex-notification-inline {
  flex-direction: unset
}

.dex-notification-box .dex-notification-inline .dex-notification-action {
  margin-top: 0;
  width: auto
}

.dex-notification-box .dex-notification-title-box {
  display: inline-flex;
  flex: 1 1;
  flex-direction: column;
  flex-wrap: wrap
}

.dex-notification-box .dex-notification-title {
  color: var(--dex-okd-notification-title-color);
  flex: 1 1;
  flex-shrink: 0;
  font-size: var(--dex-okd-notification-title-font-size);
  font-weight: 500;
  line-height: var(--dex-okd-notification-title-line-height);
  text-align: left
}

.dex-notification-box .dex-notification-desc,
.dex-notification-box .dex-notification-text {
  color: var(--dex-okd-notification-text-color);
  font-size: var(--dex-okd-notification-text-font-size);
  line-height: var(--dex-okd-notification-text-line-height)
}

.dex-notification-box .dex-notification-desc {
  margin-top: 4px;
  text-align: left;
  width: 100%
}

.dex-notification-box .dex-notification-action {
  display: inline-block;
  margin-top: 12px;
  pointer-events: auto;
  text-align: left;
  width: 100%
}

.dex-notification-box .dex-notification-action .action-undo {
  color: var(--dex-okd-notification-action-confirm-btn-color)
}

.dex-notification-box .dex-notification-action .action-dismiss,
.dex-notification-box .dex-notification-action .action-undo {
  cursor: pointer;
  font-size: var(--dex-okd-notification-action-font-size);
  font-weight: 500;
  line-height: var(--dex-okd-notification-action-line-height)
}

.dex-notification-box .dex-notification-action .action-dismiss {
  color: var(--dex-okd-notification-action-cancel-btn-color)
}

.dex-notification-box .dex-notification-action .action-undo+.action-dismiss {
  margin-left: 16px
}

.dex-notification-box .dex-notification-close {
  -webkit-tap-highlight-color: transparent;
  color: var(--dex-okd-notification-box-close-icon-color);
  cursor: pointer;
  font-size: 22px;
  height: 22px;
  margin-left: 15px;
  pointer-events: auto;
  position: relative;
  top: -2px;
  width: 22px
}

.dex-notification-box.success .dex-notification-icon-new {
  color: var(--dex-okd-notification-success-icon-color)
}

.dex-notification-box.info .dex-notification-icon-new {
  color: var(--dex-okd-notification-info-icon-color)
}

.dex-notification-box.warn .dex-notification-icon-new {
  color: var(--dex-okd-notification-warn-icon-color)
}

.dex-notification-box.error .dex-notification-icon-new {
  color: var(--dex-okd-notification-error-icon-color)
}

.dex-notification-box.pending .dex-notification-icon-new {
  color: var(--dex-okd-notification-pending-icon-color)
}

.dex-notification.dex-notification-bottom,
.dex-notification.dex-notification-bottom-left,
.dex-notification.dex-notification-bottom-right {
  justify-content: flex-end
}

.dex-notification.dex-notification-bottom .container-remove,
.dex-notification.dex-notification-bottom-left .container-remove,
.dex-notification.dex-notification-bottom-right .container-remove {
  animation-name: NotificationOutBottom
}

.dex-notification.dex-notification-bottom-right .dex-notification-container,
.dex-notification.dex-notification-top-right .dex-notification-container {
  text-align: right
}

.dex-notification.dex-notification-bottom .dex-notification-container,
.dex-notification.dex-notification-top .dex-notification-container {
  text-align: center
}

.dex-notification.dex-notification-bottom-left .dex-notification-box,
.dex-notification.dex-notification-top-left .dex-notification-box {
  animation-name: NotificationInLeft
}

.dex-notification.dex-notification-bottom-right .dex-notification-box,
.dex-notification.dex-notification-top-right .dex-notification-box {
  animation-name: NotificationInRight
}

.dex-notification.dex-notification-top .dex-notification-box {
  animation-name: NotificationInTop
}

.dex-notification.dex-notification-bottom .dex-notification-box {
  animation-name: NotificationInBottom
}

@media (max-width:767px) {

  .dex-notification.dex-notification-bottom-left .dex-notification-container,
  .dex-notification.dex-notification-bottom-right .dex-notification-container,
  .dex-notification.dex-notification-top-left .dex-notification-container,
  .dex-notification.dex-notification-top-right .dex-notification-container {
    text-align: center
  }

  .dex-notification-box {
    min-width: unset;
    width: 100%
  }

  .dex-notification-box.auto-width {
    width: auto
  }
}

.dex-notification-box .dex-notification-icon-pending-poster,
.dex-notification-box .dex-notification-icon-success-poster {
  color: var(--dex-okd-notification-success-icon-color);
  color: var(--dex-okd-color-surface-success-default, var(--dex-okd-notification-success-icon-color));
  font-size: 20px;
  left: 50%;
  position: absolute;
  top: 50%;
  transform: translate(-50%, -50%)
}

.dex-notification-box .dex-notification-icon-error-poster {
  color: var(--dex-okd-notification-error-icon-color);
  color: var(--dex-okd-color-surface-danger-default, var(--dex-okd-notification-error-icon-color));
  font-size: 20px;
  left: 50%;
  position: absolute;
  top: 50%;
  transform: translate(-50%, -50%)
}

@keyframes NotificationInLeft {
  0% {
    opacity: 0;
    transform: translate3d(-30px, 0, 0)
  }

  to {
    opacity: 1;
    transform: translateZ(0)
  }
}

@keyframes NotificationInRight {
  0% {
    opacity: 0;
    transform: translate3d(30px, 0, 0)
  }

  to {
    opacity: 1;
    transform: translateZ(0)
  }
}

@keyframes NotificationInTop {
  0% {
    opacity: 0;
    transform: translate3d(0, -30px, 0)
  }

  to {
    opacity: 1;
    transform: translateZ(0)
  }
}

@keyframes NotificationInBottom {
  0% {
    opacity: 0;
    transform: translate3d(0, 30px, 0)
  }

  to {
    opacity: 1;
    transform: translateZ(0)
  }
}

@keyframes NotificationOutBottom {
  0% {
    max-height: 150px;
    opacity: 1;
    transform: translateZ(0)
  }

  to {
    max-height: 0;
    opacity: 0;
    transform: translate3d(0, 30px, 0)
  }
}

@keyframes NotificationOutTop {
  0% {
    max-height: 150px;
    opacity: 1;
    transform: translateZ(0)
  }

  to {
    max-height: 0;
    opacity: 0;
    transform: translate3d(0, -30px, 0)
  }
}

.dex-popover .dex-popup-layer-content {
  padding: 0
}

.dex-popover .dex-popup-layer-arrow-inner {
  background-color: var(--dex-okd-popover-layer-background);
  border-color: var(--dex-okd-popover-layer-border-color)
}

.dex-popover-arrow-special .dex-popup-layer-arrow[change-color] .dex-popup-layer-arrow-inner {
  background-color: var(--dex-okd-popover-title-background)
}

.dex-popover-arrow-special[data-popper-placement*=bottom] .dex-popup-layer-arrow-inner {
  background-color: var(--dex-okd-popover-title-background) !important
}

.dex-popover-content {
  background-color: var(--dex-okd-popover-layer-background);
  border: 1px solid var(--dex-okd-popover-layer-border-color);
  border-radius: 4px;
  box-shadow: var(--dex-okd-popover-common-layer-shadow);
  max-width: var(--dex-okd-popover-common-layer-width)
}

.dex-popover-content-title {
  background-color: var(--dex-okd-popover-title-background);
  border-top-left-radius: 4px;
  border-top-right-radius: 4px;
  color: var(--dex-okd-popover-title-color);
  font-weight: 500;
  line-height: 20px;
  padding: 8px 12px;
  position: relative
}

.dex-popover-content-desc {
  background-color: var(--dex-okd-popover-desc-background);
  border-bottom-left-radius: 4px;
  border-bottom-right-radius: 4px;
  color: var(--dex-okd-popover-desc-color);
  overflow: hidden;
  padding: var(--dex-okd-popover-common-padding)
}

.dex-popover-content-desc .dex-popover-content-desc-link {
  color: var(--dex-okd-popover-link-color);
  cursor: pointer;
  font-weight: 500;
  padding-left: 4px;
  text-decoration: underline
}

.dex-popover-content-desc-button {
  color: var(--dex-okd-popover-action-color);
  cursor: pointer;
  float: right;
  font-weight: 500;
  margin-top: 20px;
  overflow: hidden;
  padding: 0 10px;
  text-align: right
}

.dex-popover-content-desc-radius {
  border-top-left-radius: 4px;
  border-top-right-radius: 4px
}

.dex-popover-md .dex-popover-content {
  font-size: var(--dex-okd-popover-md-font-size);
  line-height: var(--dex-okd-popover-md-line-height)
}

.dex-popover-md .dex-popover-content-title {
  font-size: var(--dex-okd-popover-md-title-font-size)
}

.dex-popover-sm .dex-popover-content {
  font-size: var(--dex-okd-popover-sm-font-size);
  line-height: var(--dex-okd-popover-sm-line-height)
}

.dex-popover-sm .dex-popover-content-title {
  font-size: var(--dex-okd-popover-sm-title-font-size)
}

.dex-alert {
  border-radius: var(--dex-okd-alert-box-border-radius);
  box-sizing: border-box;
  display: inline-flex;
  padding: var(--dex-okd-alert-box-padding-vertical) var(--dex-okd-alert-box-padding-horizontal);
  position: relative;
  width: 100%
}

.dex-alert.closable {
  padding-right: 44px
}

.dex-alert * {
  box-sizing: border-box
}

.dex-alert .dex-alert-icon {
  align-items: center;
  display: flex;
  font-size: 20px;
  font-size: var(--dex-okd-alert-icon-tip-size, 20px);
  height: 20px;
  height: var(--dex-okd-alert-icon-tip-size, 20px);
  justify-content: center;
  width: 20px;
  width: var(--dex-okd-alert-icon-tip-size, 20px)
}

.dex-alert-msg-box {
  display: flex;
  flex-direction: column;
  flex-grow: 1
}

.dex-alert-icon+.dex-alert-msg-box {
  margin-left: 15px;
  margin-left: var(--dex-okd-alert-box-margin-left, 15px)
}

.dex-alert-title {
  font-size: var(--dex-okd-alert-title-font-size);
  font-weight: 500;
  line-height: var(--dex-okd-alert-title-line-height)
}

.dex-alert-desc {
  font-size: var(--dex-okd-alert-text-font-size);
  font-weight: 400;
  line-height: var(--dex-okd-alert-text-line-height)
}

.dex-alert-title+.dex-alert-desc {
  margin-top: 4px;
  margin-top: var(--dex-okd-alert-desc-margin-top, 4px)
}

.dex-alert-link {
  font-weight: 500;
  text-decoration: none
}

.dex-alert-desc-list {
  -webkit-padding-start: 17px;
  -moz-padding-start: 17px;
  -webkit-margin-before: 4px;
  -webkit-margin-after: 0;
  margin-block-end: 0;
  margin-block-start: 4px;
  padding-inline-start: 17px
}

.dex-alert-action-box {
  margin-bottom: 8px;
  margin-bottom: var(--dex-okd-alert-action-box-margin-bottom, 8px);
  margin-top: 21px;
  margin-top: var(--dex-okd-alert-action-box-margin-top, 21px)
}

.dex-alert-action {
  background: transparent;
  border: 0;
  cursor: pointer;
  font-family: inherit;
  font-size: var(--dex-okd-alert-action-font-size);
  font-weight: 500;
  line-height: var(--dex-okd-alert-action-line-height);
  outline: 0;
  padding: 0
}

.dex-alert-action:focus-visible {
  border-radius: 4px;
  outline: 2px solid var(--dex-okd-color-border-focus);
  outline-color: var(--dex-okd-color-border-focus);
  outline-offset: 2px;
  outline-style: solid;
  outline-width: 2px
}

.dex-alert-action+.dex-alert-action {
  margin-left: 32px;
  margin-left: var(--dex-okd-alert-action-margin-left, 32px)
}

.dex-alert .dex-alert-close {
  cursor: pointer;
  font-size: 20px;
  font-size: var(--dex-okd-alert-icon-close-size, 20px);
  line-height: 1;
  position: absolute;
  right: 12px
}

.dex-alert.normal-alert {
  background: var(--dex-okd-alert-normal-background)
}

.dex-alert.normal-alert .dex-alert-icon {
  color: var(--dex-okd-alert-normal-icon-color)
}

.dex-alert.normal-alert .dex-alert-title {
  color: var(--dex-okd-alert-normal-title-color)
}

.dex-alert.normal-alert .dex-alert-desc {
  color: var(--dex-okd-alert-normal-desc-color)
}

.dex-alert.normal-alert .dex-alert-close {
  color: var(--dex-okd-color-gray-300);
  color: var(--dex-okd-alert-normal-close-color, var(--dex-okd-color-gray-300))
}

.dex-alert.normal-alert .dex-alert-link {
  border-bottom: 1px solid var(--dex-okd-alert-normal-link-color);
  color: var(--dex-okd-alert-normal-link-color);
  text-decoration: none
}

.dex-alert.normal-alert .dex-alert-action {
  color: var(--dex-okd-alert-normal-action-color)
}

.dex-alert.success-alert {
  background: var(--dex-okd-alert-success-background)
}

.dex-alert.success-alert .dex-alert-icon {
  color: var(--dex-okd-alert-success-icon-color)
}

.dex-alert.success-alert .dex-alert-title {
  color: var(--dex-okd-alert-success-title-color)
}

.dex-alert.success-alert .dex-alert-desc {
  color: var(--dex-okd-alert-success-desc-color)
}

.dex-alert.success-alert .dex-alert-close {
  color: var(--dex-okd-color-gray-300);
  color: var(--dex-okd-alert-success-close-color, var(--dex-okd-color-gray-300))
}

.dex-alert.success-alert .dex-alert-link {
  border-bottom: 1px solid var(--dex-okd-alert-success-link-color);
  color: var(--dex-okd-alert-success-link-color);
  text-decoration: none
}

.dex-alert.success-alert .dex-alert-action {
  color: var(--dex-okd-alert-success-action-color)
}

.dex-alert.info-alert {
  background: var(--dex-okd-alert-info-background)
}

.dex-alert.info-alert .dex-alert-icon {
  color: var(--dex-okd-alert-info-icon-color)
}

.dex-alert.info-alert .dex-alert-title {
  color: var(--dex-okd-alert-info-title-color)
}

.dex-alert.info-alert .dex-alert-desc {
  color: var(--dex-okd-alert-info-desc-color)
}

.dex-alert.info-alert .dex-alert-close {
  color: var(--dex-okd-color-gray-300);
  color: var(--dex-okd-alert-info-close-color, var(--dex-okd-color-gray-300))
}

.dex-alert.info-alert .dex-alert-link {
  border-bottom: 1px solid var(--dex-okd-alert-info-link-color);
  color: var(--dex-okd-alert-info-link-color);
  text-decoration: none
}

.dex-alert.info-alert .dex-alert-action {
  color: var(--dex-okd-alert-info-action-color)
}

.dex-alert.warn-alert {
  background: var(--dex-okd-alert-warn-background)
}

.dex-alert.warn-alert .dex-alert-icon {
  color: var(--dex-okd-alert-warn-icon-color)
}

.dex-alert.warn-alert .dex-alert-title {
  color: var(--dex-okd-alert-warn-title-color)
}

.dex-alert.warn-alert .dex-alert-desc {
  color: var(--dex-okd-alert-warn-desc-color)
}

.dex-alert.warn-alert .dex-alert-close {
  color: var(--dex-okd-color-gray-300);
  color: var(--dex-okd-alert-warn-close-color, var(--dex-okd-color-gray-300))
}

.dex-alert.warn-alert .dex-alert-link {
  border-bottom: 1px solid var(--dex-okd-alert-warn-link-color);
  color: var(--dex-okd-alert-warn-link-color);
  text-decoration: none
}

.dex-alert.warn-alert .dex-alert-action {
  color: var(--dex-okd-alert-warn-action-color)
}

.dex-alert.error-alert {
  background: var(--dex-okd-alert-error-background)
}

.dex-alert.error-alert .dex-alert-icon {
  color: var(--dex-okd-alert-error-icon-color)
}

.dex-alert.error-alert .dex-alert-title {
  color: var(--dex-okd-alert-error-title-color)
}

.dex-alert.error-alert .dex-alert-desc {
  color: var(--dex-okd-alert-error-desc-color)
}

.dex-alert.error-alert .dex-alert-close {
  color: var(--dex-okd-color-gray-300);
  color: var(--dex-okd-alert-error-close-color, var(--dex-okd-color-gray-300))
}

.dex-alert.error-alert .dex-alert-link {
  border-bottom: 1px solid var(--dex-okd-alert-error-link-color);
  color: var(--dex-okd-alert-error-link-color);
  text-decoration: none
}

.dex-alert.error-alert .dex-alert-action {
  color: var(--dex-okd-alert-error-action-color)
}

.dex-accordion {
  border-bottom: 1px solid #ebebeb;
  border-bottom: 1px solid var(--dex-okd-accordion-main-border-color, #ebebeb);
  display: flex;
  flex-direction: column
}

.dex-accordion-header {
  align-items: center;
  cursor: pointer;
  display: flex;
  justify-content: space-between;
  padding: 32px 0;
  padding: var(--dex-okd-accordion-header-padding-vertical, 32px) var(--dex-okd-accordion-header-padding-horizontal, 0)
}

.dex-accordion-header-title {
  color: #000;
  color: var(--dex-okd-accordion-header-title-color, #000);
  font-size: 18px;
  font-size: var(--dex-okd-accordion-header-title-font-size, 18px);
  font-weight: 500;
  font-weight: var(--dex-okd-accordion-header-title-font-weight, 500);
  line-height: 24px;
  line-height: var(--dex-okd-accordion-header-title-line-height, 24px)
}

.dex-accordion-header .dex-accordion-header-icon {
  color: #929292;
  color: var(--dex-okd-accordion-header-icon-color, #929292);
  font-size: 20px;
  font-size: var(--dex-okd-accordion-header-icon-size, 20px);
  transition: all .2s cubic-bezier(.34, .69, .1, 1)
}

.dex-accordion-header-icon-expanded {
  transform: rotate(180deg)
}

.dex-accordion-content {
  color: #929292;
  color: var(--dex-okd-accordion-content-color, #929292);
  display: none;
  font-size: 14px;
  font-size: var(--dex-okd-accordion-content-font-size, 14px);
  font-weight: 400;
  font-weight: var(--dex-okd-accordion-content-font-weight, 400);
  line-height: 1.58;
  line-height: var(--dex-okd-accordion-content-line-height, 1.58);
  overflow: hidden
}

.dex-accordion-content-transition-out {
  margin-bottom: 0;
  max-height: 0;
  opacity: 0;
  transform: translateY(-30px);
  transition: all .2s;
  will-change: transform, opacity, max-height
}

.dex-accordion-content-transition-in {
  max-height: -webkit-max-content;
  max-height: -moz-max-content;
  max-height: max-content;
  opacity: 1;
  transform: translateY(0)
}

.dex-accordion-content-expanded {
  display: block;
  margin-bottom: 32px;
  margin-bottom: var(--dex-okd-accordion-header-padding-vertical, 32px)
}

@media (max-width:767px) {
  .dex-accordion-header-title {
    font-size: 14px;
    font-size: var(--dex-okd-accordion-header-title-sm-font-size, 14px);
    font-weight: 500;
    font-weight: var(--dex-okd-accordion-header-title-sm-font-weight, 500);
    line-height: 16px;
    line-height: var(--dex-okd-accordion-header-title-sm-line-height, 16px)
  }

  .dex-accordion-header .dex-accordion-header-icon {
    font-size: 16px;
    font-size: var(--dex-okd-accordion-header-icon-sm-size, 16px)
  }

  .dex-accordion-content {
    font-size: 12px;
    font-size: var(--dex-okd-accordion-content-sm-font-size, 12px);
    font-weight: 400;
    font-weight: var(--dex-okd-accordion-content-sm-font-weight, 400);
    line-height: 1.58;
    line-height: var(--dex-okd-accordion-content-sm-line-height, 1.58)
  }
}

.dex-overflow {
  overflow: hidden
}

.dex-overflow-hidden {
  height: 0;
  opacity: 0;
  overflow-y: hidden;
  pointer-events: none;
  position: absolute
}

.dex-form-line>.dex-form-item-control>.dex-form-item-control-input>.dex-form-item-control-input-content {
  display: flex
}

.dex-form-line>.dex-form-item-control>.dex-form-item-control-input>.dex-form-item-control-input-content>.dex-form-item {
  margin-right: 16px
}

.dex-form-line>.dex-form-item-control>.dex-form-item-control-input>.dex-form-item-control-input-content>.dex-form-item:last-child {
  margin-right: 0
}

.dex-form-line.dex-form-line-column>.dex-form-item-control>.dex-form-item-control-input>.dex-form-item-control-input-content {
  flex-direction: column
}

.dex-form-line.dex-form-line-column>.dex-form-item-control>.dex-form-item-control-input>.dex-form-item-control-input-content>.dex-form-item {
  margin-right: 0
}

.dex-form-line.dex-form-line-hidden {
  display: none !important
}

.dex-a11y-selection {
  display: none
}

.dex-dialog {
  --inner-okd-dialog-close-btn-padding: var(--dex-okd-dialog-window-action-fixed-padding, 16px);
  height: 100%;
  pointer-events: none;
  width: 100%
}

.dex-dialog-float {
  left: 0;
  position: fixed;
  top: 0
}

.dex-dialog * {
  -webkit-tap-highlight-color: transparent;
  box-sizing: border-box
}

.dex-dialog-window-float {
  left: 50%;
  position: absolute;
  top: 50%;
  transform: translate(-50%, -50%)
}

@supports (bottom:constant(safe-area-inset-bottom)) or (bottom:env(safe-area-inset-bottom)) {
  .dex-dialog-window-safe {
    padding-bottom: env(safe-area-inset-bottom)
  }
}

.dex-dialog-window {
  border-radius: var(--dex-okd-dialog-window-border-radius);
  box-shadow: var(--dex-okd-dialog-window-box-shadow);
  display: flex;
  flex-direction: column;
  margin-left: auto;
  margin-right: auto;
  max-height: calc(100% - 48px);
  outline: none;
  pointer-events: auto;
  width: calc(100% - 32px)
}

.dex-dialog-window-border {
  border: 1px solid transparent;
  border: 1px solid var(--dex-okd-dialog-window-border-color, transparent)
}

.dex-dialog-title-container {
  align-items: center;
  display: flex;
  flex-direction: row;
  flex-shrink: 0;
  justify-content: space-between
}

.dex-dialog-title-container .title-center {
  text-align: center
}

.dex-dialog-title-container .title-center .modal-title {
  justify-content: center
}

.dex-dialog .title-center .dex-dialog-top-l {
  margin-right: 32px;
  margin-right: var(--dex-okd-dialog-title-icon-close-margin-left, 32px)
}

.dex-dialog-title-block {
  display: flex;
  flex-direction: column;
  flex-grow: 1
}

.dex-dialog-title-block .modal-title {
  font-size: 16px;
  font-size: var(--dex-okd-dialog-title-font-size, 16px);
  font-weight: 700;
  font-weight: var(--dex-okd-dialog-title-font-weight, 700);
  line-height: var(--dex-okd-dialog-title-line-height);
  padding-top: 2px
}

.dex-dialog-title-block .modal-sub-title {
  font-size: var(--dex-okd-dialog-sub-title-font-size);
  font-weight: 400;
  line-height: var(--dex-okd-dialog-sub-title-line-height);
  margin-top: 2px
}

.dex-dialog-b-btn,
.dex-dialog-c-btn {
  cursor: pointer;
  display: inline-block;
  height: var(--dex-okd-dialog-window-close-icon-size);
  justify-content: center;
  line-height: 1;
  position: relative;
  vertical-align: middle;
  width: var(--dex-okd-dialog-window-close-icon-size);
  z-index: 1
}

.dex-dialog-b-btn.icon,
.dex-dialog-c-btn.icon {
  font-size: var(--dex-okd-dialog-window-close-icon-size)
}

.dex-dialog-b-btn:after,
.dex-dialog-c-btn:after {
  content: " ";
  display: block;
  height: calc(var(--dex-okd-dialog-window-close-icon-size)*1.5);
  left: -25%;
  position: absolute;
  top: -25%;
  width: calc(var(--dex-okd-dialog-window-close-icon-size)*1.5)
}

.dex-dialog-b-btn {
  height: var(--dex-okd-dialog-window-back-icon-size);
  margin-right: 16px;
  margin-right: var(--dex-okd-dialog-title-icon-back-margin-right, 16px);
  width: var(--dex-okd-dialog-window-back-icon-size)
}

.dex-dialog-b-btn.icon {
  font-size: var(--dex-okd-dialog-window-back-icon-size)
}

.dex-dialog-c-btn {
  margin-left: 32px;
  margin-left: var(--dex-okd-dialog-title-icon-close-margin-left, 32px)
}

.dex-dialog-top-action-fixed {
  padding: var(--inner-okd-dialog-close-btn-padding);
  position: absolute;
  top: 0
}

.dex-dialog-top-action-fixed .dex-dialog-b-btn,
.dex-dialog-top-action-fixed .dex-dialog-c-btn {
  margin: 0
}

.dex-dialog-top-l {
  align-self: flex-start;
  left: 0
}

.dex-dialog-top-r {
  align-self: flex-start;
  right: 0
}

.dex-dialog-top-hidden-for-t-center {
  pointer-events: none;
  visibility: hidden
}

.dex-dialog-top-action-hidden {
  display: none;
  pointer-events: none
}

.dex-dialog-scroll-box {
  flex-grow: 1;
  overflow-y: auto
}

.dex-dialog-scroll-box.scroll-disable {
  overflow-y: unset
}

.dex-dialog-container,
.dex-dialog-customer-box {
  height: 100%
}

.dex-dialog-container.no-padding,
.dex-dialog-customer-box.no-padding {
  padding: 0
}

.dex-dialog .dex-dialog-footer-line {
  border-top: thin solid var(--dex-okd-dialog-window-split-line-border-color)
}

.dex-dialog .dex-dialog-header-line {
  border-bottom: thin solid var(--dex-okd-dialog-window-split-line-border-color)
}

.dex-dialog-btn-box {
  display: flex
}

.dex-dialog-btn-box.layout-right {
  justify-content: flex-end
}

.dex-dialog-btn-box.layout-left {
  justify-content: flex-start
}

.dex-dialog-btn-box.layout-full .dialog-btn {
  flex: 1 1
}

.dex-dialog .dex-dialog-window {
  background: var(--dex-okd-dialog-window-background);
  color: var(--dex-okd-dialog-window-default-text-color)
}

.dex-dialog .dex-dialog-window.container-mode {
  background: transparent;
  box-shadow: none
}

.dex-dialog .dex-dialog-title-container .modal-title {
  align-items: center;
  color: var(--dex-okd-dialog-title-color);
  display: flex
}

.dex-dialog .dex-dialog-title-container .modal-sub-title {
  color: var(--dex-okd-dialog-sub-title-color)
}

.dex-dialog .dex-dialog-c-btn {
  color: var(--dex-okd-color-gray-400);
  color: var(--dex-okd-dialog-title-icon-close-color, var(--dex-okd-color-gray-400))
}

.dex-dialog .dex-dialog-c-btn:hover {
  background-color: var(--dex-okd-color-background-hover);
  background-color: var(--dex-okd-dialog-title-icon-hover-background-color, var(--dex-okd-color-background-hover));
  border-radius: 4px;
  border-radius: var(--dex-okd-dialog-title-icon-hover-border-radius, 4px);
  color: var(--dex-okd-color-gray-900);
  color: var(--dex-okd-dialog-title-icon-close-hover-color, var(--dex-okd-color-gray-900))
}

.dex-dialog .dex-dialog-b-btn {
  color: var(--dex-okd-color-gray-900);
  color: var(--dex-okd-dialog-title-icon-back-color, var(--dex-okd-color-gray-900))
}

.dex-dialog .dex-dialog-b-btn:hover {
  background-color: var(--dex-okd-color-background-hover);
  background-color: var(--dex-okd-dialog-title-icon-hover-background-color, var(--dex-okd-color-background-hover));
  border-radius: 4px;
  border-radius: var(--dex-okd-dialog-title-icon-hover-border-radius, 4px)
}

.dex-dialog-mask {
  background: var(--dex-okd-dialog-window-mask-color)
}

.dex-dialog-scroll-bar-end::-webkit-scrollbar,
.dex-dialog-scroll-bar-start::-webkit-scrollbar {
  background-color: initial
}

.dex-dialog-scroll-bar-start::-webkit-scrollbar-button:vertical:start:increment {
  background-color: initial;
  display: block;
  height: var(--dex-okd-dialog-window-border-radius)
}

.dex-dialog-scroll-bar-end::-webkit-scrollbar-button:vertical:end:increment {
  background-color: initial;
  display: block;
  height: var(--dex-okd-dialog-window-border-radius)
}

@media (min-width:768px) {
  .dex-dialog-window {
    min-width: var(--dex-okd-dialog-window-min-width);
    width: auto
  }

  .dex-dialog-title-container {
    padding: var(--dex-okd-dialog-title-box-md-padding-vertical) var(--dex-okd-dialog-container-md-padding-horizontal)
  }

  .dex-dialog-container {
    padding: var(--dex-okd-dialog-container-md-padding-vertical) var(--dex-okd-dialog-container-md-padding-horizontal)
  }

  .dex-dialog-customer-box {
    padding: 0 var(--dex-okd-dialog-container-md-padding-horizontal)
  }

  .dex-dialog-footer-box {
    padding: var(--dex-okd-dialog-footer-box-md-padding-vertical) var(--dex-okd-dialog-container-md-padding-horizontal)
  }

  .dex-dialog-btn-box .dialog-btn.double-btn {
    width: auto
  }

  .dex-dialog-btn-box.layout-full {
    flex-direction: row
  }

  .dex-dialog-btn-box .dialog-btn+.dialog-btn {
    margin-left: 16px;
    margin-left: var(--dex-okd-dialog-footer-btn-md-margin-left, 16px)
  }
}

@media (max-width:767px) {
  .dex-dialog-title-container {
    padding: var(--dex-okd-dialog-title-box-sm-padding-vertical) var(--dex-okd-dialog-container-sm-padding-horizontal)
  }

  .dex-dialog-container {
    padding: var(--dex-okd-dialog-container-sm-padding-vertical) var(--dex-okd-dialog-container-sm-padding-horizontal)
  }

  .dex-dialog-customer-box {
    padding: 0 var(--dex-okd-dialog-container-sm-padding-horizontal)
  }

  .dex-dialog-footer-box {
    padding: var(--dex-okd-dialog-footer-box-sm-padding-top, 12px) var(--dex-okd-dialog-container-sm-padding-horizontal) var(--dex-okd-dialog-footer-box-sm-padding-bottom, 20px)
  }

  .dex-dialog-btn-box .dialog-btn {
    width: 100%
  }

  .dex-dialog-btn-box .dialog-btn+.dialog-btn {
    margin-left: 12px;
    margin-left: var(--dex-okd-dialog-footer-btn-sm-margin-left, 12px)
  }

  .dex-dialog-btn-box.layout-full {
    flex-direction: column-reverse
  }

  .dex-dialog-btn-box.layout-full .dialog-btn+.dialog-btn {
    margin-left: 0
  }

  .dex-dialog-btn-box.layout-full .double-btn:first-child {
    margin-top: 8px;
    margin-top: var(--dex-okd-dialog-footer-btn-full-sm-margin-top, 8px)
  }

  .dex-dialog-window {
    border-radius: 8px;
    border-radius: var(--dex-okd-dialog-window-sm-border-radius, 8px)
  }

  .dex-dialog-window.full-page {
    height: auto !important;
    min-height: calc(100% - 48px) !important
  }

  .dex-dialog-window.full-page-with-show-header {
    height: auto !important
  }

  .dex-dialog-window.bottom-align {
    border-radius: var(--dex-okd-dialog-window-border-radius) var(--dex-okd-dialog-window-border-radius) 0 0;
    bottom: 0;
    top: auto;
    transform: translate(-50%)
  }

  .dex-dialog-window.no-margin {
    min-width: unset;
    width: 100%
  }
}

.dex-dialog-mobile-mode .dex-dialog-title-container {
  padding: var(--dex-okd-dialog-title-box-sm-padding-vertical) var(--dex-okd-dialog-container-sm-padding-horizontal)
}

.dex-dialog-mobile-mode .dex-dialog-container {
  padding: var(--dex-okd-dialog-container-sm-padding-vertical) var(--dex-okd-dialog-container-sm-padding-horizontal)
}

.dex-dialog-mobile-mode .dex-dialog-customer-box {
  padding: 0 var(--dex-okd-dialog-container-sm-padding-horizontal)
}

.dex-dialog-mobile-mode .dex-dialog-footer-box {
  padding: var(--dex-okd-dialog-footer-box-sm-padding-top, 12px) var(--dex-okd-dialog-container-sm-padding-horizontal) var(--dex-okd-dialog-footer-box-sm-padding-bottom, 20px)
}

.dex-dialog-mobile-mode .dex-dialog-btn-box .dialog-btn {
  width: 100%
}

.dex-dialog-mobile-mode .dex-dialog-btn-box .dialog-btn+.dialog-btn {
  margin-left: 12px;
  margin-left: var(--dex-okd-dialog-footer-btn-sm-margin-left, 12px)
}

.dex-dialog-mobile-mode .dex-dialog-btn-box.layout-full {
  flex-direction: column-reverse
}

.dex-dialog-mobile-mode .dex-dialog-btn-box.layout-full .dialog-btn+.dialog-btn {
  margin-left: 0
}

.dex-dialog-mobile-mode .dex-dialog-btn-box.layout-full .double-btn:first-child {
  margin-top: 8px;
  margin-top: var(--dex-okd-dialog-footer-btn-full-sm-margin-top, 8px)
}

.dex-dialog-mobile-mode .dex-dialog-window {
  border-radius: 8px;
  border-radius: var(--dex-okd-dialog-window-sm-border-radius, 8px)
}

.dex-dialog-mobile-mode .dex-dialog-window.full-page {
  height: auto !important;
  min-height: calc(100% - 48px) !important
}

.dex-dialog-mobile-mode .dex-dialog-window.full-page-with-show-header {
  height: auto !important
}

.dex-dialog-mobile-mode .dex-dialog-window.bottom-align {
  border-radius: var(--dex-okd-dialog-window-border-radius) var(--dex-okd-dialog-window-border-radius) 0 0;
  bottom: 0;
  top: auto;
  transform: translate(-50%)
}

.dex-dialog-mobile-mode .dex-dialog-window.no-margin {
  min-width: unset;
  width: 100%
}

.dex-dialog-mobile-mode .dex-dialog-container.no-padding,
.dex-dialog-mobile-mode .dex-dialog-customer-box.no-padding {
  padding: 0
}

.dex-dialog-mobile-mode .dex-dialog-window {
  min-width: unset;
  width: calc(100% - 32px)
}

.dex-dialog.dex-action-dialog .dex-dialog-window.no-radius {
  border-radius: 0
}

.dex-dialog-group {
  overflow: hidden
}

.dex-dialog-group-window {
  display: flex;
  flex-direction: column
}

.dex-dialog.dex-tip-dialog .dex-dialog-tip-content {
  align-items: center;
  display: flex;
  flex-direction: column;
  justify-content: center;
  text-align: center
}

.dex-dialog.dex-tip-dialog .dex-dialog-tip-content .tip-title-box {
  width: 100%
}

.dex-dialog.dex-tip-dialog .dex-dialog-tip-content .tip-title {
  font-size: var(--dex-okd-dialog-tip-title-font-size);
  font-weight: 500;
  line-height: var(--dex-okd-dialog-tip-title-line-height);
  min-height: var(--dex-okd-dialog-tip-title-line-height)
}

.dex-dialog.dex-tip-dialog .dex-dialog-tip-content .tip-detail {
  font-size: var(--dex-okd-dialog-tip-detail-font-size);
  font-weight: 400;
  line-height: var(--dex-okd-dialog-tip-detail-line-height);
  margin-top: 8px
}

.dex-dialog.dex-tip-dialog .dex-dialog-tip-content .tip-detail+.tip-detail {
  margin-top: 2px
}

.dex-dialog.dex-tip-dialog .dex-dialog-tip-content .tip-title {
  color: var(--dex-okd-dialog-tip-title-color)
}

.dex-dialog.dex-tip-dialog .dex-dialog-tip-content .tip-detail {
  color: var(--dex-okd-dialog-tip-detail-color)
}

.dex-dialog.dex-tip-dialog .dex-dialog-footer-box {
  border-top: none
}

@media (max-width:767px) {
  .dex-dialog.dex-tip-dialog .dex-dialog-window.bottom-align {
    border-radius: var(--dex-okd-dialog-window-border-radius);
    bottom: 16px
  }

  .dex-dialog.dex-tip-dialog .dex-dialog-container {
    padding: var(--dex-okd-dialog-tip-container-sm-padding-top, 20px) var(--dex-okd-dialog-container-sm-padding-horizontal) var(--dex-okd-dialog-tip-container-sm-padding-bottom, 24px)
  }

  .dex-dialog.dex-tip-dialog .dex-dialog-footer-box {
    padding: 0 var(--dex-okd-dialog-container-sm-padding-horizontal) var(--dex-okd-dialog-tip-footer-box-sm-padding-vertical) var(--dex-okd-dialog-container-sm-padding-horizontal)
  }
}

@media (min-width:768px) {
  .dex-dialog.dex-tip-dialog .dex-dialog-tip-content {
    margin-left: auto;
    margin-right: auto;
    max-width: var(--dex-okd-dialog-tip-window-min-width)
  }

  .dex-dialog.dex-tip-dialog .dex-dialog-tip-content.two-btn {
    max-width: var(--dex-okd-dialog-tip-window-2btn-min-width)
  }

  .dex-dialog.dex-tip-dialog .dex-dialog-container {
    padding: var(--dex-okd-dialog-tip-container-md-padding-top, 28px) var(--dex-okd-dialog-container-sm-padding-horizontal) var(--dex-okd-dialog-tip-container-md-padding-bottom, 24px)
  }

  .dex-dialog.dex-tip-dialog .dex-dialog-footer-box {
    padding: 0 var(--dex-okd-dialog-container-md-padding-horizontal) var(--dex-okd-dialog-tip-footer-box-md-padding-vertical) var(--dex-okd-dialog-container-md-padding-horizontal)
  }
}

.dex-dialog-tip-icon-bg {
  align-items: center;
  display: flex;
  justify-content: center;
  margin-bottom: 12px
}

.dex-dialog-tip-icon-bg .tip-icon {
  font-size: var(--dex-okd-dialog-tip-icon-font-size)
}

.dex-dialog-alert-icon {
  margin-top: -6px
}

.dex-dialog .dex-dialog-window-tip {
  background-color: var(--dex-okd-dialog-window-background);
  background-color: var(--dex-okd-dialog-confirm-window-background, var(--dex-okd-dialog-window-background))
}

.dex-dialog.dex-new-tip-dialog .dex-dialog-new-tip-top {
  padding: 24px 24px 0;
  padding: var(--dex-okd-dialog-confirm-title-padding-top, 24px) var(--dex-okd-dialog-confirm-title-padding-horizontal, 24px) var(--dex-okd-dialog-confirm-title-padding-bottom, 0)
}

.dex-dialog.dex-new-tip-dialog .dex-dialog-container.dex-dialog-new-tip-container {
  color: #000;
  color: var(--dex-okd-dialog-confirm-container-color, #000);
  font-size: 14px;
  font-size: var(--dex-okd-dialog-confirm-container-font-size, 14px);
  line-height: 20px;
  line-height: var(--dex-okd-dialog-confirm-container-line-height, 20px)
}

@media (min-width:768px) {
  .dex-dialog.dex-new-tip-dialog .dex-dialog-window {
    max-width: 520px;
    max-width: var(--dex-okd-dialog-confirm-max-width, 520px);
    min-width: 280px;
    min-width: var(--dex-okd-dialog-confirm-min-width, 280px)
  }

  .dex-dialog.dex-new-tip-dialog .dex-dialog-container.dex-dialog-new-tip-container {
    padding-bottom: 32px;
    padding-bottom: var(--dex-okd-dialog-confirm-container-padding-bottom, 32px);
    padding-top: 32px;
    padding-top: var(--dex-okd-dialog-confirm-container-padding-top, 32px)
  }

  .dex-dialog.dex-new-tip-dialog .dex-dialog-footer-box {
    padding-bottom: 24px;
    padding-bottom: var(--dex-okd-dialog-confirm-footer-padding-bottom, 24px);
    padding-top: 0;
    padding-top: var(--dex-okd-dialog-confirm-footer-padding-top, 0)
  }
}

@media (max-width:767px) {
  .dex-dialog.dex-new-tip-dialog .dex-dialog-window {
    width: calc(100% - 64px)
  }

  .dex-dialog.dex-new-tip-dialog .dex-dialog-container.dex-dialog-new-tip-container {
    padding: 8px 24px 24px;
    padding: var(--dex-okd-dialog-confirm-container-sm-padding-top, 8px) var(--dex-okd-dialog-confirm-container-sm-padding-horizontal, 24px) var(--dex-okd-dialog-confirm-container-sm-padding-bottom, 24px)
  }

  .dex-dialog.dex-new-tip-dialog .dex-dialog-container.dex-dialog-no-title {
    padding-top: 24px;
    padding-top: var(--dex-okd-dialog-confirm-no-title-padding-top, 24px)
  }

  .dex-dialog.dex-new-tip-dialog .dex-dialog-footer-box.dex-dialog-new-tip-footer {
    padding: 0
  }

  .dex-dialog.dex-new-tip-dialog .dex-dialog-footer-box.dex-dialog-new-tip-footer .dex-dialog-tip-button {
    border: 0;
    border-radius: 0;
    border-top: thin solid #dbdbdb;
    border-top: thin solid var(--dex-okd-dialog-confirm-footer-sm-button-border-color, #dbdbdb)
  }

  .dex-dialog.dex-new-tip-dialog .dex-dialog-footer-box.dex-dialog-new-tip-footer .dex-dialog-tip-button-color {
    color: var(--dex-okd-color-blue-800);
    color: var(--dex-okd-dialog-confirm-footer-sm-button-color, var(--dex-okd-color-blue-800))
  }

  .dex-dialog.dex-new-tip-dialog .dex-dialog-footer-box.dex-dialog-new-tip-footer .dex-dialog-tip-button-confirm {
    font-weight: 700
  }

  .dex-dialog.dex-new-tip-dialog .dex-dialog-footer-box.dex-dialog-new-tip-footer .dex-dialog-tip-button-cancel {
    font-weight: 400
  }

  .dex-dialog.dex-new-tip-dialog .dex-dialog-footer-box.dex-dialog-new-tip-footer .dex-dialog-tip-only-one {
    border-radius: 0 0 var(--dex-okd-dialog-window-sm-border-radius) var(--dex-okd-dialog-window-sm-border-radius)
  }

  .dex-dialog.dex-new-tip-dialog .dex-dialog-footer-box.dex-dialog-new-tip-footer .dex-dialog-tip-border-top:first-child {
    border-radius: 0 0 var(--dex-okd-dialog-window-sm-border-radius) var(--dex-okd-dialog-window-sm-border-radius);
    margin-top: 0
  }

  .dex-dialog.dex-new-tip-dialog .dex-dialog-footer-box.dex-dialog-new-tip-footer .dex-dialog-tip-border-left:first-child {
    border-radius: 0 0 0 var(--dex-okd-dialog-window-sm-border-radius)
  }

  .dex-dialog.dex-new-tip-dialog .dex-dialog-footer-box.dex-dialog-new-tip-footer .dex-dialog-tip-border-left+.dex-dialog-tip-border-left {
    border-left: thin solid #dbdbdb;
    border-left: thin solid var(--dex-okd-dialog-confirm-footer-sm-button-border-color, #dbdbdb);
    border-radius: 0 0 var(--dex-okd-dialog-window-sm-border-radius) 0;
    margin-left: 0
  }
}

.dex-dialog-mobile-mode.dex-new-tip-dialog .dex-dialog-window {
  width: calc(100% - 64px)
}

.dex-dialog-mobile-mode.dex-new-tip-dialog .dex-dialog-container.dex-dialog-new-tip-container {
  padding: 8px 24px 24px;
  padding: var(--dex-okd-dialog-confirm-container-sm-padding-top, 8px) var(--dex-okd-dialog-confirm-container-sm-padding-horizontal, 24px) var(--dex-okd-dialog-confirm-container-sm-padding-bottom, 24px)
}

.dex-dialog-mobile-mode.dex-new-tip-dialog .dex-dialog-container.dex-dialog-no-title {
  padding-top: 24px;
  padding-top: var(--dex-okd-dialog-confirm-no-title-padding-top, 24px)
}

.dex-dialog-mobile-mode.dex-new-tip-dialog .dex-dialog-footer-box.dex-dialog-new-tip-footer {
  padding: 0
}

.dex-dialog-mobile-mode.dex-new-tip-dialog .dex-dialog-footer-box.dex-dialog-new-tip-footer .dex-dialog-tip-button {
  border: 0;
  border-radius: 0;
  border-top: thin solid #dbdbdb;
  border-top: thin solid var(--dex-okd-dialog-confirm-footer-sm-button-border-color, #dbdbdb)
}

.dex-dialog-mobile-mode.dex-new-tip-dialog .dex-dialog-footer-box.dex-dialog-new-tip-footer .dex-dialog-tip-button-color {
  color: var(--dex-okd-color-blue-800);
  color: var(--dex-okd-dialog-confirm-footer-sm-button-color, var(--dex-okd-color-blue-800))
}

.dex-dialog-mobile-mode.dex-new-tip-dialog .dex-dialog-footer-box.dex-dialog-new-tip-footer .dex-dialog-tip-button-confirm {
  font-weight: 700
}

.dex-dialog-mobile-mode.dex-new-tip-dialog .dex-dialog-footer-box.dex-dialog-new-tip-footer .dex-dialog-tip-button-cancel {
  font-weight: 400
}

.dex-dialog-mobile-mode.dex-new-tip-dialog .dex-dialog-footer-box.dex-dialog-new-tip-footer .dex-dialog-tip-only-one {
  border-radius: 0 0 var(--dex-okd-dialog-window-sm-border-radius) var(--dex-okd-dialog-window-sm-border-radius)
}

.dex-dialog-mobile-mode.dex-new-tip-dialog .dex-dialog-footer-box.dex-dialog-new-tip-footer .dex-dialog-tip-border-top:first-child {
  border-radius: 0 0 var(--dex-okd-dialog-window-sm-border-radius) var(--dex-okd-dialog-window-sm-border-radius);
  margin-top: 0
}

.dex-dialog-mobile-mode.dex-new-tip-dialog .dex-dialog-footer-box.dex-dialog-new-tip-footer .dex-dialog-tip-border-left:first-child {
  border-radius: 0 0 0 var(--dex-okd-dialog-window-sm-border-radius)
}

.dex-dialog-mobile-mode.dex-new-tip-dialog .dex-dialog-footer-box.dex-dialog-new-tip-footer .dex-dialog-tip-border-left+.dex-dialog-tip-border-left {
  border-left: thin solid #dbdbdb;
  border-left: thin solid var(--dex-okd-dialog-confirm-footer-sm-button-border-color, #dbdbdb);
  border-radius: 0 0 var(--dex-okd-dialog-window-sm-border-radius) 0;
  margin-left: 0
}

.iconfont.dex-dialog-tip-icon {
  align-self: flex-start;
  font-size: 22px;
  font-size: var(--dex-okd-dialog-confirm-icon-font-size, 22px);
  font-weight: 400;
  line-height: 22px;
  line-height: var(--dex-okd-dialog-confirm-icon-line-height, 22px);
  margin-right: 10px;
  margin-right: var(--dex-okd-dialog-confirm-icon-margin-right, 10px)
}

.dex-dialog-success-icon,
.dex-dialog-success-tip-icon {
  color: var(--dex-okd-dialog-tip-success-icon-color)
}

.dex-dialog-info-icon,
.dex-dialog-info-tip-icon {
  color: var(--dex-okd-dialog-tip-info-icon-color)
}

.dex-dialog-prompt-icon,
.dex-dialog-prompt-tip-icon {
  color: var(--dex-okd-dialog-tip-prompt-icon-color)
}

.dex-dialog-warn-icon,
.dex-dialog-warn-tip-icon {
  color: var(--dex-okd-dialog-tip-warn-icon-color)
}

.dex-dialog-alert-icon,
.dex-dialog-alert-tip-icon {
  color: var(--dex-okd-dialog-tip-alert-icon-color)
}

.dex-dialog-error-icon,
.dex-dialog-error-tip-icon {
  color: var(--dex-okd-dialog-tip-error-icon-color)
}

.dex-dialog .dex-dialog-confirmation-window {
  background-color: var(--dex-okd-dialog-window-background);
  background-color: var(--dex-okd-dialog-confirmation-window-background, var(--dex-okd-dialog-window-background))
}

.dex-dialog-confirmation {
  --inner-okd-dialog-close-btn-padding: 22px
}

.dex-dialog-confirmation-header {
  font-size: 16px;
  font-size: var(--dex-okd-dialog-title-font-size, 16px);
  font-weight: 700;
  font-weight: var(--dex-okd-dialog-title-font-weight, 700);
  line-height: var(--dex-okd-dialog-title-line-height);
  padding: 24px;
  padding: var(--dex-okd-dialog-confirmation-header-padding-top, 24px) var(--dex-okd-dialog-confirmation-padding-right, 24px) var(--dex-okd-dialog-confirmation-header-padding-top, 24px) var(--dex-okd-dialog-confirmation-padding-left, 24px)
}

.dex-dialog-confirmation-header-margin {
  margin-right: 36px
}

.dex-dialog-confirmation-container {
  flex-grow: 1;
  line-height: 22px;
  overflow-y: auto;
  padding-bottom: 8px;
  padding-left: 24px;
  padding-left: var(--dex-okd-dialog-confirmation-padding-left, 24px);
  padding-right: 24px;
  padding-right: var(--dex-okd-dialog-confirmation-padding-right, 24px);
  padding-top: 8px
}

.dex-dialog-confirmation-container-no-header {
  padding-top: 32px;
  padding-top: var(--dex-okd-dialog-confirmation-container-padding-top, 32px)
}

.dex-dialog-confirmation-container-no-footer {
  padding-bottom: 32px;
  padding-bottom: var(--dex-okd-dialog-confirmation-container-padding-bottom, 32px)
}

.dex-dialog-confirmation-footer {
  padding: 24px;
  padding: var(--dex-okd-dialog-confirmation-footer-padding-bottom, 24px) var(--dex-okd-dialog-confirmation-padding-right, 24px) var(--dex-okd-dialog-confirmation-footer-padding-bottom, 24px) var(--dex-okd-dialog-confirmation-padding-left, 24px)
}

.dex-input-reversed .dex-input-box {
  background: var(--dex-okd-input-reversed-default-background);
  border: thin solid var(--dex-okd-input-reversed-default-border-color);
  box-shadow: var(--dex-okd-input-reversed-default-shadow);
  transition: border-color .3s, box-shadow .3s
}

.dex-input-reversed .dex-input-input {
  color: var(--dex-okd-input-reversed-default-text-color)
}

.dex-input-reversed .dex-input-input::-webkit-input-placeholder {
  -webkit-text-fill-color: var(--dex-okd-input-reversed-default-placeholder-color);
  color: var(--dex-okd-input-reversed-default-placeholder-color)
}

.dex-input-reversed .dex-input-input:-moz-placeholder {
  -webkit-text-fill-color: var(--dex-okd-input-reversed-default-placeholder-color);
  color: var(--dex-okd-input-reversed-default-placeholder-color);
  opacity: 1
}

.dex-input-reversed .dex-input-input::-ms-input-placeholder {
  -webkit-text-fill-color: var(--dex-okd-input-reversed-default-placeholder-color);
  color: var(--dex-okd-input-reversed-default-placeholder-color)
}

.dex-input-reversed .dex-input-input:-webkit-autofill {
  -webkit-text-fill-color: var(--dex-okd-input-reversed-default-text-color) !important;
  border: none;
  -webkit-box-shadow: 0 0 0 30px var(--dex-okd-input-reversed-default-background) inset
}

.dex-input-reversed .dex-input-error {
  color: var(--dex-okd-input-reversed-error-tips-color)
}

.dex-input-reversed .dex-input-help-text,
.dex-input-reversed .dex-input-tips {
  color: var(--dex-okd-input-reversed-tips-text-color)
}

.dex-input.dex-input-reversed.hover .dex-input-box,
.dex-input.dex-input-reversed:hover .dex-input-box {
  background: var(--dex-okd-input-reversed-hover-background);
  border: thin solid var(--dex-okd-input-reversed-hover-border-color);
  box-shadow: var(--dex-okd-input-reversed-hover-shadow)
}

.dex-input.dex-input-reversed.hover .dex-input-box .dex-input-input,
.dex-input.dex-input-reversed:hover .dex-input-box .dex-input-input {
  -webkit-text-fill-color: var(--dex-okd-input-reversed-hover-text-color);
  caret-color: var(--dex-okd-input-reversed-hover-caret-color);
  color: var(--dex-okd-input-reversed-hover-text-color)
}

.dex-input.dex-input-reversed.hover .dex-input-box .dex-input-input::-webkit-input-placeholder,
.dex-input.dex-input-reversed:hover .dex-input-box .dex-input-input::-webkit-input-placeholder {
  -webkit-text-fill-color: var(--dex-okd-input-reversed-hover-placeholder-color);
  color: var(--dex-okd-input-reversed-hover-placeholder-color)
}

.dex-input.dex-input-reversed.hover .dex-input-box .dex-input-input:-moz-placeholder,
.dex-input.dex-input-reversed:hover .dex-input-box .dex-input-input:-moz-placeholder {
  -webkit-text-fill-color: var(--dex-okd-input-reversed-hover-placeholder-color);
  color: var(--dex-okd-input-reversed-hover-placeholder-color);
  opacity: 1
}

.dex-input.dex-input-reversed.hover .dex-input-box .dex-input-input::-ms-input-placeholder,
.dex-input.dex-input-reversed:hover .dex-input-box .dex-input-input::-ms-input-placeholder {
  -webkit-text-fill-color: var(--dex-okd-input-reversed-hover-placeholder-color);
  color: var(--dex-okd-input-reversed-hover-placeholder-color)
}

.dex-input.dex-input-reversed.focus .dex-input-box {
  background: var(--dex-okd-input-reversed-focus-background);
  border: thin solid var(--dex-okd-input-reversed-focus-border-color);
  box-shadow: var(--dex-okd-input-reversed-focus-shadow)
}

.dex-input.dex-input-reversed.focus .dex-input-box .dex-input-input {
  -webkit-text-fill-color: var(--dex-okd-input-reversed-focus-text-color);
  caret-color: var(--dex-okd-input-reversed-focus-caret-color);
  color: var(--dex-okd-input-reversed-focus-text-color)
}

.dex-input.dex-input-reversed.focus .dex-input-box .dex-input-input::-webkit-input-placeholder {
  -webkit-text-fill-color: var(--dex-okd-input-reversed-focus-placeholder-color);
  color: var(--dex-okd-input-reversed-focus-placeholder-color)
}

.dex-input.dex-input-reversed.focus .dex-input-box .dex-input-input:-moz-placeholder {
  -webkit-text-fill-color: var(--dex-okd-input-reversed-focus-placeholder-color);
  color: var(--dex-okd-input-reversed-focus-placeholder-color);
  opacity: 1
}

.dex-input.dex-input-reversed.focus .dex-input-box .dex-input-input::-ms-input-placeholder {
  -webkit-text-fill-color: var(--dex-okd-input-reversed-focus-placeholder-color);
  color: var(--dex-okd-input-reversed-focus-placeholder-color)
}

.dex-input.dex-input-reversed.disabled .dex-input-box {
  background: var(--dex-okd-input-reversed-disabled-background);
  border: thin solid var(--dex-okd-input-reversed-disabled-border-color);
  box-shadow: var(--dex-okd-input-reversed-disabled-shadow)
}

.dex-input.dex-input-reversed.disabled .dex-input-box .dex-input-input {
  -webkit-text-fill-color: var(--dex-okd-input-reversed-disabled-text-color);
  caret-color: var(--dex-okd-input-reversed-disabled-caret-color);
  color: var(--dex-okd-input-reversed-disabled-text-color)
}

.dex-input.dex-input-reversed.disabled .dex-input-box .dex-input-input::-webkit-input-placeholder {
  -webkit-text-fill-color: var(--dex-okd-input-reversed-disabled-placeholder-color);
  color: var(--dex-okd-input-reversed-disabled-placeholder-color)
}

.dex-input.dex-input-reversed.disabled .dex-input-box .dex-input-input:-moz-placeholder {
  -webkit-text-fill-color: var(--dex-okd-input-reversed-disabled-placeholder-color);
  color: var(--dex-okd-input-reversed-disabled-placeholder-color);
  opacity: 1
}

.dex-input.dex-input-reversed.disabled .dex-input-box .dex-input-input::-ms-input-placeholder {
  -webkit-text-fill-color: var(--dex-okd-input-reversed-disabled-placeholder-color);
  color: var(--dex-okd-input-reversed-disabled-placeholder-color)
}

.dex-input.dex-input-reversed.disabled .dex-input-input:-webkit-autofill {
  -webkit-text-fill-color: var(--dex-okd-input-reversed-disabled-text-color) !important;
  -webkit-box-shadow: 0 0 0 30px var(--dex-okd-input-reversed-disabled-background) inset
}

.dex-input.dex-input-reversed.error .dex-input-box {
  background: var(--dex-okd-input-reversed-error-background);
  border: thin solid var(--dex-okd-input-reversed-error-border-color);
  box-shadow: var(--dex-okd-input-reversed-error-shadow)
}

.dex-input.dex-input-reversed.error .dex-input-box .dex-input-input {
  -webkit-text-fill-color: var(--dex-okd-input-reversed-error-text-color);
  caret-color: var(--dex-okd-input-reversed-error-caret-color);
  color: var(--dex-okd-input-reversed-error-text-color)
}

.dex-input.dex-input-reversed.error .dex-input-box .dex-input-input::-webkit-input-placeholder {
  -webkit-text-fill-color: var(--dex-okd-input-reversed-error-placeholder-color);
  color: var(--dex-okd-input-reversed-error-placeholder-color)
}

.dex-input.dex-input-reversed.error .dex-input-box .dex-input-input:-moz-placeholder {
  -webkit-text-fill-color: var(--dex-okd-input-reversed-error-placeholder-color);
  color: var(--dex-okd-input-reversed-error-placeholder-color);
  opacity: 1
}

.dex-input.dex-input-reversed.error .dex-input-box .dex-input-input::-ms-input-placeholder {
  -webkit-text-fill-color: var(--dex-okd-input-reversed-error-placeholder-color);
  color: var(--dex-okd-input-reversed-error-placeholder-color)
}

.dex-label-reversed .dex-label-text {
  color: var(--dex-okd-input-reversed-label-color)
}

.dex-label-reversed .dex-label-action {
  color: var(--dex-okd-input-reversed-action-color)
}

.dex-input-reversed .dex-input-prefix .prefix-icon,
.dex-input-reversed .dex-input-suffix .suffix-icon,
.dex-input-reversed .dex-input-suffix .suffix-icon:hover {
  color: var(--dex-okd-input-reversed-icon-color)
}

.dex-input-reversed .dex-input-suffix .error-icon {
  color: var(--dex-okd-input-reversed-error-tips-color)
}

.dex-input-reversed .dex-input-number-suffix {
  border-left: 1px solid var(--dex-okd-input-reversed-default-border-color)
}

.dex-input-reversed .dex-input-number-suffix-part {
  background: var(--dex-okd-input-number-reversed-default-add-icon-background)
}

.dex-input-reversed .dex-input-number-suffix-part .icon {
  color: var(--dex-okd-input-number-reversed-default-add-icon-color)
}

.dex-input-reversed .dex-input-number-suffix-part .hover,
.dex-input-reversed .dex-input-number-suffix-part:hover {
  background: var(--dex-okd-input-number-reversed-hover-add-icon-background)
}

.dex-input-reversed .dex-input-number-suffix-part .hover .icon,
.dex-input-reversed .dex-input-number-suffix-part:hover .icon {
  color: var(--dex-okd-input-number-reversed-hover-add-icon-color)
}

.dex-input-reversed .dex-input-number-suffix-part .active,
.dex-input-reversed .dex-input-number-suffix-part:active {
  background: var(--dex-okd-input-number-reversed-active-add-icon-background)
}

.dex-input-reversed .dex-input-number-suffix-part .active .icon,
.dex-input-reversed .dex-input-number-suffix-part:active .icon {
  color: var(--dex-okd-input-number-reversed-active-add-icon-color)
}

.dex-input-reversed .dex-input-number-suffix-part .disabled,
.dex-input-reversed .dex-input-number-suffix-part-disabled {
  background: var(--dex-okd-input-number-reversed-disabled-add-icon-background)
}

.dex-input-reversed .dex-input-number-suffix-part .disabled .icon,
.dex-input-reversed .dex-input-number-suffix-part .disabled:hover .icon,
.dex-input-reversed .dex-input-number-suffix-part-disabled .icon,
.dex-input-reversed .dex-input-number-suffix-part-disabled:hover .icon {
  color: var(--dex-okd-input-number-reversed-disabled-add-icon-color)
}

.dex-input-reversed .dex-input-number-suffix-line {
  background: var(--dex-okd-input-reversed-default-border-color)
}

.dex-input-reversed.dex-input .dex-input-code-btn {
  color: var(--dex-okd-input-code-reversed-common-btn-color)
}

.dex-input-reversed.dex-input .dex-input-code-btn.disabled {
  color: var(--dex-okd-input-code-reversed-common-btn-disabled-color)
}

.dex-input-reversed.dex-input .dex-input-count-down {
  color: var(--dex-okd-input-code-reversed-common-count-color)
}

.dex-input-reversed.dex-input-search .dex-input-prefix .dex-input-search-prefix-icon {
  color: var(--dex-okd-input-search-reversed-prefix-icon-color)
}

.dex-input-reversed.dex-input-search .dex-input-error {
  color: var(--dex-okd-input-search-reversed-error-tips-color)
}

.dex-input-reversed.dex-input-search .dex-input-box {
  background-color: var(--dex-okd-input-search-reversed-default-background);
  border-color: var(--dex-okd-input-search-reversed-default-border-color);
  box-shadow: var(--dex-okd-input-search-reversed-default-shadow)
}

.dex-input-reversed.dex-input-search .dex-input-input {
  color: var(--dex-okd-input-search-reversed-default-text-color)
}

.dex-input-reversed.dex-input-search .dex-input-input::-webkit-input-placeholder {
  -webkit-text-fill-color: var(--dex-okd-input-search-reversed-default-placeholder-color);
  color: var(--dex-okd-input-search-reversed-default-placeholder-color)
}

.dex-input-reversed.dex-input-search .dex-input-input:-moz-placeholder {
  -webkit-text-fill-color: var(--dex-okd-input-search-reversed-default-placeholder-color);
  color: var(--dex-okd-input-search-reversed-default-placeholder-color);
  opacity: 1
}

.dex-input-reversed.dex-input-search .dex-input-input::-ms-input-placeholder {
  -webkit-text-fill-color: var(--dex-okd-input-search-reversed-default-placeholder-color);
  color: var(--dex-okd-input-search-reversed-default-placeholder-color)
}

.dex-input-reversed.dex-input-search.hover .dex-input-box,
.dex-input-reversed.dex-input-search:hover .dex-input-box {
  background: var(--dex-okd-input-search-reversed-hover-background);
  border: thin solid var(--dex-okd-input-search-reversed-hover-border-color);
  box-shadow: var(--dex-okd-input-search-reversed-hover-shadow)
}

.dex-input-reversed.dex-input-search.hover .dex-input-box .dex-input-input,
.dex-input-reversed.dex-input-search:hover .dex-input-box .dex-input-input {
  -webkit-text-fill-color: var(--dex-okd-input-search-reversed-hover-text-color);
  caret-color: var(--dex-okd-input-search-reversed-hover-caret-color);
  color: var(--dex-okd-input-search-reversed-hover-text-color)
}

.dex-input-reversed.dex-input-search.hover .dex-input-box .dex-input-input::-webkit-input-placeholder,
.dex-input-reversed.dex-input-search:hover .dex-input-box .dex-input-input::-webkit-input-placeholder {
  -webkit-text-fill-color: var(--dex-okd-input-search-reversed-hover-placeholder-color);
  color: var(--dex-okd-input-search-reversed-hover-placeholder-color)
}

.dex-input-reversed.dex-input-search.hover .dex-input-box .dex-input-input:-moz-placeholder,
.dex-input-reversed.dex-input-search:hover .dex-input-box .dex-input-input:-moz-placeholder {
  -webkit-text-fill-color: var(--dex-okd-input-search-reversed-hover-placeholder-color);
  color: var(--dex-okd-input-search-reversed-hover-placeholder-color);
  opacity: 1
}

.dex-input-reversed.dex-input-search.hover .dex-input-box .dex-input-input::-ms-input-placeholder,
.dex-input-reversed.dex-input-search:hover .dex-input-box .dex-input-input::-ms-input-placeholder {
  -webkit-text-fill-color: var(--dex-okd-input-search-reversed-hover-placeholder-color);
  color: var(--dex-okd-input-search-reversed-hover-placeholder-color)
}

.dex-input-reversed.dex-input-search.focus .dex-input-box {
  background: var(--dex-okd-input-search-reversed-focus-background);
  border: thin solid var(--dex-okd-input-search-reversed-focus-border-color);
  box-shadow: var(--dex-okd-input-search-reversed-focus-shadow)
}

.dex-input-reversed.dex-input-search.focus .dex-input-box .dex-input-input {
  -webkit-text-fill-color: var(--dex-okd-input-search-reversed-focus-text-color);
  caret-color: var(--dex-okd-input-search-reversed-focus-caret-color);
  color: var(--dex-okd-input-search-reversed-focus-text-color)
}

.dex-input-reversed.dex-input-search.focus .dex-input-box .dex-input-input::-webkit-input-placeholder {
  -webkit-text-fill-color: var(--dex-okd-input-search-reversed-focus-placeholder-color);
  color: var(--dex-okd-input-search-reversed-focus-placeholder-color)
}

.dex-input-reversed.dex-input-search.focus .dex-input-box .dex-input-input:-moz-placeholder {
  -webkit-text-fill-color: var(--dex-okd-input-search-reversed-focus-placeholder-color);
  color: var(--dex-okd-input-search-reversed-focus-placeholder-color);
  opacity: 1
}

.dex-input-reversed.dex-input-search.focus .dex-input-box .dex-input-input::-ms-input-placeholder {
  -webkit-text-fill-color: var(--dex-okd-input-search-reversed-focus-placeholder-color);
  color: var(--dex-okd-input-search-reversed-focus-placeholder-color)
}

.dex-input-reversed.dex-input-search.disabled .dex-input-box {
  background: var(--dex-okd-input-search-reversed-disabled-background);
  border: thin solid var(--dex-okd-input-search-reversed-disabled-border-color);
  box-shadow: var(--dex-okd-input-search-reversed-disabled-shadow)
}

.dex-input-reversed.dex-input-search.disabled .dex-input-box .dex-input-input {
  -webkit-text-fill-color: var(--dex-okd-input-search-reversed-disabled-text-color);
  caret-color: var(--dex-okd-input-search-reversed-disabled-caret-color);
  color: var(--dex-okd-input-search-reversed-disabled-text-color)
}

.dex-input-reversed.dex-input-search.disabled .dex-input-box .dex-input-input::-webkit-input-placeholder {
  -webkit-text-fill-color: var(--dex-okd-input-search-reversed-disabled-placeholder-color);
  color: var(--dex-okd-input-search-reversed-disabled-placeholder-color)
}

.dex-input-reversed.dex-input-search.disabled .dex-input-box .dex-input-input:-moz-placeholder {
  -webkit-text-fill-color: var(--dex-okd-input-search-reversed-disabled-placeholder-color);
  color: var(--dex-okd-input-search-reversed-disabled-placeholder-color);
  opacity: 1
}

.dex-input-reversed.dex-input-search.disabled .dex-input-box .dex-input-input::-ms-input-placeholder {
  -webkit-text-fill-color: var(--dex-okd-input-search-reversed-disabled-placeholder-color);
  color: var(--dex-okd-input-search-reversed-disabled-placeholder-color)
}

.dex-input-reversed.dex-input-search.error .dex-input-box {
  background: var(--dex-okd-input-search-reversed-error-background);
  border: thin solid var(--dex-okd-input-search-reversed-error-border-color);
  box-shadow: var(--dex-okd-input-search-reversed-error-shadow)
}

.dex-input-reversed.dex-input-search.error .dex-input-box .dex-input-input {
  -webkit-text-fill-color: var(--dex-okd-input-search-reversed-error-text-color);
  caret-color: var(--dex-okd-input-search-reversed-error-caret-color);
  color: var(--dex-okd-input-search-reversed-error-text-color)
}

.dex-input-reversed.dex-input-search.error .dex-input-box .dex-input-input::-webkit-input-placeholder {
  -webkit-text-fill-color: var(--dex-okd-input-search-reversed-error-placeholder-color);
  color: var(--dex-okd-input-search-reversed-error-placeholder-color)
}

.dex-input-reversed.dex-input-search.error .dex-input-box .dex-input-input:-moz-placeholder {
  -webkit-text-fill-color: var(--dex-okd-input-search-reversed-error-placeholder-color);
  color: var(--dex-okd-input-search-reversed-error-placeholder-color);
  opacity: 1
}

.dex-input-reversed.dex-input-search.error .dex-input-box .dex-input-input::-ms-input-placeholder {
  -webkit-text-fill-color: var(--dex-okd-input-search-reversed-error-placeholder-color);
  color: var(--dex-okd-input-search-reversed-error-placeholder-color)
}

.dex-label {
  display: flex;
  width: 100%
}

.dex-label.top-right {
  justify-content: flex-end
}

.dex-label.top-between {
  justify-content: space-between
}

.dex-label-text {
  color: var(--dex-okd-input-label-color);
  font-weight: 500
}

.dex-label-action {
  color: var(--dex-okd-input-action-color);
  cursor: pointer;
  font-weight: 500
}

.dex-label.label-xl .dex-label-text {
  font-size: var(--dex-okd-input-xl-label-font-size);
  line-height: var(--dex-okd-input-xl-label-line-height);
  margin-bottom: 6px;
  margin-bottom: var(--dex-okd-input-xl-label-margin, 6px)
}

.dex-label.label-xl .dex-label-action {
  font-size: var(--dex-okd-input-xl-action-font-size);
  line-height: var(--dex-okd-input-xl-action-line-height);
  margin-bottom: 6px;
  margin-bottom: var(--dex-okd-input-xl-label-margin, 6px)
}

.dex-label.label-xl .dex-label-place {
  min-height: var(--dex-okd-input-xl-label-line-height)
}

.dex-label.label-lg .dex-label-text {
  font-size: var(--dex-okd-input-lg-label-font-size);
  line-height: var(--dex-okd-input-lg-label-line-height);
  margin-bottom: 6px;
  margin-bottom: var(--dex-okd-input-lg-label-margin, 6px)
}

.dex-label.label-lg .dex-label-action {
  font-size: var(--dex-okd-input-lg-action-font-size);
  line-height: var(--dex-okd-input-lg-action-line-height);
  margin-bottom: 6px;
  margin-bottom: var(--dex-okd-input-lg-label-margin, 6px)
}

.dex-label.label-lg .dex-label-place {
  min-height: var(--dex-okd-input-lg-label-line-height)
}

.dex-label.label-xs .dex-label-text {
  font-size: var(--dex-okd-input-xs-label-font-size);
  line-height: var(--dex-okd-input-xs-label-line-height);
  margin-bottom: 4px;
  margin-bottom: var(--dex-okd-input-xs-label-margin, 4px)
}

.dex-label.label-xs .dex-label-action {
  font-size: var(--dex-okd-input-xs-action-font-size);
  line-height: var(--dex-okd-input-xs-action-line-height);
  margin-bottom: 4px;
  margin-bottom: var(--dex-okd-input-xs-label-margin, 4px)
}

.dex-label.label-xs .dex-label-place {
  min-height: var(--dex-okd-input-xs-label-line-height)
}

.dex-label.label-sm .dex-label-text {
  font-size: var(--dex-okd-input-sm-label-font-size);
  line-height: var(--dex-okd-input-sm-label-line-height);
  margin-bottom: 4px;
  margin-bottom: var(--dex-okd-input-sm-label-margin, 4px)
}

.dex-label.label-sm .dex-label-action {
  font-size: var(--dex-okd-input-sm-action-font-size);
  line-height: var(--dex-okd-input-sm-action-line-height);
  margin-bottom: 4px;
  margin-bottom: var(--dex-okd-input-sm-label-margin, 4px)
}

.dex-label.label-sm .dex-label-place {
  min-height: var(--dex-okd-input-sm-label-line-height)
}

.dex-label.label-md .dex-label-text {
  font-size: var(--dex-okd-input-md-label-font-size);
  line-height: var(--dex-okd-input-md-label-line-height);
  margin-bottom: 4px;
  margin-bottom: var(--dex-okd-input-md-label-margin, 4px)
}

.dex-label.label-md .dex-label-action {
  font-size: var(--dex-okd-input-md-action-font-size);
  line-height: var(--dex-okd-input-md-action-line-height);
  margin-bottom: 4px;
  margin-bottom: var(--dex-okd-input-md-label-margin, 4px)
}

.dex-label.label-md .dex-label-place {
  min-height: var(--dex-okd-input-md-label-line-height)
}

.dex-input-caret-color {
  caret-color: var(--dex-okd-input-focus-caret-color)
}

.dex-input-caret-color input[type=search]::-webkit-search-cancel-button {
  -webkit-appearance: none;
  appearance: none
}

.dex-input-caret-color input[type=search]::-moz-search-cancel-button {
  -moz-appearance: none;
  appearance: none
}

.dex-input-caret-color input::-ms-clear,
.dex-input-caret-color input::-ms-reveal {
  display: none
}

.dex-input-caret-color input::-o-clear {
  display: none
}

.dex-input {
  align-items: flex-start;
  display: flex;
  flex-direction: column;
  position: relative
}

.dex-input input[type=search]::-webkit-search-cancel-button {
  -webkit-appearance: none;
  appearance: none
}

.dex-input input[type=search]::-moz-search-cancel-button {
  -moz-appearance: none;
  appearance: none
}

.dex-input input::-ms-clear,
.dex-input input::-ms-reveal {
  display: none
}

.dex-input input::-o-clear {
  display: none
}

.dex-input * {
  box-sizing: border-box
}

.dex-input-prefix,
.dex-input-suffix {
  align-items: center;
  display: flex;
  flex-shrink: 1;
  white-space: nowrap
}

.dex-input-input {
  background: transparent;
  border: none;
  color: var(--dex-okd-input-default-text-color);
  flex-grow: 1;
  font-family: inherit;
  height: 100%;
  outline: none;
  width: 100%
}

.dex-input-input::-webkit-input-placeholder {
  -webkit-text-fill-color: var(--dex-okd-input-default-placeholder-color);
  color: var(--dex-okd-input-default-placeholder-color)
}

.dex-input-input:-moz-placeholder {
  -webkit-text-fill-color: var(--dex-okd-input-default-placeholder-color);
  color: var(--dex-okd-input-default-placeholder-color);
  opacity: 1
}

.dex-input-input::-ms-input-placeholder {
  -webkit-text-fill-color: var(--dex-okd-input-default-placeholder-color);
  color: var(--dex-okd-input-default-placeholder-color)
}

.dex-input-input:-webkit-autofill {
  -webkit-text-fill-color: var(--dex-okd-input-default-text-color) !important;
  border: none;
  -webkit-box-shadow: 0 0 0 30px var(--dex-okd-input-default-background) inset
}

.dex-input-input.input-textarea {
  box-shadow: none;
  outline: none;
  resize: none
}

.dex-input-custom-placeholder {
  position: relative;
  width: 100%
}

.dex-input-ellipsis {
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap
}

.dex-input-placeholder {
  bottom: 0;
  color: var(--dex-okd-input-default-placeholder-color);
  left: 0;
  pointer-events: none;
  position: absolute;
  right: 0;
  top: 50%;
  transform: translateY(-50%)
}

.dex-input-tips-box {
  display: flex;
  width: 100%
}

.dex-input-error {
  color: var(--dex-okd-input-error-tips-color)
}

.dex-input-tips {
  display: inline-block
}

.dex-input-help-text,
.dex-input-tips {
  color: var(--dex-okd-input-tips-text-color)
}

.dex-input-help-text {
  flex-grow: 1;
  flex-shrink: 0;
  text-align: right
}

.dex-input.hover,
.dex-input:hover {
  cursor: text
}

.dex-input.hover .dex-input-box,
.dex-input:hover .dex-input-box {
  background: var(--dex-okd-input-hover-background);
  border: thin solid var(--dex-okd-input-hover-border-color);
  box-shadow: var(--dex-okd-input-hover-shadow)
}

.dex-input.hover .dex-input-box .dex-input-input,
.dex-input:hover .dex-input-box .dex-input-input {
  -webkit-text-fill-color: var(--dex-okd-input-hover-text-color);
  caret-color: var(--dex-okd-input-hover-caret-color);
  color: var(--dex-okd-input-hover-text-color)
}

.dex-input.hover .dex-input-box .dex-input-input::-webkit-input-placeholder,
.dex-input:hover .dex-input-box .dex-input-input::-webkit-input-placeholder {
  -webkit-text-fill-color: var(--dex-okd-input-hover-placeholder-color);
  color: var(--dex-okd-input-hover-placeholder-color)
}

.dex-input.hover .dex-input-box .dex-input-input:-moz-placeholder,
.dex-input:hover .dex-input-box .dex-input-input:-moz-placeholder {
  -webkit-text-fill-color: var(--dex-okd-input-hover-placeholder-color);
  color: var(--dex-okd-input-hover-placeholder-color);
  opacity: 1
}

.dex-input.hover .dex-input-box .dex-input-input::-ms-input-placeholder,
.dex-input:hover .dex-input-box .dex-input-input::-ms-input-placeholder {
  -webkit-text-fill-color: var(--dex-okd-input-hover-placeholder-color);
  color: var(--dex-okd-input-hover-placeholder-color)
}

.dex-input.focus .dex-input-box {
  background: var(--dex-okd-input-focus-background);
  border: thin solid var(--dex-okd-input-focus-border-color);
  box-shadow: var(--dex-okd-input-focus-shadow)
}

.dex-input.focus .dex-input-box .dex-input-input {
  -webkit-text-fill-color: var(--dex-okd-input-focus-text-color);
  caret-color: var(--dex-okd-input-focus-caret-color);
  color: var(--dex-okd-input-focus-text-color)
}

.dex-input.focus .dex-input-box .dex-input-input::-webkit-input-placeholder {
  -webkit-text-fill-color: var(--dex-okd-input-focus-placeholder-color);
  color: var(--dex-okd-input-focus-placeholder-color)
}

.dex-input.focus .dex-input-box .dex-input-input:-moz-placeholder {
  -webkit-text-fill-color: var(--dex-okd-input-focus-placeholder-color);
  color: var(--dex-okd-input-focus-placeholder-color);
  opacity: 1
}

.dex-input.focus .dex-input-box .dex-input-input::-ms-input-placeholder {
  -webkit-text-fill-color: var(--dex-okd-input-focus-placeholder-color);
  color: var(--dex-okd-input-focus-placeholder-color)
}

.dex-input.readonly .dex-input-box {
  background: var(--dex-okd-input-default-background);
  background: var(--dex-okd-input-readonly-background, var(--dex-okd-input-default-background));
  border: thin solid var(--dex-okd-input-readonly-border-color, var(--dex-okd-input-default-border-color));
  box-shadow: var(--dex-okd-input-default-shadow);
  box-shadow: var(--dex-okd-input-readonly-shadow, var(--dex-okd-input-default-shadow))
}

.dex-input.readonly .dex-input-box .dex-input-input {
  -webkit-text-fill-color: var(--dex-okd-input-default-text-color);
  -webkit-text-fill-color: var(--dex-okd-input-readonly-text-color, var(--dex-okd-input-default-text-color));
  caret-color: var(--dex-okd-input-default-caret-color);
  caret-color: var(--dex-okd-input-readonly-caret-color, var(--dex-okd-input-default-caret-color));
  color: var(--dex-okd-input-default-text-color);
  color: var(--dex-okd-input-readonly-text-color, var(--dex-okd-input-default-text-color))
}

.dex-input.readonly .dex-input-box .dex-input-input::-webkit-input-placeholder {
  -webkit-text-fill-color: var(--dex-okd-input-default-placeholder-color);
  -webkit-text-fill-color: var(--dex-okd-input-readonly-placeholder-color, var(--dex-okd-input-default-placeholder-color));
  color: var(--dex-okd-input-default-placeholder-color);
  color: var(--dex-okd-input-readonly-placeholder-color, var(--dex-okd-input-default-placeholder-color))
}

.dex-input.readonly .dex-input-box .dex-input-input:-moz-placeholder {
  -webkit-text-fill-color: var(--dex-okd-input-default-placeholder-color);
  -webkit-text-fill-color: var(--dex-okd-input-readonly-placeholder-color, var(--dex-okd-input-default-placeholder-color));
  color: var(--dex-okd-input-default-placeholder-color);
  color: var(--dex-okd-input-readonly-placeholder-color, var(--dex-okd-input-default-placeholder-color));
  opacity: 1
}

.dex-input.readonly .dex-input-box .dex-input-input::-ms-input-placeholder {
  -webkit-text-fill-color: var(--dex-okd-input-default-placeholder-color);
  -webkit-text-fill-color: var(--dex-okd-input-readonly-placeholder-color, var(--dex-okd-input-default-placeholder-color));
  color: var(--dex-okd-input-default-placeholder-color);
  color: var(--dex-okd-input-readonly-placeholder-color, var(--dex-okd-input-default-placeholder-color))
}

.dex-input.readonly.focus .dex-input-box {
  border-color: var(--dex-okd-input-focus-border-color)
}

.dex-input.disabled {
  cursor: not-allowed
}

.dex-input.disabled .dex-input-box {
  background: var(--dex-okd-input-disabled-background);
  border: thin solid var(--dex-okd-input-disabled-border-color);
  box-shadow: var(--dex-okd-input-disabled-shadow)
}

.dex-input.disabled .dex-input-box .dex-input-input {
  -webkit-text-fill-color: var(--dex-okd-input-disabled-text-color);
  caret-color: var(--dex-okd-input-disabled-caret-color);
  color: var(--dex-okd-input-disabled-text-color)
}

.dex-input.disabled .dex-input-box .dex-input-input::-webkit-input-placeholder {
  -webkit-text-fill-color: var(--dex-okd-input-disabled-placeholder-color);
  color: var(--dex-okd-input-disabled-placeholder-color)
}

.dex-input.disabled .dex-input-box .dex-input-input:-moz-placeholder {
  -webkit-text-fill-color: var(--dex-okd-input-disabled-placeholder-color);
  color: var(--dex-okd-input-disabled-placeholder-color);
  opacity: 1
}

.dex-input.disabled .dex-input-box .dex-input-input::-ms-input-placeholder {
  -webkit-text-fill-color: var(--dex-okd-input-disabled-placeholder-color);
  color: var(--dex-okd-input-disabled-placeholder-color)
}

.dex-input.disabled .dex-input-input {
  cursor: not-allowed;
  opacity: 1
}

.dex-input.disabled .dex-input-input:-webkit-autofill {
  -webkit-text-fill-color: var(--dex-okd-input-disabled-text-color) !important;
  -webkit-box-shadow: 0 0 0 30px var(--dex-okd-input-disabled-background) inset
}

.dex-input.error .dex-input-box {
  background: var(--dex-okd-input-error-background);
  border: thin solid var(--dex-okd-input-error-border-color);
  box-shadow: var(--dex-okd-input-error-shadow)
}

.dex-input.error .dex-input-box .dex-input-input {
  -webkit-text-fill-color: var(--dex-okd-input-error-text-color);
  caret-color: var(--dex-okd-input-error-caret-color);
  color: var(--dex-okd-input-error-text-color)
}

.dex-input.error .dex-input-box .dex-input-input::-webkit-input-placeholder {
  -webkit-text-fill-color: var(--dex-okd-input-error-placeholder-color);
  color: var(--dex-okd-input-error-placeholder-color)
}

.dex-input.error .dex-input-box .dex-input-input:-moz-placeholder {
  -webkit-text-fill-color: var(--dex-okd-input-error-placeholder-color);
  color: var(--dex-okd-input-error-placeholder-color);
  opacity: 1
}

.dex-input.error .dex-input-box .dex-input-input::-ms-input-placeholder {
  -webkit-text-fill-color: var(--dex-okd-input-error-placeholder-color);
  color: var(--dex-okd-input-error-placeholder-color)
}

.dex-input.error .dex-input-error {
  display: inline-block
}

.dex-input.no-border .dex-input-box {
  background: transparent;
  border: thin solid transparent;
  box-shadow: none
}

.dex-input-textarea-resize-virtual-dom::-webkit-scrollbar {
  display: none;
  height: 0;
  width: 0
}

.dex-input-box {
  align-items: center;
  background: var(--dex-okd-input-default-background);
  border: thin solid var(--dex-okd-input-default-border-color);
  box-shadow: var(--dex-okd-input-default-shadow);
  display: flex;
  transition: border-color .3s, box-shadow .3s;
  width: 100%
}

.dex-input-xl>.dex-input-box {
  border-radius: var(--dex-okd-input-xl-border-radius);
  height: var(--dex-okd-input-xl-height);
  padding: 0 8px;
  padding: 0 var(--dex-okd-input-xl-padding-horizontal, 8px)
}

.dex-input-xl>.dex-input-box.auto-size {
  height: -webkit-fit-content;
  height: -moz-fit-content;
  height: fit-content;
  min-height: var(--dex-okd-input-xl-height)
}

.dex-input-xl>.dex-input-box.no-padding-left {
  padding-left: 0
}

.dex-input-xl>.dex-input-box.no-padding-right {
  padding-right: 0
}

.dex-input-xl>.dex-input-box.ta {
  height: 100%;
  padding: 8px
}

.dex-input-xl>.dex-input-box.auto-resize-auto-height {
  height: -webkit-fit-content;
  height: -moz-fit-content;
  height: fit-content;
  min-height: var(--dex-okd-input-xl-height)
}

.dex-input-xl>.dex-input-box.input-circle {
  border-radius: 100px
}

.dex-input-xl .dex-input-input {
  font-size: var(--dex-okd-input-xl-text-font-size);
  padding: calc(var(--dex-okd-input-xl-height)/2 - var(--dex-okd-input-xl-text-font-size)/2 - 2px) 0
}

.dex-input-xl .dex-input-input::-webkit-input-placeholder {
  font-size: var(--dex-okd-input-xl-text-font-size);
  font-weight: 400;
  text-overflow: ellipsis
}

.dex-input-xl .dex-input-input:-moz-placeholder {
  font-size: var(--dex-okd-input-xl-text-font-size);
  font-weight: 400;
  text-overflow: ellipsis
}

.dex-input-xl .dex-input-input::-ms-input-placeholder {
  font-size: var(--dex-okd-input-xl-text-font-size);
  font-weight: 400;
  text-overflow: ellipsis
}

.dex-input-xl .dex-input-input.ta {
  padding: 0
}

.dex-input-xl .dex-input-input.textarea-auto-resize {
  line-height: var(--dex-okd-input-xl-text-font-size)
}

.dex-input-xl .dex-input-placeholder {
  font-size: var(--dex-okd-input-xl-text-font-size);
  height: calc(var(--dex-okd-input-xl-text-font-size) + 2px);
  line-height: calc(var(--dex-okd-input-xl-text-font-size) + 2px)
}

.dex-input-xl .dex-input.dex-input-place-mode .dex-input-tips-box {
  min-height: calc(var(--dex-okd-input-xl-tip-line-height) + 6px);
  min-height: calc(var(--dex-okd-input-xl-tip-line-height) + var(--dex-okd-input-xl-tip-margin, 6px))
}

.dex-input-xl .dex-input-error {
  font-size: var(--dex-okd-input-xl-error-font-size);
  line-height: var(--dex-okd-input-xl-error-line-height);
  margin-top: 6px;
  margin-top: var(--dex-okd-input-xl-tip-margin, 6px)
}

.dex-input-xl .dex-input-help-text,
.dex-input-xl .dex-input-tips {
  font-size: var(--dex-okd-input-xl-tip-font-size);
  line-height: var(--dex-okd-input-xl-tip-line-height);
  margin-top: 6px;
  margin-top: var(--dex-okd-input-xl-tip-margin, 6px)
}

.dex-input-lg>.dex-input-box {
  border-radius: var(--dex-okd-input-lg-border-radius);
  height: var(--dex-okd-input-lg-height);
  padding: 0 8px;
  padding: 0 var(--dex-okd-input-lg-padding-horizontal, 8px)
}

.dex-input-lg>.dex-input-box.auto-size {
  height: -webkit-fit-content;
  height: -moz-fit-content;
  height: fit-content;
  min-height: var(--dex-okd-input-lg-height)
}

.dex-input-lg>.dex-input-box.no-padding-left {
  padding-left: 0
}

.dex-input-lg>.dex-input-box.no-padding-right {
  padding-right: 0
}

.dex-input-lg>.dex-input-box.ta {
  height: 100%;
  padding: 8px
}

.dex-input-lg>.dex-input-box.auto-resize-auto-height {
  height: -webkit-fit-content;
  height: -moz-fit-content;
  height: fit-content;
  min-height: var(--dex-okd-input-lg-height)
}

.dex-input-lg>.dex-input-box.input-circle {
  border-radius: 100px
}

.dex-input-lg .dex-input-input {
  font-size: var(--dex-okd-input-lg-text-font-size);
  padding: calc(var(--dex-okd-input-lg-height)/2 - var(--dex-okd-input-lg-text-font-size)/2 - 2px) 0
}

.dex-input-lg .dex-input-input::-webkit-input-placeholder {
  font-size: var(--dex-okd-input-lg-text-font-size);
  font-weight: 400;
  text-overflow: ellipsis
}

.dex-input-lg .dex-input-input:-moz-placeholder {
  font-size: var(--dex-okd-input-lg-text-font-size);
  font-weight: 400;
  text-overflow: ellipsis
}

.dex-input-lg .dex-input-input::-ms-input-placeholder {
  font-size: var(--dex-okd-input-lg-text-font-size);
  font-weight: 400;
  text-overflow: ellipsis
}

.dex-input-lg .dex-input-input.ta {
  padding: 0
}

.dex-input-lg .dex-input-input.textarea-auto-resize {
  line-height: var(--dex-okd-input-lg-text-font-size)
}

.dex-input-lg .dex-input-placeholder {
  font-size: var(--dex-okd-input-lg-text-font-size);
  height: calc(var(--dex-okd-input-lg-text-font-size) + 2px);
  line-height: calc(var(--dex-okd-input-lg-text-font-size) + 2px)
}

.dex-input-lg .dex-input.dex-input-place-mode .dex-input-tips-box {
  min-height: calc(var(--dex-okd-input-lg-tip-line-height) + 6px);
  min-height: calc(var(--dex-okd-input-lg-tip-line-height) + var(--dex-okd-input-lg-tip-margin, 6px))
}

.dex-input-lg .dex-input-error {
  font-size: var(--dex-okd-input-lg-error-font-size);
  line-height: var(--dex-okd-input-lg-error-line-height);
  margin-top: 6px;
  margin-top: var(--dex-okd-input-lg-tip-margin, 6px)
}

.dex-input-lg .dex-input-help-text,
.dex-input-lg .dex-input-tips {
  font-size: var(--dex-okd-input-lg-tip-font-size);
  line-height: var(--dex-okd-input-lg-tip-line-height);
  margin-top: 6px;
  margin-top: var(--dex-okd-input-lg-tip-margin, 6px)
}

.dex-input-xs>.dex-input-box {
  border-radius: var(--dex-okd-input-xs-border-radius);
  height: var(--dex-okd-input-xs-height);
  padding: 0 8px;
  padding: 0 var(--dex-okd-input-xs-padding-horizontal, 8px)
}

.dex-input-xs>.dex-input-box.auto-size {
  height: -webkit-fit-content;
  height: -moz-fit-content;
  height: fit-content;
  min-height: var(--dex-okd-input-xs-height)
}

.dex-input-xs>.dex-input-box.no-padding-left {
  padding-left: 0
}

.dex-input-xs>.dex-input-box.no-padding-right {
  padding-right: 0
}

.dex-input-xs>.dex-input-box.ta {
  height: 100%;
  padding: 8px
}

.dex-input-xs>.dex-input-box.auto-resize-auto-height {
  height: -webkit-fit-content;
  height: -moz-fit-content;
  height: fit-content;
  min-height: var(--dex-okd-input-xs-height)
}

.dex-input-xs>.dex-input-box.input-circle {
  border-radius: 100px
}

.dex-input-xs .dex-input-input {
  font-size: var(--dex-okd-input-xs-text-font-size);
  padding: calc(var(--dex-okd-input-xs-height)/2 - var(--dex-okd-input-xs-text-font-size)/2 - 2px) 0
}

.dex-input-xs .dex-input-input::-webkit-input-placeholder {
  font-size: var(--dex-okd-input-xs-text-font-size);
  font-weight: 400;
  text-overflow: ellipsis
}

.dex-input-xs .dex-input-input:-moz-placeholder {
  font-size: var(--dex-okd-input-xs-text-font-size);
  font-weight: 400;
  text-overflow: ellipsis
}

.dex-input-xs .dex-input-input::-ms-input-placeholder {
  font-size: var(--dex-okd-input-xs-text-font-size);
  font-weight: 400;
  text-overflow: ellipsis
}

.dex-input-xs .dex-input-input.ta {
  padding: 0
}

.dex-input-xs .dex-input-input.textarea-auto-resize {
  line-height: var(--dex-okd-input-xs-text-font-size)
}

.dex-input-xs .dex-input-placeholder {
  font-size: var(--dex-okd-input-xs-text-font-size);
  height: calc(var(--dex-okd-input-xs-text-font-size) + 2px);
  line-height: calc(var(--dex-okd-input-xs-text-font-size) + 2px)
}

.dex-input-xs .dex-input.dex-input-place-mode .dex-input-tips-box {
  min-height: calc(var(--dex-okd-input-xs-tip-line-height) + 4px);
  min-height: calc(var(--dex-okd-input-xs-tip-line-height) + var(--dex-okd-input-xs-tip-margin, 4px))
}

.dex-input-xs .dex-input-error {
  font-size: var(--dex-okd-input-xs-error-font-size);
  line-height: var(--dex-okd-input-xs-error-line-height);
  margin-top: 4px;
  margin-top: var(--dex-okd-input-xs-tip-margin, 4px)
}

.dex-input-xs .dex-input-help-text,
.dex-input-xs .dex-input-tips {
  font-size: var(--dex-okd-input-xs-tip-font-size);
  line-height: var(--dex-okd-input-xs-tip-line-height);
  margin-top: 4px;
  margin-top: var(--dex-okd-input-xs-tip-margin, 4px)
}

.dex-input-sm>.dex-input-box {
  border-radius: var(--dex-okd-input-sm-border-radius);
  height: var(--dex-okd-input-sm-height);
  padding: 0 8px;
  padding: 0 var(--dex-okd-input-sm-padding-horizontal, 8px)
}

.dex-input-sm>.dex-input-box.auto-size {
  height: -webkit-fit-content;
  height: -moz-fit-content;
  height: fit-content;
  min-height: var(--dex-okd-input-sm-height)
}

.dex-input-sm>.dex-input-box.no-padding-left {
  padding-left: 0
}

.dex-input-sm>.dex-input-box.no-padding-right {
  padding-right: 0
}

.dex-input-sm>.dex-input-box.ta {
  height: 100%;
  padding: 8px
}

.dex-input-sm>.dex-input-box.auto-resize-auto-height {
  height: -webkit-fit-content;
  height: -moz-fit-content;
  height: fit-content;
  min-height: var(--dex-okd-input-sm-height)
}

.dex-input-sm>.dex-input-box.input-circle {
  border-radius: 100px
}

.dex-input-sm .dex-input-input {
  font-size: var(--dex-okd-input-sm-text-font-size);
  padding: calc(var(--dex-okd-input-sm-height)/2 - var(--dex-okd-input-sm-text-font-size)/2 - 2px) 0
}

.dex-input-sm .dex-input-input::-webkit-input-placeholder {
  font-size: var(--dex-okd-input-sm-text-font-size);
  font-weight: 400;
  text-overflow: ellipsis
}

.dex-input-sm .dex-input-input:-moz-placeholder {
  font-size: var(--dex-okd-input-sm-text-font-size);
  font-weight: 400;
  text-overflow: ellipsis
}

.dex-input-sm .dex-input-input::-ms-input-placeholder {
  font-size: var(--dex-okd-input-sm-text-font-size);
  font-weight: 400;
  text-overflow: ellipsis
}

.dex-input-sm .dex-input-input.ta {
  padding: 0
}

.dex-input-sm .dex-input-input.textarea-auto-resize {
  line-height: var(--dex-okd-input-sm-text-font-size)
}

.dex-input-sm .dex-input-placeholder {
  font-size: var(--dex-okd-input-sm-text-font-size);
  height: calc(var(--dex-okd-input-sm-text-font-size) + 2px);
  line-height: calc(var(--dex-okd-input-sm-text-font-size) + 2px)
}

.dex-input-sm .dex-input.dex-input-place-mode .dex-input-tips-box {
  min-height: calc(var(--dex-okd-input-sm-tip-line-height) + 4px);
  min-height: calc(var(--dex-okd-input-sm-tip-line-height) + var(--dex-okd-input-sm-tip-margin, 4px))
}

.dex-input-sm .dex-input-error {
  font-size: var(--dex-okd-input-sm-error-font-size);
  line-height: var(--dex-okd-input-sm-error-line-height);
  margin-top: 4px;
  margin-top: var(--dex-okd-input-sm-tip-margin, 4px)
}

.dex-input-sm .dex-input-help-text,
.dex-input-sm .dex-input-tips {
  font-size: var(--dex-okd-input-sm-tip-font-size);
  line-height: var(--dex-okd-input-sm-tip-line-height);
  margin-top: 4px;
  margin-top: var(--dex-okd-input-sm-tip-margin, 4px)
}

.dex-input-md>.dex-input-box {
  border-radius: var(--dex-okd-input-md-border-radius);
  height: var(--dex-okd-input-md-height);
  padding: 0 8px;
  padding: 0 var(--dex-okd-input-md-padding-horizontal, 8px)
}

.dex-input-md>.dex-input-box.auto-size {
  height: -webkit-fit-content;
  height: -moz-fit-content;
  height: fit-content;
  min-height: var(--dex-okd-input-md-height)
}

.dex-input-md>.dex-input-box.no-padding-left {
  padding-left: 0
}

.dex-input-md>.dex-input-box.no-padding-right {
  padding-right: 0
}

.dex-input-md>.dex-input-box.ta {
  height: 100%;
  padding: 8px
}

.dex-input-md>.dex-input-box.auto-resize-auto-height {
  height: -webkit-fit-content;
  height: -moz-fit-content;
  height: fit-content;
  min-height: var(--dex-okd-input-md-height)
}

.dex-input-md>.dex-input-box.input-circle {
  border-radius: 100px
}

.dex-input-md .dex-input-input {
  font-size: var(--dex-okd-input-md-text-font-size);
  padding: calc(var(--dex-okd-input-md-height)/2 - var(--dex-okd-input-md-text-font-size)/2 - 2px) 0
}

.dex-input-md .dex-input-input::-webkit-input-placeholder {
  font-size: var(--dex-okd-input-md-text-font-size);
  font-weight: 400;
  text-overflow: ellipsis
}

.dex-input-md .dex-input-input:-moz-placeholder {
  font-size: var(--dex-okd-input-md-text-font-size);
  font-weight: 400;
  text-overflow: ellipsis
}

.dex-input-md .dex-input-input::-ms-input-placeholder {
  font-size: var(--dex-okd-input-md-text-font-size);
  font-weight: 400;
  text-overflow: ellipsis
}

.dex-input-md .dex-input-input.ta {
  padding: 0
}

.dex-input-md .dex-input-input.textarea-auto-resize {
  line-height: var(--dex-okd-input-md-text-font-size)
}

.dex-input-md .dex-input-placeholder {
  font-size: var(--dex-okd-input-md-text-font-size);
  height: calc(var(--dex-okd-input-md-text-font-size) + 2px);
  line-height: calc(var(--dex-okd-input-md-text-font-size) + 2px)
}

.dex-input-md .dex-input.dex-input-place-mode .dex-input-tips-box {
  min-height: calc(var(--dex-okd-input-md-tip-line-height) + 4px);
  min-height: calc(var(--dex-okd-input-md-tip-line-height) + var(--dex-okd-input-md-tip-margin, 4px))
}

.dex-input-md .dex-input-error {
  font-size: var(--dex-okd-input-md-error-font-size);
  line-height: var(--dex-okd-input-md-error-line-height);
  margin-top: 4px;
  margin-top: var(--dex-okd-input-md-tip-margin, 4px)
}

.dex-input-md .dex-input-help-text,
.dex-input-md .dex-input-tips {
  font-size: var(--dex-okd-input-md-tip-font-size);
  line-height: var(--dex-okd-input-md-tip-line-height);
  margin-top: 4px;
  margin-top: var(--dex-okd-input-md-tip-margin, 4px)
}

.dex-input-prefix {
  height: 100%
}

.dex-input-prefix .prefix-icon {
  color: var(--dex-okd-input-icon-color)
}

.dex-input-prefix .select {
  padding-right: 8px
}

.dex-input-suffix {
  height: 100%
}

.dex-input-suffix .suffix-icon {
  color: var(--dex-okd-input-icon-color)
}

.dex-input-suffix .clean-icon {
  cursor: pointer
}

.dex-input-suffix .clean-icon:hover {
  color: #000;
  color: var(--dex-okd-input-search-suffix-icon-hover-color, #000)
}

.dex-input-suffix .error-icon {
  color: var(--dex-okd-input-error-tips-color)
}

.dex-input-xl .dex-input-prefix .prefix-icon {
  font-size: var(--dex-okd-input-xl-icon-size);
  margin-left: 0;
  margin-right: var(--dex-okd-input-xl-icon-margin)
}

.dex-input-xl .dex-input-suffix .suffix-icon {
  font-size: var(--dex-okd-input-xl-icon-size);
  margin-left: var(--dex-okd-input-xl-icon-margin);
  margin-right: 0
}

.dex-input-lg .dex-input-prefix .prefix-icon {
  font-size: var(--dex-okd-input-lg-icon-size);
  margin-left: 0;
  margin-right: var(--dex-okd-input-lg-icon-margin)
}

.dex-input-lg .dex-input-suffix .suffix-icon {
  font-size: var(--dex-okd-input-lg-icon-size);
  margin-left: var(--dex-okd-input-lg-icon-margin);
  margin-right: 0
}

.dex-input-xs .dex-input-prefix .prefix-icon {
  font-size: var(--dex-okd-input-xs-icon-size);
  margin-left: 0;
  margin-right: var(--dex-okd-input-xs-icon-margin)
}

.dex-input-xs .dex-input-suffix .suffix-icon {
  font-size: var(--dex-okd-input-xs-icon-size);
  margin-left: var(--dex-okd-input-xs-icon-margin);
  margin-right: 0
}

.dex-input-sm .dex-input-prefix .prefix-icon {
  font-size: var(--dex-okd-input-sm-icon-size);
  margin-left: 0;
  margin-right: var(--dex-okd-input-sm-icon-margin)
}

.dex-input-sm .dex-input-suffix .suffix-icon {
  font-size: var(--dex-okd-input-sm-icon-size);
  margin-left: var(--dex-okd-input-sm-icon-margin);
  margin-right: 0
}

.dex-input-md .dex-input-prefix .prefix-icon {
  font-size: var(--dex-okd-input-md-icon-size);
  margin-left: 0;
  margin-right: var(--dex-okd-input-md-icon-margin)
}

.dex-input-md .dex-input-suffix .suffix-icon {
  font-size: var(--dex-okd-input-md-icon-size);
  margin-left: var(--dex-okd-input-md-icon-margin);
  margin-right: 0
}

.dex-input:hover .dex-input-number-suffix:not(.operation-always) {
  opacity: 1
}

.dex-input-number-inner {
  overflow: hidden
}

.dex-input-number-suffix {
  align-items: center;
  border-left: 1px solid var(--dex-okd-input-number-suffix-border-color, var(--dex-okd-input-default-border-color));
  cursor: pointer;
  display: flex;
  flex-direction: column;
  height: 100%;
  justify-content: center;
  line-height: 0;
  margin-left: 6px;
  overflow: hidden;
  text-align: center;
  transition: opacity .5s;
  width: 24px
}

.dex-input-number-suffix:not(.operation-always) {
  opacity: 0
}

.dex-input-number-suffix-part {
  align-items: center;
  background: var(--dex-okd-input-number-default-add-icon-background);
  box-sizing: border-box;
  display: flex;
  flex: 1 1;
  justify-content: center;
  width: 100%
}

.dex-input-number-suffix-part .icon {
  color: var(--dex-okd-input-number-default-add-icon-color);
  font-size: 13px
}

.dex-input-number-suffix-part .hover,
.dex-input-number-suffix-part:not(.dex-input-number-suffix-part-disabled):hover {
  background: var(--dex-okd-input-number-hover-add-icon-background)
}

.dex-input-number-suffix-part .hover .icon,
.dex-input-number-suffix-part:not(.dex-input-number-suffix-part-disabled):hover .icon {
  color: var(--dex-okd-input-number-hover-add-icon-color)
}

.dex-input-number-suffix-part .active,
.dex-input-number-suffix-part:not(.dex-input-number-suffix-part-disabled):active {
  background: var(--dex-okd-input-number-active-add-icon-background)
}

.dex-input-number-suffix-part .active .icon,
.dex-input-number-suffix-part:not(.dex-input-number-suffix-part-disabled):active .icon {
  color: var(--dex-okd-input-number-active-add-icon-color)
}

.dex-input-number-suffix-part-disabled {
  cursor: not-allowed
}

.dex-input-number-suffix-line {
  background: var(--dex-okd-input-default-border-color);
  background: var(--dex-okd-input-number-suffix-border-color, var(--dex-okd-input-default-border-color));
  height: 1px;
  width: 100%
}

.dex-input-number-suffix .up {
  transform: rotate(180deg)
}

.dex-input-number-localization {
  text-align: right
}

.dex-input-number-localization-percent {
  color: var(--dex-okd-input-default-text-color);
  display: inline-block
}

.dex-input-xl .dex-input-number-suffix.xl {
  border-bottom-right-radius: calc(var(--dex-okd-input-xl-border-radius) - 1px);
  border-top-right-radius: calc(var(--dex-okd-input-xl-border-radius) - 1px)
}

.dex-input-lg .dex-input-number-suffix.lg {
  border-bottom-right-radius: calc(var(--dex-okd-input-lg-border-radius) - 1px);
  border-top-right-radius: calc(var(--dex-okd-input-lg-border-radius) - 1px)
}

.dex-input-xs .dex-input-number-suffix.xs {
  border-bottom-right-radius: calc(var(--dex-okd-input-xs-border-radius) - 1px);
  border-top-right-radius: calc(var(--dex-okd-input-xs-border-radius) - 1px)
}

.dex-input-sm .dex-input-number-suffix.sm {
  border-bottom-right-radius: calc(var(--dex-okd-input-sm-border-radius) - 1px);
  border-top-right-radius: calc(var(--dex-okd-input-sm-border-radius) - 1px)
}

.dex-input-md .dex-input-number-suffix.md {
  border-bottom-right-radius: calc(var(--dex-okd-input-md-border-radius) - 1px);
  border-top-right-radius: calc(var(--dex-okd-input-md-border-radius) - 1px)
}

.index_suffixIcon__ceF6i {
    background: var(--wallet-okd-color-background-surface-pressed);
    border-radius: 6px;
    color: var(--wallet-okd-color-content-contrast);
    cursor: pointer;
    height: 20px;
    line-height: 20px;
    text-align: center;
    width: 20px
}

.index_input__T5-kw {
    align-self: center;
    flex: 1 1
}

@media (min-width: 1270px) {
    .index_input__T5-kw {
        flex:auto
    }
}

.index_search-container__ReAAJ {
    position: relative;
    width: 240px
}

@media (max-width: 767px) {
    .index_search-container__ReAAJ {
        width:100%
    }
}

.index_search-container__ReAAJ .index_innerClass__U0WU5 {
    height: 36px
}

.index_search-container__ReAAJ .index_searchMask__WoOLZ {
    background: transparent;
    border-radius: 8px;
    bottom: 0;
    cursor: pointer;
    left: 0;
    position: absolute;
    right: 0;
    top: 0;
    width: 100%;
    z-index: 10
}

.index_search-container__ReAAJ .index_searchMask__WoOLZ:hover {
    background: var(--wallet-okd-color-background-surface-pressed);
    opacity: .2
}

.index_iconContent__c-zMG {
    align-items: center;
    background: var(--wallet-okd-color-background-surface-primary);
    border-radius: 8px;
    display: flex;
    height: 36px;
    padding: 8px
}

.index_icon-search__-EBlG {
    align-self: center;
    color: var(--wallet-okd-color-content-contrast);
    cursor: pointer
}

.index_search-top__IE4K9 {
    display: flex;
    flex: 1 1
}

.index_cancel__ju1kk {
    align-self: center;
    margin-left: 12px
}

.index_dialog-container__lXbs2 {
    padding: 16px
}

.wallet-a11y-text {
    clip: rect(0,0,0,0);
    border-width: 0;
    height: 1px;
    margin: -1px;
    overflow: hidden;
    padding: 0;
    position: absolute;
    white-space: nowrap;
    width: 1px
}

.wallet-plain-button {
    color: inherit;
    cursor: pointer;
    font: inherit;
    text-align: inherit
}

.wallet-plain-button:focus-visible {
    border-radius: 4px;
    outline: 2px solid var(--wallet-okd-color-border-focus);
    outline-color: var(--wallet-okd-color-border-focus);
    outline-offset: 2px;
    outline-style: solid;
    outline-width: 2px
}

.wallet-plain-button[disabled] {
    cursor: not-allowed
}

.wallet-plain-button-as-div {
    display: block;
    line-height: inherit;
    width: 100%
}

.theme-light {
    --wallet-okd-input-default-text-color: var(--wallet-okd-color-content-primary);
    --wallet-okd-input-default-placeholder-color: var(--wallet-okd-color-content-disabled);
    --wallet-okd-input-default-border-color: transparent;
    --wallet-okd-input-default-caret-color: var(--wallet-okd-color-content-primary);
    --wallet-okd-input-default-shadow: 0px 0px 0px 0px transparent;
    --wallet-okd-input-default-background: #f3f3f3;
    --wallet-okd-input-hover-text-color: var(--wallet-okd-color-content-primary);
    --wallet-okd-input-hover-placeholder-color: var(--wallet-okd-color-content-disabled);
    --wallet-okd-input-hover-border-color: transparent;
    --wallet-okd-input-hover-caret-color: var(--wallet-okd-color-content-primary);
    --wallet-okd-input-hover-shadow: 0 0 0 0 transparent;
    --wallet-okd-input-hover-background: #f3f3f3;
    --wallet-okd-input-focus-text-color: var(--wallet-okd-color-content-primary);
    --wallet-okd-input-focus-placeholder-color: var(--wallet-okd-color-content-disabled);
    --wallet-okd-input-focus-border-color: var(--wallet-okd-color-border-selected);
    --wallet-okd-input-focus-caret-color: var(--wallet-okd-color-content-brand);
    --wallet-okd-input-focus-shadow: 0px 0px 0px 0px #00000000;
    --wallet-okd-input-focus-background: #f3f3f3;
    --wallet-okd-input-disabled-text-color: var(--wallet-okd-color-content-disabled);
    --wallet-okd-input-disabled-placeholder-color: var(--wallet-okd-color-content-disabled);
    --wallet-okd-input-disabled-border-color: var(--wallet-okd-color-border-primary);
    --wallet-okd-input-disabled-caret-color: var(--wallet-okd-color-content-disabled);
    --wallet-okd-input-disabled-shadow: 0 0 0 0 transparent;
    --wallet-okd-input-disabled-background: #f3f3f3;
    --wallet-okd-input-error-text-color: var(--wallet-okd-color-content-primary);
    --wallet-okd-input-error-placeholder-color: var(--wallet-okd-color-content-disabled);
    --wallet-okd-input-error-border-color: var(--wallet-okd-color-semantic-negative);
    --wallet-okd-input-error-caret-color: var(--wallet-okd-color-content-brand);
    --wallet-okd-input-error-shadow: var(--wallet-okd-shadow-sm);
    --wallet-okd-input-error-background: #f3f3f3;
    --wallet-okd-input-error-tips-color: var(--wallet-okd-color-semantic-negative);
    --wallet-okd-input-tips-text-color: var(--wallet-okd-color-content-contrast);
    --wallet-okd-input-icon-color: var(--wallet-okd-color-content-contrast);
    --wallet-okd-input-label-color: var(--wallet-okd-color-content-primary);
    --wallet-okd-input-action-color: var(--wallet-okd-color-content-primary);
    --wallet-okd-input-md-label-font-size: var(--wallet-okd-font-size-md);
    --wallet-okd-input-sm-label-font-size: var(--wallet-okd-font-size-xs);
    --wallet-okd-input-xs-label-font-size: var(--wallet-okd-font-size-xs);
    --wallet-okd-input-md-label-line-height: var(--wallet-okd-line-height-md);
    --wallet-okd-input-sm-label-line-height: var(--wallet-okd-line-height-xs);
    --wallet-okd-input-xs-label-line-height: var(--wallet-okd-line-height-xs);
    --wallet-okd-input-md-action-font-size: var(--wallet-okd-font-size-md);
    --wallet-okd-input-sm-action-font-size: var(--wallet-okd-font-size-xs);
    --wallet-okd-input-xs-action-font-size: var(--wallet-okd-font-size-xs);
    --wallet-okd-input-md-action-line-height: var(--wallet-okd-line-height-md);
    --wallet-okd-input-sm-action-line-height: var(--wallet-okd-line-height-xs);
    --wallet-okd-input-xs-action-line-height: var(--wallet-okd-line-height-xs);
    --wallet-okd-input-md-height: 40px;
    --wallet-okd-input-md-text-font-size: var(--wallet-okd-font-size-md);
    --wallet-okd-input-md-border-radius: 8px;
    --wallet-okd-input-md-error-font-size: 14px;
    --wallet-okd-input-md-error-line-height: 16px;
    --wallet-okd-input-md-tip-font-size: 14px;
    --wallet-okd-input-md-tip-line-height: 16px;
    --wallet-okd-input-md-icon-size: 20px;
    --wallet-okd-input-md-icon-margin: 6px;
    --wallet-okd-input-sm-height: 32px;
    --wallet-okd-input-sm-text-font-size: 12px;
    --wallet-okd-input-sm-border-radius: 8px;
    --wallet-okd-input-sm-error-font-size: var(--wallet-okd-font-size-xs);
    --wallet-okd-input-sm-error-line-height: var(--wallet-okd-line-height-xs);
    --wallet-okd-input-sm-tip-font-size: var(--wallet-okd-font-size-xs);
    --wallet-okd-input-sm-tip-line-height: var(--wallet-okd-line-height-xs);
    --wallet-okd-input-sm-icon-size: 16px;
    --wallet-okd-input-sm-icon-margin: 4px;
    --wallet-okd-input-xs-height: 28px;
    --wallet-okd-input-xs-text-font-size: var(--wallet-okd-font-size-xs);
    --wallet-okd-input-xs-border-radius: 8px;
    --wallet-okd-input-xs-error-font-size: var(--wallet-okd-font-size-xs);
    --wallet-okd-input-xs-error-line-height: var(--wallet-okd-line-height-xs);
    --wallet-okd-input-xs-tip-font-size: var(--wallet-okd-font-size-xs);
    --wallet-okd-input-xs-tip-line-height: var(--wallet-okd-line-height-xs);
    --wallet-okd-input-xs-icon-size: 16px;
    --wallet-okd-input-xs-icon-margin: 4px;
    --wallet-okd-input-number-default-add-icon-color: var(--wallet-okd-color-content-disabled);
    --wallet-okd-input-number-default-add-icon-background: transparent;
    --wallet-okd-input-number-hover-add-icon-color: var(--wallet-okd-color-content-primary);
    --wallet-okd-input-number-hover-add-icon-background: var(--wallet-okd-color-background-surface-pressed);
    --wallet-okd-input-number-active-add-icon-color: #bdbdbd;
    --wallet-okd-input-number-active-add-icon-background: #ebebeb;
    --wallet-okd-input-number-disabled-add-icon-color: var(--wallet-okd-color-content-disabled);
    --wallet-okd-input-number-disabled-add-icon-background: var(--wallet-okd-color-content-disabled);
    --wallet-okd-input-code-common-btn-color: #0569ff;
    --wallet-okd-input-code-common-btn-disabled-color: #bdbdbd;
    --wallet-okd-input-code-common-count-color: var(--wallet-okd-color-content-disabled);
    --wallet-okd-input-code-md-btn-font-size: var(--wallet-okd-font-size-md);
    --wallet-okd-input-code-md-btn-line-height: var(--wallet-okd-line-height-md);
    --wallet-okd-input-code-md-count-font-size: var(--wallet-okd-font-size-md);
    --wallet-okd-input-code-md-count-line-height: var(--wallet-okd-line-height-md);
    --wallet-okd-input-code-sm-btn-font-size: var(--wallet-okd-font-size-xs);
    --wallet-okd-input-code-sm-btn-line-height: var(--wallet-okd-line-height-xs);
    --wallet-okd-input-code-sm-count-font-size: var(--wallet-okd-font-size-xs);
    --wallet-okd-input-code-sm-count-line-height: var(--wallet-okd-line-height-xs);
    --wallet-okd-input-code-xs-btn-font-size: var(--wallet-okd-font-size-xs);
    --wallet-okd-input-code-xs-btn-line-height: var(--wallet-okd-line-height-xs);
    --wallet-okd-input-code-xs-count-font-size: var(--wallet-okd-font-size-xs);
    --wallet-okd-input-code-xs-count-line-height: var(--wallet-okd-line-height-xs);
    --wallet-okd-input-search-default-text-color: var(--wallet-okd-color-content-primary);
    --wallet-okd-input-search-default-placeholder-color: var(--wallet-okd-color-content-disabled);
    --wallet-okd-input-search-default-border-color: transparent;
    --wallet-okd-input-search-default-caret-color: var(--wallet-okd-color-content-primary);
    --wallet-okd-input-search-default-shadow: 0px 0px 0px 0px transparent;
    --wallet-okd-input-search-default-background: #f3f3f3;
    --wallet-okd-input-search-hover-text-color: var(--wallet-okd-color-content-primary);
    --wallet-okd-input-search-hover-placeholder-color: var(--wallet-okd-color-content-disabled);
    --wallet-okd-input-search-hover-border-color: transparent;
    --wallet-okd-input-search-hover-caret-color: var(--wallet-okd-color-content-primary);
    --wallet-okd-input-search-hover-shadow: 0px 0px 0px 0px #0000001a;
    --wallet-okd-input-search-hover-background: #f3f3f3;
    --wallet-okd-input-search-focus-text-color: var(--wallet-okd-color-content-primary);
    --wallet-okd-input-search-focus-placeholder-color: var(--wallet-okd-color-content-disabled);
    --wallet-okd-input-search-focus-border-color: var(--wallet-okd-color-border-selected);
    --wallet-okd-input-search-focus-caret-color: var(--wallet-okd-color-content-brand);
    --wallet-okd-input-search-focus-shadow: 0px 0px 0px 0px #00000000;
    --wallet-okd-input-search-focus-background: #f3f3f3;
    --wallet-okd-input-search-error-text-color: var(--wallet-okd-color-content-primary);
    --wallet-okd-input-search-error-placeholder-color: var(--wallet-okd-color-content-disabled);
    --wallet-okd-input-search-error-border-color: var(--wallet-okd-color-semantic-negative);
    --wallet-okd-input-search-error-caret-color: var(--wallet-okd-color-content-primary);
    --wallet-okd-input-search-error-shadow: 0 1px 2px 0 #0000000d;
    --wallet-okd-input-search-error-background: #f3f3f3;
    --wallet-okd-input-search-disabled-text-color: var(--wallet-okd-color-content-disabled);
    --wallet-okd-input-search-disabled-placeholder-color: var(--wallet-okd-color-content-disabled);
    --wallet-okd-input-search-disabled-border-color: transparent;
    --wallet-okd-input-search-disabled-caret-color: var(--wallet-okd-color-content-disabled);
    --wallet-okd-input-search-disabled-shadow: 0px 0px 0px 0px transparent;
    --wallet-okd-input-search-disabled-background: #f3f3f3;
    --wallet-okd-input-search-prefix-icon-color: var(--wallet-okd-color-content-contrast);
    --wallet-okd-input-search-prefix-icon-size: 16px;
    --wallet-okd-input-search-suffix-icon-color: var(--wallet-okd-color-content-contrast);
    --wallet-okd-input-search-suffix-icon-size: 13px;
    --wallet-okd-input-search-error-tips-color: var(--wallet-okd-color-semantic-negative);
    --wallet-okd-input-verify-md-width: 40px;
    --wallet-okd-input-verify-md-height: 44px;
    --wallet-okd-input-lg-height: 44px;
    --wallet-okd-input-lg-border-radius: 8px;
    --wallet-okd-input-lg-label-font-size: 14px;
    --wallet-okd-input-lg-label-line-height: 20px;
    --wallet-okd-input-lg-label-margin: 8px;
    --wallet-okd-input-lg-action-font-size: 14px;
    --wallet-okd-input-lg-action-line-height: 20px;
    --wallet-okd-input-lg-text-font-size: 14px;
    --wallet-okd-input-lg-error-font-size: 14px;
    --wallet-okd-input-lg-error-line-height: 16px;
    --wallet-okd-input-lg-tip-margin: 4px;
    --wallet-okd-input-lg-tip-font-size: 14px;
    --wallet-okd-input-lg-tip-line-height: 16px;
    --wallet-okd-input-md-label-margin: 8px;
    --wallet-okd-input-md-tip-margin: 4px;
    --wallet-okd-input-sm-label-margin: 8px;
    --wallet-okd-input-sm-tip-margin: 4px;
    --wallet-okd-input-xs-label-margin: 8px;
    --wallet-okd-input-xs-tip-margin: 4px;
    --wallet-okd-input-xl-height: 48px;
    --wallet-okd-input-xl-text-font-size: 14px;
    --wallet-okd-input-xl-border-radius: 8px;
    --wallet-okd-input-lg-icon-size: 20px;
    --wallet-okd-input-lg-icon-margin: 8px;
    --wallet-okd-input-xl-label-line-height: 20px;
    --wallet-okd-input-xl-icon-size: 20px;
    --wallet-okd-input-xl-icon-margin: 12px;
    --wallet-okd-input-xl-error-font-size: 14px;
    --wallet-okd-input-xl-error-line-height: 16px;
    --wallet-okd-input-xl-action-font-size: 14px;
    --wallet-okd-input-xl-action-line-height: 20px;
    --wallet-okd-input-xl-label-margin: 8px;
    --wallet-okd-input-xl-label-font-size: 14px;
    --wallet-okd-input-xl-tip-font-size: 14px;
    --wallet-okd-input-xl-tip-margin: 6px;
    --wallet-okd-input-xl-tip-line-height: 16px;
    --wallet-okd-input-verify-xl-height: px;
    --wallet-okd-input-verify-xl-width: px;
    --wallet-okd-input-xs-padding-horizontal: 8px;
    --wallet-okd-input-sm-padding-horizontal: 8px;
    --wallet-okd-input-md-padding-horizontal: 8px;
    --wallet-okd-input-lg-padding-horizontal: 12px;
    --wallet-okd-input-xl-padding-horizontal: 12px;
    --wallet-okd-input-reversed-default-text-color: var(--wallet-okd-color-content-inverse);
    --wallet-okd-input-reversed-default-placeholder-color: hsla(0,0%,100%,.36);
    --wallet-okd-input-reversed-default-border-color: transparent;
    --wallet-okd-input-reversed-default-caret-color: var(--wallet-okd-color-content-inverse);
    --wallet-okd-input-reversed-default-shadow: 0 0 0 0 transparent;
    --wallet-okd-input-reversed-default-background: #1d1d1d;
    --wallet-okd-input-reversed-hover-text-color: var(--wallet-okd-color-content-inverse);
    --wallet-okd-input-reversed-hover-placeholder-color: hsla(0,0%,100%,.36);
    --wallet-okd-input-reversed-hover-border-color: var(--wallet-okd-color-transparent-black);
    --wallet-okd-input-reversed-hover-caret-color: var(--wallet-okd-color-content-contrast);
    --wallet-okd-input-reversed-hover-shadow: 0px 0px 0px 0px transparent;
    --wallet-okd-input-reversed-hover-background: #1d1d1d;
    --wallet-okd-input-reversed-focus-text-color: var(--wallet-okd-color-content-inverse);
    --wallet-okd-input-reversed-focus-placeholder-color: hsla(0,0%,100%,.36);
    --wallet-okd-input-reversed-focus-border-color: #fff;
    --wallet-okd-input-reversed-focus-caret-color: var(--wallet-okd-color-semantic-highlight);
    --wallet-okd-input-reversed-focus-shadow: 0px 0px 0px 0px #ffffff00;
    --wallet-okd-input-reversed-focus-background: #1d1d1d;
    --wallet-okd-input-reversed-disabled-text-color: #545454;
    --wallet-okd-input-reversed-disabled-placeholder-color: #545454;
    --wallet-okd-input-reversed-disabled-border-color: #383838;
    --wallet-okd-input-reversed-disabled-caret-color: #0569ff;
    --wallet-okd-input-reversed-disabled-shadow: 0 0 0 0 transparent;
    --wallet-okd-input-reversed-disabled-background: #1d1d1d;
    --wallet-okd-input-reversed-error-text-color: var(--wallet-okd-color-content-inverse);
    --wallet-okd-input-reversed-error-placeholder-color: hsla(0,0%,100%,.36);
    --wallet-okd-input-reversed-error-border-color: var(--wallet-okd-color-semantic-negative);
    --wallet-okd-input-reversed-error-caret-color: var(--wallet-okd-color-content-contrast);
    --wallet-okd-input-reversed-error-shadow: 0 0 0 0 transparent;
    --wallet-okd-input-reversed-error-background: #1d1d1d;
    --wallet-okd-input-reversed-error-tips-color: var(--wallet-okd-color-semantic-negative);
    --wallet-okd-input-reversed-tips-text-color: var(--wallet-okd-color-content-contrast);
    --wallet-okd-input-reversed-icon-color: #929292;
    --wallet-okd-input-reversed-label-color: #dbdbdb;
    --wallet-okd-input-reversed-action-color: var(--wallet-okd-color-content-inverse);
    --wallet-okd-input-number-reversed-default-add-icon-color: #6e6e6e;
    --wallet-okd-input-number-reversed-default-add-icon-background: transparent;
    --wallet-okd-input-number-reversed-hover-add-icon-color: #fff;
    --wallet-okd-input-number-reversed-hover-add-icon-background: #272727;
    --wallet-okd-input-number-reversed-active-add-icon-color: #6e6e6e;
    --wallet-okd-input-number-reversed-active-add-icon-background: transparent;
    --wallet-okd-input-number-reversed-disabled-add-icon-color: #6e6e6e;
    --wallet-okd-input-number-reversed-disabled-add-icon-background: transparent;
    --wallet-okd-input-code-reversed-common-btn-color: var(--wallet-okd-color-content-inverse);
    --wallet-okd-input-code-reversed-common-btn-disabled-color: #545454;
    --wallet-okd-input-code-reversed-common-count-color: #545454;
    --wallet-okd-input-search-reversed-default-text-color: #fff;
    --wallet-okd-input-search-reversed-default-placeholder-color: #666;
    --wallet-okd-input-search-reversed-default-border-color: transparent;
    --wallet-okd-input-search-reversed-default-caret-color: #fff;
    --wallet-okd-input-search-reversed-default-shadow: 0px 0px 0px 0px #f9f9f91a;
    --wallet-okd-input-search-reversed-default-background: #1d1d1d;
    --wallet-okd-input-search-reversed-hover-text-color: #fff;
    --wallet-okd-input-search-reversed-hover-placeholder-color: #3d3d3d;
    --wallet-okd-input-search-reversed-hover-border-color: transparent;
    --wallet-okd-input-search-reversed-hover-caret-color: #fff;
    --wallet-okd-input-search-reversed-hover-shadow: 0px 0px 0px 2px #f9f9f91a;
    --wallet-okd-input-search-reversed-hover-background: #1d1d1d;
    --wallet-okd-input-search-reversed-focus-text-color: #fff;
    --wallet-okd-input-search-reversed-focus-placeholder-color: #3d3d3d;
    --wallet-okd-input-search-reversed-focus-border-color: #fff;
    --wallet-okd-input-search-reversed-focus-caret-color: var(--wallet-okd-color-semantic-highlight);
    --wallet-okd-input-search-reversed-focus-shadow: 0 0 0 0 transparent;
    --wallet-okd-input-search-reversed-focus-background: #1d1d1d;
    --wallet-okd-input-search-reversed-error-text-color: #fff;
    --wallet-okd-input-search-reversed-error-placeholder-color: #3d3d3d;
    --wallet-okd-input-search-reversed-error-border-color: #eb4b6d;
    --wallet-okd-input-search-reversed-error-caret-color: var(--wallet-okd-color-semantic-highlight);
    --wallet-okd-input-search-reversed-error-shadow: 0 0 0 0 transparent;
    --wallet-okd-input-search-reversed-error-background: #000;
    --wallet-okd-input-search-reversed-disabled-text-color: #6e6e6e;
    --wallet-okd-input-search-reversed-disabled-placeholder-color: #3d3d3d;
    --wallet-okd-input-search-reversed-disabled-border-color: transparent;
    --wallet-okd-input-search-reversed-disabled-caret-color: transparent;
    --wallet-okd-input-search-reversed-disabled-shadow: 0 0 0 0 transparent;
    --wallet-okd-input-search-reversed-disabled-background: #1a1a1a;
    --wallet-okd-input-search-reversed-prefix-icon-color: #bdbdbd;
    --wallet-okd-input-search-reversed-error-tips-color: #eb4b6d;
    --wallet-okd-input-search-suffix-icon-hover-color: #000;
    --wallet-okd-input-verify-xl-border-radius: 8pxpx;
    --wallet-okd-input-code-xl-btn-font-size: 12px;
    --wallet-okd-input-number-suffix-border-color: var(--wallet-okd-color-border-primary);
    --wallet-okd-input-verify-md-border-radius: 6px;
    --wallet-okd-input-verify-md-text-font-size: 26px;
    --wallet-okd-input-verify-md-margin: 8px;
    --wallet-okd-input-readonly-text-color: var(--wallet-okd-color-content-primary);
    --wallet-okd-input-readonly-placeholder-color: var(--wallet-okd-input-default-placeholder-color);
    --wallet-okd-input-readonly-border-color: var(--wallet-okd-color-border-primary);
    --wallet-okd-input-readonly-caret-color: var(--wallet-okd-input-default-caret-color);
    --wallet-okd-input-readonly-shadow: var(--wallet-okd-input-default-shadow);
    --wallet-okd-input-readonly-background: var(--wallet-okd-color-transparent-white)
}

.theme-dark {
    --wallet-okd-input-default-text-color: var(--wallet-okd-color-content-primary);
    --wallet-okd-input-default-placeholder-color: var(--wallet-okd-color-content-disabled);
    --wallet-okd-input-default-border-color: transparent;
    --wallet-okd-input-default-caret-color: var(--wallet-okd-color-content-primary);
    --wallet-okd-input-default-shadow: 0px 0px 0px 0px transparent;
    --wallet-okd-input-default-background: #1d1d1d;
    --wallet-okd-input-hover-text-color: var(--wallet-okd-color-content-primary);
    --wallet-okd-input-hover-placeholder-color: var(--wallet-okd-color-content-disabled);
    --wallet-okd-input-hover-border-color: transparent;
    --wallet-okd-input-hover-caret-color: var(--wallet-okd-color-content-primary);
    --wallet-okd-input-hover-shadow: 0px 0px 0px 0px #fafafa33;
    --wallet-okd-input-hover-background: #1d1d1d;
    --wallet-okd-input-focus-text-color: var(--wallet-okd-color-content-primary);
    --wallet-okd-input-focus-placeholder-color: var(--wallet-okd-color-content-disabled);
    --wallet-okd-input-focus-border-color: var(--wallet-okd-color-border-selected);
    --wallet-okd-input-focus-caret-color: var(--wallet-okd-color-content-brand);
    --wallet-okd-input-focus-shadow: 0px 0px 0px 0px #00000000;
    --wallet-okd-input-focus-background: #1d1d1d;
    --wallet-okd-input-disabled-text-color: var(--wallet-okd-color-content-disabled);
    --wallet-okd-input-disabled-placeholder-color: var(--wallet-okd-color-content-disabled);
    --wallet-okd-input-disabled-border-color: var(--wallet-okd-color-border-primary);
    --wallet-okd-input-disabled-caret-color: var(--wallet-okd-color-content-disabled);
    --wallet-okd-input-disabled-shadow: var(--wallet-okd-shadow-sm);
    --wallet-okd-input-disabled-background: #1d1d1d;
    --wallet-okd-input-error-text-color: var(--wallet-okd-color-content-primary);
    --wallet-okd-input-error-placeholder-color: var(--wallet-okd-color-content-disabled);
    --wallet-okd-input-error-border-color: var(--wallet-okd-color-semantic-negative);
    --wallet-okd-input-error-caret-color: var(--wallet-okd-color-content-brand);
    --wallet-okd-input-error-shadow: var(--wallet-okd-shadow-sm);
    --wallet-okd-input-error-background: #1d1d1d;
    --wallet-okd-input-error-tips-color: var(--wallet-okd-color-semantic-negative);
    --wallet-okd-input-tips-text-color: var(--wallet-okd-color-content-contrast);
    --wallet-okd-input-icon-color: var(--wallet-okd-color-content-contrast);
    --wallet-okd-input-label-color: var(--wallet-okd-color-content-primary);
    --wallet-okd-input-action-color: var(--wallet-okd-color-content-primary);
    --wallet-okd-input-md-label-font-size: var(--wallet-okd-font-size-md);
    --wallet-okd-input-sm-label-font-size: var(--wallet-okd-font-size-xs);
    --wallet-okd-input-xs-label-font-size: var(--wallet-okd-font-size-xs);
    --wallet-okd-input-md-label-line-height: 20px;
    --wallet-okd-input-sm-label-line-height: var(--wallet-okd-line-height-xs);
    --wallet-okd-input-xs-label-line-height: var(--wallet-okd-line-height-xs);
    --wallet-okd-input-md-action-font-size: var(--wallet-okd-font-size-md);
    --wallet-okd-input-sm-action-font-size: var(--wallet-okd-font-size-xs);
    --wallet-okd-input-xs-action-font-size: var(--wallet-okd-font-size-xs);
    --wallet-okd-input-md-action-line-height: 20px;
    --wallet-okd-input-sm-action-line-height: var(--wallet-okd-line-height-xs);
    --wallet-okd-input-xs-action-line-height: var(--wallet-okd-line-height-xs);
    --wallet-okd-input-md-height: 40px;
    --wallet-okd-input-md-text-font-size: var(--wallet-okd-font-size-md);
    --wallet-okd-input-md-border-radius: 8px;
    --wallet-okd-input-md-error-font-size: 14px;
    --wallet-okd-input-md-error-line-height: 16px;
    --wallet-okd-input-md-tip-font-size: 14px;
    --wallet-okd-input-md-tip-line-height: 16px;
    --wallet-okd-input-md-icon-size: 20px;
    --wallet-okd-input-md-icon-margin: 6px;
    --wallet-okd-input-sm-height: 32px;
    --wallet-okd-input-sm-text-font-size: var(--wallet-okd-font-size-xs);
    --wallet-okd-input-sm-border-radius: 8px;
    --wallet-okd-input-sm-error-font-size: var(--wallet-okd-font-size-xs);
    --wallet-okd-input-sm-error-line-height: var(--wallet-okd-line-height-xs);
    --wallet-okd-input-sm-tip-font-size: var(--wallet-okd-font-size-xs);
    --wallet-okd-input-sm-tip-line-height: var(--wallet-okd-line-height-xs);
    --wallet-okd-input-sm-icon-size: 16px;
    --wallet-okd-input-sm-icon-margin: 4px;
    --wallet-okd-input-xs-height: 28px;
    --wallet-okd-input-xs-text-font-size: var(--wallet-okd-font-size-xs);
    --wallet-okd-input-xs-border-radius: 8px;
    --wallet-okd-input-xs-error-font-size: var(--wallet-okd-font-size-xs);
    --wallet-okd-input-xs-error-line-height: var(--wallet-okd-line-height-xs);
    --wallet-okd-input-xs-tip-font-size: var(--wallet-okd-font-size-xs);
    --wallet-okd-input-xs-tip-line-height: var(--wallet-okd-line-height-xs);
    --wallet-okd-input-xs-icon-size: 16px;
    --wallet-okd-input-xs-icon-margin: 4px;
    --wallet-okd-input-number-default-add-icon-color: var(--wallet-okd-color-content-disabled);
    --wallet-okd-input-number-default-add-icon-background: transparent;
    --wallet-okd-input-number-hover-add-icon-color: var(--wallet-okd-color-content-primary);
    --wallet-okd-input-number-hover-add-icon-background: var(--wallet-okd-color-background-surface-pressed);
    --wallet-okd-input-number-active-add-icon-color: #e3e3e3;
    --wallet-okd-input-number-active-add-icon-background: #404040;
    --wallet-okd-input-number-disabled-add-icon-color: var(--wallet-okd-color-content-disabled);
    --wallet-okd-input-number-disabled-add-icon-background: var(--wallet-okd-color-content-disabled);
    --wallet-okd-input-code-common-btn-color: #4283ff;
    --wallet-okd-input-code-common-btn-disabled-color: #6c6c6c;
    --wallet-okd-input-code-common-count-color: var(--wallet-okd-color-content-disabled);
    --wallet-okd-input-code-md-btn-font-size: var(--wallet-okd-font-size-md);
    --wallet-okd-input-code-md-btn-line-height: var(--wallet-okd-line-height-md);
    --wallet-okd-input-code-md-count-font-size: var(--wallet-okd-font-size-md);
    --wallet-okd-input-code-md-count-line-height: var(--wallet-okd-line-height-md);
    --wallet-okd-input-code-sm-btn-font-size: var(--wallet-okd-font-size-xs);
    --wallet-okd-input-code-sm-btn-line-height: var(--wallet-okd-line-height-xs);
    --wallet-okd-input-code-sm-count-font-size: var(--wallet-okd-font-size-xs);
    --wallet-okd-input-code-sm-count-line-height: var(--wallet-okd-line-height-xs);
    --wallet-okd-input-code-xs-btn-font-size: var(--wallet-okd-font-size-xs);
    --wallet-okd-input-code-xs-btn-line-height: var(--wallet-okd-line-height-xs);
    --wallet-okd-input-code-xs-count-font-size: var(--wallet-okd-font-size-xs);
    --wallet-okd-input-code-xs-count-line-height: var(--wallet-okd-line-height-xs);
    --wallet-okd-input-search-default-text-color: var(--wallet-okd-color-content-primary);
    --wallet-okd-input-search-default-placeholder-color: var(--wallet-okd-color-content-disabled);
    --wallet-okd-input-search-default-border-color: transparent;
    --wallet-okd-input-search-default-caret-color: var(--wallet-okd-color-content-primary);
    --wallet-okd-input-search-default-shadow: 0px 0px 0px 0px transparent;
    --wallet-okd-input-search-default-background: #1d1d1d;
    --wallet-okd-input-search-hover-text-color: var(--wallet-okd-color-content-primary);
    --wallet-okd-input-search-hover-placeholder-color: var(--wallet-okd-color-content-disabled);
    --wallet-okd-input-search-hover-border-color: transparent;
    --wallet-okd-input-search-hover-caret-color: var(--wallet-okd-color-content-primary);
    --wallet-okd-input-search-hover-shadow: 0px 0px 0px 0px #0000001a;
    --wallet-okd-input-search-hover-background: #1d1d1d;
    --wallet-okd-input-search-focus-text-color: var(--wallet-okd-color-content-primary);
    --wallet-okd-input-search-focus-placeholder-color: var(--wallet-okd-color-content-disabled);
    --wallet-okd-input-search-focus-border-color: var(--wallet-okd-color-border-selected);
    --wallet-okd-input-search-focus-caret-color: var(--wallet-okd-color-content-brand);
    --wallet-okd-input-search-focus-shadow: 0px 0px 0px 0px #00000000;
    --wallet-okd-input-search-focus-background: #1d1d1d;
    --wallet-okd-input-search-error-text-color: var(--wallet-okd-color-content-primary);
    --wallet-okd-input-search-error-placeholder-color: var(--wallet-okd-color-content-disabled);
    --wallet-okd-input-search-error-border-color: var(--wallet-okd-color-semantic-negative);
    --wallet-okd-input-search-error-caret-color: var(--wallet-okd-color-semantic-highlight);
    --wallet-okd-input-search-error-shadow: 0 1px 2px 0 #0000000d;
    --wallet-okd-input-search-error-background: #1d1d1d;
    --wallet-okd-input-search-disabled-text-color: var(--wallet-okd-color-content-disabled);
    --wallet-okd-input-search-disabled-placeholder-color: var(--wallet-okd-color-content-disabled);
    --wallet-okd-input-search-disabled-border-color: transparent;
    --wallet-okd-input-search-disabled-caret-color: var(--wallet-okd-color-content-disabled);
    --wallet-okd-input-search-disabled-shadow: 0px 0px 0px 0px #0000000d;
    --wallet-okd-input-search-disabled-background: #1d1d1d;
    --wallet-okd-input-search-error-tips-color: var(--wallet-okd-color-semantic-negative);
    --wallet-okd-input-search-suffix-icon-size: 13px;
    --wallet-okd-input-search-suffix-icon-color: var(--wallet-okd-color-content-contrast);
    --wallet-okd-input-search-prefix-icon-color: var(--wallet-okd-color-content-contrast);
    --wallet-okd-input-search-prefix-icon-size: 20px;
    --wallet-okd-input-verify-md-width: 40px;
    --wallet-okd-input-verify-md-height: 44px;
    --wallet-okd-input-lg-label-font-size: 14px;
    --wallet-okd-input-lg-label-line-height: 20px;
    --wallet-okd-input-lg-label-margin: 8px;
    --wallet-okd-input-lg-action-font-size: 14px;
    --wallet-okd-input-lg-action-line-height: 20px;
    --wallet-okd-input-lg-tip-font-size: 14px;
    --wallet-okd-input-lg-tip-line-height: 16px;
    --wallet-okd-input-lg-tip-margin: 6px;
    --wallet-okd-input-lg-error-font-size: 14px;
    --wallet-okd-input-lg-error-line-height: 16px;
    --wallet-okd-input-lg-height: 44px;
    --wallet-okd-input-lg-text-font-size: 14px;
    --wallet-okd-input-lg-border-radius: 8px;
    --wallet-okd-input-md-label-margin: 8px;
    --wallet-okd-input-md-tip-margin: 4px;
    --wallet-okd-input-sm-label-margin: 8px;
    --wallet-okd-input-sm-tip-margin: 4px;
    --wallet-okd-input-xs-label-margin: 8px;
    --wallet-okd-input-xs-tip-margin: 4px;
    --wallet-okd-input-lg-icon-size: 20px;
    --wallet-okd-input-lg-icon-margin: 8px;
    --wallet-okd-input-xl-label-line-height: 20px;
    --wallet-okd-input-xl-label-font-size: 14px;
    --wallet-okd-input-xl-label-margin: 8px;
    --wallet-okd-input-xl-action-line-height: 20px;
    --wallet-okd-input-xl-action-font-size: 14px;
    --wallet-okd-input-xl-tip-font-size: 14px;
    --wallet-okd-input-xl-tip-line-height: 16px;
    --wallet-okd-input-xl-tip-margin: 6px;
    --wallet-okd-input-xl-error-font-size: 14px;
    --wallet-okd-input-xl-error-line-height: 16px;
    --wallet-okd-input-xl-icon-size: 20px;
    --wallet-okd-input-xl-icon-margin: 8px;
    --wallet-okd-input-xl-height: 48px;
    --wallet-okd-input-xl-text-font-size: 14px;
    --wallet-okd-input-xl-border-radius: 8px;
    --wallet-okd-input-verify-xl-height: px;
    --wallet-okd-input-verify-xl-width: px;
    --wallet-okd-input-xs-padding-horizontal: 8px;
    --wallet-okd-input-sm-padding-horizontal: 8px;
    --wallet-okd-input-md-padding-horizontal: 8px;
    --wallet-okd-input-lg-padding-horizontal: 12px;
    --wallet-okd-input-xl-padding-horizontal: 12px;
    --wallet-okd-input-reversed-default-text-color: var(--wallet-okd-color-content-inverse);
    --wallet-okd-input-reversed-default-placeholder-color: rgba(0,0,0,.36);
    --wallet-okd-input-reversed-default-border-color: transparent;
    --wallet-okd-input-reversed-default-caret-color: var(--wallet-okd-color-content-inverse);
    --wallet-okd-input-reversed-default-shadow: 0 0 0 0 transparent;
    --wallet-okd-input-reversed-default-background: #f3f3f3;
    --wallet-okd-input-reversed-hover-text-color: var(--wallet-okd-color-content-inverse);
    --wallet-okd-input-reversed-hover-placeholder-color: rgba(0,0,0,.36);
    --wallet-okd-input-reversed-hover-border-color: var(--wallet-okd-color-transparent-black);
    --wallet-okd-input-reversed-hover-caret-color: var(--wallet-okd-color-content-contrast);
    --wallet-okd-input-reversed-hover-shadow: 0 0 0 0 transparent;
    --wallet-okd-input-reversed-hover-background: #f3f3f3;
    --wallet-okd-input-reversed-focus-text-color: var(--wallet-okd-color-content-inverse);
    --wallet-okd-input-reversed-focus-placeholder-color: rgba(0,0,0,.36);
    --wallet-okd-input-reversed-focus-border-color: #000;
    --wallet-okd-input-reversed-focus-caret-color: var(--wallet-okd-color-content-inverse);
    --wallet-okd-input-reversed-focus-shadow: 0px 0px 0px 0px #ffffff00;
    --wallet-okd-input-reversed-focus-background: #f3f3f3;
    --wallet-okd-input-reversed-disabled-text-color: #ccc;
    --wallet-okd-input-reversed-disabled-placeholder-color: #ccc;
    --wallet-okd-input-reversed-disabled-border-color: #e6e6e6;
    --wallet-okd-input-reversed-disabled-caret-color: #000;
    --wallet-okd-input-reversed-disabled-shadow: 0 0 0 0 transparent;
    --wallet-okd-input-reversed-disabled-background: #f6f6f6;
    --wallet-okd-input-reversed-error-text-color: var(--wallet-okd-color-content-inverse);
    --wallet-okd-input-reversed-error-placeholder-color: rgba(0,0,0,.36);
    --wallet-okd-input-reversed-error-border-color: var(--wallet-okd-color-semantic-negative);
    --wallet-okd-input-reversed-error-caret-color: var(--wallet-okd-color-content-inverse);
    --wallet-okd-input-reversed-error-shadow: 0 0 0 0 transparent;
    --wallet-okd-input-reversed-error-background: #f3f3f3;
    --wallet-okd-input-reversed-error-tips-color: var(--wallet-okd-color-semantic-negative);
    --wallet-okd-input-reversed-tips-text-color: var(--wallet-okd-color-content-contrast);
    --wallet-okd-input-reversed-icon-color: #6c6c6c;
    --wallet-okd-input-reversed-label-color: #000;
    --wallet-okd-input-reversed-action-color: var(--wallet-okd-color-content-inverse);
    --wallet-okd-input-number-reversed-default-add-icon-color: #909090;
    --wallet-okd-input-number-reversed-default-add-icon-background: transparent;
    --wallet-okd-input-number-reversed-hover-add-icon-color: #000;
    --wallet-okd-input-number-reversed-hover-add-icon-background: #272727;
    --wallet-okd-input-number-reversed-active-add-icon-color: #909090;
    --wallet-okd-input-number-reversed-active-add-icon-background: transparent;
    --wallet-okd-input-number-reversed-disabled-add-icon-color: #b0b0b0;
    --wallet-okd-input-number-reversed-disabled-add-icon-background: transparent;
    --wallet-okd-input-code-reversed-common-btn-color: var(--wallet-okd-color-content-inverse);
    --wallet-okd-input-code-reversed-common-btn-disabled-color: #6c6c6c;
    --wallet-okd-input-code-reversed-common-count-color: var(--wallet-okd-color-content-tertiary);
    --wallet-okd-input-search-reversed-default-text-color: #000;
    --wallet-okd-input-search-reversed-default-placeholder-color: #666;
    --wallet-okd-input-search-reversed-default-border-color: transparent;
    --wallet-okd-input-search-reversed-default-caret-color: #000;
    --wallet-okd-input-search-reversed-default-shadow: 0 0 0 0 transparent;
    --wallet-okd-input-search-reversed-default-background: #f3f3f3;
    --wallet-okd-input-search-reversed-hover-text-color: #000;
    --wallet-okd-input-search-reversed-hover-placeholder-color: #ccc;
    --wallet-okd-input-search-reversed-hover-border-color: var(--wallet-okd-color-transparent-white);
    --wallet-okd-input-search-reversed-hover-caret-color: #000;
    --wallet-okd-input-search-reversed-hover-shadow: 0px 0px 0px 0px #1212121a;
    --wallet-okd-input-search-reversed-hover-background: #f3f3f3;
    --wallet-okd-input-search-reversed-focus-text-color: #000;
    --wallet-okd-input-search-reversed-focus-placeholder-color: #ccc;
    --wallet-okd-input-search-reversed-focus-border-color: transparent;
    --wallet-okd-input-search-reversed-focus-caret-color: var(--wallet-okd-color-content-inverse);
    --wallet-okd-input-search-reversed-focus-shadow: 0px 0px 0px 0px #1212121a;
    --wallet-okd-input-search-reversed-focus-background: #f3f3f3;
    --wallet-okd-input-search-reversed-error-text-color: #000;
    --wallet-okd-input-search-reversed-error-placeholder-color: #ccc;
    --wallet-okd-input-search-reversed-error-border-color: #f04872;
    --wallet-okd-input-search-reversed-error-caret-color: var(--wallet-okd-color-content-inverse);
    --wallet-okd-input-search-reversed-error-shadow: 0 0 0 0 transparent;
    --wallet-okd-input-search-reversed-error-background: transparent;
    --wallet-okd-input-search-reversed-disabled-text-color: #000;
    --wallet-okd-input-search-reversed-disabled-placeholder-color: #ccc;
    --wallet-okd-input-search-reversed-disabled-border-color: transparent;
    --wallet-okd-input-search-reversed-disabled-caret-color: transparent;
    --wallet-okd-input-search-reversed-disabled-shadow: 0 0 0 0 transparent;
    --wallet-okd-input-search-reversed-disabled-background: #f0f0f0;
    --wallet-okd-input-search-reversed-prefix-icon-color: #6c6c6c;
    --wallet-okd-input-search-reversed-error-tips-color: #f04872;
    --wallet-okd-input-search-suffix-icon-hover-color: var(--wallet-okd-color-content-contrast);
    --wallet-okd-input-verify-xl-border-radius: 8px;
    --wallet-okd-input-code-xl-btn-font-size: 12px;
    --wallet-okd-input-number-suffix-border-color: var(--wallet-okd-color-border-primary);
    --wallet-okd-input-verify-md-border-radius: 6px;
    --wallet-okd-input-verify-md-text-font-size: 26px;
    --wallet-okd-input-verify-md-margin: 8px;
    --wallet-okd-input-readonly-text-color: var(--wallet-okd-color-content-primary);
    --wallet-okd-input-readonly-placeholder-color: var(--wallet-okd-input-default-placeholder-color);
    --wallet-okd-input-readonly-border-color: var(--wallet-okd-color-border-primary);
    --wallet-okd-input-readonly-caret-color: var(--wallet-okd-input-default-caret-color);
    --wallet-okd-input-readonly-shadow: var(--wallet-okd-input-default-shadow);
    --wallet-okd-input-readonly-background: var(--wallet-okd-color-transparent-white)
}

.wallet-input-reversed .wallet-input-box {
    background: var(--wallet-okd-input-reversed-default-background);
    border: thin solid var(--wallet-okd-input-reversed-default-border-color);
    box-shadow: var(--wallet-okd-input-reversed-default-shadow);
    transition: border-color .3s,box-shadow .3s
}

.wallet-input-reversed .wallet-input-input {
    color: var(--wallet-okd-input-reversed-default-text-color)
}

.wallet-input-reversed .wallet-input-input::-webkit-input-placeholder {
    -webkit-text-fill-color: var(--wallet-okd-input-reversed-default-placeholder-color);
    color: var(--wallet-okd-input-reversed-default-placeholder-color)
}

.wallet-input-reversed .wallet-input-input:-moz-placeholder {
    -webkit-text-fill-color: var(--wallet-okd-input-reversed-default-placeholder-color);
    color: var(--wallet-okd-input-reversed-default-placeholder-color);
    opacity: 1
}

.wallet-input-reversed .wallet-input-input::-ms-input-placeholder {
    -webkit-text-fill-color: var(--wallet-okd-input-reversed-default-placeholder-color);
    color: var(--wallet-okd-input-reversed-default-placeholder-color)
}

.wallet-input-reversed .wallet-input-input:-webkit-autofill {
    -webkit-text-fill-color: var(--wallet-okd-input-reversed-default-text-color)!important;
    border: none;
    -webkit-box-shadow: 0 0 0 30px var(--wallet-okd-input-reversed-default-background) inset
}

.wallet-input-reversed .wallet-input-error {
    color: var(--wallet-okd-input-reversed-error-tips-color)
}

.wallet-input-reversed .wallet-input-help-text,.wallet-input-reversed .wallet-input-tips {
    color: var(--wallet-okd-input-reversed-tips-text-color)
}

.wallet-input.wallet-input-reversed.hover .wallet-input-box,.wallet-input.wallet-input-reversed:hover .wallet-input-box {
    background: var(--wallet-okd-input-reversed-hover-background);
    border: thin solid var(--wallet-okd-input-reversed-hover-border-color);
    box-shadow: var(--wallet-okd-input-reversed-hover-shadow)
}

.wallet-input.wallet-input-reversed.hover .wallet-input-box .wallet-input-input,.wallet-input.wallet-input-reversed:hover .wallet-input-box .wallet-input-input {
    -webkit-text-fill-color: var(--wallet-okd-input-reversed-hover-text-color);
    caret-color: var(--wallet-okd-input-reversed-hover-caret-color);
    color: var(--wallet-okd-input-reversed-hover-text-color)
}

.wallet-input.wallet-input-reversed.hover .wallet-input-box .wallet-input-input::-webkit-input-placeholder,.wallet-input.wallet-input-reversed:hover .wallet-input-box .wallet-input-input::-webkit-input-placeholder {
    -webkit-text-fill-color: var(--wallet-okd-input-reversed-hover-placeholder-color);
    color: var(--wallet-okd-input-reversed-hover-placeholder-color)
}

.wallet-input.wallet-input-reversed.hover .wallet-input-box .wallet-input-input:-moz-placeholder,.wallet-input.wallet-input-reversed:hover .wallet-input-box .wallet-input-input:-moz-placeholder {
    -webkit-text-fill-color: var(--wallet-okd-input-reversed-hover-placeholder-color);
    color: var(--wallet-okd-input-reversed-hover-placeholder-color);
    opacity: 1
}

.wallet-input.wallet-input-reversed.hover .wallet-input-box .wallet-input-input::-ms-input-placeholder,.wallet-input.wallet-input-reversed:hover .wallet-input-box .wallet-input-input::-ms-input-placeholder {
    -webkit-text-fill-color: var(--wallet-okd-input-reversed-hover-placeholder-color);
    color: var(--wallet-okd-input-reversed-hover-placeholder-color)
}

.wallet-input.wallet-input-reversed.focus .wallet-input-box {
    background: var(--wallet-okd-input-reversed-focus-background);
    border: thin solid var(--wallet-okd-input-reversed-focus-border-color);
    box-shadow: var(--wallet-okd-input-reversed-focus-shadow)
}

.wallet-input.wallet-input-reversed.focus .wallet-input-box .wallet-input-input {
    -webkit-text-fill-color: var(--wallet-okd-input-reversed-focus-text-color);
    caret-color: var(--wallet-okd-input-reversed-focus-caret-color);
    color: var(--wallet-okd-input-reversed-focus-text-color)
}

.wallet-input.wallet-input-reversed.focus .wallet-input-box .wallet-input-input::-webkit-input-placeholder {
    -webkit-text-fill-color: var(--wallet-okd-input-reversed-focus-placeholder-color);
    color: var(--wallet-okd-input-reversed-focus-placeholder-color)
}

.wallet-input.wallet-input-reversed.focus .wallet-input-box .wallet-input-input:-moz-placeholder {
    -webkit-text-fill-color: var(--wallet-okd-input-reversed-focus-placeholder-color);
    color: var(--wallet-okd-input-reversed-focus-placeholder-color);
    opacity: 1
}

.wallet-input.wallet-input-reversed.focus .wallet-input-box .wallet-input-input::-ms-input-placeholder {
    -webkit-text-fill-color: var(--wallet-okd-input-reversed-focus-placeholder-color);
    color: var(--wallet-okd-input-reversed-focus-placeholder-color)
}

.wallet-input.wallet-input-reversed.disabled .wallet-input-box {
    background: var(--wallet-okd-input-reversed-disabled-background);
    border: thin solid var(--wallet-okd-input-reversed-disabled-border-color);
    box-shadow: var(--wallet-okd-input-reversed-disabled-shadow)
}

.wallet-input.wallet-input-reversed.disabled .wallet-input-box .wallet-input-input {
    -webkit-text-fill-color: var(--wallet-okd-input-reversed-disabled-text-color);
    caret-color: var(--wallet-okd-input-reversed-disabled-caret-color);
    color: var(--wallet-okd-input-reversed-disabled-text-color)
}

.wallet-input.wallet-input-reversed.disabled .wallet-input-box .wallet-input-input::-webkit-input-placeholder {
    -webkit-text-fill-color: var(--wallet-okd-input-reversed-disabled-placeholder-color);
    color: var(--wallet-okd-input-reversed-disabled-placeholder-color)
}

.wallet-input.wallet-input-reversed.disabled .wallet-input-box .wallet-input-input:-moz-placeholder {
    -webkit-text-fill-color: var(--wallet-okd-input-reversed-disabled-placeholder-color);
    color: var(--wallet-okd-input-reversed-disabled-placeholder-color);
    opacity: 1
}

.wallet-input.wallet-input-reversed.disabled .wallet-input-box .wallet-input-input::-ms-input-placeholder {
    -webkit-text-fill-color: var(--wallet-okd-input-reversed-disabled-placeholder-color);
    color: var(--wallet-okd-input-reversed-disabled-placeholder-color)
}

.wallet-input.wallet-input-reversed.disabled .wallet-input-input:-webkit-autofill {
    -webkit-text-fill-color: var(--wallet-okd-input-reversed-disabled-text-color)!important;
    -webkit-box-shadow: 0 0 0 30px var(--wallet-okd-input-reversed-disabled-background) inset
}

.wallet-input.wallet-input-reversed.error .wallet-input-box {
    background: var(--wallet-okd-input-reversed-error-background);
    border: thin solid var(--wallet-okd-input-reversed-error-border-color);
    box-shadow: var(--wallet-okd-input-reversed-error-shadow)
}

.wallet-input.wallet-input-reversed.error .wallet-input-box .wallet-input-input {
    -webkit-text-fill-color: var(--wallet-okd-input-reversed-error-text-color);
    caret-color: var(--wallet-okd-input-reversed-error-caret-color);
    color: var(--wallet-okd-input-reversed-error-text-color)
}

.wallet-input.wallet-input-reversed.error .wallet-input-box .wallet-input-input::-webkit-input-placeholder {
    -webkit-text-fill-color: var(--wallet-okd-input-reversed-error-placeholder-color);
    color: var(--wallet-okd-input-reversed-error-placeholder-color)
}

.wallet-input.wallet-input-reversed.error .wallet-input-box .wallet-input-input:-moz-placeholder {
    -webkit-text-fill-color: var(--wallet-okd-input-reversed-error-placeholder-color);
    color: var(--wallet-okd-input-reversed-error-placeholder-color);
    opacity: 1
}

.wallet-input.wallet-input-reversed.error .wallet-input-box .wallet-input-input::-ms-input-placeholder {
    -webkit-text-fill-color: var(--wallet-okd-input-reversed-error-placeholder-color);
    color: var(--wallet-okd-input-reversed-error-placeholder-color)
}

.wallet-label-reversed .wallet-label-text {
    color: var(--wallet-okd-input-reversed-label-color)
}

.wallet-label-reversed .wallet-label-action {
    color: var(--wallet-okd-input-reversed-action-color)
}

.wallet-input-reversed .wallet-input-prefix .prefix-icon,.wallet-input-reversed .wallet-input-suffix .suffix-icon,.wallet-input-reversed .wallet-input-suffix .suffix-icon:hover {
    color: var(--wallet-okd-input-reversed-icon-color)
}

.wallet-input-reversed .wallet-input-suffix .error-icon {
    color: var(--wallet-okd-input-reversed-error-tips-color)
}

.wallet-input-reversed .wallet-input-number-suffix {
    border-left: 1px solid var(--wallet-okd-input-reversed-default-border-color)
}

.wallet-input-reversed .wallet-input-number-suffix-part {
    background: var(--wallet-okd-input-number-reversed-default-add-icon-background)
}

.wallet-input-reversed .wallet-input-number-suffix-part .icon {
    color: var(--wallet-okd-input-number-reversed-default-add-icon-color)
}

.wallet-input-reversed .wallet-input-number-suffix-part .hover,.wallet-input-reversed .wallet-input-number-suffix-part:hover {
    background: var(--wallet-okd-input-number-reversed-hover-add-icon-background)
}

.wallet-input-reversed .wallet-input-number-suffix-part .hover .icon,.wallet-input-reversed .wallet-input-number-suffix-part:hover .icon {
    color: var(--wallet-okd-input-number-reversed-hover-add-icon-color)
}

.wallet-input-reversed .wallet-input-number-suffix-part .active,.wallet-input-reversed .wallet-input-number-suffix-part:active {
    background: var(--wallet-okd-input-number-reversed-active-add-icon-background)
}

.wallet-input-reversed .wallet-input-number-suffix-part .active .icon,.wallet-input-reversed .wallet-input-number-suffix-part:active .icon {
    color: var(--wallet-okd-input-number-reversed-active-add-icon-color)
}

.wallet-input-reversed .wallet-input-number-suffix-part .disabled,.wallet-input-reversed .wallet-input-number-suffix-part-disabled {
    background: var(--wallet-okd-input-number-reversed-disabled-add-icon-background)
}

.wallet-input-reversed .wallet-input-number-suffix-part .disabled .icon,.wallet-input-reversed .wallet-input-number-suffix-part .disabled:hover .icon,.wallet-input-reversed .wallet-input-number-suffix-part-disabled .icon,.wallet-input-reversed .wallet-input-number-suffix-part-disabled:hover .icon {
    color: var(--wallet-okd-input-number-reversed-disabled-add-icon-color)
}

.wallet-input-reversed .wallet-input-number-suffix-line {
    background: var(--wallet-okd-input-reversed-default-border-color)
}

.wallet-btn .btn-content {
    align-items: center;
    display: flex
}

.wallet-btn .wallet-btn-ellipsis {
    display: block;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    width: 100%
}

.wallet-btn.loading .btn-content {
    opacity: 0
}

.wallet-btn.loading .btn-content-position {
    display: none
}

.wallet-btn.loading .wallet-btn-loader {
    line-height: 0;
    position: absolute
}

.wallet-btn.loading .btn-loader-position-absolute {
    position: relative
}

.wallet-btn-loader-container {
    height: 100%;
    position: relative
}

.wallet-btn .btn-icon+.btn-content {
    margin-left: 4px
}

.wallet-btn.btn-xxs .btn-icon {
    font-size: var(--wallet-okd-button-xxs-icon-size)
}

.wallet-btn.btn-xxs .btn-icon-leading {
    margin-right: var(--wallet-okd-button-xxs-icon-margin)
}

.wallet-btn.btn-xxs .btn-icon-tailing {
    margin-left: var(--wallet-okd-button-xxs-icon-margin)
}

.wallet-btn.btn-xxs .wallet-btn-loader-size {
    border-radius: var(--wallet-okd-button-xxs-loader-size);
    height: var(--wallet-okd-button-xxs-loader-size);
    width: var(--wallet-okd-button-xxs-loader-size)
}

.wallet-btn.btn-xs .btn-icon {
    font-size: var(--wallet-okd-button-xs-icon-size)
}

.wallet-btn.btn-xs .btn-icon-leading {
    margin-right: var(--wallet-okd-button-xs-icon-margin)
}

.wallet-btn.btn-xs .btn-icon-tailing {
    margin-left: var(--wallet-okd-button-xs-icon-margin)
}

.wallet-btn.btn-xs .wallet-btn-loader-size {
    border-radius: var(--wallet-okd-button-xs-loader-size);
    height: var(--wallet-okd-button-xs-loader-size);
    width: var(--wallet-okd-button-xs-loader-size)
}

.wallet-btn.btn-s .btn-icon {
    font-size: var(--wallet-okd-button-s-icon-size)
}

.wallet-btn.btn-s .btn-icon-leading {
    margin-right: var(--wallet-okd-button-s-icon-margin)
}

.wallet-btn.btn-s .btn-icon-tailing {
    margin-left: var(--wallet-okd-button-s-icon-margin)
}

.wallet-btn.btn-s .wallet-btn-loader-size {
    border-radius: var(--wallet-okd-button-s-loader-size);
    height: var(--wallet-okd-button-s-loader-size);
    width: var(--wallet-okd-button-s-loader-size)
}

.wallet-btn.btn-sm .btn-icon {
    font-size: var(--wallet-okd-button-sm-icon-size)
}

.wallet-btn.btn-sm .btn-icon-leading {
    margin-right: var(--wallet-okd-button-sm-icon-margin)
}

.wallet-btn.btn-sm .btn-icon-tailing {
    margin-left: var(--wallet-okd-button-sm-icon-margin)
}

.wallet-btn.btn-sm .wallet-btn-loader-size {
    border-radius: var(--wallet-okd-button-sm-loader-size);
    height: var(--wallet-okd-button-sm-loader-size);
    width: var(--wallet-okd-button-sm-loader-size)
}

.wallet-btn.btn-md .btn-icon {
    font-size: var(--wallet-okd-button-md-icon-size)
}

.wallet-btn.btn-md .btn-icon-leading {
    margin-right: var(--wallet-okd-button-md-icon-margin)
}

.wallet-btn.btn-md .btn-icon-tailing {
    margin-left: var(--wallet-okd-button-md-icon-margin)
}

.wallet-btn.btn-md .wallet-btn-loader-size {
    border-radius: var(--wallet-okd-button-md-loader-size);
    height: var(--wallet-okd-button-md-loader-size);
    width: var(--wallet-okd-button-md-loader-size)
}

.wallet-btn.btn-lg .btn-icon {
    font-size: var(--wallet-okd-button-lg-icon-size)
}

.wallet-btn.btn-lg .btn-icon-leading {
    margin-right: var(--wallet-okd-button-lg-icon-margin)
}

.wallet-btn.btn-lg .btn-icon-tailing {
    margin-left: var(--wallet-okd-button-lg-icon-margin)
}

.wallet-btn.btn-lg .wallet-btn-loader-size {
    border-radius: var(--wallet-okd-button-lg-loader-size);
    height: var(--wallet-okd-button-lg-loader-size);
    width: var(--wallet-okd-button-lg-loader-size)
}

.wallet-btn.btn-xl .btn-icon {
    font-size: var(--wallet-okd-button-xl-icon-size)
}

.wallet-btn.btn-xl .btn-icon-leading {
    margin-right: var(--wallet-okd-button-xl-icon-margin)
}

.wallet-btn.btn-xl .btn-icon-tailing {
    margin-left: var(--wallet-okd-button-xl-icon-margin)
}

.wallet-btn.btn-xl .wallet-btn-loader-size {
    border-radius: var(--wallet-okd-button-xl-loader-size);
    height: var(--wallet-okd-button-xl-loader-size);
    width: var(--wallet-okd-button-xl-loader-size)
}

.wallet-btn .wallet-btn-outline-primary-loader {
    border-color: var(--wallet-okd-button-outline-primary-loader-track-color);
    border-top-color: var(--wallet-okd-button-outline-primary-loader-mark-color)
}

.wallet-btn {
    -webkit-tap-highlight-color: transparent;
    align-items: center;
    -webkit-appearance: none;
    box-sizing: border-box;
    cursor: pointer;
    display: inline-flex;
    font-family: inherit;
    font-weight: 500;
    justify-content: center;
    outline: none;
    position: relative;
    text-decoration: none;
    touch-action: manipulation;
    -webkit-user-select: none;
    -moz-user-select: none;
    user-select: none
}

.wallet-btn:focus-visible {
    outline: 2px solid var(--wallet-okd-color-border-focus);
    outline-color: var(--wallet-okd-color-border-focus);
    outline-offset: 2px;
    outline-style: solid;
    outline-width: 2px
}

.wallet-btn.btn-outline-primary {
    background: var(--wallet-okd-button-outline-primary-default-background);
    border-color: var(--wallet-okd-button-outline-primary-default-border-color);
    border-style: solid;
    border-width: var(--wallet-okd-button-outline-primary-border-size);
    box-shadow: var(--wallet-okd-button-outline-primary-default-shadow);
    color: var(--wallet-okd-button-outline-primary-default-font-color)
}

.wallet-btn.btn-outline-primary.hover,.wallet-btn.btn-outline-primary:not(:disabled):not(.btn-disabled):not(.mobile):hover {
    background: var(--wallet-okd-button-outline-primary-hover-background);
    border-color: var(--wallet-okd-button-outline-primary-hover-border-color);
    box-shadow: var(--wallet-okd-button-outline-primary-hover-shadow);
    color: var(--wallet-okd-button-outline-primary-hover-font-color)
}

.wallet-btn.btn-outline-primary.hover .btn-icon,.wallet-btn.btn-outline-primary:not(:disabled):not(.btn-disabled):not(.mobile):hover .btn-icon {
    color: var(--wallet-okd-button-outline-primary-hover-icon-color)
}

.wallet-btn.btn-outline-primary.active,.wallet-btn.btn-outline-primary:not(:disabled):active {
    background: var(--wallet-okd-button-outline-primary-active-background);
    border-color: var(--wallet-okd-button-outline-primary-active-border-color);
    box-shadow: var(--wallet-okd-button-outline-primary-active-shadow);
    color: var(--wallet-okd-button-outline-primary-active-font-color)
}

.wallet-btn.btn-outline-primary.active .btn-icon,.wallet-btn.btn-outline-primary:not(:disabled):active .btn-icon {
    color: var(--wallet-okd-button-outline-primary-active-icon-color)
}

.wallet-btn.btn-outline-primary:not(.loading).btn-disabled,.wallet-btn.btn-outline-primary:not(.loading):disabled {
    background: var(--wallet-okd-button-outline-primary-disabled-background);
    border-color: var(--wallet-okd-button-outline-primary-disabled-border-color);
    box-shadow: var(--wallet-okd-button-outline-primary-disabled-shadow);
    color: var(--wallet-okd-button-outline-primary-disabled-font-color)
}

.wallet-btn.btn-outline-primary:not(.loading).btn-disabled .btn-icon,.wallet-btn.btn-outline-primary:not(.loading):disabled .btn-icon {
    color: var(--wallet-okd-button-outline-primary-disabled-icon-color)
}

.wallet-btn.btn-outline-primary.loading {
    cursor: pointer
}

.wallet-btn.btn-outline-primary .btn-icon {
    color: var(--wallet-okd-button-outline-primary-default-icon-color)
}

.wallet-btn.btn-outline-primary .wallet-btn-loader-text {
    color: var(--wallet-okd-button-outline-primary-default-font-color)
}

.wallet-btn.btn-outline-primary.btn-xxs {
    padding: calc(var(--wallet-okd-button-xxs-padding-vertical) + 1px - var(--wallet-okd-button-outline-primary-border-size)) var(--wallet-okd-button-xxs-padding-horizontal)
}

.wallet-btn.btn-outline-primary.btn-xxs.wallet-btn-strict-circle {
    border-radius: 100px;
    height: calc(var(--wallet-okd-button-xxs-padding-vertical)*2 + 2px - var(--wallet-okd-button-outline-primary-border-size)*2 + var(--wallet-okd-button-xxs-line-height) + var(--wallet-okd-button-outline-primary-border-size)*2);
    min-width: 0;
    overflow: hidden;
    padding: 0;
    width: calc(var(--wallet-okd-button-xxs-padding-vertical)*2 + 2px - var(--wallet-okd-button-outline-primary-border-size)*2 + var(--wallet-okd-button-xxs-line-height) + var(--wallet-okd-button-outline-primary-border-size)*2)
}

.wallet-btn.btn-outline-primary.btn-xxs.wallet-btn-strict-circle .btn-content {
    display: block;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    width: 100%
}

.wallet-btn.btn-outline-primary.btn-xs {
    padding: calc(var(--wallet-okd-button-xs-padding-vertical) + 1px - var(--wallet-okd-button-outline-primary-border-size)) var(--wallet-okd-button-xs-padding-horizontal)
}

.wallet-btn.btn-outline-primary.btn-xs.wallet-btn-strict-circle {
    border-radius: 100px;
    height: calc(var(--wallet-okd-button-xs-padding-vertical)*2 + 2px - var(--wallet-okd-button-outline-primary-border-size)*2 + var(--wallet-okd-button-xs-line-height) + var(--wallet-okd-button-outline-primary-border-size)*2);
    min-width: 0;
    overflow: hidden;
    padding: 0;
    width: calc(var(--wallet-okd-button-xs-padding-vertical)*2 + 2px - var(--wallet-okd-button-outline-primary-border-size)*2 + var(--wallet-okd-button-xs-line-height) + var(--wallet-okd-button-outline-primary-border-size)*2)
}

.wallet-btn.btn-outline-primary.btn-xs.wallet-btn-strict-circle .btn-content {
    display: block;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    width: 100%
}

.wallet-btn.btn-outline-primary.btn-s {
    padding: calc(var(--wallet-okd-button-s-padding-vertical) + 1px - var(--wallet-okd-button-outline-primary-border-size)) var(--wallet-okd-button-s-padding-horizontal)
}

.wallet-btn.btn-outline-primary.btn-s.wallet-btn-strict-circle {
    border-radius: 100px;
    height: calc(var(--wallet-okd-button-s-padding-vertical)*2 + 2px - var(--wallet-okd-button-outline-primary-border-size)*2 + var(--wallet-okd-button-s-line-height) + var(--wallet-okd-button-outline-primary-border-size)*2);
    min-width: 0;
    overflow: hidden;
    padding: 0;
    width: calc(var(--wallet-okd-button-s-padding-vertical)*2 + 2px - var(--wallet-okd-button-outline-primary-border-size)*2 + var(--wallet-okd-button-s-line-height) + var(--wallet-okd-button-outline-primary-border-size)*2)
}

.wallet-btn.btn-outline-primary.btn-s.wallet-btn-strict-circle .btn-content {
    display: block;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    width: 100%
}

.wallet-btn.btn-outline-primary.btn-sm {
    padding: calc(var(--wallet-okd-button-sm-padding-vertical) + 1px - var(--wallet-okd-button-outline-primary-border-size)) var(--wallet-okd-button-sm-padding-horizontal)
}

.wallet-btn.btn-outline-primary.btn-sm.wallet-btn-strict-circle {
    border-radius: 100px;
    height: calc(var(--wallet-okd-button-sm-padding-vertical)*2 + 2px - var(--wallet-okd-button-outline-primary-border-size)*2 + var(--wallet-okd-button-sm-line-height) + var(--wallet-okd-button-outline-primary-border-size)*2);
    min-width: 0;
    overflow: hidden;
    padding: 0;
    width: calc(var(--wallet-okd-button-sm-padding-vertical)*2 + 2px - var(--wallet-okd-button-outline-primary-border-size)*2 + var(--wallet-okd-button-sm-line-height) + var(--wallet-okd-button-outline-primary-border-size)*2)
}

.wallet-btn.btn-outline-primary.btn-sm.wallet-btn-strict-circle .btn-content {
    display: block;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    width: 100%
}

.wallet-btn.btn-outline-primary.btn-md {
    padding: calc(var(--wallet-okd-button-md-padding-vertical) + 1px - var(--wallet-okd-button-outline-primary-border-size)) var(--wallet-okd-button-md-padding-horizontal)
}

.wallet-btn.btn-outline-primary.btn-md.wallet-btn-strict-circle {
    border-radius: 100px;
    height: calc(var(--wallet-okd-button-md-padding-vertical)*2 + 2px - var(--wallet-okd-button-outline-primary-border-size)*2 + var(--wallet-okd-button-md-line-height) + var(--wallet-okd-button-outline-primary-border-size)*2);
    min-width: 0;
    overflow: hidden;
    padding: 0;
    width: calc(var(--wallet-okd-button-md-padding-vertical)*2 + 2px - var(--wallet-okd-button-outline-primary-border-size)*2 + var(--wallet-okd-button-md-line-height) + var(--wallet-okd-button-outline-primary-border-size)*2)
}

.wallet-btn.btn-outline-primary.btn-md.wallet-btn-strict-circle .btn-content {
    display: block;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    width: 100%
}

.wallet-btn.btn-outline-primary.btn-lg {
    padding: calc(var(--wallet-okd-button-lg-padding-vertical) + 1px - var(--wallet-okd-button-outline-primary-border-size)) var(--wallet-okd-button-lg-padding-horizontal)
}

.wallet-btn.btn-outline-primary.btn-lg.wallet-btn-strict-circle {
    border-radius: 100px;
    height: calc(var(--wallet-okd-button-lg-padding-vertical)*2 + 2px - var(--wallet-okd-button-outline-primary-border-size)*2 + var(--wallet-okd-button-lg-line-height) + var(--wallet-okd-button-outline-primary-border-size)*2);
    min-width: 0;
    overflow: hidden;
    padding: 0;
    width: calc(var(--wallet-okd-button-lg-padding-vertical)*2 + 2px - var(--wallet-okd-button-outline-primary-border-size)*2 + var(--wallet-okd-button-lg-line-height) + var(--wallet-okd-button-outline-primary-border-size)*2)
}

.wallet-btn.btn-outline-primary.btn-lg.wallet-btn-strict-circle .btn-content {
    display: block;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    width: 100%
}

.wallet-btn.btn-outline-primary.btn-xl {
    padding: calc(var(--wallet-okd-button-xl-padding-vertical) + 1px - var(--wallet-okd-button-outline-primary-border-size)) var(--wallet-okd-button-xl-padding-horizontal)
}

.wallet-btn.btn-outline-primary.btn-xl.wallet-btn-strict-circle {
    border-radius: 100px;
    height: calc(var(--wallet-okd-button-xl-padding-vertical)*2 + 2px - var(--wallet-okd-button-outline-primary-border-size)*2 + var(--wallet-okd-button-xl-line-height) + var(--wallet-okd-button-outline-primary-border-size)*2);
    min-width: 0;
    overflow: hidden;
    padding: 0;
    width: calc(var(--wallet-okd-button-xl-padding-vertical)*2 + 2px - var(--wallet-okd-button-outline-primary-border-size)*2 + var(--wallet-okd-button-xl-line-height) + var(--wallet-okd-button-outline-primary-border-size)*2)
}

.wallet-btn.btn-outline-primary.btn-xl.wallet-btn-strict-circle .btn-content {
    display: block;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    width: 100%
}

.wallet-btn.btn-xxs {
    border-radius: var(--wallet-okd-button-xxs-border-radius);
    font-weight: 500;
    font-weight: var(--wallet-okd-button-xxs-font-weight,500);
    min-width: var(--wallet-okd-button-xxs-min-width)
}

.wallet-btn.btn-xxs,.wallet-btn.btn-xxs .wallet-btn-loader-text {
    font-size: var(--wallet-okd-button-xxs-font-size);
    line-height: var(--wallet-okd-button-xxs-line-height)
}

.wallet-btn.btn-xxs .wallet-btn-loader-text {
    margin-left: var(--wallet-okd-button-xxs-loader-text-margin-left)
}

.wallet-btn.btn-xxs.btn-rect {
    border-radius: 4px;
    border-radius: var(--wallet-okd-button-rect-xxs-border-radius,4px)
}

.wallet-btn.btn-xs {
    border-radius: var(--wallet-okd-button-xs-border-radius);
    font-weight: 500;
    font-weight: var(--wallet-okd-button-xs-font-weight,500);
    min-width: var(--wallet-okd-button-xs-min-width)
}

.wallet-btn.btn-xs,.wallet-btn.btn-xs .wallet-btn-loader-text {
    font-size: var(--wallet-okd-button-xs-font-size);
    line-height: var(--wallet-okd-button-xs-line-height)
}

.wallet-btn.btn-xs .wallet-btn-loader-text {
    margin-left: var(--wallet-okd-button-xs-loader-text-margin-left)
}

.wallet-btn.btn-xs.btn-rect {
    border-radius: 4px;
    border-radius: var(--wallet-okd-button-rect-xs-border-radius,4px)
}

.wallet-btn.btn-s {
    border-radius: var(--wallet-okd-button-s-border-radius);
    font-weight: 500;
    font-weight: var(--wallet-okd-button-s-font-weight,500);
    min-width: var(--wallet-okd-button-s-min-width)
}

.wallet-btn.btn-s,.wallet-btn.btn-s .wallet-btn-loader-text {
    font-size: var(--wallet-okd-button-s-font-size);
    line-height: var(--wallet-okd-button-s-line-height)
}

.wallet-btn.btn-s .wallet-btn-loader-text {
    margin-left: var(--wallet-okd-button-s-loader-text-margin-left)
}

.wallet-btn.btn-s.btn-rect {
    border-radius: 4px;
    border-radius: var(--wallet-okd-button-rect-s-border-radius,4px)
}

.wallet-btn.btn-sm {
    border-radius: var(--wallet-okd-button-sm-border-radius);
    font-weight: 500;
    font-weight: var(--wallet-okd-button-sm-font-weight,500);
    min-width: var(--wallet-okd-button-sm-min-width)
}

.wallet-btn.btn-sm,.wallet-btn.btn-sm .wallet-btn-loader-text {
    font-size: var(--wallet-okd-button-sm-font-size);
    line-height: var(--wallet-okd-button-sm-line-height)
}

.wallet-btn.btn-sm .wallet-btn-loader-text {
    margin-left: var(--wallet-okd-button-sm-loader-text-margin-left)
}

.wallet-btn.btn-sm.btn-rect {
    border-radius: 4px;
    border-radius: var(--wallet-okd-button-rect-sm-border-radius,4px)
}

.wallet-btn.btn-md {
    border-radius: var(--wallet-okd-button-md-border-radius);
    font-weight: 500;
    font-weight: var(--wallet-okd-button-md-font-weight,500);
    min-width: var(--wallet-okd-button-md-min-width)
}

.wallet-btn.btn-md,.wallet-btn.btn-md .wallet-btn-loader-text {
    font-size: var(--wallet-okd-button-md-font-size);
    line-height: var(--wallet-okd-button-md-line-height)
}

.wallet-btn.btn-md .wallet-btn-loader-text {
    margin-left: var(--wallet-okd-button-md-loader-text-margin-left)
}

.wallet-btn.btn-md.btn-rect {
    border-radius: 4px;
    border-radius: var(--wallet-okd-button-rect-md-border-radius,4px)
}

.wallet-btn.btn-lg {
    border-radius: var(--wallet-okd-button-lg-border-radius);
    font-weight: 500;
    font-weight: var(--wallet-okd-button-lg-font-weight,500);
    min-width: var(--wallet-okd-button-lg-min-width)
}

.wallet-btn.btn-lg,.wallet-btn.btn-lg .wallet-btn-loader-text {
    font-size: var(--wallet-okd-button-lg-font-size);
    line-height: var(--wallet-okd-button-lg-line-height)
}

.wallet-btn.btn-lg .wallet-btn-loader-text {
    margin-left: var(--wallet-okd-button-lg-loader-text-margin-left)
}

.wallet-btn.btn-lg.btn-rect {
    border-radius: 8px;
    border-radius: var(--wallet-okd-button-rect-lg-border-radius,8px)
}

.wallet-btn.btn-xl {
    border-radius: var(--wallet-okd-button-xl-border-radius);
    font-weight: 500;
    font-weight: var(--wallet-okd-button-xl-font-weight,500);
    min-width: var(--wallet-okd-button-xl-min-width)
}

.wallet-btn.btn-xl,.wallet-btn.btn-xl .wallet-btn-loader-text {
    font-size: var(--wallet-okd-button-xl-font-size);
    line-height: var(--wallet-okd-button-xl-line-height)
}

.wallet-btn.btn-xl .wallet-btn-loader-text {
    margin-left: var(--wallet-okd-button-xl-loader-text-margin-left)
}

.wallet-btn.btn-xl.btn-rect {
    border-radius: 8px;
    border-radius: var(--wallet-okd-button-rect-xl-border-radius,8px)
}

.wallet-btn.btn-disabled,.wallet-btn:disabled {
    cursor: not-allowed
}

.wallet-btn.block {
    display: flex;
    width: 100%
}

.wallet-btn.btn-circle {
    border-radius: 100px!important
}

.wallet-input-reversed.wallet-input .wallet-input-code-btn {
    color: var(--wallet-okd-input-code-reversed-common-btn-color)
}

.wallet-input-reversed.wallet-input .wallet-input-code-btn.disabled {
    color: var(--wallet-okd-input-code-reversed-common-btn-disabled-color)
}

.wallet-input-reversed.wallet-input .wallet-input-count-down {
    color: var(--wallet-okd-input-code-reversed-common-count-color)
}

.wallet-input-reversed.wallet-input-search .wallet-input-prefix .wallet-input-search-prefix-icon {
    color: var(--wallet-okd-input-search-reversed-prefix-icon-color)
}

.wallet-input-reversed.wallet-input-search .wallet-input-error {
    color: var(--wallet-okd-input-search-reversed-error-tips-color)
}

.wallet-input-reversed.wallet-input-search .wallet-input-box {
    background-color: var(--wallet-okd-input-search-reversed-default-background);
    border-color: var(--wallet-okd-input-search-reversed-default-border-color);
    box-shadow: var(--wallet-okd-input-search-reversed-default-shadow)
}

.wallet-input-reversed.wallet-input-search .wallet-input-input {
    color: var(--wallet-okd-input-search-reversed-default-text-color)
}

.wallet-input-reversed.wallet-input-search .wallet-input-input::-webkit-input-placeholder {
    -webkit-text-fill-color: var(--wallet-okd-input-search-reversed-default-placeholder-color);
    color: var(--wallet-okd-input-search-reversed-default-placeholder-color)
}

.wallet-input-reversed.wallet-input-search .wallet-input-input:-moz-placeholder {
    -webkit-text-fill-color: var(--wallet-okd-input-search-reversed-default-placeholder-color);
    color: var(--wallet-okd-input-search-reversed-default-placeholder-color);
    opacity: 1
}

.wallet-input-reversed.wallet-input-search .wallet-input-input::-ms-input-placeholder {
    -webkit-text-fill-color: var(--wallet-okd-input-search-reversed-default-placeholder-color);
    color: var(--wallet-okd-input-search-reversed-default-placeholder-color)
}

.wallet-input-reversed.wallet-input-search.hover .wallet-input-box,.wallet-input-reversed.wallet-input-search:hover .wallet-input-box {
    background: var(--wallet-okd-input-search-reversed-hover-background);
    border: thin solid var(--wallet-okd-input-search-reversed-hover-border-color);
    box-shadow: var(--wallet-okd-input-search-reversed-hover-shadow)
}

.wallet-input-reversed.wallet-input-search.hover .wallet-input-box .wallet-input-input,.wallet-input-reversed.wallet-input-search:hover .wallet-input-box .wallet-input-input {
    -webkit-text-fill-color: var(--wallet-okd-input-search-reversed-hover-text-color);
    caret-color: var(--wallet-okd-input-search-reversed-hover-caret-color);
    color: var(--wallet-okd-input-search-reversed-hover-text-color)
}

.wallet-input-reversed.wallet-input-search.hover .wallet-input-box .wallet-input-input::-webkit-input-placeholder,.wallet-input-reversed.wallet-input-search:hover .wallet-input-box .wallet-input-input::-webkit-input-placeholder {
    -webkit-text-fill-color: var(--wallet-okd-input-search-reversed-hover-placeholder-color);
    color: var(--wallet-okd-input-search-reversed-hover-placeholder-color)
}

.wallet-input-reversed.wallet-input-search.hover .wallet-input-box .wallet-input-input:-moz-placeholder,.wallet-input-reversed.wallet-input-search:hover .wallet-input-box .wallet-input-input:-moz-placeholder {
    -webkit-text-fill-color: var(--wallet-okd-input-search-reversed-hover-placeholder-color);
    color: var(--wallet-okd-input-search-reversed-hover-placeholder-color);
    opacity: 1
}

.wallet-input-reversed.wallet-input-search.hover .wallet-input-box .wallet-input-input::-ms-input-placeholder,.wallet-input-reversed.wallet-input-search:hover .wallet-input-box .wallet-input-input::-ms-input-placeholder {
    -webkit-text-fill-color: var(--wallet-okd-input-search-reversed-hover-placeholder-color);
    color: var(--wallet-okd-input-search-reversed-hover-placeholder-color)
}

.wallet-input-reversed.wallet-input-search.focus .wallet-input-box {
    background: var(--wallet-okd-input-search-reversed-focus-background);
    border: thin solid var(--wallet-okd-input-search-reversed-focus-border-color);
    box-shadow: var(--wallet-okd-input-search-reversed-focus-shadow)
}

.wallet-input-reversed.wallet-input-search.focus .wallet-input-box .wallet-input-input {
    -webkit-text-fill-color: var(--wallet-okd-input-search-reversed-focus-text-color);
    caret-color: var(--wallet-okd-input-search-reversed-focus-caret-color);
    color: var(--wallet-okd-input-search-reversed-focus-text-color)
}

.wallet-input-reversed.wallet-input-search.focus .wallet-input-box .wallet-input-input::-webkit-input-placeholder {
    -webkit-text-fill-color: var(--wallet-okd-input-search-reversed-focus-placeholder-color);
    color: var(--wallet-okd-input-search-reversed-focus-placeholder-color)
}

.wallet-input-reversed.wallet-input-search.focus .wallet-input-box .wallet-input-input:-moz-placeholder {
    -webkit-text-fill-color: var(--wallet-okd-input-search-reversed-focus-placeholder-color);
    color: var(--wallet-okd-input-search-reversed-focus-placeholder-color);
    opacity: 1
}

.wallet-input-reversed.wallet-input-search.focus .wallet-input-box .wallet-input-input::-ms-input-placeholder {
    -webkit-text-fill-color: var(--wallet-okd-input-search-reversed-focus-placeholder-color);
    color: var(--wallet-okd-input-search-reversed-focus-placeholder-color)
}

.wallet-input-reversed.wallet-input-search.disabled .wallet-input-box {
    background: var(--wallet-okd-input-search-reversed-disabled-background);
    border: thin solid var(--wallet-okd-input-search-reversed-disabled-border-color);
    box-shadow: var(--wallet-okd-input-search-reversed-disabled-shadow)
}

.wallet-input-reversed.wallet-input-search.disabled .wallet-input-box .wallet-input-input {
    -webkit-text-fill-color: var(--wallet-okd-input-search-reversed-disabled-text-color);
    caret-color: var(--wallet-okd-input-search-reversed-disabled-caret-color);
    color: var(--wallet-okd-input-search-reversed-disabled-text-color)
}

.wallet-input-reversed.wallet-input-search.disabled .wallet-input-box .wallet-input-input::-webkit-input-placeholder {
    -webkit-text-fill-color: var(--wallet-okd-input-search-reversed-disabled-placeholder-color);
    color: var(--wallet-okd-input-search-reversed-disabled-placeholder-color)
}

.wallet-input-reversed.wallet-input-search.disabled .wallet-input-box .wallet-input-input:-moz-placeholder {
    -webkit-text-fill-color: var(--wallet-okd-input-search-reversed-disabled-placeholder-color);
    color: var(--wallet-okd-input-search-reversed-disabled-placeholder-color);
    opacity: 1
}

.wallet-input-reversed.wallet-input-search.disabled .wallet-input-box .wallet-input-input::-ms-input-placeholder {
    -webkit-text-fill-color: var(--wallet-okd-input-search-reversed-disabled-placeholder-color);
    color: var(--wallet-okd-input-search-reversed-disabled-placeholder-color)
}

.wallet-input-reversed.wallet-input-search.error .wallet-input-box {
    background: var(--wallet-okd-input-search-reversed-error-background);
    border: thin solid var(--wallet-okd-input-search-reversed-error-border-color);
    box-shadow: var(--wallet-okd-input-search-reversed-error-shadow)
}

.wallet-input-reversed.wallet-input-search.error .wallet-input-box .wallet-input-input {
    -webkit-text-fill-color: var(--wallet-okd-input-search-reversed-error-text-color);
    caret-color: var(--wallet-okd-input-search-reversed-error-caret-color);
    color: var(--wallet-okd-input-search-reversed-error-text-color)
}

.wallet-input-reversed.wallet-input-search.error .wallet-input-box .wallet-input-input::-webkit-input-placeholder {
    -webkit-text-fill-color: var(--wallet-okd-input-search-reversed-error-placeholder-color);
    color: var(--wallet-okd-input-search-reversed-error-placeholder-color)
}

.wallet-input-reversed.wallet-input-search.error .wallet-input-box .wallet-input-input:-moz-placeholder {
    -webkit-text-fill-color: var(--wallet-okd-input-search-reversed-error-placeholder-color);
    color: var(--wallet-okd-input-search-reversed-error-placeholder-color);
    opacity: 1
}

.wallet-input-reversed.wallet-input-search.error .wallet-input-box .wallet-input-input::-ms-input-placeholder {
    -webkit-text-fill-color: var(--wallet-okd-input-search-reversed-error-placeholder-color);
    color: var(--wallet-okd-input-search-reversed-error-placeholder-color)
}

.wallet-label {
    display: flex;
    width: 100%
}

.wallet-label.top-right {
    justify-content: flex-end
}

.wallet-label.top-between {
    justify-content: space-between
}

.wallet-label-text {
    color: var(--wallet-okd-input-label-color);
    font-weight: 500
}

.wallet-label-action {
    color: var(--wallet-okd-input-action-color);
    cursor: pointer;
    font-weight: 500
}

.wallet-label.label-xl .wallet-label-text {
    font-size: var(--wallet-okd-input-xl-label-font-size);
    line-height: var(--wallet-okd-input-xl-label-line-height);
    margin-bottom: 6px;
    margin-bottom: var(--wallet-okd-input-xl-label-margin,6px)
}

.wallet-label.label-xl .wallet-label-action {
    font-size: var(--wallet-okd-input-xl-action-font-size);
    line-height: var(--wallet-okd-input-xl-action-line-height);
    margin-bottom: 6px;
    margin-bottom: var(--wallet-okd-input-xl-label-margin,6px)
}

.wallet-label.label-xl .wallet-label-place {
    min-height: var(--wallet-okd-input-xl-label-line-height)
}

.wallet-label.label-lg .wallet-label-text {
    font-size: var(--wallet-okd-input-lg-label-font-size);
    line-height: var(--wallet-okd-input-lg-label-line-height);
    margin-bottom: 6px;
    margin-bottom: var(--wallet-okd-input-lg-label-margin,6px)
}

.wallet-label.label-lg .wallet-label-action {
    font-size: var(--wallet-okd-input-lg-action-font-size);
    line-height: var(--wallet-okd-input-lg-action-line-height);
    margin-bottom: 6px;
    margin-bottom: var(--wallet-okd-input-lg-label-margin,6px)
}

.wallet-label.label-lg .wallet-label-place {
    min-height: var(--wallet-okd-input-lg-label-line-height)
}

.wallet-label.label-xs .wallet-label-text {
    font-size: var(--wallet-okd-input-xs-label-font-size);
    line-height: var(--wallet-okd-input-xs-label-line-height);
    margin-bottom: 4px;
    margin-bottom: var(--wallet-okd-input-xs-label-margin,4px)
}

.wallet-label.label-xs .wallet-label-action {
    font-size: var(--wallet-okd-input-xs-action-font-size);
    line-height: var(--wallet-okd-input-xs-action-line-height);
    margin-bottom: 4px;
    margin-bottom: var(--wallet-okd-input-xs-label-margin,4px)
}

.wallet-label.label-xs .wallet-label-place {
    min-height: var(--wallet-okd-input-xs-label-line-height)
}

.wallet-label.label-sm .wallet-label-text {
    font-size: var(--wallet-okd-input-sm-label-font-size);
    line-height: var(--wallet-okd-input-sm-label-line-height);
    margin-bottom: 4px;
    margin-bottom: var(--wallet-okd-input-sm-label-margin,4px)
}

.wallet-label.label-sm .wallet-label-action {
    font-size: var(--wallet-okd-input-sm-action-font-size);
    line-height: var(--wallet-okd-input-sm-action-line-height);
    margin-bottom: 4px;
    margin-bottom: var(--wallet-okd-input-sm-label-margin,4px)
}

.wallet-label.label-sm .wallet-label-place {
    min-height: var(--wallet-okd-input-sm-label-line-height)
}

.wallet-label.label-md .wallet-label-text {
    font-size: var(--wallet-okd-input-md-label-font-size);
    line-height: var(--wallet-okd-input-md-label-line-height);
    margin-bottom: 4px;
    margin-bottom: var(--wallet-okd-input-md-label-margin,4px)
}

.wallet-label.label-md .wallet-label-action {
    font-size: var(--wallet-okd-input-md-action-font-size);
    line-height: var(--wallet-okd-input-md-action-line-height);
    margin-bottom: 4px;
    margin-bottom: var(--wallet-okd-input-md-label-margin,4px)
}

.wallet-label.label-md .wallet-label-place {
    min-height: var(--wallet-okd-input-md-label-line-height)
}

.wallet-input-caret-color {
    caret-color: var(--wallet-okd-input-focus-caret-color)
}

.wallet-input-caret-color input[type=search]::-webkit-search-cancel-button {
    -webkit-appearance: none;
    appearance: none
}

.wallet-input-caret-color input[type=search]::-moz-search-cancel-button {
    -moz-appearance: none;
    appearance: none
}

.wallet-input-caret-color input::-ms-clear,.wallet-input-caret-color input::-ms-reveal {
    display: none
}

.wallet-input-caret-color input::-o-clear {
    display: none
}

.wallet-input {
    align-items: flex-start;
    display: flex;
    flex-direction: column;
    position: relative
}

.wallet-input input[type=search]::-webkit-search-cancel-button {
    -webkit-appearance: none;
    appearance: none
}

.wallet-input input[type=search]::-moz-search-cancel-button {
    -moz-appearance: none;
    appearance: none
}

.wallet-input input::-ms-clear,.wallet-input input::-ms-reveal {
    display: none
}

.wallet-input input::-o-clear {
    display: none
}

.wallet-input * {
    box-sizing: border-box
}

.wallet-input-prefix,.wallet-input-suffix {
    align-items: center;
    display: flex;
    flex-shrink: 1;
    white-space: nowrap
}

.wallet-input-input {
    background: transparent;
    border: none;
    color: var(--wallet-okd-input-default-text-color);
    flex-grow: 1;
    font-family: inherit;
    height: 100%;
    outline: none;
    width: 100%
}

.wallet-input-input::-webkit-input-placeholder {
    -webkit-text-fill-color: var(--wallet-okd-input-default-placeholder-color);
    color: var(--wallet-okd-input-default-placeholder-color)
}

.wallet-input-input:-moz-placeholder {
    -webkit-text-fill-color: var(--wallet-okd-input-default-placeholder-color);
    color: var(--wallet-okd-input-default-placeholder-color);
    opacity: 1
}

.wallet-input-input::-ms-input-placeholder {
    -webkit-text-fill-color: var(--wallet-okd-input-default-placeholder-color);
    color: var(--wallet-okd-input-default-placeholder-color)
}

.wallet-input-input:-webkit-autofill {
    -webkit-text-fill-color: var(--wallet-okd-input-default-text-color)!important;
    border: none;
    -webkit-box-shadow: 0 0 0 30px var(--wallet-okd-input-default-background) inset
}

.wallet-input-input.input-textarea {
    box-shadow: none;
    outline: none;
    resize: none
}

.wallet-input-custom-placeholder {
    position: relative;
    width: 100%
}

.wallet-input-ellipsis {
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap
}

.wallet-input-placeholder {
    bottom: 0;
    color: var(--wallet-okd-input-default-placeholder-color);
    left: 0;
    pointer-events: none;
    position: absolute;
    right: 0;
    top: 50%;
    transform: translateY(-50%)
}

.wallet-input-tips-box {
    display: flex;
    width: 100%
}

.wallet-input-error {
    color: var(--wallet-okd-input-error-tips-color)
}

.wallet-input-tips {
    display: inline-block
}

.wallet-input-help-text,.wallet-input-tips {
    color: var(--wallet-okd-input-tips-text-color)
}

.wallet-input-help-text {
    flex-grow: 1;
    flex-shrink: 0;
    text-align: right
}

.wallet-input.hover,.wallet-input:hover {
    cursor: text
}

.wallet-input.hover .wallet-input-box,.wallet-input:hover .wallet-input-box {
    background: var(--wallet-okd-input-hover-background);
    border: thin solid var(--wallet-okd-input-hover-border-color);
    box-shadow: var(--wallet-okd-input-hover-shadow)
}

.wallet-input.hover .wallet-input-box .wallet-input-input,.wallet-input:hover .wallet-input-box .wallet-input-input {
    -webkit-text-fill-color: var(--wallet-okd-input-hover-text-color);
    caret-color: var(--wallet-okd-input-hover-caret-color);
    color: var(--wallet-okd-input-hover-text-color)
}

.wallet-input.hover .wallet-input-box .wallet-input-input::-webkit-input-placeholder,.wallet-input:hover .wallet-input-box .wallet-input-input::-webkit-input-placeholder {
    -webkit-text-fill-color: var(--wallet-okd-input-hover-placeholder-color);
    color: var(--wallet-okd-input-hover-placeholder-color)
}

.wallet-input.hover .wallet-input-box .wallet-input-input:-moz-placeholder,.wallet-input:hover .wallet-input-box .wallet-input-input:-moz-placeholder {
    -webkit-text-fill-color: var(--wallet-okd-input-hover-placeholder-color);
    color: var(--wallet-okd-input-hover-placeholder-color);
    opacity: 1
}

.wallet-input.hover .wallet-input-box .wallet-input-input::-ms-input-placeholder,.wallet-input:hover .wallet-input-box .wallet-input-input::-ms-input-placeholder {
    -webkit-text-fill-color: var(--wallet-okd-input-hover-placeholder-color);
    color: var(--wallet-okd-input-hover-placeholder-color)
}

.wallet-input.focus .wallet-input-box {
    background: var(--wallet-okd-input-focus-background);
    border: thin solid var(--wallet-okd-input-focus-border-color);
    box-shadow: var(--wallet-okd-input-focus-shadow)
}

.wallet-input.focus .wallet-input-box .wallet-input-input {
    -webkit-text-fill-color: var(--wallet-okd-input-focus-text-color);
    caret-color: var(--wallet-okd-input-focus-caret-color);
    color: var(--wallet-okd-input-focus-text-color)
}

.wallet-input.focus .wallet-input-box .wallet-input-input::-webkit-input-placeholder {
    -webkit-text-fill-color: var(--wallet-okd-input-focus-placeholder-color);
    color: var(--wallet-okd-input-focus-placeholder-color)
}

.wallet-input.focus .wallet-input-box .wallet-input-input:-moz-placeholder {
    -webkit-text-fill-color: var(--wallet-okd-input-focus-placeholder-color);
    color: var(--wallet-okd-input-focus-placeholder-color);
    opacity: 1
}

.wallet-input.focus .wallet-input-box .wallet-input-input::-ms-input-placeholder {
    -webkit-text-fill-color: var(--wallet-okd-input-focus-placeholder-color);
    color: var(--wallet-okd-input-focus-placeholder-color)
}

.wallet-input.readonly .wallet-input-box {
    background: var(--wallet-okd-input-default-background);
    background: var(--wallet-okd-input-readonly-background,var(--wallet-okd-input-default-background));
    border: thin solid var(--wallet-okd-input-readonly-border-color,var(--wallet-okd-input-default-border-color));
    box-shadow: var(--wallet-okd-input-default-shadow);
    box-shadow: var(--wallet-okd-input-readonly-shadow,var(--wallet-okd-input-default-shadow))
}

.wallet-input.readonly .wallet-input-box .wallet-input-input {
    -webkit-text-fill-color: var(--wallet-okd-input-default-text-color);
    -webkit-text-fill-color: var(--wallet-okd-input-readonly-text-color,var(--wallet-okd-input-default-text-color));
    caret-color: var(--wallet-okd-input-default-caret-color);
    caret-color: var(--wallet-okd-input-readonly-caret-color,var(--wallet-okd-input-default-caret-color));
    color: var(--wallet-okd-input-default-text-color);
    color: var(--wallet-okd-input-readonly-text-color,var(--wallet-okd-input-default-text-color))
}

.wallet-input.readonly .wallet-input-box .wallet-input-input::-webkit-input-placeholder {
    -webkit-text-fill-color: var(--wallet-okd-input-default-placeholder-color);
    -webkit-text-fill-color: var(--wallet-okd-input-readonly-placeholder-color,var(--wallet-okd-input-default-placeholder-color));
    color: var(--wallet-okd-input-default-placeholder-color);
    color: var(--wallet-okd-input-readonly-placeholder-color,var(--wallet-okd-input-default-placeholder-color))
}

.wallet-input.readonly .wallet-input-box .wallet-input-input:-moz-placeholder {
    -webkit-text-fill-color: var(--wallet-okd-input-default-placeholder-color);
    -webkit-text-fill-color: var(--wallet-okd-input-readonly-placeholder-color,var(--wallet-okd-input-default-placeholder-color));
    color: var(--wallet-okd-input-default-placeholder-color);
    color: var(--wallet-okd-input-readonly-placeholder-color,var(--wallet-okd-input-default-placeholder-color));
    opacity: 1
}

.wallet-input.readonly .wallet-input-box .wallet-input-input::-ms-input-placeholder {
    -webkit-text-fill-color: var(--wallet-okd-input-default-placeholder-color);
    -webkit-text-fill-color: var(--wallet-okd-input-readonly-placeholder-color,var(--wallet-okd-input-default-placeholder-color));
    color: var(--wallet-okd-input-default-placeholder-color);
    color: var(--wallet-okd-input-readonly-placeholder-color,var(--wallet-okd-input-default-placeholder-color))
}

.wallet-input.readonly.focus .wallet-input-box {
    border-color: var(--wallet-okd-input-focus-border-color)
}

.wallet-input.disabled {
    cursor: not-allowed
}

.wallet-input.disabled .wallet-input-box {
    background: var(--wallet-okd-input-disabled-background);
    border: thin solid var(--wallet-okd-input-disabled-border-color);
    box-shadow: var(--wallet-okd-input-disabled-shadow)
}

.wallet-input.disabled .wallet-input-box .wallet-input-input {
    -webkit-text-fill-color: var(--wallet-okd-input-disabled-text-color);
    caret-color: var(--wallet-okd-input-disabled-caret-color);
    color: var(--wallet-okd-input-disabled-text-color)
}

.wallet-input.disabled .wallet-input-box .wallet-input-input::-webkit-input-placeholder {
    -webkit-text-fill-color: var(--wallet-okd-input-disabled-placeholder-color);
    color: var(--wallet-okd-input-disabled-placeholder-color)
}

.wallet-input.disabled .wallet-input-box .wallet-input-input:-moz-placeholder {
    -webkit-text-fill-color: var(--wallet-okd-input-disabled-placeholder-color);
    color: var(--wallet-okd-input-disabled-placeholder-color);
    opacity: 1
}

.wallet-input.disabled .wallet-input-box .wallet-input-input::-ms-input-placeholder {
    -webkit-text-fill-color: var(--wallet-okd-input-disabled-placeholder-color);
    color: var(--wallet-okd-input-disabled-placeholder-color)
}

.wallet-input.disabled .wallet-input-input {
    cursor: not-allowed;
    opacity: 1
}

.wallet-input.disabled .wallet-input-input:-webkit-autofill {
    -webkit-text-fill-color: var(--wallet-okd-input-disabled-text-color)!important;
    -webkit-box-shadow: 0 0 0 30px var(--wallet-okd-input-disabled-background) inset
}

.wallet-input.error .wallet-input-box {
    background: var(--wallet-okd-input-error-background);
    border: thin solid var(--wallet-okd-input-error-border-color);
    box-shadow: var(--wallet-okd-input-error-shadow)
}

.wallet-input.error .wallet-input-box .wallet-input-input {
    -webkit-text-fill-color: var(--wallet-okd-input-error-text-color);
    caret-color: var(--wallet-okd-input-error-caret-color);
    color: var(--wallet-okd-input-error-text-color)
}

.wallet-input.error .wallet-input-box .wallet-input-input::-webkit-input-placeholder {
    -webkit-text-fill-color: var(--wallet-okd-input-error-placeholder-color);
    color: var(--wallet-okd-input-error-placeholder-color)
}

.wallet-input.error .wallet-input-box .wallet-input-input:-moz-placeholder {
    -webkit-text-fill-color: var(--wallet-okd-input-error-placeholder-color);
    color: var(--wallet-okd-input-error-placeholder-color);
    opacity: 1
}

.wallet-input.error .wallet-input-box .wallet-input-input::-ms-input-placeholder {
    -webkit-text-fill-color: var(--wallet-okd-input-error-placeholder-color);
    color: var(--wallet-okd-input-error-placeholder-color)
}

.wallet-input.error .wallet-input-error {
    display: inline-block
}

.wallet-input.no-border .wallet-input-box {
    background: transparent;
    border: thin solid transparent;
    box-shadow: none
}

.wallet-input-textarea-resize-virtual-dom::-webkit-scrollbar {
    display: none;
    height: 0;
    width: 0
}

.wallet-input-box {
    align-items: center;
    background: var(--wallet-okd-input-default-background);
    border: thin solid var(--wallet-okd-input-default-border-color);
    box-shadow: var(--wallet-okd-input-default-shadow);
    display: flex;
    transition: border-color .3s,box-shadow .3s;
    width: 100%
}

.wallet-input-xl>.wallet-input-box {
    border-radius: var(--wallet-okd-input-xl-border-radius);
    height: var(--wallet-okd-input-xl-height);
    padding: 0 8px;
    padding: 0 var(--wallet-okd-input-xl-padding-horizontal,8px)
}

.wallet-input-xl>.wallet-input-box.auto-size {
    height: -moz-fit-content;
    height: fit-content;
    min-height: var(--wallet-okd-input-xl-height)
}

.wallet-input-xl>.wallet-input-box.no-padding-left {
    padding-left: 0
}

.wallet-input-xl>.wallet-input-box.no-padding-right {
    padding-right: 0
}

.wallet-input-xl>.wallet-input-box.ta {
    height: 100%;
    padding: 8px
}

.wallet-input-xl>.wallet-input-box.auto-resize-auto-height {
    height: -moz-fit-content;
    height: fit-content;
    min-height: var(--wallet-okd-input-xl-height)
}

.wallet-input-xl>.wallet-input-box.input-circle {
    border-radius: 100px
}

.wallet-input-xl .wallet-input-input {
    font-size: var(--wallet-okd-input-xl-text-font-size);
    padding: calc(var(--wallet-okd-input-xl-height)/2 - var(--wallet-okd-input-xl-text-font-size)/2 - 2px) 0
}

.wallet-input-xl .wallet-input-input::-webkit-input-placeholder {
    font-size: var(--wallet-okd-input-xl-text-font-size);
    font-weight: 400;
    text-overflow: ellipsis
}

.wallet-input-xl .wallet-input-input:-moz-placeholder {
    font-size: var(--wallet-okd-input-xl-text-font-size);
    font-weight: 400;
    text-overflow: ellipsis
}

.wallet-input-xl .wallet-input-input::-ms-input-placeholder {
    font-size: var(--wallet-okd-input-xl-text-font-size);
    font-weight: 400;
    text-overflow: ellipsis
}

.wallet-input-xl .wallet-input-input.ta {
    padding: 0
}

.wallet-input-xl .wallet-input-input.textarea-auto-resize {
    line-height: var(--wallet-okd-input-xl-text-font-size)
}

.wallet-input-xl .wallet-input-placeholder {
    font-size: var(--wallet-okd-input-xl-text-font-size);
    height: calc(var(--wallet-okd-input-xl-text-font-size) + 2px);
    line-height: calc(var(--wallet-okd-input-xl-text-font-size) + 2px)
}

.wallet-input-xl .wallet-input.wallet-input-place-mode .wallet-input-tips-box {
    min-height: calc(var(--wallet-okd-input-xl-tip-line-height) + 6px);
    min-height: calc(var(--wallet-okd-input-xl-tip-line-height) + var(--wallet-okd-input-xl-tip-margin, 6px))
}

.wallet-input-xl .wallet-input-error {
    font-size: var(--wallet-okd-input-xl-error-font-size);
    line-height: var(--wallet-okd-input-xl-error-line-height);
    margin-top: 6px;
    margin-top: var(--wallet-okd-input-xl-tip-margin,6px)
}

.wallet-input-xl .wallet-input-help-text,.wallet-input-xl .wallet-input-tips {
    font-size: var(--wallet-okd-input-xl-tip-font-size);
    line-height: var(--wallet-okd-input-xl-tip-line-height);
    margin-top: 6px;
    margin-top: var(--wallet-okd-input-xl-tip-margin,6px)
}

.wallet-input-lg>.wallet-input-box {
    border-radius: var(--wallet-okd-input-lg-border-radius);
    height: var(--wallet-okd-input-lg-height);
    padding: 0 8px;
    padding: 0 var(--wallet-okd-input-lg-padding-horizontal,8px)
}

.wallet-input-lg>.wallet-input-box.auto-size {
    height: -moz-fit-content;
    height: fit-content;
    min-height: var(--wallet-okd-input-lg-height)
}

.wallet-input-lg>.wallet-input-box.no-padding-left {
    padding-left: 0
}

.wallet-input-lg>.wallet-input-box.no-padding-right {
    padding-right: 0
}

.wallet-input-lg>.wallet-input-box.ta {
    height: 100%;
    padding: 8px
}

.wallet-input-lg>.wallet-input-box.auto-resize-auto-height {
    height: -moz-fit-content;
    height: fit-content;
    min-height: var(--wallet-okd-input-lg-height)
}

.wallet-input-lg>.wallet-input-box.input-circle {
    border-radius: 100px
}

.wallet-input-lg .wallet-input-input {
    font-size: var(--wallet-okd-input-lg-text-font-size);
    padding: calc(var(--wallet-okd-input-lg-height)/2 - var(--wallet-okd-input-lg-text-font-size)/2 - 2px) 0
}

.wallet-input-lg .wallet-input-input::-webkit-input-placeholder {
    font-size: var(--wallet-okd-input-lg-text-font-size);
    font-weight: 400;
    text-overflow: ellipsis
}

.wallet-input-lg .wallet-input-input:-moz-placeholder {
    font-size: var(--wallet-okd-input-lg-text-font-size);
    font-weight: 400;
    text-overflow: ellipsis
}

.wallet-input-lg .wallet-input-input::-ms-input-placeholder {
    font-size: var(--wallet-okd-input-lg-text-font-size);
    font-weight: 400;
    text-overflow: ellipsis
}

.wallet-input-lg .wallet-input-input.ta {
    padding: 0
}

.wallet-input-lg .wallet-input-input.textarea-auto-resize {
    line-height: var(--wallet-okd-input-lg-text-font-size)
}

.wallet-input-lg .wallet-input-placeholder {
    font-size: var(--wallet-okd-input-lg-text-font-size);
    height: calc(var(--wallet-okd-input-lg-text-font-size) + 2px);
    line-height: calc(var(--wallet-okd-input-lg-text-font-size) + 2px)
}

.wallet-input-lg .wallet-input.wallet-input-place-mode .wallet-input-tips-box {
    min-height: calc(var(--wallet-okd-input-lg-tip-line-height) + 6px);
    min-height: calc(var(--wallet-okd-input-lg-tip-line-height) + var(--wallet-okd-input-lg-tip-margin, 6px))
}

.wallet-input-lg .wallet-input-error {
    font-size: var(--wallet-okd-input-lg-error-font-size);
    line-height: var(--wallet-okd-input-lg-error-line-height);
    margin-top: 6px;
    margin-top: var(--wallet-okd-input-lg-tip-margin,6px)
}

.wallet-input-lg .wallet-input-help-text,.wallet-input-lg .wallet-input-tips {
    font-size: var(--wallet-okd-input-lg-tip-font-size);
    line-height: var(--wallet-okd-input-lg-tip-line-height);
    margin-top: 6px;
    margin-top: var(--wallet-okd-input-lg-tip-margin,6px)
}

.wallet-input-xs>.wallet-input-box {
    border-radius: var(--wallet-okd-input-xs-border-radius);
    height: var(--wallet-okd-input-xs-height);
    padding: 0 8px;
    padding: 0 var(--wallet-okd-input-xs-padding-horizontal,8px)
}

.wallet-input-xs>.wallet-input-box.auto-size {
    height: -moz-fit-content;
    height: fit-content;
    min-height: var(--wallet-okd-input-xs-height)
}

.wallet-input-xs>.wallet-input-box.no-padding-left {
    padding-left: 0
}

.wallet-input-xs>.wallet-input-box.no-padding-right {
    padding-right: 0
}

.wallet-input-xs>.wallet-input-box.ta {
    height: 100%;
    padding: 8px
}

.wallet-input-xs>.wallet-input-box.auto-resize-auto-height {
    height: -moz-fit-content;
    height: fit-content;
    min-height: var(--wallet-okd-input-xs-height)
}

.wallet-input-xs>.wallet-input-box.input-circle {
    border-radius: 100px
}

.wallet-input-xs .wallet-input-input {
    font-size: var(--wallet-okd-input-xs-text-font-size);
    padding: calc(var(--wallet-okd-input-xs-height)/2 - var(--wallet-okd-input-xs-text-font-size)/2 - 2px) 0
}

.wallet-input-xs .wallet-input-input::-webkit-input-placeholder {
    font-size: var(--wallet-okd-input-xs-text-font-size);
    font-weight: 400;
    text-overflow: ellipsis
}

.wallet-input-xs .wallet-input-input:-moz-placeholder {
    font-size: var(--wallet-okd-input-xs-text-font-size);
    font-weight: 400;
    text-overflow: ellipsis
}

.wallet-input-xs .wallet-input-input::-ms-input-placeholder {
    font-size: var(--wallet-okd-input-xs-text-font-size);
    font-weight: 400;
    text-overflow: ellipsis
}

.wallet-input-xs .wallet-input-input.ta {
    padding: 0
}

.wallet-input-xs .wallet-input-input.textarea-auto-resize {
    line-height: var(--wallet-okd-input-xs-text-font-size)
}

.wallet-input-xs .wallet-input-placeholder {
    font-size: var(--wallet-okd-input-xs-text-font-size);
    height: calc(var(--wallet-okd-input-xs-text-font-size) + 2px);
    line-height: calc(var(--wallet-okd-input-xs-text-font-size) + 2px)
}

.wallet-input-xs .wallet-input.wallet-input-place-mode .wallet-input-tips-box {
    min-height: calc(var(--wallet-okd-input-xs-tip-line-height) + 4px);
    min-height: calc(var(--wallet-okd-input-xs-tip-line-height) + var(--wallet-okd-input-xs-tip-margin, 4px))
}

.wallet-input-xs .wallet-input-error {
    font-size: var(--wallet-okd-input-xs-error-font-size);
    line-height: var(--wallet-okd-input-xs-error-line-height);
    margin-top: 4px;
    margin-top: var(--wallet-okd-input-xs-tip-margin,4px)
}

.wallet-input-xs .wallet-input-help-text,.wallet-input-xs .wallet-input-tips {
    font-size: var(--wallet-okd-input-xs-tip-font-size);
    line-height: var(--wallet-okd-input-xs-tip-line-height);
    margin-top: 4px;
    margin-top: var(--wallet-okd-input-xs-tip-margin,4px)
}

.wallet-input-sm>.wallet-input-box {
    border-radius: var(--wallet-okd-input-sm-border-radius);
    height: var(--wallet-okd-input-sm-height);
    padding: 0 8px;
    padding: 0 var(--wallet-okd-input-sm-padding-horizontal,8px)
}

.wallet-input-sm>.wallet-input-box.auto-size {
    height: -moz-fit-content;
    height: fit-content;
    min-height: var(--wallet-okd-input-sm-height)
}

.wallet-input-sm>.wallet-input-box.no-padding-left {
    padding-left: 0
}

.wallet-input-sm>.wallet-input-box.no-padding-right {
    padding-right: 0
}

.wallet-input-sm>.wallet-input-box.ta {
    height: 100%;
    padding: 8px
}

.wallet-input-sm>.wallet-input-box.auto-resize-auto-height {
    height: -moz-fit-content;
    height: fit-content;
    min-height: var(--wallet-okd-input-sm-height)
}

.wallet-input-sm>.wallet-input-box.input-circle {
    border-radius: 100px
}

.wallet-input-sm .wallet-input-input {
    font-size: var(--wallet-okd-input-sm-text-font-size);
    padding: calc(var(--wallet-okd-input-sm-height)/2 - var(--wallet-okd-input-sm-text-font-size)/2 - 2px) 0
}

.wallet-input-sm .wallet-input-input::-webkit-input-placeholder {
    font-size: var(--wallet-okd-input-sm-text-font-size);
    font-weight: 400;
    text-overflow: ellipsis
}

.wallet-input-sm .wallet-input-input:-moz-placeholder {
    font-size: var(--wallet-okd-input-sm-text-font-size);
    font-weight: 400;
    text-overflow: ellipsis
}

.wallet-input-sm .wallet-input-input::-ms-input-placeholder {
    font-size: var(--wallet-okd-input-sm-text-font-size);
    font-weight: 400;
    text-overflow: ellipsis
}

.wallet-input-sm .wallet-input-input.ta {
    padding: 0
}

.wallet-input-sm .wallet-input-input.textarea-auto-resize {
    line-height: var(--wallet-okd-input-sm-text-font-size)
}

.wallet-input-sm .wallet-input-placeholder {
    font-size: var(--wallet-okd-input-sm-text-font-size);
    height: calc(var(--wallet-okd-input-sm-text-font-size) + 2px);
    line-height: calc(var(--wallet-okd-input-sm-text-font-size) + 2px)
}

.wallet-input-sm .wallet-input.wallet-input-place-mode .wallet-input-tips-box {
    min-height: calc(var(--wallet-okd-input-sm-tip-line-height) + 4px);
    min-height: calc(var(--wallet-okd-input-sm-tip-line-height) + var(--wallet-okd-input-sm-tip-margin, 4px))
}

.wallet-input-sm .wallet-input-error {
    font-size: var(--wallet-okd-input-sm-error-font-size);
    line-height: var(--wallet-okd-input-sm-error-line-height);
    margin-top: 4px;
    margin-top: var(--wallet-okd-input-sm-tip-margin,4px)
}

.wallet-input-sm .wallet-input-help-text,.wallet-input-sm .wallet-input-tips {
    font-size: var(--wallet-okd-input-sm-tip-font-size);
    line-height: var(--wallet-okd-input-sm-tip-line-height);
    margin-top: 4px;
    margin-top: var(--wallet-okd-input-sm-tip-margin,4px)
}

.wallet-input-md>.wallet-input-box {
    border-radius: var(--wallet-okd-input-md-border-radius);
    height: var(--wallet-okd-input-md-height);
    padding: 0 8px;
    padding: 0 var(--wallet-okd-input-md-padding-horizontal,8px)
}

.wallet-input-md>.wallet-input-box.auto-size {
    height: -moz-fit-content;
    height: fit-content;
    min-height: var(--wallet-okd-input-md-height)
}

.wallet-input-md>.wallet-input-box.no-padding-left {
    padding-left: 0
}

.wallet-input-md>.wallet-input-box.no-padding-right {
    padding-right: 0
}

.wallet-input-md>.wallet-input-box.ta {
    height: 100%;
    padding: 8px
}

.wallet-input-md>.wallet-input-box.auto-resize-auto-height {
    height: -moz-fit-content;
    height: fit-content;
    min-height: var(--wallet-okd-input-md-height)
}

.wallet-input-md>.wallet-input-box.input-circle {
    border-radius: 100px
}

.wallet-input-md .wallet-input-input {
    font-size: var(--wallet-okd-input-md-text-font-size);
    padding: calc(var(--wallet-okd-input-md-height)/2 - var(--wallet-okd-input-md-text-font-size)/2 - 2px) 0
}

.wallet-input-md .wallet-input-input::-webkit-input-placeholder {
    font-size: var(--wallet-okd-input-md-text-font-size);
    font-weight: 400;
    text-overflow: ellipsis
}

.wallet-input-md .wallet-input-input:-moz-placeholder {
    font-size: var(--wallet-okd-input-md-text-font-size);
    font-weight: 400;
    text-overflow: ellipsis
}

.wallet-input-md .wallet-input-input::-ms-input-placeholder {
    font-size: var(--wallet-okd-input-md-text-font-size);
    font-weight: 400;
    text-overflow: ellipsis
}

.wallet-input-md .wallet-input-input.ta {
    padding: 0
}

.wallet-input-md .wallet-input-input.textarea-auto-resize {
    line-height: var(--wallet-okd-input-md-text-font-size)
}

.wallet-input-md .wallet-input-placeholder {
    font-size: var(--wallet-okd-input-md-text-font-size);
    height: calc(var(--wallet-okd-input-md-text-font-size) + 2px);
    line-height: calc(var(--wallet-okd-input-md-text-font-size) + 2px)
}

.wallet-input-md .wallet-input.wallet-input-place-mode .wallet-input-tips-box {
    min-height: calc(var(--wallet-okd-input-md-tip-line-height) + 4px);
    min-height: calc(var(--wallet-okd-input-md-tip-line-height) + var(--wallet-okd-input-md-tip-margin, 4px))
}

.wallet-input-md .wallet-input-error {
    font-size: var(--wallet-okd-input-md-error-font-size);
    line-height: var(--wallet-okd-input-md-error-line-height);
    margin-top: 4px;
    margin-top: var(--wallet-okd-input-md-tip-margin,4px)
}

.wallet-input-md .wallet-input-help-text,.wallet-input-md .wallet-input-tips {
    font-size: var(--wallet-okd-input-md-tip-font-size);
    line-height: var(--wallet-okd-input-md-tip-line-height);
    margin-top: 4px;
    margin-top: var(--wallet-okd-input-md-tip-margin,4px)
}

.wallet-input-prefix {
    height: 100%
}

.wallet-input-prefix .prefix-icon {
    color: var(--wallet-okd-input-icon-color)
}

.wallet-input-prefix .select {
    padding-right: 8px
}

.wallet-input-suffix {
    height: 100%
}

.wallet-input-suffix .suffix-icon {
    color: var(--wallet-okd-input-icon-color)
}

.wallet-input-suffix .clean-icon:hover {
    color: #000;
    color: var(--wallet-okd-input-search-suffix-icon-hover-color,#000)
}

.wallet-input-suffix .error-icon {
    color: var(--wallet-okd-input-error-tips-color)
}

.wallet-input-xl .wallet-input-prefix .prefix-icon {
    font-size: var(--wallet-okd-input-xl-icon-size);
    margin-left: 0;
    margin-right: var(--wallet-okd-input-xl-icon-margin)
}

.wallet-input-xl .wallet-input-suffix .suffix-icon {
    font-size: var(--wallet-okd-input-xl-icon-size);
    margin-left: var(--wallet-okd-input-xl-icon-margin);
    margin-right: 0
}

.wallet-input-lg .wallet-input-prefix .prefix-icon {
    font-size: var(--wallet-okd-input-lg-icon-size);
    margin-left: 0;
    margin-right: var(--wallet-okd-input-lg-icon-margin)
}

.wallet-input-lg .wallet-input-suffix .suffix-icon {
    font-size: var(--wallet-okd-input-lg-icon-size);
    margin-left: var(--wallet-okd-input-lg-icon-margin);
    margin-right: 0
}

.wallet-input-xs .wallet-input-prefix .prefix-icon {
    font-size: var(--wallet-okd-input-xs-icon-size);
    margin-left: 0;
    margin-right: var(--wallet-okd-input-xs-icon-margin)
}

.wallet-input-xs .wallet-input-suffix .suffix-icon {
    font-size: var(--wallet-okd-input-xs-icon-size);
    margin-left: var(--wallet-okd-input-xs-icon-margin);
    margin-right: 0
}

.wallet-input-sm .wallet-input-prefix .prefix-icon {
    font-size: var(--wallet-okd-input-sm-icon-size);
    margin-left: 0;
    margin-right: var(--wallet-okd-input-sm-icon-margin)
}

.wallet-input-sm .wallet-input-suffix .suffix-icon {
    font-size: var(--wallet-okd-input-sm-icon-size);
    margin-left: var(--wallet-okd-input-sm-icon-margin);
    margin-right: 0
}

.wallet-input-md .wallet-input-prefix .prefix-icon {
    font-size: var(--wallet-okd-input-md-icon-size);
    margin-left: 0;
    margin-right: var(--wallet-okd-input-md-icon-margin)
}

.wallet-input-md .wallet-input-suffix .suffix-icon {
    font-size: var(--wallet-okd-input-md-icon-size);
    margin-left: var(--wallet-okd-input-md-icon-margin);
    margin-right: 0
}

.wallet-input:hover .wallet-input-number-suffix:not(.operation-always) {
    opacity: 1
}

.wallet-input-number-inner {
    overflow: hidden
}

.wallet-input-number-suffix {
    align-items: center;
    border-left: 1px solid var(--wallet-okd-input-number-suffix-border-color,var(--wallet-okd-input-default-border-color));
    cursor: pointer;
    display: flex;
    flex-direction: column;
    height: 100%;
    justify-content: center;
    line-height: 0;
    margin-left: 6px;
    overflow: hidden;
    text-align: center;
    transition: opacity .5s;
    width: 24px
}

.wallet-input-number-suffix:not(.operation-always) {
    opacity: 0
}

.wallet-input-number-suffix-part {
    align-items: center;
    background: var(--wallet-okd-input-number-default-add-icon-background);
    box-sizing: border-box;
    display: flex;
    flex: 1 1;
    justify-content: center;
    width: 100%
}

.wallet-input-number-suffix-part .icon {
    color: var(--wallet-okd-input-number-default-add-icon-color);
    font-size: 13px
}

.wallet-input-number-suffix-part .hover,.wallet-input-number-suffix-part:not(.wallet-input-number-suffix-part-disabled):hover {
    background: var(--wallet-okd-input-number-hover-add-icon-background)
}

.wallet-input-number-suffix-part .hover .icon,.wallet-input-number-suffix-part:not(.wallet-input-number-suffix-part-disabled):hover .icon {
    color: var(--wallet-okd-input-number-hover-add-icon-color)
}

.wallet-input-number-suffix-part .active,.wallet-input-number-suffix-part:not(.wallet-input-number-suffix-part-disabled):active {
    background: var(--wallet-okd-input-number-active-add-icon-background)
}

.wallet-input-number-suffix-part .active .icon,.wallet-input-number-suffix-part:not(.wallet-input-number-suffix-part-disabled):active .icon {
    color: var(--wallet-okd-input-number-active-add-icon-color)
}

.wallet-input-number-suffix-part-disabled {
    cursor: not-allowed
}

.wallet-input-number-suffix-line {
    background: var(--wallet-okd-input-default-border-color);
    background: var(--wallet-okd-input-number-suffix-border-color,var(--wallet-okd-input-default-border-color));
    height: 1px;
    width: 100%
}

.wallet-input-number-suffix .up {
    transform: rotate(180deg)
}

.wallet-input-number-localization {
    text-align: right
}

.wallet-input-number-localization-percent {
    color: var(--wallet-okd-input-default-text-color);
    display: inline-block
}

.wallet-input-xl .wallet-input-number-suffix.xl {
    border-bottom-right-radius: calc(var(--wallet-okd-input-xl-border-radius) - 1px);
    border-top-right-radius: calc(var(--wallet-okd-input-xl-border-radius) - 1px)
}

.wallet-input-lg .wallet-input-number-suffix.lg {
    border-bottom-right-radius: calc(var(--wallet-okd-input-lg-border-radius) - 1px);
    border-top-right-radius: calc(var(--wallet-okd-input-lg-border-radius) - 1px)
}

.wallet-input-xs .wallet-input-number-suffix.xs {
    border-bottom-right-radius: calc(var(--wallet-okd-input-xs-border-radius) - 1px);
    border-top-right-radius: calc(var(--wallet-okd-input-xs-border-radius) - 1px)
}

.wallet-input-sm .wallet-input-number-suffix.sm {
    border-bottom-right-radius: calc(var(--wallet-okd-input-sm-border-radius) - 1px);
    border-top-right-radius: calc(var(--wallet-okd-input-sm-border-radius) - 1px)
}

.wallet-input-md .wallet-input-number-suffix.md {
    border-bottom-right-radius: calc(var(--wallet-okd-input-md-border-radius) - 1px);
    border-top-right-radius: calc(var(--wallet-okd-input-md-border-radius) - 1px)
}

.wallet-input-suffix .suffix-icon+.wallet-input-code-btn,.wallet-input-suffix .suffix-icon+.wallet-input-count-down {
    margin-left: var(--wallet-okd-input-md-icon-margin)
}

.wallet-input-count-down {
    color: var(--wallet-okd-input-code-common-count-color)
}

.wallet-input input::-webkit-inner-spin-button,.wallet-input input::-webkit-outer-spin-button {
    -webkit-appearance: none!important;
    margin: 0
}

.wallet-input input[type=number] {
    -moz-appearance: textfield
}

.wallet-input-xl .wallet-input-count-down {
    font-size: var(--wallet-okd-input-code-xl-count-font-size);
    line-height: var(--wallet-okd-input-code-xl-count-line-height)
}

.wallet-input-lg .wallet-input-count-down {
    font-size: var(--wallet-okd-input-code-lg-count-font-size);
    line-height: var(--wallet-okd-input-code-lg-count-line-height)
}

.wallet-input-xs .wallet-input-count-down {
    font-size: var(--wallet-okd-input-code-xs-count-font-size);
    line-height: var(--wallet-okd-input-code-xs-count-line-height)
}

.wallet-input-sm .wallet-input-count-down {
    font-size: var(--wallet-okd-input-code-sm-count-font-size);
    line-height: var(--wallet-okd-input-code-sm-count-line-height)
}

.wallet-input-md .wallet-input-count-down {
    font-size: var(--wallet-okd-input-code-md-count-font-size);
    line-height: var(--wallet-okd-input-code-md-count-line-height)
}

.wallet-input-switch-icon.icon {
    cursor: pointer
}

.wallet-input-prefix .wallet-input-search-prefix-icon {
    color: var(--wallet-okd-input-search-prefix-icon-color);
    cursor: pointer;
    font-size: var(--wallet-okd-input-search-prefix-icon-size);
    margin-right: 8px
}

.wallet-input-suffix .clean-icon {
    color: var(--wallet-okd-input-search-suffix-icon-color);
    cursor: pointer;
    font-size: var(--wallet-okd-input-search-suffix-icon-size)
}

.wallet-input-search .wallet-input-error {
    color: var(--wallet-okd-input-search-error-tips-color)
}

.wallet-input-search .wallet-input-box {
    background-color: var(--wallet-okd-input-search-default-background);
    /* border-color:var(--wallet-okd-input-search-default-border-color); */
    box-shadow: var(--wallet-okd-input-search-default-shadow)
}

.wallet-input-search .wallet-input-input {
    color: var(--wallet-okd-input-search-default-text-color)
}

.wallet-input-search .wallet-input-input::-webkit-input-placeholder {
    -webkit-text-fill-color: var(--wallet-okd-input-search-default-placeholder-color);
    color: var(--wallet-okd-input-search-default-placeholder-color)
}

.wallet-input-search .wallet-input-input:-moz-placeholder {
    -webkit-text-fill-color: var(--wallet-okd-input-search-default-placeholder-color);
    color: var(--wallet-okd-input-search-default-placeholder-color);
    opacity: 1
}

.wallet-input-search .wallet-input-input::-ms-input-placeholder {
    -webkit-text-fill-color: var(--wallet-okd-input-search-default-placeholder-color);
    color: var(--wallet-okd-input-search-default-placeholder-color)
}

.wallet-input-search.hover .wallet-input-box,.wallet-input-search:hover .wallet-input-box {
    background: var(--wallet-okd-input-search-hover-background);
    border: thin solid var(--wallet-okd-input-search-hover-border-color);
    box-shadow: var(--wallet-okd-input-search-hover-shadow)
}

.wallet-input-search.hover .wallet-input-box .wallet-input-input,.wallet-input-search:hover .wallet-input-box .wallet-input-input {
    -webkit-text-fill-color: var(--wallet-okd-input-search-hover-text-color);
    caret-color: var(--wallet-okd-input-search-hover-caret-color);
    color: var(--wallet-okd-input-search-hover-text-color)
}

.wallet-input-search.hover .wallet-input-box .wallet-input-input::-webkit-input-placeholder,.wallet-input-search:hover .wallet-input-box .wallet-input-input::-webkit-input-placeholder {
    -webkit-text-fill-color: var(--wallet-okd-input-search-hover-placeholder-color);
    color: var(--wallet-okd-input-search-hover-placeholder-color)
}

.wallet-input-search.hover .wallet-input-box .wallet-input-input:-moz-placeholder,.wallet-input-search:hover .wallet-input-box .wallet-input-input:-moz-placeholder {
    -webkit-text-fill-color: var(--wallet-okd-input-search-hover-placeholder-color);
    color: var(--wallet-okd-input-search-hover-placeholder-color);
    opacity: 1
}

.wallet-input-search.hover .wallet-input-box .wallet-input-input::-ms-input-placeholder,.wallet-input-search:hover .wallet-input-box .wallet-input-input::-ms-input-placeholder {
    -webkit-text-fill-color: var(--wallet-okd-input-search-hover-placeholder-color);
    color: var(--wallet-okd-input-search-hover-placeholder-color)
}

.wallet-input-search.focus .wallet-input-box {
    background: var(--wallet-okd-input-search-focus-background);
    border: thin solid var(--wallet-okd-input-search-focus-border-color);
    box-shadow: var(--wallet-okd-input-search-focus-shadow)
}

.wallet-input-search.focus .wallet-input-box .wallet-input-input {
    -webkit-text-fill-color: var(--wallet-okd-input-search-focus-text-color);
    caret-color: var(--wallet-okd-input-search-focus-caret-color);
    color: var(--wallet-okd-input-search-focus-text-color)
}

.wallet-input-search.focus .wallet-input-box .wallet-input-input::-webkit-input-placeholder {
    -webkit-text-fill-color: var(--wallet-okd-input-search-focus-placeholder-color);
    color: var(--wallet-okd-input-search-focus-placeholder-color)
}

.wallet-input-search.focus .wallet-input-box .wallet-input-input:-moz-placeholder {
    -webkit-text-fill-color: var(--wallet-okd-input-search-focus-placeholder-color);
    color: var(--wallet-okd-input-search-focus-placeholder-color);
    opacity: 1
}

.wallet-input-search.focus .wallet-input-box .wallet-input-input::-ms-input-placeholder {
    -webkit-text-fill-color: var(--wallet-okd-input-search-focus-placeholder-color);
    color: var(--wallet-okd-input-search-focus-placeholder-color)
}

.wallet-input-search.disabled .wallet-input-box {
    background: var(--wallet-okd-input-search-disabled-background);
    border: thin solid var(--wallet-okd-input-search-disabled-border-color);
    box-shadow: var(--wallet-okd-input-search-disabled-shadow)
}

.wallet-input-search.disabled .wallet-input-box .wallet-input-input {
    -webkit-text-fill-color: var(--wallet-okd-input-search-disabled-text-color);
    caret-color: var(--wallet-okd-input-search-disabled-caret-color);
    color: var(--wallet-okd-input-search-disabled-text-color)
}

.wallet-input-search.disabled .wallet-input-box .wallet-input-input::-webkit-input-placeholder {
    -webkit-text-fill-color: var(--wallet-okd-input-search-disabled-placeholder-color);
    color: var(--wallet-okd-input-search-disabled-placeholder-color)
}

.wallet-input-search.disabled .wallet-input-box .wallet-input-input:-moz-placeholder {
    -webkit-text-fill-color: var(--wallet-okd-input-search-disabled-placeholder-color);
    color: var(--wallet-okd-input-search-disabled-placeholder-color);
    opacity: 1
}

.wallet-input-search.disabled .wallet-input-box .wallet-input-input::-ms-input-placeholder {
    -webkit-text-fill-color: var(--wallet-okd-input-search-disabled-placeholder-color);
    color: var(--wallet-okd-input-search-disabled-placeholder-color)
}

.wallet-input-search.error .wallet-input-box {
    background: var(--wallet-okd-input-search-error-background);
    border: thin solid var(--wallet-okd-input-search-error-border-color);
    box-shadow: var(--wallet-okd-input-search-error-shadow)
}

.wallet-input-search.error .wallet-input-box .wallet-input-input {
    -webkit-text-fill-color: var(--wallet-okd-input-search-error-text-color);
    caret-color: var(--wallet-okd-input-search-error-caret-color);
    color: var(--wallet-okd-input-search-error-text-color)
}

.wallet-input-search.error .wallet-input-box .wallet-input-input::-webkit-input-placeholder {
    -webkit-text-fill-color: var(--wallet-okd-input-search-error-placeholder-color);
    color: var(--wallet-okd-input-search-error-placeholder-color)
}

.wallet-input-search.error .wallet-input-box .wallet-input-input:-moz-placeholder {
    -webkit-text-fill-color: var(--wallet-okd-input-search-error-placeholder-color);
    color: var(--wallet-okd-input-search-error-placeholder-color);
    opacity: 1
}

.wallet-input-search.error .wallet-input-box .wallet-input-input::-ms-input-placeholder {
    -webkit-text-fill-color: var(--wallet-okd-input-search-error-placeholder-color);
    color: var(--wallet-okd-input-search-error-placeholder-color)
}

.wallet-input-verify {
    display: flex;
    flex-direction: row;
    position: relative
}

.wallet-input-verify * {
    box-sizing: border-box
}

.wallet-input-verify .wallet-input-verify-input:focus {
    border: 1px solid var(--wallet-okd-input-focus-border-color);
    box-shadow: var(--wallet-okd-input-focus-shadow)
}

.wallet-input-verify .wallet-input-verify-input {
    align-items: center;
    background: transparent;
    background: var(--wallet-okd-input-default-background);
    border: thin solid var(--wallet-okd-input-default-border-color);
    box-shadow: var(--wallet-okd-input-default-shadow);
    caret-color: var(--wallet-okd-input-focus-caret-color);
    color: var(--wallet-okd-input-default-text-color);
    display: flex;
    font-family: inherit;
    outline: none;
    text-align: center;
    transition: border-color .3s,box-shadow .3s
}

.wallet-input-verify .wallet-input-verify-input:-webkit-autofill {
    -webkit-text-fill-color: var(--wallet-okd-input-default-text-color)!important;
    border: none;
    -webkit-box-shadow: 0 0 0 30px var(--wallet-okd-input-default-background) inset
}

.wallet-input-verify .wallet-input-verify-input.input-xl {
    border-radius: 6px;
    font-size: 26px;
    height: 44px;
    margin-right: 8px;
    width: 40px
}

.wallet-input-verify .wallet-input-verify-input.input-xl.auto-size {
    height: -moz-fit-content;
    height: fit-content;
    min-height: 44px
}

.wallet-input-verify .wallet-input-verify-input.input-xl:last-child {
    margin-right: 0
}

.wallet-input-verify .wallet-input-verify-input.input-lg {
    border-radius: 6px;
    font-size: 26px;
    height: 44px;
    margin-right: 8px;
    width: 40px
}

.wallet-input-verify .wallet-input-verify-input.input-lg.auto-size {
    height: -moz-fit-content;
    height: fit-content;
    min-height: 44px
}

.wallet-input-verify .wallet-input-verify-input.input-lg:last-child {
    margin-right: 0
}

.wallet-input-verify .wallet-input-verify-input.input-xs {
    border-radius: 6px;
    font-size: 26px;
    height: 44px;
    margin-right: 8px;
    width: 40px
}

.wallet-input-verify .wallet-input-verify-input.input-xs.auto-size {
    height: -moz-fit-content;
    height: fit-content;
    min-height: 44px
}

.wallet-input-verify .wallet-input-verify-input.input-xs:last-child {
    margin-right: 0
}

.wallet-input-verify .wallet-input-verify-input.input-sm {
    border-radius: 6px;
    font-size: 20px;
    height: 40px;
    margin-right: 10px;
    width: 40px
}

.wallet-input-verify .wallet-input-verify-input.input-sm.auto-size {
    height: -moz-fit-content;
    height: fit-content;
    min-height: 40px
}

.wallet-input-verify .wallet-input-verify-input.input-sm:last-child {
    margin-right: 0
}

.wallet-input-verify .wallet-input-verify-input.input-md {
    border-radius: 6px;
    font-size: 26px;
    height: 44px;
    margin-right: 8px;
    width: 40px
}

.wallet-input-verify .wallet-input-verify-input.input-md.auto-size {
    height: -moz-fit-content;
    height: fit-content;
    min-height: 44px
}

.wallet-input-verify .wallet-input-verify-input.input-md:last-child {
    margin-right: 0
}

.wallet-input-verify .wallet-input-verify-input.error {
    border-color: var(--wallet-okd-input-verify-error-border-color,var(--wallet-okd-input-error-border-color))
}

.wallet-input-verify .wallet-input-verify-input.disabled {
    -webkit-text-fill-color: var(--wallet-okd-input-disabled-text-color);
    background: var(--wallet-okd-input-disabled-background);
    border: thin solid var(--wallet-okd-input-disabled-border-color);
    box-shadow: var(--wallet-okd-input-disabled-shadow);
    caret-color: var(--wallet-okd-input-disabled-caret-color);
    color: var(--wallet-okd-input-disabled-text-color);
    cursor: not-allowed
}

.connect-wallet-button {
    background-color: #bcff2f;
    border-radius: 8px;
    color: #000;
    cursor: pointer;
    font-size: 14px;
    font-weight: 500;
    height: 36px;
    line-height: 36px;
    padding: 0 10px
}

.wallet-mobile-connect-button.connect-wallet-button {
    display: none
}