/*
 * 下载页专属样式（download.html 用）。
 * 只新增 .dl-* 类，公共四份样式（site.css / motion.css / sections-a.css / sections-b.css）一行没动。
 * 颜色全部取自 site.css 的变量，不另造颜色。
 */

/* ---------- 首屏 ---------- */
.dl-hero { padding-bottom: clamp(40px, 7vh, 72px); }

/* 圆形标识：圆环 + 字母 V，纯 CSS / 内联 SVG */
.dl-logo {
  width: clamp(126px, 14vw, 164px);
  height: clamp(126px, 14vw, 164px);
  margin: 0 auto clamp(24px, 4vh, 34px);
  display: grid;
  place-items: center;
  border-radius: 50%;
  background: radial-gradient(circle at 50% 36%, var(--accent-soft), rgba(79, 195, 247, 0.04) 58%, transparent 74%);
  box-shadow:
    0 0 0 1px var(--line),
    0 0 70px rgba(79, 195, 247, 0.26),
    inset 0 0 44px rgba(79, 195, 247, 0.1);
  animation: rise 1.1s var(--ease) both;
}
.dl-logo svg { width: 100%; height: 100%; display: block; overflow: visible; }
.dl-logo__ring { fill: none; stroke: rgba(79, 195, 247, 0.42); stroke-width: 1.2; }
.dl-logo__ring--dash {
  stroke: var(--accent);
  stroke-width: 2.4;
  stroke-linecap: round;
  stroke-dasharray: 92 60;
  transform-origin: 50% 50%;
  filter: drop-shadow(0 0 6px rgba(79, 195, 247, 0.7));
  animation: dl-spin 28s linear infinite;
}
.dl-logo__v {
  fill: #eaf7ff;
  font-family: var(--font);
  font-size: 76px;
  font-weight: 600;
  filter: drop-shadow(0 0 14px rgba(79, 195, 247, 0.6));
}
@keyframes dl-spin { to { transform: rotate(360deg); } }

/* 主按钮：比首页更大更抢眼 */
.dl-cta { margin-top: clamp(32px, 5vh, 44px); }
.dl-btn {
  gap: 12px;
  min-height: 68px;
  padding: 0 clamp(30px, 4vw, 52px);
  font-size: clamp(19px, 1.6vw, 21px);
  letter-spacing: 0.01em;
  box-shadow:
    0 16px 46px rgba(79, 195, 247, 0.28),
    inset 0 0 0 1px rgba(79, 195, 247, 0.35);
  transition: transform 0.2s var(--ease), background-color 0.2s ease, box-shadow 0.2s var(--ease);
}
.dl-btn svg { width: 22px; height: 22px; flex: none; }
.dl-btn:hover { transform: translateY(-1px); box-shadow: 0 22px 58px rgba(79, 195, 247, 0.36), inset 0 0 0 1px rgba(79, 195, 247, 0.5); }
.dl-btn:active { transform: scale(0.985); }

/* 次级链接：竖排、居中、青蓝、右端带 › */
.dl-sub {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 10px;
  margin-top: clamp(24px, 3.6vh, 32px);
}
.dl-sub a {
  display: inline-flex;
  align-items: center;
  gap: 5px;
  color: var(--accent);
  font-size: 16px;
  font-weight: 600;
}
.dl-sub a > span {
  font-size: 20px;
  line-height: 1;
  transform: translateY(-1px);
  transition: transform 0.2s var(--ease);
}
.dl-sub a:hover { color: #9adfff; }
.dl-sub a:hover > span { transform: translate(3px, -1px); }

/* ---------- 客户端界面预览 ---------- */
.dl-preview {
  max-width: var(--maxw);
  margin: clamp(52px, 8vh, 88px) auto 0;
  padding: 0 var(--gutter);
}
.dl-preview__eyebrow { text-align: center; margin-bottom: clamp(18px, 3vh, 26px); }

/* font-size 就是整张「截图」的缩放基准，里面的尺寸都用 em，窄屏改这一个值就整体缩小 */
.dl-window {
  font-size: 15px;
  border-radius: 20px;
  overflow: hidden;
  background: #0b1120;
  border: 1px solid var(--line);
  box-shadow: 0 50px 120px rgba(0, 0, 0, 0.6), 0 0 90px rgba(79, 195, 247, 0.08);
  text-align: left;
}
.dl-window__bar {
  display: flex;
  align-items: center;
  gap: 0.75em;
  height: 2.95em;
  padding: 0 1.1em;
  border-bottom: 1px solid var(--line);
  background: rgba(255, 255, 255, 0.03);
}
.dl-window__dots { display: flex; gap: 0.4em; flex: none; }
.dl-window__dots i { width: 0.72em; height: 0.72em; border-radius: 50%; background: rgba(255, 255, 255, 0.16); }
.dl-window__title { font-size: 0.87em; font-weight: 600; color: var(--ink-2); }
.dl-window__right { margin-left: auto; font-size: 0.8em; color: var(--ink-3); letter-spacing: 0.02em; white-space: nowrap; }
.dl-window__right span { color: var(--accent); margin-left: 0.2em; }
.dl-window__body {
  display: grid;
  grid-template-columns: 1.32fr 0.8fr;
  gap: 1.05em;
  padding: 1.3em;
  min-height: 17em;
}

/* 左边：对话气泡 */
.dl-chat { display: flex; flex-direction: column; gap: 0.72em; min-width: 0; }
.dl-msg {
  max-width: 92%;
  padding: 0.62em 0.88em;
  border-radius: 0.95em;
  font-size: 0.93em;
  line-height: 1.55;
  overflow-wrap: break-word;
  word-break: break-word;
}
.dl-msg--me {
  align-self: flex-end;
  background: #101826;
  border: 1px solid var(--line);
  color: #eaf2fb;
  border-bottom-right-radius: 0.35em;
}
.dl-msg--ai {
  align-self: flex-start;
  background: #f2f5fa;
  color: #16202e;
  border-bottom-left-radius: 0.35em;
}
.dl-msg .d-caret { height: 1em; background: #1a6f96; }
.dl-msg .d-type:empty::before { content: ""; }
.dl-composer {
  margin-top: auto;
  display: flex;
  align-items: center;
  gap: 0.6em;
  padding: 0.6em 0.85em;
  border-radius: 0.8em;
  border: 1px solid var(--line);
  background: rgba(255, 255, 255, 0.02);
  font-size: 0.82em;
  color: var(--ink-3);
}
.dl-composer__dot {
  margin-left: auto;
  width: 0.7em;
  height: 0.7em;
  border-radius: 50%;
  background: var(--accent);
  box-shadow: 0 0 10px rgba(79, 195, 247, 0.8);
}

/* 右边：手下任务列表 */
.dl-tasks {
  display: flex;
  flex-direction: column;
  gap: 0.52em;
  padding: 0.95em;
  border-radius: 0.78em;
  background: rgba(255, 255, 255, 0.02);
  border: 1px solid var(--line);
  min-width: 0;
}
.dl-tasks__head { display: flex; align-items: baseline; gap: 0.5em; margin-bottom: 0.15em; }
.dl-tasks__head > span:first-child { font-size: 0.9em; font-weight: 600; }
.dl-tasks__en { font-size: 0.7em; color: var(--ink-3); letter-spacing: 0.1em; }
.dl-task { display: flex; align-items: center; gap: 0.6em; font-size: 0.83em; color: var(--ink-2); min-width: 0; }
.dl-task > span:first-child { flex: none; }
.dl-task.is-active { color: var(--ink); }
.dl-ok { margin-left: auto; color: var(--accent); font-weight: 700; }
.dl-bar {
  margin-left: auto;
  flex: 1;
  min-width: 1.4em;
  height: 0.35em;
  border-radius: 999px;
  background: rgba(255, 255, 255, 0.1);
  overflow: hidden;
}
.dl-bar i {
  display: block;
  height: 100%;
  width: 62%;
  border-radius: 999px;
  background: var(--accent);
  box-shadow: 0 0 8px rgba(79, 195, 247, 0.7);
  animation: dl-fill 3.4s var(--ease) infinite alternate;
}
@keyframes dl-fill { from { width: 32%; } to { width: 92%; } }
.dl-tasks__foot { margin-top: auto; padding-top: 0.6em; font-size: 0.75em; color: var(--ink-3); }

/* ---------- 页脚 ---------- */
.dl-foot {
  max-width: var(--maxw);
  margin: clamp(52px, 8vh, 84px) auto 0;
  padding: 34px var(--gutter) 46px;
  border-top: 1px solid var(--line);
  text-align: center;
  color: var(--ink-3);
  font-size: 13px;
}

/* ---------- 窄屏 ---------- */
@media (max-width: 640px) {
  .dl-hero { padding-top: 100px; }
  .dl-hero h1 { font-size: clamp(25px, 7.6vw, 34px); line-height: 1.24; letter-spacing: -0.015em; }
  .dl-hero .lede { font-size: 16px; }
  .dl-hero .eyebrow { font-size: 14px; }

  .dl-cta { margin-top: 26px; }
  .dl-btn { width: 100%; min-height: 62px; padding: 0 18px; font-size: 19px; }
  .dl-btn svg { width: 20px; height: 20px; }

  .dl-sub a { font-size: 15px; }

  /* 界面预览整体按比例缩小：只调这一个字号，内部全是 em */
  .dl-window { font-size: 11.4px; border-radius: 14px; }
  .dl-window__body { padding: 1em; gap: 0.7em; min-height: 15em; grid-template-columns: 1.5fr 0.85fr; }
  .dl-msg { max-width: 100%; }
  .dl-tasks { padding: 0.8em; }
}

@media (max-width: 400px) {
  .dl-window { font-size: 10.2px; }
  .dl-tasks__foot { display: none; }
}

/* ---------- 减少动态效果 ---------- */
@media (prefers-reduced-motion: reduce) {
  .dl-logo { animation: none; }
  .dl-logo__ring--dash { animation: none; }
  .dl-bar i { animation: none; }
  .dl-btn { transition: none; }
  .dl-sub a > span { transition: none; }
}


/* 2026-10-23 验收微调：版本号太暗太小、次级链接偏小、预览框上方空白过大 */
.dl-hero .eyebrow {
  font-size: 17px;
  letter-spacing: 0.18em;
  font-weight: 700;
  color: var(--accent);
}
.dl-sub { gap: 16px; margin-top: clamp(28px, 4vh, 38px); }
.dl-sub a { font-size: 17.5px; }
.dl-sub a > span { font-size: 22px; }
.dl-preview { margin-top: clamp(34px, 5vh, 52px); }
@media (max-width: 640px) {
  .dl-hero .eyebrow { font-size: 15px; }
  .dl-sub a { font-size: 16px; }
}


/* 2026-10-23 主标题「只属于你的 AI」中英混排：英文收一点、字距压紧，与中文视觉重量对齐 */
h1 .nb, .hero h1 .nb { letter-spacing: -0.02em; }