:root {
  color: #17243d;
  font-family: -apple-system, BlinkMacSystemFont, "PingFang SC", "Microsoft YaHei", sans-serif;
  background: #fff;
}
body { margin: 0; font-size: 16px !important; }
#app.product-guide { min-width: 0; max-width: none; text-align: left; }
#app .badge .badge_icon, #app .platform_certified .badge_icon { width: 21px; height: 21px; }
#app .m-wrapper > .container { height: auto !important; }
#app .badge {
  display: flex; align-items: center; justify-content: center; gap: 9px;
  padding: 10px 16px; color: #345d9e; background: #e9f3ff; font-size: 13px;
}
#app .first-screen { background: linear-gradient(180deg, #f2f8ff 0%, #fff 100%); }
#app .header {
  display: flex; align-items: center; justify-content: space-between; gap: 20px;
  max-width: 1160px; min-height: 76px; padding: 0 28px; margin: 0 auto;
}
#app .header .logo { color: #2d65c7; font-size: 25px; white-space: nowrap; }
#app .logo img { width: 120px; max-height: 58px; object-fit: contain; }
#app .links_box { display: flex; flex-wrap: wrap; align-items: center; justify-content: flex-end; gap: 22px; }
#app .header a { color: #223454; }
#app .header .login_account { padding: 8px 13px; border: 1px solid #d0e0f3; border-radius: 8px; }
#app .header .btn-more, #app .header .btn-close { display: none; }
#app .first-screen .main {
  box-sizing: border-box; display: grid; grid-template-columns: minmax(0, .87fr) minmax(0, 1.13fr);
  grid-template-rows: 1fr auto auto 1fr; align-items: center; column-gap: 28px;
  max-width: 1160px; min-height: 545px; padding: 35px 28px; margin: 0 auto;
}
#app .slogon {
  align-self: end; margin: 0; color: #142951; font-size: clamp(34px, 4.15vw, 66px);
  font-weight: 750; letter-spacing: -.045em; line-height: 1.15;
}
#app .platform_certified { display: flex; align-items: center; gap: 8px; margin: 17px 0; color: #4567a0; font-size: 14px; }
#app .desc { display: flex; flex-wrap: wrap; align-self: start; gap: 16px; margin: 12px 0 0; padding: 0; list-style: none; color: #385278; }
#app .desc li { white-space: nowrap; }
#app .desc li strong { color: #2864c5; font-size: 1.6em; }
#app .first-screen .right { grid-column: 2; grid-row: 1 / -1; }
#app .appshow > svg { display: block; width: 100%; height: auto; overflow: visible; }
#app .intro-wrapper { max-width: 1080px; padding: 18px 28px 60px; margin: 0 auto; }
#app .intro-item {
  display: flex; flex-wrap: wrap; align-items: center; gap: 34px;
  padding: 45px 24px; border-bottom: 1px solid #e9eef5;
}
#app .intro-item:nth-child(even) { background: #f9fbff; }
#app .intro-item .desc-text { flex: 1 1 350px; }
#app .intro-item h2 { margin: 0 0 15px; font-size: clamp(25px, 3vw, 41px); color: #172f58; }
#app .intro-item p { margin: 0; font-size: 16px; line-height: 1.85; color: #50617b; }
#app .intro-item img { width: min(42%, 345px); height: auto; }
#app .intro-item a { color: #2e65c7; text-decoration: underline; }
#app footer { padding: 38px 24px 24px; background: #f5f8fc; }
#app footer .content { display: grid; grid-template-columns: 1.4fr 1fr 1fr; gap: 22px; max-width: 1080px; margin: 0 auto; }
#app footer h3 { margin: 0 0 12px; font-size: 16px; }
#app footer a { display: inline-block; margin: 0 12px 8px 0; color: #4f6380; }
#app footer .bottom { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 12px; max-width: 1080px; padding-top: 18px; margin: 18px auto 0; border-top: 1px solid #e2eaf4; }
#app footer .contact img { width: 18px; height: 18px; vertical-align: middle; }
#app footer select { padding: 6px 10px; background: #fff; border: 1px solid #dce4ee; border-radius: 5px; }
#app .blog_item, #app .blog_item_small, #app .help-container, #app .markdown-body, #app .dropdown-container, #app .lg-pagination { display: block; max-width: 970px; margin: 22px auto; padding: 0 25px; }
#app .blog_item, #app .blog_item_small { display: flex; align-items: center; gap: 20px; padding: 16px 25px; border-bottom: 1px solid #e6eaf1; color: inherit; }
#app .blog_item .poster, #app .blog_item_small .poster { display: block; width: min(29vw, 225px); max-height: 145px; object-fit: cover; border-radius: 7px; }
#app .item_img { flex-shrink: 0; }
#app .new_tip img, #app .likes img, #app .lg-pagination img { max-width: 18px; vertical-align: middle; }
#app .blog_item .title, #app .blog_item_small .title { margin: 0 0 7px; font-weight: 700; font-size: 21px; }
#app .date, #app .desc, #app .keywords { color: #596f8f; }
#app .markdown-body { line-height: 1.7; }
#app .markdown-body p { margin: .8em 0; }
#app .markdown-body img { max-width: 100%; height: auto; }
#app .help-container img { max-width: 100%; }
#app .help-container .logo img { width: auto; height: 42px; }
#app .help-container .item_btn_icon, #app .help-container .item_icon_btn img, #app .help-container .down_icon img { width: 20px; }
#app .help-container .con_item, #app .help-container .item_con { margin: 0 0 14px; padding: 12px 17px; background: #f5f8fd; }
#app [aria-disabled="true"] { cursor: default; }
@media (max-width: 720px) {
  #app .header { padding: 0 16px; }
  #app .links_box { gap: 6px 12px; font-size: 12px; }
  #app .header .logo { font-size: 20px; }
  #app .first-screen .main { display: block; min-height: 0; padding: 28px 20px; }
  #app .first-screen .right { margin-top: 25px; }
  #app .intro-wrapper { padding: 12px 16px 34px; }
  #app .intro-item { padding: 25px 12px; }
  #app .intro-item img { width: min(100%, 345px); }
  #app footer .content { grid-template-columns: 1fr; gap: 14px; }
}
#app .first-screen { background: linear-gradient(315deg, #eb4eb1, #9257f9 50.46%, #3150ed); }
#app .first-screen .header a, #app .first-screen .slogon,
#app .first-screen .platform_certified, #app .first-screen .desc,
#app .first-screen .desc li strong { color: #fff; }
#app .first-screen .header .login_account { border-color: #ffffff80; }
#app .first-screen .main { overflow: hidden; }
#app .first-screen .appshow > svg { overflow: hidden; }
#app .first-screen .appshow .ellip { display: none; }
#app .intro-item h2 { color: #333; font-weight: 400; }
#app footer .down-platform a { white-space: nowrap; }
#app footer i[class^="icon-"] { display: none; }
#app footer i[class^="icon-"] { display: inline; margin-right: .32em; }

.release-sr { position: absolute; width: 1px; height: 1px; overflow: hidden; clip-path: inset(50%); white-space: nowrap; }
