.footer-select-options-group {
  margin: 16px;
  width: 200px;
}

.footer-select-options-body {
  height: 288px;
  overflow: auto;
  margin-top: 16px;
}

.footer-select-options-group .bn-textField {
  width: 200px;
}

.footer-select-options-group-flat {
  color: var(--color-PrimaryText);
}

.footer-select-options {
  cursor: pointer;
}

.footer-select-options+.footer-select-options {
  margin-top: 16px;
}

.footer-select-options.active,
.footer-select-options:hover {
  color: var(--color-TextLink);
}

.footer-select-display {
  cursor: default;
}

.footer-select-options-group-flat .typography-Body3 {
  margin-bottom: 16px;
}

.footer-select-display.active,
.footer-select-display.active .text-body2 {
  color: var(--color-TextLink);
}

.footer-select-options-group-flat .text-body2 {
  color: var(--color-TertiaryText);
}

.footer-select-options-group-flat .bn-textField.data-size-small {
  height: 32px;
  font-size: 14px;
}

.footer-select-options-group-flat .bn-textField-input {
  font-size: 14px;
  width: 100%;
}
.lngAndCurrency .typography-Subtitle1 {
    font-weight: 600;
}

.lngAndCurrency-selectgroup-m {
    display: none;
}

.lngAndCurrency-selectgroup .bn-svg {
    font-size: 24px;
    width: 24px;
    color: var(--color-PrimaryText) !important;
}

.lngAndCurrency-selectgroup .text-body2 {
    color: var(--color-PrimaryText);
}

.footer-community-currency {
    margin-top: 16px;
}

.footer-theme-switch {
    margin-top: 16px;
    margin-left: 0;
    display: flex;
    align-items: center;
}

.footer-theme-switch .bn-switch.checked {
    background-color: var(--color-DisableBtn);
}

.footer-theme-switch .bn-switch .switch-icon {
    color: var(--color-TextOnYellow) !important;
    font-size: 16px;
}

.footer-theme-switch .footer-theme-switch-text {
    margin-right: 8px;
}

@media screen and (max-width: 1023px) {
    .lngAndCurrency-selectgroup{
        display: flex;
    }
    .footer-community-currency{
        margin-top: 0;
    }
    .footer-community-lang{
        -webkit-margin-end: 40px;
                margin-inline-end: 40px;
    }
    .footer-theme-switch {
        margin-top: 0;
        margin-left: 40px;
        align-items: flex-start;
    }
}
 
@media screen and (max-width: 767px) {
  .lngAndCurrency-selectgroup {
    display: none;
  }

  .lngAndCurrency-selectgroup-m {
    display: flex;
  }

  .lngAndCurrency-selectgroup-m .bn-svg {
    font-size: 24px;
  }

  .lngAndCurrency-selectgroup-m .text-body2 {
    color: var(--color-PrimaryText);
  }

  .lngAndCurrency-selectgroup-m-language {
    -webkit-margin-end: 40px;
            margin-inline-end: 40px;
  }

  .lngAndCurrency-selectgroup-m-bar {
    display: flex;
    justify-content: flex-end;
    align-items: center;
    height: 64px;
    font-size: 20px;
    color: var(--color-PrimaryText);
  }

  .lngAndCurrency-drawer {
    padding: 0 24px 24px 24px;
  }

  .lngAndCurrency-selectgroup-m-content {
    display: grid;
    grid-template-columns: 3fr 2fr;
  }

  .lngAndCurrency-selectgroup-m-content.onlyone {
    grid-template-columns: 1fr;
  }

  .lngAndCurrency-selectgroup-m-content .footer-select-options-group-flat {
    --scroll-color: var(--color-Line);
    max-height: calc(100vh - 88px);
    overflow: auto;
  }

  .lngAndCurrency-selectgroup-m-content .bn-textField {
    max-width: 100%;
  }

  .lngAndCurrency-selectgroup-m-content .language-select {
    -webkit-padding-end: 24px;
            padding-inline-end: 24px;
  }

  .lngAndCurrency-selectgroup-m-content .currency-select {
    -webkit-padding-end: 14px;
            padding-inline-end: 14px;
  }

  .lngAndCurrency-selectgroup-m-content .footer-select-options-group-flat+.footer-select-options-group-flat {
    -webkit-padding-start: 24px;
            padding-inline-start: 24px;
  }

  .footer-currency-item {
    display: flex;
    align-items: center;
  }

  .footer-theme-switch {
    margin-left: 40px;
    display: inline-block;
  }
}
.dropdownAndDraw-drawer {
  min-width: 375px;
}

.data-size-full .dropdownAndDraw-drawer {
  width: 100vw;
}

.dropdown-overflow .bn-drawer-wrap {
  overflow-y: auto;
  overflow-x: hidden;
}

.dropdownAndDraw-m-bar {
  display: flex;
  justify-content: flex-end;
  align-items: center;
  height: 64px;
  font-size: 20px;
  -webkit-padding-end: 24px;
          padding-inline-end: 24px;
  color: var(--color-PrimaryText);
}

.lngAndCurrency-drawer {
  padding: 0 24px 24px 24px;
}

.dropdownAndDraw-m-bar_close.bn-svg {
  font-size: 24px;
}

.bn-tooltips-wrap.active .bn-tooltips-ele .search-icon {
  color: var(--color-PrimaryYellow);
}

.dropdownAndDraw-drawer_removerediu.bn-drawer>.bn-drawer-wrap.data-dir-right {
  border-radius: 0;
}
.custom-controlled-dropdown .bn-bubble-content {
    border-radius: var(--radii-2l);
    background-color: var(--color-CardBg);
    box-shadow: var(--shadow-shadow2);
    overflow: hidden;
    transform: translateX(-1px);
}

.fiatPayment-search {
    width: 100%;
    padding: 10px;
    display: flex;
    align-items: center;
    justify-content: space-between;
    grid-gap: var(--space-m);
    gap: var(--space-m);
}
.fiatPayment-search-cancel {
    display: none;
}

.fiatPayment-search .fiatPayment-svg.bn-svg {
    width: 20px;
    height: 20px;
}

@media screen and (max-width: 768px) {
    .fiatPayment-search {
        padding: 6px 15px;
    }
    .fiatPayment-search input {
        border: none;
        background: var(--color-Input) !important;
    }
    .fiatPayment-search-cancel {
        display: block;
    }
    .fiatPayment-search .fiatPayment-svg.bn-svg {
        width: 16px;
        height: 16px;
    }
}

.fiatPaymentItem {
    width: 100%;
    padding: 10px;
    cursor: pointer;
    display: flex;
    align-items: center;
    justify-content: space-between;
}
.fiatPaymentItem:hover {
    background-color: var(--color-Input);
}
.fiatPaymentRender .fiatPaymentRender-svg.bn-svg {
    width: 16px;
    height: 16px;
    margin-left: 8px;
}
.fiatPaymentRender-svg.rotate-180 {
    transform: rotate(180deg);
}
.fiatPaymentRender-img {
    width: 16px;
    height: 16px;
    border-radius: 100%;
    margin-right: 8px;
}

.fiatPaymentItem-img {
    width: 20px;
    height: 20px;
    border-radius: 100%;
    margin-right: 8px;
}

.fiatPaymentItem .fiatPaymentItem-checked-svg.bn-svg {
    width: 16px;
    height: 16px;
}

@media screen and (max-width: 768px) {
    .fiatPaymentItem {
        padding: 10px var(--space-m);
    }
    .fiatPaymentItem-img {
        margin-right: 12px;
    }
}

.fiatPayment-scroll {
    overflow-y: auto;
    height: 310px;
}
.fiatPayment-label {
    padding: 6px 10px;
}

@media screen and (max-width: 767px) {
    .fiatPayment-list {
        margin-top: 10px;
    }
    .fiatPayment-label {
        padding: 16px var(--space-m) 8px;
    }
    .fiatPayment-scroll {
        overflow-y: auto;
        height: 70vh;
    }
}

.deposit-side-drawer-guide-text:hover {
    color: var(--color-TertiaryText)
}

.beginner-deposit-tutorial-content {
    display: flex;
    flex-direction: column;
    grid-gap: 8px;
    gap: 8px;
    border: 1px solid var(--color-Line);
    border-radius: 16px;
    padding: 16px;
    margin-top: 16px;
}

.beginner-deposit-tutorial-content:hover {
    border-color: var(--color-InputLine);
}

@media screen and (max-width: 767px) {
    .beginner-deposit-tutorial-content {
        grid-gap: 12px;
        gap: 12px;
        border-radius: 12px;
    }
}

.beginner-deposit-tutorial {
    margin-top: 24px;
    display: flex;
    flex-direction: column;
    flex: 1 1;
    justify-content: flex-end;
}

@media screen and (max-width: 767px) {
    .beginner-deposit-tutorial.start {
        justify-content: flex-start;
    }
}
.deposit-drawer-video-modal {
    z-index: 10000 !important;
}

.deposit-drawer-drawer.bn-drawer>.bn-drawer-wrap.data-dir-right {
    border-radius: 0;
}

.deposit-drawer-wrap {
    position: absolute;
    height: 100%;
    overflow: hidden;
    width: 100%;
    color: var(--color-PrimaryText);
}

.deposit-drawer-content {
    position: relative;
    width: 100%;
    overflow: hidden;
    height: 100%;
}

.deposit-drawer-content.videotype {
    transform: translate3d(-50%, 0px, 0px);
}

.deposit-drawer-fundItem-wrap {
    position: relative;
    border-radius: 16px;
    border: 1px solid var(--color-Line);
    transition: border-color 150ms ease;
    padding: 16px;
    cursor: pointer;
}

.deposit-drawer-fundItem-wrap:hover {
    border-color: var(--color-InputLine);
}

@media screen and (max-width: 767px) {
    .deposit-drawer-fundItem-wrap {
        border-radius: 12px;
    }
}

.deposit-drawer-fundItem-wrap-padding-more {
    padding-top: 24px;
    padding-bottom: 24px;
}

.deposit-drawer-fundItem {
    display: flex;
    justify-content: space-between;
    align-items: center;
    grid-gap: 16px;
    gap: 16px;
}

.deposit-drawer-fundItem-activity-left {
    display: flex;
    align-items: center;
    position: absolute;
    top: 0;
    left: 0;
    background-color: rgba(240, 185, 11, 0.10);
    border-radius: 16px 0 8px 0;
    padding: 2px 8px;
    grid-gap: 2px;
    gap: 2px;
    color: var(--color-TextLink)
}

.deposit-drawer-fundItem-activity-right {
    display: flex;
    align-items: center;
    position: absolute;
    top: 0;
    right: 0;
    background-color: rgba(240, 185, 11, 0.10);
    border-radius: 0 16px 0 8px;
    padding: 2px 8px;
    grid-gap: 2px;
    gap: 2px;
    color: var(--color-TextLink)
}

.header-rightside .deposit-drawer-fundItem-activity-svg.bn-svg {
    width: 12px;
    height: 12px;
    flex-shrink: 0;
}

.deposit-drawer-scrollable {
    overflow-y: auto;
    /*flex: 1;*/
}

.deposit-drawer-fundItem_body {
    flex: 1 1;
}

.deposit-drawer-fundItem_recommonLabel {
    border-radius: 3px;
    background-color: var(--color-BadgeBg);
    padding: 0px 4px;
}

.deposit-drawer-icon {
    width: 20px;
    height: 20px;
    position: absolute;
    right: 0;
    top: var(--space-xl);
    color: var(--color-IconNormal);
    cursor: pointer;
}

.deposit-drawer-icon:hover {
    color: var(--color-PrimaryText);
}

@media screen and (max-width: 767px) {
    .deposit-drawer-icon {
        top: var(--space-m);
        color: var(--color-PrimaryText);
    }
}

.deposit-drawer-wrap .fiatPayment-svg.bn-svg {
    width: 16px;
    height: 16px;
}

.deposit-drawer-contentitem {
    padding: 0 24px 24px;
    height: 100%;
    display: flex;
    flex-direction: column;
    -ms-scroll-chaining: none;
        overscroll-behavior: contain;
}

.deposit-drawer-framewrap {
    width: 100%;
    height: 0;
    padding-bottom: 56.25%;
    position: relative;
    overflow: hidden;
}

.deposit-drawer-framewrap>iframe {
    position: absolute;
    width: 100%;
    height: 100%;
    top: 0;
    bottom: 0;
    left: 0;
    border: 0;
}

.deposit-drawer-framewrap_button {
    min-width: 180px;
    margin: 0 32px;
}

.deposit-drawer-playvideo {
    cursor: pointer;
}

.deposit-drawer-playvideo:hover {
    color: var(--color-PrimaryText);
}

.deposit-drawer-funditem_icon {
    width: 40px;
}

.deposit-drawer-otherway {
    display: flex;
    padding: 10px;
    -webkit-margin-end: 16px;
            margin-inline-end: 16px;
    align-items: center;
    cursor: pointer;
    border-radius: 4px;
}

.deposit-drawer-otherway:hover {
    background-color: var(--color-bg3);
}

.deposit-drawer-fqalink:hover {
    cursor: pointer;
    color: var(--color-BtnBg);
}

/* .deposit-drawer-drawer{
  width: 484px;
} */
.deposit-drawer-drawer.bn-drawer>.bn-drawer-wrap.data-dir-right {
    width: 424px;
    max-width: 424px;
}

.deposit-actionsheet.bn-drawer>.bn-drawer-wrap.data-dir-bottom {
    display: flex;
}

.deposit-drawer-header {
    position: relative;
}

.deposit-drawer-header .bn-actionSheet-content {
    padding: 0;
}

.deposit-drawer-header .bn-mask {
    background-color: rgba(0, 0, 0, 0.5) !important;
}

.deposit-drawer-primary-link {
    cursor: pointer;
    color: var(--color-TextLink);
    text-decoration: underline;
    font-size: 14px;
    font-weight: 400;
    line-height: 22px;
}

.deposit-drawer-primary-link:hover {
    color: var(--color-BtnBg);
}

.deposit-drawer-primary-link.small {
    font-size: 12px;
    line-height: 18px;
}

.icon-pointer-wrapper:hover .icon-t-primary-pointer,
.icon-t-primary-pointer:hover {
    color: var(--color-PrimaryText);
}

.deposit-drawer-close-svg {
    width: 20px !important;
    height: 20px !important;
    color: var(--color-IconNormal);
    cursor: pointer;
}

.deposit-drawer-close-svg:hover {
    color: var(--color-PrimaryText);
}

@media screen and (max-width: 767px) {
    .deposit-drawer-fundItem {
        border-radius: 12px;
        grid-gap: 12px;
        gap: 12px;
    }

    .deposit-drawer-contentitem {
        padding: 0 var(--space-m) var(--space-xl);
    }

    .deposit-drawer-framewrap>iframe {
        border-radius: 4px;
    }

    .deposit-drawer-framewrap_button {
        width: 100%;
    }

    .deposit-drawer-funditem_icon {
        width: 40px;
        height: 40px;
    }

    .deposit-drawer-drawer.bn-drawer>.bn-drawer-wrap.data-dir-right {
        width: 100%;
        max-width: 100%;
    }

    .deposit-drawer-primary-link {
        text-decoration: none;
        font-weight: 500;
        text-decoration: unset;
    }

    .deposit-drawer-primary-link.small {
        font-weight: 500;
    }

    .deposit-drawer-close-svg {
        color: var(--color-PrimaryText);
    }
}

.ml-2xs {
    margin-left: var(--space-2xs);
}

.text-center {
    text-align: center;
}

.rounded-xl {
    border-radius: var(--radii-xl);
}

.rounded-m {
    border-radius: var(--radii-m);
}

.rounded-l {
    border-radius: var(--radii-l);
}

.border {
    border-width: 1px;
}

.border-solid {
    border-style: solid;
}

.border-Line {
    border-color: var(--color-Line);
}

.hover-border-PrimaryYellow:hover {
    border-color: var(--color-PrimaryYellow);
}

.border-PrimaryYellow {
    border-color: var(--color-PrimaryYellow);
}

.items-center {
    align-items: center;
}

.justify-center {
    justify-content: center;
}

.py-xl {
    padding-top: var(--space-xl);
    padding-bottom: var(--space-xl);
}

.p-xl {
    padding: var(--space-xl);
}

.pt-l {
    padding-top: var(--space-l);
}

.h-m {
    height: var(--space-m);
}

.w-m {
    width: var(--space-m);
}

.px-s {
    padding-left: var(--space-s);
    padding-right: var(--space-s);
}

.py-4xs {
    padding-top: var(--space-4xs);
    padding-bottom: var(--space-4xs);
}

.flex-shrink-0 {
    flex-shrink: 0;
}

.cursor-pointer {
    cursor: pointer;
}

.text-t-Tertiary {
    color: var(--color-TertiaryText);
}

.text-t-Primary {
    color: var(--color-PrimaryText);
}

.text-IconNormal {
    color: var(--color-IconNormal);
}

.flex-1 {
    flex: 1 1;
}

.justify-between {
    justify-content: space-between;
}

.justify-end {
    justify-content: flex-end;
}

.noH5\:hidden {
    display: none;
}

.text-TextLink {
    color: var(--color-TextLink);
}

@media screen and (max-width: 768px) {
    .mobile\:Subtitle1 {
        font-size: 16px;
        font-weight: 500;
        line-height: 24px;
    }

    .mobile\:text-t-Secondary {
        color: var(--color-SecondaryText);
    }

    .mobile\:py-m {
        padding-top: var(--space-m);
        padding-bottom: var(--space-m);
    }

    .mobile\:pt-m {
        padding-top: var(--space-m);
    }
}
.twitter-connect-panel {
  display: flex;
  flex-direction: column;
  grid-gap: 8px;
  gap: 8px;
  color: var(--color-SecondaryText);
  align-items: flex-start;
  max-height: calc(100vh - 300px);
  overflow: auto;
  margin-bottom: 24px;
}

.twitter-connect-panel_list {
  grid-gap: 8px;
  gap: 8px;
  width: 100%;
  list-style: inside;
}

.twitter-connect-panel_list li {
  list-style: inside;
}

.twitter-connect-panel_tip {
  font-size: 14px;
  color: var(--color-PrimaryText);
}

.twitter-bind-img {
  width: 160px;
}

.twitter-unbind-img {
  width: 96px;
  margin-bottom: 16px;
}

.twitter-unbind-text {
  text-align: center;
}

.twitter-unbind-title,
.twitter-unbind-user-link {
  margin-bottom: 8px;
}

.twitter-unbind-desc {
  margin-bottom: 24px;
}

.bn-modal.twitter-bind-model .bn-modal-wrap {
  width: 384px;
  max-width: 100%;
  padding: var(--space-m);
}

.bn-modal.twitter-bind-model.disconnect-twitter-panel .bn-modal-wrap {
  padding: var(--space-xl);
}

.bn-modal.twitter-bind-model.connect-twitter-panel .bn-modal-wrap {
  width: 520px;
  padding: 0 24px 24px 24px;
}

.connect-twitter-panel .bn-drawer-wrap {
  padding-top: 0 !important;
}

.bn-modal.twitter-bind-model .bn-modal-content {
  padding: 8px 0 0 0;
  max-height: none;
}

.twitter-bind-model .bn-drawer-wrap,
.twitter-bind-result .bn-drawer-wrap {
  padding: var(--space-m);
}

.twitter-bind-result.twitter-unbound-success-dialog .bn-modal-confirm-title {
  margin-bottom: 0;
}

.twitter-bind-success .bn-modal-confirm-icon {
  height: 96px;
  margin-bottom: 16px !important;
}

.bn-modal.twitter-bind-result .bn-modal-content {
  padding: 0;
}

.twitter-model-header {
  height: 64px;
  display: flex;
  align-items: center;
  justify-content: space-between;
  font-size: 18px;
}

.twitter-model-header .twitter-modal-close {
  width: 24px;
  height: 24px;
}

.twitter-model-header.notitle {
  position: absolute;
  right: 24px;
}

/* .nobg-root{
  z-index: 1000;
} */
.nobg-root .bn-modal-content {
  max-height: none;
}

.twitter-connect-panel_network-reminder {
  z-index: 1299;
}

.twitter-connect-panel_network-reminder .bn-modal-confirm-icon {
  width: 80px !important;
  height: 80px !important;
}

/* mobile */
@media screen and (max-width: 768px) {
  .twitter-model-header {
    height: 50px;
    margin-bottom: 8px;
  }

  .twitter-bind-img {
    width: 96px;
  }

  .twitter-bind-success .bn-modal-confirm-icon {
    margin-bottom: 24px !important;
  }

  .twitter-model-header .twitter-modal-close {
    width: 20px;
    height: 20px;
  }

  .twitter-bind-success .bn-modal-confirm {
    padding: 0;
  }
}

/* desktop */
@media screen and (min-width: 768px) {
  .twitter-bind-model .bn-button {
    height: 48px;
  }
}
.explore-history-item {
  list-style: none;
  display: inline-block;
  background-color: var(--color-Input);
  border-radius: 6px;
  padding: 0 10px;
  margin-right: 10px;
  margin-bottom: 8px;
  line-height: 28px !important;
  max-width: calc(50% - 10px);
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  height: 28px;
  vertical-align: middle;
  text-align: center;
}

.explore-history-item__link,
.explore-history-item__text {
  color: var(--color-PrimaryText);
  text-decoration: none;
  border-radius: 4px;
  text-align: center;
}

/* Block */
.explore-history-list {
  margin-bottom: 16px;
  padding: 0 16px;
}

/* Element: Title Bar */
.explore-history-list__title-bar {
  display: flex;
  justify-content: space-between;
  align-items: center;
  margin-bottom: 8px;
}

/* Element: Title */
.explore-history-list__title {
  font-size: 14px;
  color: var(--color-PrimaryText);
}

/* Element: Delete Icon */
.explore-history-list__delete-icon {
  width: 20px !important;
  height: 20px !important;
  cursor: pointer;
  color: var(--color-IconNormal);
}

/* Element: Items */

/* Element: Items
.explore-history-list__items {
  display: flex;
  flex-wrap: wrap;
  padding: 8px;
} */
.explore-section-swiper-dots {
  grid-gap: 8px;
  gap: 8px;
}

.explore-section-swiper-dots--arrow {
  color: var(--color-DisableText);
  width: 20px;
  height: 20px;
  background-color: transparent;
  border-radius: 6px;
  align-items: center;
  justify-content: center;
}

.explore-section-swiper-dots--arrow:hover {
  color: var(--color-PrimaryText);
  background-color: var(--color-Line);
}

.explore-section-swiper-dots--arrow:hover .explore-section-swiper-dots--arrow__disallow {
  cursor: not-allowed;
  color: var(--color-DisableText);
}
.explore-section-swiper-progress-pager--dot {
  width: 8px;
  height: 3px;
  background-color: var(--color-Line);
  margin-right: 4px;
  cursor: pointer;
}

.explore-section-swiper-progress-pager--dot__active {
  background-color: var(--color-PrimaryText);
}
.section-swiper {
  flex-direction: column;
}

.section-swiper .section-swiper-title-container {
  align-items: center;
  justify-content: space-between;
  width: 100%;
  margin-bottom: 8px;
}

.section-swiper-title-container--title {
  font-size: 14px;
  color: var(--color-PrimaryText);
}

.hot-compaign-countdown--item {
  grid-gap: 4px;
  gap: 4px;
  margin-right: 20px;
  align-items: center;
}
.hot-compaign-countdown--unit {
  font-size: 12px;
  font-weight: 400;
  color: var(--color-PrimaryText);
}

.explore-hot-camp {
  padding: 12px;
  border-radius: 12px;
  border: 1px solid var(--color-Line);
  align-items: center;
  justify-content: space-between;
  margin-bottom: 24px;
  cursor: pointer;
}

.explore-hot-camp-item-info {
  flex-direction: column;
  font-size: 16px;
  font-weight: 600;
  line-height: 24px;
  color: var(--color-PrimaryText);
}

.explore-hot-camp-item-info--base {
  margin-bottom: 8px;
}

.explore-hot-camp-item-info--title {
  margin-right: 16px;
}

.explore-hot-camp-item-info--asset {
  margin-left: 8px;
  margin-right: 8px;
}

.explore-hot-camp-item-state {
  padding: 0 6px;
  border-radius: 4px;
  font-size: 12px;
  line-height: 18px;
  align-items: center;
}

.explore-hot-camp-item-state--buy {
  color: var(--color-TextBuy);
  background-color: var(--color-DepthBuyBg);
}
.explore-hot-campaign {
  padding: 0 16px;
}

.explore-hot-trading--item {
  align-items: center;
  cursor: pointer;
  font-size: 14px;
  font-weight: 500;
  justify-content: space-between;
  height: 48px;
  padding: 0 16px;
}

.explore-hot-trading--item:hover {
  background-color: var(--color-Input);
}

.explore-hot-trading--item-left-container {
  align-items: center;
}

.explore-hot-trading--item-index {
  color: var(--color-DisabledText);
  font-size: 14px;
  font-weight: 500;
  line-height: 18px;
  margin-right: 8px;
}

.explore-hot-trading--trading-pair {
  align-items: center;
}

.explore-hot-trading--item-base-asset {
  font-size: 16px;
  font-weight: 500;
  line-height: 24px;
  margin-right: 2px;
}

.explore-hot-trading--item-quote-asset {
  font-size: 12px;
  line-height: 18px;
  font-weight: 400;
  color: var(--color-SecondaryText);
}

.explore-hot-trading--item-asset-icon {
  width: 24px;
  height: 24px;
  margin-left: 4px;
  margin-right: 8px;
  border-radius: 50%;
}

.explore-hot-trading--item-price {
  font-size: 14px;
  font-weight: 500;
  line-height: 22px;
  color: var(--color-PrimaryText);
}

.explore-hot-trading--item-difference {
  font-size: 12px;
  font-weight: 500;
  line-height: 18px;
}

.explore-hot-trading--item-right-container {
  flex-direction: column;
  align-items: flex-end;
}

.explore-hot-trading {
  margin-bottom: 24px;
}

.explore-hot-trading-cols {
  display: flex;
  flex-direction: column;
  grid-gap: 8px;
  gap: 8px;
}

/* EarnItem.css */

/* Block */
.explore-earn-list-item {
  border: 1px solid var(--color-Line);
  border-radius: 12px;
  padding: 8px 12px;
  cursor: pointer;
}

/* Element: Content Wrapper */
.explore-earn-list-item__content {
  display: flex;
  flex-direction: column;
}

/* Element: Asset Wrapper */
.explore-earn-list-item__asset {
  margin-bottom: 8px;
  flex-direction: column;
}

.explore-earn-list-item__asset-icon {
  width: 24px;
  height: 24px;
  margin-bottom: 4px;
  border-radius: 50%;
  -o-object-fit: cover;
     object-fit: cover;
}

/* Element: Asset Name */
.explore-earn-list-item__asset-name {
  color: var(--color-PrimaryText);
}

/* Element: APR Wrapper */
.explore-earn-list-item__apr {
  display: flex;
  flex-wrap: wrap;
  flex-direction: column;
  align-items: start;
}

/* Element: APR Label */
.explore-earn-list-item__apr-label {
  margin-right: 4px;
  color: var(--color-TertiaryText);
  font-size: 12px;
  font-weight: 400;
  line-height: 18px;
}

/* Element: APR Value */
.explore-earn-list-item__apr-value {
  font-size: 14px;
  font-weight: 500;
  line-height: 22px;
}
.explore-earn-list {
  padding: 0 16px;
}

.explore-earn-list-cols {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  grid-gap: 8px;
  gap: 8px;
}

.explore-deposite-recomd {
  padding: 16px 16px 0px 16px;
  grid-gap: 8px;
  gap: 8px;
  margin-bottom: 24px;
}

.explore-deposite-recomd__item {
  max-width: 50%;
  display: flex;
  border-radius: 12px;
  border: 1px solid var(--color-Line);
  padding: 16px 14px;
  justify-content: start;
  align-items: start;
  height: auto;
  flex: 1 1;
  cursor: pointer;
  box-sizing: border-box;
}

.explore-deposite-recomd__item--single {
  max-width: 100%;
  height: auto;
}

.explore-deposite-recomd__item--single .explore-deposite-recomd__content {
  display: flex;
  justify-content: center;
  align-items: center;
  flex-direction: row;
}

.explore-deposite-recomd__item--single .explore-deposite-recomd__icon {
  margin-bottom: 0;
  margin-right: 10px;
}

.explore-deposite-recomd__icon {
  margin-bottom: 8px;
  width: 20px;
  height: 20px;
}

.explore-deposite-recomd__title {
  color: var(--color-PrimaryText);
  font-size: 14px;
  line-height: 22px;
  font-weight: 400;
}
.common-widget-image-with-chain-icon-wrap {
  position: relative;
  width: 24px;
  height: 24px;
}

.common-widget-image-with-chain-icon-wrap > img {
  width: 100%;
  height: 100%;
}

.common-widget-image-with-chain-icon-wrap .chain-icon-wrap {
  position: absolute;
  bottom: -1px;
  right: -1px;
  display: flex;
  width: 12px;
  height: 12px;
  border-radius: 3px;
  background-color: var(--color-BasicBg);
  padding: 1px;
}

.common-widget-image-with-chain-icon-wrap .chain-icon {
  width: 10px;
  height: 10px;
  border-radius: 2px;
}

.explore-suggest-result-panel {
  flex-direction: column;
  padding: 0px 15px;
  align-items: flex-start;
  align-self: stretch;
  height: 600px;
  overflow-y: auto;
  overflow-x: hidden;
  --scroll-size: 8px !important;
  -ms-scroll-chaining: none;
      overscroll-behavior: contain;
}

.explore-suggest-result-panel__item {
  cursor: pointer;
  display: flex;
  align-items: center;
  margin: 8px;
  padding: 9px 0;
  border-radius: 4px;
}

.explore-suggest-result-panel__icon {
  margin-right: 8px;
}

.explore-suggest-result-panel__custom-icon {
  width: 20px;
  height: 20px;
  margin-right: 8px;
}

.explore-suggest-result-panel__text {
  font-size: 16px;
  color: var(--color-PrimaryText);
  margin-right: 4px;
}

.explore-suggest-result-panel__text_sub {
  color: var(--color-SecondaryText);
  font-size: 12px;
}

.explore-content {
  width: 368px;
}

.data-size-full .explore-content {
  width: 100%;
}

.initdata {
  padding: 16px 0;
  color: var(--color-PrimaryText);
  box-sizing: border-box;
}

.initdata-content {
  max-height: 566px;
  --scroll-size: 0 !important;
  overflow-y: auto;
  overflow-x: hidden;
  -ms-scroll-chaining: none;
      overscroll-behavior: contain;
}

@media screen and (max-width: 768px) {
  .initdata-content {
    height: unset;
    max-height: unset;
  }
}

.initdata-text {
  padding: 4px 8px;
  color: var(--color-PrimaryText);
  background: var(--color-bg3);
  border-radius: 2px;
  cursor: pointer;
  -webkit-margin-end: 8px;
          margin-inline-end: 8px;
  margin-bottom: 24px;
  font-weight: 500;
  max-width: 200px;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}

.initdata-text+.initdata-text {
  -webkit-margin-start: 8px;
          margin-inline-start: 8px;
}

.initdata-text:hover {
  background: var(--color-Line);
}

.initdata-link {
  padding: 12px 16px;
  background: var(--color-invBg);
  cursor: pointer;
  border-radius: 4px;
}

.initdata-link p {
  max-width: calc(100% - 48px);
}

.text-overflow {
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.initdata-delete-icon {
  font-size: 16px;
  color: var(--color-IconNormal);
  cursor: pointer;
}

.initdata-delete-icon:hover {
  color: var(--color-PrimaryText);
}

.flex-center-between {
  display: flex;
  justify-content: space-between;
  align-items: center;
}

.history-img {
  width: 20px;
  height: 20px;
  -webkit-margin-end: 8px;
          margin-inline-end: 8px;
}

.hot-function-group {
  display: flex;
  flex-wrap: wrap;
  grid-gap: 16px;
  gap: 16px;
}

.hot-function-item {
  width: calc(50% - 8px);
}

.hot-function-item .initdata-link {
  display: flex;
  padding: 12px 16px;
  border: 1px solid var(--color-bg3);
  border-radius: 10px;
  color: var(--color-PrimaryText);
  align-items: center;
}

.hot-function-item .initdata-link:hover {
  border: 1px solid var(--color-BtnBg);
}

.nodata-wrap {
  padding: 80px;
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: center;
  width: 100%;
}

.explore-component .nodata-wrap .bn-svg {
  font-size: 96px;
  width: 96px;
  height: 96px;
  cursor: unset;
}

.common-item {
  display: flex;
  align-items: center;
  color: var(--color-PrimaryText);
  padding: 12px 16px;
  cursor: pointer;
}

.common-item.align-top {
  align-items: flex-start;
}

.explore-common-item {
  display: flex;
  align-items: center;
  color: var(--color-PrimaryText);
  padding: 12px 16px;
  cursor: pointer;
}

.explore-common-item-icon-wrap {
  display: flex;
  align-items: center;
  justify-items: center;
  border-radius: 10px;
  padding: 8px;
  background-color: var(--color-Line);
  margin-right: 8px;
}

.explore-earn-item,
.explore-options-item {
  display: flex;
  align-items: center;
  justify-content: space-between;
  color: var(--color-PrimaryText);
  padding: 12px 16px;
  cursor: pointer;
}

.explore-futures-item,
.explore-alpha-item,
.explore-spot-item {
  display: flex;
  justify-content: space-between;
  color: var(--color-PrimaryText);
  padding: 12px 16px;
  cursor: pointer;
}

.common-item:hover,
.explore-earn-item:hover,
.explore-alpha-item:hover,
.explore-common-item:hover,
.explore-futures-item:hover,
.explore-options-item:hover,
.explore-spot-item:hover {
  background: var(--color-SecondaryBg);
}

.explore-spot-item-img {
  height: 24px;
  width: 24px;
  -webkit-margin-end: 8px;
          margin-inline-end: 8px;
}

.common-item-img {
  width: 20px;
  height: 20px;
  max-width: unset;
}

.common-item-img_feed {
  width: 36px;
  height: 36px;
  -webkit-margin-end: 14px;
          margin-inline-end: 14px;
  border-radius: 12px;
}

.explore-common-item .typography-Subtitle2 {
  flex: 1 1;
}

.font-weight-400 {
  font-weight: 400;
}

.font-weight-500 {
  font-weight: 500;
}

.theme-root .search-result-tabs {
  width: 368px;
  padding: 8px 16px 0px 16px;
  font-weight: 500;
  overflow: auto;
  --scroll-pad: 0 !important;
  --scroll-size: 0 !important;
  border-bottom: 1px solid var(--color-Line);
}

.search-result-tabs .bn-tab-list {
  --scroll-pad: 0 !important;
  --scroll-size: 0 !important;
}

.search-result-tab {
  padding: 0 8px;
  -webkit-margin-end: 16px;
          margin-inline-end: 16px;
  color: var(--color-TertiaryText);
  font-size: 14px;
}

.search-result-tab.active {
  color: var(--color-PrimaryText);
  font-weight: 500;
}

.search-result-content {
  width: 368px;
  max-width: 100%;
  max-height: 483px;
  overflow: auto;
  padding-bottom: 12px;
  scroll-behavior: smooth;
  overflow-x: hidden;
  -ms-scroll-chaining: none;
      overscroll-behavior: contain;
}

.explore-dropdown.bn-tooltips-wrap {
  width: 100%;
}

.explore-dropdown .bn-textField {
  width: 100%;
}

.search-result-content-allitem {
  display: flex;
  align-items: center;
  padding: 0 16px;
  margin-top: 16px;
  margin-bottom: 4px;
  justify-content: space-between;
}

.search-result-content-allitem-icon {
  cursor: pointer;
  color: var(--color-IconNormal);
}

.search-result-content-allitem-icon:hover {
  color: var(--color-PrimaryText);
}

.have-subcategory {
  padding: 0 16px;
  margin-bottom: 4px;
  margin-top: 24px;
}

.search-group {
  display: flex;
  align-items: center;
  padding: 16px 16px 8px 16px;
  justify-content: space-between;
  width: 368px;
  color: var(--color-PrimaryText);
}

.search-group .bn-textField-input {
  font-size: 14px;
}

.search-group .bn-textField-suffix .bn-svg {
  width: 16px;
  height: 16px;
  font-size: 16px;
}

.search-group .hover-pointer {
  -webkit-margin-start: 8px;
          margin-inline-start: 8px;
  white-space: nowrap;
}

.search-group_textfield.bn-textField .bn-textField-input {
  font-size: 14px;
  font-weight: 400;
}

.search-group_suffix_icon_wrap {
  box-sizing: border-box;
  display: flex;
  padding: 6px;
  border-radius: 50%;
  background-color: var(--color-BtnBg);
  align-items: center;
  justify-content: center;
}

.search-group_suffix_icon_wrap .search-icon {
  color: var(--color-TextOnYellow) !important;
}

.explore-dropdown .bn-bubble {
  width: 100%;
}

.explore-dropdown .bn-bubble-content {
  width: 100%;
}

.explore-dropdown .search-result-content {
  width: 100%;
}

.bn-drawer-wrap .search-group,
.bn-drawer-wrap .search-result-content {
  width: 100%;
}

.bn-drawer-wrap .search-group .bn-textField {
  flex: 1 1;
}

.search-group .bn-textField {
  height: 40px;
}

.search-group .typography-Subtitle2 {
  -webkit-margin-start: 8px;
          margin-inline-start: 8px;
}

.bn-drawer-wrap .search-result-content {
  max-height: calc(100vh - 117px);
}

.explore-content .bn-tab__default {
  background-color: transparent;
  border-bottom: 2px solid transparent;
  border-top: 2px solid transparent;
}

.explore-content .search-result-tabs .bn-tab {
  font-size: 14px;
  font-weight: 500;
}

.common-item-img {
  border-radius: 50%;
}

.explore-alpha-item .explore-alpha-item-gap {
  -webkit-margin-start: 8px;
          margin-inline-start: 8px;
}

.explore-alpha-item .explore-alpha-item-split-line {
  display: inline-block;
  height: 16px;
  translate: 0 3px;
  border-left: 1px solid var(--color-line);
}

.explore-alpha-item .explore-alpha-item-subtitle {
  font-weight: 400;
  font-size: 12px;
  color: var(--color-DisabledText);
}
.combine-trade-dropdown .bn-bubble-content {
    border-radius: 12px;
}

.combine-trade-container {
    width: 360px;
    padding: 10px;
}

.bn-drawer .combine-trade-container {
    width: 100%;
    padding: 15px;
}

.combine-trade-close {
    position: absolute;
    top: 28px;
    right: 15px;
    font-size: 20px;
    display: none;
}

.bn-drawer .combine-trade-close {
    display: block;
}

.combine-trade-title {
    padding: 8px 0;
}

.combine-trade-wallet-item {
    display: grid;
    grid-template-columns: 20px auto;
    grid-gap: 10px;
    gap: 10px;
    height: 54px;
}

.bn-drawer .combine-trade-wallet-item {
    border: 1px solid var(--color-Line);
    border-radius: 12px;
    margin-top: 12px;
    height: 84px;
    padding: 20px 15px;
}


.combine-trade-tip {
    prefix: '*';
    border-top: 1px solid var(--color-Line);
    padding: 8px 0;
    white-space: break-spaces;
}

.bn-drawer .combine-trade-tip {
    border-top: 0;
    margin-top: 12px;
}

.combine-trade-tip::before {
    content: '*';
    -webkit-margin-end: 4px;
            margin-inline-end: 4px;
}
.transfer-wallet_content {
    display: flex;
    justify-content: space-between;
    padding: 16px 12px;
    border-radius: 10px;
    margin-bottom: 32px;
    width: 100%;
    border: 1px solid var(--color-InputLine);
    /* background-color: var(--color-Line); */
    cursor: pointer;
}

.transfer-warp .data-size-full .transfer-wallet_content {
    border-radius: 12px;
}

@media screen and (max-width: 768px) {

    .transfer-wallet_content {
        border: none;
        background-color: var(--color-Input);
    }
}

.transfer-wallet_content__select {
    width: 100%;
}

.transfer-wallet_content__select .bn-select-field.data-size-tiny .bn-select-field-arrow {
    font-size: 20px;
}

.transfer-wallet_convert-icon {
    flex: 0 0 20px;
    width: 20px;
    height: 20px;
    -webkit-margin-start: 12px;
            margin-inline-start: 12px;
    margin-top: 22px;
}

.transfer-wallet_convert-icon.isolate {
    margin-top: 54px;
}

.transfer-wallet_content__select_label {
    display: inline-block;
    color: var(--color-TertiaryText);
    width: 40px;
    -webkit-margin-end: 8px;
            margin-inline-end: 8px;
}

.transfer-warp .data-size-full .transfer-wallet_content__select_label {
    color: var(--color-SecondaryText);
}

.transfer-wallet_content__selectSpaceBetweenGroup {
    width: 100%;
    display: flex;
    justify-content: space-between;
    align-items: center;
}


@media only screen and (min-width: 768px) {
    .transfer-wallet_isolated__select .bn-select-overlay-options {
        max-height: 300px;
    }

}

.transfer-wallet_content__selectSpaceBetweenGroup.icon-padding {
    width: calc(100% - 24px);
    height: 24px;
    line-height: 24px;
}

.transfer-wallet_content__selectInactiveBrand {
    height: 24px;
    line-height: 24px !important;
    border-radius: 4px;
    padding: 0 6px;
    color: var(--color-PrimaryText);
    background-color: var(--color-Input);
}

.bn-drawer-wrap .transfer-wallet_content__selectInactiveBrand {
    height: 20px;
    line-height: 20px !important;
}

.transfer-wallet_choice__optionDropdown .bn-select-overlay {
    padding: 16px 0 0;
}

.transfer-wallet_choice__optionDropdown .bn-select-overlay-search {
    padding: 0 16px 10px;
}

.transfer-wallet_choice__optionDropdown .bn-select-option {
    padding: 8px 16px;
}

.transfer-wallet_choice__optionDropdown .bn-select-option.icon svg {
    font-size: 20px;
}

@media only screen and (min-width: 768px) {
    .transfer-wallet_choice__optionDropdown .bn-select-overlay-options {
        max-height: 290px;
    }
}
.bn-drawer .bn-modal-content.transfer-content {
    padding-top: 16px;
}

.bn-modal-content.transfer-content {
    padding-top: 8px;
    padding-bottom: 0px;
}

@media screen and (max-width: 768px) {

    .bn-drawer .transfer-header.bn-modal-header {
        padding: 9px 16px;
    }
}

.transfer-header .bn-modal-header-next,
.transfer-header .bn-modal-header-prev {
    color: var(--color-PrimaryText);
}

.transfer-header .bn-modal-header-next:hover,
.transfer-header .bn-modal-header-prev:hover {
    color: var(--color-SecondaryText);
}

.transfer-content.bn-modal-content {
    max-height: 584px;
}

.transfer-warp .data-size-full .transfer-content.bn-modal-content {
    max-height: calc(100vh - 104px);
}

.transfer-warning-tips::before {
    content: "*";
    -webkit-margin-end: 4px;
            margin-inline-end: 4px;
}

.transfer-warp .data-size-full .transfer-warning-tips {
    margin-bottom: 20px;
}

.transfer-warning-tips {
    display: flex;
    align-self: end;
    margin-bottom: 24px;
}

.transfer-warning-tips.color-error {
    margin-bottom: 10px;
}

.bn-modal-confirm {
    padding: var(--space-xl) 0 0;
}

.transfer-warp .data-size-full .bn-modal-footer {
    padding: 0 15px 24px;
    grid-gap: 0;
    gap: 0;
}

.transfer-warp .bn-modal-footer {
    padding: 0 24px 24px;
}
.transfer-coin_choice {
    display: flex;
    align-items: center;
}

.transfer-coin_choice__option {
    display: flex;
    justify-content: space-between;
}

.transfer-coin_choice__option_head {
    display: flex;
}

.transfer-coin_single-formItem {
    height: 106px;
}

.transfer-coin_isolated__group.two {
    height: 134px;
}

.transfer-coin_isolated__group.one {
    height: 114px;
}

.transfer-coin_isolated__item {
    display: flex;
    flex: 1 1;
    height: 74px;
    padding: 12px;
    border-radius: 10px;
    cursor: pointer;
    border: 1px solid var(--color-InputLine);
    max-width: calc(50% - 8px);
}

.transfer-overflow-text {
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
    width: 90px;
}

.transfer-warp .data-size-full .transfer-overflow-text {
    width: calc(50vw - 180px);
}

.transfer-warp .data-size-full .transfer-coin_isolated__item {
    border-radius: 12px;
    height: 66px;
}

.transfer-coin_isolated__item.single {
    height: 48px;
}

.transfer-coin_isolated__item+.transfer-coin_isolated__item {
    -webkit-margin-start: 16px;
            margin-inline-start: 16px;
}

.transfer-coin_isolated__item:hover,
.transfer-coin_isolated__item.active {
    border: 1.5px solid var(--color-PrimaryText);
}

.transfer-coin_choice__icon {
    width: 20px;
    height: 20px;
    border-radius: 50%;
}

.transfer-coin_choice__optionDropdown {
    background-color: transparent !important;
}

.transfer-coin_choice__optionDropdown .bn-select-overlay-search {
    padding: 0 16px 16px;
}

.transfer-coin_choice__optionDropdown .bn-select-overlay {
    padding: 16px 0 0;
}

.transfer-coin_choice__optionDropdown .bn-select-option {
    padding: 12px 16px;
}

@media only screen and (min-width: 768px) {
    .transfer-coin_choice__optionDropdown .bn-select-overlay-options {
        max-height: 290px;
    }
}
.transfer-amount-input {
    width: 100% !important;
}

.transfer-fundcollection:hover {
    color: var(--color-BtnBg);
}

.transfer-amount-input-formitem {
    height: 212px;
}

.transfer-fund_info-icon {
    font-size: 16px;
    margin-left: 4px;
}

.transfer-allocate-tips {
    background: var(--color-PrimaryText);
    color: var(--color-SecondaryBg);
    border-radius: 8px;
    opacity: 0.95;
}

.transfer-tips_success {
    color: var(--color-Buy);
}

.transfer-tips_error {
    color: var(--color-Sell);
}

.bn-modal-confirm-actions {
    margin-top: 0px;
}
.transfer-earn-agreement_tips {
    display: flex;
    border-radius: 12px;
    padding: 12px;
    background-color: var(--color-Input);
    grid-gap: 4px;
    gap: 4px;
}

.transfer-earn-agreement_tips-icon {
    width: 20px;
    height: 20px;
    font-size: 20px;
    color: var(--color-PrimaryText);
    flex: 0 0 20px;
}
.common-widget-css_wrap .mt-16 {
  margin-top: 16px;
}

.common-widget-css_wrap .mt-14 {
  margin-top: 14px;
}

.common-widget-css_wrap .mr-8 {
  -webkit-margin-end: 8px;
          margin-inline-end: 8px;
}

.common-widget-css_wrap .mr-4 {
  -webkit-margin-end: 4px;
          margin-inline-end: 4px;
}

.common-widget-css_wrap .mt-40 {
  margin-top: 40px;
}

.common-widget-css_wrap .mt-48 {
  margin-top: 48px;
}

/* css gap */
.common-widget-css_wrap .gap-4 {
  grid-gap: 16px;
  gap: 16px;
}

.common-widget-css_wrap .gap-6 {
  grid-gap: 24px;
  gap: 24px;
}

.common-widget-css_wrap .block {
  display: block;
}

.common-widget-css_wrap .width-100 {
  width: 100%;
}

.common-widget-css_wrap .maxw-300 {
  max-width: 300px;
}

.common-widget-css_wrap .flex-col {
  flex-direction: column;
}

.common-widget-css_wrap .text-body2 {
  font-size: 16px;
  font-weight: 400;
  line-height: 24px;
  font-weight: 400;
  color: var(--color-SecondaryText);
}

.common-widget-css_wrap .color-error {
  color: var(--color-Error);
}

.common-widget-css_wrap .color-secondary_t {
  color: var(--color-SecondaryText);
}

.common-widget-css_wrap .color-inputline {
  color: var(--color-InputLine);
}

.common-widget-css_wrap .color-t_third {
  color: var(--color-TertiaryText);
}

.common-widget-css_wrap .color-t_primary {
  color: var(--color-PrimaryText);
}

.common-widget-css_wrap .color-t_buy {
  color: var(--color-TextBuy);
}

.common-widget-css_wrap .color-t_yellow {
  color: var(--color-TextLink);
}

.common-widget-css_wrap .color-t_primaryYellow {
  color: var(--color-PrimaryYellow);
}

.common-widget-css_wrap .color-badgeBg {
  color: var(--color-BadgeBg);
}

.common-widget-css_wrap .color-t_sell {
  color: var(--color-TextSell);
}

.common-widget-css_wrap .color-t_secondary {
  color: var(--color-SecondaryText);
}

.common-widget-css_wrap .color-t_TertiaryText {
  color: var(--color-TertiaryText);
}

.common-widget-css_wrap .color-t_disabled {
  color: var(--color-DisableText);
}

.common-widget-css_wrap .color-IconNormal {
  color: var(--color-IconNormal);
}

.common-widget-css_wrap .color-textLink {
  color: var(--color-TextLink);
}

.common-widget-css_wrap .mt-4 {
  margin-top: 4px;
}

.common-widget-css_wrap .mb-4 {
  margin-bottom: 4px;
}

.common-widget-css_wrap .mt-12 {
  margin-top: 12px;
}

.common-widget-css_wrap .mt-16 {
  margin-top: 16px;
}

.common-widget-css_wrap .ml-8 {
  -webkit-margin-start: 8px;
          margin-inline-start: 8px;
}

.common-widget-css_wrap .mb-24 {
  margin-bottom: 24px;
}

.common-widget-css_wrap .mb-16 {
  margin-bottom: 16px;
}

.common-widget-css_wrap .mb-32 {
  margin-bottom: 32px;
}

.common-widget-css_wrap .mt-8 {
  margin-top: 8px;
}

.common-widget-css_wrap .mt-80 {
  margin-top: 80px;
}

.common-widget-css_wrap .flex {
  display: flex;
}

.common-widget-css_wrap .flex-1 {
  flex: 1 1;
}

.common-widget-css_wrap .direction-ltr {
  direction: ltr;
}

.common-widget-css_wrap .ml-4 {
  -webkit-margin-start: 4px;
          margin-inline-start: 4px;
}

.common-widget-css_wrap .ml-16 {
  -webkit-margin-start: 16px;
          margin-inline-start: 16px;
}

.common-widget-css_wrap .mt-24 {
  margin-top: 24px;
}

.common-widget-css_wrap .mb-12 {
  margin-bottom: 12px;
}

.common-widget-css_wrap .mb-16 {
  margin-bottom: 16px;
}

.common-widget-css_wrap .text-right {
  text-align: right;
}

.common-widget-css_wrap .flex-wrap {
  display: flex;
  flex-wrap: wrap;
}

.common-widget-css_wrap .align-center {
  display: flex;
  align-items: center;
}

.common-widget-css_wrap .flex-space-between-center {
  display: flex;
  justify-content: space-between;
  align-items: center;
}

.common-widget-css_wrap .flex-center {
  display: flex;
  justify-content: center;
}

.common-widget-css_wrap .flex-center-center {
  display: flex;
  justify-content: center;
  align-items: center;
}

.common-widget-css_wrap .bn-mask .bn-mask {
  background-color: rgba(0, 0, 0, 0);
}

.common-widget-css_wrap .data-dir-right {
  width: 375px;
}

.common-widget-css_wrap ul {
  list-style: none;
  -webkit-padding-start: 0;
          padding-inline-start: 0;
  -webkit-margin-before: 0;
          margin-block-start: 0;
  -webkit-margin-after: 0;
          margin-block-end: 0;
}

.common-widget-css_wrap .flex-column {
  display: flex;
  flex-direction: column;
}

.common-widget-css_wrap .flex-column_justcenter {
  display: flex;
  flex-direction: column;
  justify-content: center;
}

.common-widget-css_wrap .flex-column_center {
  display: flex;
  flex-direction: column;
  align-items: center;
}

.common-widget-css_wrap .gap-8 {
  grid-gap: 8px;
  gap: 8px;
}

.common-widget-css_wrap .dialog-split-line {
  background-color: var(--color-Line);
  height: 1px;
  width: 100%;
}

.common-widget-css_wrap .flex-wrap {
  flex-wrap: wrap;
}

.common-widget-css_wrap .inline-flex {
  display: inline-flex;
}

.common-widget-css_wrap .cursor-pointer {
  cursor: pointer;
}

.common-widget-css_wrap .dropdownAndDraw-dropdown .bn-bubble.shadow .bn-bubble-content {
  border-radius: 0px 0px 8px 8px;
  background: var(--color-CardBg);
  box-shadow: 0px 8px 8px 0px rgba(24, 26, 32, 0.08);
  margin-top: 0px !important;
}

.common-widget-css_wrap .twitter-icon-color {
  color: #1d9bf0;
}

.common-widget-css_wrap .underline {
  text-decoration: underline;
}

.common-widget-css_wrap .clear-decoration {
  text-decoration: none;
}

.common-widget-css_wrap .bn-trans.data-show.display-none {
  visibility: hidden;
}

.common-widget-css_wrap a,
.common-widget-css_wrap a:active,
.common-widget-css_wrap a:visited {
  text-decoration: none;
}
.theme-root.bn-mask {
    background-color: rgba(0, 0, 0, 0.3) !important;
}
.light {
  --color-sell: #e33b54;
  --color-textSell: #e33b54;
  --color-sellHover: #e33b54;
  --color-depthSellBg: #fef1f2;
  --color-buy: #2ebd85;
  --color-textBuy: #2ebd85;
  --color-buyHover: #2ebd85;
  --color-depthBuyBg: #e6fff1;
  --color-line: #eaecef;
  --color-outlineHover: #ffef87;
  --color-primary: #fcd535;
  --color-primaryHover: #f0b90b;
  --color-error: #e33b54;
  --color-errorBg: #fff0f0;
  --color-success: #2ebd85;
  --color-successBg: #e6fff1;
  --color-disable: #d8dce1;
  --color-iconNormal: #929aa5;
  --color-textWhite: #ffffff;
  --color-textGray: #eaecef;
  --color-textBlack: #202630;
  --color-textPrimary: #202630;
  --color-textSecondary: #848e9c;
  --color-textThird: #b7bdc6;
  --color-textDisabled: #b7bdc6;
  --color-textBrand: #d89f00;
  --color-textToast: #d89f00;
  --color-bg: #f5f5f5;
  --color-bg1: #ffffff;
  --color-bg2: #fafafa;
  --color-bg3: #f5f5f5;
  --color-bg4: #707a8a;
  --color-bg6: #ffffff;
  --color-bg7: #fafafa;
  --color-popupBg: #ffffff;
  --color-badgeBg: #fef6d8;
  --color-selectedBg: #1e2026;
  --color-gradientBrand: linear-gradient(180deg, #f8d12f 0%, #f0b90b 100%);
  --color-gradientPrimary: linear-gradient(295.27deg, #ffffff 0%, #e6e8ea 84.52%);
}
@media only screen and (min-width: 768px) {
  .light {
    --color-sell: #ff707e;
    --color-textSell: #e33b54;
    --color-sellHover: #ff99a0;
    --color-depthSellBg: #fef1f2;
    --color-buy: #0ecb81;
    --color-textBuy: #2ebd85;
    --color-buyHover: #32d993;
    --color-depthBuyBg: #e6fff1;
    --color-outlineHover: #ffef87;
    --color-primary: #fcd535;
    --color-primaryHover: #f0b90b;
    --color-error: #e33b54;
    --color-errorBg: #fef1f2;
    --color-successBg: #e6fff1;
    --color-disable: #eaecef;
    --color-textPrimary: #1e2329;
    --color-textSecondary: #474d57;
    --color-textThird: #707a8a;
    --color-textBrand: #c99400;
    --color-bg: #f5f5f5;
    --color-bg2: #fafafa;
    --color-bg3: #f5f5f5;
    --color-badgeBg: #fef6d8;
  }
}
.dark {
  --color-sell: #f6465d;
  --color-textSell: #f6465d;
  --color-sellHover: #f6465d;
  --color-depthSellBg: #35141d;
  --color-buy: #2ebd85;
  --color-textBuy: #2ebd85;
  --color-buyHover: #2ebd85;
  --color-depthBuyBg: #102821;
  --color-line: #333b47;
  --color-outlineHover: #ffef87;
  --color-primary: #fcd535;
  --color-primaryHover: #f0b90b;
  --color-error: #f6465d;
  --color-errorBg: #35141d;
  --color-success: #2ebd85;
  --color-successBg: #102821;
  --color-disable: #434c5a;
  --color-iconNormal: #707a8a;
  --color-textWhite: #ffffff;
  --color-textGray: #eaecef;
  --color-textBlack: #202630;
  --color-textPrimary: #eaecef;
  --color-textSecondary: #848e9c;
  --color-textThird: #4f5867;
  --color-textDisabled: #4f5867;
  --color-textBrand: #d89f00;
  --color-textToast: #d89f00;
  --color-bg: #181e25;
  --color-bg1: #202630;
  --color-bg2: #29313d;
  --color-bg3: #29313d;
  --color-bg4: #434c5a;
  --color-bg6: #202630;
  --color-bg7: #191a1f;
  --color-popupBg: #202630;
  --color-badgeBg: #2c1c00;
  --color-selectedBg: #1e2026;
  --color-gradientBrand: linear-gradient(180deg, #f8d12f 0%, #f0b90b 100%);
  --color-gradientPrimary: linear-gradient(295.27deg, #15141a 0%, #474d57 84.52%);
}
@media only screen and (min-width: 768px) {
  .dark {
    --color-sell: #ff707e;
    --color-textSell: #ff707e;
    --color-sellHover: #ff99a0;
    --color-depthSellBg: #35141d;
    --color-buy: #0ecb81;
    --color-textBuy: #2ebd85;
    --color-buyHover: #32d993;
    --color-depthBuyBg: #102821;
    --color-outlineHover: #6a4403;
    --color-primary: #fcd535;
    --color-primaryHover: #f0b90b;
    --color-error: #ff707e;
    --color-errorBg: #35141d;
    --color-successBg: #102821;
    --color-disable: #474d57;
    --color-textPrimary: #eaecef;
    --color-textSecondary: #b7bdc6;
    --color-textThird: #848e9c;
    --color-textBrand: #f0b90b;
    --color-bg: #181a20;
    --color-bg2: #0b0e11;
    --color-bg3: #2b3139;
    --color-badgeBg: #2d2a20;
  }
}

.light {
  --color-BasicBg: #ffffff;
  --color-SecondaryBg: #fafafa;
  --color-Input: #f5f5f5;
  --color-InputLine: #d8dce1;
  --color-CardBg: #ffffff;
  --color-TagBg: #eaecef;
  --color-Line: #eaecef;
  --color-DisableBtn: #d8dce1;
  --color-Grid: #eaecef;
  --color-DisabledText: #b7bdc6;
  --color-DisableText: #b7bdc6;
  --color-Placeholder: #b7bdc6;
  --color-TertiaryText: #b7bdc6;
  --color-SecondaryText: #848e9c;
  --color-PrimaryText: #202630;
  --color-RedGreenBgText: #ffffff;
  --color-EmphasizeText: #ff693d;
  --color-TradeBg: #f5f5f5;
  --color-TextOnGray: #eaecef;
  --color-TextOnYellow: #202630;
  --color-IconNormal: #929aa5;
  --color-ToastBg: #707a8a;
  --color-BtnBg: #fcd535;
  --color-PrimaryYellow: #f0b90b;
  --color-TextLink: #d89f00;
  --color-TextToast: #f0b90b;
  --color-DepthSellBg: #fef1f2;
  --color-SellHover: #f6465d;
  --color-Sell: #f6465d;
  --color-TextSell: #f6465d;
  --color-DepthBuyBg: #e6fff1;
  --color-BuyHover: #2ebd85;
  --color-Buy: #2ebd85;
  --color-TextBuy: #2ebd85;
  --color-Error: #f6465d;
  --color-SuccessBg: #e6fff1;
  --color-Success: #2ebd85;
  --color-Vessel: #fafafa;
  --color-LiteBg1: #ffffff;
  --color-LiteBg2: #fafafa;
  --color-TwoColorIcon: #434c5a;
  --color-ErrorBg: rgba(246, 70, 93, 0.1);
  --color-BadgeBg: rgba(240, 185, 11, 0.1);
}
@media only screen and (min-width: 768px) {
  .light {
    --color-BasicBg: #ffffff;
    --color-SecondaryBg: #fafafa;
    --color-Input: #f5f5f5;
    --color-InputLine: #d8dce1;
    --color-CardBg: #ffffff;
    --color-Vessel: #fafafa;
    --color-Line: #eaecef;
    --color-DisableBtn: #eaecef;
    --color-DisabledText: #b7bdc6;
    --color-TertiaryText: #707a8a;
    --color-SecondaryText: #474d57;
    --color-PrimaryText: #202630;
    --color-IconNormal: #929aa5;
    --color-LiteBg1: #ffffff;
    --color-LiteBg2: #fafafa;
    --color-BtnBg: #fcd535;
    --color-PrimaryYellow: #f0b90b;
    --color-TextLink: #c99400;
    --color-TextToast: #8d5f02;
    --color-DepthSellBg: #fef1f2;
    --color-SellHover: #ff99a0;
    --color-Sell: #ff707e;
    --color-TextSell: #e33b54;
    --color-DepthBuyBg: #e6fff1;
    --color-BuyHover: #32d993;
    --color-Buy: #2ebd85;
    --color-TextBuy: #2ebd85;
    --color-Error: #e33b54;
    --color-SuccessBg: #e6fff1;
  }
}
.dark {
  --color-BasicBg: #181e25;
  --color-SecondaryBg: #191a1f;
  --color-Input: #29313d;
  --color-InputLine: #434c5a;
  --color-CardBg: #202630;
  --color-TagBg: #434c5a;
  --color-Line: #333b47;
  --color-DisableBtn: #434c5a;
  --color-Grid: #333b47;
  --color-DisabledText: #707a8a;
  --color-DisableText: #707a8a;
  --color-Placeholder: #434c5a;
  --color-TertiaryText: #4f5867;
  --color-SecondaryText: #848e9c;
  --color-PrimaryText: #eaecef;
  --color-RedGreenBgText: #ffffff;
  --color-EmphasizeText: #ff693d;
  --color-TradeBg: #0b0e11;
  --color-TextOnGray: #eaecef;
  --color-TextOnYellow: #202630;
  --color-IconNormal: #707a8a;
  --color-ToastBg: #707a8a;
  --color-BtnBg: #fcd535;
  --color-PrimaryYellow: #f0b90b;
  --color-TextLink: #f0b90b;
  --color-TextToast: #f0b90b;
  --color-DepthSellBg: #35141d;
  --color-SellHover: #f6465d;
  --color-Sell: #f6465d;
  --color-TextSell: #f6465d;
  --color-DepthBuyBg: #102821;
  --color-BuyHover: #2ebd85;
  --color-Buy: #2ebd85;
  --color-TextBuy: #2ebd85;
  --color-Error: #f6465d;
  --color-SuccessBg: #102821;
  --color-Success: #2ebd85;
  --color-Vessel: #29313d;
  --color-LiteBg1: #ffffff;
  --color-LiteBg2: #fafafa;
  --color-TwoColorIcon: #caced3;
  --color-ErrorBg: rgba(246, 70, 93, 0.1);
  --color-BadgeBg: rgba(240, 185, 11, 0.1);
}
@media only screen and (min-width: 768px) {
  .dark {
    --color-BasicBg: #181a20;
    --color-SecondaryBg: #0b0e11;
    --color-Input: #2b3139;
    --color-InputLine: #474d57;
    --color-CardBg: #1e2329;
    --color-Vessel: #1e2329;
    --color-Line: #2b3139;
    --color-DisableBtn: #2b3139;
    --color-DisabledText: #5e6673;
    --color-TertiaryText: #848e9c;
    --color-SecondaryText: #b7bdc6;
    --color-PrimaryText: #eaecef;
    --color-IconNormal: #848e9c;
    --color-LiteBg1: #202630;
    --color-LiteBg2: #191a1f;
    --color-BtnBg: #fcd535;
    --color-PrimaryYellow: #f0b90b;
    --color-TextLink: #f0b90b;
    --color-TextToast: #a37200;
    --color-DepthSellBg: #35141d;
    --color-SellHover: #ff99a0;
    --color-Sell: #ff707e;
    --color-TextSell: #ff707e;
    --color-DepthBuyBg: #102821;
    --color-BuyHover: #32d993;
    --color-Buy: #2ebd85;
    --color-TextBuy: #2ebd85;
    --color-Error: #ff707e;
    --color-SuccessBg: #102821;
  }
}

.language-icon {
  font-size: 16px;
  height: 16px;
  width: 16px;
}
.common-widget-css_wrap .mt-16 {
  margin-top: 16px;
}

.common-widget-css_wrap .color-t_third {
  color: var(--color-TertiaryText);
}

.bn-drawer-wrap .header-lngCur-content {
  width: 100%;
  min-width: 375px;
}

.bn-drawer-wrap .header-lngCur-item {
  height: auto;
}

.bn-drawer-wrap .header-lngCur-item .footer-select-options-group-flat-options {
  height: calc(100vh - 204px);
  overflow: auto;
}

.header-lngCur-content {
  display: grid;
  padding: 24px;
  width: 400px;
  grid-template-columns: 3fr 2fr;
  grid-gap: 24px;
  gap: 24px;
}

.bn-drawer-wrap .header-lngCur-content {
  padding: 0 24px 24px 24px;
}

.header-lngCur-content.onlyone {
  grid-template-columns: 1fr;
}

.header-lngCur-content.onlyone.onlyoneLng {
  width: 180px;
}

.header-lngCur-content.onlyone.onlyoneFiat {
  width: 220px;
}

.header-lngCur-content .header-lngCur-item {
  height: 370px;
  /* overflow: auto; */
  --scroll-bg: transparent;
  --scroll-size: 5px;
  --scroll-color: var(--color-Line);
}

/* header-lngCur-item */
.header-lngCur-item .footer-select-options-group-flat-options {
  height: 300px;
  overflow: auto;
  --scroll-color: var(--color-Line);
}

.header-lngCur-item .bn-textField {
  width: 100%;
}

.header-nav-bar {
  display: flex;
  height: 64px;
  justify-content: flex-end;
  align-items: center;
  -webkit-padding-end: 24px;
          padding-inline-end: 24px;
  color: var(--color-PrimaryText);
}

.header-nav-bar .close-btn-size {
  font-size: 24px;
}
.footer-community .typography-Subtitle1 {
    font-weight: 600;
}

.footer-icon {
    font-size: 24px;
    width: 24px;
    height: 24px;
    color: var(--color-PrimaryText)
}

.footer-icon:hover {
    color: var(--color-SecondaryText);
}

.footer-icongroup {
    display: grid;
    grid-template-columns: repeat(4, 24px);
    grid-gap: 24px;
    margin-top: 24px;
    /* width: 168px; */
}

@media screen and (max-width: 1023px) {
    .footer-community{
        margin-top: 48px;
    }
    .footer-icongroup{
        grid-template-columns: repeat(auto-fill, 24px);
        margin-top: 18px;
    }
    
}
 
@media screen and (max-width: 767px) {
  .footer-currency-img {
    height: 20px;
    -webkit-margin-end: 8px;
            margin-inline-end: 8px;
  }
}

.footer-copyright {
  max-width: 1200px;
  margin: 64px auto 0;
}

.footer-copyright .typography-Btn_link3 {
  color: var(--color-TextLink);
}

.footer-copyright .footer-copyright-legal .typography-Btn_link3 {
  font-size: 12px;
}

/* .footer-copyright .typography-Body3 {
  font-weight: 300;
} */
.footer-copyright-line {
  width: 100%;
  height: 1px;
  background-color: var(--color-Line);
}

.footer-copyright-text {
  margin-top: 16px;
  color: var(--color-SecondaryText);
}

.text-center {
  text-align: center;
}

.footer-copyright-enterprise .opreation {
  cursor: pointer;
}

.no-wrap {
  white-space: nowrap;
}

.footer-copyright-cookieprefrence {
  cursor: pointer;
  -webkit-margin-start: 24px;
          margin-inline-start: 24px;
  white-space: nowrap;
}

.footer-copyright-cookieprefrence:hover {
  color: var(--color-TextLink);
}
@media screen and (max-width: 1023px) {
    .footer-copyright{
        margin-top: 48px;
    }
    
}

@media screen and (max-width: 767px) {
    .footer-copyright .typography-Body3 {
        font-size: 12px;
        line-height: 16px;
    }
    .footer-copyright-cookieprefrence{
        display: block;
        margin-left: 0;
    }
}

footer a {
  display: inline;
}

.footer-navlist {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  grid-column-gap: 24px;
  -moz-column-gap: 24px;
       column-gap: 24px;
}

.footer-navlist-sub {
  page-break-inside: avoid;
  -moz-column-break-inside: avoid;
       break-inside: avoid;
}

.footer-navlist-sub+.footer-navlist-sub {
  margin-top: 40px;
}

.footer-navlist .footer-navlist-item-list {
  list-style: none;
  margin-top: 16px;
}

.footer-navlist-item+.footer-navlist-item {
  margin-top: 8px;
}

.footer-navlist .footer-navlist-item .color-textprimary:hover {
  color: var(--color-TextLink);
}

.footer-navlist .footer-navlist-item .color-textprimary {
  color: var(--color-PrimaryText);
}

.footer-navlist-title {
  font-weight: 600;
  font-size: 16px;
  line-height: 24px;
  margin: 0;
}

.footer-navlist-expand-icon {
  display: none;
}
@media screen and (max-width: 767px) {
  .footer-navlist {
    display: block;
  }

  .footer-navlist-item-list {
    display: none;
    margin-top: 24px;
    list-style-type: none;
  }

  .footer-navlist-item-list.active {
    display: block;
  }

  .footer-navlist-title {
    display: flex;
    font-weight: 500;
    font-size: 16px;
    line-height: 32px;
    height: 32px;
    justify-content: space-between;
  }

  .footer-navlist-title .bn-svg {
    font-size: 20px;
  }

  .footer-navlist-expand-icon {
    display: inline-block;
    padding: 8px;
  }

  .footer-navlist-expand-icon .bn-svg {
    font-size: 16px !important;
    color: var(--color-PrimaryText);
  }

  .footer-navlist-item {
    padding: 0 24px;
  }

  .footer-navlist-item+.footer-navlist-item {
    margin-top: 16px;
  }

  .footer-navlist-group {
    width: auto;
  }

  .footer-navlist-group+.footer-navlist-group {
    margin-top: 16px;
  }

  .footer-navlist-sub+.footer-navlist-sub {
    margin-top: 16px;
  }
}
@media screen and (max-width: 1023px) {
  .footer-navlist-group {
    width: auto;
  }
}

footer.footer-wrapper {
  background-color: var(--color-BasicBg);
  padding: 64px 24px 64px;
}

.footer-wrapper.onlyCopyRight {
  padding: 24px;
}

.footer-content {
  display: grid;
  grid-template-columns: 1fr 4fr;
  grid-column-gap: 24px;
  width: 1200px;
  justify-content: space-between;
  margin: 0 auto;
}


@media screen and (max-width: 1200px) {
  .footer-content {
    width: auto;
  }

}
@media screen and (max-width: 1023px) {
    .footer-content {
        display: flex;
        flex-direction: column-reverse;
        width: 100%;
    }
}



@media screen and (max-width: 767px) {
  footer.footer-wrapper {
    padding: 48px 16px 48px;
  }
  .footer-navlist {
    display: block;
  }
  .footer-wrapper.onlyCopyRight {
    padding: 16px;
  }
}

.header-logo {
  height: 24px;
  color: var(--color-PrimaryYellow);
}

.logo-link {
  cursor: pointer;
  font-size: 0;
  display: inline-flex;
  -webkit-padding-end: 12px;
          padding-inline-end: 12px;
}

.logo-link img {
  height: 64px;
}
.header-nav-subitem {
  display: flex;
  box-sizing: border-box;
  align-items: flex-start;
}

.header-nav-subview.between {
  justify-content: space-between;
}

.header-nav-subicon_warp {
  display: flex;
  justify-content: center;
  -webkit-margin-end: 8px;
          margin-inline-end: 8px;
  margin-top: 1px;
}

.header-nav-subicon_icon {
  width: 20px;
  height: 20px;
  font-size: 20px;
}

.header-nav-subitemtext {
  width: 240px;
}

.header-nav-subitem .header-nav-subarrow {
  font-size: 18px;
  color: var(--color-PrimaryYellow);
  opacity: 0;
}

.header-nav-subitem:hover .header-nav-subarrow {
  display: block;
  -webkit-margin-start: 8px;
          margin-inline-start: 8px;
  opacity: 1;
  transition: all 0.3s ease-in-out;
}

.header-nav-subtitle {
  display: flex;
  color: var(--color-PrimaryText);
  align-items: center;
}

.header-nav-subtitle>.typography-Subtitle4 {
  margin: 0;
}

.header-nav-subdesc {
  color: var(--color-TertiaryText);
}

.header-rightnav-subitem {
  color: var(--color-PrimaryText);
  border-radius: 0px;
}

.header-rightnav-subview {
  -webkit-padding-start: 16px;
          padding-inline-start: 16px;
}

.header-rightnav-subview {
  display: flex;
  align-items: center;
  justify-content: space-between;
  height: 48px;
  width: 100%;
  color: var(--color-PrimaryText);
}

.header-rightnav-subitem.logout {
  border-top: 1px solid var(--color-Line);
  cursor: pointer;
}

.header-rightnav-subview {
  padding: 0 16px;
}

.header-rightnav-subview:hover {
  background-color: var(--color-bg3);
}

.header-rightnav-subicon {
  width: 24px !important;
  height: 24px !important;
  font-size: 24px !important;
  -webkit-margin-end: 8px;
          margin-inline-end: 8px;
  color: var(--color-IconNormal);
}

.header-account-icon {
  width: 24px;
  height: 24px;
  font-size: 24px;
}

.active.dropdownAndDraw-dropdown .header-account-icon {
  color: var(--color-PrimaryYellow);
}

.header-rightnav-subview:hover .header-rightnav-subicon {
  color: var(--color-PrimaryText);
}

.header-nav-subtitle_text {
  font-size: 14px;
  font-weight: 400;
  line-height: 20px;
}

.header-drawer .header-nav-subtitle_text,
.dropdownAndDraw-m-content .header-nav-subtitle_text {
  font-size: 16px;
  line-height: 24px;
}
.header-suffix {
  box-sizing: border-box;
  margin: 0;
  -webkit-margin-start: 6px;
          margin-inline-start: 6px;
  min-width: 0px;
  display: flex;
  position: relative;
  border-radius: 4px;
  -webkit-padding-start: 4px;
          padding-inline-start: 4px;
  -webkit-padding-end: 4px;
          padding-inline-end: 4px;
  font-size: 12px;
  line-height: 16px;
  background-color: var(--color-Line);
  color: var(--color-PrimaryText);
  font-weight: 500;
  font-size: 12px;
  line-height: 16px;
  height: 16px;
  align-items: center
}

.header-suffix::before {
  content: "";
  position: absolute;
  width: 0px;
  height: 0px;
  inset-inline-start: -3px;
  top: 2px;
  border-width: 6px;
  border-inline-start-style: initial;
  border-inline-start-color: initial;
  border-top-style: solid;
  border-top-color: transparent;
  border-bottom-style: solid;
  border-bottom-color: transparent;
  border-inline-end-style: solid;
  border-inline-end-color: var(--color-Line);
}

.header-suffix.header-suffix_yellow {
  background-color: var(--color-BtnBg);
  color: var(--color-TextOnYellow);
}

.header-suffix.header-suffix_yellow::before {
  border-inline-end-color: var(--color-BtnBg);
}
.header-dropdown-menu {
  display: flex;
  align-items: center;
  cursor: pointer;
  font-weight: 400;
  font-size: 14px;
  line-height: 22px;
  color: var(--color-PrimaryText);
}

.header-dropdown-menu .dropdown-icon {
  width: 18px;
  height: 18px;
  color: var(--color-PrimaryText);
}

.header-dropdown-menu-avatar {
  border-radius: 50%;
}

.header-dropdown-menu .menus-icon {
  width: 24px;
  height: 24px;
}

.header-dropdown-menu:hover .header-right-dropdown-icon {
  color: var(--color-PrimaryYellow);
}

.header-menu-item {
  display: flex;
  align-items: center;
  height: 64px;
  position: relative;
  -webkit-padding-start: 12px;
          padding-inline-start: 12px;
  -webkit-padding-end: 12px;
          padding-inline-end: 12px;
}

.header-rightside .header-menu-item {
  -webkit-margin-start: 0px;
          margin-inline-start: 0px;
  padding: 0 8px;
}

.header-dropdown-menu.header-menu-align_frist {
  position: static;
}

.header-dropdown-menu.header-menu-align_frist .header-menu-subgrid {
  inset-inline-start: 160px;
}

.header-dropdown-menu.header-menu-align_frist .header-menu-subgrid.header-menu-item_zh-CN {
  inset-inline-start: 100px;
}

.header-menu-item.center .header-menu-subgridsmall,
.header-menu-item.center .header-menu-subgrid,
.header-menu-item.center .header-menu-sublist {
  inset-inline-start: 50%;
  transform: translate(-50%, 0);
}

[dir="rtl"] .header-menu-item.center .header-menu-subgridsmall,
[dir="rtl"] .header-menu-item.center .header-menu-subgrid,
[dir="rtl"] .header-menu-item.center .header-menu-sublist {
  transform: translate(50%, 0);
}

.header-menu-subgrid,
.header-menu-sublist,
.header-menu-subgridsmall {
  display: none;
  position: absolute;
  z-index: 1300;
  top: 64px;
  inset-inline-start: 0;
  padding: 24px;
  border-radius: 0px 0px 8px 8px;
  background: #fff;
  background: var(--color-CardBg, #fff);
  box-shadow: 0px 8px 8px 0px rgba(24, 26, 32, 0.08);
}

.header-menu-item_icon {
  padding: 0 24px;
  -webkit-margin-start: 0px;
          margin-inline-start: 0px;
}

.header-menu-item_icon+.header-menu-item {
  -webkit-margin-start: 0;
          margin-inline-start: 0;
}

.header-menu-item_icon:hover {
  color: var(--color-PrimaryYellow);
}

.header-leftside .header-menu-item:not(.header-menu-item_icon)>.typography-Subtitle4:hover {
  color: var(--color-TextLink);
}

.header-menu-item:hover .header-menu-subgrid {
  display: grid;
  grid-gap: 24px;
  box-sizing: border-box;
}

.header-menu-item .header-menu-item_hightLight {
  line-height: 28px;
  padding: 0px 8px;
  border-radius: 4px;
  background-color: var(--color-BadgeBg);
  color: var(--color-TextLink);
  cursor: pointer;
}

.header-menu-subgrid-1 {
  grid-template-columns: repeat(1, 1fr);
}

.header-menu-subgrid-2 {
  grid-template-columns: repeat(2, 1fr);
  grid-gap: 24px;
  gap: 24px;
}

.header-menu-subgrid-3 {
  grid-template-columns: repeat(3, 1fr);
  grid-gap: 24px;
  gap: 24px;
}

.header-menu-subgrid-group {
  list-style: none;
}

.header-menu-subgrid-group-li+.header-menu-subgrid-group-li {
  margin-top: 24px;
}

h4.header-menu-subgrid-group-li {
  margin-bottom: -8px;
}

.header-menu-item:hover .header-menu-subgridsmall {
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  grid-gap: 16px;
  box-sizing: border-box;
}

.header-menu-item a {
  color: var(--color-PrimaryText);
}

.header-menu-item_dropdown-icon {
  font-size: 16px !important;
}

.header-menu-item:hover .header-menu-item_dropdown-icon {
  transform: rotate(180deg);
}

.header-menu-item:hover .header-menu-sublist {
  display: grid;
  grid-template-columns: repeat(1, 1fr);
  grid-gap: 16px;
  box-sizing: border-box;
}

.header-rightside .header-menu-item:hover .header-menu-sublist {
  grid-gap: 0;
}

/* .header-menu-link {
  color: var(--color-PrimaryText);
  text-decoration: none;
} */

.header-menu-item_view {
  position: relative;
  display: flex;
  align-items: center;
  color: var(--color-PrimaryText);
  text-decoration: none;
  height: 100%;
}

.header-menu-item:hover .dropdown-icon {
  transform: rotate(180deg);
}

.header-rightside .header-menu-sublist {
  padding: 0px;
  min-width: 220px;
  border-radius: 0 0 8px 8px;
}

.header-rightside .header-menu-subgrid,
.header-rightside .header-menu-sublist,
.header-rightside .header-menu-subgridsmall {
  right: 0;
  left: auto;
  left: initial;
}

.deposit-icon {
  font-size: 16px;
  width: 16px;
  height: 16px;
}

.header-nav-bar {
  display: flex;
  height: 64px;
  justify-content: flex-end;
  align-items: center;
  -webkit-padding-end: 24px;
          padding-inline-end: 24px;
  color: var(--color-PrimaryText);
}

.header-nav-bar .close-btn-size {
  font-size: 24px;
}

.bn-drawer .header-nav-itemview {
  display: flex;
  align-items: center;
  justify-content: space-between;
  height: 56px;
  padding: 0 24px;
  color: var(--color-PrimaryText);
}

.bn-drawer .header-nav-itemnosub {
  display: flex;
  align-items: center;
  justify-content: space-between;
  height: 56px;
  padding: 0 24px;
  color: var(--color-PrimaryText);
  cursor: pointer;
}

.bn-drawer .header-rightnav-subview {
  height: 56px;
  padding: 0 24px;
  color: var(--color-PrimaryText);
}

.bn-drawer .header-nav-itemicon {
  width: 24px;
  height: 24px;
  -webkit-margin-end: 8px;
          margin-inline-end: 8px;
  color: var(--color-IconNormal);
}

.header-nav-subgroup-item {
  display: flex;
  align-items: center;
  justify-content: space-between;
  height: 48px;
  -webkit-padding-start: 64px;
          padding-inline-start: 64px;
}

.header-nav-subgroup-item .typography-Body3 {
  color: var(--color-PrimaryText);
}

.header-nav-subgroup-item:hover {
  background: var(--color-bg3);
}

.header-nav-subgroup-item.nohover:hover {
  background: none;
}

.header-nav-subgroup {
  transition: all 0.3s;
  overflow: hidden;
}

.header-rightside .bn-svg.header-nav-collapseicon {
  width: 16px;
  height: 16px;
  font-size: 16px;
  color: var(--color-IconNormal);
  transition: all 0.3s;
}

.header-nav-collapseicon.expand {
  transform: rotate(180deg);
}

.header-nav-itemnosub:hover {
  background: var(--color-bg3);
}

.header-nav-itemnosub.no-hover-color:hover {
  background: transparent;
}

.header-rightnav-subview:hover .header-nav-collapseicon,
.header-rightnav-subview:hover .header-nav-itemicon,
.header-nav-itemnosub:hover .header-nav-itemicon {
  color: var(--color-PrimaryText);
}

.bn-drawer .header-nav-scroll {
  max-height: calc(100vh - 84px);
  overflow: auto;
}

.header-userinfo-inmail-num {
  min-width: 16px;
  padding: 0 2px;
  height: 16px;
  line-height: 16px;
  font-size: 12px;
  background-color: var(--color-BtnBg);
  border-radius: 100%;
  color: var(--color-TextOnYellow);
  text-align: center;
}

.bn-button.deposit-btn.data-size-small {
  grid-gap: 4px;
  gap: 4px;
}
#header_menu_search {
  font-size: 0;
}
#header_menu_search .search-icon {
  font-size: 24px;
  width: 24px;
  height: 24px;
}

.hover-pointer {
  cursor: pointer;
}

.header-search-input .bn-textField-input {
  font-size: 14px;
}

.right-sub-drawer {
  z-index: 10000 !important;
}

.explore-content .search-input-icon {
  font-size: 20px;
  width: 20px;
  height: 20px;
}

.header-global-js-top-alert {
  color: var(--color-PrimaryText);
  background-color: #FEF1F2;
  transition: all 1s;
}

.header-global-js-top-alert__inner {
  margin-left: auto;
  margin-right: auto;
  padding-left: 16px;
  padding-right: 24px;
  max-width: 1248px;
}
.header-container {
  max-width: 100vw;
  height: 64px;
  position: relative;
  display: flex;
  padding: 0 24px;
  justify-content: space-between;
  background-color: var(--color-BasicBg);
}

.header-menu-rightItem {
  display: flex;
  position: relative;
  padding: 20px 8px;
  align-items: center;
}

.header-menu-rightItem.header-menu-right-pickup {
  padding: 20px 0 20px 8px;
}

.header-leftside {
  display: flex;
  align-items: center;
}

.header-rightside {
  display: flex;
}

.header-rightside .bn-svg {
  width: 24px;
  height: 24px;
  font-size: 24px;
  cursor: pointer;
}

.header-menu-rightItem:hover {
  color: var(--color-TextLink);
}

#toRegisterPage {
  padding-left: 0;
}

.header-rightside .header-menu-rightItem:hover .hover-color {
  color: var(--color-PrimaryYellow);
}

.right-sub-drawer.bn-drawer>.bn-drawer-wrap.data-dir-right {
  max-width: 100%;
}

.height-100 {
  height: 100%;
}

.height-48 {
  height: 48px;
}

.no-border-radius.bn-drawer>.bn-drawer-wrap.data-dir-right {
  border-radius: 0;
}

.rwd-1440-visi-flex,
.rwd-1280-visi-flex,
.rwd-1200-visi-block,
.rwd-1200-visi-flex,
.rwd-1024-visi-block,
.rwd-768-show,
.rwd-768-flex {
  display: none !important;
}

.header-rightside .bn-svg.register-gift-icon {
  font-size: 16px;
  width: 16px;
  height: 16px;
  color: var(--color-TextOnYellow) !important;
}

.bn-button.data-size-small.header-menu-registerbtn {
  grid-gap: 4px;
  gap: 4px;
  font-weight: 500;
}

@media screen and (max-width: 1440px) {
  .rwd-1440-hide-flex {
    display: none;
  }

  .rwd-1440-visi-flex {
    display: flex;
  }
}

@media screen and (max-width: 1023px) {
  .rwd-1024-hide-flex {
    display: none !important;
  }

  .rwd-1024-visi-block {
    display: block !important;
  }

  .rwd-1024-visi-flex {
    display: flex !important;
  }
}

@media screen and (max-width: 1200px) {
  .rwd-1200-hide-flex {
    display: none !important;
  }

  .rwd-1200-visi-block {
    display: block !important;
  }

  .rwd-1200-visi-flex {
    display: flex !important;
  }
}

@media screen and (max-width: 767px) {
  .header-container {
    padding: 0 16px;
  }

  .rwd-768-hide {
    display: none !important;
  }

  .rwd-768-show {
    display: block !important;
  }

  .rwd-768-flex {
    display: flex !important;
  }
}
.richtext-image-drawer.bn-drawer .bn-drawer-wrap{transform:none !important;background-color:transparent}.richtext-image-drawer img{max-width:90vw !important;max-height:80vh !important}@media(max-width: 767px){.richtext-image-drawer img{max-width:100% !important}}
.download-icon-pc{color:var(--color-textPrimary);font-size:40px}
.kline-container {
  position: relative;
  height: 100%;
  flex: 1 1;
  z-index: 0;
}
.pointer:hover {
  cursor: pointer;
}
.kline-wrap {
  width: 100%;
  height: 100%;
  position: relative;
  line-height: 1;
  z-index: 0;
  -webkit-user-select: none;
     -moz-user-select: none;
      -ms-user-select: none;
          user-select: none;
}
.kline-wrap .kline-draw-menu-divider {
  margin: 4px 0;
  border-top: 1px solid #ddd;
}
.kline-wrap .kline-wrap-mask {
  position: absolute;
  width: 100%;
  height: 100%;
  z-index: 201;
}
.kline-wrap .kline-title-wrap {
  color: #76808F;
}
.kline-wrap .kline-title-wrap .default-label-box {
  font-weight: 400;
  font-size: 12px;
  color: var(--color-TertiaryText);
}
.kline-wrap .indicator-title-toolbox svg path {
  fill: #848E9C;
  fill-opacity: 0.8;
}
.kline-wrap .kline-title-wrap .indicator-title-toolbox svg:hover > path {
  fill: #848E9C;
}
.kline-title-wrap .tooltip-wrap {
  position: absolute;
  z-index: 10;
}
.tooltip-wrap.up {
  left: 50%;
  top: -6px;
  transform: translate(-50%, -100%);
}
.tooltip-wrap.right {
  left: 100%;
  top: -6px;
  transform: translate(0%, 0%);
}
.kline-title-wrap .tooltip-arrow {
  position: absolute;
  width: 6px;
  height: 6px;
  top: 100%;
  left: 50%;
  transform: translate(-50%, -50%) rotate(45deg);
}
.kline-title-wrap .tooltip-text {
  padding: 8px 12px;
  white-space: nowrap;
}
.right .tooltip-text {
  margin-left: 6px;
}
.right .tooltip-arrow {
  top: 50%;
  left: 0;
  transform: translate(50%, 0%) rotate(45deg);
}
.kline-wrap .tooltip-wrap {
  background: var(--color-PrimaryText);
  color: var(--color-SecondaryBg);
  border-radius: 8px;
}
.kline-wrap .tooltip-arrow {
  background: var(--color-PrimaryText);
}
.kline-wrap .title-wrapper-container {
  height: 0;
}
.kline-wrap .chart-title-row {
  border: 1px solid transparent;
  display: flex;
  align-items: flex-start;
  font-size: 12px;
  width: -webkit-fit-content;
  width: -moz-fit-content;
  width: fit-content;
  width: -moz-max-content;
  line-height: 14px;
  margin-left: 4px;
  padding: 4px 4px;
  min-height: 24px;
}
.kline-wrap .chart-title-row:hover {
  border: 1px solid var(--color-Line);
  border-radius: 4px;
  cursor: pointer;
}
.kline-wrap .chart-title-row .chart-title-indicator-container {
  display: inline-flex;
  flex-wrap: wrap;
  line-height: 16px;
}
.kline-wrap .chart-title-row .icon-box {
  display: inline-flex;
  position: relative;
  font-size: 12px;
  line-height: 14px;
  cursor: pointer;
}
.kline-wrap .chart-title-row .icon-box {
  margin-right: 2px;
}
.kline-wrap .chart-title-row .indicator-title-toolbox .icon-box:not(:last-child) {
  margin-right: 8px;
}
.kline-wrap .chart-title-row .indicator-title-toolbox .icon-box:last-child {
  margin-right: 0;
}
div.chart-title-row:nth-child(2) ~ div > .chart-title-indicator-container {
  margin-left: 18px;
}
div.chart-title-row.fold:nth-child(2) ~ div {
  display: none;
}
.chart-title-row.fold > .chart-title-indicator-container, .chart-title-row.fold > .indicator-title-toolbox{
  display: none;
}
.icon-box svg {
  transition: transform 0.5s ease-out;
}
.chart-title-row.fold svg {
  transform: rotate(-90deg);
}
.indicator-title-toolbox {
  display: none;
}
.chart-title-row.active:not(.fold) .indicator-title-toolbox {
  display: flex;
  align-items: center;
  height: 16px;
}
.kline-wrap .text-area-wrap {
  position: absolute;
  top: 0;
  left: 0;
  width: 150px;
  height: 80px;
  z-index: 10001;
  background: #ddd;
  outline: none;
  padding: 4px;
  border-radius: 4px;
  border: 1px solid #328DFD;
}
.kline-wrap.dark .text-area-wrap {
  color: #E6E8EA;
  background: rgb(0, 0, 0);
}
.kline-wrap.light .text-area-wrap {
  color: #1E2026;
  background: rgba(0, 0, 0, 0.2);
}

.no-scrollbar {
  -ms-overflow-style: none;
  scrollbar-width: none;
}

.no-scrollbar::-webkit-scrollbar {
  display: none;
}

.cta-treemap-wrapper{overflow:hidden;width:100%;position:relative;height:288px !important}@media screen and (max-width: 820px){.cta-treemap-wrapper{overflow:hidden;width:420px;height:264px !important}}@media screen and (max-width: 768px){.cta-treemap-wrapper{overflow:hidden;width:100%;min-width:362px;height:264px !important}}@media screen and (max-width: 375px){.cta-treemap-wrapper{overflow:hidden;width:100%;min-width:100%;height:288px !important}}
.treemap-wrapper{position:relative;max-height:288px;height:100%;width:100%;overflow:hidden}.treemap-wrapper .treemap-img-ssr{overflow:hidden;position:absolute;top:0;left:0;width:420px;height:288px}@media screen and (max-width: 820px){.treemap-wrapper .treemap-img-ssr{height:264px !important}}@media screen and (max-width: 768px){.treemap-wrapper .treemap-img-ssr{width:100%;min-width:362px;height:264px !important}}@media screen and (max-width: 375px){.treemap-wrapper .treemap-img-ssr{min-width:100%;width:343px;height:288px !important}}.treemap-wrapper .treemap-img-ssr svg{width:100%;height:100%}.treemap-wrapper .echarts-for-react{height:288px !important}@media screen and (max-width: 820px){.treemap-wrapper .echarts-for-react{height:264px !important}}@media screen and (max-width: 768px){.treemap-wrapper .echarts-for-react{width:100%;min-width:362px;height:264px !important}}@media screen and (max-width: 375px){.treemap-wrapper .echarts-for-react{width:100%;min-width:100%;height:288px !important}}
@-webkit-keyframes moveMobile{0%{left:0;transform:translate3d(0, 0, 0)}20%{left:0;transform:translate3d(0, 0, 0)}70%{left:100%;transform:translate3d(-100%, 0, 0)}100%{left:100%;transform:translate3d(-100%, 0, 0)}}@keyframes moveMobile{0%{left:0;transform:translate3d(0, 0, 0)}20%{left:0;transform:translate3d(0, 0, 0)}70%{left:100%;transform:translate3d(-100%, 0, 0)}100%{left:100%;transform:translate3d(-100%, 0, 0)}}@-webkit-keyframes movePC{0%{transform:translate3d(0, 0, 0)}15%{transform:translate3d(0, 0, 0)}75%{transform:translate3d(calc(-100% + 492px), 0, 0)}100%{transform:translate3d(calc(-100% + 492px), 0, 0)}}@keyframes movePC{0%{transform:translate3d(0, 0, 0)}15%{transform:translate3d(0, 0, 0)}75%{transform:translate3d(calc(-100% + 492px), 0, 0)}100%{transform:translate3d(calc(-100% + 492px), 0, 0)}}.announcement-title-date{justify-content:space-between;position:relative}
