:root {
  /* 简洁大气·白底护眼配色 */
  --bg: #ffffff;
  --bg-soft: #fafafa;
  --surface: #ffffff;
  --surface-2: #f4f4f2;
  --ink: #2b2b2d;
  --ink-soft: #6b6a66;
  --ink-faint: #a3a19a;
  --line: #ececea;
  --brand: #e8722b;        /* 胡萝卜橙（沿用用户手册主题，2A 全站统一） */
  --brand-soft: #fff1e6;
  --brand-ink: #c25e1e;
  --accent: #c8a98a;       /* 暖陶土 */
  --accent-soft: #f5efe9;
  --radius: 14px;
  --radius-sm: 10px;
  --shadow: 0 6px 24px rgba(40, 40, 36, 0.05);
  --shadow-hover: 0 12px 30px rgba(40, 40, 36, 0.10);
  --maxw: 1120px;
  --font: -apple-system, BlinkMacSystemFont, "Segoe UI", "PingFang SC",
    "Hiragino Sans GB", "Microsoft YaHei", "Helvetica Neue", Arial, sans-serif;
  /* 气泡专用：幼圆（圆润可爱） */
  --font-bubble: "幼圆", "YouYuan", "Comic Sans MS", "PingFang SC",
    "Microsoft YaHei", sans-serif;
}

* { box-sizing: border-box; }

html { scroll-behavior: smooth; }

body {
  margin: 0;
  font-family: var(--font);
  color: var(--ink);
  background: #efe5d0 fixed;
  line-height: 1.65;
  -webkit-font-smoothing: antialiased;
  overflow-x: hidden; /* 兜底：100vw 走马灯 break-out 不产生横向滚动条 */
}

a { color: inherit; text-decoration: none; }

img, video { max-width: 100%; display: block; }

.wrap {
  max-width: var(--maxw);
  margin: 0 auto;
  padding: 0 24px;
}

/* ---------- 顶部公告栏（走马灯） ---------- */
/* 放在导航栏之下、搜索栏之上，全站通用，由 JS 注入（data/announcements.json 驱动）
   取全部在期公告，横向无缝滚动（仿详情页姿态走马灯），滚动「作品集公告」 */
.announce-bar {
  background: transparent;
  color: var(--brand-ink);
  font-size: 13.5px;
  line-height: 1.5;
  overflow: hidden;
}
.announce-marquee .announce-track {
  display: flex;
  width: max-content;
  align-items: center;
  gap: var(--announce-gap, 120px);
  padding: 8px 0;
  animation: announceMarquee 32s linear infinite;
  will-change: transform;
}
.announce-marquee:hover .announce-track { animation-play-state: paused; }
.announce-item {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  white-space: nowrap;
  flex: 0 0 auto;
  text-decoration: none;
  color: var(--brand-ink);
  font-weight: 600;
  opacity: 0.92;
}
.announce-item:hover { opacity: 1; color: var(--brand); }
.announce-text {
  flex: 0 1 auto;
  text-align: left;
  min-width: 0;
}
.announce-cover {
  width: 30px;
  height: 30px;
  object-fit: contain;
  border-radius: 8px;
  background: rgba(0, 0, 0, 0.03);
  flex: 0 0 auto;
  -webkit-user-drag: none;
  user-drag: none;
  user-select: none;
  -webkit-user-select: none;
  pointer-events: none; /* 图片不接收拖拽/右键，链接仍可点进详情 */
}
@keyframes announceMarquee { from { transform: translateX(0); } to { transform: translateX(calc(-1 * var(--one-w, 600px))); } }

/* ---------- 语录接力走马灯（作品走马灯与搜索栏之间） ---------- */
/* 语录接力走马灯：一次只显示一条公共语录，一条向左消失时右侧接上下一条（详见 quoteScroll keyframes）。
   系统字体、不加粗；hover 暂停。 */
.quote-bar {
  overflow: hidden;
  text-align: center;
  background: transparent;
  min-height: 32px;
}
/* 双轨接力：两条语录都跑完整行程（100vw → -100vw），第二条错开半个周期
   （-0.65 = -0.15 - 0.5）。实现「一条走到左边将结束时，另一条已从右侧出现」，
   全程无空档，和作品走马灯一样源源不断。 */
.quote-marquee { position: relative; } /* 两条 .q 绝对定位的参照系 */
.quote-marquee .q {
  position: absolute;   /* 两条叠在同一原点，transform 错开才精确（inline-block 会互相挤位） */
  left: 0; top: 0; height: 100%;
  display: flex; align-items: center;  /* 垂直居中交给 flex，transform 只管 translateX */
  white-space: nowrap;
  font-size: 13px;
  font-family: system-ui, -apple-system, "Segoe UI", Roboto, "PingFang SC", "Microsoft YaHei", sans-serif;
  font-weight: 400;
  color: #1a1a1a;
  animation: quoteScroll var(--quote-dur, 22s) linear infinite;
  will-change: transform;
}
.quote-marquee .q:nth-of-type(1) { animation-delay: calc(var(--quote-dur, 22s) * -0.15); } /* 刷新即从右侧可见区起步，不等 */
.quote-marquee .q:nth-of-type(2) { animation-delay: calc(var(--quote-dur, 22s) * -0.65); } /* 错开半个周期做接力 */
.quote-marquee:hover .q { animation-play-state: paused; cursor: default; }
@keyframes quoteScroll {
  0%   { transform: translateX(100vw); opacity: 0; }   /* 右侧屏外，淡入开始进入 */
  8%   { opacity: 1; }
  92%  { opacity: 1; }
  100% { transform: translateX(-100vw); opacity: 0; } /* 左侧屏外，淡出；下一句右侧接力 */
}

/* footer 版权可点击跳隐私页 */
.footer-copy {
  color: var(--brand, #4a8f6d);
  text-decoration: none;
}
.footer-copy:hover { text-decoration: underline; }

/* 隐私页正文末尾简洁版权声明 */
.privacy-legal {
  text-align: center;
  color: #333;
  font-size: 13px;
  font-family: "Microsoft YaHei", "Heiti SC", "PingFang SC", "Source Han Sans SC", "Noto Sans CJK SC", sans-serif;
  margin: 24px 0 4px;
  padding-top: 16px;
  border-top: 1px solid var(--line, rgba(0, 0, 0, 0.08));
}

/* ---------- 顶部导航 ---------- */
.topbar {
  position: sticky;
  top: 0;
  z-index: 50;
  background: linear-gradient(180deg, #f3ecdc 0%, #efe5d0 100%);
  border-bottom: 1px solid rgba(232, 114, 43, .14);
}
.topbar .wrap {
  display: flex;
  align-items: center;
  gap: 14px;
  height: 64px;
}
.brand {
  display: flex;
  align-items: center;
  gap: 10px;
  font-weight: 700;
  font-size: 18px;
  letter-spacing: 0.3px;
  white-space: nowrap;
}
.brand .dot {
  width: 28px; height: 28px;
  flex: 0 0 auto;
  align-self: center;
  border-radius: 50%;
  background-image: url("../img/deskbud-icon.png");
  background-size: cover;
  background-position: center;
  background-repeat: no-repeat;
  box-shadow: inset 0 0 0 2px var(--surface);
}
.brand-sub { font-weight: 500; font-size: 13px; color: var(--ink-faint); letter-spacing: 0; }

/* ---------- 顶部全站搜索 ---------- */
/* 位于副标语「· 让桌面不再孤单」与导航之间 */
.site-search {
  position: relative;
  flex: 0 1 260px;
  margin: 0 auto;
  display: flex;
  align-items: center;
  gap: 6px;
  background: var(--surface);
  border: 1px solid var(--line);
  border-radius: 999px;
  padding: 4px 5px 4px 14px;
  transition: border-color .15s, box-shadow .15s;
}
.site-search:focus-within {
  border-color: var(--brand);
  box-shadow: 0 0 0 3px var(--brand-soft);
}
.site-search input {
  flex: 1 1 auto;
  min-width: 0;
  border: 0;
  background: transparent;
  outline: none;
  font-size: 14px;
  color: var(--ink);
}
.site-search input::-webkit-search-cancel-button { -webkit-appearance: none; }
.site-search-btn {
  flex: 0 0 auto;
  border: 0;
  background: var(--brand);
  color: #fff;
  font-size: 14px;
  padding: 4px 11px;
  border-radius: 999px;
  cursor: pointer;
  white-space: nowrap;
  line-height: 1.2;
}
.site-search-btn:hover { background: var(--brand-ink); }
/* 搜索栏独立一行：位于公告栏之下、hero 之上，居中显示
   桌面限宽 460px，移动端满宽（见 ≤680 媒体查询） */
/* 全站作品图防拖拽：禁浏览器原生拖图（右键另存由 site.js 拦截 IMG 的 contextmenu 处理） */
img { -webkit-user-drag: none; user-drag: none; }
.top-search {
  background: #fff;
  display: flex;
  justify-content: center;
  padding: 10px 16px;
}
.top-search .site-search { flex: 0 1 460px; width: 100%; max-width: 460px; margin: 0; }
.site-search-results {
  position: absolute;
  top: calc(100% + 8px);
  left: 0;
  right: 0;
  min-width: 280px;
  background: #fff;
  border: 1px solid var(--line);
  border-radius: 12px;
  box-shadow: 0 14px 34px rgba(0, 0, 0, 0.12);
  padding: 6px;
  z-index: 60;
  max-height: 62vh;
  overflow: auto;
}
.site-search-results[hidden] { display: none; }
.ssr-item {
  display: block;
  padding: 9px 11px;
  border-radius: 8px;
  text-decoration: none;
  color: var(--ink);
}
.ssr-item:hover { background: var(--brand-soft); }
.ssr-title { font-weight: 600; font-size: 14px; }
.ssr-cat { font-size: 12px; color: var(--brand); margin-left: 6px; }
.ssr-desc { display: block; font-size: 12px; color: var(--ink-faint); margin-top: 2px; line-height: 1.4; }
.ssr-empty { padding: 14px 10px; color: var(--ink-faint); font-size: 13px; text-align: center; }
@media (max-width: 860px) {
  .brand-sub { display: none; }
  .site-search { flex: 1 1 auto; }
  .nav { gap: 12px; font-size: 13px; }
}
.nav {
  display: flex;
  gap: 18px;
  font-size: 14px;
  color: var(--ink-soft);
  margin-left: auto;
}
.nav a { white-space: nowrap; } /* 英文等多词链接不拆行（如 How to Use 不被拆成 3 行） */
.nav a:hover { color: var(--brand-ink); }
.nav a.active { color: var(--brand); font-weight: 600; }
.nav a.active::after {
  content: ""; display: block; height: 2px; margin-top: 2px;
  background: var(--brand); border-radius: 2px;
}
/* 2026-09-10 老曹：EN 按钮去背景（纯文字，hover 变橙） */
.lang-switch {
  flex: 0 0 auto;
  margin-left: 10px;
  border: none;
  background: transparent;
  color: var(--ink-soft);
  font-size: 13px;
  font-weight: 600;
  padding: 6px 6px;
  border-radius: 8px;
  cursor: pointer;
  transition: color .15s;
}
.lang-switch:hover { color: var(--brand); }

/* ---------- 通用区块 ---------- */
.section { padding: 56px 0; }
.section-head {
  display: flex;
  align-items: baseline;
  justify-content: space-between;
  margin-bottom: 26px;
  gap: 16px;
  flex-wrap: wrap;
}
.section-title {
  font-size: 24px;
  font-weight: 700;
  margin: 0;
  color: var(--ink);
}
.section-sub {
  color: var(--ink-faint);
  font-size: 14px;
  margin: 4px 0 0;
}

/* ---------- 按钮 ---------- */
.btn {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  padding: 11px 20px;
  border-radius: 999px;
  font-size: 15px;
  font-weight: 600;
  cursor: pointer;
  border: 1px solid transparent;
  transition: transform .15s ease, box-shadow .15s ease, background .15s ease;
}
.btn-primary {
  background: var(--brand);
  color: #fff;
  box-shadow: var(--shadow);
}
.btn-primary:hover { background: var(--brand-ink); transform: translateY(-1px); }
.btn-ghost {
  background: var(--surface);
  color: var(--brand-ink);
  border-color: var(--line);
}
.btn-ghost:hover { background: var(--brand-soft); }

/* ---------- 卡片栅格（仿 jacobince.com/work 大图平铺风） ---------- */
.grid {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(340px, 1fr));
  gap: 44px 32px;
}
.card {
  display: flex;
  flex-direction: column;
  background: transparent;
  border: none;
  overflow: hidden;
}
.card .thumb {
  position: relative;
  aspect-ratio: 4 / 3;
  background: var(--surface-2);
  border-radius: var(--radius-sm);
  overflow: hidden;
  display: flex;
  align-items: center;
  justify-content: center;
  color: var(--ink-faint);
  font-size: 13px;
}
.card .thumb img,
.card .thumb video { width: 100%; height: 100%; object-fit: cover; transition: transform .55s cubic-bezier(.2,.7,.2,1); }
.card:hover .thumb img,
.card:hover .thumb video { transform: scale(1.05); }
/* 标题叠加在图底部 */
.card .overlay {
  position: absolute;
  left: 0; right: 0; bottom: 0;
  padding: 28px 20px 16px;
  background: linear-gradient(to top, rgba(20,20,18,0.62) 0%, rgba(20,20,18,0.0) 100%);
  color: #fff;
  pointer-events: none;
}
.card .overlay .cat {
  font-size: 12px;
  letter-spacing: 1px;
  text-transform: uppercase;
  color: rgba(255,255,255,0.82);
}
.card .overlay h3 {
  margin: 4px 0 0;
  font-size: 22px;
  font-weight: 600;
  letter-spacing: 0.3px;
  color: #fff;
  text-shadow: 0 1px 12px rgba(0,0,0,0.3);
}
.card .meta {
  display: flex;
  justify-content: space-between;
  font-size: 13px;
  color: var(--ink-faint);
  padding: 12px 2px 0;
}

/* ---------- 标签筛选 ---------- */
.filters { display: flex; gap: 10px; flex-wrap: wrap; margin-bottom: 24px; }
.chip {
  padding: 8px 16px;
  border-radius: 999px;
  border: 1px solid var(--line);
  background: var(--surface);
  color: var(--ink-soft);
  font-size: 14px;
  cursor: pointer;
  transition: all .15s ease;
}
.chip:hover { border-color: var(--brand); color: var(--brand-ink); }
.chip.active { background: var(--brand); color: #fff; border-color: var(--brand); }
.chip.sub { padding-left: 12px; padding-right: 12px; font-size: 13px; color: var(--ink-faint); border-style: dashed; }

.sortbar { display: flex; align-items: center; gap: 10px; font-size: 14px; color: var(--ink-soft); }
.sortbar select {
  font: inherit;
  padding: 7px 12px;
  border-radius: var(--radius-sm);
  border: 1px solid var(--line);
  background: var(--surface);
  color: var(--ink);
}

/* ---------- 页脚（三行：客户端下载入口 / 联系邮箱+PV / 版权+tagline；老曹 2026-09-09 拍板） ---------- */
.footer {
  border-top: 1px solid var(--line);
  background: transparent; /* 继承 body 暖米，与上下区色块连续 */
  /* 手机安全区：iOS/安卓浏览器底栏会压住最后一行（kotlin 实测"下部显示不全"），2026-09-10 */
  padding: 28px 0 calc(32px + env(safe-area-inset-bottom));
  margin-top: 24px;
  color: var(--ink-soft);
  font-size: 14px;
}
.footer .wrap { display: block; }
/* 行2（原 footer-bottom 内容）：联系邮箱+tagline；footer-dl 链接已合并进 footer-bottom-left（v8） */
.footer-bottom { display: flex; justify-content: space-between; align-items: center; flex-wrap: wrap; gap: 10px; padding: 16px 0; border-bottom: 1px dashed var(--line); font-size: 13px; color: var(--ink-faint); }
.footer-bottom-left { display: flex; align-items: center; gap: 16px; flex-wrap: wrap; }
.footer-bottom-left a { color: var(--brand-ink); transition: box-shadow .18s ease, background .18s ease; padding: 2px 6px; border-radius: 8px; }
.footer-bottom-left a:hover { text-decoration: none; background: rgba(255,255,255,.6); box-shadow: 0 4px 12px rgba(232, 114, 43, .22); }
.footer-dl-link { font-weight: 600; background: rgba(255, 255, 255, .55); padding: 5px 14px !important; border-radius: 999px !important; }
.footer-dl-link:hover { background: #fff !important; transform: translateY(-2px); box-shadow: 0 6px 18px rgba(232, 114, 43, .22) !important; }
.footer-mailto { font-weight: 600; }
/* 行3（原 footer-top 内容）：版权 + tagline */
.footer-top { display: flex; justify-content: space-between; flex-wrap: wrap; gap: 16px; padding-top: 16px; font-size: 13px; color: var(--ink-faint); }
.footer a { color: var(--brand-ink); }
.footer-copy { transition: box-shadow .18s ease, background .18s ease; padding: 2px 6px; border-radius: 8px; }
.footer-copy:hover { background: rgba(255,255,255,.6); box-shadow: 0 4px 12px rgba(232, 114, 43, .22); text-decoration: none; }

/* ---------- 统计数 ---------- */
.stat {
  font-variant-numeric: tabular-nums;
  color: var(--brand-ink);
  font-weight: 600;
}

/* ---------- 响应式 ---------- */
@media (max-width: 680px) {
  .wrap { padding: 0 16px; }
  .brand-sub { display: none; }
  .brand { font-size: 17px; }
  /* 导航允许换行 + 顶栏高度自适应：窄屏不再裁掉「使用说明/隐私说明/联系我们」 */
  .topbar .wrap { height: auto; min-height: 64px; padding: 8px 16px; flex-wrap: wrap; }
  /* 导航独立一行（2026-09-10 kotlin 手机实测：margin-left:auto 保持整行宽度溢出，
     被 body overflow-x:hidden 裁掉只看到「首页」——flex:1 1 100% 换行自救，老曹临时页验证） */
  .nav { flex: 1 1 100%; margin-left: 0; justify-content: flex-start; gap: 8px 13px; font-size: 13px; flex-wrap: wrap; }
  .top-search .site-search { flex: 1 1 auto; max-width: none; }
  .section { padding: 40px 0; }
  .section-title { font-size: 20px; }
  .grid { grid-template-columns: repeat(auto-fill, minmax(150px, 1fr)); gap: 20px 14px; }
  .card .overlay { padding: 22px 12px 10px; }
  .card .overlay h3 { font-size: 16px; }
}

/* ---------- 首页 hero ---------- */
.hero { padding: 72px 0 40px; text-align: center; }
.hero h1 { font-size: 40px; margin: 0 0 14px; letter-spacing: 0.5px; }
.hero .slogan { font-size: 20px; color: var(--ink-soft); margin: 4px 0 16px; font-weight: 500; }
.hero .sub { font-size: 14px; color: var(--ink-faint); margin: 0 0 10px; line-height: 1.7; }
.hero .sub.sub-block { margin: 0 auto 28px; max-width: 640px; }
.hero .actions { display: flex; gap: 14px; justify-content: center; flex-wrap: wrap; }
@media (max-width: 680px) {
  .hero { padding: 48px 0 28px; }
  .hero h1 { font-size: 30px; }
  .hero .slogan { font-size: 16px; }
}

/* ============================================================
   首页改版（2026-09-09 老曹拍板，布局语言借鉴 pet.aisuper.win）：
   首屏 = 左侧文案+伙伴选择卡 ｜ 右侧大展示卡（姿态轮播）；
   下部 = 左侧介绍+下载/购买 ｜ 右侧宣传视频。
   首页隐藏搜索栏/公告/语录走马灯（syncHomeChrome 控制）。
   ============================================================ */
/* 背景分层（2026-09-09 七轮拍板：整页只分上下两段——上部暖米独特色、下部与 footer 一体色；许可与隐私页=上部独特色） */
.home-hero-band { background: linear-gradient(180deg, #f1e9d4 0%, #ede2c9 100%); }
/* 下部区域与 footer 同色 #efe5d0（消除手册卡与页脚色差，老曹 2026-09-09 拍板） */
.home-detail-band { background: #efe5d0; }
/* 隐私页整页独特色（与首页底部同色，老曹 2026-09-09 拍板统一上下色块） */
body.privacy-warm { background: #efe5d0 fixed; }
/* 2026-09-10 老曹四轮视觉：导航下留白加大（52→76）、上下两段间距收紧（64→36） */
.hero-split { display: grid; grid-template-columns: minmax(0, 1.02fr) minmax(0, .98fr); gap: 48px; align-items: start; padding: 76px 0 36px; }
.hero-kicker { display: flex; align-items: center; gap: 10px; font-size: 13px; letter-spacing: 2px; color: var(--ink-soft); margin-bottom: 18px; }
.hero-kicker i { width: 26px; height: 2px; background: var(--brand); border-radius: 2px; }
.hero-big { font-family: Georgia, "Songti SC", "STSong", "SimSun", serif; font-size: clamp(25px, 2.4vw, 32px); line-height: 1.65; margin: 0 0 16px; color: var(--ink); font-weight: 700; letter-spacing: .5px; }
.hero-big .hl { color: var(--brand); }
.hero-lead .hl { color: var(--brand); font-weight: 600; }
.hero-lead { color: var(--ink-soft); font-size: 15px; line-height: 1.85; margin: 0 0 26px; max-width: 470px; }
.picker-head { display: flex; align-items: baseline; gap: 12px; margin-bottom: 12px; }
.picker-head b { font-size: 15px; color: var(--ink); }
.pet-picker { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); gap: 12px; }
.pick-card {
  position: relative;
  display: flex; align-items: center; gap: 12px; text-align: left; min-width: 0;
  background: #fff; border: 1.5px solid transparent; border-radius: 16px; padding: 12px 14px;
  cursor: pointer; font: inherit;
  box-shadow: 0 2px 10px rgba(120, 80, 40, .06);
  transition: transform .18s ease, box-shadow .18s ease, border-color .18s ease, background .18s ease;
}
.pick-card:hover { transform: translateY(-2px); box-shadow: 0 8px 22px rgba(232, 114, 43, .14); }
.pick-card.active { border-color: var(--brand); box-shadow: 0 6px 18px rgba(232, 114, 43, .18); background: linear-gradient(180deg, #fff, #fff7ef); }
.pick-thumb { width: 46px; height: 46px; object-fit: contain; border-radius: 12px; background: #fdf3e9; flex: 0 0 auto; }
.pick-txt { flex: 1; min-width: 0; }
.pick-txt b { display: block; font-size: 14px; color: var(--ink); }
.pick-txt small { display: block; font-size: 12px; color: var(--ink-faint); margin-top: 2px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.pick-arrow { color: var(--brand); font-size: 18px; line-height: 1; flex: 0 0 auto; }
/* 右侧大展示卡：立体感 = 双层投影 + 内虚线框 + 横滚姿态走马灯；色块弱化与 band 融（老曹 2026-09-09 六轮拍板） */
/* 2026-09-10 四轮：纯白改暖白渐变，拉近与页面底色色差，整体协调柔和 */
.showcase-card {
  position: relative;
  background: linear-gradient(180deg, #fffef9 0%, #fbf2df 100%);
  border-radius: 28px; padding: 24px 24px 18px;
  box-shadow: 0 18px 44px rgba(190, 120, 60, .14), 0 4px 14px rgba(120, 80, 40, .07);
}
.showcase-card::before { content: ""; position: absolute; inset: 12px; border: 1.5px dashed rgba(232, 114, 43, .20); border-radius: 20px; pointer-events: none; }
/* 首屏展示卡内的横滚走马灯（不走 100vw 突破，与详情页 pose-marquee 区分） */
.showcase-marquee { position: relative; overflow: hidden; margin: 0 -24px; padding: 4px 24px 10px; }
.showcase-track { display: flex; width: max-content; animation: poseMarquee 44s linear infinite; }
.showcase-marquee:hover .showcase-track { animation-play-state: paused; }
.spose-item {
  position: relative; flex: 0 0 auto; width: 152px; aspect-ratio: 1 / 1; margin-right: 14px;
  background: transparent; border: none; overflow: hidden;
  display: flex; align-items: center; justify-content: center;
}
.spose-item img { width: 100%; height: 100%; object-fit: contain; pointer-events: none; -webkit-user-drag: none; user-select: none; }
.spose-guard { position: absolute; inset: 0; z-index: 2; cursor: default; }
/* 与 showcase 大卡同高 = 上部播放窗口与中间视频播窗口一样大（老曹 2026-09-09 拍板） */
.showcase-track-wrap { position: relative; z-index: 1; height: 400px; display: flex; align-items: center; overflow: hidden; }
@media (max-width: 620px) { .spose-item { width: 112px; margin-right: 10px; } }
.showcase-badge {
  position: relative; z-index: 1; display: inline-flex; align-items: center; gap: 8px;
  background: #fff; border-radius: 999px; padding: 7px 14px;
  font-size: 13px; color: var(--ink-soft); box-shadow: 0 3px 10px rgba(120, 80, 40, .10);
}
.live-dot { width: 8px; height: 8px; border-radius: 50%; background: #3e9e6c; animation: livePulse 2s infinite; }
@keyframes livePulse {
  0% { box-shadow: 0 0 0 0 rgba(62, 158, 108, .40); }
  70% { box-shadow: 0 0 0 7px rgba(62, 158, 108, 0); }
  100% { box-shadow: 0 0 0 0 rgba(62, 158, 108, 0); }
}
.showcase-imgwrap { position: relative; z-index: 1; height: 400px; display: flex; align-items: center; justify-content: center; }
.showcase-imgwrap img { max-height: 100%; max-width: 100%; object-fit: contain; filter: drop-shadow(0 18px 22px rgba(120, 80, 40, .18)); }
.showcase-dots { position: relative; z-index: 1; display: flex; justify-content: center; gap: 8px; padding: 8px 0 2px; }
.sdot {
  width: 8px; height: 8px; border-radius: 999px; border: 0; padding: 0; cursor: pointer;
  background: #dcd3c6; transition: width .25s ease, background .25s ease, box-shadow .25s ease;
}
.sdot:hover { background: #c9bda9; }
.sdot.on { width: 26px; background: linear-gradient(90deg, #e8722b, #cf5f1c); box-shadow: 0 2px 8px rgba(232, 114, 43, .45); }
/* 下部详情区：左文字立体大卡（上文字·下领回家链接） ｜ 右视频大卡（轮播+三平台标签），结构与上部一致 */
/* 下部详情区：左右两卡底边对齐（老曹 2026-09-09 拍板）+ 立体大卡风格 */
.home-detail { display: grid; grid-template-columns: minmax(0, 1.05fr) minmax(0, .95fr); gap: 44px; padding: 40px 0 56px; align-items: stretch; }
.hd-left, .hd-right { display: flex; flex-direction: column; }
.hd-left {
  position: relative;
  background: linear-gradient(175deg, #fffdf9 0%, #f7efdf 100%);
  border-radius: 26px; padding: 30px 32px 36px;
  box-shadow: 0 20px 50px rgba(190, 120, 60, .13), 0 4px 14px rgba(120, 80, 40, .07);
}
.hd-left::before { content: ""; position: absolute; inset: 10px; border: 1.5px dashed rgba(232, 114, 43, .18); border-radius: 18px; pointer-events: none; }
.hd-left > * { position: relative; z-index: 1; }
.hd-badge { margin-bottom: 14px; }
.hd-left h2 { font-size: 26px; margin: 0 0 8px; letter-spacing: .3px; }
.hd-tagline { color: var(--brand); font-weight: 600; margin: 0 0 12px; line-height: 1.7; }
.hd-desc { color: var(--ink-soft); line-height: 1.95; margin: 0 0 22px; font-size: 14.5px; }
.hd-buy .buy-row { display: flex; gap: 12px; flex-wrap: wrap; align-items: center; }
.hd-soon { font-size: 13px; color: var(--ink-faint); border: 1px dashed var(--ink-faint); border-radius: 999px; padding: 7px 14px; transition: color .18s, border-color .18s; }
.hd-soon:hover { color: var(--brand); border-color: var(--brand); }
.hd-buy .buy-chans { font-size: 13px; color: var(--ink-soft); }
.hd-buy .buy-chans a { color: var(--brand); font-weight: 600; text-decoration: none; padding: 2px 4px; border-radius: 8px; transition: box-shadow .18s, background .18s; }
.hd-buy .buy-chans a:hover { text-decoration: none; background: #fff; box-shadow: 0 4px 14px rgba(232, 114, 43, .28); }
/* 链接焦点态（老曹 2026-09-09：有链接处 hover 一律浮起+阴影） */
.home-hero-band .btn:hover, .home-detail-band .btn:hover { transform: translateY(-2px); box-shadow: 0 8px 22px rgba(232, 114, 43, .32); }
/* 隐私页大立体卡（与首页展示卡/手册卡同风格；背景=body.privacy-warm 独特色） */
.privacy-card-wrap { padding: 40px 24px 64px; }
.privacy-card { padding: 36px 40px 32px; }
.privacy-ph { padding: 0 0 8px; }
.privacy-ph h1 { font-size: 28px; margin: 0 0 10px; }
.privacy-sec { padding-top: 26px; }
.privacy-sec .block-title { margin-top: 0; }
@media (max-width: 720px) { .privacy-card { padding: 24px 20px; } }
/* 右侧视频大卡：与上部展示卡同构（渐变+虚线内框+徽标），内含视频舞台 + 三平台标签 */
.hd-video-card { display: flex; flex-direction: column; gap: 14px; }
.video-stage {
  position: relative; z-index: 1; border-radius: 18px; overflow: hidden;
  height: 400px; background: linear-gradient(180deg, #fdf7ea 0%, #f7ecd6 100%);
  box-shadow: inset 0 0 0 1px rgba(232, 114, 43, .10), 0 10px 26px rgba(120, 80, 40, .10);
}
/* 视频 letterbox 区跟随暖色（避免黑边/白边突兀），2026-09-10 四轮 */
.video-stage video { width: 100%; height: 100%; object-fit: contain; display: block; background: transparent; }
.video-ph {
  position: absolute; inset: 0; display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 10px;
  color: var(--ink-faint); font-size: 12.5px; text-align: center; padding: 8px;
  background: linear-gradient(175deg, #fffdf9, #f6efe2);
}
.video-ph .vplay {
  width: 46px; height: 46px; border-radius: 50%; background: #fff; color: var(--brand);
  display: flex; align-items: center; justify-content: center; font-size: 16px;
  box-shadow: 0 6px 18px rgba(232, 114, 43, .25);
}
.video-tabs { position: relative; z-index: 1; display: flex; gap: 10px; flex-wrap: wrap; }
.vtab {
  border: 1.5px solid transparent; background: #fff; border-radius: 999px; padding: 7px 16px;
  font: inherit; font-size: 13px; color: var(--ink-soft); cursor: pointer;
  box-shadow: 0 2px 8px rgba(120, 80, 40, .08);
  transition: transform .18s ease, box-shadow .18s ease, border-color .18s ease, color .18s ease, background .18s ease;
}
.vtab:hover { transform: translateY(-2px); box-shadow: 0 6px 16px rgba(232, 114, 43, .18); }
.vtab.on { border-color: var(--brand); color: var(--brand); background: linear-gradient(180deg, #fff, #fff7ef); box-shadow: 0 4px 14px rgba(232, 114, 43, .22); }
/* 手册大立体卡（下部色带内，与展示卡/视频卡同风格）：三平台标签 + 原版手册 iframe（限高卡内滚动） */
.home-manual-wrap { padding: 8px 0 64px; }
.home-manual-card { display: flex; flex-direction: column; gap: 14px; }
.hm-head { position: relative; z-index: 1; display: flex; align-items: center; justify-content: space-between; gap: 14px; flex-wrap: wrap; }
.home-manual-card .manual-frame {
  position: relative; z-index: 1; min-height: 480px; max-height: 560px; height: 520px;
  border-radius: 16px; background: #fffdf9;
}
@media (max-width: 960px) {
  .home-manual-card .manual-frame { min-height: 380px; max-height: 440px; height: 400px; }
}
@media (max-width: 960px) {
  /* 2026-09-10 修复：1fr 下限是 auto，会被 pick-card 内 nowrap 文字的 min-content 撑爆
     （手机端列宽被撑到 1800px、兔子卡挤出视口）——铁律①同款，必须 minmax(0, 1fr) */
  .hero-split, .home-detail { grid-template-columns: minmax(0, 1fr); gap: 28px; }
  .showcase-imgwrap { height: 320px; }
  .home-detail { padding-top: 48px; }
}

/* ---------- 首页三步上手（奶油色卡片带，借鉴竞品的轻量引导） ---------- */
.home-steps {
  background: linear-gradient(180deg, #fff6ec 0%, #fffaf3 100%);
  border: 1px solid var(--line);
  border-radius: 24px;
  padding: 48px 40px;
  margin: 8px 0;
  box-shadow: var(--shadow);
}
.home-steps .section-head { margin-bottom: 28px; }
.steps-grid {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 22px;
}
.step-card {
  position: relative;
  background: #fff;
  border: 1px solid var(--line);
  border-radius: var(--radius);
  padding: 30px 22px 22px;
  text-align: center;
  box-shadow: 0 4px 16px rgba(40,40,36,.04);
  transition: transform .18s ease, box-shadow .18s ease;
}
.step-card:hover { transform: translateY(-4px); box-shadow: var(--shadow-hover); }
.step-no {
  position: absolute;
  top: -15px; left: 50%; transform: translateX(-50%);
  width: 30px; height: 30px; border-radius: 50%;
  background: var(--brand); color: #fff;
  font-weight: 700; font-size: 15px;
  display: flex; align-items: center; justify-content: center;
  box-shadow: 0 4px 12px rgba(232,114,43,.28);
}
.step-emoji { font-size: 40px; line-height: 1; margin: 4px 0 12px; }
.step-card h3 { margin: 0 0 8px; font-size: 18px; color: var(--ink); }
.step-card p { margin: 0; color: var(--ink-soft); font-size: 14px; line-height: 1.65; }
.steps-cta { text-align: center; margin-top: 30px; }
@media (max-width: 680px) {
  .home-steps { padding: 40px 18px; border-radius: 18px; }
  .steps-grid { grid-template-columns: 1fr; gap: 18px; }
}

/* ---------- 子页轻量标题区（列表/详情/使用/隐私/联系） ---------- */
.page-header { padding: 56px 0 30px; text-align: center; }
.page-header h1 { font-size: 28px; margin: 0 0 10px; letter-spacing: 0.4px; color: var(--ink); }
.page-header .ph-sub { font-size: 15px; color: var(--ink-faint); margin: 0; line-height: 1.7; }
@media (max-width: 680px) {
  .page-header { padding: 40px 0 22px; }
  .page-header h1 { font-size: 23px; }
}

/* ---------- 详情页 ---------- */
.detail-hero { padding: 40px 0 8px; }
.detail-title { font-size: 30px; margin: 0 0 6px; }
.detail-sub { color: var(--ink-soft); margin: 0 0 20px; }
.media-block { margin: 22px 0; }
.media-block img, .media-block video {
  width: 100%; border-radius: var(--radius); border: 1px solid var(--line); background: var(--surface-2);
}
.media-cap { font-size: 13px; color: var(--ink-faint); margin-top: 8px; }

/* 详情页媒体画廊：2 列网格，把空出来的窗口填满 */
.media-gallery {
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  gap: 14px;
  margin: 20px 0 8px;
}
.media-gallery .m-item {
  margin: 0;
  background: var(--surface-2);
  border: 1px solid var(--line);
  border-radius: var(--radius);
  overflow: hidden;
}
.media-gallery .m-item img,
.media-gallery .m-item video {
  width: 100%;
  height: 220px;
  object-fit: cover;
  display: block;
  background: #f0f3f1;
}
.media-gallery .m-item figcaption {
  font-size: 12px;
  color: var(--ink-faint);
  padding: 6px 10px 8px;
  border-top: 1px solid var(--line);
  background: var(--surface-2);
}
@media (max-width: 620px) {
  .media-gallery { grid-template-columns: 1fr; }
  .media-gallery .m-item img,
  .media-gallery .m-item video { height: 180px; }
}
.detail-grid { display: grid; grid-template-columns: 1.6fr 1fr; gap: 32px; align-items: start; }
@media (max-width: 820px) { .detail-grid { grid-template-columns: 1fr; } }
.sidebar {
  background: var(--surface);
  border: 1px solid var(--line);
  border-radius: var(--radius);
  padding: 22px;
  box-shadow: var(--shadow);
  position: sticky;
  top: 84px;
}
.sidebar .row { display: flex; justify-content: space-between; padding: 10px 0; border-bottom: 1px solid var(--line); font-size: 14px; }
.sidebar .row:last-of-type { border-bottom: none; }
.sidebar .row span:first-child { color: var(--ink-faint); }
.detail-body p { color: var(--ink-soft); }
.download-box { margin-top: 18px; }
.download-box .btn { width: 100%; justify-content: center; }
.empty { text-align: center; color: var(--ink-faint); padding: 60px 0; }

/* 筛选条：无上线作品的分类置灰 + “暂无” 标注，不误导也不闪空 */
.chip.muted { opacity: .5; cursor: default; }
.chip.muted:hover { background: var(--surface-2); }

/* 详情页演示视频窗口：视频缺失时不破图，保留窗口位置（预留 mp4 位） */
.video-wrap { position: relative; width: 100%; height: 220px; background: #eef1ef; display: flex; }
.video-wrap video { width: 100%; height: 100%; object-fit: cover; display: block; }
/* 2026-09-10 修复：原来裸 .video-ph{display:none} 误伤首页 .video-stage / 伙伴页的无视频占位（窗口空白），
   作用域收窄回 .video-wrap（列表卡片占位默认不显，仅 .no-video 显示） */
.video-wrap .video-ph { display: none; position: absolute; inset: 0; flex-direction: column; align-items: center; justify-content: center; gap: 6px; color: var(--ink-faint); background: linear-gradient(135deg,#f3f6f4,#e9eeec); }
.video-wrap.no-video .video-ph { display: flex; }
.video-ph .vplay { font-size: 30px; opacity: .5; }
.video-ph .vlabel { font-size: 14px; font-weight: 600; color: var(--ink); }
.video-ph .vhint { font-size: 12px; }
@media (max-width: 620px) { .video-wrap { height: 180px; } .video-stage { height: 220px; } } /* 视频大窗手机降高（首页/伙伴页共用 .video-stage，kotlin 实测 400px 手机滚动过长） */

/* ---------- 桌宠泡泡语录（向上飘的半透明气泡） ---------- */
.card-bubbles {
  position: absolute;
  inset: 0;
  overflow: hidden;
  pointer-events: none;
  z-index: 3;
}
.bubble-zone {
  position: relative;
  overflow: hidden;
  height: 280px;
}
/* 气泡外层：起点由 left/top 决定（在容器中部），朝某方向飘走 */
.bubble {
  position: absolute;
  max-width: 90%;
  z-index: 4;
  animation: bubbleOut var(--dur, 18s) cubic-bezier(.37, 0, .63, 1) forwards;
  will-change: transform, opacity;
}
/* 气泡本体：白字 + 深色阴影（透明不遮宠物）；中部浮现向四周飘走，不再左右摆 */
.bbl {
  display: inline-flex;
  align-items: center;
  gap: 7px;
  padding: 8px 12px;
  background: transparent;
  border: none;
  border-radius: 0;
  color: #fff;
  font-size: 13px;
  font-weight: 500;
  line-height: 1.4;
  font-family: var(--font-bubble);
  text-shadow: 0 1px 4px rgba(0, 0, 0, 0.62), 0 0 2px rgba(0, 0, 0, 0.5);
  box-shadow: none;
  max-width: 100%;
  white-space: nowrap;
}
.bbl-emoji { font-size: 17px; line-height: 1; filter: drop-shadow(0 1px 1px rgba(0, 0, 0, 0.06)); }
.bbl-text { white-space: normal; word-break: break-word; }
/* 气泡小尾巴（对话气泡模样） */
.bubble::after {
  content: "";
  position: absolute;
  left: 22px;
  bottom: 3px;
  width: 0;
  height: 0;
  border-left: 6px solid transparent;
  border-right: 6px solid transparent;
  border-top: 9px solid var(--cute, #ffe3ef);
  filter: drop-shadow(0 1px 1px rgba(0, 0, 0, 0.05));
}
@keyframes bubbleOut {
  0%   { transform: translate(0, 0) scale(0.86); opacity: 0; }
  14%  { opacity: 1; transform: translate(calc(var(--tx) * 0.18), calc(var(--ty) * 0.18)) scale(1); }
  82%  { opacity: 0.95; }
  100% { transform: translate(var(--tx), var(--ty)) scale(1.05); opacity: 0; }
}
/* 各方向类名（仅用于语义，动画统一由 bubbleOut 接管；保留以防未来扩展） */
.bubble.dir-rise { }
.bubble.dir-fall { }
.bubble.dir-lr   { }
.bubble.dir-rl   { }
.bubble.dir-d1   { }
.bubble.dir-d2   { }
@keyframes sway {
  0%, 100% { transform: translateX(-5px) rotate(-2.5deg); }
  50%      { transform: translateX(5px) rotate(2.5deg); }
}
/* 卡片空间小，气泡单行省略 */
.card-bubbles .bubble { max-width: 92%; }
.card-bubbles .bbl { max-width: 100%; white-space: nowrap; }
.card-bubbles .bbl-text { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; min-width: 0; }
/* 卡片上：纯文字气泡，无边框无图标无小三角，透明不遮挡宠物；白字带阴影保证可读 */
.card-bubbles .bbl {
  background: transparent;
  border: none;
  color: #fff;
  font-weight: 600;
  text-shadow: 0 1px 4px rgba(0, 0, 0, 0.62), 0 0 2px rgba(0, 0, 0, 0.5);
  box-shadow: none;
}
.card-bubbles .bubble::after { display: none; }   /* 去掉下三角 */
/* 详情/泡泡墙（白底）：深字 + 浅阴影，确保白底可读 */
.bubble-zone .bbl {
  color: var(--ink);
  text-shadow: 0 1px 2px rgba(255, 255, 255, 0.7);
  font-weight: 600;
}
.bubble-panel {
  margin-top: 28px;
  border: 1px solid var(--line);
  border-radius: var(--radius);
  padding: 16px 18px 8px;
  background: linear-gradient(180deg, #fbfdfc, #f6faf8);
}
.bubble-panel-tip {
  font-size: 12px;
  color: var(--ink-faint);
  margin-bottom: 10px;
  display: flex;
  align-items: center;
  gap: 6px;
}
.bubble-panel-tip::before { content: "💭"; }

/* ---------- 泡泡墙整页（bubble.html） ---------- */
.bubble-wall {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(280px, 1fr));
  gap: 22px;
}
.bubble-card {
  border: 1px solid var(--line);
  border-radius: var(--radius);
  padding: 16px 16px 6px;
  background: linear-gradient(180deg, #fbfdfc, #f6faf8);
  display: flex;
  flex-direction: column;
}
.bubble-card .bc-head {
  display: flex;
  align-items: center;
  gap: 8px;
  font-size: 16px;
  font-weight: 600;
  color: var(--ink);
  margin-bottom: 10px;
}
.bubble-card .bc-head .emoji { font-size: 22px; line-height: 1; }
.bubble-zone.tall { height: 340px; }

/* ---------- 使用说明页（usage.html） ---------- */
.usage-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 24px; margin-top: 18px; }
@media (max-width: 820px) { .usage-grid { grid-template-columns: 1fr; } }
.usage-card { background: var(--surface); border: 1px solid var(--line); border-radius: var(--radius); padding: 22px 24px; box-shadow: var(--shadow); }
.usage-card h2 { font-size: 18px; margin: 0 0 14px; color: var(--ink); }
.usage-table { width: 100%; border-collapse: collapse; table-layout: fixed; }
.usage-table th, .usage-table td { padding: 12px 10px; border-bottom: 1px solid var(--line); vertical-align: top; text-align: left; word-break: break-word; }
.usage-table th { color: var(--ink-faint); font-weight: 600; font-size: 13px; background: var(--bg-soft); }
.usage-table td:first-child { width: 120px; color: var(--ink-faint); font-weight: 500; }
.usage-table tr:last-child td { border-bottom: none; }

/* ---------- 联系我们页（contact.html） ---------- */
.contact-grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(300px, 380px)); justify-content: center; gap: 20px; margin-top: 18px; }
@media (max-width: 900px) { .contact-grid { grid-template-columns: 1fr; } }
.contact-card { background: var(--surface); border: 1px solid var(--line); border-radius: var(--radius); padding: 22px 24px; box-shadow: var(--shadow); display: flex; flex-direction: column; gap: 16px; }
.contact-head { display: flex; align-items: center; gap: 14px; }
.contact-icon { width: 40px; height: 40px; border-radius: 10px; background: var(--bg-soft); display: inline-flex; align-items: center; justify-content: center; }
.contact-head h3 { margin: 0; font-size: 16px; color: var(--ink); }
.contact-head p { margin: 2px 0 0; font-size: 13px; color: var(--ink-faint); }
.contact-body { display: flex; align-items: center; gap: 12px; flex-wrap: wrap; }
.contact-value { font-family: ui-monospace, SFMono-Regular, "SF Mono", Consolas, monospace; font-size: 18px; font-weight: 600; color: var(--ink); padding: 8px 14px; background: var(--bg-soft); border-radius: 10px; flex: 1 1 auto; min-width: 0; word-break: break-all; }
.contact-btn { padding: 8px 14px; border: 1px solid var(--brand); background: var(--brand-soft); color: var(--brand-ink); border-radius: 999px; cursor: pointer; font-size: 13px; transition: background .15s; }
.contact-btn:hover { background: var(--brand); color: #fff; }
.contact-btn:disabled { opacity: .7; cursor: default; }
.contact-wechat { flex-direction: column; align-items: center; gap: 10px; padding: 8px 0 4px; }
.contact-wechat img { width: 168px; height: 168px; border-radius: 10px; border: 1px solid var(--line); object-fit: contain; background: #fff; }
.contact-tip { font-size: 12px; color: var(--ink-faint); }

/* ---------- 许可与隐私页（privacy.html，EULA+隐私+版权 三合一） ---------- */
.privacy-sec { padding: 26px 0; } /* 收紧三节间上下留白（默认 .section 56px 太松） */
.privacy-sec .block-title { margin: 24px 0 14px; } /* 标题与正文收紧 */
.privacy-block { max-width: 1080px; }
.privacy-block p { line-height: 1.7; color: var(--ink-soft); margin: 0 0 9px; }
.privacy-block strong { color: var(--ink); margin-right: 5px; }
.privacy-block code { background: var(--bg-soft); padding: 2px 6px; border-radius: 4px; font-size: 13px; }
/* 协议条款高亮提示条（页面首句"使用即同意"） */
.privacy-block .legal-notice {
  background: var(--bg-soft);
  border-left: 3px solid var(--brand);
  padding: 9px 14px;
  border-radius: var(--radius-sm, 10px);
  color: var(--ink);
  font-weight: 600;
  margin: 0 0 12px;
}
/* 条款禁止行为 / 用途列表 */
.privacy-block ul.privacy-list { margin: -2px 0 12px; padding-left: 1.4em; }
.privacy-block ul.privacy-list li { line-height: 1.7; color: var(--ink-soft); margin-bottom: 3px; }
.privacy-block ul.privacy-list li::marker { color: var(--brand); }
.privacy-block a.legal-mail { color: var(--brand); font-weight: 600; word-break: break-all; }

/* ---------- 详情页重构（单宠物单页 · 九宫格 + 三版本卡） ---------- */
.detail-back { text-align: left; padding: 30px 0 0; }
.back-link { color: var(--ink-faint); font-size: 14px; }
.back-link:hover { color: var(--brand-ink); }
.detail-hero { padding: 18px 0 8px; position: relative; }
.detail-title { font-size: 32px; margin: 0 0 10px; letter-spacing: 0.4px; color: var(--ink); }
.detail-tagline { color: var(--ink-soft); font-size: 16px; margin: 0 0 14px; max-width: 780px; line-height: 1.7; }
.detail-chips { display: flex; gap: 8px; flex-wrap: wrap; margin-bottom: 6px; }
.detail-chip {
  display: inline-flex; align-items: center; gap: 6px;
  font-size: 13px; color: var(--brand-ink);
  background: var(--brand-soft); border: 1px solid var(--line);
  padding: 5px 12px; border-radius: 999px;
}
.block-label {
  display: flex; align-items: center; gap: 10px;
  font-size: 18px; font-weight: 700; color: var(--ink);
  margin: 40px 0 16px;
}
.block-label::before { content: ""; width: 4px; height: 18px; border-radius: 3px; background: var(--brand); }
.block-label .hint { font-size: 13px; font-weight: 500; color: var(--ink-faint); margin-left: auto; }

/* 区块标题：隐私/版权等说明区块统一使用，与页面级 h1 区分层级；hint 靠右 */
.block-title { display: flex; align-items: baseline; justify-content: space-between; gap: 10px; font-size: 20px; font-weight: 700; color: var(--ink); margin: 40px 0 18px; padding-bottom: 10px; border-bottom: 2px solid var(--brand); }
.block-title .hint { font-size: 13px; font-weight: 500; color: var(--ink-faint); }

/* 九宫格：动画状态方格墙 */
.state-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(132px, 1fr)); gap: 14px; }
.state-cell {
  background: var(--surface); border: 1px solid var(--line);
  border-radius: var(--radius-sm); overflow: hidden; box-shadow: var(--shadow);
  transition: transform .18s ease, box-shadow .18s ease; margin: 0;
}
.state-cell:hover { transform: translateY(-3px); box-shadow: var(--shadow-hover); }
.state-cell .cell-media { aspect-ratio: 1 / 1; background: #f0f3f1; display: flex; align-items: center; justify-content: center; }
.state-cell .cell-media img { width: 100%; height: 100%; object-fit: contain; }
.state-cell .cell-cap {
  font-size: 12.5px; color: var(--ink-soft); text-align: center;
  padding: 7px 6px 9px; border-top: 1px solid var(--line); background: var(--surface-2);
}
@media (max-width: 620px) { .state-grid { grid-template-columns: repeat(auto-fill, minmax(96px, 1fr)); gap: 10px; } }

/* 三版本卡 */
.ver-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 20px; }
@media (max-width: 860px) { .ver-grid { grid-template-columns: 1fr; } }
.ver-card {
  display: flex; flex-direction: column; background: var(--surface);
  border: 1px solid var(--line); border-radius: var(--radius); overflow: hidden;
  box-shadow: var(--shadow); transition: transform .18s ease, box-shadow .18s ease;
}
.ver-card:hover { transform: translateY(-3px); box-shadow: var(--shadow-hover); }
.ver-head { display: flex; align-items: center; gap: 8px; padding: 14px 16px; border-bottom: 1px solid var(--line); background: var(--bg-soft); }
.ver-badge { font-size: 14px; font-weight: 700; color: #fff; background: var(--brand); padding: 4px 12px; border-radius: 999px; }
.ver-card.is-soon .ver-badge { background: var(--ink-faint); }
.ver-soon-tag { font-size: 12px; color: var(--ink-faint); margin-left: auto; }
.ver-video { position: relative; width: 100%; aspect-ratio: 16 / 10; background: #fffefb; display: flex; box-shadow: inset 0 0 0 1px rgba(232, 114, 43, .08); }
.ver-video video { width: 100%; height: 100%; object-fit: contain; display: block; background: #fff; }
.ver-ph { display: none; position: absolute; inset: 0; flex-direction: column; align-items: center; justify-content: center; gap: 6px; color: var(--ink-faint); background: linear-gradient(135deg,#f3f6f4,#e9eeec); }
.ver-video.no-video .ver-ph { display: flex; }
.ver-ph .vplay { font-size: 28px; opacity: .5; }
.ver-ph .vhint { font-size: 12px; }
.ver-install { font-size: 13.5px; color: var(--ink-soft); line-height: 1.6; padding: 12px 16px; flex: 1 1 auto; }
.ver-card.v-android { font-size: 12.5px; }
.ver-card.v-android .ver-install { font-size: 12.5px; }
.ver-actions { padding: 0 16px 16px; }
.ver-actions .btn { width: 100%; justify-content: center; }
.ver-soon {
  display: inline-flex; align-items: center; justify-content: center; width: 100%;
  padding: 11px 20px; border-radius: 999px; font-size: 14px; font-weight: 600;
  color: var(--ink-faint); background: var(--surface-2); border: 1px dashed var(--line);
}

/* ---------- 详情页：竹子背景 + 走马灯姿态 + BGM ---------- */
/* 竹子背景层：仅熊猫详情页使用（detail.html 手动放置此 div），国风单幅水墨竹画，fixed 铺满视口置于内容之下 */
.bamboo-bg {
  position: fixed; inset: 0; z-index: -1; pointer-events: none;
  background-color: var(--bg);
  background-image: url("../img/bamboo.svg");
  background-size: cover; background-repeat: no-repeat; background-position: center bottom;
  opacity: 0.22;
  -webkit-mask-image: linear-gradient(180deg, rgba(0,0,0,0.35) 0%, #000 30%, #000 100%);
  mask-image: linear-gradient(180deg, rgba(0,0,0,0.35) 0%, #000 30%, #000 100%);
}

/* 田野背景层：兔子详情页使用（与 .bamboo-bg 同一套衬底参数，仅换图）
   由 site.js 按作品 id 注入：rabbit → field-bg，其余（熊猫等）→ bamboo-bg */
.field-bg {
  position: fixed; inset: 0; z-index: -1; pointer-events: none;
  background-color: var(--bg);
  background-image: url("../img/field.svg");
  background-size: cover; background-repeat: no-repeat; background-position: center bottom;
  opacity: 0.26;
  -webkit-mask-image: linear-gradient(180deg, rgba(0,0,0,0.35) 0%, #000 30%, #000 100%);
  mask-image: linear-gradient(180deg, rgba(0,0,0,0.35) 0%, #000 30%, #000 100%);
}

/* 走马灯：动作姿态无缝横滚（不显示名字 + 防下载）
   用 margin-right 而非 gap，保证 -50% 平移严格无缝 */
.pose-marquee {
  position: relative; overflow: hidden;
  /* break-out：突破 .wrap 居中栏，铺满视口全宽（仿 redfox.hk 全屏走马灯）；
     仅详情页生效（首页/列表页无此元素）。margin 百分比相对包含块(.wrap)宽，公式成立 */
  width: 100vw;
  margin: 0 0 6px calc(50% - 50vw);
  -webkit-mask-image: linear-gradient(90deg, transparent, #000 5%, #000 95%, transparent);
  mask-image: linear-gradient(90deg, transparent, #000 5%, #000 95%, transparent);
}
.pose-track { display: flex; width: max-content; animation: poseMarquee 44s linear infinite; }
.pose-marquee:hover .pose-track { animation-play-state: paused; }
.pose-item {
  position: relative; flex: 0 0 auto; width: 152px; aspect-ratio: 1 / 1; margin-right: 14px;
  background: transparent; border: none; overflow: hidden;
  display: flex; align-items: center; justify-content: center;
}
.pose-item img { width: 100%; height: 100%; object-fit: contain; }
/* 透明遮罩：拦截右键/拖拽，配合 img pointer-events:none 形成防下载层 */
.pose-guard { position: absolute; inset: 0; z-index: 2; cursor: default; }
@keyframes poseMarquee { from { transform: translateX(0); } to { transform: translateX(-50%); } }
@media (max-width: 620px) { .pose-item { width: 112px; margin-right: 10px; } }

/* 全站 BGM 总开关：导航栏「首页」左侧，控制全站同一首 BGM（开→所有页访问即播，关→所有页停）。
   两段图标：[🔊/🔇 喇叭] + [三根均衡柱 .bgm-eq]；
   off 灰色（含静音图标本身明确"关"），on 音乐绿 #149a7e + 三柱错峰上下伸缩（频谱跳动感）。 */
.bgm-toggle {
  display: inline-flex; align-items: center; gap: 8px;
  font-size: 16px; line-height: 1; white-space: nowrap;
  color: var(--ink-faint); background: transparent;
  border: 0; padding: 4px 6px; cursor: pointer;
  transition: color .15s, transform .15s, opacity .15s;
}
.bgm-toggle:hover { transform: translateY(-1px); }
.bgm-toggle.on { color: #149a7e; }
.bgm-toggle .bgm-icon { font-size: 15px; line-height: 1; padding: 0; }
/* 三根均衡柱：off 矮柱灰静；on 高柱绿并错峰伸缩（scaleY 频谱跳），切换高度平滑过渡 */
.bgm-toggle .bgm-eq { display: inline-flex; align-items: flex-end; gap: 2px; height: 13px; }
.bgm-toggle .bgm-eq i { display: block; width: 3px; border-radius: 2px; background: currentColor; height: 4px; opacity: .5; transition: height .25s ease, opacity .25s ease; }
.bgm-toggle.on .bgm-eq i { height: 13px; opacity: 1; animation: eqJump .8s ease-in-out infinite; transform-origin: bottom; }
.bgm-toggle.on .bgm-eq i:nth-child(2) { animation-delay: .2s; }
.bgm-toggle.on .bgm-eq i:nth-child(3) { animation-delay: .4s; }
@keyframes eqJump { 0%, 100% { transform: scaleY(.3); } 50% { transform: scaleY(1); } }
.bgm-toggle.err { color: var(--ink-faint); }

/* ============================================================
   用户手册页（usage.html → User Manual）
   胡萝卜橙主题限定在 .manual 容器内，不污染全站鼠尾草绿。
   排版/配色沿用独立手册文件（DeskBud 豁牙小兔用户手册），
   经老曹确认直接上站。
   ============================================================ */
.manual {
  --carrot: #ff8c42;
  --carrot-d: #e8722b;
  --m-ink: #2b2b2b;
  --m-sub: #6b6b6b;
  --m-line: #ffe2c8;
  --m-soft: #fff1e6;
  max-width: 840px; margin: 0 auto; padding: 4px 0 40px;
  color: var(--m-ink);
  font-family: "PingFang SC", "Microsoft YaHei", system-ui, -apple-system, "Segoe UI", Roboto, sans-serif;
  line-height: 1.7; font-size: 15px;
}
/* 平台标签条 */
.manual-tabs {
  display: flex; gap: 8px; flex-wrap: wrap;
  margin: 0 0 18px;
}
.manual-tabs button {
  appearance: none; cursor: pointer; border: 1px solid var(--m-line);
  background: #fff; color: var(--carrot-d);
  font-size: 15px; font-weight: 600;
  padding: 8px 20px; border-radius: 999px;
  transition: background .15s, color .15s, border-color .15s, transform .15s;
  font-family: inherit;
}
.manual-tabs button:hover { transform: translateY(-1px); }
.manual-tabs button.on {
  background: linear-gradient(135deg, var(--carrot), var(--carrot-d));
  color: #fff; border-color: transparent;
  box-shadow: 0 4px 14px rgba(255, 140, 66, .28);
}
/* 面板容器 */
.manual-panel { display: none; }
.manual-panel.on { display: block; }
/* 原版手册整页嵌入（iframe，高度由 site.js 按内容自适应） */
.manual-frame {
  display: block; width: 100%; min-height: 600px;
  border: 0; border-radius: 16px; background: #fff6ec;
  box-shadow: 0 2px 14px rgba(255, 140, 66, .08);
}
/* 语言块：默认中文；JS 按 __lang 显隐 */
.manual [data-manual-lang] { display: none; }
.manual [data-manual-lang].on { display: block; }
/* 顶部品牌卡 */
.manual-hero {
  background: linear-gradient(135deg, #fff1e6, #ffe0c2);
  border: 1px solid var(--m-line); border-radius: 18px;
  padding: 24px 28px; margin-bottom: 20px;
}
.manual-hero h1 { margin: 0 0 6px; font-size: 25px; color: var(--carrot-d); }
.manual-hero p { margin: 4px 0; color: var(--m-sub); }
.manual-tag {
  display: inline-block; background: #fff; border: 1px solid var(--m-line);
  color: var(--carrot-d); border-radius: 999px;
  padding: 2px 12px; font-size: 13px; margin-right: 8px;
}
.manual h2 {
  font-size: 19px; margin: 28px 0 8px;
  padding-left: 12px; border-left: 5px solid var(--carrot);
  color: var(--m-ink);
}
.manual h3 { font-size: 15px; margin: 16px 0 4px; color: var(--carrot-d); }
.manual-card {
  background: #fff; border: 1px solid var(--m-line); border-radius: 14px;
  padding: 14px 20px; margin: 10px 0;
  box-shadow: 0 2px 10px rgba(255, 140, 66, .06);
}
.manual-card p { margin: 8px 0; }
.manual-card ul, .manual-card ol { padding-left: 22px; margin: 6px 0; }
.manual-card li { margin: 5px 0; }
.manual code {
  background: var(--m-soft); border: 1px solid var(--m-line); border-radius: 6px;
  padding: 1px 6px; font-family: Consolas, Menlo, monospace;
  font-size: 13px; color: var(--carrot-d);
}
.manual table { width: 100%; border-collapse: collapse; margin: 8px 0; font-size: 14px; }
.manual th, .manual td { border: 1px solid var(--m-line); padding: 6px 10px; text-align: left; vertical-align: top; }
.manual th { background: var(--m-soft); color: var(--carrot-d); }
.manual-warn {
  background: #fff6e9; border: 1px solid #ffd29a; border-left: 5px solid var(--carrot);
  border-radius: 10px; padding: 10px 14px; margin: 10px 0;
}
.manual-note { color: var(--m-sub); font-size: 13px; }
.manual a { color: var(--carrot-d); }
.manual-foot {
  margin-top: 32px; padding-top: 14px; border-top: 1px dashed var(--m-line);
  color: var(--m-sub); font-size: 13px; text-align: center;
}
@media (max-width: 620px) {
  .manual { font-size: 14px; }
  .manual-hero { padding: 18px 18px; }
  .manual-hero h1 { font-size: 21px; }
  .manual-tabs button { padding: 7px 14px; font-size: 14px; }
}

.empty { text-align: center; color: var(--ink-faint); padding: 60px 0; }

/* ---------- 网页宠物说话气泡（webmeji 点击/抚摸触发） ---------- */
.wm-bubble {
  position: fixed;
  z-index: 10000;
  max-width: 220px;
  min-width: 60px;
  pointer-events: none;
  animation: none !important;
  opacity: 1;
  transform: translateX(-50%) translateY(-100%);
  transition: opacity 0.4s ease, transform 0.4s ease;
}
.wm-bubble .wm-bbl {
  display: inline-block;
  padding: 6px 10px;
  background: rgba(255, 255, 255, 0.96);
  color: #2E7D32;               /* 对齐 Kotlin PetBubble ⑪：深绿字（亮底方案） */
  font-family: var(--font-bubble);
  font-size: 13px;
  font-weight: 500;
  line-height: 1.2;             /* 对齐 Kotlin：1.2 行距（一句一行排版） */
  text-align: center;
  border: none;                 /* 对齐 Kotlin 定稿：去边框 */
  border-radius: 10px;          /* 对齐 Kotlin ⑫：圆角收紧 18→10 */
  box-shadow: 0 2px 8px rgba(0, 0, 0, 0.10);  /* 网页保留极淡阴影（分离度，老曹拍板方案 2） */
  white-space: pre-line;        /* 标点换行符生效（一句一行） */
  word-break: break-word;
  text-shadow: none;
  position: relative;
}
.wm-bubble .wm-bbl::after {
  content: "";
  position: absolute;
  bottom: -6px;
  left: 50%;
  transform: translateX(-50%);
  width: 0;
  height: 0;
  border: 6px solid transparent;
  border-top-color: rgba(255, 255, 255, 0.96);
  border-bottom-width: 0;
}
.wm-bubble-out {
  opacity: 0;
  transform: translateX(-50%) translateY(calc(-100% - 6px));
}

/* ===== 伙伴之家（pets）卡片体系 —— 从 pets.html 页内样式迁入：软导航只换 #view，页内 <style> 不会生效 ===== */
.pets-lead { max-width: 640px; }
.pets-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(300px, 1fr)); gap: 22px; margin-top: 26px; }
.pet-card { background: var(--surface); border: 1px solid var(--line); border-radius: var(--radius); box-shadow: var(--shadow); overflow: hidden; display: flex; flex-direction: column; transition: transform .18s ease, box-shadow .18s ease; }
.pet-card:hover { transform: translateY(-4px); box-shadow: var(--shadow-hover); }
.pet-card.is-soon { opacity: .78; }
.pet-cover { position: relative; height: 210px; display: flex; align-items: center; justify-content: center; background: linear-gradient(160deg, var(--brand-soft), var(--accent-soft)); }
.pet-cover img { max-width: 72%; max-height: 88%; object-fit: contain; }
.pet-cover .pet-emoji { font-size: 84px; filter: saturate(.9); }
.pet-badge { position: absolute; top: 12px; left: 12px; font-size: 12px; padding: 4px 10px; border-radius: 999px; background: var(--brand); color: #fff; letter-spacing: .5px; }
.pet-badge.soon { background: var(--accent); }
.pet-body { padding: 16px 18px 18px; display: flex; flex-direction: column; gap: 10px; flex: 1; }
.pet-name { font-size: 19px; font-weight: 700; color: var(--ink); margin: 0; }
.pet-tagline { font-size: 14px; color: var(--ink-soft); line-height: 1.65; margin: 0; flex: 1; }
.pet-actions { display: flex; gap: 10px; flex-wrap: wrap; margin-top: 4px; }
.pet-actions .btn { font-size: 14px; padding: 8px 16px; border-radius: var(--radius-sm); }
.pet-soon-note { font-size: 13px; color: var(--ink-faint); }
.pets-note { margin-top: 30px; font-size: 13px; color: var(--ink-faint); text-align: center; }
.pets-channels { margin-top: 10px; font-size: 13px; color: var(--ink-soft); text-align: center; }
.pets-channels a { color: var(--brand); text-decoration: none; font-weight: 600; }
.pets-channels a:hover { text-decoration: underline; }

/* ---------- 伙伴页 buddies.html（2026-09-10 二轮改版：选择墙+姿态小窗+视频大窗，老曹拍板） ---------- */
/* 布局：手机竖屏=选择墙在上→姿态小窗→视频大窗；≥641px=选择墙左竖排+姿态小窗右 */
.buddies-wrap { max-width: 640px; margin: 0 auto; padding: 22px 14px 44px; display: flex; flex-direction: column; gap: 16px; }
.buddy-top { display: flex; flex-direction: column; gap: 16px; }
/* ① 宠物选择墙：纯图方块（idle 动图），横排自动换行——宠物多就多排几行，不铺长标签 */
.buddy-wall { display: flex; flex-wrap: wrap; gap: 10px; }
.buddy-tile {
  width: 64px; height: 64px; padding: 6px; cursor: pointer; font: inherit;
  display: flex; align-items: center; justify-content: center;
  background: #fffdf8; border: 1.5px solid transparent; border-radius: 16px;
  box-shadow: 0 2px 10px rgba(120, 80, 40, .06);
  transition: transform .18s ease, box-shadow .18s ease, border-color .18s ease, background .18s ease;
}
.buddy-tile:hover { transform: translateY(-2px); box-shadow: 0 8px 22px rgba(232, 114, 43, .14); }
.buddy-tile.on { border-color: var(--brand); box-shadow: 0 6px 18px rgba(232, 114, 43, .18); background: linear-gradient(180deg, #fff, #fff7ef); }
.buddy-tile img { width: 100%; height: 100%; object-fit: contain; -webkit-user-drag: none; user-select: none; }
/* ② 姿态动画小窗：聚合姿态动图（素材库 all.webp）+ 名字 + 购买入口 */
.buddy-card .showcase-badge { display: inline-flex; }
.buddy-anim-card { display: flex; flex-direction: column; align-items: center; }
.buddy-anim-stage { width: 200px; aspect-ratio: 1 / 1; display: flex; align-items: center; justify-content: center; }
.buddy-anim-stage img { max-width: 100%; max-height: 100%; object-fit: contain; -webkit-user-drag: none; user-select: none; }
.buddy-anim-meta { text-align: center; margin-top: 6px; }
.buddy-anim-meta b { display: block; font-size: 16px; color: var(--ink); }
.buddy-buy { margin-top: 10px; min-height: 40px; display: flex; align-items: center; justify-content: center; }
.buddy-buy .buy-chans { display: none; } /* 伙伴页保持极简，渠道尾巴只在首页详情区展示 */
.buddy-buy .btn { display: inline-block; padding: 10px 22px; border-radius: 999px; background: var(--brand); color: #fff; text-decoration: none; font-weight: 600; box-shadow: 0 6px 18px rgba(232, 114, 43, .28); }
.buddy-buy .btn:hover { transform: translateY(-2px); }
.buddy-buy .hd-soon { display: inline-block; padding: 9px 20px; border-radius: 999px; background: #fff; border: 1.5px dashed rgba(232, 114, 43, .45); color: var(--ink-soft); font-size: 13.5px; }
/* 视频窗与标签间距（卡片非 flex，需显式 margin） */
.buddy-card .video-tabs { margin-top: 14px; }
/* ③ 宣传视频大窗：复用首页 .video-stage（高 400，横竖屏视频都 contain 兼容）+ .video-tabs 三平台标签 */
@media (min-width: 641px) {
  /* 2026-09-10 四轮：选择墙 3 列网格（宠物多了成排铺），姿态卡收窄贴合内容不拉伸 */
  .buddy-top { flex-direction: row; align-items: flex-start; }
  .buddy-wall { display: grid; grid-template-columns: repeat(3, 64px); gap: 10px; flex: 0 0 auto; }
  .buddy-anim-card { flex: 0 0 auto; }
}


/* ---------- App 内嵌模式（2026-09-10：buddies.html?embed=1，kotlin WebView 实测反馈） ---------- */
/* App 上方已有「伙伴商店」标题，网页自带顶栏/搜索/BGM/页脚全隐藏，只留选择墙+购买+视频 */
html.embed-mode .topbar, html.embed-mode .footer, html.embed-mode .top-search,
html.embed-mode .announce-bar, html.embed-mode .quote-bar { display: none !important; }
html.embed-mode .buddies-wrap { padding: 12px 14px 24px; }

/* 导航下载入口改 ↓ 粗体图标（2026-09-10 老曹拍板：中英文通吃省地方，一眼可识） */
/* 2026-09-11 老曹：导航「下载」加文字并突出为 CTA 胶囊 */
.nav .nav-dl {
  display: inline-flex;
  align-items: center;
  gap: 5px;
  padding: 6px 13px;
  margin-left: 2px;
  background: var(--brand);
  color: #fff;
  font-weight: 600;
  border-radius: 999px;
  box-shadow: 0 2px 8px rgba(232,114,43,.28);
  transition: transform .12s ease, box-shadow .15s, background .15s;
}
.nav .nav-dl .nav-dl-txt { line-height: 1; }
.nav .nav-dl .ic { width: 16px; height: 16px; display: block; }
.nav .nav-dl:hover { color: #fff; background: var(--brand-ink); transform: translateY(-1px); box-shadow: 0 4px 12px rgba(232,114,43,.36); }
.nav .nav-dl.active { color: #fff; background: var(--brand-ink); }
.nav .nav-dl.active::after { display: none; } /* 胶囊不落下划线装饰，避免错位 */

/* ---------- 宠物右键菜单（2026-09-10 专注模式入口） ---------- */
#wm-deskbud-menu {
  position: fixed; z-index: 99999; display: none; flex-direction: column;
  background: #fff; border-radius: 12px; padding: 6px; min-width: 148px;
  box-shadow: 0 10px 30px rgba(120, 80, 40, .18), 0 2px 8px rgba(120, 80, 40, .10);
  border: 1px solid rgba(232, 114, 43, .18);
}
#wm-deskbud-menu button {
  display: flex; align-items: center; gap: 8px; width: 100%;
  border: none; background: transparent; padding: 9px 12px; border-radius: 8px;
  font: inherit; font-size: 13.5px; color: var(--ink); cursor: pointer; text-align: left;
}
#wm-deskbud-menu button:hover { background: #fff3e8; color: var(--brand-ink); }
#wm-deskbud-menu .wm-mi-check { visibility: hidden; color: var(--brand); font-weight: 700; }
#wm-deskbud-menu button[aria-checked="true"] .wm-mi-check { visibility: visible; }

/* ---------- 下载页 download.html（2026-09-10） ---------- */
.dl-wrap { max-width: 900px; margin: 0 auto; padding: 48px 20px 60px; text-align: center; }
.dl-title { font-size: 30px; margin: 0 0 8px; }
.dl-sub { color: var(--ink-soft); font-size: 14.5px; margin: 0 0 32px; }
.dl-grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 18px; }
@media (max-width: 680px) { .dl-grid { grid-template-columns: minmax(0, 1fr); } }
.dl-card {
  background: linear-gradient(180deg, #fffef9 0%, #fbf2df 100%);
  border-radius: 22px; padding: 28px 20px 22px;
  box-shadow: 0 14px 34px rgba(190, 120, 60, .12), 0 4px 12px rgba(120, 80, 40, .06);
  display: flex; flex-direction: column; align-items: center; gap: 8px;
  transition: transform .18s ease, box-shadow .18s ease;
}
.dl-card:hover { transform: translateY(-4px); box-shadow: 0 20px 44px rgba(190, 120, 60, .18), 0 6px 16px rgba(120, 80, 40, .08); }
.dl-icon { font-size: 40px; line-height: 1; }
.dl-name { font-size: 17px; color: var(--ink); }
.dl-desc { font-size: 12.5px; color: var(--ink-faint); }
.dl-action { margin-top: 12px; min-height: 42px; display: flex; align-items: center; }
.dl-action .btn { display: inline-block; padding: 11px 26px; border-radius: 999px; background: var(--brand); color: #fff; text-decoration: none; font-weight: 600; box-shadow: 0 6px 18px rgba(232, 114, 43, .28); }
.dl-action .btn:hover { transform: translateY(-2px); }
.dl-action .hd-soon { display: inline-block; padding: 10px 18px; border-radius: 999px; background: #fff; border: 1.5px dashed rgba(232, 114, 43, .45); color: var(--ink-soft); font-size: 13px; }
/* 隐私声明结尾彩蛋句（2026-09-10 老曹定稿） */
.pv-tip { margin-top: 14px; padding: 10px 14px; background: #fff3e8; border-radius: 10px;
          color: var(--brand-ink); font-size: 13.5px; }

/* 首页选择卡勾选框适配（09-11）：卡片是横排 flex，勾选框定位右上角；overflow 放开以免裁掉 */
.pick-card .buddy-check { top: 8px; right: 10px; }
.pick-card.owned { opacity: .82; }

/* ---------- 伙伴页多选（2026-09-11）：方块勾选框 + 底部浮条 ---------- */
.buddy-tile { position: relative; }
.buddy-check {
  position: absolute; top: 6px; right: 6px; z-index: 2;
  min-width: 20px; height: 20px; padding: 0 6px; border-radius: 999px;
  background: rgba(255,255,255,.92); border: 1.5px solid rgba(232,114,43,.5);
  color: #e8722b; font-size: 12px; font-weight: 700; line-height: 17px;
  display: flex; align-items: center; justify-content: center;
  cursor: pointer; transition: background .15s, color .15s, transform .15s;
}
.buddy-check:hover { transform: scale(1.12); }
.buddy-check.on { background: var(--brand); border-color: var(--brand); color: #fff; }
.buddy-tile.owned .buddy-check, .pick-card.owned .buddy-check {
  background: rgba(240,240,238,.95); border-color: rgba(0,0,0,.08);
  color: var(--ink-faint); font-weight: 500; cursor: default;
}
.buddy-tile.owned .buddy-check:hover { transform: none; }


/* 已选数量小字提示（09-11：按钮紧贴姿态窗口/详情区，勾选≥2 时提示） */
.buy-tip { flex-basis: 100%; display: block; font-size: 12.5px; color: var(--brand-ink); margin-bottom: 6px; text-align: center; }
.buddy-buy { display: flex; flex-wrap: wrap; justify-content: center; align-items: center; gap: 4px; }

/* 下载页提示行 + 下载按钮(button 与 a 同款)（09-11） */
.dl-tip { min-height: 20px; margin: 14px 0 0; font-size: 13px; color: var(--brand-ink); }
.dl-action .btn { border: none; cursor: pointer; font-family: inherit; font-size: 14.5px; }
.dl-action .btn[disabled] { opacity: .6; cursor: default; transform: none; }

/* 下载页：简介区 + 用户手册（09-11 老曹定稿文案） */
.dl-intro { max-width: 760px; margin: 40px auto 0; text-align: left; }
.dl-h2 { font-size: 20px; margin: 0 0 12px; text-align: center; }
.dl-intro-p { font-size: 14.5px; line-height: 1.85; color: var(--ink-soft); margin: 0 0 14px; }
.dl-feats { margin: 0; padding-left: 4px; list-style: none; display: grid; gap: 8px; }
.dl-feats li { position: relative; padding-left: 22px; font-size: 14px; color: var(--ink); }
.dl-feats li::before { content: "🐾"; position: absolute; left: 0; top: 0; font-size: 13px; }
.dl-manual { max-width: 980px; margin: 44px auto 0; display: flex; flex-direction: column; gap: 14px; }
.dl-manual .hm-head { display: flex; align-items: center; justify-content: space-between; flex-wrap: wrap; gap: 10px; }
.dl-manual-frame { width: 100%; border: 1px solid var(--line); border-radius: var(--radius); background: #fff; min-height: 420px; }
@media (max-width: 680px) { .dl-manual-frame { min-height: 360px; } .dl-manual { margin-top: 32px; } }

/* 全站宣传语条（09-11 老曹：照语录条 quote-bar 的观感——**一次屏上只有一条**、源源不断，滑完下一条接力）
   双轨接力（同语录条做法，复用 quoteScroll 关键帧：右屏外 100vw → 左屏外 -100vw，8%/92% 淡入淡出）：
   两条错开半周期 → 屏上任何时刻至多一条可见、且无空档。背景透明、hover 暂停。 */
.slogan-bar {
  position: relative;
  overflow: hidden;
  background: transparent;
  color: var(--brand);      /* 与导航 active / 诗句高亮同款亮橙 #e8722b（老曹 09-11：原先用 --brand-ink 偏暗） */
  --slogan-dur: 28s;        /* 一条从右滑到左的周期（老曹：慢悠悠滑过去；16s 偏快） */
  height: 31px;
}
.slogan-track { position: relative; height: 100%; }
.slogan-item {
  position: absolute;
  left: 0; top: 0; height: 100%;
  display: flex; align-items: center;
  white-space: nowrap;
  font-size: 13px;
  letter-spacing: .3px;
  animation: quoteScroll var(--slogan-dur) linear infinite;
  will-change: transform, opacity;
}
.slogan-item:nth-of-type(1) { animation-delay: calc(var(--slogan-dur) * -0.15); }  /* 刷新即从右侧可见区起步，不等 */
.slogan-item:nth-of-type(2) { animation-delay: calc(var(--slogan-dur) * -0.65); }  /* 错开半周期做接力 */
.slogan-bar:hover .slogan-item { animation-play-state: paused; }
html.embed-mode .slogan-bar { display: none !important; }
@media (max-width: 680px) { .slogan-bar { height: 29px; } .slogan-item { font-size: 12px; } }