#footerToolsMenu{position:fixed;right:24px;bottom:100px;color:#666;z-index:10}
#footerToolsMenu.user-notice-show{bottom:100px}
#footerToolsMenu ul{display:flex;flex-direction:column;align-items:flex-end}
html[lang=ar] #footerToolsMenu ul{align-items:flex-start}
#footerToolsMenu li,#toolMenuShow>div{background:hsla(0,0%,100%,.9);margin:5px;width:48px;height:48px;display:flex;align-items:center;justify-content:center;border-radius:48px;cursor:pointer;position:relative;transition:width .1s;color:#7791a5}
#footerToolsMenu li>span{display:inline-block;height:28px}
#footerToolsMenu li>span .icon{vertical-align:top;color:#adb5cc}
#footerToolsMenu .tools-menu-box li>span,#footerToolsMenu .tools-menu-box li>span .icon{width:28px;height:28px}
#footerToolsMenu .tools-menu-box li>span#survey-icon,#footerToolsMenu .tools-menu-box li>span#survey-icon .icon{width:32px;height:32px}
.changeVersion_icon{width:18px!important}
#footerToolsMenu #toolMenuShow>div:hover,#footerToolsMenu li.active{background:var(--color-brand-1);background-image:linear-gradient(45deg,#ff6db6,#ff8100);color:#fff}
#toolMenuShow{position:absolute;top:-63px;right:-5px;padding-top:6px;transform:rotate(180deg);display:none}
.tier-info .dj svg{font-size:16px;color:var(--color-text-1)}
#backTopBtn{display:flex;align-items:center}
.aside-hide#footerToolsMenu .tools-menu-box:hover~#backTop #toolMenuShow,.aside-hide#footerToolsMenu li:hover #toolMenuShow{display:block}
#footerToolsMenu li:hover #toolMenuShow{color:#666}
#footerToolsMenu li i.hide{display:none}
#footerToolsMenu:hover li:first-child{display:flex}
#footerToolsMenu li i{font-style:normal;font-size:14px;display:inline-block;word-break:keep-all;user-select:none}
#footerToolsMenu li.active,#footerToolsMenu li.active:hover{background-image:linear-gradient(45deg,#ff6db6,#ff8100)!important}
#footerToolsMenu li.active:hover,#footerToolsMenu li:first-child:hover{width:48px}
#footerToolsMenu li.active:hover i.hide{display:none}
#footerToolsMenu ul.aside-tool-more{position:absolute;right:56px;bottom:0;min-width:140px;box-sizing:border-box;background:#fff;align-items:flex-start;box-shadow:0 0 24px rgba(70,100,140,.15);border-radius:8px;overflow:hidden;display:none}
#footerToolsMenu #menuCustomerService:hover ul.aside-tool-more,#footerToolsMenu #toolMore:hover ul.aside-tool-more{display:flex}
#footerToolsMenu #menuCustomerService:hover:before,#footerToolsMenu #menuLogoBox:hover:before,#footerToolsMenu #toolMore:hover:before{content:'';width:15px;height:100%;left:-15px;position:absolute}
#footerToolsMenu ul.aside-tool-more li>span{width:24px;height:24px;margin-right:8px}
#footerToolsMenu ul.aside-tool-more li>span .icon{width:24px;height:24px}
#footerToolsMenu ul.aside-tool-more li{box-shadow:none;color:#04091a;margin:0;width:100%;justify-content:unset;box-sizing:border-box;padding:16px;font-size:14px;font-weight:900;border-radius:unset}
#footerToolsMenu ul.aside-tool-more li:first-child:hover{width:100%}
#footerToolsMenu .aside-tool-more li:hover>span .icon,#footerToolsMenu .aside-tool-more li>span .icon,#footerToolsMenu li:hover>span .icon{background:unset;color:var(--color-brand-1)}
#footerToolsMenu .calculator-close-btn{display:inline-block;position:absolute;right:12px;color:#fff;background:rgba(0,0,0,.3);width:24px;height:24px;line-height:23px;text-align:center;border-radius:50%;transform:rotate(45deg);top:12px;cursor:pointer}
#footerToolsMenu .aside-tool-more li>span .icon{color:#04091a}
#footerToolsMenu li:hover{background:#fff}
.theme-change-tips-span{font-weight:700}
#footerToolsMenu .theme-change-tips{display:none;min-width:200px;box-sizing:border-box;background:#2354e6;box-shadow:0 0 24px rgb(70 100 140/15%);border-radius:8px;padding:12px 16px;font-weight:500;font-size:14px;line-height:22px;color:#fff;position:absolute;right:68px;cursor:auto;top:88px;transform:translateY(-50%)}
#footerToolsMenu .theme-change-tips:before{display:block;content:'';position:absolute;border:10px solid;border-top-color:transparent!important;border-left-color:var(--color-brand-1)!important;border-right-color:transparent!important;border-bottom-color:transparent!important;right:-20px;top:50%;transform:translateY(-50%)}
#footerToolsMenu .theme-change-tips .know-tips{display:block;margin-top:8px;color:#17e6a1;cursor:pointer}
li#toWebsiteTop{opacity:0;transition:all .5s}
li#toWebsiteTop.menu-top-show{opacity:1}
#footerToolsMenu ul.aside-tool-more li:hover{color:var(--color-brand-1)!important}
#footerToolsMenu ul.aside-tool-more li svg path{fill:#04091a}
#footerToolsMenu ul.aside-tool-more li:hover svg path,#footerToolsMenu ul.aside-tool-more li:hover svg rect:nth-child(n+2){fill:var(--color-brand-1)}
#footerToolsMenu li#toWebsiteTop:hover>span svg path{stroke:var(--color-brand-1)}
#footerToolsMenu a.tool-more-link{width:100%}
#footerToolsMenu ul.aside-tool-more li i{white-space:nowrap;font-weight:600}
#footerToolsMenu #toolSatisfactionSurvey{display:none}
#footerToolsMenu ul.aside-tool-more .change_diff_version{color:#04091a;margin:0;width:100%;justify-content:unset;box-sizing:border-box;padding:16px;font-size:14px;font-weight:900;border-radius:unset;display:flex;align-items:center}
#footerToolsMenu .new_trade_version{display:block!important}
#footerToolsMenu ul.aside-tool-more .change_diff_version #newTrade_icon{margin-right:12px;margin-left:4px}
#footerToolsMenu ul.aside-tool-more .change_diff_version:hover i{color:var(--color-brand-1)}
#footerToolsMenu ul.aside-tool-more .change_diff_version i{white-space:nowrap}
#footerToolsMenu ul.aside-tool-more .change_diff_version .icon_new_trade{color:#04091a!important}
#footerToolsMenu.aside-show>ul.tools-menu-box>li{width:48px;height:48px;border-radius:50%;margin:0;transition:all .4s cubic-bezier(.68,-.55,.27,1.55);display:flex;align-items:center;justify-content:center;box-sizing: border-box;box-shadow: 0px 4px 14px 0px rgba(0, 0, 0, 0.08);}
#footerToolsMenu.aside-show>ul.tools-menu-box>li#menuLogoBox{background:var(--color-bg-primary);border: 1px solid var(--color-line-divider-strong);}
#footerToolsMenu.aside-show>ul.tools-menu-box>li#menuLogoBox .menuLogoBoxCloseIcon{border:1px solid var(--color-divider-2);align-items:center;justify-content:center;border-radius:50%;width:16px;height:16px;position:absolute;top:-12px;right:-12px}
#footerToolsMenu.aside-show>ul.tools-menu-box>li#menuLogoBox:hover .menuLogoBoxCloseIcon{display:flex!important}
#footerToolsMenu.aside-show>ul.tools-menu-box>li.menu-top-show{margin-bottom:24px;border:1px solid var(--color-line-divider-strong);background:var(--color-bg-primary);}
#footerToolsMenu.aside-show>ul.tools-menu-box>li.menu_hide_box{background:#2354e6;width:16px;height:56px;align-items:center;justify-content:center;cursor:pointer;border-radius:4px 0 0 4px;display:none;margin-right:-24px}
#footerToolsMenu.aside-show>ul .tool-more-link li{box-shadow:none}

@keyframes fadeInSlide {
  from {
    opacity: 0;
    transform: translateX(40px);
  }
  to {
    opacity: 1;
    transform: translateX(0);
  }
}
/* 关键帧动画：100%->105%->100% */
@keyframes popScaleFade {
  0% {
    opacity: 0;
    transform: translateY(var(--translate-y-height)) scale(1);
  }
  50% {
    opacity: 1;
    transform: translateY(var(--translate-y-height)) scale(1.05);
  }
  100% {
    opacity: 1;
    transform: translateY(var(--translate-y-height)) scale(1);
  }
}
#footerToolsMenu.aside-show>ul.tools-menu-box>li#downloadAppSpecial{background-color: var(--color-function-brand);margin-bottom: 24px;position: relative;transition: none;max-width: unset;box-shadow: 0px 4px 14px 0px rgba(0, 0, 0, 0.08);}
#footerToolsMenu.aside-show>ul.tools-menu-box>li#downloadAppSpecial .btn-app-special {
  display:flex;align-items:center;justify-content:center;box-sizing: border-box;
  gap: 4px;
  max-width: 50px;
  transition: max-width 300ms cubic-bezier(0.3,0,0.3,1);
  overflow: hidden;
}
#footerToolsMenu.aside-show>ul.tools-menu-box>li#downloadAppSpecial:hover .btn-app-special {width: auto;max-width: 300px;}
#footerToolsMenu.aside-show>ul.tools-menu-box>li#downloadAppSpecial svg{width: 24px;height: 24px;color: #fff;}
#footerToolsMenu.aside-show>ul.tools-menu-box>li#downloadAppSpecial:hover{width: auto;max-width: unset;padding: 0 13px;gap: 4px;border-radius: 60px;}
.download-app-default-hidden-box {display: none;}
li#downloadAppSpecial:hover .download-app-default-hidden-box {display: block;animation: fadeInSlide 0.3s cubic-bezier(0.3,0,0.3,1) forwards;}
li#downloadAppSpecial .download-app-text {font-size: 14px;font-weight: 400;color: #fff;white-space: nowrap;}
li#downloadAppSpecial:hover .download-app-hover-pop-box {
  display: flex;
  pointer-events: auto;
  animation: popScaleFade 600ms cubic-bezier(0.3,0,0.3,1);
}
.download-app-hover-pop-box {
  --translate-y-height: -12px;
  transform: translateY(var(--translate-y-height));
  position: absolute;
  bottom: calc(100%);
  right: 0;
  width: 184px;
  max-width: 200px;
  padding: 22px 16px 16px;
  background-color: var(--color-neutral-6);
  box-shadow: 0px 1px 20px 0px #00000026;
  border-radius: 6px;
  flex-direction: column;
  align-items: center;
  gap: 8px;
  box-sizing: border-box;
  cursor: default;
  pointer-events: none;
  transform-origin: bottom right;
  transition: 
    opacity 300ms cubic-bezier(0.3,0,0.3,1),
    transform 300ms cubic-bezier(0.3,0,0.3,1);
}
.download-app-default-hidden-box.download-app-hover-pop-box::after {
  content: '';
  height: 24px;
  width: 100%;
  display: block;
  position: absolute;
  bottom: var(--translate-y-height); /* 解决hover间距增加实效问题  */
}
.download-icon-container,
.download-icon-hover {
  width: 24px;
  height: 24px;
}
.download-app-hover-pop-box > #qrCodeCanvasDownload {
  position: relative;
  z-index: -1;
  width: 108px;
  height: 108px;
  border: 10px solid #fff;
  border-radius: 8px;
  margin: -10px;
  background-color: #fff;
  box-sizing: content-box;
}
#qrCodeCanvasDownload > img {
  border-radius: 4px;
}
.classic-dark .download-app-hover-pop-box > #qrCodeCanvasDownload {
  margin: 0px;
}
#qrCodeCanvasDownloadLogo {
  position: absolute;
  width: 38px;
  height: 38px;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  border-radius: 8px;
}

.download-app-hover-pop-box .download-app-special-hover-pop-text {
  font-size: 12px;
  line-height: 1;
  color: var(--color-text-3);
  text-align: center;
}
.download-app-hover-pop-box > button {
  height: 40px;
  line-height: 40px;
  border: none;
  color: var(--color-text-1);
  font-size: 14px;
  font-weight: 500;
  background-color: var(--color-neutral-1);
  border-radius: 20px;
  width: 100%;
  cursor: pointer;
}

.close_menu_icon_box:after,.close_menu_icon_box:before{content:'';position:absolute;display:block;width:100%;height:4px}
.close_menu_icon_box:before{top:-4px}
.close_menu_icon_box:after{right:-4px;height:100%;width:4px}
.show_menu_content_box{width:100%;height:100%;display:flex;align-items:center;justify-content:center}
.show_menu_content_box #toolServiceIcon svg{vertical-align:super}
.show_menu_content_box #toolServiceIcon .service-icon{vertical-align:middle}
.service-icon{fill:#acb2bf}
.service-icon .mouse{stroke:#acb2bf}
.service-icon:hover{fill:var(--color-brand-1)}
.service-icon:hover .mouse{stroke:var(--color-brand-1)}
#footerToolsMenu #toolMore{height:0;border-radius:22px}
#floatToolService{position:relative}
.service-tip-arrow{position:absolute;width:16px;height:16px;transform:rotate(-90deg);right:-10px;fill:var(--color-brand-1)}
#footerToolsMenu.aside-show ul .tool-box>li{margin:0;box-shadow:none;width:44px;height:40px;padding:4px 6px;box-sizing:border-box}
.service-icon{width:32px}
.service-icon:hover{opacity:1}
#footerToolsMenu ul.tool-box{display:none;padding:8px 0;background:#fff!important;box-shadow:0 0 8px rgba(35,84,230,.1);border-radius:48px}
#footerToolsMenu #app-exclusive-perks-box{margin-bottom:24px;width:100px;height:100px;border-radius:unset;box-shadow:none;opacity:0;animation-name:AdaCampaignIn;animation-duration:1s;animation-fill-mode:both;background-color:transparent}
#app-exclusive-perks-box .exclusive-perks-img {padding-bottom: 16px;}
#app-exclusive-perks-box .exclusive-perks-img img{width:100%;height:100%}
#app-exclusive-perks-box .close-exclusive-perks-icon{position:absolute;width:12px;height:12px;right:0;top:0;cursor:pointer;display:block;z-index:2}
#app-exclusive-perks-box .close-exclusive-perks-icon svg{stroke:#b8bdcc}
#app-exclusive-perks-box .close-exclusive-perks-icon:hover svg{stroke:var(--color-brand-1)}
#app-exclusive-perks-box .exclusive-perks-price-value{line-height:120%;padding:4px 16px;border-radius:30px;background:linear-gradient(180deg,#ff8039,#ff8d5c);position:absolute;bottom:-10px;width:max-content;max-width:180px}
#app-exclusive-perks-box .exclusive-perks-price-value .exclusive-perks-price-text{display:block;font-weight:700;font-size:16px;line-height:18px;color:#fff}
#app-exclusive-perks-box:hover .exclusive-perks-price-value{display:none}
#app-exclusive-perks-box .exclusive-perks-text{display:none;text-align:right;font-size:10px;line-height:120%;padding:4px 16px;border-radius:30px;opacity:.95;background-color:var(--color-card-6);position:absolute;bottom:-12px;right:0;width:max-content;max-width:180px}
#app-exclusive-perks-box:hover .exclusive-perks-text{display:flex;flex-direction:column;gap:4px}
#app-exclusive-perks-box .exclusive-perks-text-title{color:var(--color-text-1);font-weight:600}
#app-exclusive-perks-box .exclusive-perks-text-description{color:var(--color-text-3);font-weight:500}
#app-exclusive-perks-box .exclusive-perks-text-description svg{vertical-align:-.5px}
@keyframes AdaCampaignIn{0%{opacity:0;transform:translate3d(0,100%,0)}
  to{opacity:1;transform:translateZ(0)}
}
body.gate-base-panel-show{overflow:hidden}
.gate-base-modal-wrapper .modal-mask{position:fixed;z-index:1000;left:0;right:0;top:0;bottom:0;background-color:rgba(0,0,0,.8);transition:all .5s}
.gate-base-modal-wrapper .modal-container{z-index:1001;position:fixed;top:50%;left:50%;transform:translate(-50%,-50%);background:var(--color-card-2);width:820px;border-radius:16px;padding:32px 40px;box-shadow:0 0 16px rgba(20,40,130,.05);font-weight:400;box-sizing:border-box}
.gate-base-modal-wrapper .modal-container.modal-container-size-md{width:384px;border-radius:4px;padding:16px 24px 24px}
.gate-base-modal-wrapper .modal-container.animated{transform:translate(-50%,-50%);opacity:1}
.gate-base-modal-wrapper .modal-title{display:flex;justify-content:space-between;color:var(--color-text-1);font-weight:600;line-height:150%;font-size:24px;margin-bottom:16px}
.gate-base-modal-wrapper .modal-title .iconshanchu{display:inline-flex;align-items:center;color:var(--color-text-4);font-weight:400;cursor:pointer;width:24px;height:24px;font-size:24px;position:absolute;right:16px;top:16px}
.gate-base-modal-wrapper .modal-title .iconshanchu:hover{color:var(--color-text-4)!important}
.gate-base-modal-wrapper .modal-container-size-md .modal-title .iconshanchu{width:16px;height:16px;font-size:16px}
.gate-base-modal-wrapper .exclusive-perks-await{margin-top:-16px;text-align:center}
.gate-base-modal-wrapper .exclusive-perks-await img{width:124px;height:124px}
.gate-base-modal-wrapper .exclusive-perks-await p{font-size:24px;font-weight:600;line-height:120%;color:var(--color-text-1);margin:8px 0}
.gate-base-modal-wrapper .exclusive-perks-await span{font-size:14px;color:var(--color-text-3)}
.gate-base-modal-wrapper .exclusive-perks-await .base-modal-bottom-box{margin-top:24px}
.gate-base-modal-wrapper .exclusive-perks-await button{font-size:16px;font-weight:600;border-radius:20px;background-color:var(--color-brand-1);color:#fff;width:100%;height:40px;border:none;cursor:pointer}
.gate-base-modal-wrapper .exclusive-perks-await button:hover{background-color:var(--color-brand-2)}
#serviceClientFrameContainer iframe{display:block!important}
@media screen and (max-width:820px){.gate-base-modal-wrapper .modal-container{max-width:80vw}
}
@media screen and (max-width:768px){.gate-base-modal-wrapper .modal-container:not(.modal-container-size-md){max-width:100vw;width:100%;top:6%;left:0;bottom:0;transform:unset!important;box-shadow:unset;border-radius:8px 8px 0 0;padding:24px 16px}
  .gate-base-modal-wrapper .modal-container.modal-container-size-md{max-width:85vw}
  .gate-base-modal-wrapper .modal-title{font-size:16px}
  .gate-base-modal-wrapper .modal-title .iconshanchu{width:20px;height:20px}
  .switchAccountWrapper .modal-body{max-height:calc(100% - 48px)}
  .gate-base-modal-wrapper .tipPopEm>svg{vertical-align:text-top}
  .gate-base-modal-wrapper .modal-body .block-tips .mantine-Switch-track{min-width:38px}
  .gate-base-modal-wrapper .button-box{height:48px;padding:0;position:fixed;bottom:0;left:0;width:100%;background-color:#fff;margin-bottom:0}
}
