/* ==========================================================================
   dpTeam 官网（dpteam.cn）—— 亮色商业化主页 + 浅色版本日志页
   --------------------------------------------------------------------------
   · 零第三方依赖：全部手写 CSS；动效背景 = CSS 彩色光柱渐变 + Canvas 光晕
   · 视觉基调：QQ 式一屏极简，背景为明亮蓝→紫→粉→琥珀光柱，底部渐白
   · 彩色口径：背景光柱为主；CTA 按钮统一用同源品牌渐变 --cta-grad（首尾同色可无缝流动）
   · prefers-reduced-motion / 移动端自动降级
   ========================================================================== */

:root {
  /* 彩色口径：背景光柱为主；CTA 按钮统一用同源「品牌渐变」，其余控件保持中性 */
  --accent: #1b2130;
  --accent-ink: #0e1119;
  --accent-soft: #f3f4f7;
  --accent-line: #d5d9e2;

  /* 品牌渐变（所有 CTA 按钮统一色）：取自首页背景光柱中段（蓝紫→品红→珊瑚→橙）。
     首尾同色 + background-size 200%，横向流动动画才能无缝循环不跳变 */
  --cta-grad: linear-gradient(100deg,
    #6254e6 0%, #b04ad6 24%, #ef5f84 46%, #f78a4d 62%,
    #ef5f84 78%, #b04ad6 88%, #6254e6 100%);

  /* 深色文字（用在底部渐白区域 / 浅色页） */
  --ink: #1b2130;
  --ink-2: #3d4557;
  --ink-3: #6b7280;

  /* 浅色页（版本日志 / 弹层表单） */
  --lite-bg: #f7f7f8;
  --lite-card: #ffffff;
  --lite-line: #e7e9f0;
  --lite-line-2: #d8dce8;
  --lite-dim: #6b7280;

  /* 字体 */
  --font: "PingFang SC", "HarmonyOS Sans SC", "Microsoft YaHei", system-ui, -apple-system, "Segoe UI", sans-serif;
}

* { box-sizing: border-box; margin: 0; padding: 0; }

html, body { height: 100%; }

body {
  font-family: var(--font);
  min-height: 100svh;
  -webkit-font-smoothing: antialiased;
  overflow-x: hidden;
}

/* ==================== 动效背景（彩色光柱 + 底部渐白） ==================== */

body.home {
  display: flex;
  flex-direction: column;
  color: #fff;
  background: #2b50d8;
}

.bg { position: fixed; inset: 0; z-index: 0; overflow: hidden; background: #2b50d8; }

/* 彩色光柱：宽幅彩虹底 + 两层柔边白色竖条纹 */
.bg-stripes {
  position: absolute;
  inset: -8% -6%;
  background:
    repeating-linear-gradient(90deg,
      rgba(255, 255, 255, 0.16) 0px, rgba(255, 255, 255, 0.16) 7px,
      rgba(255, 255, 255, 0) 44px, rgba(255, 255, 255, 0) 74px),
    repeating-linear-gradient(90deg,
      rgba(255, 255, 255, 0.10) 0px, rgba(255, 255, 255, 0) 20px,
      rgba(255, 255, 255, 0) 128px),
    linear-gradient(90deg,
      #12279b 0%, #2154e6 10%, #3f7bf0 19%, #6a79f0 29%, #9a63ea 39%,
      #c656dd 49%, #ea5fa8 58%, #fb8080 67%, #ffa063 75%, #ffc06a 83%,
      #ffd89a 91%, #ffe9c9 100%);
  animation: bgDrift 38s ease-in-out infinite alternate;
  will-change: transform;
}

@keyframes bgDrift {
  from { transform: translate3d(-1.6%, 0, 0) scale(1.03); }
  to { transform: translate3d(1.6%, 0, 0) scale(1.05); }
}

/* 上中部提亮 + 底部渐白（下半部分转为浅色，供深色文字与白色卡片使用） */
.bg-wash {
  position: absolute;
  inset: 0;
  background:
    radial-gradient(56% 40% at 50% 38%, rgba(255, 255, 255, 0.20), rgba(255, 255, 255, 0) 74%),
    linear-gradient(to bottom,
      rgba(255, 255, 255, 0) 50%,
      rgba(255, 255, 255, 0.20) 64%,
      rgba(255, 255, 255, 0.55) 78%,
      rgba(255, 255, 255, 0.80) 90%,
      rgba(255, 255, 255, 0.86) 100%);
}

/* Canvas 光晕层 */
#fx {
  position: fixed;
  inset: 0;
  width: 100%;
  height: 100%;
  z-index: 1;
  pointer-events: none;
}

/* ==================== 顶栏：品牌 + 右上角入口 ==================== */

.nav {
  position: fixed;
  top: 0;
  left: 0;
  right: 0;
  z-index: 40;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 16px;
  padding: 16px clamp(18px, 5vw, 56px);
}

.brand {
  display: inline-flex;
  align-items: center;
  gap: 10px;
  text-decoration: none;
  color: #fff;
}

.brand-logo {
  display: block;
  width: auto;
  height: 34px;
  /* 苹果式圆角方块（约 22.5%），随尺寸等比缩放 */
  border-radius: 23%;
  filter: drop-shadow(0 6px 16px rgba(20, 24, 70, 0.42));
}

.brand-text {
  font-size: 19px;
  font-weight: 700;
  letter-spacing: 0.02em;
  text-shadow: 0 2px 14px rgba(26, 30, 88, 0.35);
}

/* 右上角入口：QQ 式纯文字，不带按钮底；悬停时下横线从中心向两侧滑出 */
.nav-links {
  display: flex;
  align-items: center;
  gap: 26px;
}

.nav-link {
  position: relative;
  display: inline-block;
  background: none;
  border: none;
  color: rgba(255, 255, 255, 0.92);
  font: inherit;
  font-size: 14px;
  font-weight: 500;
  letter-spacing: 0.01em;
  padding: 6px 2px;
  text-decoration: none;
  cursor: pointer;
  text-shadow: 0 1px 12px rgba(26, 30, 88, 0.32);
  transition: color 0.2s ease;
}

/* 动画下横线：默认收在中心（宽度 0），悬停向两侧展开 */
.nav-link::after {
  content: "";
  position: absolute;
  left: 50%;
  right: 50%;
  bottom: 0;
  height: 2px;
  border-radius: 2px;
  background: #fff;
  transition: left 0.24s cubic-bezier(0.2, 0.7, 0.2, 1), right 0.24s cubic-bezier(0.2, 0.7, 0.2, 1);
}

.nav-link:hover { color: #fff; }

.nav-link:hover::after {
  left: 0;
  right: 0;
}

/* ==================== 按钮体系（一律浅色） ==================== */

.btn {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 8px;
  padding: 11px 22px;
  border-radius: 999px;
  font-size: 14.5px;
  font-weight: 600;
  text-decoration: none;
  border: 1px solid var(--lite-line-2);
  background: #fff;
  color: var(--ink);
  cursor: pointer;
  transition: transform 0.2s ease, box-shadow 0.2s ease, border-color 0.2s ease, color 0.2s ease, background 0.2s ease;
}

.btn:hover {
  transform: translateY(-1px);
  border-color: var(--accent-line);
  color: var(--accent-ink);
  box-shadow: 0 12px 26px -16px rgba(20, 24, 60, 0.55);
}

/* 主行动按钮（表单提交等）：品牌渐变，与各下载按钮同一套 */
.btn-primary {
  background-image: var(--cta-grad);
  background-size: 200% 100%;
  border-color: transparent;
  color: #fff;
  text-shadow: 0 1px 2px rgba(60, 20, 70, 0.25);
  animation: ctaFlow 9s linear infinite;
}

.btn-primary:hover {
  border-color: transparent;
  color: #fff;
  transform: translateY(-1px);
  box-shadow: 0 14px 28px -14px rgba(176, 74, 214, 0.6);
}

.btn-primary:disabled {
  opacity: 0.6;
  cursor: default;
  transform: none;
  box-shadow: none;
}

.btn-block { width: 100%; }

.link-plain {
  background: none;
  border: none;
  font: inherit;
  font-size: 12.5px;
  color: inherit;
  cursor: pointer;
  padding: 0;
}

/* 主下载按钮：白色胶囊（QQ 同构）+ 呼吸光晕——首页唯一保留的白底按钮，
   与页内其它渐变按钮区分：这里是「一屏一个主 CTA」，不抢背景的彩色 */
.btn-main {
  position: relative;
  margin-top: 40px;
  display: inline-flex;
  align-items: center;
  gap: 11px;
  padding: 16px 40px;
  border-radius: 999px;
  font-size: 17px;
  font-weight: 600;
  letter-spacing: 0.01em;
  color: #16181d;
  text-decoration: none;
  background: #fff;
  box-shadow: 0 10px 30px -8px rgba(24, 28, 80, 0.42), 0 2px 6px rgba(24, 28, 80, 0.12);
  transition: transform 0.22s ease, box-shadow 0.22s ease;
  animation: ctaBreath 3.8s ease-in-out infinite;
}

.btn-main:hover {
  transform: translateY(-2px);
  box-shadow: 0 18px 44px -10px rgba(24, 28, 80, 0.5), 0 3px 10px rgba(24, 28, 80, 0.16);
}

.btn-main .dl-ico { flex: none; }

/* 呼吸光晕：白胶囊外围一圈白光，缓慢涨落 */
@keyframes ctaBreath {
  0%, 100% { box-shadow: 0 10px 30px -8px rgba(24, 28, 80, 0.42), 0 0 0 0 rgba(255, 255, 255, 0.5); }
  50%      { box-shadow: 0 13px 36px -8px rgba(24, 28, 80, 0.48), 0 0 0 11px rgba(255, 255, 255, 0.16); }
}

/* 渐变流动：位移正好一个渐变周期（首尾同色），循环无缝 */
@keyframes ctaFlow {
  from { background-position: 0% 50%; }
  to   { background-position: 200% 50%; }
}

/* ==================== 首屏 ==================== */

.hero {
  position: relative;
  z-index: 10;
  flex: 1;
  display: flex;
  flex-direction: column;
  align-items: center;
  padding: 96px clamp(20px, 5vw, 60px) 0;
}

.hero-mid {
  flex: 1;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  text-align: center;
  padding-bottom: 18px;
}

.title {
  font-size: clamp(26px, 4.2vw, 46px);
  font-weight: 700;
  line-height: 1.2;
  letter-spacing: 0.02em;
  color: #fff;
  text-shadow: 0 4px 28px rgba(24, 22, 78, 0.34);
}

.title .w {
  display: inline-block;
  opacity: 0;
  transform: translateY(20px);
  animation: word-in 0.75s cubic-bezier(0.2, 0.7, 0.2, 1) forwards;
}

.title .w:nth-child(1) { animation-delay: 0.1s; }
.title .w:nth-child(2) { animation-delay: 0.24s; }

@keyframes word-in {
  to { opacity: 1; transform: translateY(0); }
}

/* 版本号：落在浅色渐变段也能读清，做成浅色玻璃胶囊 */
.ver-line {
  margin-top: 14px;
  display: inline-flex;
  align-items: center;
  gap: 6px;
  padding: 5px 15px;
  border-radius: 999px;
  font-size: 13px;
  letter-spacing: 0.02em;
  color: #3f4557;
  background: rgba(255, 255, 255, 0.62);
  border: 1px solid rgba(255, 255, 255, 0.8);
  backdrop-filter: blur(6px);
  -webkit-backdrop-filter: blur(6px);
  box-shadow: 0 8px 20px -14px rgba(20, 24, 60, 0.55);
}

/* display:inline-flex 会盖掉 UA 的 [hidden]，这里显式兜回 */
.ver-line[hidden] { display: none; }

.ver-line a {
  color: var(--accent-ink);
  text-decoration: none;
  margin-left: 2px;
}

.ver-line a:hover { text-decoration: underline; }

/* 平台入口（放大口径，与 QQ 底部图标行同构） */
.platforms {
  display: flex;
  align-items: flex-start;
  justify-content: center;
  gap: clamp(30px, 7vw, 88px);
  padding: 10px 0 36px;
  opacity: 0;
  animation: fade-up 0.8s ease 0.4s forwards;
}

.pf {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 12px;
  text-decoration: none;
  color: var(--ink-2);
}

/* 大圆形半透明底（微信式）：无白块、无描边、无投影 */
.pf-ico {
  width: 104px;
  height: 104px;
  border-radius: 50%;
  display: flex;
  align-items: center;
  justify-content: center;
  color: #1b2130;
  background: rgba(255, 255, 255, 0.30);
  border: none;
  box-shadow: none;
  backdrop-filter: blur(10px) saturate(115%);
  -webkit-backdrop-filter: blur(10px) saturate(115%);
  transition: transform 0.24s cubic-bezier(0.2, 0.7, 0.2, 1), background 0.24s ease;
}

.pf-ico svg { width: 40px; height: 40px; }

.pf:hover .pf-ico {
  transform: translateY(-4px);
  background: rgba(255, 255, 255, 0.46);
}

.pf-label {
  font-size: 13.5px;
  font-weight: 500;
  letter-spacing: 0.02em;
  transition: color 0.2s ease;
}

.pf:hover .pf-label { color: var(--ink); }

@keyframes fade-up {
  from { opacity: 0; transform: translateY(16px); }
  to { opacity: 1; transform: translateY(0); }
}

/* ==================== 页脚（版权 + 备案号） ==================== */

.footer {
  position: relative;
  z-index: 10;
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 6px;
  padding: 16px clamp(20px, 5vw, 60px) 22px;
  font-size: 12.5px;
  color: #5b6376;
  text-align: center;
}

.footer a {
  color: #5b6376;
  text-decoration: none;
  transition: color 0.2s ease;
}

.footer a:hover { color: var(--accent); }

.beian a:hover { text-decoration: underline; }

/* ==================== 反馈弹层（浅色卡片） ==================== */

.modal { position: fixed; inset: 0; z-index: 100; }

.modal[hidden] { display: none; }

.modal-mask {
  position: absolute;
  inset: 0;
  background: rgba(18, 22, 50, 0.42);
  backdrop-filter: blur(8px);
  -webkit-backdrop-filter: blur(8px);
}

.modal-card {
  position: absolute;
  left: 50%;
  top: 50%;
  transform: translate(-50%, -50%);
  width: min(440px, calc(100vw - 40px));
  max-height: calc(100svh - 48px);
  overflow: auto;
  border-radius: 22px;
  padding: 32px 30px 26px;
  background: #fff;
  border: 1px solid rgba(255, 255, 255, 0.7);
  box-shadow: 0 30px 80px -24px rgba(20, 24, 60, 0.5);
  animation: card-in 0.28s cubic-bezier(0.2, 0.7, 0.2, 1);
}

@keyframes card-in {
  from { opacity: 0; transform: translate(-50%, -47%) scale(0.96); }
  to { opacity: 1; transform: translate(-50%, -50%) scale(1); }
}

.modal-close {
  position: absolute;
  top: 14px;
  right: 14px;
  width: 34px;
  height: 34px;
  border-radius: 50%;
  border: none;
  background: #f2f3f7;
  color: #5b6376;
  font-size: 20px;
  line-height: 1;
  cursor: pointer;
  transition: background 0.2s ease, color 0.2s ease;
}

.modal-close:hover { background: #e8eaf1; color: var(--ink); }

#feedbackForm h2,
.fb-done h2 { font-size: 20px; font-weight: 700; letter-spacing: 0.02em; color: var(--ink); }

.fb-sub { margin: 8px 0 20px; font-size: 13.5px; color: var(--lite-dim); }

.fb-kind { display: flex; gap: 10px; margin-bottom: 18px; }

.fb-radio { flex: 1; cursor: pointer; }

.fb-radio input { position: absolute; opacity: 0; pointer-events: none; }

.fb-radio span {
  display: block;
  text-align: center;
  padding: 10px 0;
  border-radius: 12px;
  font-size: 14px;
  color: #4b5563;
  background: #f6f7fa;
  border: 1px solid #e6e8ef;
  transition: all 0.2s ease;
}

.fb-radio input:checked + span {
  color: var(--ink);
  background: var(--accent-soft);
  border-color: var(--accent-line);
  box-shadow: 0 0 0 3px rgba(20, 24, 60, 0.08);
}

.fb-radio input:focus-visible + span { outline: 2px solid rgba(20, 24, 60, 0.45); outline-offset: 2px; }

.fb-field { display: block; margin-bottom: 16px; }

.fb-field > span { display: block; font-size: 13px; color: #4b5563; margin-bottom: 8px; }

.fb-field > span i { font-style: normal; color: #9aa1ad; font-size: 12px; }

.fb-field textarea,
.fb-field input[type="text"] {
  width: 100%;
  border-radius: 12px;
  padding: 12px 14px;
  font: inherit;
  font-size: 14px;
  color: var(--ink);
  background: #f8f9fc;
  border: 1px solid #e3e6ef;
  outline: none;
  resize: vertical;
  transition: border-color 0.2s ease, box-shadow 0.2s ease, background 0.2s ease;
}

.fb-field textarea:focus,
.fb-field input[type="text"]:focus {
  background: #fff;
  border-color: var(--accent-line);
  box-shadow: 0 0 0 3px rgba(20, 24, 60, 0.1);
}

.fb-field textarea::placeholder,
.fb-field input::placeholder { color: #9aa1ad; }

.hp {
  position: absolute !important;
  left: -9999px !important;
  width: 1px;
  height: 1px;
  opacity: 0;
}

.fb-error {
  margin: 0 0 14px;
  padding: 10px 14px;
  border-radius: 10px;
  font-size: 13px;
  color: #b42318;
  background: #fef3f2;
  border: 1px solid #fecdca;
}

.fb-done { text-align: center; padding: 26px 0 14px; }

.fb-done p { margin-top: 10px; color: var(--lite-dim); font-size: 14px; }

/* ==================== 版本日志页（浅色；页头与下载页完全一致） ==================== */

body.rl-page {
  position: relative;
  display: flex;
  flex-direction: column;
  min-height: 100svh;
  background: #fff;
  color: var(--ink);
}

.rl-main {
  position: relative;
  z-index: 2;
  flex: 1;
  width: min(760px, calc(100% - 40px));
  margin: 0 auto;
  padding: 18px 0 56px;
}

/* 平台名（Windows 版本记录），页内标题；页头只有品牌 */
.rl-title {
  font-size: 22px;
  font-weight: 700;
  letter-spacing: 0.01em;
  margin-bottom: 6px;
}

.rl-empty { padding: 60px 0; text-align: center; color: var(--lite-dim); font-size: 14px; }

/* 版本条目：细线分隔的扁平行（不是卡片） */
.rl-item {
  padding: 26px 0;
  border-bottom: 1px solid var(--lite-line);
  animation: fade-up 0.4s ease both;
}

.rl-item:first-child { border-top: 1px solid var(--lite-line); }

.rl-item-head {
  display: flex;
  align-items: baseline;
  justify-content: space-between;
  gap: 14px;
  flex-wrap: wrap;
  margin-bottom: 12px;
}

.rl-ver { font-size: 19px; font-weight: 700; }

.rl-ver .new {
  display: inline-block;
  margin-left: 10px;
  vertical-align: 3px;
  font-size: 11px;
  font-weight: 600;
  color: var(--accent-ink);
  background: var(--accent-soft);
  border: 1px solid var(--accent-line);
  border-radius: 999px;
  padding: 1px 9px;
  letter-spacing: 0.05em;
}

.rl-date { font-size: 12.5px; color: var(--lite-dim); }

.rl-notes { margin: 0 0 16px; padding: 0; list-style: none; }

.rl-notes li {
  position: relative;
  padding-left: 18px;
  font-size: 14px;
  line-height: 1.9;
  color: #374151;
}

.rl-notes li::before {
  content: "";
  position: absolute;
  left: 2px;
  top: 0.78em;
  width: 5px;
  height: 5px;
  border-radius: 50%;
  background: #c9ced9;
}

.rl-meta {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 14px;
  flex-wrap: wrap;
}

.rl-size { font-size: 12.5px; color: var(--lite-dim); }

/* 历史版本：只留版本号/说明/文件信息，无下载入口，用极浅文字说明原因 */
.rl-nodl { font-size: 12.5px; color: #a9afbc; }

/* 版本下载入口：品牌渐变小按钮（仅最新版出现），颜色随动效缓慢流动 */
.rl-dl {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  padding: 8px 22px;
  border-radius: 999px;
  font-size: 13.5px;
  font-weight: 600;
  color: #fff;
  text-decoration: none;
  background-image: var(--cta-grad);
  background-size: 200% 100%;
  border: none;
  text-shadow: 0 1px 2px rgba(60, 20, 70, 0.25);
  animation: ctaFlow 9s linear infinite;
  transition: transform 0.2s ease, box-shadow 0.2s ease;
}

.rl-dl:hover {
  transform: translateY(-1px);
  box-shadow: 0 10px 24px -12px rgba(176, 74, 214, 0.6);
}

.rl-footer {
  position: relative;
  z-index: 2;
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 6px;
  padding: 16px 20px 22px;
  font-size: 12.5px;
  color: var(--lite-dim);
  text-align: center;
  border-top: 1px solid var(--lite-line);
}

.rl-footer a { color: var(--lite-dim); text-decoration: none; }
.rl-footer a:hover { color: var(--accent); text-decoration: underline; }

.rl-foot-links { display: flex; align-items: center; }

.rl-copy { color: #9aa1ad; }

/* ==================== 全站页头与页底纹理（首页之外的页面统一用这一套） ====================
   规则：所有页面顶部只放「logo + dpTeam」这一个元素，点它回首页。
   不做返回按钮 —— 这是网站，浏览器自带后退，页面上再放一个「返回主页」是噪音。
   ========================================================================== */

/* 与主页同源的竖向光柱，压低到近白（只留一层纹理与顶部色感，不抢内容） */
.page-bg {
  position: fixed;
  inset: 0;
  z-index: 0;
  pointer-events: none;
  background:
    linear-gradient(to bottom,
      rgba(255, 255, 255, 0.88) 0%,
      rgba(255, 255, 255, 0.92) 22%,
      #ffffff 50%,
      #ffffff 100%),
    repeating-linear-gradient(90deg,
      rgba(255, 255, 255, 0.55) 0px, rgba(255, 255, 255, 0.55) 7px,
      rgba(255, 255, 255, 0) 7px, rgba(255, 255, 255, 0) 68px),
    linear-gradient(90deg,
      #2154e6 0%, #6a79f0 24%, #c656dd 46%, #fb8080 66%,
      #ffc06a 84%, #ffe9c9 100%);
}

.site-top {
  position: relative;
  z-index: 2;
  padding: 18px clamp(20px, 5vw, 56px);
}

.site-brand {
  display: inline-flex;
  align-items: center;
  gap: 9px;
  color: var(--ink);
  text-decoration: none;
}

/* 与主页 .brand-logo 同一口径：苹果式圆角（约 22.5%），全站 logo 一个样子 */
.site-logo { display: block; width: auto; height: 30px; border-radius: 23%; }

.site-brand-text {
  font-size: 16px;
  font-weight: 700;
  letter-spacing: 0.02em;
}

/* ==================== 客户端下载页（每个平台独立一页；顶部极淡光柱，下部留白） ==================== */

body.dp-page {
  position: relative;
  display: flex;
  flex-direction: column;
  min-height: 100svh;
  background: #fff;
  color: var(--ink);
}

.dp-main {
  position: relative;
  z-index: 2;
  flex: 1;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  text-align: center;
  padding: 44px 20px 64px;
}

.dp-h1 {
  font-size: clamp(32px, 4.6vw, 46px);
  font-weight: 700;
  line-height: 1.18;
  letter-spacing: -0.01em;
}

.dp-tag {
  margin-top: 10px;
  font-size: 15px;
  color: var(--lite-dim);
  letter-spacing: 0.05em;
}

/* 本次更新：与按钮同宽的一列，左对齐小字 */
.dp-notes {
  width: min(420px, 100%);
  margin-top: 32px;
  text-align: left;
}

.dp-notes[hidden] { display: none; }

.dp-notes-title {
  font-size: 12.5px;
  font-weight: 600;
  color: var(--ink-2);
  letter-spacing: 0.06em;
}

.dp-notes-list { margin-top: 7px; list-style: none; }

.dp-notes-list li {
  position: relative;
  padding-left: 14px;
  font-size: 13px;
  line-height: 1.9;
  color: var(--lite-dim);
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}

.dp-notes-list li::before {
  content: "–";
  position: absolute;
  left: 0;
  color: var(--accent-line);
}

.dp-notes-more {
  display: inline-block;
  margin-top: 9px;
  font-size: 13px;
  font-weight: 500;
  color: var(--ink-2);
  text-decoration: none;
}

.dp-notes-more:hover { color: var(--ink); text-decoration: underline; }

/* 主下载按钮：品牌渐变胶囊 + 下载图标，渐变缓慢横向流动 */
.dp-btn {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 9px;
  margin-top: 26px;
  width: min(420px, 100%);
  padding: 15px 32px;
  border-radius: 999px;
  background-image: var(--cta-grad);
  background-size: 200% 100%;
  color: #fff;
  font-size: 16.5px;
  font-weight: 600;
  letter-spacing: 0.01em;
  text-decoration: none;
  text-shadow: 0 1px 2px rgba(60, 20, 70, 0.25);
  animation: ctaFlow 9s linear infinite;
  transition: transform 0.2s ease, box-shadow 0.2s ease;
}

.dp-btn:hover {
  color: #fff;
  transform: translateY(-1px);
  box-shadow: 0 14px 32px -12px rgba(176, 74, 214, 0.6);
}

.dp-btn[hidden] { display: none; }

.dp-btn-ico { flex: none; width: 19px; height: 19px; }

.dp-meta {
  margin-top: 14px;
  font-size: 13px;
  color: var(--lite-dim);
  letter-spacing: 0.01em;
  min-height: 1.4em;
}

.dp-file {
  margin-top: 5px;
  font-size: 12px;
  color: #9aa1ad;
  letter-spacing: 0.02em;
  word-break: break-all;
}

.dp-file[hidden] { display: none; }

.dp-links { margin-top: 22px; font-size: 13px; color: var(--lite-dim); }

.dp-links a { color: var(--ink-2); text-decoration: none; }

.dp-links a:hover { color: var(--ink); text-decoration: underline; }

.dp-sep { margin: 0 10px; color: var(--accent-line); }

.dp-foot {
  position: relative;
  z-index: 2;
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 9px;
  padding: 22px 20px 26px;
  border-top: 1px solid var(--lite-line);
  font-size: 12.5px;
  color: #9aa1ad;
}

.dp-foot-links { display: flex; align-items: center; }

.dp-foot a { color: var(--lite-dim); text-decoration: none; }
.dp-foot a:hover { color: var(--ink); }

/* ==================== 响应式 ==================== */

@media (max-width: 860px) {
  body.home { min-height: auto; }
  .platforms { gap: clamp(20px, 6vw, 44px); padding-bottom: 30px; }
  .pf-ico { width: 88px; height: 88px; }
  .pf-ico svg { width: 34px; height: 34px; }
}

@media (max-width: 560px) {
  .nav { padding: 14px 16px; gap: 10px; }
  .brand-logo { height: 30px; }
  .brand-text { font-size: 17px; }
  .nav-link { font-size: 13px; padding: 6px 2px; }
  .nav-links { gap: 16px; }
  .hero { padding-top: 82px; }
  .title { font-size: clamp(24px, 7vw, 30px); }
  .btn-main { margin-top: 30px; padding: 15px 30px; font-size: 16px; }
  .ver-line { font-size: 12.5px; }
  .platforms { gap: 20px; flex-wrap: wrap; }
  .pf-ico { width: 76px; height: 76px; }
  .pf-ico svg { width: 30px; height: 30px; }
  .pf-label { font-size: 12.5px; }
  .rl-main { width: min(640px, calc(100% - 32px)); }
  .rl-item { padding: 20px; }
  .dp-main { padding: 32px 18px 48px; }
  .dp-h1 { font-size: 32px; }
  .dp-notes { width: 100%; margin-top: 26px; }
  .dp-notes-list li { font-size: 12.5px; }
  .dp-btn { padding: 15px 20px; }
  .dp-foot { padding: 18px 16px 22px; }
  .dp-foot-links { font-size: 12px; }
}

/* ==================== 动效降级 ==================== */

@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after {
    animation-duration: 0.001s !important;
    animation-iteration-count: 1 !important;
    transition-duration: 0.001s !important;
  }

  .bg-stripes { animation: none; }
  .btn-main, .dp-btn, .rl-dl, .btn-primary { animation: none; }
  .title .w { opacity: 1; transform: none; animation: none; }
  .platforms { opacity: 1; animation: none; }
}