/* 全站导航样式。原先内联复制在 14 个页面里、另有一份在 account-pages.css，
   现统一到这里，配合 assets/site-header.js 使用。取自 about.html 的内联版本
   （2026-08-20 经浏览器实测：与 account-pages.css 版渲染结果基本一致）。 */

nav{position:relative;z-index:2;max-width:1360px;height:68px;margin:0 auto;display:flex;align-items:center;gap:30px;padding:0 24px 0 26px;border:1px solid rgba(255,255,255,.11);border-radius:999px;background:rgba(4,16,34,.76);box-shadow:0 18px 54px rgba(0,0,0,.36),inset 0 1px 0 rgba(255,255,255,.08);backdrop-filter:blur(18px);-webkit-backdrop-filter:blur(18px);pointer-events:auto}
.logo{display:flex;align-items:center}
.nav-logo-img{width:215px;height:auto;max-height:48px;object-fit:contain}
.nav-links{display:flex;align-items:center;gap:34px;margin-left:8px;font-family:"Microsoft YaHei","PingFang SC","Source Han Sans SC",sans-serif;font-size:16px;color:#c7d8ef}
.nav-links a{display:flex;align-items:center;gap:6px;color:inherit;font:inherit;font-weight:600;letter-spacing:0;opacity:.86}
.nav-links a:hover,.nav-links a.active{opacity:1;color:#fff}
.nav-links svg{width:11px;height:11px;opacity:.62}
.nav-item{position:static;display:flex;align-items:center}
.nav-item>a{min-height:68px}
.nav-dropdown{position:absolute;top:-18px;left:50%;width:100vw;height:clamp(380px,42vh,430px);padding:104px max(46px,calc((100vw - 1360px)/2 + 24px)) 42px;border:1px solid rgba(120,180,240,.16);border-left:0;border-right:0;border-radius:0;background:linear-gradient(180deg,rgba(4,16,34,.9),rgba(4,14,30,.74)),radial-gradient(circle at 78% 26%,rgba(72,180,255,.22),transparent 34%),radial-gradient(circle at 16% 64%,rgba(30,135,245,.14),transparent 38%);box-shadow:0 28px 78px rgba(0,0,0,.36),inset 0 1px 0 rgba(255,255,255,.08),inset 0 -1px 0 rgba(120,180,240,.2);backdrop-filter:blur(24px);-webkit-backdrop-filter:blur(24px);opacity:0;visibility:hidden;transform:translate(-50%,-10px);pointer-events:none;transition:.22s ease;z-index:-1}
.nav-dropdown::before{content:"";position:absolute;left:0;right:0;top:0;height:112px}
.nav-item:hover .nav-dropdown,.nav-item:focus-within .nav-dropdown{opacity:1;visibility:visible;transform:translate(-50%,0);pointer-events:auto}
.mega-menu{position:relative;display:grid;grid-template-columns:minmax(330px,430px) minmax(0,1fr);gap:70px;max-width:1360px;margin:0 auto}
.mega-promo{padding-top:10px;padding-left:120px}
.mega-promo h3{max-width:390px;color:#eef6ff;font-family:"Microsoft YaHei","PingFang SC","Source Han Sans SC",sans-serif;font-size:32px;font-weight:300;line-height:1.38;letter-spacing:0}
.mega-actions{display:flex;gap:16px;flex-wrap:wrap;margin-top:32px}
.mega-actions a{min-height:46px;padding:0 22px;border-radius:8px;font-size:15px;font-weight:700;opacity:1}
.mega-actions .mega-primary{background:linear-gradient(180deg,#39a7ff,#1688f8);color:#fff;box-shadow:0 12px 34px rgba(22,136,248,.38)}
.mega-actions .mega-ghost{border:1px solid rgba(57,167,255,.72);color:#eaf6ff;background:rgba(22,136,248,.08)}
.mega-actions a:hover{transform:translateY(-1px)}
.nav-dropdown a{font-weight:400;min-height:0;padding:4px 0;border-radius:0;color:rgba(219,233,251,.66);font-family:"Microsoft YaHei","PingFang SC","Source Han Sans SC",sans-serif;font-size:14px;line-height:1.55;white-space:nowrap;opacity:1}
.nav-dropdown a:hover{color:#fff;background:transparent;opacity:1}
.nav-dropdown .mega-actions a{display:inline-flex;align-items:center;justify-content:center;min-height:46px;padding:0 22px;border-radius:8px;font-size:15px;line-height:1;font-weight:700}
.nav-dropdown .mega-actions .mega-primary{background:linear-gradient(180deg,#39a7ff,#1688f8);color:#fff}
.nav-dropdown .mega-actions .mega-ghost{border:1px solid rgba(57,167,255,.72);color:#eaf6ff;background:rgba(22,136,248,.08)}
.nav-dropdown .mega-actions .mega-primary:hover{box-shadow:0 14px 38px rgba(22,136,248,.5)}
.nav-dropdown .mega-actions .mega-ghost:hover{border-color:rgba(72,180,255,.95);background:rgba(22,136,248,.16);color:#fff}
.nav-dropdown.wide,.nav-dropdown.market{min-width:0}
.nav-menu-grid{display:grid;grid-template-columns:repeat(3,minmax(150px,1fr));gap:50px 86px;align-content:start}
.nav-dropdown.market .nav-menu-grid{grid-template-columns:150px 120px 120px;gap:50px 34px;justify-content:start}
.nav-menu-col{display:grid;align-content:start;gap:10px}
.nav-dropdown.market .market-extra{padding-top:48px}
.nav-menu-col h4{margin:0 0 10px;color:#f4f8ff;font-family:"Microsoft YaHei","PingFang SC","Source Han Sans SC",sans-serif;font-size:18px;font-weight:500;line-height:28px;letter-spacing:0;text-transform:none}
.nav-right{margin-left:auto;display:flex;align-items:center;gap:14px}
.nav-right .btn{min-height:40px;padding:0 21px}
.lang-btn{width:40px;height:40px;border-radius:50%;display:grid;place-items:center;background:rgba(255,255,255,.06);border:1px solid rgba(255,255,255,.16);color:#c7d8ef}
.lang-btn svg{width:20px;height:20px}
.menu-toggle{display:none;width:44px;height:44px;border-radius:12px;border:1px solid rgba(255,255,255,.16);background:rgba(255,255,255,.06);color:#c7d8ef;cursor:pointer;place-items:center}
.menu-toggle span{display:block;width:21px;height:2px;border-radius:999px;background:currentColor;box-shadow:0 7px 0 currentColor,0 -7px 0 currentColor}
.mobile-menu-panel{display:none}
.fbrand .nav-logo-img{width:284px;max-height:96px}
@media (max-width:900px) {
nav{height:68px;margin:0 14px;padding:0 18px;gap:18px}
.nav-logo-img{width:180px}
.nav-right .lang-btn{display:none}
.nav-right .btn{display:inline-flex;min-height:38px;padding:0 15px;font-size:13px}

}
@media (max-width:560px) {
nav{height:58px;min-height:58px;margin:0 10px;padding:0 10px 0 14px;gap:8px;border-radius:26px}
.nav-logo-img{width:160px;max-height:38px}
.nav-right{gap:8px}
.nav-right .btn{padding:0 12px;font-size:13px}
.menu-toggle{width:38px;height:38px;border-radius:10px}
.menu-toggle span{position:relative;width:19px}
.fbrand .logo{justify-content:flex-start}
.fbrand .nav-logo-img{width:190px}

}

/* 补充：1280px 以下收起为汉堡菜单。七个中文一级栏目在此宽度下排不进胶囊。
   （首轮提取时因 @media 前有注释被解析器跳过，2026-08-20 补回） */
/* 七个中文一级栏目在 1280px 以下排不进胶囊，会逐字折行，
     所以和 MT4/MT5 一样在这里就收起成汉堡菜单 */
  @media (max-width:1280px) {
.nav-links{display:none}
.menu-toggle{display:grid}
nav.menu-open .menu-toggle span{height:0;box-shadow:none}
nav.menu-open .menu-toggle span::before,nav.menu-open .menu-toggle span::after{content:"";position:absolute;width:21px;height:2px;border-radius:999px;background:currentColor;left:50%;top:50%;transform-origin:center}
nav.menu-open .menu-toggle span::before{transform:translate(-50%,-50%) rotate(45deg)}
nav.menu-open .menu-toggle span::after{transform:translate(-50%,-50%) rotate(-45deg)}
.mobile-menu-panel{position:absolute;top:calc(100% + 14px);left:10px;right:10px;display:block;max-height:calc(100vh - 106px);overflow-y:auto;padding:24px 22px;border:1px solid rgba(255,255,255,.1);border-radius:24px;background:rgba(4,12,30,.96);box-shadow:0 26px 70px rgba(0,0,0,.48),inset 0 1px 0 rgba(255,255,255,.06);backdrop-filter:blur(20px);opacity:0;visibility:hidden;transform:translateY(-8px);pointer-events:none;transition:.22s ease}
nav.menu-open .mobile-menu-panel{opacity:1;visibility:visible;transform:translateY(0);pointer-events:auto}

}

/* 补充：首页原本独有的导航细节（hover 态、logo 标记等），统一到全站。 */
.nav-right .btn,.mobile-menu-actions .btn{position:relative;overflow:hidden;isolation:isolate}
.nav-right .btn::after,.mobile-menu-actions .btn::after{content:"";position:absolute;inset:0;z-index:1;pointer-events:none; background:linear-gradient(115deg,transparent 38%,rgba(255,255,255,.6) 50%,transparent 62%); transform:translateX(-160%)}
.nav-right .btn-ghost::after,.mobile-menu-actions .btn-ghost::after{animation:navShine 3s linear infinite}
.nav-right .btn-primary::after,.mobile-menu-actions .btn-primary::after{animation:navShine 3s linear infinite .2s}
@media (prefers-reduced-motion:reduce){
  .nav-right .btn-ghost::after,.nav-right .btn-primary::after,.mobile-menu-actions .btn-ghost::after,.mobile-menu-actions .btn-primary::after,.endcta .btn::after{animation:none}
}
.logo .mark{width:34px;height:34px;border-radius:50%;background:linear-gradient(140deg,#39a7ff,#0878ef);display:grid;place-items:center;box-shadow:0 0 0 6px rgba(22,136,248,.1)}
.logo .mark svg{width:17px;height:17px}
.lang-btn:hover{color:#fff;background:rgba(255,255,255,.12);border-color:rgba(120,170,235,.5)}
.menu-toggle:hover,.menu-toggle[aria-expanded="true"]{color:#fff;background:rgba(255,255,255,.12);border-color:rgba(120,170,235,.5)}
.menu-toggle:focus-visible{outline:2px solid rgba(88,183,255,.78);outline-offset:2px}
.mobile-menu-actions{display:none}
.mobile-menu-actions .btn{height:52px;display:grid;place-items:center;padding:0;border-radius:18px}

@keyframes navShine{
    0%{transform:translateX(-160%)}
    20%{transform:translateX(160%)}
    100%{transform:translateX(160%)}
  }

/* 导航按钮配色。此前 12 个内联页面各写一份、account-pages.css 一份、
   mt-platform-fixes.css 一份；mt4/mt5 只有最后那份，移除后就没了着色。
   限定在导航容器内，避免影响正文里的同名按钮。 */
.nav-right .btn-ghost,.mobile-menu-actions .btn-ghost{border:1px solid rgba(255,255,255,.16);color:#fff;background:rgba(255,255,255,.055)}
.nav-right .btn-primary,.mobile-menu-actions .btn-primary{color:#fff;background:linear-gradient(180deg,#39a7ff,#1688f8);box-shadow:0 8px 30px rgba(22,136,248,.42)}


/* ======================================================================
   以下自 account-pages.css 迁入：[data-site-header] 前缀，特异度高于上面的
   基础规则，原本就靠这一点覆盖，位置放在基础规则之后以保持同样的层叠结果。
   ====================================================================== */
/* 七个中文一级栏目在 1280px 以下排不进胶囊，会逐字折行，
   所以在这里就收起成汉堡菜单（与站点其余页面一致） */
@media (max-width: 1280px) {
  /* 已删除 .nav-links,.nav-right{display:none} 与 .menu-toggle{display:grid;
     margin-left:auto}：来自 account-pages.css 的旧版导航遗留（同块里还引用
     .mobile-panel / .site-nav.open 这些当前 HTML 不存在的类名）。本文件前面的
     1280px 断点已正确处理收起；保留会把 .nav-right 连同汉堡按钮一起隐藏。 */

}
/* 七个中文一级栏目在 1280px 以下排不进胶囊，会逐字折行，
   所以在这里就收起成汉堡菜单（与站点其余页面一致） */
@media (max-width: 1280px) {
[data-site-header] .nav-links{ display: none; }
[data-site-header] .nav-right .lang-btn{ display: none; }
[data-site-header] .nav-right .btn{ display: inline-flex; padding: 9px 15px; font-size: 13px; line-height: 1; }
[data-site-header] .menu-toggle{ display: grid; }
[data-site-header] nav.menu-open .menu-toggle span{ position: relative; height: 0; box-shadow: none; }
[data-site-header] nav.menu-open .menu-toggle span::before,
  [data-site-header] nav.menu-open .menu-toggle span::after{
    content: "";
    position: absolute;
    left: 50%;
    top: 50%;
    width: 21px;
    height: 2px;
    border-radius: 999px;
    background: currentColor;
    transform-origin: center;
  }
[data-site-header] nav.menu-open .menu-toggle span::before{ transform: translate(-50%,-50%) rotate(45deg); }
[data-site-header] nav.menu-open .menu-toggle span::after{ transform: translate(-50%,-50%) rotate(-45deg); }
[data-site-header] .mobile-menu-panel{
    position: absolute;
    top: calc(100% + 14px);
    left: 10px;
    right: 10px;
    display: block;
    max-height: calc(100vh - 106px);
    overflow-y: auto;
    padding: 26px 22px 28px;
    border: 1px solid rgba(255,255,255,.1);
    border-radius: 24px;
    background: rgba(4,12,30,.96);
    box-shadow: 0 26px 70px rgba(0,0,0,.48),inset 0 1px 0 rgba(255,255,255,.06);
    backdrop-filter: blur(20px);
    opacity: 0;
    visibility: hidden;
    transform: translateY(-8px);
    pointer-events: none;
    transition: .22s ease;
  }
[data-site-header] nav.menu-open .mobile-menu-panel{
    opacity: 1;
    visibility: visible;
    transform: translateY(0);
    pointer-events: auto;
  }
[data-site-header] .mobile-menu-actions{ display: none; }

}


/* ======================================================================
   以下自 site-footer.css 迁入：原名「Canonical site navigation geometry」，
   带 !important，是导航几何的最终权威。必须留在本文件最后。
   ====================================================================== */
/*
 * Canonical site navigation geometry.
 * The home-page header is the source of truth. These high-priority shared
 * rules prevent page-specific bundles from changing the same controls.
 */
body > header > nav,
[data-site-header] > header > nav{
  box-sizing: border-box !important;
  width: calc(100% - 48px) !important;
  max-width: 1360px !important;
  height: 68px !important;
  min-height: 68px !important;
  margin-right: auto !important;
  margin-left: auto !important;
  padding: 0 24px 0 26px !important;
  gap: 30px !important;
  border: 1px solid rgba(255, 255, 255, .11) !important;
  border-radius: 999px !important;
  background: rgba(4, 16, 34, .76) !important;
  box-shadow: 0 18px 54px rgba(0, 0, 0, .36), inset 0 1px 0 rgba(255, 255, 255, .08) !important;
  backdrop-filter: blur(18px) !important;
  -webkit-backdrop-filter: blur(18px) !important;
}
body > header .nav-logo-img,
[data-site-header] > header .nav-logo-img{
  width: 215px !important;
  height: auto !important;
  max-height: 48px !important;
  object-fit: contain !important;
}
body > header .nav-right,
[data-site-header] > header .nav-right{
  flex: 0 0 auto !important;
  gap: 14px !important;
}
body > header .nav-right .btn,
[data-site-header] > header .nav-right .btn{
  box-sizing: border-box !important;
  width: auto !important;
  min-width: 0 !important;
  height: auto !important;
  min-height: 0 !important;
  padding: 10px 21px !important;
  border-radius: 999px !important;
  font-family: "General Sans", -apple-system, "Segoe UI", sans-serif !important;
  font-size: 15px !important;
  font-weight: 500 !important;
  line-height: 1.5 !important;
  letter-spacing: normal !important;
  white-space: nowrap !important;
}
body > header .nav-right .btn-primary,
[data-site-header] > header .nav-right .btn-primary{
  border: 0 !important;
}
body > header .nav-right .btn-ghost,
[data-site-header] > header .nav-right .btn-ghost{
  border: 1px solid rgba(255, 255, 255, .16) !important;
}
body > header .menu-toggle,
[data-site-header] > header .menu-toggle{
  width: 44px !important;
  height: 44px !important;
  border-radius: 12px !important;
}
@media (max-width: 900px) {
body > header > nav,
  [data-site-header] > header > nav{
    width: calc(100% - 28px) !important;
    height: 68px !important;
    min-height: 68px !important;
    margin-right: 14px !important;
    margin-left: 14px !important;
    padding: 0 18px !important;
    gap: 18px !important;
  }
body > header .nav-logo-img,
  [data-site-header] > header .nav-logo-img{
    width: 180px !important;
  }
body > header .nav-right .lang-btn,
  [data-site-header] > header .nav-right .lang-btn{
    display: none !important;
  }
body > header .nav-right .btn,
  [data-site-header] > header .nav-right .btn{
    display: inline-flex !important;
    width: auto !important;
    min-width: 0 !important;
    height: auto !important;
    min-height: 0 !important;
    padding: 9px 15px !important;
    font-size: 13px !important;
    line-height: 1 !important;
  }
body > header .menu-toggle,
  [data-site-header] > header .menu-toggle{
    display: grid !important;
  }

}
@media (max-width: 560px) {
body > header > nav,
  [data-site-header] > header > nav{
    width: calc(100% - 20px) !important;
    height: 58px !important;
    min-height: 58px !important;
    margin-right: 10px !important;
    margin-left: 10px !important;
    padding: 0 10px 0 14px !important;
    gap: 8px !important;
    border-radius: 26px !important;
  }
body > header .logo,
  [data-site-header] > header .logo{
    width: 160px !important;
    min-width: 0 !important;
    flex: 0 1 auto !important;
  }
body > header .nav-logo-img,
  [data-site-header] > header .nav-logo-img{
    width: 160px !important;
    max-width: 100% !important;
    max-height: 38px !important;
  }
body > header .nav-right,
  [data-site-header] > header .nav-right{
    gap: 14px !important;
  }
body > header .menu-toggle,
  [data-site-header] > header .menu-toggle{
    width: 38px !important;
    height: 38px !important;
    border-radius: 10px !important;
  }

}
@media (max-width: 390px) {
body > header .nav-right,
  [data-site-header] > header .nav-right{
    gap: 6px !important;
  }
body > header .nav-right .btn,
  [data-site-header] > header .nav-right .btn{
    padding: 8px 9px !important;
    font-size: 12.5px !important;
  }

}
/* Desktop header secondary actions turn primary blue only on interaction. */
header .nav-right .lang-btn,
header .nav-right .btn-ghost{
  transition: color .2s ease, background .2s ease, border-color .2s ease, box-shadow .2s ease, transform .2s ease;
}
/* Use a familiar translation mark instead of the globe glyph. */
header .nav-right .lang-btn{
  position: relative;
}
header .nav-right .lang-btn svg{
  display: none;
}
header .nav-right .lang-btn::before,
header .nav-right .lang-btn::after{
  position: absolute;
  font-family: Arial, "Microsoft YaHei", "PingFang SC", sans-serif;
  font-weight: 700;
  line-height: 1;
  color: currentColor;
  pointer-events: none;
  transition: transform .28s cubic-bezier(.2, .8, .2, 1), opacity .28s ease;
}
header .nav-right .lang-btn::before{
  content: "文";
  top: 9px;
  left: 8px;
  font-size: 16px;
  opacity: 1;
  transform: scale(1);
  transform-origin: center;
}
header .nav-right .lang-btn::after{
  content: "A";
  right: 7px;
  bottom: 7px;
  font-size: 15px;
  opacity: .72;
  transform: scale(.92);
  transform-origin: center;
}
header .nav-right .lang-btn.is-english::before{
  opacity: .58;
  transform: scale(.72);
}
header .nav-right .lang-btn.is-english::after{
  opacity: 1;
  transform: scale(1.12);
}
header .nav-right .lang-btn:hover,
header .nav-right .lang-btn:focus-visible,
header .nav-right .btn-ghost:hover,
header .nav-right .btn-ghost:focus-visible{
  color: #fff;
  border-color: transparent;
  background: linear-gradient(180deg, #39a7ff, #1688f8);
  box-shadow: 0 8px 30px rgba(22, 136, 248, .42);
  transform: translateY(-1px);
}
/* Shared mobile language switcher */
@media (max-width: 900px) {
.mobile-menu-panel .mobile-menu-meta{
    margin-top: 18px;
    padding-top: 18px;
  }
.mobile-menu-panel .mobile-language-row{
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 18px;
  }
.mobile-menu-panel .mobile-language-row > h4{
    flex: 0 0 auto;
    margin: 0;
    color: #dbe6f7;
    font-family: "Microsoft YaHei", "PingFang SC", "Source Han Sans SC", sans-serif;
    font-size: 18px;
    line-height: 1.25;
    letter-spacing: 0;
    text-transform: none;
    white-space: nowrap;
  }
.mobile-menu-panel .mobile-language-switch{
    width: min(196px, 62%);
    min-width: 164px;
    padding: 4px;
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 4px;
    border: 1px solid rgba(139, 184, 238, .2);
    border-radius: 14px;
    background: rgba(255, 255, 255, .045);
    box-shadow: inset 0 1px 0 rgba(255, 255, 255, .04);
  }
.mobile-menu-panel .mobile-language-row .mobile-language-switch__option{
    width: auto;
    min-height: 40px;
    padding: 0 12px;
    display: flex;
    align-items: center;
    justify-content: center;
    border: 1px solid transparent;
    border-radius: 10px;
    background: transparent;
    color: #8e9bb0;
    font-family: "Microsoft YaHei", "PingFang SC", "Source Han Sans SC", sans-serif;
    font-size: 14px;
    font-weight: 500;
    line-height: 1;
    letter-spacing: 0;
    text-align: center;
    cursor: pointer;
    transition: color .18s ease, background .18s ease, border-color .18s ease, box-shadow .18s ease;
  }
.mobile-menu-panel .mobile-language-row .mobile-language-switch__option:hover{
    color: #dceaff;
    background: rgba(255, 255, 255, .06);
  }
.mobile-menu-panel .mobile-language-row .mobile-language-switch__option.is-active{
    border-color: rgba(90, 184, 255, .58);
    color: #fff;
    background: linear-gradient(180deg, rgba(44, 157, 255, .96), rgba(18, 119, 232, .96));
    box-shadow: 0 6px 18px rgba(15, 112, 224, .28), inset 0 1px 0 rgba(255, 255, 255, .25);
  }
.mobile-menu-panel .mobile-language-row .mobile-language-switch__option:focus-visible{
    outline: 2px solid #66baff;
    outline-offset: 2px;
  }

}
@media (max-width: 360px) {
.mobile-menu-panel .mobile-language-row{
    display: block;
  }
.mobile-menu-panel .mobile-language-row > h4{
    margin-bottom: 10px;
  }
.mobile-menu-panel .mobile-language-switch{
    width: 100%;
    min-width: 0;
  }

}