/* ============================================================
 *  下载落地页 样式
 *  设计目标：还原设计图；自适应移动端与电脑端；
 *  电脑端访问时以手机 H5 样式居中显示；兼容各种浏览器。
 * ============================================================ */

/* ---------- 基础重置 ---------- */
* {
  margin: 0;
  padding: 0;
  box-sizing: border-box;
  -webkit-tap-highlight-color: transparent; /* 去除移动端点击高亮 */
}

html, body {
  width: 100%;
  height: 100%;
}

body {
  font-family: -apple-system, BlinkMacSystemFont, "Helvetica Neue",
               "PingFang SC", "Hiragino Sans GB", "Microsoft YaHei", sans-serif;
  color: #333;
  /* 统一白色背景，电脑端也是全屏白底（不再用灰底衬托手机卡片） */
  background: #ffffff;
  display: -webkit-box;
  display: -webkit-flex;
  display: flex;
  -webkit-box-pack: center;
  -webkit-justify-content: center;
  justify-content: center;
  -webkit-box-align: start;
  -webkit-align-items: flex-start;
  align-items: flex-start;      /* 内容从顶部开始，正常文档流 */
  min-height: 100%;
}

/* ---------- 内容容器：占满全屏白底，内容居中列显示（电脑/移动端一致） ---------- */
.phone-frame {
  width: 100%;
  max-width: 480px;              /* 内容最大宽度，居中显示 */
  min-height: 100vh;
  background: #ffffff;
  margin: 0 auto;               /* 水平居中 */
  position: relative;
}

/* ---------- 内容区 ---------- */
.page {
  padding: 110px 65px 40px;
  text-align: center;
}

/* ---------- App 图标 ---------- */
.app-icon-wrap {
  position: relative;
  display: inline-block;
  margin-bottom: 5px;
}
.app-icon {
  width: 100px;
  height: 100px;
  border-radius: 15px;
  display: block;
  object-fit: cover;
}
.official-tag {
  position: absolute;
  top: -6px;
  right: -14px;
  background: #2b7fff;
  color: #fff;
  font-size: 13px;
  line-height: 1;
  padding: 5px 9px;
  border-radius: 6px;
  white-space: nowrap;
}
.official-tag:empty {           /* 未配置文字时隐藏 */
  display: none;
}

/* ---------- 运营者 ---------- */
.operator-top {
  font-size: 15px;
  color: #9298a2;         /* 设计图：中灰色，常规字重 */
  font-weight: 400;
  margin-bottom: 15px;
}

/* ---------- 评分 / 下载量 / 大小 ---------- */
.stats {
  display: -webkit-box;
  display: -webkit-flex;
  display: flex;
  -webkit-box-pack: center;
  -webkit-justify-content: center;
  justify-content: center;
  -webkit-flex-wrap: wrap;
  flex-wrap: wrap;
  color: #424141;         /* 设计图：接近黑色 */
  font-size: 14px;
  font-weight: 500;       /* 设计图：加粗 */
  margin-bottom: 46px;
}
.stats .stat-item {
  padding: 0 6px;
}

/* ---------- 下载按钮 ---------- */
.download-btn {
  display: block;
  width: 100%;
  background: #1d82ff;      /* 设计图：饱和蓝 */
  color: #fff;
  font-size: 17px;
  font-weight: 500;         /* 设计图：中等字重 */
  text-align: center;
  text-decoration: none;
  padding: 15px 0 15px;          /* 设计图：按钮较高 */
  border-radius: 10px;
  letter-spacing: 6px;
  cursor: pointer;
  -webkit-transition: opacity .15s;
  transition: opacity .15s;
}
.download-btn:active {
  opacity: .85;
}

/* ---------- 安全提示 ---------- */
.safe-tip {
  color: #0ab2ce;          /* 设计图：蓝色提示（此前误设为红色） */
  font-size: 12px;
  margin-top: 35px;
  font-weight: 400;
}

/* ---------- 特性图标 ---------- */
.features {
  display: -webkit-box;
  display: -webkit-flex;
  display: flex;
  -webkit-box-pack: center;
  -webkit-justify-content: center;
  justify-content: center;
  margin-top: 7px;
}
.features .feature-item {
  display: -webkit-box;
  display: -webkit-flex;
  display: flex;
  -webkit-box-align: center;
  -webkit-align-items: center;
  align-items: center;
  color: #9aa0a8;
  font-size: 12px;
  margin: 0 16px;
  font-weight: 500;
}
.features .feature-icon {
  width: 19px;
  height: 19px;
  margin-right: 5px;      /* 图标与文案拉开间距，不紧挨在一起 */
  color: #06a1ba;          /* 图标为蓝色描边；文案仍是灰色 */
  vertical-align: middle;
  /* 注意：不要在此设置 fill，以免覆盖 SVG 内联的 fill="none" 描边样式 */
}

/* ---------- 底部 ---------- */
.footer {
  margin-top: 100px;
}
.footer-lines {
  color: #9298a2;
  font-size: 12px;
  line-height: 1.9;
  font-weight: 500;
}
.footer-links {
  margin-top: 24px;
  color: #2b7fff;         /* 与安全提示/官方角标蓝色保持一致 */
  font-size: 13px;
}
.footer-links a {
  color: #06a1ba;
  text-decoration: none;
  padding: 0 10px;
  font-weight: 500;
}
.footer-links .sep {
  color: #d4d8de;
}

/* ---------- 应用宝技术说明 ---------- */
.tencent {
  margin-top: 26px;
}
.tencent-brand {
  display: -webkit-box;
  display: -webkit-flex;
  display: flex;
  -webkit-box-pack: center;
  -webkit-justify-content: center;
  justify-content: center;
  -webkit-box-align: center;
  -webkit-align-items: center;
  align-items: center;
}
.tencent-logo {
  width: 35px;
  height: 35px;
  margin-right: 0px;
}
.tencent-text {
  font-size: 13px;
  color: #39393a;        /* 设计图：中灰色 */
  font-weight: 400;      /* 设计图：常规字重 */
  /* 设计图：字体向右倾斜。中文字体多无真斜体字形，用 skewX 变换保证各浏览器都倾斜 */
  display: inline-block;
  -webkit-transform: skewX(-10deg);
  -ms-transform: skewX(-10deg);
  transform: skewX(-10deg);
  font-weight: 800;
}
.tencent-desc {
  color: #9298a2;
  font-size: 10px;
  margin-top: -3px;
  font-weight: 500;
}

/* ---------- 超小屏幕微调 ---------- */
@media (max-width: 360px) {
  .page { padding: 100px 65px 30px; }
  .app-icon { width: 112px; height: 112px; }
  .download-btn { font-size: 20px; }
}